ContextMenu from @prepared911/ui/context-menu is a Radix Context Menu opened by secondary-click or the platform context-menu key. The primitive handles menu semantics, focus trap, and keyboard flow; your job is to ensure every action is also reachable through a visible, focusable path.
What the component handles
Menu semantics. Open surface exposes role="menu"; items expose role="menuitem", menuitemcheckbox, or menuitemradio.
Focus management. Focus moves to the menu on open and returns to the trigger on close.
Keyboard flow. Arrow keys navigate items; Escape closes; type-ahead jumps to items by first letter.
Submenu handling. Submenus open on arrow-right and on hover with safe pointer tolerance.
What you must provide
A visible path to the same actions. Context menus are power-user shortcuts; every action inside must also live on a toolbar, button, or primary menu. Never gate actions behind context-menu-only access.
Discoverable keyboard entry. On macOS, pair the right-click target with Ctrl+click or a dedicated keyboard shortcut (Shift+F10); on Windows, rely on the context-menu key. Document the shortcut where relevant.
Accessible item names. Each item needs a readable name—avoid icon-only items unless the surrounding context is clear and aria-label is set.
Keyboard behavior
Shift+F10 (or the context-menu key) opens the menu for the focused element.
Arrow Up / Down move between items.
Arrow Right opens a submenu; Arrow Left returns to the parent menu.
Enter / Space activate; Escape closes.
Type-ahead jumps to items whose label starts with the typed character.
When sortable is enabled:
Space or Enter on the drag handle (or row): Grab for keyboard reorder; drop when finished
Arrow Up / Arrow Down: Move the grabbed item
Escape: Cancel reorder and restore the previous order
Live region announcements describe grab, move, drop, and cancel.
Semantics and roles
role="menu" on the content panel.
Items expose role="menuitem", menuitemcheckbox, or menuitemradio with aria-checked where applicable.
Separators use role="separator".
Known caveats
Touch discoverability. Long-press for context menu is not universal. Always provide a visible button or overflow menu on touch-dominant surfaces.
Destructive items. Guard destructive items with a clear label and tone (color and icon)—Radix does not enforce a confirm step.