Context Menu
Displays a menu triggered by right-clicking an element.
Installation
dotnet add package Lumeo
One-time app setup (AddLumeo(), CSS & JS) is covered in the
installation guide.
Usage
@using Lumeo <ContextMenu />
When to Use
- Right-click actions on elements like files, cards, or table rows
- Custom context menus replacing the browser default for specific areas
- Element-specific operations such as copy, edit, delete, or move
Right click here
Right click here
Right click here
document.pdf
Right click for options
Right click here
ContextMenuShortcut right-aligns a keyboard hint; Variant=Destructive tints a dangerous action; Inset aligns label-only items beside icon items.
Mobile (rc.49). Context menus now open on a long-press (500 ms by default) on touch devices; use
LongPressMs to adjust the delay and MoveTolerancePx (default 10) to set how far a finger may drift before the press is cancelled.
Submenus
Nest menus with the ContextMenuSub /
ContextMenuSubTrigger /
ContextMenuSubContent
triplet. Submenus open on hover (with intent delay), and nesting is recursive so you can build deep
right-click trees.
Keyboard:
- ArrowRight on a
SubTriggeropens the submenu and focuses its first item. - ArrowLeft closes the current submenu and returns focus to the parent trigger.
- Escape closes the entire context menu, not just the current submenu.
- Type-ahead: with the menu open, start typing a label and focus jumps to the first matching item; keep typing to refine, or pause to reset the search buffer.
API Reference
ContextMenu
ContextMenuTrigger
ContextMenuContent
ContextMenuItem
ContextMenuShortcut
ContextMenuCheckboxItem
ContextMenuRadioGroup
ContextMenuRadioItem
ContextMenuLabel
ContextMenuSeparator
ContextMenuGroup
Related Components
- DropdownMenu — For action menus triggered by a click on a button or icon
- Menubar — For persistent application menu bars with multiple dropdown menus
- Popover — For displaying arbitrary content in a floating panel on click