Dropdown Menu

1import * as React from 'react'
2import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu'
3import { Check, ChevronRight, Circle } from 'lucide-react'
4import { cn } from '@/lib/utils'
5 
6const DropdownMenu = DropdownMenuPrimitive.Root
7const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger
8const DropdownMenuGroup = DropdownMenuPrimitive.Group
9const DropdownMenuPortal = DropdownMenuPrimitive.Portal
10const DropdownMenuSub = DropdownMenuPrimitive.Sub
11const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup
12 
13const DropdownMenuSubTrigger = React.forwardRef<
14  React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,
15  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {
16    inset?: boolean
17  }
18>(({ className, inset, children, ...props }, ref) => (
19  <DropdownMenuPrimitive.SubTrigger
20    ref={ref}
21    className={cn(
22      'flex cursor-default select-none items-center px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent',
23      inset && 'pl-8',
24      className
25    )}
26    {...props}
27  >
28    {children}
29    <ChevronRight className="ml-auto h-4 w-4 stroke-[3]" />
30  </DropdownMenuPrimitive.SubTrigger>
31))
32DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName
33 
34const DropdownMenuSubContent = React.forwardRef<
35  React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,
36  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>
37>(({ className, ...props }, ref) => (
38  <DropdownMenuPrimitive.SubContent
39    ref={ref}
40    className={cn(
41      'z-50 min-w-[8rem] overflow-hidden border-3 border-foreground bg-popover p-1 text-popover-foreground shadow-[4px_4px_0px_hsl(var(--shadow-color))] ease-out origin-[var(--radix-popper-content-transform-origin)] 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',
42      className
43    )}
44    {...props}
45  />
46))
47DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName
48 
49const DropdownMenuContent = React.forwardRef<
50  React.ElementRef<typeof DropdownMenuPrimitive.Content>,
51  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>
52>(({ className, sideOffset = 4, ...props }, ref) => (
53  <DropdownMenuPrimitive.Portal>
54// … truncated