Ravox KitOverlays
Context Menu
The right-click menu, at the cursor position. It also opens with Shift+F10 or the menu key (next to the focused element) and by long-pressing on touch; the ⋯ button (ContextMenuTrigger) opens the same menu for screen readers and for people who don't know about long press. Uses the same items as Menu: checkbox, single choice, submenu, shortcuts.
Botão direito num arquivo, toque longo ou ⋯ no celular, Shift+F10 no teclado
Settings
Toggles
Examples
Drawing board
Quadro · 100%
On any element (asChild)
Entrega prevista para 12 de outubro. O cliente pediu para ligar antes, no (11) 98765-4321.
Installation
The command creates components/ui/context-menu.tsx in your project and installs the theme with it. The file is yours: edit it as you like.
npx @ravox-ui/cli add context-menuProps
| Prop | Type | Default | Description |
|---|---|---|---|
| <ContextMenu open onOpenChange> | boolean / (open) => void | — | The root. Uncontrolled by default. |
| <ContextMenuArea asChild disabled> | boolean / boolean | — | The region that responds to right-click. Any focused element inside it opens the menu via keyboard. disabled gives the browser's menu back. |
| <ContextMenuTrigger aria-label> | ComponentProps<"button"> | — | ⋯ button ("More actions" by default) that opens the same menu right below it. Use it next to the target: with a screen reader on mobile, long press is not reliable. Focus returns to it on close. |
| <ContextMenuContent> | ComponentProps<"div"> | — | The menu box. Give it an aria-label (e.g. "File actions"): there is no button to name it. |
| <ContextMenuItem icon shortcut destructive onSelect> | ReactNode / string / boolean / (e) => void | — | Same as <DropdownMenuItem> (it is the same component). |
| CheckboxItem, RadioGroup, RadioItem, Group, Label, Separator, Sub… | — | — | The same as in Menu, with the ContextMenu prefix. Installs the menu along with it. |