Class: Heading

Name

Type

Description

content

string

Content for the heading.

customClasses

Array

An array of additional classes for the heading.

id

string

Id for the heading, auto generated if not passed.

rendered

boolean

Is this heading already rendered in the dom, eg by php?

renderOnInit

boolean

Render the heading on init of the class?

size

string

Size string, check storybook for available ones.

spacing

string

The spacing classes to apply to the component.

tagName

string

Tag for the heading, h1 if not passed.

target

string

The target to render to. Any valid css selector string.

targetPosition

string

The insert position for the target.

weight

string

The font weight for the text.

import Heading from '@gravityforms/components/html/admin/elements/Heading'; function Example() { const headingInstance = new Heading( { content: 'This is a heading', rendered: false, renderOnInit: true, tagName: 'h2', target: '#example-target', } ); }

Methods

(static) headingTemplate(options) → {string}

Generates the markup for a Heading Element in the admin.

Parameters:

Name Type Description

options

object

The options for the heading component.

Properties

Name	Type	Description
`content`	string	Content for the heading.
`customClasses`	Array	An array of additional classes for the heading.
`id`	string	Id for the heading, auto generated if not passed.
`size`	string	Size string, check storybook for available ones.
`spacing`	string	Spacing for the component.
`tagName`	string	Tag for the heading, h1 if not passed.
`weight`	string	The font weight for the heading, regular, semibold or bold.

Returns:

Type:: string

Example

import { headingTemplate } from '@gravityforms/components/html/admin/elements/Heading';

function Example() {
     const headingTemplateHTML = headingTemplateTemplate( options );
     document.body.insertAdjacentHTML( 'beforeend', headingTemplateHTML );
}

new Heading(options) → {Class}

A text component.

Parameters:

Name Type Description

options

object

Component options.

Properties

Name	Type	Description
`content`	string	The content for the text. Can contain html.
`customClasses`	string \| Array \| object	Custom classes to apply to the text.
`id`	string \| Array \| object	The id for the text div, auto genned if not supplied.
`rendered`	string	Is the component already rendered in the dom, eg by php?
`renderOnInit`	string	Render the component on init of the class?
`size`	string	Size string, check storybook for available ones.
`spacing`	string \| number \| Array \| object	The spacing classes to apply.
`tagName`	string	The tag used for the container element.
`target`	string	The target to render to. Any valid css selector string.
`targetPosition`	string	The insert position for the component relative to the target.
`weight`	string	The font weight for the text.

Since: 2.2.0
Source: elements/Text/index.js, line 51

Returns:

The text class instance.

Type:: Class

Example

import Text from '@gravityforms/components/html/admin/elements/Text';

function Example() {
     const labelInstance = new Text( {
         content: 'Text content',
         tagName: 'div',
         weight: 'regular',
         target: '#example-target',
     } );
}

Methods

(static) headingTemplate(options) → {string}

Generates the markup for a Heading Element in the admin.

Parameters:

Name Type Description

options

object

The options for the heading component.

Properties

Name	Type	Description
`content`	string	Content for the heading.
`customClasses`	Array	An array of additional classes for the heading.
`id`	string	Id for the heading, auto generated if not passed.
`size`	string	Size string, check storybook for available ones.
`spacing`	string	Spacing for the component.
`tagName`	string	Tag for the heading, h1 if not passed.
`weight`	string	The font weight for the heading, regular, semibold or bold.

Since: 2.2.0
Source: elements/Heading/index.js, line 3

Returns:

Type:: string

Example

import { headingTemplate } from '@gravityforms/components/html/admin/elements/Heading';

function Example() {
     const headingTemplateHTML = headingTemplateTemplate( options );
     document.body.insertAdjacentHTML( 'beforeend', headingTemplateHTML );
}