Pixelact Context Menu

1import * as React from "react";
2 
3import * as ContextMenuPrimitive from "@radix-ui/react-context-menu";
4import { Circle } from "lucide-react";
5 
6import { cn } from "@/lib/utils";
7 
8import "@/components/ui/pixelact-ui/styles/styles.css";
9 
10const ContextMenu = ContextMenuPrimitive.Root;
11 
12const ContextMenuTrigger = ContextMenuPrimitive.Trigger;
13 
14const ContextMenuGroup = ContextMenuPrimitive.Group;
15 
16const ContextMenuPortal = ContextMenuPrimitive.Portal;
17 
18const ContextMenuSub = ContextMenuPrimitive.Sub;
19 
20const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
21 
22const ContextMenuSubTrigger = React.forwardRef<
23  React.ComponentRef<typeof ContextMenuPrimitive.SubTrigger>,
24  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubTrigger> & {
25    inset?: boolean;
26  }
27>(({ className, inset, children, ...props }, ref) => (
28  <ContextMenuPrimitive.SubTrigger
29    ref={ref}
30    className={cn(
31      "flex cursor-default select-none items-center rounded-none px-2 py-1.5 text-sm outline-none focus:border-y-4 focus:border-foreground h-8 focus:dark:border-ring border-dashed focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",
32      inset && "pl-8",
33      className
34    )}
35    {...props}
36  >
37    {children}
38    <svg
39      xmlns="http://www.w3.org/2000/svg"
40      width="32"
41      height="32"
42      viewBox="0 0 24 24"
43      className="ml-auto size-6"
44    >
45      <path
46        className="fill-foreground"
47        d="M8 5v2h2V5zm4 4V7h-2v2zm2 2V9h-2v2zm0 2h2v-2h-2zm-2 2v-2h2v2zm0 0h-2v2h2zm-4 4v-2h2v2z"
48      />
49    </svg>
50  </ContextMenuPrimitive.SubTrigger>
51));
52ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
53 
54const ContextMenuSubContent = React.forwardRef<
55  React.ComponentRef<typeof ContextMenuPrimitive.SubContent>,
56  React.ComponentPropsWithoutRef<typeof ContextMenuPrimitive.SubContent>
57>(({ className, ...props }, ref) => (
58  <ContextMenuPrimitive.SubContent
59    ref={ref}
60    className={cn(
61      "z-50 min-w-[8rem] overflow-hidden rounded-none bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-context-menu-content-transform-origin]",
62// … truncated