Menu Label
A non-interactive section header inside a nana-menu.
Preview
Section titled “Preview”<nana-menu style="max-width:220px">
<nana-menu-label>Section</nana-menu-label>
<nana-menu-item>Item</nana-menu-item>
</nana-menu>Installation
Section titled “Installation”npm install @nana-tec/ui-componentsImport
Section titled “Import”import "@nana-tec/ui-components/menu-label";Basic usage
Section titled “Basic usage”<nana-menu style="max-width:220px"> <nana-menu-label>Section</nana-menu-label> <nana-menu-item>Item</nana-menu-item></nana-menu>Properties
| Property | Attribute | Type | Default | Description |
|---|---|---|---|---|
divider | — | boolean | false | Draw a divider line above the label |
Slots
| Slot | Description |
|---|---|
(default) | Header text |
CSS parts
| Part | Description |
|---|---|
::part(base) | The header element |
| Slot | Description |
|---|---|
(default) | Header text |
CSS Parts
Section titled “CSS Parts”| Part | Description |
|---|---|
base | The header element |
Related components
Section titled “Related components”Storybook
Section titled “Storybook” Explore Menu Label interactively Every state, prop, and edge case — with live controls — in Storybook.
View in Storybook