Railbase
GPTClaude

Context Menu

A menu shown on right-click of an element.

Updated

Right-click area
<ContextMenu>
  <ContextMenuTrigger class="flex h-28 w-72 items-center justify-center rounded-md border border-dashed text-sm">
    Right-click here
  </ContextMenuTrigger>
  <ContextMenuContent>
    <ContextMenuItem>Back</ContextMenuItem>
    <ContextMenuItem>Forward</ContextMenuItem>
    <ContextMenuSeparator />
    <ContextMenuItem>Reload</ContextMenuItem>
  </ContextMenuContent>
</ContextMenu>

A menu shown on right-click of an element.

Installation

railbase ui add context-menu

Note

railbase ui add also copies shared primitives — they ship alongside this component automatically.

Usage

import { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem } from "@/lib/ui/context-menu";

<ContextMenu>
  <ContextMenuTrigger>Right-click here</ContextMenuTrigger>
  <ContextMenuContent>
    <ContextMenuItem>Back</ContextMenuItem>
    <ContextMenuItem>Reload</ContextMenuItem>
  </ContextMenuContent>
</ContextMenu>

Anatomy

Exported parts: ContextMenu · ContextMenuTrigger · ContextMenuContent · ContextMenuItem · ContextMenuCheckboxItem · ContextMenuRadioGroup · ContextMenuRadioItem · ContextMenuLabel · ContextMenuSeparator · ContextMenuShortcut · ContextMenuGroup · ContextMenuPortal · ContextMenuSubTriggerChevron

← PreviousCommandNext →Drawer