Dropdown

1"use client";
2 
3import { Icon } from "@/lib/icon";
4import { mdiCheck, mdiChevronRight, mdiCircle } from "@mdi/js";
5import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
6import type * as React from "react";
7 
8import { cn } from "@/lib/utils";
9 
10function DropdownMenu({
11  ...props
12}: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {
13  return <DropdownMenuPrimitive.Root data-slot="dropdown-menu" {...props} />;
14}
15 
16function DropdownMenuPortal({
17  ...props
18}: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {
19  return (
20    <DropdownMenuPrimitive.Portal data-slot="dropdown-menu-portal" {...props} />
21  );
22}
23 
24function DropdownMenuTrigger({
25  ...props
26}: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {
27  return (
28    <DropdownMenuPrimitive.Trigger
29      data-slot="dropdown-menu-trigger"
30      {...props}
31      aria-haspopup="true"
32    />
33  );
34}
35 
36function DropdownMenuContent({
37  className,
38  sideOffset = 4,
39  ...props
40}: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {
41  return (
42    <DropdownMenuPrimitive.Portal>
43      <DropdownMenuPrimitive.Content
44        data-slot="dropdown-menu-content"
45        sideOffset={sideOffset}
46        className={cn(
47          "bg-popover text-popover-foreground 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 z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md",
48          className,
49        )}
50        {...props}
51      />
52    </DropdownMenuPrimitive.Portal>
53  );
54}
55 
56function DropdownMenuGroup({
57  ...props
58}: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {
59  return (
60    <DropdownMenuPrimitive.Group data-slot="dropdown-menu-group" {...props} />
61  );
62}
63 
64function DropdownMenuItem({
65  className,
66  inset,
67  variant = "default",
68  ...props
69}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
70  inset?: boolean;
71  variant?: "default" | "destructive";
72}) {
73  return (
74    <DropdownMenuPrimitive.Item
75      data-slot="dropdown-menu-item"
76      data-inset={inset}
77      data-variant={variant}
78      className={cn(
79// … truncated