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

Prop	Type	Default
anchorPoint	Point
aria-label	string
closeOnSelect	boolean
dir	'ltr' \| 'rtl'
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

Prop	Type	Default
id	string
asChild	boolean
closeOnSelect	boolean
disabled	boolean
valueText	string

Arrow

Prop	Type	Default
asChild	boolean

Content

Prop	Type	Default
asChild	boolean
lazyMount	boolean
onExitComplete	() => void
present	boolean
unmountOnExit	boolean

Trigger

Prop	Type	Default
asChild	boolean

ArrowTip

Prop	Type	Default
asChild	boolean

ItemGroup

Prop	Type	Default
id	string
asChild	boolean

Separator

Prop	Type	Default
asChild	boolean

OptionItem

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

Positioner

Prop	Type	Default
asChild	boolean

TriggerItem

Prop	Type	Default
asChild	boolean

ContextTrigger

Prop	Type	Default
asChild	boolean

ItemGroupLabel

Prop	Type	Default
htmlFor	string
asChild	boolean