Context Menu

Right-click menus for power operations.

Installation

npm install @aspyn-io/kit @aspyn-io/tokens

import {
  ContextMenu,
  ContextMenuTrigger,
  ContextMenuContent,
  ContextMenuItem,
  ContextMenuSeparator,
} from "@aspyn-io/kit";

Route operations (right-click)

The dispatch pattern: right-click a route for bulk operations.

Right-click here

<ContextMenu>
  <ContextMenuTrigger className="…drop zone…">Right-click me</ContextMenuTrigger>
  <ContextMenuContent>
    <ContextMenuLabel>Route-2026-08-25A</ContextMenuLabel>
    <ContextMenuSeparator />
    <ContextMenuItem>Optimize route<ContextMenuShortcut>⌘O</ContextMenuShortcut></ContextMenuItem>
    <ContextMenuItem>Lock route</ContextMenuItem>
    <ContextMenuSub>
      <ContextMenuSubTrigger>Reassign to…</ContextMenuSubTrigger>
      <ContextMenuSubContent>
        <ContextMenuItem>Eric Gray</ContextMenuItem>
        <ContextMenuItem>Harun Omar</ContextMenuItem>
      </ContextMenuSubContent>
    </ContextMenuSub>
    <ContextMenuSeparator />
    <ContextMenuItem className="text-destructive">Delete route</ContextMenuItem>
  </ContextMenuContent>
</ContextMenu>

Notes

Same anatomy as DropdownMenu, opened by right-click / long-press instead of a button.
Always provide a visible alternative (kebab menu) — context menus aren't discoverable.