Context Menu

1import * as React from "react";
2import { ContextMenu as ContextMenuPrimitive } from "@base-ui/react/context-menu";
3import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
4 
5import { cn } from "@/lib/utils";
6 
7function ContextMenu({ ...props }: ContextMenuPrimitive.Root.Props) {
8  return <ContextMenuPrimitive.Root data-slot="context-menu" {...props} />;
9}
10 
11function ContextMenuTrigger({ ...props }: ContextMenuPrimitive.Trigger.Props) {
12  return (
13    <ContextMenuPrimitive.Trigger data-slot="context-menu-trigger" {...props} />
14  );
15}
16 
17function ContextMenuGroup({ ...props }: ContextMenuPrimitive.Group.Props) {
18  return (
19    <ContextMenuPrimitive.Group data-slot="context-menu-group" {...props} />
20  );
21}
22 
23function ContextMenuPortal({ ...props }: ContextMenuPrimitive.Portal.Props) {
24  return (
25    <ContextMenuPrimitive.Portal data-slot="context-menu-portal" {...props} />
26  );
27}
28 
29function ContextMenuSub({ ...props }: ContextMenuPrimitive.SubmenuRoot.Props) {
30  return (
31    <ContextMenuPrimitive.SubmenuRoot data-slot="context-menu-sub" {...props} />
32  );
33}
34 
35function ContextMenuRadioGroup({
36  ...props
37}: ContextMenuPrimitive.RadioGroup.Props) {
38  return (
39    <ContextMenuPrimitive.RadioGroup
40      data-slot="context-menu-radio-group"
41      {...props}
42    />
43  );
44}
45 
46function ContextMenuSubTrigger({
47  className,
48  inset,
49  children,
50  ...props
51}: ContextMenuPrimitive.SubmenuTrigger.Props & {
52  inset?: boolean;
53}) {
54  return (
55    <ContextMenuPrimitive.SubmenuTrigger
56      data-slot="context-menu-sub-trigger"
57      data-inset={inset}
58      className={cn(
59        "focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
60        className
61      )}
62      {...props}
63    >
64      {children}
65      <ChevronRightIcon className="ml-auto" />
66    </ContextMenuPrimitive.SubmenuTrigger>
67  );
68}
69 
70function ContextMenuSubContent({
71  className,
72  ...props
73}: ContextMenuPrimitive.Popup.Props) {
74  return (
75    <ContextMenuPrimitive.Popup
76      data-slot="context-menu-sub-content"
77      className={cn(
78// … truncated