@teacharium/ui 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +69 -0
- package/dist/components/alert-dialog.d.ts +21 -0
- package/dist/components/alert-dialog.d.ts.map +1 -0
- package/dist/components/alert.d.ts +10 -0
- package/dist/components/alert.d.ts.map +1 -0
- package/dist/components/avatar.d.ts +7 -0
- package/dist/components/avatar.d.ts.map +1 -0
- package/dist/components/badge.d.ts +10 -0
- package/dist/components/badge.d.ts.map +1 -0
- package/dist/components/button.d.ts +12 -0
- package/dist/components/button.d.ts.map +1 -0
- package/dist/components/card.d.ts +9 -0
- package/dist/components/card.d.ts.map +1 -0
- package/dist/components/carousel.d.ts +20 -0
- package/dist/components/carousel.d.ts.map +1 -0
- package/dist/components/checkbox.d.ts +5 -0
- package/dist/components/checkbox.d.ts.map +1 -0
- package/dist/components/collapsible.d.ts +6 -0
- package/dist/components/collapsible.d.ts.map +1 -0
- package/dist/components/dialog.d.ts +16 -0
- package/dist/components/dialog.d.ts.map +1 -0
- package/dist/components/dropdown-menu.d.ts +28 -0
- package/dist/components/dropdown-menu.d.ts.map +1 -0
- package/dist/components/form.d.ts +25 -0
- package/dist/components/form.d.ts.map +1 -0
- package/dist/components/hover-card.d.ts +7 -0
- package/dist/components/hover-card.d.ts.map +1 -0
- package/dist/components/input.d.ts +4 -0
- package/dist/components/input.d.ts.map +1 -0
- package/dist/components/label.d.ts +6 -0
- package/dist/components/label.d.ts.map +1 -0
- package/dist/components/pagination.d.ts +14 -0
- package/dist/components/pagination.d.ts.map +1 -0
- package/dist/components/popover.d.ts +8 -0
- package/dist/components/popover.d.ts.map +1 -0
- package/dist/components/progress.d.ts +5 -0
- package/dist/components/progress.d.ts.map +1 -0
- package/dist/components/resizable-panels.d.ts +25 -0
- package/dist/components/resizable-panels.d.ts.map +1 -0
- package/dist/components/scroll-area.d.ts +6 -0
- package/dist/components/scroll-area.d.ts.map +1 -0
- package/dist/components/select.d.ts +16 -0
- package/dist/components/select.d.ts.map +1 -0
- package/dist/components/separator.d.ts +5 -0
- package/dist/components/separator.d.ts.map +1 -0
- package/dist/components/sheet.d.ts +14 -0
- package/dist/components/sheet.d.ts.map +1 -0
- package/dist/components/showcase.d.ts +6 -0
- package/dist/components/showcase.d.ts.map +1 -0
- package/dist/components/skeleton.d.ts +3 -0
- package/dist/components/skeleton.d.ts.map +1 -0
- package/dist/components/switch.d.ts +5 -0
- package/dist/components/switch.d.ts.map +1 -0
- package/dist/components/tabs.d.ts +28 -0
- package/dist/components/tabs.d.ts.map +1 -0
- package/dist/components/textarea.d.ts +4 -0
- package/dist/components/textarea.d.ts.map +1 -0
- package/dist/components/tooltip.d.ts +8 -0
- package/dist/components/tooltip.d.ts.map +1 -0
- package/dist/components/typography.d.ts +17 -0
- package/dist/components/typography.d.ts.map +1 -0
- package/dist/index.d.ts +34 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/lib/utils.d.ts +3 -0
- package/dist/lib/utils.d.ts.map +1 -0
- package/dist/teacharium-ui.cjs.js +1992 -0
- package/dist/teacharium-ui.cjs.js.map +1 -0
- package/dist/teacharium-ui.es.js +1961 -0
- package/dist/teacharium-ui.es.js.map +1 -0
- package/dist/ui.css +1894 -0
- package/package.json +86 -0
|
@@ -0,0 +1,1961 @@
|
|
|
1
|
+
import { clsx } from "clsx";
|
|
2
|
+
import { twMerge } from "tailwind-merge";
|
|
3
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
import { cva } from "class-variance-authority";
|
|
5
|
+
import * as React from "react";
|
|
6
|
+
import React__default, { createContext, useState, useContext, forwardRef } from "react";
|
|
7
|
+
import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
|
|
8
|
+
import { Slot } from "@radix-ui/react-slot";
|
|
9
|
+
import * as AvatarPrimitive from "@radix-ui/react-avatar";
|
|
10
|
+
import useEmblaCarousel from "embla-carousel-react";
|
|
11
|
+
import { ArrowRight, ArrowLeft, Check, XIcon, ChevronRight, Circle, MoreHorizontalIcon, ChevronRightIcon, ChevronLeftIcon, GripVertical, CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react";
|
|
12
|
+
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
|
|
13
|
+
import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
|
|
14
|
+
import * as DialogPrimitive from "@radix-ui/react-dialog";
|
|
15
|
+
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
|
|
16
|
+
import { FormProvider, Controller, useFormContext, useFormState } from "react-hook-form";
|
|
17
|
+
import * as LabelPrimitive from "@radix-ui/react-label";
|
|
18
|
+
import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
|
|
19
|
+
import * as PopoverPrimitive from "@radix-ui/react-popover";
|
|
20
|
+
import * as ProgressPrimitive from "@radix-ui/react-progress";
|
|
21
|
+
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
|
|
22
|
+
import * as SelectPrimitive from "@radix-ui/react-select";
|
|
23
|
+
import * as SeparatorPrimitive from "@radix-ui/react-separator";
|
|
24
|
+
import * as SwitchPrimitive from "@radix-ui/react-switch";
|
|
25
|
+
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
26
|
+
function cn(...inputs) {
|
|
27
|
+
return twMerge(clsx(inputs));
|
|
28
|
+
}
|
|
29
|
+
const alertVariants = cva(
|
|
30
|
+
"relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current",
|
|
31
|
+
{
|
|
32
|
+
variants: {
|
|
33
|
+
variant: {
|
|
34
|
+
default: "bg-card text-card-foreground",
|
|
35
|
+
destructive: "text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90"
|
|
36
|
+
}
|
|
37
|
+
},
|
|
38
|
+
defaultVariants: {
|
|
39
|
+
variant: "default"
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
);
|
|
43
|
+
function Alert({
|
|
44
|
+
className,
|
|
45
|
+
variant,
|
|
46
|
+
...props
|
|
47
|
+
}) {
|
|
48
|
+
return /* @__PURE__ */ jsx(
|
|
49
|
+
"div",
|
|
50
|
+
{
|
|
51
|
+
"data-slot": "alert",
|
|
52
|
+
role: "alert",
|
|
53
|
+
className: cn(alertVariants({ variant }), className),
|
|
54
|
+
...props
|
|
55
|
+
}
|
|
56
|
+
);
|
|
57
|
+
}
|
|
58
|
+
function AlertTitle({ className, ...props }) {
|
|
59
|
+
return /* @__PURE__ */ jsx(
|
|
60
|
+
"div",
|
|
61
|
+
{
|
|
62
|
+
"data-slot": "alert-title",
|
|
63
|
+
className: cn(
|
|
64
|
+
"col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight",
|
|
65
|
+
className
|
|
66
|
+
),
|
|
67
|
+
...props
|
|
68
|
+
}
|
|
69
|
+
);
|
|
70
|
+
}
|
|
71
|
+
function AlertDescription({
|
|
72
|
+
className,
|
|
73
|
+
...props
|
|
74
|
+
}) {
|
|
75
|
+
return /* @__PURE__ */ jsx(
|
|
76
|
+
"div",
|
|
77
|
+
{
|
|
78
|
+
"data-slot": "alert-description",
|
|
79
|
+
className: cn(
|
|
80
|
+
"text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed",
|
|
81
|
+
className
|
|
82
|
+
),
|
|
83
|
+
...props
|
|
84
|
+
}
|
|
85
|
+
);
|
|
86
|
+
}
|
|
87
|
+
const buttonVariants = cva(
|
|
88
|
+
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
|
|
89
|
+
{
|
|
90
|
+
variants: {
|
|
91
|
+
variant: {
|
|
92
|
+
default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
|
|
93
|
+
destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
|
|
94
|
+
outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
|
|
95
|
+
secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
|
|
96
|
+
ghost: "hover:bg-accent hover:text-accent-foreground",
|
|
97
|
+
link: "text-primary underline-offset-4 hover:underline"
|
|
98
|
+
},
|
|
99
|
+
size: {
|
|
100
|
+
default: "h-9 px-4 py-2",
|
|
101
|
+
sm: "h-8 rounded-md px-3 text-xs",
|
|
102
|
+
lg: "h-10 rounded-md px-8",
|
|
103
|
+
icon: "h-9 w-9"
|
|
104
|
+
}
|
|
105
|
+
},
|
|
106
|
+
defaultVariants: {
|
|
107
|
+
variant: "default",
|
|
108
|
+
size: "default"
|
|
109
|
+
}
|
|
110
|
+
}
|
|
111
|
+
);
|
|
112
|
+
const Button = React.forwardRef(
|
|
113
|
+
({ className, variant, size, asChild = false, ...props }, ref) => {
|
|
114
|
+
const Comp = asChild ? Slot : "button";
|
|
115
|
+
return /* @__PURE__ */ jsx(
|
|
116
|
+
Comp,
|
|
117
|
+
{
|
|
118
|
+
className: cn(buttonVariants({ variant, size, className })),
|
|
119
|
+
ref,
|
|
120
|
+
...props
|
|
121
|
+
}
|
|
122
|
+
);
|
|
123
|
+
}
|
|
124
|
+
);
|
|
125
|
+
Button.displayName = "Button";
|
|
126
|
+
const AlertDialog = AlertDialogPrimitive.Root;
|
|
127
|
+
const AlertDialogTrigger = AlertDialogPrimitive.Trigger;
|
|
128
|
+
const AlertDialogPortal = AlertDialogPrimitive.Portal;
|
|
129
|
+
const AlertDialogOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
130
|
+
AlertDialogPrimitive.Overlay,
|
|
131
|
+
{
|
|
132
|
+
className: cn(
|
|
133
|
+
"fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
|
|
134
|
+
className
|
|
135
|
+
),
|
|
136
|
+
...props,
|
|
137
|
+
ref
|
|
138
|
+
}
|
|
139
|
+
));
|
|
140
|
+
AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
|
|
141
|
+
const AlertDialogContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [
|
|
142
|
+
/* @__PURE__ */ jsx(AlertDialogOverlay, {}),
|
|
143
|
+
/* @__PURE__ */ jsx(
|
|
144
|
+
AlertDialogPrimitive.Content,
|
|
145
|
+
{
|
|
146
|
+
ref,
|
|
147
|
+
className: cn(
|
|
148
|
+
"fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
|
|
149
|
+
className
|
|
150
|
+
),
|
|
151
|
+
...props
|
|
152
|
+
}
|
|
153
|
+
)
|
|
154
|
+
] }));
|
|
155
|
+
AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;
|
|
156
|
+
const AlertDialogHeader = ({
|
|
157
|
+
className,
|
|
158
|
+
...props
|
|
159
|
+
}) => /* @__PURE__ */ jsx(
|
|
160
|
+
"div",
|
|
161
|
+
{
|
|
162
|
+
className: cn(
|
|
163
|
+
"flex flex-col space-y-2 text-center sm:text-left",
|
|
164
|
+
className
|
|
165
|
+
),
|
|
166
|
+
...props
|
|
167
|
+
}
|
|
168
|
+
);
|
|
169
|
+
AlertDialogHeader.displayName = "AlertDialogHeader";
|
|
170
|
+
const AlertDialogFooter = ({
|
|
171
|
+
className,
|
|
172
|
+
...props
|
|
173
|
+
}) => /* @__PURE__ */ jsx(
|
|
174
|
+
"div",
|
|
175
|
+
{
|
|
176
|
+
className: cn(
|
|
177
|
+
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
|
|
178
|
+
className
|
|
179
|
+
),
|
|
180
|
+
...props
|
|
181
|
+
}
|
|
182
|
+
);
|
|
183
|
+
AlertDialogFooter.displayName = "AlertDialogFooter";
|
|
184
|
+
const AlertDialogTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
185
|
+
AlertDialogPrimitive.Title,
|
|
186
|
+
{
|
|
187
|
+
ref,
|
|
188
|
+
className: cn("text-lg font-semibold", className),
|
|
189
|
+
...props
|
|
190
|
+
}
|
|
191
|
+
));
|
|
192
|
+
AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
|
|
193
|
+
const AlertDialogDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
194
|
+
AlertDialogPrimitive.Description,
|
|
195
|
+
{
|
|
196
|
+
ref,
|
|
197
|
+
className: cn("text-sm text-muted-foreground", className),
|
|
198
|
+
...props
|
|
199
|
+
}
|
|
200
|
+
));
|
|
201
|
+
AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
|
|
202
|
+
const AlertDialogAction = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
203
|
+
AlertDialogPrimitive.Action,
|
|
204
|
+
{
|
|
205
|
+
ref,
|
|
206
|
+
className: cn(buttonVariants(), className),
|
|
207
|
+
...props
|
|
208
|
+
}
|
|
209
|
+
));
|
|
210
|
+
AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
|
|
211
|
+
const AlertDialogCancel = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
212
|
+
AlertDialogPrimitive.Cancel,
|
|
213
|
+
{
|
|
214
|
+
ref,
|
|
215
|
+
className: cn(
|
|
216
|
+
buttonVariants({ variant: "outline" }),
|
|
217
|
+
"mt-2 sm:mt-0",
|
|
218
|
+
className
|
|
219
|
+
),
|
|
220
|
+
...props
|
|
221
|
+
}
|
|
222
|
+
));
|
|
223
|
+
AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
|
|
224
|
+
function Avatar({
|
|
225
|
+
className,
|
|
226
|
+
...props
|
|
227
|
+
}) {
|
|
228
|
+
return /* @__PURE__ */ jsx(
|
|
229
|
+
AvatarPrimitive.Root,
|
|
230
|
+
{
|
|
231
|
+
"data-slot": "avatar",
|
|
232
|
+
className: cn(
|
|
233
|
+
"relative flex size-8 shrink-0 overflow-hidden rounded-full",
|
|
234
|
+
className
|
|
235
|
+
),
|
|
236
|
+
...props
|
|
237
|
+
}
|
|
238
|
+
);
|
|
239
|
+
}
|
|
240
|
+
function AvatarImage({
|
|
241
|
+
className,
|
|
242
|
+
...props
|
|
243
|
+
}) {
|
|
244
|
+
return /* @__PURE__ */ jsx(
|
|
245
|
+
AvatarPrimitive.Image,
|
|
246
|
+
{
|
|
247
|
+
"data-slot": "avatar-image",
|
|
248
|
+
className: cn("aspect-square size-full", className),
|
|
249
|
+
...props
|
|
250
|
+
}
|
|
251
|
+
);
|
|
252
|
+
}
|
|
253
|
+
function AvatarFallback({
|
|
254
|
+
className,
|
|
255
|
+
...props
|
|
256
|
+
}) {
|
|
257
|
+
return /* @__PURE__ */ jsx(
|
|
258
|
+
AvatarPrimitive.Fallback,
|
|
259
|
+
{
|
|
260
|
+
"data-slot": "avatar-fallback",
|
|
261
|
+
className: cn(
|
|
262
|
+
"bg-muted flex size-full items-center justify-center rounded-full",
|
|
263
|
+
className
|
|
264
|
+
),
|
|
265
|
+
...props
|
|
266
|
+
}
|
|
267
|
+
);
|
|
268
|
+
}
|
|
269
|
+
const badgeVariants = cva(
|
|
270
|
+
"inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
|
|
271
|
+
{
|
|
272
|
+
variants: {
|
|
273
|
+
variant: {
|
|
274
|
+
default: "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80",
|
|
275
|
+
secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
|
|
276
|
+
destructive: "border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80",
|
|
277
|
+
outline: "text-foreground"
|
|
278
|
+
}
|
|
279
|
+
},
|
|
280
|
+
defaultVariants: {
|
|
281
|
+
variant: "default"
|
|
282
|
+
}
|
|
283
|
+
}
|
|
284
|
+
);
|
|
285
|
+
function Badge({ className, variant, ...props }) {
|
|
286
|
+
return /* @__PURE__ */ jsx("div", { className: cn(badgeVariants({ variant }), className), ...props });
|
|
287
|
+
}
|
|
288
|
+
const Card = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
289
|
+
"div",
|
|
290
|
+
{
|
|
291
|
+
ref,
|
|
292
|
+
className: cn(
|
|
293
|
+
"rounded-xl border bg-card text-card-foreground shadow",
|
|
294
|
+
className
|
|
295
|
+
),
|
|
296
|
+
...props
|
|
297
|
+
}
|
|
298
|
+
));
|
|
299
|
+
Card.displayName = "Card";
|
|
300
|
+
const CardHeader = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
301
|
+
"div",
|
|
302
|
+
{
|
|
303
|
+
ref,
|
|
304
|
+
className: cn("flex flex-col space-y-1.5 p-6", className),
|
|
305
|
+
...props
|
|
306
|
+
}
|
|
307
|
+
));
|
|
308
|
+
CardHeader.displayName = "CardHeader";
|
|
309
|
+
const CardTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
310
|
+
"div",
|
|
311
|
+
{
|
|
312
|
+
ref,
|
|
313
|
+
className: cn("font-semibold leading-none tracking-tight", className),
|
|
314
|
+
...props
|
|
315
|
+
}
|
|
316
|
+
));
|
|
317
|
+
CardTitle.displayName = "CardTitle";
|
|
318
|
+
const CardDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
319
|
+
"div",
|
|
320
|
+
{
|
|
321
|
+
ref,
|
|
322
|
+
className: cn("text-sm text-muted-foreground", className),
|
|
323
|
+
...props
|
|
324
|
+
}
|
|
325
|
+
));
|
|
326
|
+
CardDescription.displayName = "CardDescription";
|
|
327
|
+
const CardContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
|
|
328
|
+
CardContent.displayName = "CardContent";
|
|
329
|
+
const CardFooter = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
330
|
+
"div",
|
|
331
|
+
{
|
|
332
|
+
ref,
|
|
333
|
+
className: cn("flex items-center p-6 pt-0", className),
|
|
334
|
+
...props
|
|
335
|
+
}
|
|
336
|
+
));
|
|
337
|
+
CardFooter.displayName = "CardFooter";
|
|
338
|
+
const CarouselContext = React.createContext(null);
|
|
339
|
+
function useCarousel() {
|
|
340
|
+
const context = React.useContext(CarouselContext);
|
|
341
|
+
if (!context) {
|
|
342
|
+
throw new Error("useCarousel must be used within a <Carousel />");
|
|
343
|
+
}
|
|
344
|
+
return context;
|
|
345
|
+
}
|
|
346
|
+
function Carousel({
|
|
347
|
+
orientation = "horizontal",
|
|
348
|
+
opts,
|
|
349
|
+
setApi,
|
|
350
|
+
plugins,
|
|
351
|
+
className,
|
|
352
|
+
children,
|
|
353
|
+
...props
|
|
354
|
+
}) {
|
|
355
|
+
const [carouselRef, api] = useEmblaCarousel(
|
|
356
|
+
{
|
|
357
|
+
...opts,
|
|
358
|
+
axis: orientation === "horizontal" ? "x" : "y"
|
|
359
|
+
},
|
|
360
|
+
plugins
|
|
361
|
+
);
|
|
362
|
+
const [canScrollPrev, setCanScrollPrev] = React.useState(false);
|
|
363
|
+
const [canScrollNext, setCanScrollNext] = React.useState(false);
|
|
364
|
+
const onSelect = React.useCallback((api2) => {
|
|
365
|
+
if (!api2) return;
|
|
366
|
+
setCanScrollPrev(api2.canScrollPrev());
|
|
367
|
+
setCanScrollNext(api2.canScrollNext());
|
|
368
|
+
}, []);
|
|
369
|
+
const scrollPrev = React.useCallback(() => {
|
|
370
|
+
api?.scrollPrev();
|
|
371
|
+
}, [api]);
|
|
372
|
+
const scrollNext = React.useCallback(() => {
|
|
373
|
+
api?.scrollNext();
|
|
374
|
+
}, [api]);
|
|
375
|
+
const handleKeyDown = React.useCallback(
|
|
376
|
+
(event) => {
|
|
377
|
+
if (event.key === "ArrowLeft") {
|
|
378
|
+
event.preventDefault();
|
|
379
|
+
scrollPrev();
|
|
380
|
+
} else if (event.key === "ArrowRight") {
|
|
381
|
+
event.preventDefault();
|
|
382
|
+
scrollNext();
|
|
383
|
+
}
|
|
384
|
+
},
|
|
385
|
+
[scrollPrev, scrollNext]
|
|
386
|
+
);
|
|
387
|
+
React.useEffect(() => {
|
|
388
|
+
if (!api || !setApi) return;
|
|
389
|
+
setApi(api);
|
|
390
|
+
}, [api, setApi]);
|
|
391
|
+
React.useEffect(() => {
|
|
392
|
+
if (!api) return;
|
|
393
|
+
onSelect(api);
|
|
394
|
+
api.on("reInit", onSelect);
|
|
395
|
+
api.on("select", onSelect);
|
|
396
|
+
return () => {
|
|
397
|
+
api?.off("select", onSelect);
|
|
398
|
+
};
|
|
399
|
+
}, [api, onSelect]);
|
|
400
|
+
return /* @__PURE__ */ jsx(
|
|
401
|
+
CarouselContext.Provider,
|
|
402
|
+
{
|
|
403
|
+
value: {
|
|
404
|
+
carouselRef,
|
|
405
|
+
api,
|
|
406
|
+
opts,
|
|
407
|
+
orientation: orientation || (opts?.axis === "y" ? "vertical" : "horizontal"),
|
|
408
|
+
scrollPrev,
|
|
409
|
+
scrollNext,
|
|
410
|
+
canScrollPrev,
|
|
411
|
+
canScrollNext
|
|
412
|
+
},
|
|
413
|
+
children: /* @__PURE__ */ jsx(
|
|
414
|
+
"div",
|
|
415
|
+
{
|
|
416
|
+
onKeyDownCapture: handleKeyDown,
|
|
417
|
+
className: cn("relative", className),
|
|
418
|
+
role: "region",
|
|
419
|
+
"aria-roledescription": "carousel",
|
|
420
|
+
"data-slot": "carousel",
|
|
421
|
+
...props,
|
|
422
|
+
children
|
|
423
|
+
}
|
|
424
|
+
)
|
|
425
|
+
}
|
|
426
|
+
);
|
|
427
|
+
}
|
|
428
|
+
function CarouselContent({ className, ...props }) {
|
|
429
|
+
const { carouselRef, orientation } = useCarousel();
|
|
430
|
+
return /* @__PURE__ */ jsx(
|
|
431
|
+
"div",
|
|
432
|
+
{
|
|
433
|
+
ref: carouselRef,
|
|
434
|
+
className: "overflow-hidden",
|
|
435
|
+
"data-slot": "carousel-content",
|
|
436
|
+
children: /* @__PURE__ */ jsx(
|
|
437
|
+
"div",
|
|
438
|
+
{
|
|
439
|
+
className: cn(
|
|
440
|
+
"flex",
|
|
441
|
+
orientation === "horizontal" ? "-ml-4" : "-mt-4 flex-col",
|
|
442
|
+
className
|
|
443
|
+
),
|
|
444
|
+
...props
|
|
445
|
+
}
|
|
446
|
+
)
|
|
447
|
+
}
|
|
448
|
+
);
|
|
449
|
+
}
|
|
450
|
+
function CarouselItem({ className, ...props }) {
|
|
451
|
+
const { orientation } = useCarousel();
|
|
452
|
+
return /* @__PURE__ */ jsx(
|
|
453
|
+
"div",
|
|
454
|
+
{
|
|
455
|
+
role: "group",
|
|
456
|
+
"aria-roledescription": "slide",
|
|
457
|
+
"data-slot": "carousel-item",
|
|
458
|
+
className: cn(
|
|
459
|
+
"min-w-0 shrink-0 grow-0 basis-full",
|
|
460
|
+
orientation === "horizontal" ? "pl-4" : "pt-4",
|
|
461
|
+
className
|
|
462
|
+
),
|
|
463
|
+
...props
|
|
464
|
+
}
|
|
465
|
+
);
|
|
466
|
+
}
|
|
467
|
+
function CarouselPrevious({
|
|
468
|
+
className,
|
|
469
|
+
variant = "outline",
|
|
470
|
+
size = "icon",
|
|
471
|
+
...props
|
|
472
|
+
}) {
|
|
473
|
+
const { orientation, scrollPrev, canScrollPrev } = useCarousel();
|
|
474
|
+
return /* @__PURE__ */ jsxs(
|
|
475
|
+
Button,
|
|
476
|
+
{
|
|
477
|
+
"data-slot": "carousel-previous",
|
|
478
|
+
variant,
|
|
479
|
+
size,
|
|
480
|
+
className: cn(
|
|
481
|
+
"absolute size-8 rounded-full",
|
|
482
|
+
orientation === "horizontal" ? "top-1/2 -left-12 -translate-y-1/2" : "-top-12 left-1/2 -translate-x-1/2 rotate-90",
|
|
483
|
+
className
|
|
484
|
+
),
|
|
485
|
+
disabled: !canScrollPrev,
|
|
486
|
+
onClick: scrollPrev,
|
|
487
|
+
...props,
|
|
488
|
+
children: [
|
|
489
|
+
/* @__PURE__ */ jsx(ArrowLeft, {}),
|
|
490
|
+
/* @__PURE__ */ jsx("span", { className: "sr-only", children: "Previous slide" })
|
|
491
|
+
]
|
|
492
|
+
}
|
|
493
|
+
);
|
|
494
|
+
}
|
|
495
|
+
function CarouselNext({
|
|
496
|
+
className,
|
|
497
|
+
variant = "outline",
|
|
498
|
+
size = "icon",
|
|
499
|
+
...props
|
|
500
|
+
}) {
|
|
501
|
+
const { orientation, scrollNext, canScrollNext } = useCarousel();
|
|
502
|
+
return /* @__PURE__ */ jsxs(
|
|
503
|
+
Button,
|
|
504
|
+
{
|
|
505
|
+
"data-slot": "carousel-next",
|
|
506
|
+
variant,
|
|
507
|
+
size,
|
|
508
|
+
className: cn(
|
|
509
|
+
"absolute size-8 rounded-full",
|
|
510
|
+
orientation === "horizontal" ? "top-1/2 -right-12 -translate-y-1/2" : "-bottom-12 left-1/2 -translate-x-1/2 rotate-90",
|
|
511
|
+
className
|
|
512
|
+
),
|
|
513
|
+
disabled: !canScrollNext,
|
|
514
|
+
onClick: scrollNext,
|
|
515
|
+
...props,
|
|
516
|
+
children: [
|
|
517
|
+
/* @__PURE__ */ jsx(ArrowRight, {}),
|
|
518
|
+
/* @__PURE__ */ jsx("span", { className: "sr-only", children: "Next slide" })
|
|
519
|
+
]
|
|
520
|
+
}
|
|
521
|
+
);
|
|
522
|
+
}
|
|
523
|
+
const Checkbox = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
524
|
+
CheckboxPrimitive.Root,
|
|
525
|
+
{
|
|
526
|
+
ref,
|
|
527
|
+
className: cn(
|
|
528
|
+
"peer h-4 w-4 shrink-0 rounded-sm border border-primary shadow focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
|
|
529
|
+
className
|
|
530
|
+
),
|
|
531
|
+
...props,
|
|
532
|
+
children: /* @__PURE__ */ jsx(
|
|
533
|
+
CheckboxPrimitive.Indicator,
|
|
534
|
+
{
|
|
535
|
+
className: cn("flex items-center justify-center text-current"),
|
|
536
|
+
children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" })
|
|
537
|
+
}
|
|
538
|
+
)
|
|
539
|
+
}
|
|
540
|
+
));
|
|
541
|
+
Checkbox.displayName = CheckboxPrimitive.Root.displayName;
|
|
542
|
+
function Collapsible({
|
|
543
|
+
...props
|
|
544
|
+
}) {
|
|
545
|
+
return /* @__PURE__ */ jsx(CollapsiblePrimitive.Root, { "data-slot": "collapsible", ...props });
|
|
546
|
+
}
|
|
547
|
+
function CollapsibleTrigger({
|
|
548
|
+
...props
|
|
549
|
+
}) {
|
|
550
|
+
return /* @__PURE__ */ jsx(
|
|
551
|
+
CollapsiblePrimitive.CollapsibleTrigger,
|
|
552
|
+
{
|
|
553
|
+
"data-slot": "collapsible-trigger",
|
|
554
|
+
...props
|
|
555
|
+
}
|
|
556
|
+
);
|
|
557
|
+
}
|
|
558
|
+
function CollapsibleContent({
|
|
559
|
+
...props
|
|
560
|
+
}) {
|
|
561
|
+
return /* @__PURE__ */ jsx(
|
|
562
|
+
CollapsiblePrimitive.CollapsibleContent,
|
|
563
|
+
{
|
|
564
|
+
"data-slot": "collapsible-content",
|
|
565
|
+
...props
|
|
566
|
+
}
|
|
567
|
+
);
|
|
568
|
+
}
|
|
569
|
+
function Dialog({
|
|
570
|
+
...props
|
|
571
|
+
}) {
|
|
572
|
+
return /* @__PURE__ */ jsx(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
|
|
573
|
+
}
|
|
574
|
+
function DialogTrigger({
|
|
575
|
+
...props
|
|
576
|
+
}) {
|
|
577
|
+
return /* @__PURE__ */ jsx(DialogPrimitive.Trigger, { "data-slot": "dialog-trigger", ...props });
|
|
578
|
+
}
|
|
579
|
+
function DialogPortal({
|
|
580
|
+
...props
|
|
581
|
+
}) {
|
|
582
|
+
return /* @__PURE__ */ jsx(DialogPrimitive.Portal, { "data-slot": "dialog-portal", ...props });
|
|
583
|
+
}
|
|
584
|
+
function DialogClose({
|
|
585
|
+
...props
|
|
586
|
+
}) {
|
|
587
|
+
return /* @__PURE__ */ jsx(DialogPrimitive.Close, { "data-slot": "dialog-close", ...props });
|
|
588
|
+
}
|
|
589
|
+
function DialogOverlay({
|
|
590
|
+
className,
|
|
591
|
+
...props
|
|
592
|
+
}) {
|
|
593
|
+
return /* @__PURE__ */ jsx(
|
|
594
|
+
DialogPrimitive.Overlay,
|
|
595
|
+
{
|
|
596
|
+
"data-slot": "dialog-overlay",
|
|
597
|
+
className: cn(
|
|
598
|
+
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
|
|
599
|
+
className
|
|
600
|
+
),
|
|
601
|
+
...props
|
|
602
|
+
}
|
|
603
|
+
);
|
|
604
|
+
}
|
|
605
|
+
function DialogContent({
|
|
606
|
+
className,
|
|
607
|
+
children,
|
|
608
|
+
showCloseButton = true,
|
|
609
|
+
...props
|
|
610
|
+
}) {
|
|
611
|
+
return /* @__PURE__ */ jsxs(DialogPortal, { "data-slot": "dialog-portal", children: [
|
|
612
|
+
/* @__PURE__ */ jsx(DialogOverlay, {}),
|
|
613
|
+
/* @__PURE__ */ jsxs(
|
|
614
|
+
DialogPrimitive.Content,
|
|
615
|
+
{
|
|
616
|
+
"data-slot": "dialog-content",
|
|
617
|
+
className: cn(
|
|
618
|
+
"bg-background 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 fixed top-[50%] left-[50%] z-50 grid translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200",
|
|
619
|
+
className
|
|
620
|
+
),
|
|
621
|
+
...props,
|
|
622
|
+
children: [
|
|
623
|
+
children,
|
|
624
|
+
showCloseButton && /* @__PURE__ */ jsxs(
|
|
625
|
+
DialogPrimitive.Close,
|
|
626
|
+
{
|
|
627
|
+
"data-slot": "dialog-close",
|
|
628
|
+
className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
629
|
+
children: [
|
|
630
|
+
/* @__PURE__ */ jsx(XIcon, {}),
|
|
631
|
+
/* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
|
|
632
|
+
]
|
|
633
|
+
}
|
|
634
|
+
)
|
|
635
|
+
]
|
|
636
|
+
}
|
|
637
|
+
)
|
|
638
|
+
] });
|
|
639
|
+
}
|
|
640
|
+
function DialogHeader({ className, ...props }) {
|
|
641
|
+
return /* @__PURE__ */ jsx(
|
|
642
|
+
"div",
|
|
643
|
+
{
|
|
644
|
+
"data-slot": "dialog-header",
|
|
645
|
+
className: cn("flex flex-col gap-2 text-center sm:text-left", className),
|
|
646
|
+
...props
|
|
647
|
+
}
|
|
648
|
+
);
|
|
649
|
+
}
|
|
650
|
+
function DialogFooter({ className, ...props }) {
|
|
651
|
+
return /* @__PURE__ */ jsx(
|
|
652
|
+
"div",
|
|
653
|
+
{
|
|
654
|
+
"data-slot": "dialog-footer",
|
|
655
|
+
className: cn(
|
|
656
|
+
"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
|
|
657
|
+
className
|
|
658
|
+
),
|
|
659
|
+
...props
|
|
660
|
+
}
|
|
661
|
+
);
|
|
662
|
+
}
|
|
663
|
+
function DialogTitle({
|
|
664
|
+
className,
|
|
665
|
+
...props
|
|
666
|
+
}) {
|
|
667
|
+
return /* @__PURE__ */ jsx(
|
|
668
|
+
DialogPrimitive.Title,
|
|
669
|
+
{
|
|
670
|
+
"data-slot": "dialog-title",
|
|
671
|
+
className: cn("text-lg leading-none font-semibold", className),
|
|
672
|
+
...props
|
|
673
|
+
}
|
|
674
|
+
);
|
|
675
|
+
}
|
|
676
|
+
function DialogDescription({
|
|
677
|
+
className,
|
|
678
|
+
...props
|
|
679
|
+
}) {
|
|
680
|
+
return /* @__PURE__ */ jsx(
|
|
681
|
+
DialogPrimitive.Description,
|
|
682
|
+
{
|
|
683
|
+
"data-slot": "dialog-description",
|
|
684
|
+
className: cn("text-muted-foreground text-sm", className),
|
|
685
|
+
...props
|
|
686
|
+
}
|
|
687
|
+
);
|
|
688
|
+
}
|
|
689
|
+
const DropdownMenu = DropdownMenuPrimitive.Root;
|
|
690
|
+
const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
|
|
691
|
+
const DropdownMenuGroup = DropdownMenuPrimitive.Group;
|
|
692
|
+
const DropdownMenuPortal = DropdownMenuPrimitive.Portal;
|
|
693
|
+
const DropdownMenuSub = DropdownMenuPrimitive.Sub;
|
|
694
|
+
const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
|
|
695
|
+
const DropdownMenuSubTrigger = React.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
696
|
+
DropdownMenuPrimitive.SubTrigger,
|
|
697
|
+
{
|
|
698
|
+
ref,
|
|
699
|
+
className: cn(
|
|
700
|
+
"flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
|
|
701
|
+
inset && "pl-8",
|
|
702
|
+
className
|
|
703
|
+
),
|
|
704
|
+
...props,
|
|
705
|
+
children: [
|
|
706
|
+
children,
|
|
707
|
+
/* @__PURE__ */ jsx(ChevronRight, { className: "ml-auto" })
|
|
708
|
+
]
|
|
709
|
+
}
|
|
710
|
+
));
|
|
711
|
+
DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
|
|
712
|
+
const DropdownMenuSubContent = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
713
|
+
DropdownMenuPrimitive.SubContent,
|
|
714
|
+
{
|
|
715
|
+
ref,
|
|
716
|
+
className: cn(
|
|
717
|
+
"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 origin-[--radix-dropdown-menu-content-transform-origin]",
|
|
718
|
+
className
|
|
719
|
+
),
|
|
720
|
+
...props
|
|
721
|
+
}
|
|
722
|
+
));
|
|
723
|
+
DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
|
|
724
|
+
const DropdownMenuContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
|
|
725
|
+
DropdownMenuPrimitive.Content,
|
|
726
|
+
{
|
|
727
|
+
ref,
|
|
728
|
+
sideOffset,
|
|
729
|
+
className: cn(
|
|
730
|
+
"z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md",
|
|
731
|
+
"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-dropdown-menu-content-transform-origin]",
|
|
732
|
+
className
|
|
733
|
+
),
|
|
734
|
+
...props
|
|
735
|
+
}
|
|
736
|
+
) }));
|
|
737
|
+
DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
|
|
738
|
+
const DropdownMenuItem = React.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
739
|
+
DropdownMenuPrimitive.Item,
|
|
740
|
+
{
|
|
741
|
+
ref,
|
|
742
|
+
className: cn(
|
|
743
|
+
"relative flex cursor-default select-none items-center gap-2 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 [&>svg]:size-4 [&>svg]:shrink-0",
|
|
744
|
+
inset && "pl-8",
|
|
745
|
+
className
|
|
746
|
+
),
|
|
747
|
+
...props
|
|
748
|
+
}
|
|
749
|
+
));
|
|
750
|
+
DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
|
|
751
|
+
const DropdownMenuCheckboxItem = React.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
752
|
+
DropdownMenuPrimitive.CheckboxItem,
|
|
753
|
+
{
|
|
754
|
+
ref,
|
|
755
|
+
className: cn(
|
|
756
|
+
"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",
|
|
757
|
+
className
|
|
758
|
+
),
|
|
759
|
+
checked,
|
|
760
|
+
...props,
|
|
761
|
+
children: [
|
|
762
|
+
/* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) }) }),
|
|
763
|
+
children
|
|
764
|
+
]
|
|
765
|
+
}
|
|
766
|
+
));
|
|
767
|
+
DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
|
|
768
|
+
const DropdownMenuRadioItem = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
769
|
+
DropdownMenuPrimitive.RadioItem,
|
|
770
|
+
{
|
|
771
|
+
ref,
|
|
772
|
+
className: cn(
|
|
773
|
+
"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",
|
|
774
|
+
className
|
|
775
|
+
),
|
|
776
|
+
...props,
|
|
777
|
+
children: [
|
|
778
|
+
/* @__PURE__ */ jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Circle, { className: "h-2 w-2 fill-current" }) }) }),
|
|
779
|
+
children
|
|
780
|
+
]
|
|
781
|
+
}
|
|
782
|
+
));
|
|
783
|
+
DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
|
|
784
|
+
const DropdownMenuLabel = React.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
785
|
+
DropdownMenuPrimitive.Label,
|
|
786
|
+
{
|
|
787
|
+
ref,
|
|
788
|
+
className: cn(
|
|
789
|
+
"px-2 py-1.5 text-sm font-semibold",
|
|
790
|
+
inset && "pl-8",
|
|
791
|
+
className
|
|
792
|
+
),
|
|
793
|
+
...props
|
|
794
|
+
}
|
|
795
|
+
));
|
|
796
|
+
DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
|
|
797
|
+
const DropdownMenuSeparator = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
798
|
+
DropdownMenuPrimitive.Separator,
|
|
799
|
+
{
|
|
800
|
+
ref,
|
|
801
|
+
className: cn("-mx-1 my-1 h-px bg-muted", className),
|
|
802
|
+
...props
|
|
803
|
+
}
|
|
804
|
+
));
|
|
805
|
+
DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
|
|
806
|
+
const DropdownMenuShortcut = ({
|
|
807
|
+
className,
|
|
808
|
+
...props
|
|
809
|
+
}) => {
|
|
810
|
+
return /* @__PURE__ */ jsx(
|
|
811
|
+
"span",
|
|
812
|
+
{
|
|
813
|
+
className: cn("ml-auto text-xs tracking-widest opacity-60", className),
|
|
814
|
+
...props
|
|
815
|
+
}
|
|
816
|
+
);
|
|
817
|
+
};
|
|
818
|
+
DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
|
|
819
|
+
const labelVariants = cva(
|
|
820
|
+
"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
|
|
821
|
+
);
|
|
822
|
+
const Label = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
823
|
+
LabelPrimitive.Root,
|
|
824
|
+
{
|
|
825
|
+
ref,
|
|
826
|
+
className: cn(labelVariants(), className),
|
|
827
|
+
...props
|
|
828
|
+
}
|
|
829
|
+
));
|
|
830
|
+
Label.displayName = LabelPrimitive.Root.displayName;
|
|
831
|
+
const Form = FormProvider;
|
|
832
|
+
const FormFieldContext = React.createContext(
|
|
833
|
+
{}
|
|
834
|
+
);
|
|
835
|
+
const FormField = ({
|
|
836
|
+
...props
|
|
837
|
+
}) => {
|
|
838
|
+
return /* @__PURE__ */ jsx(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx(Controller, { ...props }) });
|
|
839
|
+
};
|
|
840
|
+
const useFormField = () => {
|
|
841
|
+
const fieldContext = React.useContext(FormFieldContext);
|
|
842
|
+
const itemContext = React.useContext(FormItemContext);
|
|
843
|
+
const { getFieldState } = useFormContext();
|
|
844
|
+
const formState = useFormState({ name: fieldContext.name });
|
|
845
|
+
const fieldState = getFieldState(fieldContext.name, formState);
|
|
846
|
+
if (!fieldContext) {
|
|
847
|
+
throw new Error("useFormField should be used within <FormField>");
|
|
848
|
+
}
|
|
849
|
+
const { id } = itemContext;
|
|
850
|
+
return {
|
|
851
|
+
id,
|
|
852
|
+
name: fieldContext.name,
|
|
853
|
+
formItemId: `${id}-form-item`,
|
|
854
|
+
formDescriptionId: `${id}-form-item-description`,
|
|
855
|
+
formMessageId: `${id}-form-item-message`,
|
|
856
|
+
...fieldState
|
|
857
|
+
};
|
|
858
|
+
};
|
|
859
|
+
const FormItemContext = React.createContext(
|
|
860
|
+
{}
|
|
861
|
+
);
|
|
862
|
+
function FormItem({ className, ...props }) {
|
|
863
|
+
const id = React.useId();
|
|
864
|
+
return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ jsx(
|
|
865
|
+
"div",
|
|
866
|
+
{
|
|
867
|
+
"data-slot": "form-item",
|
|
868
|
+
className: cn("grid gap-2", className),
|
|
869
|
+
...props
|
|
870
|
+
}
|
|
871
|
+
) });
|
|
872
|
+
}
|
|
873
|
+
function FormLabel({
|
|
874
|
+
className,
|
|
875
|
+
...props
|
|
876
|
+
}) {
|
|
877
|
+
const { error, formItemId } = useFormField();
|
|
878
|
+
return /* @__PURE__ */ jsx(
|
|
879
|
+
Label,
|
|
880
|
+
{
|
|
881
|
+
"data-slot": "form-label",
|
|
882
|
+
"data-error": !!error,
|
|
883
|
+
className: cn("data-[error=true]:text-destructive", className),
|
|
884
|
+
htmlFor: formItemId,
|
|
885
|
+
...props
|
|
886
|
+
}
|
|
887
|
+
);
|
|
888
|
+
}
|
|
889
|
+
function FormControl({ ...props }) {
|
|
890
|
+
const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
|
|
891
|
+
return /* @__PURE__ */ jsx(
|
|
892
|
+
Slot,
|
|
893
|
+
{
|
|
894
|
+
"data-slot": "form-control",
|
|
895
|
+
id: formItemId,
|
|
896
|
+
"aria-describedby": !error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`,
|
|
897
|
+
"aria-invalid": !!error,
|
|
898
|
+
...props
|
|
899
|
+
}
|
|
900
|
+
);
|
|
901
|
+
}
|
|
902
|
+
function FormDescription({ className, ...props }) {
|
|
903
|
+
const { formDescriptionId } = useFormField();
|
|
904
|
+
return /* @__PURE__ */ jsx(
|
|
905
|
+
"p",
|
|
906
|
+
{
|
|
907
|
+
"data-slot": "form-description",
|
|
908
|
+
id: formDescriptionId,
|
|
909
|
+
className: cn("text-muted-foreground text-sm", className),
|
|
910
|
+
...props
|
|
911
|
+
}
|
|
912
|
+
);
|
|
913
|
+
}
|
|
914
|
+
function FormMessage({ className, ...props }) {
|
|
915
|
+
const { error, formMessageId } = useFormField();
|
|
916
|
+
const body = error ? String(error?.message ?? "") : props.children;
|
|
917
|
+
if (!body) {
|
|
918
|
+
return null;
|
|
919
|
+
}
|
|
920
|
+
return /* @__PURE__ */ jsx(
|
|
921
|
+
"p",
|
|
922
|
+
{
|
|
923
|
+
"data-slot": "form-message",
|
|
924
|
+
id: formMessageId,
|
|
925
|
+
className: cn("text-destructive text-sm", className),
|
|
926
|
+
...props,
|
|
927
|
+
children: body
|
|
928
|
+
}
|
|
929
|
+
);
|
|
930
|
+
}
|
|
931
|
+
function HoverCard({
|
|
932
|
+
...props
|
|
933
|
+
}) {
|
|
934
|
+
return /* @__PURE__ */ jsx(HoverCardPrimitive.Root, { "data-slot": "hover-card", ...props });
|
|
935
|
+
}
|
|
936
|
+
function HoverCardTrigger({
|
|
937
|
+
...props
|
|
938
|
+
}) {
|
|
939
|
+
return /* @__PURE__ */ jsx(HoverCardPrimitive.Trigger, { "data-slot": "hover-card-trigger", ...props });
|
|
940
|
+
}
|
|
941
|
+
function HoverCardContent({
|
|
942
|
+
className,
|
|
943
|
+
align = "center",
|
|
944
|
+
sideOffset = 4,
|
|
945
|
+
...props
|
|
946
|
+
}) {
|
|
947
|
+
return /* @__PURE__ */ jsx(HoverCardPrimitive.Portal, { "data-slot": "hover-card-portal", children: /* @__PURE__ */ jsx(
|
|
948
|
+
HoverCardPrimitive.Content,
|
|
949
|
+
{
|
|
950
|
+
"data-slot": "hover-card-content",
|
|
951
|
+
align,
|
|
952
|
+
sideOffset,
|
|
953
|
+
className: cn(
|
|
954
|
+
"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 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
|
|
955
|
+
className
|
|
956
|
+
),
|
|
957
|
+
...props
|
|
958
|
+
}
|
|
959
|
+
) });
|
|
960
|
+
}
|
|
961
|
+
const Input = React.forwardRef(
|
|
962
|
+
({ className, type, ...props }, ref) => {
|
|
963
|
+
return /* @__PURE__ */ jsx(
|
|
964
|
+
"input",
|
|
965
|
+
{
|
|
966
|
+
type,
|
|
967
|
+
className: cn(
|
|
968
|
+
"flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
|
969
|
+
className
|
|
970
|
+
),
|
|
971
|
+
ref,
|
|
972
|
+
...props
|
|
973
|
+
}
|
|
974
|
+
);
|
|
975
|
+
}
|
|
976
|
+
);
|
|
977
|
+
Input.displayName = "Input";
|
|
978
|
+
function Pagination({ className, ...props }) {
|
|
979
|
+
return /* @__PURE__ */ jsx(
|
|
980
|
+
"nav",
|
|
981
|
+
{
|
|
982
|
+
role: "navigation",
|
|
983
|
+
"aria-label": "pagination",
|
|
984
|
+
"data-slot": "pagination",
|
|
985
|
+
className: cn("mx-auto flex w-full justify-center", className),
|
|
986
|
+
...props
|
|
987
|
+
}
|
|
988
|
+
);
|
|
989
|
+
}
|
|
990
|
+
function PaginationContent({
|
|
991
|
+
className,
|
|
992
|
+
...props
|
|
993
|
+
}) {
|
|
994
|
+
return /* @__PURE__ */ jsx(
|
|
995
|
+
"ul",
|
|
996
|
+
{
|
|
997
|
+
"data-slot": "pagination-content",
|
|
998
|
+
className: cn("flex flex-row items-center gap-1", className),
|
|
999
|
+
...props
|
|
1000
|
+
}
|
|
1001
|
+
);
|
|
1002
|
+
}
|
|
1003
|
+
function PaginationItem({ ...props }) {
|
|
1004
|
+
return /* @__PURE__ */ jsx("li", { "data-slot": "pagination-item", ...props });
|
|
1005
|
+
}
|
|
1006
|
+
function PaginationLink({
|
|
1007
|
+
className,
|
|
1008
|
+
isActive,
|
|
1009
|
+
size = "icon",
|
|
1010
|
+
...props
|
|
1011
|
+
}) {
|
|
1012
|
+
return /* @__PURE__ */ jsx(
|
|
1013
|
+
"a",
|
|
1014
|
+
{
|
|
1015
|
+
"aria-current": isActive ? "page" : void 0,
|
|
1016
|
+
"data-slot": "pagination-link",
|
|
1017
|
+
"data-active": isActive,
|
|
1018
|
+
className: cn(
|
|
1019
|
+
buttonVariants({
|
|
1020
|
+
variant: isActive ? "outline" : "ghost",
|
|
1021
|
+
size
|
|
1022
|
+
}),
|
|
1023
|
+
className
|
|
1024
|
+
),
|
|
1025
|
+
...props
|
|
1026
|
+
}
|
|
1027
|
+
);
|
|
1028
|
+
}
|
|
1029
|
+
function PaginationPrevious({
|
|
1030
|
+
className,
|
|
1031
|
+
...props
|
|
1032
|
+
}) {
|
|
1033
|
+
return /* @__PURE__ */ jsxs(
|
|
1034
|
+
PaginationLink,
|
|
1035
|
+
{
|
|
1036
|
+
"aria-label": "Go to previous page",
|
|
1037
|
+
size: "default",
|
|
1038
|
+
className: cn("gap-1 px-2.5 sm:pl-2.5", className),
|
|
1039
|
+
...props,
|
|
1040
|
+
children: [
|
|
1041
|
+
/* @__PURE__ */ jsx(ChevronLeftIcon, {}),
|
|
1042
|
+
/* @__PURE__ */ jsx("span", { className: "hidden sm:block", children: "Previous" })
|
|
1043
|
+
]
|
|
1044
|
+
}
|
|
1045
|
+
);
|
|
1046
|
+
}
|
|
1047
|
+
function PaginationNext({
|
|
1048
|
+
className,
|
|
1049
|
+
...props
|
|
1050
|
+
}) {
|
|
1051
|
+
return /* @__PURE__ */ jsxs(
|
|
1052
|
+
PaginationLink,
|
|
1053
|
+
{
|
|
1054
|
+
"aria-label": "Go to next page",
|
|
1055
|
+
size: "default",
|
|
1056
|
+
className: cn("gap-1 px-2.5 sm:pr-2.5", className),
|
|
1057
|
+
...props,
|
|
1058
|
+
children: [
|
|
1059
|
+
/* @__PURE__ */ jsx("span", { className: "hidden sm:block", children: "Next" }),
|
|
1060
|
+
/* @__PURE__ */ jsx(ChevronRightIcon, {})
|
|
1061
|
+
]
|
|
1062
|
+
}
|
|
1063
|
+
);
|
|
1064
|
+
}
|
|
1065
|
+
function PaginationEllipsis({
|
|
1066
|
+
className,
|
|
1067
|
+
...props
|
|
1068
|
+
}) {
|
|
1069
|
+
return /* @__PURE__ */ jsxs(
|
|
1070
|
+
"span",
|
|
1071
|
+
{
|
|
1072
|
+
"aria-hidden": true,
|
|
1073
|
+
"data-slot": "pagination-ellipsis",
|
|
1074
|
+
className: cn("flex size-9 items-center justify-center", className),
|
|
1075
|
+
...props,
|
|
1076
|
+
children: [
|
|
1077
|
+
/* @__PURE__ */ jsx(MoreHorizontalIcon, { className: "size-4" }),
|
|
1078
|
+
/* @__PURE__ */ jsx("span", { className: "sr-only", children: "More pages" })
|
|
1079
|
+
]
|
|
1080
|
+
}
|
|
1081
|
+
);
|
|
1082
|
+
}
|
|
1083
|
+
function Popover({
|
|
1084
|
+
...props
|
|
1085
|
+
}) {
|
|
1086
|
+
return /* @__PURE__ */ jsx(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
|
|
1087
|
+
}
|
|
1088
|
+
function PopoverTrigger({
|
|
1089
|
+
...props
|
|
1090
|
+
}) {
|
|
1091
|
+
return /* @__PURE__ */ jsx(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
|
|
1092
|
+
}
|
|
1093
|
+
function PopoverContent({
|
|
1094
|
+
className,
|
|
1095
|
+
align = "center",
|
|
1096
|
+
sideOffset = 4,
|
|
1097
|
+
...props
|
|
1098
|
+
}) {
|
|
1099
|
+
return /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
|
|
1100
|
+
PopoverPrimitive.Content,
|
|
1101
|
+
{
|
|
1102
|
+
"data-slot": "popover-content",
|
|
1103
|
+
align,
|
|
1104
|
+
sideOffset,
|
|
1105
|
+
className: cn(
|
|
1106
|
+
"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 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden",
|
|
1107
|
+
className
|
|
1108
|
+
),
|
|
1109
|
+
...props
|
|
1110
|
+
}
|
|
1111
|
+
) });
|
|
1112
|
+
}
|
|
1113
|
+
function PopoverAnchor({
|
|
1114
|
+
...props
|
|
1115
|
+
}) {
|
|
1116
|
+
return /* @__PURE__ */ jsx(PopoverPrimitive.Anchor, { "data-slot": "popover-anchor", ...props });
|
|
1117
|
+
}
|
|
1118
|
+
function Progress({
|
|
1119
|
+
className,
|
|
1120
|
+
value,
|
|
1121
|
+
...props
|
|
1122
|
+
}) {
|
|
1123
|
+
return /* @__PURE__ */ jsx(
|
|
1124
|
+
ProgressPrimitive.Root,
|
|
1125
|
+
{
|
|
1126
|
+
"data-slot": "progress",
|
|
1127
|
+
className: cn(
|
|
1128
|
+
"bg-primary/20 relative h-2 w-full overflow-hidden rounded-full",
|
|
1129
|
+
className
|
|
1130
|
+
),
|
|
1131
|
+
...props,
|
|
1132
|
+
children: /* @__PURE__ */ jsx(
|
|
1133
|
+
ProgressPrimitive.Indicator,
|
|
1134
|
+
{
|
|
1135
|
+
"data-slot": "progress-indicator",
|
|
1136
|
+
className: "bg-primary h-full w-full flex-1 transition-all",
|
|
1137
|
+
style: { transform: `translateX(-${100 - (value || 0)}%)` }
|
|
1138
|
+
}
|
|
1139
|
+
)
|
|
1140
|
+
}
|
|
1141
|
+
);
|
|
1142
|
+
}
|
|
1143
|
+
const ResizablePanelGroup = React.forwardRef(({ className, direction = "horizontal", children, ...props }, ref) => {
|
|
1144
|
+
return /* @__PURE__ */ jsx(
|
|
1145
|
+
"div",
|
|
1146
|
+
{
|
|
1147
|
+
ref,
|
|
1148
|
+
className: cn(
|
|
1149
|
+
"flex h-full w-full",
|
|
1150
|
+
direction === "horizontal" ? "flex-row" : "flex-col",
|
|
1151
|
+
className
|
|
1152
|
+
),
|
|
1153
|
+
...props,
|
|
1154
|
+
children
|
|
1155
|
+
}
|
|
1156
|
+
);
|
|
1157
|
+
});
|
|
1158
|
+
ResizablePanelGroup.displayName = "ResizablePanelGroup";
|
|
1159
|
+
const ResizablePanel = React.forwardRef(
|
|
1160
|
+
({
|
|
1161
|
+
className,
|
|
1162
|
+
defaultSize = 50,
|
|
1163
|
+
minSize = 10,
|
|
1164
|
+
maxSize = 90,
|
|
1165
|
+
collapsible = false,
|
|
1166
|
+
collapsed = false,
|
|
1167
|
+
onCollapse,
|
|
1168
|
+
onResize,
|
|
1169
|
+
children,
|
|
1170
|
+
style,
|
|
1171
|
+
...props
|
|
1172
|
+
}, ref) => {
|
|
1173
|
+
const [size, setSize] = React.useState(collapsed ? 0 : defaultSize);
|
|
1174
|
+
React.useEffect(() => {
|
|
1175
|
+
setSize(collapsed ? 0 : defaultSize);
|
|
1176
|
+
}, [collapsed, defaultSize]);
|
|
1177
|
+
return /* @__PURE__ */ jsx(
|
|
1178
|
+
"div",
|
|
1179
|
+
{
|
|
1180
|
+
ref,
|
|
1181
|
+
className: cn(
|
|
1182
|
+
"flex flex-col overflow-hidden transition-all duration-200 ease-in-out",
|
|
1183
|
+
collapsed && "min-w-0",
|
|
1184
|
+
className
|
|
1185
|
+
),
|
|
1186
|
+
style: {
|
|
1187
|
+
...style,
|
|
1188
|
+
flexBasis: collapsed ? "0px" : `${size}%`,
|
|
1189
|
+
minWidth: collapsed ? "0px" : `${minSize}%`,
|
|
1190
|
+
maxWidth: collapsed ? "0px" : `${maxSize}%`
|
|
1191
|
+
},
|
|
1192
|
+
...props,
|
|
1193
|
+
children: !collapsed && children
|
|
1194
|
+
}
|
|
1195
|
+
);
|
|
1196
|
+
}
|
|
1197
|
+
);
|
|
1198
|
+
ResizablePanel.displayName = "ResizablePanel";
|
|
1199
|
+
const ResizableHandle = React.forwardRef(
|
|
1200
|
+
({ className, direction = "horizontal", disabled = false, onDrag, ...props }, ref) => {
|
|
1201
|
+
const [isDragging, setIsDragging] = React.useState(false);
|
|
1202
|
+
const [dragStart, setDragStart] = React.useState({ x: 0, y: 0 });
|
|
1203
|
+
const handleMouseDown = React.useCallback(
|
|
1204
|
+
(e) => {
|
|
1205
|
+
if (disabled) return;
|
|
1206
|
+
setIsDragging(true);
|
|
1207
|
+
setDragStart({ x: e.clientX, y: e.clientY });
|
|
1208
|
+
e.preventDefault();
|
|
1209
|
+
},
|
|
1210
|
+
[disabled]
|
|
1211
|
+
);
|
|
1212
|
+
const handleMouseMove = React.useCallback(
|
|
1213
|
+
(e) => {
|
|
1214
|
+
if (!isDragging) return;
|
|
1215
|
+
const delta = direction === "horizontal" ? e.clientX - dragStart.x : e.clientY - dragStart.y;
|
|
1216
|
+
onDrag?.(delta);
|
|
1217
|
+
},
|
|
1218
|
+
[isDragging, direction, dragStart, onDrag]
|
|
1219
|
+
);
|
|
1220
|
+
const handleMouseUp = React.useCallback(() => {
|
|
1221
|
+
setIsDragging(false);
|
|
1222
|
+
}, []);
|
|
1223
|
+
React.useEffect(() => {
|
|
1224
|
+
if (isDragging) {
|
|
1225
|
+
document.addEventListener("mousemove", handleMouseMove);
|
|
1226
|
+
document.addEventListener("mouseup", handleMouseUp);
|
|
1227
|
+
return () => {
|
|
1228
|
+
document.removeEventListener("mousemove", handleMouseMove);
|
|
1229
|
+
document.removeEventListener("mouseup", handleMouseUp);
|
|
1230
|
+
};
|
|
1231
|
+
}
|
|
1232
|
+
}, [isDragging, handleMouseMove, handleMouseUp]);
|
|
1233
|
+
return /* @__PURE__ */ jsx(
|
|
1234
|
+
"div",
|
|
1235
|
+
{
|
|
1236
|
+
ref,
|
|
1237
|
+
className: cn(
|
|
1238
|
+
"relative flex items-center justify-center bg-border transition-colors",
|
|
1239
|
+
direction === "horizontal" ? "w-1 cursor-col-resize hover:bg-border/80 active:bg-border/60" : "h-1 cursor-row-resize hover:bg-border/80 active:bg-border/60",
|
|
1240
|
+
disabled && "cursor-not-allowed opacity-50",
|
|
1241
|
+
isDragging && "bg-border/60",
|
|
1242
|
+
className
|
|
1243
|
+
),
|
|
1244
|
+
onMouseDown: handleMouseDown,
|
|
1245
|
+
...props,
|
|
1246
|
+
children: /* @__PURE__ */ jsx(
|
|
1247
|
+
"div",
|
|
1248
|
+
{
|
|
1249
|
+
className: cn(
|
|
1250
|
+
"absolute inset-0 flex items-center justify-center",
|
|
1251
|
+
direction === "horizontal" ? "w-3 -translate-x-1" : "h-3 -translate-y-1"
|
|
1252
|
+
),
|
|
1253
|
+
children: /* @__PURE__ */ jsx(
|
|
1254
|
+
GripVertical,
|
|
1255
|
+
{
|
|
1256
|
+
className: cn(
|
|
1257
|
+
"h-3 w-3 text-muted-foreground/40",
|
|
1258
|
+
direction === "vertical" && "rotate-90"
|
|
1259
|
+
)
|
|
1260
|
+
}
|
|
1261
|
+
)
|
|
1262
|
+
}
|
|
1263
|
+
)
|
|
1264
|
+
}
|
|
1265
|
+
);
|
|
1266
|
+
}
|
|
1267
|
+
);
|
|
1268
|
+
ResizableHandle.displayName = "ResizableHandle";
|
|
1269
|
+
const ScrollArea = React.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
1270
|
+
ScrollAreaPrimitive.Root,
|
|
1271
|
+
{
|
|
1272
|
+
ref,
|
|
1273
|
+
className: cn("relative overflow-hidden scroll-smooth", className),
|
|
1274
|
+
...props,
|
|
1275
|
+
children: [
|
|
1276
|
+
/* @__PURE__ */ jsx(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit] scroll-smooth", children }),
|
|
1277
|
+
/* @__PURE__ */ jsx(ScrollBar, {}),
|
|
1278
|
+
/* @__PURE__ */ jsx(ScrollAreaPrimitive.Corner, {})
|
|
1279
|
+
]
|
|
1280
|
+
}
|
|
1281
|
+
));
|
|
1282
|
+
ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
|
|
1283
|
+
const ScrollBar = React.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1284
|
+
ScrollAreaPrimitive.ScrollAreaScrollbar,
|
|
1285
|
+
{
|
|
1286
|
+
ref,
|
|
1287
|
+
orientation,
|
|
1288
|
+
className: cn(
|
|
1289
|
+
"flex touch-none select-none transition-colors",
|
|
1290
|
+
orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]",
|
|
1291
|
+
orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]",
|
|
1292
|
+
className
|
|
1293
|
+
),
|
|
1294
|
+
...props,
|
|
1295
|
+
children: /* @__PURE__ */ jsx(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
|
|
1296
|
+
}
|
|
1297
|
+
));
|
|
1298
|
+
ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
|
|
1299
|
+
function Select({
|
|
1300
|
+
...props
|
|
1301
|
+
}) {
|
|
1302
|
+
return /* @__PURE__ */ jsx(SelectPrimitive.Root, { "data-slot": "select", ...props });
|
|
1303
|
+
}
|
|
1304
|
+
function SelectGroup({
|
|
1305
|
+
...props
|
|
1306
|
+
}) {
|
|
1307
|
+
return /* @__PURE__ */ jsx(SelectPrimitive.Group, { "data-slot": "select-group", ...props });
|
|
1308
|
+
}
|
|
1309
|
+
function SelectValue({
|
|
1310
|
+
...props
|
|
1311
|
+
}) {
|
|
1312
|
+
return /* @__PURE__ */ jsx(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
|
|
1313
|
+
}
|
|
1314
|
+
function SelectTrigger({
|
|
1315
|
+
className,
|
|
1316
|
+
size = "default",
|
|
1317
|
+
children,
|
|
1318
|
+
...props
|
|
1319
|
+
}) {
|
|
1320
|
+
return /* @__PURE__ */ jsxs(
|
|
1321
|
+
SelectPrimitive.Trigger,
|
|
1322
|
+
{
|
|
1323
|
+
"data-slot": "select-trigger",
|
|
1324
|
+
"data-size": size,
|
|
1325
|
+
className: cn(
|
|
1326
|
+
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
1327
|
+
className
|
|
1328
|
+
),
|
|
1329
|
+
...props,
|
|
1330
|
+
children: [
|
|
1331
|
+
children,
|
|
1332
|
+
/* @__PURE__ */ jsx(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-4 opacity-50" }) })
|
|
1333
|
+
]
|
|
1334
|
+
}
|
|
1335
|
+
);
|
|
1336
|
+
}
|
|
1337
|
+
function SelectContent({
|
|
1338
|
+
className,
|
|
1339
|
+
children,
|
|
1340
|
+
position = "popper",
|
|
1341
|
+
...props
|
|
1342
|
+
}) {
|
|
1343
|
+
return /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
|
|
1344
|
+
SelectPrimitive.Content,
|
|
1345
|
+
{
|
|
1346
|
+
"data-slot": "select-content",
|
|
1347
|
+
className: cn(
|
|
1348
|
+
"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 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
|
|
1349
|
+
position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
|
1350
|
+
className
|
|
1351
|
+
),
|
|
1352
|
+
position,
|
|
1353
|
+
...props,
|
|
1354
|
+
children: [
|
|
1355
|
+
/* @__PURE__ */ jsx(SelectScrollUpButton, {}),
|
|
1356
|
+
/* @__PURE__ */ jsx(
|
|
1357
|
+
SelectPrimitive.Viewport,
|
|
1358
|
+
{
|
|
1359
|
+
className: cn(
|
|
1360
|
+
"p-1",
|
|
1361
|
+
position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
|
|
1362
|
+
),
|
|
1363
|
+
children
|
|
1364
|
+
}
|
|
1365
|
+
),
|
|
1366
|
+
/* @__PURE__ */ jsx(SelectScrollDownButton, {})
|
|
1367
|
+
]
|
|
1368
|
+
}
|
|
1369
|
+
) });
|
|
1370
|
+
}
|
|
1371
|
+
function SelectLabel({
|
|
1372
|
+
className,
|
|
1373
|
+
...props
|
|
1374
|
+
}) {
|
|
1375
|
+
return /* @__PURE__ */ jsx(
|
|
1376
|
+
SelectPrimitive.Label,
|
|
1377
|
+
{
|
|
1378
|
+
"data-slot": "select-label",
|
|
1379
|
+
className: cn("text-muted-foreground px-2 py-1.5 text-xs", className),
|
|
1380
|
+
...props
|
|
1381
|
+
}
|
|
1382
|
+
);
|
|
1383
|
+
}
|
|
1384
|
+
function SelectItem({
|
|
1385
|
+
className,
|
|
1386
|
+
children,
|
|
1387
|
+
...props
|
|
1388
|
+
}) {
|
|
1389
|
+
return /* @__PURE__ */ jsxs(
|
|
1390
|
+
SelectPrimitive.Item,
|
|
1391
|
+
{
|
|
1392
|
+
"data-slot": "select-item",
|
|
1393
|
+
className: cn(
|
|
1394
|
+
"focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 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 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
|
1395
|
+
className
|
|
1396
|
+
),
|
|
1397
|
+
...props,
|
|
1398
|
+
children: [
|
|
1399
|
+
/* @__PURE__ */ jsx("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(CheckIcon, { className: "size-4" }) }) }),
|
|
1400
|
+
/* @__PURE__ */ jsx(SelectPrimitive.ItemText, { children })
|
|
1401
|
+
]
|
|
1402
|
+
}
|
|
1403
|
+
);
|
|
1404
|
+
}
|
|
1405
|
+
function SelectSeparator({
|
|
1406
|
+
className,
|
|
1407
|
+
...props
|
|
1408
|
+
}) {
|
|
1409
|
+
return /* @__PURE__ */ jsx(
|
|
1410
|
+
SelectPrimitive.Separator,
|
|
1411
|
+
{
|
|
1412
|
+
"data-slot": "select-separator",
|
|
1413
|
+
className: cn("bg-border pointer-events-none -mx-1 my-1 h-px", className),
|
|
1414
|
+
...props
|
|
1415
|
+
}
|
|
1416
|
+
);
|
|
1417
|
+
}
|
|
1418
|
+
function SelectScrollUpButton({
|
|
1419
|
+
className,
|
|
1420
|
+
...props
|
|
1421
|
+
}) {
|
|
1422
|
+
return /* @__PURE__ */ jsx(
|
|
1423
|
+
SelectPrimitive.ScrollUpButton,
|
|
1424
|
+
{
|
|
1425
|
+
"data-slot": "select-scroll-up-button",
|
|
1426
|
+
className: cn(
|
|
1427
|
+
"flex cursor-default items-center justify-center py-1",
|
|
1428
|
+
className
|
|
1429
|
+
),
|
|
1430
|
+
...props,
|
|
1431
|
+
children: /* @__PURE__ */ jsx(ChevronUpIcon, { className: "size-4" })
|
|
1432
|
+
}
|
|
1433
|
+
);
|
|
1434
|
+
}
|
|
1435
|
+
function SelectScrollDownButton({
|
|
1436
|
+
className,
|
|
1437
|
+
...props
|
|
1438
|
+
}) {
|
|
1439
|
+
return /* @__PURE__ */ jsx(
|
|
1440
|
+
SelectPrimitive.ScrollDownButton,
|
|
1441
|
+
{
|
|
1442
|
+
"data-slot": "select-scroll-down-button",
|
|
1443
|
+
className: cn(
|
|
1444
|
+
"flex cursor-default items-center justify-center py-1",
|
|
1445
|
+
className
|
|
1446
|
+
),
|
|
1447
|
+
...props,
|
|
1448
|
+
children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-4" })
|
|
1449
|
+
}
|
|
1450
|
+
);
|
|
1451
|
+
}
|
|
1452
|
+
function Separator({
|
|
1453
|
+
className,
|
|
1454
|
+
orientation = "horizontal",
|
|
1455
|
+
decorative = true,
|
|
1456
|
+
...props
|
|
1457
|
+
}) {
|
|
1458
|
+
return /* @__PURE__ */ jsx(
|
|
1459
|
+
SeparatorPrimitive.Root,
|
|
1460
|
+
{
|
|
1461
|
+
"data-slot": "separator",
|
|
1462
|
+
decorative,
|
|
1463
|
+
orientation,
|
|
1464
|
+
className: cn(
|
|
1465
|
+
"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
|
|
1466
|
+
className
|
|
1467
|
+
),
|
|
1468
|
+
...props
|
|
1469
|
+
}
|
|
1470
|
+
);
|
|
1471
|
+
}
|
|
1472
|
+
function Sheet({ ...props }) {
|
|
1473
|
+
return /* @__PURE__ */ jsx(DialogPrimitive.Root, { "data-slot": "sheet", ...props });
|
|
1474
|
+
}
|
|
1475
|
+
function SheetTrigger({
|
|
1476
|
+
...props
|
|
1477
|
+
}) {
|
|
1478
|
+
return /* @__PURE__ */ jsx(DialogPrimitive.Trigger, { "data-slot": "sheet-trigger", ...props });
|
|
1479
|
+
}
|
|
1480
|
+
function SheetClose({
|
|
1481
|
+
...props
|
|
1482
|
+
}) {
|
|
1483
|
+
return /* @__PURE__ */ jsx(DialogPrimitive.Close, { "data-slot": "sheet-close", ...props });
|
|
1484
|
+
}
|
|
1485
|
+
function SheetPortal({
|
|
1486
|
+
...props
|
|
1487
|
+
}) {
|
|
1488
|
+
return /* @__PURE__ */ jsx(DialogPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
|
|
1489
|
+
}
|
|
1490
|
+
function SheetOverlay({
|
|
1491
|
+
className,
|
|
1492
|
+
...props
|
|
1493
|
+
}) {
|
|
1494
|
+
return /* @__PURE__ */ jsx(
|
|
1495
|
+
DialogPrimitive.Overlay,
|
|
1496
|
+
{
|
|
1497
|
+
"data-slot": "sheet-overlay",
|
|
1498
|
+
className: cn(
|
|
1499
|
+
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
|
|
1500
|
+
className
|
|
1501
|
+
),
|
|
1502
|
+
...props
|
|
1503
|
+
}
|
|
1504
|
+
);
|
|
1505
|
+
}
|
|
1506
|
+
function SheetContent({
|
|
1507
|
+
className,
|
|
1508
|
+
children,
|
|
1509
|
+
side = "right",
|
|
1510
|
+
...props
|
|
1511
|
+
}) {
|
|
1512
|
+
return /* @__PURE__ */ jsxs(SheetPortal, { children: [
|
|
1513
|
+
/* @__PURE__ */ jsx(SheetOverlay, {}),
|
|
1514
|
+
/* @__PURE__ */ jsxs(
|
|
1515
|
+
DialogPrimitive.Content,
|
|
1516
|
+
{
|
|
1517
|
+
"data-slot": "sheet-content",
|
|
1518
|
+
className: cn(
|
|
1519
|
+
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
|
|
1520
|
+
side === "right" && "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm",
|
|
1521
|
+
side === "left" && "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
|
|
1522
|
+
side === "top" && "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b",
|
|
1523
|
+
side === "bottom" && "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t",
|
|
1524
|
+
className
|
|
1525
|
+
),
|
|
1526
|
+
...props,
|
|
1527
|
+
children: [
|
|
1528
|
+
children,
|
|
1529
|
+
/* @__PURE__ */ jsxs(DialogPrimitive.Close, { className: "ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none", children: [
|
|
1530
|
+
/* @__PURE__ */ jsx(XIcon, { className: "size-4" }),
|
|
1531
|
+
/* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
|
|
1532
|
+
] })
|
|
1533
|
+
]
|
|
1534
|
+
}
|
|
1535
|
+
)
|
|
1536
|
+
] });
|
|
1537
|
+
}
|
|
1538
|
+
function SheetHeader({ className, ...props }) {
|
|
1539
|
+
return /* @__PURE__ */ jsx(
|
|
1540
|
+
"div",
|
|
1541
|
+
{
|
|
1542
|
+
"data-slot": "sheet-header",
|
|
1543
|
+
className: cn("flex flex-col gap-1.5 p-4", className),
|
|
1544
|
+
...props
|
|
1545
|
+
}
|
|
1546
|
+
);
|
|
1547
|
+
}
|
|
1548
|
+
function SheetFooter({ className, ...props }) {
|
|
1549
|
+
return /* @__PURE__ */ jsx(
|
|
1550
|
+
"div",
|
|
1551
|
+
{
|
|
1552
|
+
"data-slot": "sheet-footer",
|
|
1553
|
+
className: cn("mt-auto flex flex-col gap-2 p-4", className),
|
|
1554
|
+
...props
|
|
1555
|
+
}
|
|
1556
|
+
);
|
|
1557
|
+
}
|
|
1558
|
+
function SheetTitle({
|
|
1559
|
+
className,
|
|
1560
|
+
...props
|
|
1561
|
+
}) {
|
|
1562
|
+
return /* @__PURE__ */ jsx(
|
|
1563
|
+
DialogPrimitive.Title,
|
|
1564
|
+
{
|
|
1565
|
+
"data-slot": "sheet-title",
|
|
1566
|
+
className: cn("text-foreground font-semibold", className),
|
|
1567
|
+
...props
|
|
1568
|
+
}
|
|
1569
|
+
);
|
|
1570
|
+
}
|
|
1571
|
+
function SheetDescription({
|
|
1572
|
+
className,
|
|
1573
|
+
...props
|
|
1574
|
+
}) {
|
|
1575
|
+
return /* @__PURE__ */ jsx(
|
|
1576
|
+
DialogPrimitive.Description,
|
|
1577
|
+
{
|
|
1578
|
+
"data-slot": "sheet-description",
|
|
1579
|
+
className: cn("text-muted-foreground text-sm", className),
|
|
1580
|
+
...props
|
|
1581
|
+
}
|
|
1582
|
+
);
|
|
1583
|
+
}
|
|
1584
|
+
function Skeleton({ className, ...props }) {
|
|
1585
|
+
return /* @__PURE__ */ jsx(
|
|
1586
|
+
"div",
|
|
1587
|
+
{
|
|
1588
|
+
"data-slot": "skeleton",
|
|
1589
|
+
className: cn("bg-accent animate-pulse rounded-md", className),
|
|
1590
|
+
...props
|
|
1591
|
+
}
|
|
1592
|
+
);
|
|
1593
|
+
}
|
|
1594
|
+
const Switch = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1595
|
+
SwitchPrimitive.Root,
|
|
1596
|
+
{
|
|
1597
|
+
className: cn(
|
|
1598
|
+
"peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
|
|
1599
|
+
className
|
|
1600
|
+
),
|
|
1601
|
+
...props,
|
|
1602
|
+
ref,
|
|
1603
|
+
children: /* @__PURE__ */ jsx(
|
|
1604
|
+
SwitchPrimitive.Thumb,
|
|
1605
|
+
{
|
|
1606
|
+
className: cn(
|
|
1607
|
+
"pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
|
|
1608
|
+
)
|
|
1609
|
+
}
|
|
1610
|
+
)
|
|
1611
|
+
}
|
|
1612
|
+
));
|
|
1613
|
+
Switch.displayName = SwitchPrimitive.Root.displayName;
|
|
1614
|
+
const TabsContext = createContext(null);
|
|
1615
|
+
function Tabs({
|
|
1616
|
+
value: controlledValue,
|
|
1617
|
+
defaultValue,
|
|
1618
|
+
onValueChange,
|
|
1619
|
+
children,
|
|
1620
|
+
className
|
|
1621
|
+
}) {
|
|
1622
|
+
const [internalValue, setInternalValue] = useState(defaultValue || "");
|
|
1623
|
+
const value = controlledValue ?? internalValue;
|
|
1624
|
+
const handleValueChange = (newValue) => {
|
|
1625
|
+
if (!controlledValue) {
|
|
1626
|
+
setInternalValue(newValue);
|
|
1627
|
+
}
|
|
1628
|
+
onValueChange?.(newValue);
|
|
1629
|
+
};
|
|
1630
|
+
return /* @__PURE__ */ jsx(TabsContext.Provider, { value: { value, onValueChange: handleValueChange }, children: /* @__PURE__ */ jsx("div", { className, children }) });
|
|
1631
|
+
}
|
|
1632
|
+
function TabsList({ children, className }) {
|
|
1633
|
+
return /* @__PURE__ */ jsx(
|
|
1634
|
+
"div",
|
|
1635
|
+
{
|
|
1636
|
+
className: cn(
|
|
1637
|
+
"inline-flex h-10 items-center justify-center rounded-md bg-gray-100 p-1 text-gray-500",
|
|
1638
|
+
className
|
|
1639
|
+
),
|
|
1640
|
+
children
|
|
1641
|
+
}
|
|
1642
|
+
);
|
|
1643
|
+
}
|
|
1644
|
+
function TabsTrigger({ value, children, className }) {
|
|
1645
|
+
const context = useContext(TabsContext);
|
|
1646
|
+
if (!context) {
|
|
1647
|
+
throw new Error("TabsTrigger must be used within Tabs");
|
|
1648
|
+
}
|
|
1649
|
+
const isActive = context.value === value;
|
|
1650
|
+
return /* @__PURE__ */ jsx(
|
|
1651
|
+
"button",
|
|
1652
|
+
{
|
|
1653
|
+
type: "button",
|
|
1654
|
+
onClick: () => context.onValueChange(value),
|
|
1655
|
+
className: cn(
|
|
1656
|
+
"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-white transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gray-400 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
|
|
1657
|
+
isActive ? "bg-white text-gray-900 shadow-sm" : "text-gray-600 hover:text-gray-900",
|
|
1658
|
+
className
|
|
1659
|
+
),
|
|
1660
|
+
children
|
|
1661
|
+
}
|
|
1662
|
+
);
|
|
1663
|
+
}
|
|
1664
|
+
function TabsContent({ value, children, className }) {
|
|
1665
|
+
const context = useContext(TabsContext);
|
|
1666
|
+
if (!context) {
|
|
1667
|
+
throw new Error("TabsContent must be used within Tabs");
|
|
1668
|
+
}
|
|
1669
|
+
if (context.value !== value) {
|
|
1670
|
+
return null;
|
|
1671
|
+
}
|
|
1672
|
+
return /* @__PURE__ */ jsx(
|
|
1673
|
+
"div",
|
|
1674
|
+
{
|
|
1675
|
+
className: cn(
|
|
1676
|
+
"mt-2 ring-offset-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-gray-400 focus-visible:ring-offset-2",
|
|
1677
|
+
className
|
|
1678
|
+
),
|
|
1679
|
+
children
|
|
1680
|
+
}
|
|
1681
|
+
);
|
|
1682
|
+
}
|
|
1683
|
+
function Textarea({ className, ...props }) {
|
|
1684
|
+
return /* @__PURE__ */ jsx(
|
|
1685
|
+
"textarea",
|
|
1686
|
+
{
|
|
1687
|
+
"data-slot": "textarea",
|
|
1688
|
+
className: cn(
|
|
1689
|
+
"border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
|
|
1690
|
+
className
|
|
1691
|
+
),
|
|
1692
|
+
...props
|
|
1693
|
+
}
|
|
1694
|
+
);
|
|
1695
|
+
}
|
|
1696
|
+
function TooltipProvider({
|
|
1697
|
+
delayDuration = 0,
|
|
1698
|
+
...props
|
|
1699
|
+
}) {
|
|
1700
|
+
return /* @__PURE__ */ jsx(
|
|
1701
|
+
TooltipPrimitive.Provider,
|
|
1702
|
+
{
|
|
1703
|
+
"data-slot": "tooltip-provider",
|
|
1704
|
+
delayDuration,
|
|
1705
|
+
...props
|
|
1706
|
+
}
|
|
1707
|
+
);
|
|
1708
|
+
}
|
|
1709
|
+
function Tooltip({
|
|
1710
|
+
...props
|
|
1711
|
+
}) {
|
|
1712
|
+
return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props }) });
|
|
1713
|
+
}
|
|
1714
|
+
function TooltipTrigger({
|
|
1715
|
+
...props
|
|
1716
|
+
}) {
|
|
1717
|
+
return /* @__PURE__ */ jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
|
|
1718
|
+
}
|
|
1719
|
+
function TooltipContent({
|
|
1720
|
+
className,
|
|
1721
|
+
sideOffset = 0,
|
|
1722
|
+
children,
|
|
1723
|
+
...props
|
|
1724
|
+
}) {
|
|
1725
|
+
return /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
|
|
1726
|
+
TooltipPrimitive.Content,
|
|
1727
|
+
{
|
|
1728
|
+
"data-slot": "tooltip-content",
|
|
1729
|
+
sideOffset,
|
|
1730
|
+
className: cn(
|
|
1731
|
+
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance",
|
|
1732
|
+
className
|
|
1733
|
+
),
|
|
1734
|
+
...props,
|
|
1735
|
+
children: [
|
|
1736
|
+
children,
|
|
1737
|
+
/* @__PURE__ */ jsx(TooltipPrimitive.Arrow, { className: "bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
|
|
1738
|
+
]
|
|
1739
|
+
}
|
|
1740
|
+
) });
|
|
1741
|
+
}
|
|
1742
|
+
const createComponent = (tag, defaultClassName, displayName) => {
|
|
1743
|
+
const Component = forwardRef((props, ref) => {
|
|
1744
|
+
return React__default.createElement(
|
|
1745
|
+
tag,
|
|
1746
|
+
{ ...props, ref, className: cn(defaultClassName, props.className) },
|
|
1747
|
+
props.children
|
|
1748
|
+
);
|
|
1749
|
+
});
|
|
1750
|
+
Component.displayName = displayName;
|
|
1751
|
+
return Component;
|
|
1752
|
+
};
|
|
1753
|
+
const H1 = createComponent(
|
|
1754
|
+
"h1",
|
|
1755
|
+
"scroll-m-20 text-4xl font-extrabold tracking-normal lg:text-5xl",
|
|
1756
|
+
"H1"
|
|
1757
|
+
);
|
|
1758
|
+
const H2 = createComponent(
|
|
1759
|
+
"h2",
|
|
1760
|
+
"scroll-m-20 border-b py-2 text-3xl font-semibold tracking-tight first:mt-0",
|
|
1761
|
+
"H2"
|
|
1762
|
+
);
|
|
1763
|
+
const H3 = createComponent(
|
|
1764
|
+
"h3",
|
|
1765
|
+
"scroll-m-20 text-2xl font-semibold tracking-tight",
|
|
1766
|
+
"H3"
|
|
1767
|
+
);
|
|
1768
|
+
const H4 = createComponent(
|
|
1769
|
+
"h4",
|
|
1770
|
+
"scroll-m-20 text-xl font-semibold tracking-tight",
|
|
1771
|
+
"H4"
|
|
1772
|
+
);
|
|
1773
|
+
const Lead = createComponent(
|
|
1774
|
+
"p",
|
|
1775
|
+
"text-xl text-muted-foreground",
|
|
1776
|
+
"Lead"
|
|
1777
|
+
);
|
|
1778
|
+
const P = createComponent(
|
|
1779
|
+
"p",
|
|
1780
|
+
"leading-7 [&:not(:first-child)]:mt-6",
|
|
1781
|
+
"P"
|
|
1782
|
+
);
|
|
1783
|
+
const Large = createComponent(
|
|
1784
|
+
"div",
|
|
1785
|
+
"text-lg font-semibold",
|
|
1786
|
+
"Large"
|
|
1787
|
+
);
|
|
1788
|
+
const Small = createComponent(
|
|
1789
|
+
"small",
|
|
1790
|
+
"text-sm font-medium leading-none",
|
|
1791
|
+
"Small"
|
|
1792
|
+
);
|
|
1793
|
+
createComponent(
|
|
1794
|
+
"small",
|
|
1795
|
+
"text-sm text-muted-foreground",
|
|
1796
|
+
"SmallMuted"
|
|
1797
|
+
);
|
|
1798
|
+
const Muted = createComponent(
|
|
1799
|
+
"span",
|
|
1800
|
+
"text-sm text-muted-foreground",
|
|
1801
|
+
"Muted"
|
|
1802
|
+
);
|
|
1803
|
+
createComponent(
|
|
1804
|
+
"code",
|
|
1805
|
+
"relative rounded bg-muted px-[0.3rem] py-[0.2rem] font-mono text-sm font-semibold",
|
|
1806
|
+
"InlineCode"
|
|
1807
|
+
);
|
|
1808
|
+
createComponent(
|
|
1809
|
+
"pre",
|
|
1810
|
+
"relative rounded bg-muted p-4 font-mono text-sm font-semibold overflow-x-auto",
|
|
1811
|
+
"MultilineCode"
|
|
1812
|
+
);
|
|
1813
|
+
createComponent(
|
|
1814
|
+
"ul",
|
|
1815
|
+
"my-6 ml-6 list-disc [&>li]:mt-2",
|
|
1816
|
+
"List"
|
|
1817
|
+
);
|
|
1818
|
+
createComponent(
|
|
1819
|
+
"li",
|
|
1820
|
+
"my-6 ml-6 list-disc [&>li]:mt-2",
|
|
1821
|
+
"ListItem"
|
|
1822
|
+
);
|
|
1823
|
+
createComponent(
|
|
1824
|
+
"blockquote",
|
|
1825
|
+
"mt-6 border-l-2 pl-6 italic text-muted-foreground",
|
|
1826
|
+
"Quote"
|
|
1827
|
+
);
|
|
1828
|
+
export {
|
|
1829
|
+
Alert,
|
|
1830
|
+
AlertDescription,
|
|
1831
|
+
AlertDialog,
|
|
1832
|
+
AlertDialogAction,
|
|
1833
|
+
AlertDialogCancel,
|
|
1834
|
+
AlertDialogContent,
|
|
1835
|
+
AlertDialogDescription,
|
|
1836
|
+
AlertDialogFooter,
|
|
1837
|
+
AlertDialogHeader,
|
|
1838
|
+
AlertDialogOverlay,
|
|
1839
|
+
AlertDialogPortal,
|
|
1840
|
+
AlertDialogTitle,
|
|
1841
|
+
AlertDialogTrigger,
|
|
1842
|
+
AlertTitle,
|
|
1843
|
+
Avatar,
|
|
1844
|
+
AvatarFallback,
|
|
1845
|
+
AvatarImage,
|
|
1846
|
+
Badge,
|
|
1847
|
+
Button,
|
|
1848
|
+
Card,
|
|
1849
|
+
CardContent,
|
|
1850
|
+
CardDescription,
|
|
1851
|
+
CardFooter,
|
|
1852
|
+
CardHeader,
|
|
1853
|
+
CardTitle,
|
|
1854
|
+
Carousel,
|
|
1855
|
+
CarouselContent,
|
|
1856
|
+
CarouselItem,
|
|
1857
|
+
CarouselNext,
|
|
1858
|
+
CarouselPrevious,
|
|
1859
|
+
Checkbox,
|
|
1860
|
+
Collapsible,
|
|
1861
|
+
CollapsibleContent,
|
|
1862
|
+
CollapsibleTrigger,
|
|
1863
|
+
Dialog,
|
|
1864
|
+
DialogClose,
|
|
1865
|
+
DialogContent,
|
|
1866
|
+
DialogDescription,
|
|
1867
|
+
DialogFooter,
|
|
1868
|
+
DialogHeader,
|
|
1869
|
+
DialogOverlay,
|
|
1870
|
+
DialogPortal,
|
|
1871
|
+
DialogTitle,
|
|
1872
|
+
DialogTrigger,
|
|
1873
|
+
DropdownMenu,
|
|
1874
|
+
DropdownMenuCheckboxItem,
|
|
1875
|
+
DropdownMenuContent,
|
|
1876
|
+
DropdownMenuGroup,
|
|
1877
|
+
DropdownMenuItem,
|
|
1878
|
+
DropdownMenuLabel,
|
|
1879
|
+
DropdownMenuPortal,
|
|
1880
|
+
DropdownMenuRadioGroup,
|
|
1881
|
+
DropdownMenuRadioItem,
|
|
1882
|
+
DropdownMenuSeparator,
|
|
1883
|
+
DropdownMenuShortcut,
|
|
1884
|
+
DropdownMenuSub,
|
|
1885
|
+
DropdownMenuSubContent,
|
|
1886
|
+
DropdownMenuSubTrigger,
|
|
1887
|
+
DropdownMenuTrigger,
|
|
1888
|
+
Form,
|
|
1889
|
+
FormControl,
|
|
1890
|
+
FormDescription,
|
|
1891
|
+
FormField,
|
|
1892
|
+
FormItem,
|
|
1893
|
+
FormLabel,
|
|
1894
|
+
FormMessage,
|
|
1895
|
+
H1,
|
|
1896
|
+
H2,
|
|
1897
|
+
H3,
|
|
1898
|
+
H4,
|
|
1899
|
+
HoverCard,
|
|
1900
|
+
HoverCardContent,
|
|
1901
|
+
HoverCardTrigger,
|
|
1902
|
+
Input,
|
|
1903
|
+
Label,
|
|
1904
|
+
Large,
|
|
1905
|
+
Lead,
|
|
1906
|
+
Muted,
|
|
1907
|
+
P,
|
|
1908
|
+
Pagination,
|
|
1909
|
+
PaginationContent,
|
|
1910
|
+
PaginationEllipsis,
|
|
1911
|
+
PaginationItem,
|
|
1912
|
+
PaginationLink,
|
|
1913
|
+
PaginationNext,
|
|
1914
|
+
PaginationPrevious,
|
|
1915
|
+
Popover,
|
|
1916
|
+
PopoverAnchor,
|
|
1917
|
+
PopoverContent,
|
|
1918
|
+
PopoverTrigger,
|
|
1919
|
+
Progress,
|
|
1920
|
+
ResizableHandle,
|
|
1921
|
+
ResizablePanel,
|
|
1922
|
+
ResizablePanelGroup,
|
|
1923
|
+
ScrollArea,
|
|
1924
|
+
ScrollBar,
|
|
1925
|
+
Select,
|
|
1926
|
+
SelectContent,
|
|
1927
|
+
SelectGroup,
|
|
1928
|
+
SelectItem,
|
|
1929
|
+
SelectLabel,
|
|
1930
|
+
SelectScrollDownButton,
|
|
1931
|
+
SelectScrollUpButton,
|
|
1932
|
+
SelectSeparator,
|
|
1933
|
+
SelectTrigger,
|
|
1934
|
+
SelectValue,
|
|
1935
|
+
Separator,
|
|
1936
|
+
Sheet,
|
|
1937
|
+
SheetClose,
|
|
1938
|
+
SheetContent,
|
|
1939
|
+
SheetDescription,
|
|
1940
|
+
SheetFooter,
|
|
1941
|
+
SheetHeader,
|
|
1942
|
+
SheetTitle,
|
|
1943
|
+
SheetTrigger,
|
|
1944
|
+
Skeleton,
|
|
1945
|
+
Small,
|
|
1946
|
+
Switch,
|
|
1947
|
+
Tabs,
|
|
1948
|
+
TabsContent,
|
|
1949
|
+
TabsList,
|
|
1950
|
+
TabsTrigger,
|
|
1951
|
+
Textarea,
|
|
1952
|
+
Tooltip,
|
|
1953
|
+
TooltipContent,
|
|
1954
|
+
TooltipProvider,
|
|
1955
|
+
TooltipTrigger,
|
|
1956
|
+
badgeVariants,
|
|
1957
|
+
buttonVariants,
|
|
1958
|
+
cn,
|
|
1959
|
+
useFormField
|
|
1960
|
+
};
|
|
1961
|
+
//# sourceMappingURL=teacharium-ui.es.js.map
|