Actions and display

Dropdown / Menu — a trigger button and a positioned menu list. Implements the WAI-ARIA menu-button pattern: trigger has `aria-haspopup="menu"` + `aria-expanded`; the list is `role="menu"` with `role="menuitem"` buttons under roving focus (ArrowUp/Down/Home/End), Enter/ Space to activate, Escape to close + refocus the trigger, and click-outside to dismiss. CSS-anchored via `placement` — no JS positioning dependency.

Public export

typescript

import { Menu } from '@happyvertical/smrt-ui/ui';

Import path: @happyvertical/smrt-ui/ui
Props: 8
Props described: 8 of 8
Bindable state: 0
Callback events: 1
Verified release: 0.57.40

Props

NameTypeRequiredDescription

labelstringNoTrigger button text (ignored when a `trigger` snippet is given).

triggerSnippetNoCustom trigger content.

triggerLabelstringNoAccessible name of the trigger button when it shows only an icon (`aria-label`); omit to use its visible content (an icon trigger then falls back to `label`).

variant'button' | 'icon'NoTrigger look: `button` (bordered, the default) or `icon`, a borderless 44px round icon button (a "more" or row-actions menu) that takes the surrounding text colour.

itemsMenuItem[]YesMenu items.

placementDropdownPlacementNoMenu placement relative to the trigger.

onselect(id: string) => voidNoFired with the activated item's id.

disabledbooleanNoDisable the trigger.

Bindable state

This component has no bindable public state.

Callback events

onselect(id: string) => void

Public export

Props

Bindable state

Callback events

Examples and explanation