Context Menu

A context menu component triggered by right-click or long press. Provides a list of contextual actions for the selected target with full RTL support.

Loading demo: context-menu-real-world

Installation

npx sdaia-ui@latest add context-menu

import { ContextMenu } from "@/components/ui/context-menu"

<ContextMenu />

Use surface="glass" to enable Glass Effect.

Loading demo: conextmenu-glass

Context menu with a list of relevant actions. Right-click the target to trigger it.

Loading demo: contextmenu-default

Props for the ContextMenu component.

Prop	Type	Default	Required
items	ContextMenuItem[]	—	optional
className	string	—	optional

Props for the ContextMenu Item sub-component.

Prop	Type	Default	Required
label	string	-	optional
onClick	() => void	-	optional
disabled	boolean	false	optional
destructive	boolean	false	optional
leadingIcon	ReactNode	-	optional

Props for the ContextMenu Dropdown component.

Prop	Type	Default	Required
label	string	-	optional
items	ContextMenuDropdownItem[]	-	optional
disabled	boolean	false	optional
destructive	boolean	false	optional
leadingIcon	ReactNode	-	optional
onSelect	() => void	-	optional
open	boolean	-	optional
defaultOpen?	boolean	-	optional
onOpenChange	(open: boolean) => void;	-	optional
tag	string	-	optional
className	string	-	optional