Properties
| Property | Type | Description |
|---|---|---|
text | React.Node | (optional) A heading, can be text or React.Node. |
children | React.Node | (optional) A heading, can be text or React.Node. |
size | xx-large x-large large medium basis small x-small | (optional) Define the typography font-size by a size type, e.g. x-large. Defaults to the predefined heading sizes. |
level | 1 2 3 4 5 6 | (optional) Overwrite the automated level handling to use a specific value to ensure correct level hierarchy. |
increase | boolean | (optional) If set to true, the heading level will be incremented by 1. |
decrease | boolean | (optional) If set to true, the heading level will be decremented by 1. |
inherit | boolean | (optional) If set to true, the heading last used level will be inherited. Also from inside a level context. |
reset | boolean number | (optional) If set to true, the heading level will be reset to 2. You can give it a custom level if you need to, e.g. reset(1). |
skip_correction | boolean | (optional) If set to true, the heading will not be corrected and warnings will not be shown. Warnings do not show up in production builds else either |
debug | boolean function | (optional) If set to true, the content will have a prefix, showing the heading level. |
debug_counter | boolean function | (optional) If set to true, the content will have both a prefix and a JSON log attached to both headings and level contexts. |
element | string React.Element | (optional) define what HTML element should be used. If you use, e.g. a span, then role="heading" and aria-level gets set. Defaults to semantic heading element. |
skeleton | boolean | (optional) If set to true, an overlaying skeleton with animation will be shown. |
Space | string object | (optional) Spacing properties like top or bottom are supported. |
Properties which do apply to the provider (level context) Heading.Level as well:
increasedecreaseinheritresetskip_correctiondebug