Context Menu

Right-click action menu.

Usage

Trigger is the right-click region, not a button — it wraps the content the menu acts on. Content portals to <body> and Bits positions it at the pointer, owning role="menu", roving focus and keyboard navigation.

Never the only route

Right-click is undiscoverable, and touch devices have no right-click at all. Every action offered here must also be reachable from a visible control.

That is not a nitpick — put "Delete" only in a context menu and a phone user simply cannot delete anything. Treat this as an accelerator for people who already know the action exists: pair it with a Dropdown Menu on a visible trigger, or with inline buttons on the row.

Shared with Dropdown Menu

Item, Group, Label and Separator are the same components Dropdown Menu uses. Bits re-exports identical menu internals under both namespaces, so one styled implementation serves each rather than two copies of the same CSS drifting apart.

They stay context-aware: Bits derives its data attributes from whichever Root wraps them, so the same wrapper emits data-context-menu-item here and data-dropdown-menu-item there. The class is sve-menu-item in both, which is what keeps the two menus looking identical.

Props

Root, Sub, SubTrigger, SubContent, CheckboxItem, RadioItem, RadioGroup and Arrow are re-exported from Bits unchanged.

ContextMenu.Root

Prop	Type	Default
`open` Bindable open state.	`boolean`	`false`
`onOpenChange` Called when the menu opens or closes.	`(open: boolean) => void`	—
`dir` Reading direction, which flips submenu placement.	`'ltr' \| 'rtl'`	`'ltr'`

ContextMenu.Trigger

Prop	Type	Default
`class` Extra classes merged onto the trigger region.	`string`	—

ContextMenu.Content

Prop	Type	Default
`class` Extra classes merged onto the menu panel.	`string`	—

ContextMenu.Item — shared with Dropdown Menu.

Prop	Type	Default
`class` Extra classes merged onto the item.	`string`	—