Components
Menu

Menu

An accessible dropdown and context menu that is used to display a list of actions or options that a user can choose.

API Reference

Root

PropTypeDefault
anchorPoint
Point
aria-label
string
closeOnSelect
boolean
dir
'ltr' | 'rtl'
"ltr"
getRootNode
() => ShadowRoot | Node | Document
highlightedId
string
id
string
ids
Partial<{ trigger: string contextTrigger: string content: string label(id: string): string group(id: string): string positioner: string arrow: string }>
isOpen
boolean
loop
boolean
onFocusOutside
(event: FocusOutsideEvent) => void
onInteractOutside
(event: InteractOutsideEvent) => void
onOpenChange
(details: OpenChangeDetails) => void
onPointerDownOutside
(event: PointerDownOutsideEvent) => void
onSelect
(details: SelectionDetails) => void
onValueChange
(details: ValueChangeDetails) => void
positioning
PositioningOptions
value
Record<string, string | string[]>

Item

PropTypeDefault
id
string
asChild
boolean
closeOnSelect
boolean
disabled
boolean
valueText
string

Arrow

PropTypeDefault
asChild
boolean

Content

PropTypeDefault
asChild
boolean
lazyMount
boolean
false
onExitComplete
() => void
present
boolean
unmountOnExit
boolean
false

Trigger

PropTypeDefault
asChild
boolean

ArrowTip

PropTypeDefault
asChild
boolean

ItemGroup

PropTypeDefault
id
string
asChild
boolean

Separator

PropTypeDefault
asChild
boolean

OptionItem

PropTypeDefault
name
string
type
'checkbox' | 'radio'
value
string
asChild
boolean
closeOnSelect
boolean
disabled
boolean
id
string
onCheckedChange
(checked: boolean) => void
valueText
string

Positioner

PropTypeDefault
asChild
boolean

TriggerItem

PropTypeDefault
asChild
boolean

ContextTrigger

PropTypeDefault
asChild
boolean

ItemGroupLabel

PropTypeDefault
htmlFor
string
asChild
boolean