One-click backups for AT Protocol
1import * as React from "react"
2import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"
3import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react"
4
5import { cn } from "@/lib/utils"
6
7function DropdownMenu({
8 ...props
9}: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {
10 return <DropdownMenuPrimitive.Root data-slot="dropdown-menu" {...props} />
11}
12
13function DropdownMenuPortal({
14 ...props
15}: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {
16 return (
17 <DropdownMenuPrimitive.Portal data-slot="dropdown-menu-portal" {...props} />
18 )
19}
20
21function DropdownMenuTrigger({
22 ...props
23}: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {
24 return (
25 <DropdownMenuPrimitive.Trigger
26 data-slot="dropdown-menu-trigger"
27 {...props}
28 />
29 )
30}
31
32function DropdownMenuContent({
33 className,
34 sideOffset = 4,
35 ...props
36}: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {
37 return (
38 <DropdownMenuPrimitive.Portal>
39 <DropdownMenuPrimitive.Content
40 data-slot="dropdown-menu-content"
41 sideOffset={sideOffset}
42 className={cn(
43 "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",
44 className
45 )}
46 {...props}
47 />
48 </DropdownMenuPrimitive.Portal>
49 )
50}
51
52function DropdownMenuGroup({
53 ...props
54}: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {
55 return (
56 <DropdownMenuPrimitive.Group data-slot="dropdown-menu-group" {...props} />
57 )
58}
59
60function DropdownMenuItem({
61 className,
62 inset,
63 variant = "default",
64 ...props
65}: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
66 inset?: boolean
67 variant?: "default" | "destructive"
68}) {
69 return (
70 <DropdownMenuPrimitive.Item
71 data-slot="dropdown-menu-item"
72 data-inset={inset}
73 data-variant={variant}
74 className={cn(
75 "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
76 className
77 )}
78 {...props}
79 />
80 )
81}
82
83function DropdownMenuCheckboxItem({
84 className,
85 children,
86 checked,
87 ...props
88}: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {
89 return (
90 <DropdownMenuPrimitive.CheckboxItem
91 data-slot="dropdown-menu-checkbox-item"
92 className={cn(
93 "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
94 className
95 )}
96 checked={checked}
97 {...props}
98 >
99 <span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
100 <DropdownMenuPrimitive.ItemIndicator>
101 <CheckIcon className="size-4" />
102 </DropdownMenuPrimitive.ItemIndicator>
103 </span>
104 {children}
105 </DropdownMenuPrimitive.CheckboxItem>
106 )
107}
108
109function DropdownMenuRadioGroup({
110 ...props
111}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {
112 return (
113 <DropdownMenuPrimitive.RadioGroup
114 data-slot="dropdown-menu-radio-group"
115 {...props}
116 />
117 )
118}
119
120function DropdownMenuRadioItem({
121 className,
122 children,
123 ...props
124}: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {
125 return (
126 <DropdownMenuPrimitive.RadioItem
127 data-slot="dropdown-menu-radio-item"
128 className={cn(
129 "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
130 className
131 )}
132 {...props}
133 >
134 <span className="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
135 <DropdownMenuPrimitive.ItemIndicator>
136 <CircleIcon className="size-2 fill-current" />
137 </DropdownMenuPrimitive.ItemIndicator>
138 </span>
139 {children}
140 </DropdownMenuPrimitive.RadioItem>
141 )
142}
143
144function DropdownMenuLabel({
145 className,
146 inset,
147 ...props
148}: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
149 inset?: boolean
150}) {
151 return (
152 <DropdownMenuPrimitive.Label
153 data-slot="dropdown-menu-label"
154 data-inset={inset}
155 className={cn(
156 "px-2 py-1.5 text-sm font-medium data-[inset]:pl-8",
157 className
158 )}
159 {...props}
160 />
161 )
162}
163
164function DropdownMenuSeparator({
165 className,
166 ...props
167}: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {
168 return (
169 <DropdownMenuPrimitive.Separator
170 data-slot="dropdown-menu-separator"
171 className={cn("bg-border -mx-1 my-1 h-px", className)}
172 {...props}
173 />
174 )
175}
176
177function DropdownMenuShortcut({
178 className,
179 ...props
180}: React.ComponentProps<"span">) {
181 return (
182 <span
183 data-slot="dropdown-menu-shortcut"
184 className={cn(
185 "text-muted-foreground ml-auto text-xs tracking-widest",
186 className
187 )}
188 {...props}
189 />
190 )
191}
192
193function DropdownMenuSub({
194 ...props
195}: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {
196 return <DropdownMenuPrimitive.Sub data-slot="dropdown-menu-sub" {...props} />
197}
198
199function DropdownMenuSubTrigger({
200 className,
201 inset,
202 children,
203 ...props
204}: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
205 inset?: boolean
206}) {
207 return (
208 <DropdownMenuPrimitive.SubTrigger
209 data-slot="dropdown-menu-sub-trigger"
210 data-inset={inset}
211 className={cn(
212 "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",
213 className
214 )}
215 {...props}
216 >
217 {children}
218 <ChevronRightIcon className="ml-auto size-4" />
219 </DropdownMenuPrimitive.SubTrigger>
220 )
221}
222
223function DropdownMenuSubContent({
224 className,
225 ...props
226}: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {
227 return (
228 <DropdownMenuPrimitive.SubContent
229 data-slot="dropdown-menu-sub-content"
230 className={cn(
231 "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 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg",
232 className
233 )}
234 {...props}
235 />
236 )
237}
238
239export {
240 DropdownMenu,
241 DropdownMenuPortal,
242 DropdownMenuTrigger,
243 DropdownMenuContent,
244 DropdownMenuGroup,
245 DropdownMenuLabel,
246 DropdownMenuItem,
247 DropdownMenuCheckboxItem,
248 DropdownMenuRadioGroup,
249 DropdownMenuRadioItem,
250 DropdownMenuSeparator,
251 DropdownMenuShortcut,
252 DropdownMenuSub,
253 DropdownMenuSubTrigger,
254 DropdownMenuSubContent,
255}