Heading

import { Heading } from 'cx/widgets';

The Heading component renders heading elements (h1 through h6) with CxJS data binding support.

 <div className="flex flex-col items-start gap-1">
  <Heading level={1}>Heading 1</Heading>
  <Heading level={2}>Heading 2</Heading>
  <Heading level={3}>Heading 3</Heading>
  <Heading level={4}>Heading 4</Heading>
  <Heading level={5}>Heading 5</Heading>
  <Heading level={6}>Heading 6</Heading>
</div> 

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Configuration

Property	Type	Description
`level`	`number`	Heading level from 1 to 6. Default is `3`.
`text`	`string`	Text content of the heading. Supports data binding.
`baseClass`	`string`	Base CSS class. Default is `heading`.
`className`	`string`	Additional CSS class to apply.
`style`	`string \| object`	Additional styles to apply.