ContextMenu

Right-click to open a context menu. Use for list items, cards, or any area that needs secondary actions.

Right-click this card

Context menu will open

document.pdf

2.4 MB

Projects

Folder

Right-click anywhere in this block

How to use

Wrap content with ContextMenu and pass items. Right-click to open. Copy the examples below.

1. Import

tsx
import { ContextMenu, Card } from "@/app/components/ui";

2. Basic usage

tsx
<ContextMenu
  items={[
    { label: "Copy", onClick: () => {} },
    { label: "Rename", onClick: () => {} },
    { label: "Delete", variant: "danger", onClick: () => {} },
  ]}
>
  <Card className="cursor-context-menu">Right-click this card</Card>
</ContextMenu>