docs/components/context-menu
Sections
Components
Utilities
Forms
Hooks
Copy Markdown
A menu shown on right-click.
Context Menu is built on top of the Menu component. Check it out for more examples.
PreviewCode
Right click hereLong press here
CLIManual
pnpmbunnpmyarn
pnpm dlx shadcn@latest add @shark/context-menu
ContextMenu
├── ContextMenuTrigger
└── ContextMenuContent
├── ContextMenuGroup
├── ContextMenuItem
├── ContextMenuCheckboxItem
├── ContextMenuRadioGroup
│ └── ContextMenuRadioItem
├── ContextMenuSub
│ ├── ContextMenuSubTrigger
│ └── ContextMenuSubContent
├── ContextMenuSeparator
└── ContextMenuShortcut
import {
ContextMenu,
ContextMenuTrigger,
ContextMenuContent,
ContextMenuItemGroup,
ContextMenuItemGroupLabel,
ContextMenuItem,
} from "@/components/ui/context-menu";
<ContextMenu>
<ContextMenuTrigger>Right click here</ContextMenuTrigger>
<ContextMenuContent>
<ContextMenuItemGroup>
<ContextMenuItem value="action-1">Action 1</ContextMenuItem>
<ContextMenuItem value="action-2">Action 2</ContextMenuItem>
<ContextMenuItem value="action-3">Action 3</ContextMenuItem>
</ContextMenuItemGroup>
</ContextMenuContent>
</ContextMenu>
Trigger component for the context menu.
| Prop | Type | Default |
|---|---|---|
className | string | - |
asChild | boolean | false |
For a complete list of props, see the Menu API Reference.
[
Previous page
Command ](/docs/components/command)[
Next page
Data List ](/docs/components/data-list)
On This Page