Reference Source
import {Shell} from '@adobe/coral-spectrum'
public class | source

ShellMenuBarItem

Expression Extends:

class ShellMenuBarItem extends BaseComponent(HTMLElement)

Mixin Extends:

HTMLElement, BaseComponent

A Shell MenuBar Item component

See:

Example:

Markup
<coral-shell-menubar-item></coral-shell-menubar-item>
JS constructor
new Coral.Shell.MenuBar.Item();

Static Member Summary

Static Public Members
public static

Returns ShellMenuBarItem icon variants.

Member Summary

Public Members
public

The notification badge content.

public

Whether the item opens a popup dialog or menu.

public

Specifies the icon name used inside the menu item.

public

Size of the icon.

public

The menubar item's iconVariant. See ShellMenuBarItemIconVariantEnum.

  • ShellMenuBarItemIconVariantEnum.DEFAULT by default.

public

id: *

public

The menubar item's label content zone.

  • content-zone

public

The menu that this menu item should show.

public

Whether the menu is open or not.

Static Public Members

public static iconVariant: ShellMenuBarItemIconVariantEnum: * source

Returns ShellMenuBarItem icon variants.

Public Members

public badge: String source

The notification badge content.

  • "" by default.

public hasPopup: String source

Whether the item opens a popup dialog or menu. Accepts either "menu", "listbox", "tree", "grid", or "dialog".

  • ShellMenuBarItemHasPopupRoleEnum.DEFAULT by default.

public icon: String source

Specifies the icon name used inside the menu item. See Icon for valid icon names.

  • "" by default.

public iconSize: String source

Size of the icon. It accepts both lower and upper case sizes. See ButtonIconSizeEnum.

  • ButtonIconSizeEnum.SMALL by default.
  • reflected

public iconVariant: String source

The menubar item's iconVariant. See ShellMenuBarItemIconVariantEnum.

  • ShellMenuBarItemIconVariantEnum.DEFAULT by default.

public id: * source

public label: ButtonLabel source

The menubar item's label content zone.

  • content-zone

public menu: HTMLElement | String source

The menu that this menu item should show. If a CSS selector is provided, the first matching element will be used.

  • null by default.

public open: Boolean source

Whether the menu is open or not.

  • false by default.
  • reflected

Emit:

coral-shell-menubar-item:open

coral-shell-menubar-item:close