Context Menu
A menu component that appears on right-click (or long press on touch devices). Perfect for contextual actions with full RTL support and keyboard navigation.
Preview
Installation
Terminalbash
Usage
Reacttsx
Examples
With Icons and Shortcuts
tsx
With Checkboxes
tsx
File Explorer Example
Props
ContextMenu
| Name | Type | Default | Description |
|---|---|---|---|
onOpenChange | (open: boolean) => void | undefined | Callback when open state changes |
This component is built on top of Radix UI's Context Menu primitive. For a complete list of props for each sub-component, refer to the Radix UI documentation.
Accessibility
Keyboard Navigation
SpaceOpens the menu when trigger is focusedEnterOpens the menu and activates the first item↓Moves focus to next menu item↑Moves focus to previous menu itemEscCloses the menu
Touch Devices
On touch devices, context menus can be triggered with a long press. The component handles this automatically, providing a consistent experience across devices.
ARIA Attributes
Radix UI automatically manages all ARIA attributes including roles, aria-expanded, and focus handling for screen reader compatibility.
RTL Considerations
Context menus automatically support RTL layout. Icons and shortcuts position correctly using logical properties (ms-auto, ps-, pe-).