ComponentsMenu
Menu
An accessible dropdown and context menu that is used to display a list of actions or options that a user can choose.
An accessible dropdown and context menu that is used to display a list of actions or options that a user can choose.
API reference docs for the component. Learn about the props, CSS, and other APIs of this exported module.
Point
The positioning point for the menu. Can be set by the context menu trigger or the button trigger.
string
The accessibility label for the menu
boolean
Whether to close the menu when an option is selected
'ltr' | 'rtl'
The document's text/writing direction.
() => ShadowRoot | Node | Document
A root node to correctly resolve document in custom environments. E.x.: Iframes, Electron.
string
The `id` of the active menu item.
string
The unique identifier of the machine.
Partial<{ trigger: string contextTrigger: string content: string label(id: string): string group(id: string): string positioner: string arrow: string }>
The ids of the elements in the menu. Useful for composition.
boolean
boolean
Whether to loop the keyboard navigation.
(event: FocusOutsideEvent) => void
Function called when the focus is moved outside the combobox
(event: InteractOutsideEvent) => void
Function called when an interaction happens outside the combobox
(details: OpenChangeDetails) => void
Function called when the menu opens or closes
(event: PointerDownOutsideEvent) => void
Function called when the pointer is pressed down outside the combobox
(details: SelectionDetails) => void
Function called when a menu item is selected.
(details: ValueChangeDetails) => void
Callback to be called when the menu values change (for radios and checkboxes).
PositioningOptions
The options used to dynamically position the menu
Record<string, string | string[]>
The values of radios and checkboxes in the menu.
string
The `id` of the menu item option.
boolean
Whether the menu should be closed when the option is selected.
boolean
Whether the menu item is disabled
string
The textual value of the option. Used in typeahead navigation of the menu. If not provided, the text content of the menu item will be used.
boolean
Whether to enable lazy mounting. Defaults to `false`.
() => void
boolean
boolean
Whether to unmount on exit. Defaults to `false`.
string
The `id` of the element that provides accessibility label to the option group
string
The option's name as specified in menu's `context.values` object
'checkbox' | 'radio'
Whether the option is a radio or a checkbox
string
The value of the option
boolean
Whether the menu should be closed when the option is selected.
boolean
Whether the menu item is disabled
string
The `id` of the menu item option.
(checked: boolean) => void
Function called when the option state is changed
string
The textual value of the option. Used in typeahead navigation of the menu. If not provided, the text content of the menu item will be used.
boolean
string