Skip to content
GitHub

Overlays

ContextMenu

The menu a right-click opens.

When to reach for it

Never as the only way to reach an action. Touch users, trackpad users and keyboard users may have no way to open it.

Examples

default

Right-click anywhere in this box

Notes

Radix ContextMenu root and trigger, as typed passthroughs.

Props

Takes no props of its own.

Parts

Composed at the call site rather than configured through props, so a layout this component did not anticipate is still expressible.

ContextMenuContent

The menu a right-click opens.

Never the only way to reach an action. A context menu is opened by a secondary pointer button or a keyboard's own menu key, and a meaningful share of readers have neither — a touch user, someone on a trackpad they have not configured, anyone driving the page by keyboard alone. Whatever is in here belongs somewhere reachable too: a row's overflow button, a toolbar.

Takes no props of its own.

ContextMenuItem

A row. Highlight follows data-highlighted, which covers hover and keyboard.

ContextMenuItem props
PropTypeDefaultDescription
destructivebooleanfalse
iconLucideIcon

Also accepts everything in ComponentProps<typeof ContextMenuPrimitive.Item>. Those are forwarded to the underlying element and are not listed row by row.

ContextMenuSeparator

Hairline divider between groups.

Takes no props of its own.

ContextMenuLabel

Mono eyebrow heading for a group.

Takes no props of its own.

Re-exports

ContextMenu = ContextMenuPrimitive.Root

Radix ContextMenu root and trigger, as typed passthroughs.

ContextMenuTrigger = ContextMenuPrimitive.Trigger

Keyboard

ContextMenu keyboard interactions
KeyDoes
ShiftF10Opens the menu from the keyboard, where the platform supports it.
Moves between items.
EscapeCloses it.