Menu button

A button that opens a menu.

Copy MRN Open in Query Delete asset

<mm-menu-button variant="ghost" icon="more-horiz" label="More actions" icon-only>
  <mm-menu>
    <mm-menu-item icon="content-copy">Copy MRN</mm-menu-item>
    <mm-menu-item icon="terminal">Open in Query</mm-menu-item>
    <mm-menu-separator></mm-menu-separator>
    <mm-menu-item icon="delete" danger value="delete">Delete asset</mm-menu-item>
  </mm-menu>
</mm-menu-button>

Guidance

A menu button opens a menu of secondary actions: the "More" button on an asset row or page header. The trigger is an mm-button with aria-haspopup="menu" and aria-expanded; the menu is a slotted mm-menu. Use an icon-only ghost button (icon="more-horiz" with label) for row actions, or a labelled button with a chevron where the menu needs naming.

Keyboard (https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/): Enter, Space and ArrowDown open the menu and focus its first item; ArrowUp opens it on the last item. Escape closes it and returns focus to the button.

Properties

Property	Attribute	Type	Default	Description
variant	variant	'primary' | 'secondary' | 'ghost'	'secondary'	Trigger variant: secondary (default), ghost or primary.
size	size	'md' | 'sm'	'md'	md (default) or sm.
icon	icon	string	''	Leading icon. With icon-only, the only thing shown.
label	label	string	''	The button text, or the accessible name and tooltip when icon-only. Defaults to "More actions".
iconOnly	icon-only	boolean	false	Shows only the icon; label becomes the accessible name.
disabled	disabled	boolean	false
placement	placement	Placement	'bottom-start'	Placement of the menu against the button.
open	open	boolean	false	Whether the menu is open.
menu		MmMenu | null		The slotted menu.

Methods

Method	Description
show()	Opens the menu and focuses its first (or last) item.

Slots

Slot	Description
Default	One mm-menu.

CSS parts

Part	Description
trigger	The mm-button trigger.
button	The trigger's native button, for joining it to other buttons.

Examples

Every state of mm-menu-button in Storybook, with keyboard and screen reader tests.