Context Menu

A headless context menu primitive triggered by right-click with keyboard navigation and ARIA support.

Basic

A basic right-click context menu. Right-click the trigger area to open the menu with selectable items.
Right-click anywhere in this area

With Labels and Separators

Context menu with BbContextMenuLabel for grouping, BbContextMenuSeparator for visual dividers, and disabled items.
Right-click for grouped menu

Controlled

Control the context menu state externally using @bind-Open. The parent component manages the Open parameter and receives updates via OpenChanged.

Menu open: False

Right-click here (controlled)

Keyboard Navigation

  • Down Arrow - Move focus to the next menu item
  • Up Arrow - Move focus to the previous menu item
  • Home - Move focus to the first menu item
  • End - Move focus to the last menu item
  • Escape - Close the context menu

Data Attributes

Use these data attributes for CSS styling:

  • [data-state="open"] - When the context menu is open
  • [data-state="closed"] - When the context menu is closed
  • [data-disabled] - On disabled menu items
  • [data-highlighted] - On the currently focused menu item