Version v3 Documentation
You are viewing documentation for an older version.
View latest (v4) documentation →
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.
Loading example…
With Labels and Separators
Context menu with
BbContextMenuLabel for grouping, BbContextMenuSeparator for visual dividers, and disabled items.
Loading example…
Controlled
Control the context menu state externally using
@bind-Open. The parent component manages the Open parameter and receives updates via OpenChanged.
Loading example…
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