Jensin commited on
Commit
ff00258
·
verified ·
1 Parent(s): 6770f76

Upload components/ui/dropdown-menu.jsx with huggingface_hub

Browse files
Files changed (1) hide show
  1. components/ui/dropdown-menu.jsx +195 -0
components/ui/dropdown-menu.jsx ADDED
@@ -0,0 +1,195 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import * as React from "react"
2
+ import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"
3
+ import { cn } from "@/lib/utils"
4
+
5
+ const DropdownMenu = DropdownMenuPrimitive.Root
6
+
7
+ const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger
8
+
9
+ const DropdownMenuGroup = DropdownMenuPrimitive.Group
10
+
11
+ const DropdownMenuPortal = DropdownMenuPrimitive.Portal
12
+
13
+ const DropdownMenuSub = DropdownMenuPrimitive.Sub
14
+
15
+ const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup
16
+
17
+ const DropdownMenuSubTrigger = React.forwardRef(({ className, inset, children, ...props }, ref) => (
18
+ <DropdownMenuPrimitive.SubTrigger
19
+ ref={ref}
20
+ className={cn(
21
+ "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
22
+ inset && "pl-8",
23
+ className
24
+ )}
25
+ {...props}
26
+ >
27
+ {children}
28
+ <svg
29
+ xmlns="http://www.w3.org/2000/svg"
30
+ width="24"
31
+ height="24"
32
+ viewBox="0 0 24 24"
33
+ fill="none"
34
+ stroke="currentColor"
35
+ strokeWidth="2"
36
+ strokeLinecap="round"
37
+ strokeLinejoin="round"
38
+ className="ml-auto h-4 w-4"
39
+ >
40
+ <path d="m9 18 6-6-6-6" />
41
+ </svg>
42
+ </DropdownMenuPrimitive.SubTrigger>
43
+ ))
44
+ DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName
45
+
46
+ const DropdownMenuSubContent = React.forwardRef(({ className, ...props }, ref) => (
47
+ <DropdownMenuPrimitive.SubContent
48
+ ref={ref}
49
+ className={cn(
50
+ "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg 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",
51
+ className
52
+ )}
53
+ {...props}
54
+ />
55
+ ))
56
+ DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName
57
+
58
+ const DropdownMenuContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => (
59
+ <DropdownMenuPrimitive.Portal>
60
+ <DropdownMenuPrimitive.Content
61
+ ref={ref}
62
+ sideOffset={sideOffset}
63
+ className={cn(
64
+ "z-50 min-w-[8rem] overflow-hidden rounded-md border 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",
65
+ className
66
+ )}
67
+ {...props}
68
+ />
69
+ </DropdownMenuPrimitive.Portal>
70
+ ))
71
+ DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName
72
+
73
+ const DropdownMenuItem = React.forwardRef(({ className, inset, ...props }, ref) => (
74
+ <DropdownMenuPrimitive.Item
75
+ ref={ref}
76
+ className={cn(
77
+ "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
78
+ inset && "pl-8",
79
+ className
80
+ )}
81
+ {...props}
82
+ />
83
+ ))
84
+ DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName
85
+
86
+ const DropdownMenuCheckboxItem = React.forwardRef(({ className, children, checked, ...props }, ref) => (
87
+ <DropdownMenuPrimitive.CheckboxItem
88
+ ref={ref}
89
+ className={cn(
90
+ "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
91
+ className
92
+ )}
93
+ checked={checked}
94
+ {...props}
95
+ >
96
+ <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
97
+ <DropdownMenuPrimitive.ItemIndicator>
98
+ <svg
99
+ xmlns="http://www.w3.org/2000/svg"
100
+ width="24"
101
+ height="24"
102
+ viewBox="0 0 24 24"
103
+ fill="none"
104
+ stroke="currentColor"
105
+ strokeWidth="2"
106
+ strokeLinecap="round"
107
+ strokeLinejoin="round"
108
+ className="h-4 w-4"
109
+ >
110
+ <path d="M5 12l5 5L20 7" />
111
+ </svg>
112
+ </DropdownMenuPrimitive.ItemIndicator>
113
+ </span>
114
+ {children}
115
+ </DropdownMenuPrimitive.CheckboxItem>
116
+ ))
117
+ DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName
118
+
119
+ const DropdownMenuRadioItem = React.forwardRef(({ className, children, ...props }, ref) => (
120
+ <DropdownMenuPrimitive.RadioItem
121
+ ref={ref}
122
+ className={cn(
123
+ "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
124
+ className
125
+ )}
126
+ {...props}
127
+ >
128
+ <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
129
+ <DropdownMenuPrimitive.ItemIndicator>
130
+ <svg
131
+ xmlns="http://www.w3.org/2000/svg"
132
+ width="24"
133
+ height="24"
134
+ viewBox="0 0 24 24"
135
+ fill="none"
136
+ stroke="currentColor"
137
+ strokeWidth="2"
138
+ strokeLinecap="round"
139
+ strokeLinejoin="round"
140
+ className="h-2 w-2 fill-current"
141
+ >
142
+ <circle cx="12" cy="12" r="10" />
143
+ </svg>
144
+ </DropdownMenuPrimitive.ItemIndicator>
145
+ </span>
146
+ {children}
147
+ </DropdownMenuPrimitive.RadioItem>
148
+ ))
149
+ DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName
150
+
151
+ const DropdownMenuLabel = React.forwardRef(({ className, inset, ...props }, ref) => (
152
+ <DropdownMenuPrimitive.Label
153
+ ref={ref}
154
+ className={cn("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className)}
155
+ {...props}
156
+ />
157
+ ))
158
+ DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName
159
+
160
+ const DropdownMenuSeparator = React.forwardRef(({ className, ...props }, ref) => (
161
+ <DropdownMenuPrimitive.Separator
162
+ ref={ref}
163
+ className={cn("-mx-1 my-1 h-px bg-muted", className)}
164
+ {...props}
165
+ />
166
+ ))
167
+ DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName
168
+
169
+ const DropdownMenuShortcut = ({ className, ...props }) => {
170
+ return (
171
+ <span
172
+ className={cn("ml-auto text-xs tracking-widest opacity-60", className)}
173
+ {...props}
174
+ />
175
+ )
176
+ }
177
+ DropdownMenuShortcut.displayName = "DropdownMenuShortcut"
178
+
179
+ export {
180
+ DropdownMenu,
181
+ DropdownMenuTrigger,
182
+ DropdownMenuContent,
183
+ DropdownMenuItem,
184
+ DropdownMenuCheckboxItem,
185
+ DropdownMenuRadioItem,
186
+ DropdownMenuLabel,
187
+ DropdownMenuSeparator,
188
+ DropdownMenuShortcut,
189
+ DropdownMenuGroup,
190
+ DropdownMenuPortal,
191
+ DropdownMenuSub,
192
+ DropdownMenuSubContent,
193
+ DropdownMenuSubTrigger,
194
+ DropdownMenuRadioGroup,
195
+ }