Context menu

Right-click (or long-press) menu for in-place actions on a region or object. Same item patterns as Menu.

Examples

Basic

Right-click here

Checkbox, radio, submenu

Right-click for options

Overview

Context menu opens from a trigger surface instead of a button. Compose portal, positioner, and popup the same way as Menu. Prefer Menu when the entry point is an explicit control.

tsx

import {
  ContextMenu,
  ContextMenuTrigger,
  ContextMenuPortal,
  ContextMenuPositioner,
  ContextMenuPopup,
  ContextMenuItem,
  ContextMenuSeparator,
} from "@standard-ui/react"

<ContextMenu>
  <ContextMenuTrigger>Right-click here</ContextMenuTrigger>
  <ContextMenuPortal>
    <ContextMenuPositioner>
      <ContextMenuPopup>
        <ContextMenuItem>Copy</ContextMenuItem>
        <ContextMenuSeparator />
        <ContextMenuItem>Delete</ContextMenuItem>
      </ContextMenuPopup>
    </ContextMenuPositioner>
  </ContextMenuPortal>
</ContextMenu>

Usage

Trigger

Style the trigger as the interactive region (canvas, row, card). The menu opens on secondary click / context menu gesture.

tsx

<ContextMenuTrigger className="rounded-xl border border-dashed …">
  Right-click here
</ContextMenuTrigger>

Anatomy

tsx

ContextMenu
  ContextMenuTrigger
  ContextMenuPortal
    ContextMenuPositioner
      ContextMenuPopup
        ContextMenuItem
        ContextMenuSeparator

API

Parts mirror Base UI Context Menu and align with Menu.

Part	Role
ContextMenu	Root state and open control.
ContextMenuTrigger	Region that opens on context menu gesture.
ContextMenuPopup	Surface for items, groups, and separators.
ContextMenuItem	Action row that closes the menu by default.
ContextMenuSubmenuRoot	Nested menu with ContextMenuSubmenuTrigger.

Also exports checkbox, radio, group, and link item parts — same roles as Menu, prefixed with ContextMenu.

Guidelines

Do

Scope the trigger to the object the actions apply to
Mirror common OS actions (cut, copy) when they fit
Keep destructive actions separated at the bottom

Don't

Don't hide the only path to a primary action in a context menu
Don't use context menu for form value selection
Don't nest deep submenu trees on mobile surfaces