Components Menu

Menu Label

<wa-menu-label> Since 2.0 Stable

Menu labels are used to describe a group of menu items.

Fruits Apple Banana Orange Vegetables Broccoli Carrot Zucchini 
<wa-menu style="max-width: 200px;">
  <wa-menu-label>Fruits</wa-menu-label>
  <wa-menu-item value="apple">Apple</wa-menu-item>
  <wa-menu-item value="banana">Banana</wa-menu-item>
  <wa-menu-item value="orange">Orange</wa-menu-item>
  <wa-divider></wa-divider>
  <wa-menu-label>Vegetables</wa-menu-label>
  <wa-menu-item value="broccoli">Broccoli</wa-menu-item>
  <wa-menu-item value="carrot">Carrot</wa-menu-item>
  <wa-menu-item value="zucchini">Zucchini</wa-menu-item>
</wa-menu>

Slots

Learn more about using slots.

Name Description
(default) The menu label's content.

CSS parts

Learn more about CSS parts.

Name Description
base The component's base wrapper.

Importing

The autoloader is the recommended way to import components. If you prefer to do it manually, use one of the following code snippets.

CDN npm React

To manually import this component from the CDN, use the following code. 

import 'https://early.webawesome.com/[email protected]/dist/components/menu-label/menu-label.js';
Coming soon! Coming soon!
    No results