Home Docs Gallery Fiddle
versionCodeSandbox

Documentation

IntroConceptsWidgetsChartsExamples
General Purpose
ButtonUploadButtonSectionHeadingFlexBoxResizerIconProgressBarTextHighlightedSearchText
General Purpose
Collections
GridTree GridList
Collections
Form
TextFieldNumberFieldDateFieldLookupFieldCheckboxRadioSelectTextAreaDateTimeFieldCalendarMonthFieldMonthPickerColorFieldColorPickerSlidersSwitchesLabelsLabeledContainerFieldGroupValidationGroupValidator
Form
Navigation
MenuTabHScrollerLinkLinkButton
Navigation
Containers
PureContainerHtmlElementContentResolverIsolatedScopeDetachedScope
Containers
Overlays
OverlaysWindowsMsgBoxToastTooltipsFlyweight TooltipsContextMenuDropdown
Overlays
Report Edit

Heading

import {Heading} from 'cx/widgets';

The Heading widget renders a classic HTML heading (h1, h2, h3, ...) without any margin or padding. This is very convenient for window or section headers.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6
Index
<div>
    <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>
Copied!Cx Fiddle

Configuration

PropertyDescriptionType
level

Heading level. Allowed values go from 1 to 6. Default is 3.

number
autoFocus

Set to true to automatically focus the element when mounted.

boolean
baseClass

Base CSS class. Default is heading.

string
class
className

Additional CSS classes to be applied to the element. If an object is provided, all keys with a "truthy" value will be added to the CSS class list.

string/object
innerHtml
html

HTML to be injected into the element.

string
items
children

List of child elements.

array
layout

Define an inner layout.

string/object
mod

Appearance modifier. For example, mod="big" will add the CSS class .cxm-big to the block element.

string/array
outerLayout

Defines the outer layout which wraps the widget.

widget
plainText

Set to true to avoid converting inner strings to templates. Default is false.

boolean
preserveWhitespace
ws

Keep whitespace in text based children. Default is false. See also trimWhitespace.

boolean
putInto
contentFor

Used with outer layouts. Specifies the name of the content placeholder which should render the widget.

string
style

Style object applied to the wrapper div. Used for setting the dimensions of the element.

string/object
tag

Name of the HTML element to be rendered. Default is div.

string
text
innerText

Inner text contents.

string
tooltip

Tooltip configuration. For more info see Tooltips.

string/object
trimWhitespace

Remove all whitespace in text based children. Default is true. See also preserveWhitespace.

boolean
vdomKey

Key that will be used as the key when rendering the React component.

string
visible
if

Visibility of the widget. Defaults to true.

boolean