Label
A lightweight widget that renders a <label> HTML element. Use it to display static text, headings, or descriptive labels alongside other widgets in a Container. The displayed text is set via the text config and can be updated at any time.
const label = new Label({
text : 'Status: OK',
appendTo : document.body
});
// Update text at runtime
label.text = 'Status: Error';
Useful configs and properties
| Config | Description |
|---|---|
| text | The text content to display |
| html | Raw HTML content (inherited from Widget) |
| cls | CSS class(es) for custom styling |
| style | Inline styles |
See also
No results
Configs
Configs are options you supply in a configuration object when creating an instance of this class-
Get/set label text
Has a corresponding runtime text property.
Properties
Properties are getters/setters or publicly accessible variables on this class-
Identifies an object as an instance of Label class, or subclass thereof.
CSS variables
CSS variables that can be set to adjust appearance| Name | Description | |
|---|---|---|
| --b-label-above-width | Width of label when shown above the field. Defaults to 100% to fill the available space, but overridden in material since the label overlaps the field there. | |
| --b-label-font-size | Font-size | |
| --b-label-font-weight | Font-weight | |
| --b-label-width | Fixed label width, also applied to min-width to prevent shrinking when width is set. Can be set programmatically on a container or directly on a field using the `labelWidth ` config. When setting it programmatically, it also applies the `.b-has-label-width` class to allow text wrapping. | |
| Disabled | ||
| --b-label-disabled-color | Color when disabled | |