@mlw-packages/react-components 1.4.4 → 1.4.6
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/dist/index.css +56 -17
- package/dist/index.d.mts +124 -60
- package/dist/index.d.ts +124 -60
- package/dist/index.js +25 -3399
- package/dist/index.mjs +25 -3405
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,929 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import './index.css';
|
|
3
3
|
|
|
4
|
-
// src/components/ui/AlertDialogBase.tsx
|
|
5
|
-
import * as React2 from "react";
|
|
6
|
-
import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
|
|
7
|
-
|
|
8
|
-
// src/lib/utils.ts
|
|
9
|
-
import { clsx } from "clsx";
|
|
10
|
-
import { twMerge } from "tailwind-merge";
|
|
11
|
-
function cn(...inputs) {
|
|
12
|
-
return twMerge(clsx(inputs));
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
// src/components/ui/ButtonBase.tsx
|
|
16
|
-
import * as React from "react";
|
|
17
|
-
import { Slot } from "@radix-ui/react-slot";
|
|
18
|
-
import { cva } from "class-variance-authority";
|
|
19
|
-
import { jsx } from "react/jsx-runtime";
|
|
20
|
-
var buttonVariantsBase = cva(
|
|
21
|
-
`
|
|
22
|
-
inline-flex items-center justify-center gap-2
|
|
23
|
-
whitespace-nowrap rounded-md text-sm
|
|
24
|
-
transition-all duration-200
|
|
25
|
-
focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2
|
|
26
|
-
disabled:pointer-events-none disabled:opacity-50
|
|
27
|
-
active:scale-[0.97]
|
|
28
|
-
[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 border border-transparent
|
|
29
|
-
`,
|
|
30
|
-
{
|
|
31
|
-
variants: {
|
|
32
|
-
variant: {
|
|
33
|
-
default: "bg-primary text-primary-foreground shadow hover:opacity-90 hover:shadow-md",
|
|
34
|
-
destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90 hover:shadow-md",
|
|
35
|
-
outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground hover:shadow-md",
|
|
36
|
-
secondary: "bg-secondary text-secondary-foreground shadow-sm border border-transparent hover:opacity-80 hover:shadow-md",
|
|
37
|
-
ghost: "hover:bg-accent hover:text-accent-foreground",
|
|
38
|
-
link: "text-primary underline-offset-4 hover:underline"
|
|
39
|
-
},
|
|
40
|
-
size: {
|
|
41
|
-
default: "px-4 py-1.5",
|
|
42
|
-
sm: "rounded-md px-3 text-xs",
|
|
43
|
-
lg: "rounded-md px-8",
|
|
44
|
-
icon: "h-9 w-9"
|
|
45
|
-
}
|
|
46
|
-
},
|
|
47
|
-
defaultVariants: {
|
|
48
|
-
variant: "default",
|
|
49
|
-
size: "default"
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
);
|
|
53
|
-
var ButtonBase = React.forwardRef(
|
|
54
|
-
({ className, variant, size, asChild = false, testid = `button-${variant ?? "default"}`, ...props }, ref) => {
|
|
55
|
-
const Comp = asChild ? Slot : "button";
|
|
56
|
-
return /* @__PURE__ */ jsx(
|
|
57
|
-
Comp,
|
|
58
|
-
{
|
|
59
|
-
className: cn(buttonVariantsBase({ variant, size, className })),
|
|
60
|
-
ref,
|
|
61
|
-
"data-testid": testid ?? `button-${variant ?? "default"}`,
|
|
62
|
-
...props
|
|
63
|
-
}
|
|
64
|
-
);
|
|
65
|
-
}
|
|
66
|
-
);
|
|
67
|
-
ButtonBase.displayName = "Button";
|
|
68
|
-
var ButtonGroupBase = React.forwardRef(
|
|
69
|
-
({ className, children, orientation = "horizontal", ...props }, ref) => {
|
|
70
|
-
return /* @__PURE__ */ jsx(
|
|
71
|
-
"div",
|
|
72
|
-
{
|
|
73
|
-
ref,
|
|
74
|
-
className: cn(
|
|
75
|
-
"inline-flex",
|
|
76
|
-
orientation === "vertical" ? "flex-col" : "flex-row",
|
|
77
|
-
"rounded-md overflow-hidden isolate",
|
|
78
|
-
className
|
|
79
|
-
),
|
|
80
|
-
...props,
|
|
81
|
-
children: React.Children.map(children, (child, index) => {
|
|
82
|
-
if (!React.isValidElement(child)) return child;
|
|
83
|
-
const typedChild = child;
|
|
84
|
-
return React.cloneElement(typedChild, {
|
|
85
|
-
className: cn(
|
|
86
|
-
typedChild.props.className,
|
|
87
|
-
"rounded-none border-0",
|
|
88
|
-
index === 0 && orientation === "horizontal" && "rounded-l-md",
|
|
89
|
-
index === 0 && orientation === "vertical" && "rounded-t-md",
|
|
90
|
-
index === React.Children.count(children) - 1 && orientation === "horizontal" && "rounded-r-md",
|
|
91
|
-
index === React.Children.count(children) - 1 && orientation === "vertical" && "rounded-b-md"
|
|
92
|
-
)
|
|
93
|
-
});
|
|
94
|
-
})
|
|
95
|
-
}
|
|
96
|
-
);
|
|
97
|
-
}
|
|
98
|
-
);
|
|
99
|
-
ButtonGroupBase.displayName = "ButtonGroup";
|
|
100
|
-
|
|
101
|
-
// src/components/ui/AlertDialogBase.tsx
|
|
102
|
-
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
103
|
-
var AlertDialogBase = AlertDialogPrimitive.Root;
|
|
104
|
-
var AlertDialogTriggerBase = AlertDialogPrimitive.Trigger;
|
|
105
|
-
var AlertDialogPortalBase = AlertDialogPrimitive.Portal;
|
|
106
|
-
var AlertDialogOverlayBase = React2.forwardRef(({ className, testid = "alertdialog-overlay", ...props }, ref) => /* @__PURE__ */ jsx2(
|
|
107
|
-
AlertDialogPrimitive.Overlay,
|
|
108
|
-
{
|
|
109
|
-
className: cn(
|
|
110
|
-
"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",
|
|
111
|
-
className
|
|
112
|
-
),
|
|
113
|
-
"data-testid": testid,
|
|
114
|
-
...props,
|
|
115
|
-
ref
|
|
116
|
-
}
|
|
117
|
-
));
|
|
118
|
-
AlertDialogOverlayBase.displayName = AlertDialogPrimitive.Overlay.displayName;
|
|
119
|
-
var AlertDialogContentBase = React2.forwardRef(({ className, testid = "alertdialog-content", ...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortalBase, { children: [
|
|
120
|
-
/* @__PURE__ */ jsx2(AlertDialogOverlayBase, {}),
|
|
121
|
-
/* @__PURE__ */ jsx2(
|
|
122
|
-
AlertDialogPrimitive.Content,
|
|
123
|
-
{
|
|
124
|
-
ref,
|
|
125
|
-
className: cn(
|
|
126
|
-
"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",
|
|
127
|
-
className
|
|
128
|
-
),
|
|
129
|
-
"data-testid": testid,
|
|
130
|
-
...props
|
|
131
|
-
}
|
|
132
|
-
)
|
|
133
|
-
] }));
|
|
134
|
-
AlertDialogContentBase.displayName = AlertDialogPrimitive.Content.displayName;
|
|
135
|
-
var AlertDialogHeaderBase = ({
|
|
136
|
-
className,
|
|
137
|
-
...props
|
|
138
|
-
}) => /* @__PURE__ */ jsx2(
|
|
139
|
-
"div",
|
|
140
|
-
{
|
|
141
|
-
className: cn(
|
|
142
|
-
"flex flex-col space-y-2 text-center sm:text-left",
|
|
143
|
-
className
|
|
144
|
-
),
|
|
145
|
-
...props
|
|
146
|
-
}
|
|
147
|
-
);
|
|
148
|
-
AlertDialogHeaderBase.displayName = "AlertDialogHeaderBase";
|
|
149
|
-
var AlertDialogFooterBase = ({
|
|
150
|
-
className,
|
|
151
|
-
...props
|
|
152
|
-
}) => /* @__PURE__ */ jsx2(
|
|
153
|
-
"div",
|
|
154
|
-
{
|
|
155
|
-
className: cn(
|
|
156
|
-
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
|
|
157
|
-
className
|
|
158
|
-
),
|
|
159
|
-
...props
|
|
160
|
-
}
|
|
161
|
-
);
|
|
162
|
-
AlertDialogFooterBase.displayName = "AlertDialogFooterBase";
|
|
163
|
-
var AlertDialogTitleBase = React2.forwardRef(({ className, testid = "alertdialog-title", ...props }, ref) => /* @__PURE__ */ jsx2(
|
|
164
|
-
AlertDialogPrimitive.Title,
|
|
165
|
-
{
|
|
166
|
-
ref,
|
|
167
|
-
className: cn("text-lg font-semibold", className),
|
|
168
|
-
"data-testid": testid,
|
|
169
|
-
...props
|
|
170
|
-
}
|
|
171
|
-
));
|
|
172
|
-
AlertDialogTitleBase.displayName = AlertDialogPrimitive.Title.displayName;
|
|
173
|
-
var AlertDialogDescriptionBase = React2.forwardRef(({ className, testid = "alertdialog-description", ...props }, ref) => /* @__PURE__ */ jsx2(
|
|
174
|
-
AlertDialogPrimitive.Description,
|
|
175
|
-
{
|
|
176
|
-
ref,
|
|
177
|
-
className: cn("text-sm text-muted-foreground", className),
|
|
178
|
-
"data-testid": testid,
|
|
179
|
-
...props
|
|
180
|
-
}
|
|
181
|
-
));
|
|
182
|
-
AlertDialogDescriptionBase.displayName = AlertDialogPrimitive.Description.displayName;
|
|
183
|
-
var AlertDialogActionBase = React2.forwardRef(({ className, testid = "alertdialog-action", ...props }, ref) => /* @__PURE__ */ jsx2(
|
|
184
|
-
AlertDialogPrimitive.Action,
|
|
185
|
-
{
|
|
186
|
-
ref,
|
|
187
|
-
className: cn(buttonVariantsBase(), className),
|
|
188
|
-
"data-testid": testid,
|
|
189
|
-
...props
|
|
190
|
-
}
|
|
191
|
-
));
|
|
192
|
-
AlertDialogActionBase.displayName = AlertDialogPrimitive.Action.displayName;
|
|
193
|
-
var AlertDialogCancelBase = React2.forwardRef(({ className, testid = "alertdialog-cancel", ...props }, ref) => /* @__PURE__ */ jsx2(
|
|
194
|
-
AlertDialogPrimitive.Cancel,
|
|
195
|
-
{
|
|
196
|
-
ref,
|
|
197
|
-
className: cn(
|
|
198
|
-
buttonVariantsBase({ variant: "outline" }),
|
|
199
|
-
"mt-2 sm:mt-0",
|
|
200
|
-
className
|
|
201
|
-
),
|
|
202
|
-
"data-testid": testid,
|
|
203
|
-
...props
|
|
204
|
-
}
|
|
205
|
-
));
|
|
206
|
-
AlertDialogCancelBase.displayName = AlertDialogPrimitive.Cancel.displayName;
|
|
207
|
-
|
|
208
|
-
// src/components/ui/AvatarBase.tsx
|
|
209
|
-
import * as React3 from "react";
|
|
210
|
-
import * as AvatarPrimitive from "@radix-ui/react-avatar";
|
|
211
|
-
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
212
|
-
var AvatarBase = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx3(
|
|
213
|
-
AvatarPrimitive.Root,
|
|
214
|
-
{
|
|
215
|
-
ref,
|
|
216
|
-
className: cn(
|
|
217
|
-
"relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
|
|
218
|
-
className
|
|
219
|
-
),
|
|
220
|
-
...props
|
|
221
|
-
}
|
|
222
|
-
));
|
|
223
|
-
AvatarBase.displayName = AvatarPrimitive.Root.displayName;
|
|
224
|
-
var AvatarImageBase = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx3(
|
|
225
|
-
AvatarPrimitive.Image,
|
|
226
|
-
{
|
|
227
|
-
ref,
|
|
228
|
-
className: cn("aspect-square h-full w-full", className),
|
|
229
|
-
...props
|
|
230
|
-
}
|
|
231
|
-
));
|
|
232
|
-
AvatarImageBase.displayName = AvatarPrimitive.Image.displayName;
|
|
233
|
-
var AvatarFallbackBase = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx3(
|
|
234
|
-
AvatarPrimitive.Fallback,
|
|
235
|
-
{
|
|
236
|
-
ref,
|
|
237
|
-
className: cn(
|
|
238
|
-
"flex h-full w-full items-center justify-center rounded-full bg-muted",
|
|
239
|
-
className
|
|
240
|
-
),
|
|
241
|
-
...props
|
|
242
|
-
}
|
|
243
|
-
));
|
|
244
|
-
AvatarFallbackBase.displayName = AvatarPrimitive.Fallback.displayName;
|
|
245
|
-
|
|
246
|
-
// src/components/date-time-picker/DateTimePicker.tsx
|
|
247
|
-
import { add, format } from "date-fns";
|
|
248
|
-
|
|
249
|
-
// src/components/date-time-picker/calendar.tsx
|
|
250
|
-
import * as React5 from "react";
|
|
251
|
-
import { DayPicker } from "react-day-picker";
|
|
252
|
-
import { CaretLeft, CaretRight, X, Calendar } from "phosphor-react";
|
|
253
|
-
import { motion } from "framer-motion";
|
|
254
|
-
|
|
255
|
-
// src/components/ui/PopoverBase.tsx
|
|
256
|
-
import * as React4 from "react";
|
|
257
|
-
import * as PopoverPrimitive from "@radix-ui/react-popover";
|
|
258
|
-
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
259
|
-
var PopoverBase = PopoverPrimitive.Root;
|
|
260
|
-
var PopoverTriggerBase = PopoverPrimitive.Trigger;
|
|
261
|
-
var PopoverAnchorBase = PopoverPrimitive.Anchor;
|
|
262
|
-
var PopoverContentBase = React4.forwardRef(({ className, align = "center", sideOffset = 4, testid: dataTestId = "popover-content", ...props }, ref) => /* @__PURE__ */ jsx4(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx4(
|
|
263
|
-
PopoverPrimitive.Content,
|
|
264
|
-
{
|
|
265
|
-
ref,
|
|
266
|
-
align,
|
|
267
|
-
sideOffset,
|
|
268
|
-
className: cn(
|
|
269
|
-
"z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none 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",
|
|
270
|
-
className
|
|
271
|
-
),
|
|
272
|
-
"data-testid": dataTestId,
|
|
273
|
-
...props
|
|
274
|
-
}
|
|
275
|
-
) }));
|
|
276
|
-
PopoverContentBase.displayName = PopoverPrimitive.Content.displayName;
|
|
277
|
-
|
|
278
|
-
// src/components/date-time-picker/calendar.tsx
|
|
279
|
-
import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
280
|
-
var variants = {
|
|
281
|
-
enter: (direction) => ({
|
|
282
|
-
opacity: 0,
|
|
283
|
-
x: direction > 0 ? 30 : -30
|
|
284
|
-
}),
|
|
285
|
-
center: {
|
|
286
|
-
opacity: 1,
|
|
287
|
-
x: 0
|
|
288
|
-
},
|
|
289
|
-
exit: (direction) => ({
|
|
290
|
-
opacity: 0,
|
|
291
|
-
x: direction > 0 ? -30 : 30
|
|
292
|
-
})
|
|
293
|
-
};
|
|
294
|
-
function CalendarBase({
|
|
295
|
-
className,
|
|
296
|
-
classNames,
|
|
297
|
-
showOutsideDays = true,
|
|
298
|
-
...props
|
|
299
|
-
}) {
|
|
300
|
-
const [month, setMonth] = React5.useState(
|
|
301
|
-
props.month || props.defaultMonth || /* @__PURE__ */ new Date()
|
|
302
|
-
);
|
|
303
|
-
const [direction, setDirection] = React5.useState(1);
|
|
304
|
-
const handleMonthChange = (newMonth) => {
|
|
305
|
-
const isNext = newMonth > month ? 1 : -1;
|
|
306
|
-
setDirection(isNext);
|
|
307
|
-
setMonth(newMonth);
|
|
308
|
-
props.onMonthChange?.(newMonth);
|
|
309
|
-
};
|
|
310
|
-
return /* @__PURE__ */ jsx5(
|
|
311
|
-
"div",
|
|
312
|
-
{
|
|
313
|
-
className: cn(
|
|
314
|
-
"rounded-xl border bg-background p-3 shadow-sm overflow-hidden",
|
|
315
|
-
className
|
|
316
|
-
),
|
|
317
|
-
children: /* @__PURE__ */ jsx5(
|
|
318
|
-
motion.div,
|
|
319
|
-
{
|
|
320
|
-
variants,
|
|
321
|
-
initial: "enter",
|
|
322
|
-
animate: "center",
|
|
323
|
-
exit: "exit",
|
|
324
|
-
custom: direction,
|
|
325
|
-
transition: { duration: 0.3, ease: "easeInOut" },
|
|
326
|
-
style: { position: "relative" },
|
|
327
|
-
children: /* @__PURE__ */ jsx5(
|
|
328
|
-
DayPicker,
|
|
329
|
-
{
|
|
330
|
-
showOutsideDays,
|
|
331
|
-
month,
|
|
332
|
-
onMonthChange: handleMonthChange,
|
|
333
|
-
className: "w-full",
|
|
334
|
-
classNames: {
|
|
335
|
-
months: "flex items-center flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
|
|
336
|
-
month: "space-y-4",
|
|
337
|
-
caption: "flex justify-center pt-1 relative items-center",
|
|
338
|
-
caption_label: "text-sm font-medium",
|
|
339
|
-
nav: "space-x-1 flex items-center",
|
|
340
|
-
nav_button: cn(
|
|
341
|
-
buttonVariantsBase({ variant: "outline" }),
|
|
342
|
-
"h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100"
|
|
343
|
-
),
|
|
344
|
-
nav_button_previous: "absolute left-1",
|
|
345
|
-
nav_button_next: "absolute right-1",
|
|
346
|
-
table: "w-full border-collapse space-y-1",
|
|
347
|
-
head_row: "flex",
|
|
348
|
-
head_cell: "text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]",
|
|
349
|
-
row: "flex w-full mt-2",
|
|
350
|
-
cell: cn(
|
|
351
|
-
"h-9 w-9 text-center text-sm p-0 relative",
|
|
352
|
-
"[&:has([aria-selected].day-range-end)]:rounded-r-md",
|
|
353
|
-
"[&:has([aria-selected].day-range-start)]:rounded-l-md",
|
|
354
|
-
"[&:has([aria-selected].day-outside)]:bg-muted/50",
|
|
355
|
-
"[&:has([aria-selected])]:bg-muted",
|
|
356
|
-
"first:[&:has([aria-selected])]:rounded-l-md",
|
|
357
|
-
"last:[&:has([aria-selected])]:rounded-r-md",
|
|
358
|
-
"focus-within:relative focus-within:z-20"
|
|
359
|
-
),
|
|
360
|
-
day: cn(
|
|
361
|
-
buttonVariantsBase({ variant: "ghost" }),
|
|
362
|
-
"h-9 w-9 p-0 font-normal rounded-md",
|
|
363
|
-
"aria-selected:opacity-100 hover:bg-muted"
|
|
364
|
-
),
|
|
365
|
-
day_selected: "bg-primary text-primary-foreground hover:bg-primary/90 focus:bg-primary/90",
|
|
366
|
-
day_today: "bg-muted text-foreground dark:bg-muted dark:text-foreground",
|
|
367
|
-
day_outside: "day-outside text-gray-500 opacity-50 aria-selected:bg-muted/50 aria-selected:text-black",
|
|
368
|
-
day_disabled: "text-gray-500",
|
|
369
|
-
day_range_middle: "aria-selected:bg-muted aria-selected:text-foreground",
|
|
370
|
-
day_hidden: "invisible",
|
|
371
|
-
...classNames
|
|
372
|
-
},
|
|
373
|
-
components: {
|
|
374
|
-
IconLeft: () => /* @__PURE__ */ jsx5(CaretLeft, { className: "h-4 w-4" }),
|
|
375
|
-
IconRight: () => /* @__PURE__ */ jsx5(CaretRight, { className: "h-4 w-4" })
|
|
376
|
-
},
|
|
377
|
-
...props
|
|
378
|
-
}
|
|
379
|
-
)
|
|
380
|
-
},
|
|
381
|
-
month.toISOString()
|
|
382
|
-
)
|
|
383
|
-
}
|
|
384
|
-
);
|
|
385
|
-
}
|
|
386
|
-
CalendarBase.displayName = "CalendarBase";
|
|
387
|
-
|
|
388
|
-
// src/components/date-time-picker/DateTimePicker.tsx
|
|
389
|
-
import { Calendar as Calendar2 } from "phosphor-react";
|
|
390
|
-
import { ptBR } from "date-fns/locale";
|
|
391
|
-
import { useEffect, useState as useState2 } from "react";
|
|
392
|
-
|
|
393
|
-
// src/components/ui/DialogBase.tsx
|
|
394
|
-
import * as React6 from "react";
|
|
395
|
-
import * as DialogPrimitive from "@radix-ui/react-dialog";
|
|
396
|
-
import { X as X2 } from "phosphor-react";
|
|
397
|
-
import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
398
|
-
var DialogBase = DialogPrimitive.Root;
|
|
399
|
-
var DialogTriggerBase = DialogPrimitive.Trigger;
|
|
400
|
-
var DialogPortalBase = DialogPrimitive.Portal;
|
|
401
|
-
var DialogCloseBase = DialogPrimitive.Close;
|
|
402
|
-
var DialogOverlayBase = React6.forwardRef(({ className, testid: dataTestId = "dialog-overlay", ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
403
|
-
DialogPrimitive.Overlay,
|
|
404
|
-
{
|
|
405
|
-
ref,
|
|
406
|
-
className: cn(
|
|
407
|
-
"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",
|
|
408
|
-
className
|
|
409
|
-
),
|
|
410
|
-
"data-testid": dataTestId,
|
|
411
|
-
...props
|
|
412
|
-
}
|
|
413
|
-
));
|
|
414
|
-
DialogOverlayBase.displayName = DialogPrimitive.Overlay.displayName;
|
|
415
|
-
var DialogContentBase = React6.forwardRef(({ className, children, testid: dataTestId = "dialog-content", ...props }, ref) => /* @__PURE__ */ jsxs3(DialogPortalBase, { children: [
|
|
416
|
-
/* @__PURE__ */ jsx6(DialogOverlayBase, {}),
|
|
417
|
-
/* @__PURE__ */ jsxs3(
|
|
418
|
-
DialogPrimitive.Content,
|
|
419
|
-
{
|
|
420
|
-
ref,
|
|
421
|
-
className: cn(
|
|
422
|
-
"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",
|
|
423
|
-
className
|
|
424
|
-
),
|
|
425
|
-
"data-testid": dataTestId,
|
|
426
|
-
...props,
|
|
427
|
-
children: [
|
|
428
|
-
children,
|
|
429
|
-
/* @__PURE__ */ jsxs3(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
|
|
430
|
-
/* @__PURE__ */ jsx6(X2, { className: "h-4 w-4" }),
|
|
431
|
-
/* @__PURE__ */ jsx6("span", { className: "sr-only", children: "Close" })
|
|
432
|
-
] })
|
|
433
|
-
]
|
|
434
|
-
}
|
|
435
|
-
)
|
|
436
|
-
] }));
|
|
437
|
-
DialogContentBase.displayName = DialogPrimitive.Content.displayName;
|
|
438
|
-
var DialogHeaderBase = React6.forwardRef(({ className, testid: dataTestId = "dialog-header", ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
439
|
-
"div",
|
|
440
|
-
{
|
|
441
|
-
ref,
|
|
442
|
-
className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className),
|
|
443
|
-
"data-testid": dataTestId,
|
|
444
|
-
...props
|
|
445
|
-
}
|
|
446
|
-
));
|
|
447
|
-
DialogHeaderBase.displayName = "DialogHeader";
|
|
448
|
-
var DialogFooterBase = React6.forwardRef(({ className, testid: dataTestId = "dialog-footer", ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
449
|
-
"div",
|
|
450
|
-
{
|
|
451
|
-
ref,
|
|
452
|
-
className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
|
|
453
|
-
"data-testid": dataTestId,
|
|
454
|
-
...props
|
|
455
|
-
}
|
|
456
|
-
));
|
|
457
|
-
DialogFooterBase.displayName = "DialogFooter";
|
|
458
|
-
var DialogTitleBase = React6.forwardRef(({ className, testid: dataTestId = "dialog-title", ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
459
|
-
DialogPrimitive.Title,
|
|
460
|
-
{
|
|
461
|
-
ref,
|
|
462
|
-
className: cn("text-lg font-semibold leading-none tracking-tight", className),
|
|
463
|
-
"data-testid": dataTestId,
|
|
464
|
-
...props
|
|
465
|
-
}
|
|
466
|
-
));
|
|
467
|
-
DialogTitleBase.displayName = DialogPrimitive.Title.displayName;
|
|
468
|
-
var DialogDescriptionBase = React6.forwardRef(({ className, testid: dataTestId = "dialog-description", ...props }, ref) => /* @__PURE__ */ jsx6(
|
|
469
|
-
DialogPrimitive.Description,
|
|
470
|
-
{
|
|
471
|
-
ref,
|
|
472
|
-
className: cn("text-sm text-muted-foreground", className),
|
|
473
|
-
"data-testid": dataTestId,
|
|
474
|
-
...props
|
|
475
|
-
}
|
|
476
|
-
));
|
|
477
|
-
DialogDescriptionBase.displayName = DialogPrimitive.Description.displayName;
|
|
478
|
-
|
|
479
|
-
// src/components/ui/LabelBase.tsx
|
|
480
|
-
import * as React7 from "react";
|
|
481
|
-
import { Label as RadixLabel } from "@radix-ui/react-label";
|
|
482
|
-
import { Slot as Slot2 } from "@radix-ui/react-slot";
|
|
483
|
-
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
484
|
-
var LabelBase = React7.forwardRef(
|
|
485
|
-
({ className, asChild = false, testid = "label-base", ...props }, ref) => {
|
|
486
|
-
const Comp = asChild ? Slot2 : "label";
|
|
487
|
-
return /* @__PURE__ */ jsx7(RadixLabel, { children: /* @__PURE__ */ jsx7(
|
|
488
|
-
Comp,
|
|
489
|
-
{
|
|
490
|
-
ref,
|
|
491
|
-
className: cn(
|
|
492
|
-
"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
|
|
493
|
-
className
|
|
494
|
-
),
|
|
495
|
-
"data-testid": testid,
|
|
496
|
-
...props
|
|
497
|
-
}
|
|
498
|
-
) });
|
|
499
|
-
}
|
|
500
|
-
);
|
|
501
|
-
LabelBase.displayName = "LabelBase";
|
|
502
|
-
var LabelBase_default = LabelBase;
|
|
503
|
-
|
|
504
|
-
// src/components/date-time-picker/TimePicker.tsx
|
|
505
|
-
import { Clock } from "phosphor-react";
|
|
506
|
-
import * as React10 from "react";
|
|
507
|
-
|
|
508
|
-
// src/components/ui/InputBase.tsx
|
|
509
|
-
import * as React8 from "react";
|
|
510
|
-
import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
511
|
-
var InputBase = React8.forwardRef(
|
|
512
|
-
({
|
|
513
|
-
className,
|
|
514
|
-
type = "text",
|
|
515
|
-
label,
|
|
516
|
-
labelClassname,
|
|
517
|
-
leftIcon,
|
|
518
|
-
rightIcon,
|
|
519
|
-
"data-testid": dataTestId,
|
|
520
|
-
...props
|
|
521
|
-
}, ref) => {
|
|
522
|
-
return /* @__PURE__ */ jsxs4("div", { className: "flex flex-col w-full min-w-[150px]", children: [
|
|
523
|
-
label && /* @__PURE__ */ jsx8(LabelBase_default, { className: labelClassname, children: label }),
|
|
524
|
-
/* @__PURE__ */ jsxs4(
|
|
525
|
-
"div",
|
|
526
|
-
{
|
|
527
|
-
className: cn(
|
|
528
|
-
"flex items-center rounded-md transition focus-within:ring-1 focus-within:ring-ring focus-within:border-ring bg-white dark:bg-[hsl(231,15%,19%)] overflow-hidden",
|
|
529
|
-
type !== "file" && "border"
|
|
530
|
-
),
|
|
531
|
-
children: [
|
|
532
|
-
leftIcon && /* @__PURE__ */ jsx8("div", { className: "flex items-center justify-center px-2", children: leftIcon }),
|
|
533
|
-
/* @__PURE__ */ jsx8(
|
|
534
|
-
"input",
|
|
535
|
-
{
|
|
536
|
-
type,
|
|
537
|
-
className: cn(
|
|
538
|
-
"w-full flex-1 text-sm py-1.5 px-3 focus:outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 bg-white dark:bg-[hsl(231,15%,19%)]",
|
|
539
|
-
className
|
|
540
|
-
),
|
|
541
|
-
ref,
|
|
542
|
-
"data-testid": dataTestId ?? "input-base",
|
|
543
|
-
...props
|
|
544
|
-
}
|
|
545
|
-
),
|
|
546
|
-
rightIcon && /* @__PURE__ */ jsx8("div", { className: "flex items-center justify-center px-2", children: rightIcon })
|
|
547
|
-
]
|
|
548
|
-
}
|
|
549
|
-
)
|
|
550
|
-
] });
|
|
551
|
-
}
|
|
552
|
-
);
|
|
553
|
-
InputBase.displayName = "Input";
|
|
554
|
-
|
|
555
|
-
// src/components/date-time-picker/TimePickerInput.tsx
|
|
556
|
-
import React9 from "react";
|
|
557
|
-
|
|
558
|
-
// src/components/date-time-picker/time-picker-utils.ts
|
|
559
|
-
function isValidHour(value) {
|
|
560
|
-
return /^(0[0-9]|1[0-9]|2[0-3])$/.test(value);
|
|
561
|
-
}
|
|
562
|
-
function isValid12Hour(value) {
|
|
563
|
-
return /^(0[1-9]|1[0-2])$/.test(value);
|
|
564
|
-
}
|
|
565
|
-
function isValidMinuteOrSecond(value) {
|
|
566
|
-
return /^[0-5][0-9]$/.test(value);
|
|
567
|
-
}
|
|
568
|
-
function getValidNumber(value, { max, min = 0, loop = false }) {
|
|
569
|
-
let numericValue = parseInt(value, 10);
|
|
570
|
-
if (!isNaN(numericValue)) {
|
|
571
|
-
if (!loop) {
|
|
572
|
-
if (numericValue > max) numericValue = max;
|
|
573
|
-
if (numericValue < min) numericValue = min;
|
|
574
|
-
} else {
|
|
575
|
-
if (numericValue > max) numericValue = min;
|
|
576
|
-
if (numericValue < min) numericValue = max;
|
|
577
|
-
}
|
|
578
|
-
return numericValue.toString().padStart(2, "0");
|
|
579
|
-
}
|
|
580
|
-
return "00";
|
|
581
|
-
}
|
|
582
|
-
function getValidHour(value) {
|
|
583
|
-
if (isValidHour(value)) return value;
|
|
584
|
-
return getValidNumber(value, { max: 23 });
|
|
585
|
-
}
|
|
586
|
-
function getValid12Hour(value) {
|
|
587
|
-
if (isValid12Hour(value)) return value;
|
|
588
|
-
return getValidNumber(value, { min: 1, max: 12 });
|
|
589
|
-
}
|
|
590
|
-
function getValidMinuteOrSecond(value) {
|
|
591
|
-
if (isValidMinuteOrSecond(value)) return value;
|
|
592
|
-
return getValidNumber(value, { max: 59 });
|
|
593
|
-
}
|
|
594
|
-
function getValidArrowNumber(value, { min, max, step }) {
|
|
595
|
-
let numericValue = parseInt(value, 10);
|
|
596
|
-
if (!isNaN(numericValue)) {
|
|
597
|
-
numericValue += step;
|
|
598
|
-
return getValidNumber(String(numericValue), { min, max, loop: true });
|
|
599
|
-
}
|
|
600
|
-
return "00";
|
|
601
|
-
}
|
|
602
|
-
function getValidArrowHour(value, step) {
|
|
603
|
-
return getValidArrowNumber(value, { min: 0, max: 23, step });
|
|
604
|
-
}
|
|
605
|
-
function getValidArrow12Hour(value, step) {
|
|
606
|
-
return getValidArrowNumber(value, { min: 1, max: 12, step });
|
|
607
|
-
}
|
|
608
|
-
function getValidArrowMinuteOrSecond(value, step) {
|
|
609
|
-
return getValidArrowNumber(value, { min: 0, max: 59, step });
|
|
610
|
-
}
|
|
611
|
-
function setMinutes(date, value) {
|
|
612
|
-
const minutes = getValidMinuteOrSecond(value);
|
|
613
|
-
date.setMinutes(parseInt(minutes, 10));
|
|
614
|
-
return date;
|
|
615
|
-
}
|
|
616
|
-
function setSeconds(date, value) {
|
|
617
|
-
const seconds = getValidMinuteOrSecond(value);
|
|
618
|
-
date.setSeconds(parseInt(seconds, 10));
|
|
619
|
-
return date;
|
|
620
|
-
}
|
|
621
|
-
function setHours(date, value) {
|
|
622
|
-
const hours = getValidHour(value);
|
|
623
|
-
date.setHours(parseInt(hours, 10));
|
|
624
|
-
return date;
|
|
625
|
-
}
|
|
626
|
-
function set12Hours(date, value, period) {
|
|
627
|
-
const hours = parseInt(getValid12Hour(value), 10);
|
|
628
|
-
const convertedHours = convert12HourTo24Hour(hours, period);
|
|
629
|
-
date.setHours(convertedHours);
|
|
630
|
-
return date;
|
|
631
|
-
}
|
|
632
|
-
function setDateByType(date, value, type, period) {
|
|
633
|
-
switch (type) {
|
|
634
|
-
case "minutes":
|
|
635
|
-
return setMinutes(date, value);
|
|
636
|
-
case "seconds":
|
|
637
|
-
return setSeconds(date, value);
|
|
638
|
-
case "hours":
|
|
639
|
-
return setHours(date, value);
|
|
640
|
-
case "12hours": {
|
|
641
|
-
if (!period) return date;
|
|
642
|
-
return set12Hours(date, value, period);
|
|
643
|
-
}
|
|
644
|
-
default:
|
|
645
|
-
return date;
|
|
646
|
-
}
|
|
647
|
-
}
|
|
648
|
-
function getDateByType(date, type) {
|
|
649
|
-
switch (type) {
|
|
650
|
-
case "minutes":
|
|
651
|
-
return getValidMinuteOrSecond(String(date.getMinutes()));
|
|
652
|
-
case "seconds":
|
|
653
|
-
return getValidMinuteOrSecond(String(date.getSeconds()));
|
|
654
|
-
case "hours":
|
|
655
|
-
return getValidHour(String(date.getHours()));
|
|
656
|
-
case "12hours":
|
|
657
|
-
const hours = display12HourValue(date.getHours());
|
|
658
|
-
return getValid12Hour(String(hours));
|
|
659
|
-
default:
|
|
660
|
-
return "00";
|
|
661
|
-
}
|
|
662
|
-
}
|
|
663
|
-
function getArrowByType(value, step, type) {
|
|
664
|
-
switch (type) {
|
|
665
|
-
case "minutes":
|
|
666
|
-
return getValidArrowMinuteOrSecond(value, step);
|
|
667
|
-
case "seconds":
|
|
668
|
-
return getValidArrowMinuteOrSecond(value, step);
|
|
669
|
-
case "hours":
|
|
670
|
-
return getValidArrowHour(value, step);
|
|
671
|
-
case "12hours":
|
|
672
|
-
return getValidArrow12Hour(value, step);
|
|
673
|
-
default:
|
|
674
|
-
return "00";
|
|
675
|
-
}
|
|
676
|
-
}
|
|
677
|
-
function convert12HourTo24Hour(hour, period) {
|
|
678
|
-
if (period === "PM") {
|
|
679
|
-
if (hour <= 11) {
|
|
680
|
-
return hour + 12;
|
|
681
|
-
} else {
|
|
682
|
-
return hour;
|
|
683
|
-
}
|
|
684
|
-
} else if (period === "AM") {
|
|
685
|
-
if (hour === 12) return 0;
|
|
686
|
-
return hour;
|
|
687
|
-
}
|
|
688
|
-
return hour;
|
|
689
|
-
}
|
|
690
|
-
function display12HourValue(hours) {
|
|
691
|
-
if (hours === 0 || hours === 12) return "12";
|
|
692
|
-
if (hours >= 22) return `${hours - 12}`;
|
|
693
|
-
if (hours % 12 > 9) return `${hours}`;
|
|
694
|
-
return `0${hours % 12}`;
|
|
695
|
-
}
|
|
696
|
-
|
|
697
|
-
// src/components/date-time-picker/TimePickerInput.tsx
|
|
698
|
-
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
699
|
-
var TimePickerInput = React9.forwardRef(
|
|
700
|
-
({
|
|
701
|
-
className,
|
|
702
|
-
type = "tel",
|
|
703
|
-
value,
|
|
704
|
-
id,
|
|
705
|
-
name,
|
|
706
|
-
date = new Date((/* @__PURE__ */ new Date()).setHours(0, 0, 0, 0)),
|
|
707
|
-
setDate,
|
|
708
|
-
onChange,
|
|
709
|
-
onKeyDown,
|
|
710
|
-
picker,
|
|
711
|
-
period,
|
|
712
|
-
onLeftFocus,
|
|
713
|
-
onRightFocus,
|
|
714
|
-
...props
|
|
715
|
-
}, ref) => {
|
|
716
|
-
const [flag, setFlag] = React9.useState(false);
|
|
717
|
-
const [prevIntKey, setPrevIntKey] = React9.useState("0");
|
|
718
|
-
React9.useEffect(() => {
|
|
719
|
-
if (flag) {
|
|
720
|
-
const timer = setTimeout(() => {
|
|
721
|
-
setFlag(false);
|
|
722
|
-
}, 2e3);
|
|
723
|
-
return () => clearTimeout(timer);
|
|
724
|
-
}
|
|
725
|
-
}, [flag]);
|
|
726
|
-
const calculatedValue = React9.useMemo(() => {
|
|
727
|
-
return getDateByType(date, picker);
|
|
728
|
-
}, [date, picker]);
|
|
729
|
-
const calculateNewValue = (key) => {
|
|
730
|
-
if (picker === "12hours") {
|
|
731
|
-
if (flag && calculatedValue.slice(1, 2) === "1" && prevIntKey === "0")
|
|
732
|
-
return "0" + key;
|
|
733
|
-
}
|
|
734
|
-
return !flag ? "0" + key : calculatedValue.slice(1, 2) + key;
|
|
735
|
-
};
|
|
736
|
-
const handleKeyDown = (e) => {
|
|
737
|
-
if (e.key === "Tab") return;
|
|
738
|
-
e.preventDefault();
|
|
739
|
-
if (e.key === "ArrowRight") onRightFocus?.();
|
|
740
|
-
if (e.key === "ArrowLeft") onLeftFocus?.();
|
|
741
|
-
if (["ArrowUp", "ArrowDown"].includes(e.key)) {
|
|
742
|
-
const step = e.key === "ArrowUp" ? 1 : -1;
|
|
743
|
-
const newValue = getArrowByType(calculatedValue, step, picker);
|
|
744
|
-
if (flag) setFlag(false);
|
|
745
|
-
const tempDate = new Date(date);
|
|
746
|
-
setDate(setDateByType(tempDate, newValue, picker, period));
|
|
747
|
-
}
|
|
748
|
-
if (e.key >= "0" && e.key <= "9") {
|
|
749
|
-
if (picker === "12hours") setPrevIntKey(e.key);
|
|
750
|
-
const newValue = calculateNewValue(e.key);
|
|
751
|
-
if (flag) onRightFocus?.();
|
|
752
|
-
setFlag((prev) => !prev);
|
|
753
|
-
const tempDate = new Date(date);
|
|
754
|
-
setDate(setDateByType(tempDate, newValue, picker, period));
|
|
755
|
-
}
|
|
756
|
-
};
|
|
757
|
-
return /* @__PURE__ */ jsx9(
|
|
758
|
-
InputBase,
|
|
759
|
-
{
|
|
760
|
-
ref,
|
|
761
|
-
id: id || picker,
|
|
762
|
-
name: name || picker,
|
|
763
|
-
className: cn(
|
|
764
|
-
"focus:bg-accent focus:text-accent-foreground w-[48px] text-center font-mono text-base tabular-nums caret-transparent [&::-webkit-inner-spin-button]:appearance-none",
|
|
765
|
-
className
|
|
766
|
-
),
|
|
767
|
-
value: value || calculatedValue,
|
|
768
|
-
onChange: (e) => {
|
|
769
|
-
e.preventDefault();
|
|
770
|
-
onChange?.(e);
|
|
771
|
-
},
|
|
772
|
-
type,
|
|
773
|
-
inputMode: "decimal",
|
|
774
|
-
onKeyDown: (e) => {
|
|
775
|
-
onKeyDown?.(e);
|
|
776
|
-
handleKeyDown(e);
|
|
777
|
-
},
|
|
778
|
-
...props
|
|
779
|
-
}
|
|
780
|
-
);
|
|
781
|
-
}
|
|
782
|
-
);
|
|
783
|
-
TimePickerInput.displayName = "TimePickerInput";
|
|
784
|
-
|
|
785
|
-
// src/components/date-time-picker/TimePicker.tsx
|
|
786
|
-
import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
787
|
-
function TimePicker({ date, setDate, hideSeconds }) {
|
|
788
|
-
const minuteRef = React10.useRef(null);
|
|
789
|
-
const hourRef = React10.useRef(null);
|
|
790
|
-
const secondRef = React10.useRef(null);
|
|
791
|
-
return /* @__PURE__ */ jsxs5("div", { className: "flex items-end gap-2", children: [
|
|
792
|
-
/* @__PURE__ */ jsxs5("div", { className: "grid gap-1 text-center", children: [
|
|
793
|
-
/* @__PURE__ */ jsx10(LabelBase_default, { htmlFor: "hours", className: "text-xs", children: "Horas" }),
|
|
794
|
-
/* @__PURE__ */ jsx10(
|
|
795
|
-
TimePickerInput,
|
|
796
|
-
{
|
|
797
|
-
picker: "hours",
|
|
798
|
-
date,
|
|
799
|
-
setDate,
|
|
800
|
-
ref: hourRef,
|
|
801
|
-
onRightFocus: () => minuteRef.current?.focus()
|
|
802
|
-
}
|
|
803
|
-
)
|
|
804
|
-
] }),
|
|
805
|
-
/* @__PURE__ */ jsxs5("div", { className: "grid gap-1 text-center", children: [
|
|
806
|
-
/* @__PURE__ */ jsx10(LabelBase_default, { htmlFor: "minutes", className: "text-xs", children: "Minutos" }),
|
|
807
|
-
/* @__PURE__ */ jsx10(
|
|
808
|
-
TimePickerInput,
|
|
809
|
-
{
|
|
810
|
-
picker: "minutes",
|
|
811
|
-
date,
|
|
812
|
-
setDate,
|
|
813
|
-
ref: minuteRef,
|
|
814
|
-
onLeftFocus: () => hourRef.current?.focus(),
|
|
815
|
-
onRightFocus: () => secondRef.current?.focus()
|
|
816
|
-
}
|
|
817
|
-
)
|
|
818
|
-
] }),
|
|
819
|
-
!hideSeconds && /* @__PURE__ */ jsxs5("div", { className: "grid gap-1 text-center", children: [
|
|
820
|
-
/* @__PURE__ */ jsx10(LabelBase_default, { htmlFor: "seconds", className: "text-xs", children: "Segundos" }),
|
|
821
|
-
/* @__PURE__ */ jsx10(
|
|
822
|
-
TimePickerInput,
|
|
823
|
-
{
|
|
824
|
-
picker: "seconds",
|
|
825
|
-
date,
|
|
826
|
-
setDate,
|
|
827
|
-
ref: secondRef,
|
|
828
|
-
onLeftFocus: () => minuteRef.current?.focus()
|
|
829
|
-
}
|
|
830
|
-
)
|
|
831
|
-
] }),
|
|
832
|
-
/* @__PURE__ */ jsx10("div", { className: "flex h-10 items-center", children: /* @__PURE__ */ jsx10(Clock, { className: "ml-2 h-4 w-4" }) })
|
|
833
|
-
] });
|
|
834
|
-
}
|
|
835
|
-
|
|
836
|
-
// src/components/date-time-picker/DateTimePicker.tsx
|
|
837
|
-
import { Fragment, jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
838
|
-
function DateTimePicker({
|
|
839
|
-
label,
|
|
840
|
-
date,
|
|
841
|
-
onChange,
|
|
842
|
-
hideSeconds,
|
|
843
|
-
fromDate,
|
|
844
|
-
toDate,
|
|
845
|
-
disabled,
|
|
846
|
-
dialogTitle
|
|
847
|
-
}) {
|
|
848
|
-
const [internalDate, setInternalDate] = useState2(date);
|
|
849
|
-
const handleSelect = (newDay) => {
|
|
850
|
-
if (!newDay) return;
|
|
851
|
-
if (!internalDate) {
|
|
852
|
-
setInternalDate(newDay);
|
|
853
|
-
return;
|
|
854
|
-
}
|
|
855
|
-
const diff = newDay.getTime() - internalDate.getTime();
|
|
856
|
-
const diffInDays = diff / (1e3 * 60 * 60 * 24);
|
|
857
|
-
const newDateFull = add(internalDate, { days: Math.ceil(diffInDays) });
|
|
858
|
-
setInternalDate(newDateFull);
|
|
859
|
-
};
|
|
860
|
-
const [open, setOpen] = useState2(false);
|
|
861
|
-
useEffect(() => {
|
|
862
|
-
if (date) {
|
|
863
|
-
setInternalDate(date);
|
|
864
|
-
}
|
|
865
|
-
}, [date, open]);
|
|
866
|
-
return /* @__PURE__ */ jsxs6(Fragment, { children: [
|
|
867
|
-
label && /* @__PURE__ */ jsx11(LabelBase_default, { className: "mb-[-1rem] pl-2", children: label }),
|
|
868
|
-
/* @__PURE__ */ jsxs6(DialogBase, { open, onOpenChange: setOpen, children: [
|
|
869
|
-
/* @__PURE__ */ jsx11(DialogTriggerBase, { disabled, asChild: true, children: /* @__PURE__ */ jsxs6(
|
|
870
|
-
ButtonBase,
|
|
871
|
-
{
|
|
872
|
-
variant: "default",
|
|
873
|
-
size: "lg",
|
|
874
|
-
className: cn(
|
|
875
|
-
"w-full justify-start text-left font-normal text-zinc-950",
|
|
876
|
-
!date && "text-muted-foreground"
|
|
877
|
-
),
|
|
878
|
-
children: [
|
|
879
|
-
date ? format(date, "PPP - HH:mm", { locale: ptBR }) : /* @__PURE__ */ jsx11("span", { className: "text-zinc-400", children: "Pick a date" }),
|
|
880
|
-
/* @__PURE__ */ jsx11(Calendar2, { className: "ml-auto text-gray-500", size: 24 })
|
|
881
|
-
]
|
|
882
|
-
}
|
|
883
|
-
) }),
|
|
884
|
-
/* @__PURE__ */ jsxs6(DialogContentBase, { children: [
|
|
885
|
-
/* @__PURE__ */ jsx11(DialogHeaderBase, { children: /* @__PURE__ */ jsx11(DialogTitleBase, { className: "text-xl font-semibold", children: dialogTitle ?? "Selecione a data" }) }),
|
|
886
|
-
/* @__PURE__ */ jsx11(
|
|
887
|
-
CalendarBase,
|
|
888
|
-
{
|
|
889
|
-
mode: "single",
|
|
890
|
-
locale: ptBR,
|
|
891
|
-
selected: internalDate,
|
|
892
|
-
onSelect: (d) => handleSelect(d),
|
|
893
|
-
initialFocus: true,
|
|
894
|
-
fromDate,
|
|
895
|
-
toDate
|
|
896
|
-
}
|
|
897
|
-
),
|
|
898
|
-
/* @__PURE__ */ jsx11("div", { className: "border-border flex justify-center border-t p-3", children: /* @__PURE__ */ jsx11(
|
|
899
|
-
TimePicker,
|
|
900
|
-
{
|
|
901
|
-
setDate: setInternalDate,
|
|
902
|
-
date: internalDate,
|
|
903
|
-
hideSeconds
|
|
904
|
-
}
|
|
905
|
-
) }),
|
|
906
|
-
/* @__PURE__ */ jsx11(
|
|
907
|
-
ButtonBase,
|
|
908
|
-
{
|
|
909
|
-
onClick: () => {
|
|
910
|
-
onChange(internalDate);
|
|
911
|
-
setOpen(false);
|
|
912
|
-
},
|
|
913
|
-
children: "Salvar"
|
|
914
|
-
}
|
|
915
|
-
)
|
|
916
|
-
] })
|
|
917
|
-
] })
|
|
918
|
-
] });
|
|
919
|
-
}
|
|
920
|
-
|
|
921
4
|
// src/hooks/use-mobile.tsx
|
|
922
|
-
import * as
|
|
5
|
+
import * as React from "react";
|
|
923
6
|
var MOBILE_BREAKPOINT = 768;
|
|
924
7
|
function useIsMobile() {
|
|
925
|
-
const [isMobile, setIsMobile] =
|
|
926
|
-
|
|
8
|
+
const [isMobile, setIsMobile] = React.useState(void 0);
|
|
9
|
+
React.useEffect(() => {
|
|
927
10
|
const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
|
|
928
11
|
const onChange = () => {
|
|
929
12
|
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
|
|
@@ -935,2503 +18,40 @@ function useIsMobile() {
|
|
|
935
18
|
return !!isMobile;
|
|
936
19
|
}
|
|
937
20
|
|
|
938
|
-
// src/components/
|
|
939
|
-
import
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
import * as React12 from "react";
|
|
943
|
-
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
|
|
944
|
-
import { Check, CaretRight as CaretRight2, Circle } from "phosphor-react";
|
|
945
|
-
import { motion as motion2, AnimatePresence } from "framer-motion";
|
|
946
|
-
import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
947
|
-
var DropDownMenuBase = DropdownMenuPrimitive.Root;
|
|
948
|
-
var DropDownMenuTriggerBase = DropdownMenuPrimitive.Trigger;
|
|
949
|
-
var DropDownMenuGroupBase = DropdownMenuPrimitive.Group;
|
|
950
|
-
var DropDownMenuPortalBase = DropdownMenuPrimitive.Portal;
|
|
951
|
-
var DropDownMenuSubBase = DropdownMenuPrimitive.Sub;
|
|
952
|
-
var DropDownMenuRadioGroupBase = DropdownMenuPrimitive.RadioGroup;
|
|
953
|
-
var DropDownMenuSubTriggerBase = React12.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs7(
|
|
954
|
-
DropdownMenuPrimitive.SubTrigger,
|
|
955
|
-
{
|
|
956
|
-
ref,
|
|
957
|
-
className: cn(
|
|
958
|
-
"flex cursor-default gap-2 select-none items-center 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",
|
|
959
|
-
inset && "pl-8",
|
|
960
|
-
className
|
|
961
|
-
),
|
|
962
|
-
...props,
|
|
963
|
-
children: [
|
|
964
|
-
children,
|
|
965
|
-
/* @__PURE__ */ jsx12(CaretRight2, { className: "ml-auto" })
|
|
966
|
-
]
|
|
967
|
-
}
|
|
968
|
-
));
|
|
969
|
-
DropDownMenuSubTriggerBase.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
|
|
970
|
-
var DropDownMenuSubContentBase = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
|
|
971
|
-
DropdownMenuPrimitive.SubContent,
|
|
972
|
-
{
|
|
973
|
-
ref,
|
|
974
|
-
className: cn(
|
|
975
|
-
" 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",
|
|
976
|
-
className
|
|
977
|
-
),
|
|
978
|
-
...props
|
|
979
|
-
}
|
|
980
|
-
));
|
|
981
|
-
var DropDownMenuContentBase = React12.forwardRef(({ className, sideOffset = 4, testid: dataTestId = "dropdown-content", ...props }, ref) => /* @__PURE__ */ jsx12(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx12(
|
|
982
|
-
DropdownMenuPrimitive.Content,
|
|
983
|
-
{
|
|
984
|
-
sideOffset,
|
|
985
|
-
forceMount: true,
|
|
986
|
-
ref,
|
|
987
|
-
className: cn("z-[9999] p-0", className),
|
|
988
|
-
"data-testid": dataTestId,
|
|
989
|
-
...props,
|
|
990
|
-
children: /* @__PURE__ */ jsx12(AnimatePresence, { children: /* @__PURE__ */ jsx12(
|
|
991
|
-
motion2.div,
|
|
992
|
-
{
|
|
993
|
-
initial: { opacity: 0, scale: 0.95, y: 5 },
|
|
994
|
-
animate: { opacity: 1, scale: 1, y: 0 },
|
|
995
|
-
exit: { opacity: 0, scale: 0.95, y: 5 },
|
|
996
|
-
transition: { duration: 0.2, ease: "easeOut" },
|
|
997
|
-
className: cn(
|
|
998
|
-
"min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md",
|
|
999
|
-
className
|
|
1000
|
-
),
|
|
1001
|
-
children: props.children
|
|
1002
|
-
}
|
|
1003
|
-
) })
|
|
1004
|
-
}
|
|
1005
|
-
) }));
|
|
1006
|
-
DropDownMenuContentBase.displayName = DropdownMenuPrimitive.Content.displayName;
|
|
1007
|
-
var DropDownMenuItemBase = React12.forwardRef(({ className, inset, leftIcon, rightIcon, children, ...props }, ref) => /* @__PURE__ */ jsxs7(
|
|
1008
|
-
DropdownMenuPrimitive.Item,
|
|
1009
|
-
{
|
|
1010
|
-
ref,
|
|
1011
|
-
className: cn(
|
|
1012
|
-
"relative flex cursor-default select-none items-center justify-between 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",
|
|
1013
|
-
inset && "pl-8",
|
|
1014
|
-
className
|
|
1015
|
-
),
|
|
1016
|
-
...props,
|
|
1017
|
-
children: [
|
|
1018
|
-
/* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2", children: [
|
|
1019
|
-
leftIcon && /* @__PURE__ */ jsx12("span", { className: "[&>svg]:size-4", children: leftIcon }),
|
|
1020
|
-
children
|
|
1021
|
-
] }),
|
|
1022
|
-
rightIcon && /* @__PURE__ */ jsx12("span", { className: "[&>svg]:size-4", children: rightIcon })
|
|
1023
|
-
]
|
|
1024
|
-
}
|
|
1025
|
-
));
|
|
1026
|
-
DropDownMenuItemBase.displayName = DropdownMenuPrimitive.Item.displayName;
|
|
1027
|
-
var DropDownMenuCheckboxItemBase = React12.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs7(
|
|
1028
|
-
DropdownMenuPrimitive.CheckboxItem,
|
|
1029
|
-
{
|
|
1030
|
-
ref,
|
|
1031
|
-
className: cn(
|
|
1032
|
-
"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",
|
|
1033
|
-
className
|
|
1034
|
-
),
|
|
1035
|
-
checked,
|
|
1036
|
-
...props,
|
|
1037
|
-
children: [
|
|
1038
|
-
/* @__PURE__ */ jsx12("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx12(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx12(Check, { className: "h-4 w-4" }) }) }),
|
|
1039
|
-
children
|
|
1040
|
-
]
|
|
1041
|
-
}
|
|
1042
|
-
));
|
|
1043
|
-
DropDownMenuCheckboxItemBase.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
|
|
1044
|
-
var DropDownMenuRadioItemBase = React12.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs7(
|
|
1045
|
-
DropdownMenuPrimitive.RadioItem,
|
|
1046
|
-
{
|
|
1047
|
-
ref,
|
|
1048
|
-
className: cn(
|
|
1049
|
-
"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",
|
|
1050
|
-
className
|
|
1051
|
-
),
|
|
1052
|
-
...props,
|
|
1053
|
-
children: [
|
|
1054
|
-
/* @__PURE__ */ jsx12("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx12(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx12(Circle, { className: "h-2 w-2 fill-current" }) }) }),
|
|
1055
|
-
children
|
|
1056
|
-
]
|
|
1057
|
-
}
|
|
1058
|
-
));
|
|
1059
|
-
DropDownMenuRadioItemBase.displayName = DropdownMenuPrimitive.RadioItem.displayName;
|
|
1060
|
-
var DropDownMenuLabelBase = React12.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx12(
|
|
1061
|
-
DropdownMenuPrimitive.Label,
|
|
1062
|
-
{
|
|
1063
|
-
ref,
|
|
1064
|
-
className: cn(
|
|
1065
|
-
"px-2 py-1.5 text-sm font-semibold",
|
|
1066
|
-
inset && "pl-8",
|
|
1067
|
-
className
|
|
1068
|
-
),
|
|
1069
|
-
...props
|
|
1070
|
-
}
|
|
1071
|
-
));
|
|
1072
|
-
DropDownMenuLabelBase.displayName = DropdownMenuPrimitive.Label.displayName;
|
|
1073
|
-
var DropDownMenuSeparatorBase = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx12(
|
|
1074
|
-
DropdownMenuPrimitive.Separator,
|
|
1075
|
-
{
|
|
1076
|
-
ref,
|
|
1077
|
-
className: cn("-mx-1 my-1 h-px bg-muted", className),
|
|
1078
|
-
...props
|
|
1079
|
-
}
|
|
1080
|
-
));
|
|
1081
|
-
DropDownMenuSeparatorBase.displayName = DropdownMenuPrimitive.Separator.displayName;
|
|
1082
|
-
var DropDownMenuShortcutBase = ({
|
|
1083
|
-
className,
|
|
1084
|
-
...props
|
|
1085
|
-
}) => {
|
|
1086
|
-
return /* @__PURE__ */ jsx12(
|
|
1087
|
-
"span",
|
|
1088
|
-
{
|
|
1089
|
-
className: cn("ml-auto text-xs tracking-widest opacity-60", className),
|
|
1090
|
-
...props
|
|
1091
|
-
}
|
|
1092
|
-
);
|
|
1093
|
-
};
|
|
1094
|
-
DropDownMenuShortcutBase.displayName = "DropDownMenuShortcutBase";
|
|
1095
|
-
|
|
1096
|
-
// src/components/theme-provider.tsx
|
|
1097
|
-
import { createContext, useContext, useEffect as useEffect3, useState as useState4 } from "react";
|
|
1098
|
-
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
1099
|
-
var initialState = {
|
|
1100
|
-
theme: "system",
|
|
1101
|
-
setTheme: () => null
|
|
1102
|
-
};
|
|
1103
|
-
var ThemeProviderContext = createContext(initialState);
|
|
1104
|
-
function ThemeProviderBase({
|
|
1105
|
-
children,
|
|
1106
|
-
defaultTheme = "system",
|
|
1107
|
-
storageKey = "vite-ui-theme",
|
|
1108
|
-
...props
|
|
1109
|
-
}) {
|
|
1110
|
-
const [theme, setTheme] = useState4(() => defaultTheme || defaultTheme);
|
|
1111
|
-
useEffect3(() => {
|
|
1112
|
-
const root = window.document.documentElement;
|
|
1113
|
-
root.classList.remove(
|
|
1114
|
-
"light",
|
|
1115
|
-
"light-purple",
|
|
1116
|
-
"light-green",
|
|
1117
|
-
"light-blue",
|
|
1118
|
-
"dark",
|
|
1119
|
-
"dark-purple",
|
|
1120
|
-
"dark-green",
|
|
1121
|
-
"dark-blue",
|
|
1122
|
-
"system"
|
|
1123
|
-
);
|
|
1124
|
-
if (theme === "system") {
|
|
1125
|
-
const systemTheme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
|
|
1126
|
-
root.classList.add(systemTheme);
|
|
1127
|
-
return;
|
|
1128
|
-
}
|
|
1129
|
-
root.classList.add(theme);
|
|
1130
|
-
}, [theme]);
|
|
1131
|
-
const value = {
|
|
1132
|
-
theme,
|
|
1133
|
-
setTheme: (theme2) => {
|
|
1134
|
-
localStorage.setItem(storageKey, theme2);
|
|
1135
|
-
setTheme(theme2);
|
|
1136
|
-
}
|
|
1137
|
-
};
|
|
1138
|
-
return /* @__PURE__ */ jsx13(ThemeProviderContext.Provider, { ...props, value, children });
|
|
1139
|
-
}
|
|
1140
|
-
var useTheme = () => {
|
|
1141
|
-
const context = useContext(ThemeProviderContext);
|
|
1142
|
-
if (context === void 0)
|
|
1143
|
-
throw new Error("useTheme must be used within a ThemeProvider");
|
|
1144
|
-
return context;
|
|
1145
|
-
};
|
|
1146
|
-
|
|
1147
|
-
// src/components/mode-toggle.tsx
|
|
1148
|
-
import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1149
|
-
var themeLabels = {
|
|
1150
|
-
light: "Light",
|
|
1151
|
-
dark: "Dark",
|
|
1152
|
-
system: "System",
|
|
1153
|
-
"light-purple": "Light Purple",
|
|
1154
|
-
"dark-purple": "Dark Purple",
|
|
1155
|
-
"light-blue": "Light Blue",
|
|
1156
|
-
"dark-blue": "Dark Blue",
|
|
1157
|
-
"light-green": "Light Green",
|
|
1158
|
-
"dark-green": "Dark Green"
|
|
1159
|
-
};
|
|
1160
|
-
function ModeToggleBase({
|
|
1161
|
-
themes = ["light", "dark", "system"]
|
|
1162
|
-
}) {
|
|
1163
|
-
const { setTheme, theme: currentTheme } = useTheme();
|
|
1164
|
-
return /* @__PURE__ */ jsxs8(DropDownMenuBase, { children: [
|
|
1165
|
-
/* @__PURE__ */ jsx14(DropDownMenuTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxs8(
|
|
1166
|
-
ButtonBase,
|
|
1167
|
-
{
|
|
1168
|
-
variant: "ghost",
|
|
1169
|
-
size: "icon",
|
|
1170
|
-
className: "relative overflow-hidden border-transparent",
|
|
1171
|
-
children: [
|
|
1172
|
-
/* @__PURE__ */ jsxs8(Fragment2, { children: [
|
|
1173
|
-
/* @__PURE__ */ jsx14(Sun, { className: "h-[1.2rem] w-[1.2rem] transition-transform duration-300 rotate-0 scale-100" }),
|
|
1174
|
-
/* @__PURE__ */ jsx14(Moon, { className: "absolute top-0 left-0 h-[1.2rem] w-[1.2rem] transition-transform duration-300 rotate-90 scale-0" })
|
|
1175
|
-
] }),
|
|
1176
|
-
/* @__PURE__ */ jsx14("span", { className: "sr-only", children: "Toggle theme" })
|
|
1177
|
-
]
|
|
1178
|
-
}
|
|
1179
|
-
) }),
|
|
1180
|
-
/* @__PURE__ */ jsx14(DropDownMenuContentBase, { align: "end", className: "dark:border-transparent", children: themes.map((theme) => /* @__PURE__ */ jsxs8(
|
|
1181
|
-
DropDownMenuItemBase,
|
|
1182
|
-
{
|
|
1183
|
-
onClick: () => setTheme(theme),
|
|
1184
|
-
className: "flex items-center justify-between",
|
|
1185
|
-
children: [
|
|
1186
|
-
themeLabels[theme],
|
|
1187
|
-
currentTheme === theme && /* @__PURE__ */ jsx14(Check2, { className: "h-4 w-4 opacity-100" })
|
|
1188
|
-
]
|
|
1189
|
-
},
|
|
1190
|
-
theme
|
|
1191
|
-
)) })
|
|
1192
|
-
] });
|
|
1193
|
-
}
|
|
1194
|
-
|
|
1195
|
-
// src/components/selects/Combobox.tsx
|
|
1196
|
-
import { useCallback, useMemo } from "react";
|
|
1197
|
-
|
|
1198
|
-
// src/components/ui/CommandBase.tsx
|
|
1199
|
-
import * as React13 from "react";
|
|
1200
|
-
import { Command as CommandPrimitive } from "cmdk";
|
|
1201
|
-
import { MagnifyingGlass } from "phosphor-react";
|
|
1202
|
-
import { motion as motion3, AnimatePresence as AnimatePresence2 } from "framer-motion";
|
|
1203
|
-
import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1204
|
-
var CommandBase = React13.forwardRef(({ className, testid: dataTestId = "command-base", ...props }, ref) => /* @__PURE__ */ jsx15(
|
|
1205
|
-
CommandPrimitive,
|
|
1206
|
-
{
|
|
1207
|
-
ref,
|
|
1208
|
-
className: cn(
|
|
1209
|
-
"flex h-full w-full flex-col overflow-hidden rounded-md bg-background text-popover-foreground",
|
|
1210
|
-
className
|
|
1211
|
-
),
|
|
1212
|
-
"data-testid": dataTestId,
|
|
1213
|
-
...props
|
|
1214
|
-
}
|
|
1215
|
-
));
|
|
1216
|
-
CommandBase.displayName = CommandPrimitive.displayName;
|
|
1217
|
-
var dialogVariants = {
|
|
1218
|
-
hidden: { opacity: 0, scale: 0.95, y: -20 },
|
|
1219
|
-
visible: { opacity: 1, scale: 1, y: 0 },
|
|
1220
|
-
exit: { opacity: 0, scale: 0.95, y: -20 }
|
|
1221
|
-
};
|
|
1222
|
-
var CommandDialogBase = ({ children, open, ...props }) => {
|
|
1223
|
-
return /* @__PURE__ */ jsx15(DialogBase, { open, ...props, children: /* @__PURE__ */ jsx15(AnimatePresence2, { children: open && /* @__PURE__ */ jsx15(DialogContentBase, { asChild: true, forceMount: true, children: /* @__PURE__ */ jsx15(
|
|
1224
|
-
motion3.div,
|
|
1225
|
-
{
|
|
1226
|
-
initial: "hidden",
|
|
1227
|
-
animate: "visible",
|
|
1228
|
-
exit: "exit",
|
|
1229
|
-
variants: dialogVariants,
|
|
1230
|
-
transition: { duration: 0.2, ease: "easeOut" },
|
|
1231
|
-
className: "overflow-hidden p-0",
|
|
1232
|
-
children: /* @__PURE__ */ jsx15(CommandBase, { className: "[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children })
|
|
1233
|
-
},
|
|
1234
|
-
"command-dialog"
|
|
1235
|
-
) }) }) });
|
|
1236
|
-
};
|
|
1237
|
-
var CommandInputBase = React13.forwardRef(({ className, testid: dataTestId = "command-input", ...props }, ref) => /* @__PURE__ */ jsxs9("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
|
|
1238
|
-
/* @__PURE__ */ jsx15(MagnifyingGlass, { className: "mr-2 h-4 w-4 shrink-0 text-primary" }),
|
|
1239
|
-
/* @__PURE__ */ jsx15(
|
|
1240
|
-
CommandPrimitive.Input,
|
|
1241
|
-
{
|
|
1242
|
-
ref,
|
|
1243
|
-
className: cn(
|
|
1244
|
-
"flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none text-primary placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
|
|
1245
|
-
className
|
|
1246
|
-
),
|
|
1247
|
-
"data-testid": dataTestId,
|
|
1248
|
-
...props
|
|
1249
|
-
}
|
|
1250
|
-
)
|
|
1251
|
-
] }));
|
|
1252
|
-
CommandInputBase.displayName = CommandPrimitive.Input.displayName;
|
|
1253
|
-
var CommandListBase = React13.forwardRef(({ className, testid: dataTestId = "command-list", ...props }, ref) => /* @__PURE__ */ jsx15(
|
|
1254
|
-
CommandPrimitive.List,
|
|
1255
|
-
{
|
|
1256
|
-
ref,
|
|
1257
|
-
className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className),
|
|
1258
|
-
"data-testid": dataTestId,
|
|
1259
|
-
...props
|
|
1260
|
-
}
|
|
1261
|
-
));
|
|
1262
|
-
CommandListBase.displayName = CommandPrimitive.List.displayName;
|
|
1263
|
-
var CommandEmptyBase = React13.forwardRef(({ testid: dataTestId = "command-empty", ...props }, ref) => /* @__PURE__ */ jsx15(CommandPrimitive.Empty, { ref, className: "py-6 text-center text-sm", "data-testid": dataTestId, ...props }));
|
|
1264
|
-
CommandEmptyBase.displayName = CommandPrimitive.Empty.displayName;
|
|
1265
|
-
var CommandGroupBase = React13.forwardRef(({ className, testid: dataTestId = "command-group", ...props }, ref) => /* @__PURE__ */ jsx15(
|
|
1266
|
-
CommandPrimitive.Group,
|
|
1267
|
-
{
|
|
1268
|
-
ref,
|
|
1269
|
-
className: cn(
|
|
1270
|
-
"overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground",
|
|
1271
|
-
className
|
|
1272
|
-
),
|
|
1273
|
-
"data-testid": dataTestId,
|
|
1274
|
-
...props
|
|
1275
|
-
}
|
|
1276
|
-
));
|
|
1277
|
-
CommandGroupBase.displayName = CommandPrimitive.Group.displayName;
|
|
1278
|
-
var CommandSeparatorBase = React13.forwardRef(({ className, testid: dataTestId = "command-separator", ...props }, ref) => /* @__PURE__ */ jsx15(CommandPrimitive.Separator, { ref, className: cn("-mx-1 h-px bg-border", className), "data-testid": dataTestId, ...props }));
|
|
1279
|
-
CommandSeparatorBase.displayName = CommandPrimitive.Separator.displayName;
|
|
1280
|
-
var CommandItemBase = React13.forwardRef(({ className, testid: dataTestId = "command-item", ...props }, ref) => /* @__PURE__ */ jsx15(
|
|
1281
|
-
CommandPrimitive.Item,
|
|
1282
|
-
{
|
|
1283
|
-
ref,
|
|
1284
|
-
className: cn(
|
|
1285
|
-
"relative flex cursor-pointer gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-all data-[disabled=true]:pointer-events-none data-[selected=true]:bg-primary data-[selected=true]:text-background data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 hover:scale-[1.02] active:scale-[0.98]",
|
|
1286
|
-
className
|
|
1287
|
-
),
|
|
1288
|
-
"data-testid": dataTestId,
|
|
1289
|
-
...props
|
|
1290
|
-
}
|
|
1291
|
-
));
|
|
1292
|
-
CommandItemBase.displayName = CommandPrimitive.Item.displayName;
|
|
1293
|
-
var CommandShortcutBase = ({ className, ...props }) => {
|
|
1294
|
-
return /* @__PURE__ */ jsx15("span", { className: cn("ml-auto text-xs tracking-widest text-muted-foreground", className), ...props });
|
|
1295
|
-
};
|
|
1296
|
-
CommandShortcutBase.displayName = "CommandShortcut";
|
|
1297
|
-
|
|
1298
|
-
// src/components/selects/ComboboxBase.tsx
|
|
1299
|
-
import { CaretDown, Check as Check3 } from "phosphor-react";
|
|
1300
|
-
import { useState as useState5 } from "react";
|
|
1301
|
-
import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1302
|
-
function ComboboxBase({
|
|
1303
|
-
items,
|
|
1304
|
-
renderSelected,
|
|
1305
|
-
handleSelection,
|
|
1306
|
-
checkIsSelected,
|
|
1307
|
-
searchPlaceholder,
|
|
1308
|
-
errorMessage,
|
|
1309
|
-
testIds = {}
|
|
1310
|
-
}) {
|
|
1311
|
-
const [open, setOpen] = useState5(false);
|
|
1312
|
-
return /* @__PURE__ */ jsx16(
|
|
1313
|
-
"div",
|
|
1314
|
-
{
|
|
1315
|
-
className: "col-span-1 w-full",
|
|
1316
|
-
"data-testid": testIds.root ?? "combobox-base-root",
|
|
1317
|
-
children: /* @__PURE__ */ jsxs10(PopoverBase, { open, onOpenChange: setOpen, modal: true, children: [
|
|
1318
|
-
/* @__PURE__ */ jsx16(
|
|
1319
|
-
PopoverTriggerBase,
|
|
1320
|
-
{
|
|
1321
|
-
asChild: true,
|
|
1322
|
-
className: "flex w-full justify-between dark:bg-[hsl(231,15%,19%)]",
|
|
1323
|
-
children: /* @__PURE__ */ jsxs10(
|
|
1324
|
-
ButtonBase,
|
|
1325
|
-
{
|
|
1326
|
-
variant: "outline",
|
|
1327
|
-
role: "combobox",
|
|
1328
|
-
"aria-expanded": open,
|
|
1329
|
-
className: cn(
|
|
1330
|
-
"flex items-start gap-2 justify-between h-full",
|
|
1331
|
-
errorMessage && "border-red-500"
|
|
1332
|
-
),
|
|
1333
|
-
"data-testid": testIds.trigger ?? "combobox-trigger",
|
|
1334
|
-
children: [
|
|
1335
|
-
renderSelected,
|
|
1336
|
-
/* @__PURE__ */ jsx16(CaretDown, { size: 16, className: "mt-0.5" })
|
|
1337
|
-
]
|
|
1338
|
-
}
|
|
1339
|
-
)
|
|
1340
|
-
}
|
|
1341
|
-
),
|
|
1342
|
-
/* @__PURE__ */ jsx16(
|
|
1343
|
-
PopoverContentBase,
|
|
1344
|
-
{
|
|
1345
|
-
className: "max-h-[--radix-popover-content-available-height] w-[--radix-popover-trigger-width] p-0 border-none",
|
|
1346
|
-
"data-testid": testIds.popover ?? "combobox-popover",
|
|
1347
|
-
children: /* @__PURE__ */ jsxs10(
|
|
1348
|
-
CommandBase,
|
|
1349
|
-
{
|
|
1350
|
-
className: "dark:text-white",
|
|
1351
|
-
"data-testid": testIds.command ?? "combobox-command",
|
|
1352
|
-
children: [
|
|
1353
|
-
/* @__PURE__ */ jsx16(
|
|
1354
|
-
CommandInputBase,
|
|
1355
|
-
{
|
|
1356
|
-
tabIndex: -1,
|
|
1357
|
-
placeholder: searchPlaceholder ?? "Busque uma op\xE7\xE3o...",
|
|
1358
|
-
"data-testid": testIds.search ?? "combobox-search"
|
|
1359
|
-
}
|
|
1360
|
-
),
|
|
1361
|
-
/* @__PURE__ */ jsxs10(CommandListBase, { "data-testid": testIds.list ?? "combobox-list", children: [
|
|
1362
|
-
/* @__PURE__ */ jsx16(CommandEmptyBase, { "data-testid": testIds.empty ?? "combobox-empty", children: "Nenhum dado encontrado" }),
|
|
1363
|
-
/* @__PURE__ */ jsx16(CommandGroupBase, { "data-testid": testIds.group ?? "combobox-group", children: items.map((item) => {
|
|
1364
|
-
const isSelected = checkIsSelected(item.value);
|
|
1365
|
-
return /* @__PURE__ */ jsxs10(
|
|
1366
|
-
CommandItemBase,
|
|
1367
|
-
{
|
|
1368
|
-
keywords: [item.label],
|
|
1369
|
-
value: item.value,
|
|
1370
|
-
onSelect: (value) => {
|
|
1371
|
-
handleSelection(value);
|
|
1372
|
-
setOpen(false);
|
|
1373
|
-
},
|
|
1374
|
-
"data-testid": testIds.option ?? "combobox-option",
|
|
1375
|
-
children: [
|
|
1376
|
-
item.label,
|
|
1377
|
-
/* @__PURE__ */ jsx16(
|
|
1378
|
-
Check3,
|
|
1379
|
-
{
|
|
1380
|
-
className: cn(
|
|
1381
|
-
"ml-auto",
|
|
1382
|
-
isSelected ? "opacity-100" : "opacity-0"
|
|
1383
|
-
),
|
|
1384
|
-
"data-testid": isSelected ? testIds.check ?? "combobox-option-check" : void 0
|
|
1385
|
-
}
|
|
1386
|
-
)
|
|
1387
|
-
]
|
|
1388
|
-
},
|
|
1389
|
-
item.value
|
|
1390
|
-
);
|
|
1391
|
-
}) })
|
|
1392
|
-
] })
|
|
1393
|
-
]
|
|
1394
|
-
}
|
|
1395
|
-
)
|
|
1396
|
-
}
|
|
1397
|
-
)
|
|
1398
|
-
] })
|
|
1399
|
-
}
|
|
1400
|
-
);
|
|
1401
|
-
}
|
|
1402
|
-
|
|
1403
|
-
// src/components/selects/Combobox.tsx
|
|
1404
|
-
import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1405
|
-
function Combobox({
|
|
1406
|
-
items,
|
|
1407
|
-
selected,
|
|
1408
|
-
onChange,
|
|
1409
|
-
className,
|
|
1410
|
-
placeholder,
|
|
1411
|
-
searchPlaceholder,
|
|
1412
|
-
label,
|
|
1413
|
-
labelClassname,
|
|
1414
|
-
testIds
|
|
1415
|
-
}) {
|
|
1416
|
-
const selectedItem = items.find((item) => item.value === selected);
|
|
1417
|
-
const renderSelected = useMemo(() => {
|
|
1418
|
-
return /* @__PURE__ */ jsx17(
|
|
1419
|
-
"span",
|
|
1420
|
-
{
|
|
1421
|
-
"data-testid": testIds?.selected ?? "combobox-selected",
|
|
1422
|
-
className: cn("truncate", !selectedItem && "text-gray-500"),
|
|
1423
|
-
children: selectedItem?.label ?? placeholder ?? "Selecione uma op\xE7\xE3o..."
|
|
1424
|
-
}
|
|
1425
|
-
);
|
|
1426
|
-
}, [placeholder, selectedItem, testIds?.selected]);
|
|
1427
|
-
const checkIsSelected = useCallback(
|
|
1428
|
-
(value) => selected == null ? false : selected == value,
|
|
1429
|
-
[selected]
|
|
1430
|
-
);
|
|
1431
|
-
const handleSelection = useCallback(
|
|
1432
|
-
(value) => {
|
|
1433
|
-
onChange(value === selected ? null : value);
|
|
1434
|
-
},
|
|
1435
|
-
[selected, onChange]
|
|
1436
|
-
);
|
|
1437
|
-
return /* @__PURE__ */ jsxs11("div", { className: cn("flex flex-col gap-1 w-full min-w-[150px]", className), children: [
|
|
1438
|
-
label && /* @__PURE__ */ jsx17(LabelBase_default, { className: labelClassname, children: label }),
|
|
1439
|
-
/* @__PURE__ */ jsx17(
|
|
1440
|
-
ComboboxBase,
|
|
1441
|
-
{
|
|
1442
|
-
items,
|
|
1443
|
-
renderSelected,
|
|
1444
|
-
handleSelection,
|
|
1445
|
-
checkIsSelected,
|
|
1446
|
-
searchPlaceholder,
|
|
1447
|
-
testIds
|
|
1448
|
-
}
|
|
1449
|
-
)
|
|
1450
|
-
] });
|
|
1451
|
-
}
|
|
1452
|
-
|
|
1453
|
-
// src/components/selects/MultiCombobox.tsx
|
|
1454
|
-
import { useCallback as useCallback2, useMemo as useMemo2 } from "react";
|
|
1455
|
-
import { X as X3 } from "phosphor-react";
|
|
1456
|
-
import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1457
|
-
function MultiCombobox({
|
|
1458
|
-
items,
|
|
1459
|
-
selected,
|
|
1460
|
-
onChange,
|
|
1461
|
-
className,
|
|
1462
|
-
placeholder,
|
|
1463
|
-
searchPlaceholder,
|
|
1464
|
-
label,
|
|
1465
|
-
labelClassname,
|
|
1466
|
-
testIds = {}
|
|
1467
|
-
}) {
|
|
1468
|
-
const selectedItems = items.filter((item) => selected.includes(item.value));
|
|
1469
|
-
const checkIsSelected = useCallback2(
|
|
1470
|
-
(value) => selected.includes(value),
|
|
1471
|
-
[selected]
|
|
1472
|
-
);
|
|
1473
|
-
const handleSelection = useCallback2(
|
|
1474
|
-
(value) => {
|
|
1475
|
-
const isSelected = selected.includes(value);
|
|
1476
|
-
if (isSelected) {
|
|
1477
|
-
onChange(selected.filter((item) => item !== value));
|
|
1478
|
-
} else {
|
|
1479
|
-
onChange([...selected, value]);
|
|
1480
|
-
}
|
|
1481
|
-
},
|
|
1482
|
-
[selected, onChange]
|
|
1483
|
-
);
|
|
1484
|
-
const renderSelected = useMemo2(() => {
|
|
1485
|
-
if (selectedItems.length === 0) {
|
|
1486
|
-
return /* @__PURE__ */ jsx18(
|
|
1487
|
-
"span",
|
|
1488
|
-
{
|
|
1489
|
-
"data-testid": testIds.emptyPlaceholder ?? "combobox-selected-empty",
|
|
1490
|
-
className: "text-gray-500",
|
|
1491
|
-
children: placeholder ?? "Selecione uma op\xE7\xE3o..."
|
|
1492
|
-
}
|
|
1493
|
-
);
|
|
1494
|
-
}
|
|
1495
|
-
return /* @__PURE__ */ jsx18(
|
|
1496
|
-
"div",
|
|
1497
|
-
{
|
|
1498
|
-
"data-testid": testIds.selectedWrapper ?? "combobox-selected-wrapper",
|
|
1499
|
-
className: "flex w-full flex-wrap gap-2",
|
|
1500
|
-
children: selectedItems.map((item) => /* @__PURE__ */ jsxs12(
|
|
1501
|
-
"div",
|
|
1502
|
-
{
|
|
1503
|
-
className: "flex items-center gap-1 rounded-md border p-1",
|
|
1504
|
-
"data-testid": testIds.selectedItem?.(item.value) ?? `combobox-selected-${item.value}`,
|
|
1505
|
-
children: [
|
|
1506
|
-
/* @__PURE__ */ jsx18("span", { className: "whitespace-break-spaces text-xs", children: item.label }),
|
|
1507
|
-
/* @__PURE__ */ jsx18(
|
|
1508
|
-
"span",
|
|
1509
|
-
{
|
|
1510
|
-
role: "button",
|
|
1511
|
-
tabIndex: 0,
|
|
1512
|
-
onClick: (e) => {
|
|
1513
|
-
e.stopPropagation();
|
|
1514
|
-
handleSelection(item.value);
|
|
1515
|
-
},
|
|
1516
|
-
className: "cursor-pointer p-0 m-0 text-xs flex items-center justify-center hover:text-red-500 hover:scale-110 transition-all",
|
|
1517
|
-
children: /* @__PURE__ */ jsx18(X3, { size: 14 })
|
|
1518
|
-
}
|
|
1519
|
-
)
|
|
1520
|
-
]
|
|
1521
|
-
},
|
|
1522
|
-
item.value
|
|
1523
|
-
))
|
|
1524
|
-
}
|
|
1525
|
-
);
|
|
1526
|
-
}, [handleSelection, placeholder, selectedItems, testIds]);
|
|
1527
|
-
return /* @__PURE__ */ jsxs12(
|
|
1528
|
-
"div",
|
|
1529
|
-
{
|
|
1530
|
-
className: cn("flex flex-col gap-1 w-full min-w-[150px]", className),
|
|
1531
|
-
"data-testid": testIds.root ?? "multi-combobox-root",
|
|
1532
|
-
children: [
|
|
1533
|
-
label && /* @__PURE__ */ jsx18(
|
|
1534
|
-
LabelBase_default,
|
|
1535
|
-
{
|
|
1536
|
-
className: labelClassname,
|
|
1537
|
-
"data-testid": testIds.label ?? "multi-combobox-label",
|
|
1538
|
-
children: label
|
|
1539
|
-
}
|
|
1540
|
-
),
|
|
1541
|
-
/* @__PURE__ */ jsx18(
|
|
1542
|
-
ComboboxBase,
|
|
1543
|
-
{
|
|
1544
|
-
items,
|
|
1545
|
-
renderSelected,
|
|
1546
|
-
handleSelection,
|
|
1547
|
-
checkIsSelected,
|
|
1548
|
-
searchPlaceholder
|
|
1549
|
-
}
|
|
1550
|
-
)
|
|
1551
|
-
]
|
|
1552
|
-
}
|
|
1553
|
-
);
|
|
1554
|
-
}
|
|
1555
|
-
|
|
1556
|
-
// src/components/ui/SelectBase.tsx
|
|
1557
|
-
import * as React14 from "react";
|
|
1558
|
-
import * as SelectPrimitive from "@radix-ui/react-select";
|
|
1559
|
-
import { Check as Check4, CaretDown as CaretDown2, CaretUp } from "phosphor-react";
|
|
1560
|
-
import { motion as motion4, AnimatePresence as AnimatePresence3 } from "framer-motion";
|
|
1561
|
-
import { Fragment as Fragment3, jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1562
|
-
var SelectBase = SelectPrimitive.Root;
|
|
1563
|
-
var SelectGroupBase = SelectPrimitive.Group;
|
|
1564
|
-
var SelectValueBase = SelectPrimitive.Value;
|
|
1565
|
-
var SelectTriggerBase = React14.forwardRef(({ className, children, open, ...props }, ref) => /* @__PURE__ */ jsxs13(
|
|
1566
|
-
SelectPrimitive.Trigger,
|
|
1567
|
-
{
|
|
1568
|
-
ref,
|
|
1569
|
-
className: cn(
|
|
1570
|
-
"flex h-9 w-full items-center justify-between whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
|
|
1571
|
-
className
|
|
1572
|
-
),
|
|
1573
|
-
...props,
|
|
1574
|
-
children: [
|
|
1575
|
-
children,
|
|
1576
|
-
/* @__PURE__ */ jsx19(
|
|
1577
|
-
motion4.span,
|
|
1578
|
-
{
|
|
1579
|
-
animate: { rotate: open ? 180 : 0 },
|
|
1580
|
-
transition: { duration: 0.3 },
|
|
1581
|
-
className: "flex items-center",
|
|
1582
|
-
children: /* @__PURE__ */ jsx19(CaretDown2, { className: "h-4 w-4 opacity-50" })
|
|
1583
|
-
}
|
|
1584
|
-
)
|
|
1585
|
-
]
|
|
1586
|
-
}
|
|
1587
|
-
));
|
|
1588
|
-
SelectTriggerBase.displayName = SelectPrimitive.Trigger.displayName;
|
|
1589
|
-
var SelectScrollUpButtonBase = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
|
|
1590
|
-
SelectPrimitive.ScrollUpButton,
|
|
1591
|
-
{
|
|
1592
|
-
ref,
|
|
1593
|
-
className: cn(
|
|
1594
|
-
"flex cursor-default items-center justify-center py-1",
|
|
1595
|
-
className
|
|
1596
|
-
),
|
|
1597
|
-
...props,
|
|
1598
|
-
children: /* @__PURE__ */ jsx19(CaretUp, { className: "h-4 w-4" })
|
|
1599
|
-
}
|
|
1600
|
-
));
|
|
1601
|
-
SelectScrollUpButtonBase.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
1602
|
-
var SelectScrollDownButtonBase = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
|
|
1603
|
-
SelectPrimitive.ScrollDownButton,
|
|
1604
|
-
{
|
|
1605
|
-
ref,
|
|
1606
|
-
className: cn(
|
|
1607
|
-
"flex cursor-default items-center justify-center py-1",
|
|
1608
|
-
className
|
|
1609
|
-
),
|
|
1610
|
-
...props,
|
|
1611
|
-
children: /* @__PURE__ */ jsx19(CaretDown2, { className: "h-4 w-4" })
|
|
1612
|
-
}
|
|
1613
|
-
));
|
|
1614
|
-
SelectScrollDownButtonBase.displayName = SelectPrimitive.ScrollDownButton.displayName;
|
|
1615
|
-
var SelectContentBase = React14.forwardRef(({ className, children, position = "popper", testid: dataTestId = "select-content", ...props }, ref) => /* @__PURE__ */ jsx19(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx19(AnimatePresence3, { children: /* @__PURE__ */ jsx19(
|
|
1616
|
-
SelectPrimitive.Content,
|
|
1617
|
-
{
|
|
1618
|
-
ref,
|
|
1619
|
-
className: cn(
|
|
1620
|
-
"relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
|
|
1621
|
-
className
|
|
1622
|
-
),
|
|
1623
|
-
position,
|
|
1624
|
-
"data-testid": dataTestId,
|
|
1625
|
-
...props,
|
|
1626
|
-
asChild: true,
|
|
1627
|
-
children: /* @__PURE__ */ jsx19(
|
|
1628
|
-
motion4.div,
|
|
1629
|
-
{
|
|
1630
|
-
initial: { opacity: 0, scale: 0.95 },
|
|
1631
|
-
animate: { opacity: 1, scale: 1 },
|
|
1632
|
-
exit: { opacity: 0, scale: 0.95 },
|
|
1633
|
-
transition: { duration: 0.2 },
|
|
1634
|
-
children: /* @__PURE__ */ jsxs13(Fragment3, { children: [
|
|
1635
|
-
/* @__PURE__ */ jsx19(SelectScrollUpButtonBase, {}),
|
|
1636
|
-
/* @__PURE__ */ jsx19(
|
|
1637
|
-
SelectPrimitive.Viewport,
|
|
1638
|
-
{
|
|
1639
|
-
className: cn(
|
|
1640
|
-
"p-1",
|
|
1641
|
-
position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
|
|
1642
|
-
),
|
|
1643
|
-
children
|
|
1644
|
-
}
|
|
1645
|
-
),
|
|
1646
|
-
/* @__PURE__ */ jsx19(SelectScrollDownButtonBase, {})
|
|
1647
|
-
] })
|
|
1648
|
-
}
|
|
1649
|
-
)
|
|
1650
|
-
}
|
|
1651
|
-
) }) }));
|
|
1652
|
-
SelectContentBase.displayName = SelectPrimitive.Content.displayName;
|
|
1653
|
-
var SelectLabelBase = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
|
|
1654
|
-
SelectPrimitive.Label,
|
|
1655
|
-
{
|
|
1656
|
-
ref,
|
|
1657
|
-
className: cn("px-2 py-1.5 text-sm font-semibold", className),
|
|
1658
|
-
...props
|
|
1659
|
-
}
|
|
1660
|
-
));
|
|
1661
|
-
SelectLabelBase.displayName = SelectPrimitive.Label.displayName;
|
|
1662
|
-
var SelectItemBase = React14.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs13(
|
|
1663
|
-
SelectPrimitive.Item,
|
|
1664
|
-
{
|
|
1665
|
-
ref,
|
|
1666
|
-
className: cn(
|
|
1667
|
-
"relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
|
|
1668
|
-
className
|
|
1669
|
-
),
|
|
1670
|
-
...props,
|
|
1671
|
-
children: [
|
|
1672
|
-
/* @__PURE__ */ jsx19("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx19(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx19(Check4, { className: "h-4 w-4" }) }) }),
|
|
1673
|
-
/* @__PURE__ */ jsx19(SelectPrimitive.ItemText, { children })
|
|
1674
|
-
]
|
|
1675
|
-
}
|
|
1676
|
-
));
|
|
1677
|
-
SelectItemBase.displayName = SelectPrimitive.Item.displayName;
|
|
1678
|
-
var SelectSeparatorBase = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx19(
|
|
1679
|
-
SelectPrimitive.Separator,
|
|
1680
|
-
{
|
|
1681
|
-
ref,
|
|
1682
|
-
className: cn("-mx-1 my-1 h-px bg-muted", className),
|
|
1683
|
-
...props
|
|
1684
|
-
}
|
|
1685
|
-
));
|
|
1686
|
-
SelectSeparatorBase.displayName = SelectPrimitive.Separator.displayName;
|
|
1687
|
-
|
|
1688
|
-
// src/components/ui/ScrollareaBase.tsx
|
|
1689
|
-
import * as React15 from "react";
|
|
1690
|
-
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
|
|
1691
|
-
import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1692
|
-
var ScrollAreaBase = React15.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs14(
|
|
1693
|
-
ScrollAreaPrimitive.Root,
|
|
1694
|
-
{
|
|
1695
|
-
ref,
|
|
1696
|
-
className: cn("relative overflow-hidden", className),
|
|
1697
|
-
...props,
|
|
1698
|
-
children: [
|
|
1699
|
-
/* @__PURE__ */ jsx20(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
|
|
1700
|
-
/* @__PURE__ */ jsx20(ScrollBarBase, {}),
|
|
1701
|
-
/* @__PURE__ */ jsx20(ScrollAreaPrimitive.Corner, {})
|
|
1702
|
-
]
|
|
1703
|
-
}
|
|
1704
|
-
));
|
|
1705
|
-
ScrollAreaBase.displayName = ScrollAreaPrimitive.Root.displayName;
|
|
1706
|
-
var ScrollBarBase = React15.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx20(
|
|
1707
|
-
ScrollAreaPrimitive.ScrollAreaScrollbar,
|
|
1708
|
-
{
|
|
1709
|
-
ref,
|
|
1710
|
-
orientation,
|
|
1711
|
-
className: cn(
|
|
1712
|
-
"flex touch-none select-none transition-colors",
|
|
1713
|
-
orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]",
|
|
1714
|
-
orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]",
|
|
1715
|
-
className
|
|
1716
|
-
),
|
|
1717
|
-
...props,
|
|
1718
|
-
children: /* @__PURE__ */ jsx20(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
|
|
1719
|
-
}
|
|
1720
|
-
));
|
|
1721
|
-
ScrollBarBase.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
|
|
1722
|
-
|
|
1723
|
-
// src/components/selects/Select.tsx
|
|
1724
|
-
import { Fragment as Fragment4, jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1725
|
-
function Select({
|
|
1726
|
-
items,
|
|
1727
|
-
groupItems,
|
|
1728
|
-
placeholder,
|
|
1729
|
-
onChange,
|
|
1730
|
-
errorMessage,
|
|
1731
|
-
testIds = {}
|
|
1732
|
-
}) {
|
|
1733
|
-
return /* @__PURE__ */ jsxs15("div", { "data-testid": testIds.root ?? "select-root", children: [
|
|
1734
|
-
/* @__PURE__ */ jsxs15(SelectBase, { onValueChange: onChange, "data-testid": testIds.base ?? "select-base", children: [
|
|
1735
|
-
/* @__PURE__ */ jsx21(
|
|
1736
|
-
SelectTriggerBase,
|
|
1737
|
-
{
|
|
1738
|
-
className: cn(
|
|
1739
|
-
"flex h-12 w-full content-start text-lg shadow-md",
|
|
1740
|
-
errorMessage && "border-red-500"
|
|
1741
|
-
),
|
|
1742
|
-
"data-testid": testIds.trigger ?? "select-trigger",
|
|
1743
|
-
children: /* @__PURE__ */ jsx21(
|
|
1744
|
-
SelectValueBase,
|
|
1745
|
-
{
|
|
1746
|
-
placeholder,
|
|
1747
|
-
"data-testid": testIds.value ?? "select-value"
|
|
1748
|
-
}
|
|
1749
|
-
)
|
|
1750
|
-
}
|
|
1751
|
-
),
|
|
1752
|
-
/* @__PURE__ */ jsx21(ScrollAreaBase, { "data-testid": testIds.scrollarea ?? "select-scrollarea", children: /* @__PURE__ */ jsx21(SelectContentBase, { "data-testid": testIds.content ?? "select-content", children: groupItems ? /* @__PURE__ */ jsx21(Fragment4, { children: Object.keys(groupItems).map((key) => /* @__PURE__ */ jsxs15(SelectGroupBase, { "data-testid": testIds.group ?? "select-group", children: [
|
|
1753
|
-
/* @__PURE__ */ jsx21(SelectLabelBase, { "data-testid": testIds.label ?? "select-label", children: key }),
|
|
1754
|
-
groupItems[key].map((item) => /* @__PURE__ */ jsx21(
|
|
1755
|
-
SelectItemBase,
|
|
1756
|
-
{
|
|
1757
|
-
value: item.value,
|
|
1758
|
-
"data-testid": testIds.item?.(item.value) ?? `select-item-${item.value}`,
|
|
1759
|
-
children: item.label
|
|
1760
|
-
},
|
|
1761
|
-
item.value
|
|
1762
|
-
))
|
|
1763
|
-
] }, key)) }) : /* @__PURE__ */ jsx21(SelectGroupBase, { "data-testid": testIds.group ?? "select-group", children: items.map((item) => /* @__PURE__ */ jsx21(
|
|
1764
|
-
SelectItemBase,
|
|
1765
|
-
{
|
|
1766
|
-
value: item.value,
|
|
1767
|
-
"data-testid": testIds.item?.(item.value) ?? `select-item-${item.value}`,
|
|
1768
|
-
children: item.label
|
|
1769
|
-
},
|
|
1770
|
-
item.value
|
|
1771
|
-
)) }) }) })
|
|
1772
|
-
] }),
|
|
1773
|
-
errorMessage && /* @__PURE__ */ jsx21(
|
|
1774
|
-
"p",
|
|
1775
|
-
{
|
|
1776
|
-
className: "text-sm text-red-500",
|
|
1777
|
-
"data-testid": testIds.error ?? "select-error",
|
|
1778
|
-
children: errorMessage
|
|
1779
|
-
}
|
|
1780
|
-
)
|
|
1781
|
-
] });
|
|
1782
|
-
}
|
|
21
|
+
// src/components/ui/LabelBase.tsx
|
|
22
|
+
import * as React2 from "react";
|
|
23
|
+
import { Label as RadixLabel } from "@radix-ui/react-label";
|
|
24
|
+
import { Slot } from "@radix-ui/react-slot";
|
|
1783
25
|
|
|
1784
|
-
// src/
|
|
1785
|
-
import {
|
|
1786
|
-
import {
|
|
1787
|
-
|
|
1788
|
-
|
|
1789
|
-
className,
|
|
1790
|
-
classNames,
|
|
1791
|
-
showOutsideDays = true,
|
|
1792
|
-
...props
|
|
1793
|
-
}) {
|
|
1794
|
-
return /* @__PURE__ */ jsx22(
|
|
1795
|
-
DayPicker2,
|
|
1796
|
-
{
|
|
1797
|
-
showOutsideDays,
|
|
1798
|
-
className: cn("bg-background p-3", className),
|
|
1799
|
-
classNames: {
|
|
1800
|
-
months: "flex items-center flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
|
|
1801
|
-
month: "space-y-4",
|
|
1802
|
-
caption: "flex justify-center pt-1 relative items-center",
|
|
1803
|
-
caption_label: "text-sm font-medium",
|
|
1804
|
-
nav: "space-x-1 flex items-center",
|
|
1805
|
-
nav_button: cn(
|
|
1806
|
-
buttonVariantsBase({ variant: "outline" }),
|
|
1807
|
-
"h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100"
|
|
1808
|
-
),
|
|
1809
|
-
nav_button_previous: "absolute left-1",
|
|
1810
|
-
nav_button_next: "absolute right-1",
|
|
1811
|
-
table: "w-full border-collapse space-y-1",
|
|
1812
|
-
head_row: "flex",
|
|
1813
|
-
head_cell: "text-slate-500 rounded-md w-9 font-normal text-[0.8rem] dark:text-slate-400",
|
|
1814
|
-
row: "flex w-full mt-2",
|
|
1815
|
-
cell: "h-9 w-9 text-center text-sm p-0 relative [&:has([aria-selected].day-range-end)]:rounded-r-md [&:has([aria-selected].day-outside)]:bg-slate-100/50 [&:has([aria-selected])]:bg-slate-100 first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20 dark:[&:has([aria-selected].day-outside)]:bg-slate-800/50 dark:[&:has([aria-selected])]:bg-slate-800",
|
|
1816
|
-
day: cn(
|
|
1817
|
-
buttonVariantsBase({ variant: "ghost" }),
|
|
1818
|
-
"h-9 w-9 p-0 font-normal aria-selected:opacity-100"
|
|
1819
|
-
),
|
|
1820
|
-
day_range_end: "day-range-end",
|
|
1821
|
-
day_selected: "bg-purple text-slate-50 hover:bg-primary hover:text-slate-50 focus:bg-purple-500 focus:text-slate-50 dark:bg-slate-50 dark:text-slate-900 dark:hover:bg-slate-50 dark:hover:text-slate-900 dark:focus:bg-slate-50 dark:focus:text-slate-900",
|
|
1822
|
-
day_today: "bg-slate-100 text-slate-900 dark:bg-primary dark:text-slate-50",
|
|
1823
|
-
day_outside: "day-outside text-slate-500 opacity-50 aria-selected:bg-slate-100/50 aria-selected:text-slate-500 aria-selected:opacity-30 dark:text-slate-400 dark:aria-selected:bg-slate-800/50 dark:aria-selected:text-slate-400",
|
|
1824
|
-
day_disabled: "text-slate-500 opacity-50 dark:text-slate-400",
|
|
1825
|
-
day_range_middle: "aria-selected:bg-slate-100 aria-selected:text-slate-900 dark:aria-selected:bg-primary dark:aria-selected:text-primary",
|
|
1826
|
-
day_hidden: "invisible",
|
|
1827
|
-
...classNames
|
|
1828
|
-
},
|
|
1829
|
-
components: {
|
|
1830
|
-
IconLeft: () => /* @__PURE__ */ jsx22(CaretLeft2, { className: "h-4 w-4" }),
|
|
1831
|
-
IconRight: () => /* @__PURE__ */ jsx22(CaretRight3, { className: "h-4 w-4" })
|
|
1832
|
-
},
|
|
1833
|
-
...props
|
|
1834
|
-
}
|
|
1835
|
-
);
|
|
26
|
+
// src/lib/utils.ts
|
|
27
|
+
import { clsx } from "clsx";
|
|
28
|
+
import { twMerge } from "tailwind-merge";
|
|
29
|
+
function cn(...inputs) {
|
|
30
|
+
return twMerge(clsx(inputs));
|
|
1836
31
|
}
|
|
1837
|
-
CalendarBase2.displayName = "Calendar";
|
|
1838
|
-
|
|
1839
|
-
// src/components/ui/CardBase.tsx
|
|
1840
|
-
import * as React16 from "react";
|
|
1841
|
-
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
1842
|
-
var CardBase = React16.forwardRef(({ className, testid: dataTestId = "card-base", ...props }, ref) => /* @__PURE__ */ jsx23(
|
|
1843
|
-
"div",
|
|
1844
|
-
{
|
|
1845
|
-
ref,
|
|
1846
|
-
className: cn(
|
|
1847
|
-
"rounded-xl border bg-card text-card-foreground shadow",
|
|
1848
|
-
className
|
|
1849
|
-
),
|
|
1850
|
-
"data-testid": dataTestId,
|
|
1851
|
-
...props
|
|
1852
|
-
}
|
|
1853
|
-
));
|
|
1854
|
-
CardBase.displayName = "Card";
|
|
1855
|
-
var CardHeaderBase = React16.forwardRef(({ className, testid: dataTestId = "card-header", ...props }, ref) => /* @__PURE__ */ jsx23(
|
|
1856
|
-
"div",
|
|
1857
|
-
{
|
|
1858
|
-
ref,
|
|
1859
|
-
className: cn("flex flex-col space-y-1.5 p-6", className),
|
|
1860
|
-
"data-testid": dataTestId,
|
|
1861
|
-
...props
|
|
1862
|
-
}
|
|
1863
|
-
));
|
|
1864
|
-
CardHeaderBase.displayName = "CardHeader";
|
|
1865
|
-
var CardTitleBase = React16.forwardRef(({ className, testid: dataTestId = "card-title", ...props }, ref) => /* @__PURE__ */ jsx23(
|
|
1866
|
-
"div",
|
|
1867
|
-
{
|
|
1868
|
-
ref,
|
|
1869
|
-
className: cn("font-semibold leading-none tracking-tight", className),
|
|
1870
|
-
"data-testid": dataTestId,
|
|
1871
|
-
...props
|
|
1872
|
-
}
|
|
1873
|
-
));
|
|
1874
|
-
CardTitleBase.displayName = "CardTitle";
|
|
1875
|
-
var CardDescriptionBase = React16.forwardRef(({ className, testid: dataTestId = "card-description", ...props }, ref) => /* @__PURE__ */ jsx23(
|
|
1876
|
-
"div",
|
|
1877
|
-
{
|
|
1878
|
-
ref,
|
|
1879
|
-
className: cn("text-sm text-muted-foreground", className),
|
|
1880
|
-
"data-testid": dataTestId,
|
|
1881
|
-
...props
|
|
1882
|
-
}
|
|
1883
|
-
));
|
|
1884
|
-
CardDescriptionBase.displayName = "CardDescription";
|
|
1885
|
-
var CardContentBase = React16.forwardRef(({ className, testid: dataTestId = "card-content", ...props }, ref) => /* @__PURE__ */ jsx23("div", { ref, className: cn("p-6 pt-0", className), "data-testid": dataTestId, ...props }));
|
|
1886
|
-
CardContentBase.displayName = "CardContent";
|
|
1887
|
-
var CardFooterBase = React16.forwardRef(({ className, testid: dataTestId = "card-footer", ...props }, ref) => /* @__PURE__ */ jsx23(
|
|
1888
|
-
"div",
|
|
1889
|
-
{
|
|
1890
|
-
ref,
|
|
1891
|
-
className: cn("flex items-center p-6 pt-0", className),
|
|
1892
|
-
"data-testid": dataTestId,
|
|
1893
|
-
...props
|
|
1894
|
-
}
|
|
1895
|
-
));
|
|
1896
|
-
CardFooterBase.displayName = "CardFooter";
|
|
1897
|
-
|
|
1898
|
-
// src/components/ui/CheckBoxBase.tsx
|
|
1899
|
-
import * as React17 from "react";
|
|
1900
|
-
import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
|
|
1901
|
-
import { Check as Check5 } from "phosphor-react";
|
|
1902
|
-
import { motion as motion5 } from "framer-motion";
|
|
1903
|
-
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
1904
|
-
var CheckboxBase = React17.forwardRef(({ className, testid: dataTestId = "checkbox-base", ...props }, ref) => /* @__PURE__ */ jsx24(
|
|
1905
|
-
CheckboxPrimitive.Root,
|
|
1906
|
-
{
|
|
1907
|
-
ref,
|
|
1908
|
-
className: cn(
|
|
1909
|
-
"peer h-4 w-4 shrink-0 rounded-md border border-primary shadow-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground transition-colors",
|
|
1910
|
-
className
|
|
1911
|
-
),
|
|
1912
|
-
"data-testid": dataTestId,
|
|
1913
|
-
...props,
|
|
1914
|
-
children: /* @__PURE__ */ jsx24(CheckboxPrimitive.Indicator, { asChild: true, children: /* @__PURE__ */ jsx24(
|
|
1915
|
-
motion5.div,
|
|
1916
|
-
{
|
|
1917
|
-
initial: { scale: 0, opacity: 0, rotate: -90 },
|
|
1918
|
-
animate: { scale: 1, opacity: 1, rotate: 0 },
|
|
1919
|
-
exit: { scale: 0, opacity: 0, rotate: 90 },
|
|
1920
|
-
transition: { type: "spring", stiffness: 500, damping: 30 },
|
|
1921
|
-
className: "flex items-center justify-center text-current",
|
|
1922
|
-
children: /* @__PURE__ */ jsx24(Check5, { className: "h-4 w-4", weight: "bold" })
|
|
1923
|
-
}
|
|
1924
|
-
) })
|
|
1925
|
-
}
|
|
1926
|
-
));
|
|
1927
|
-
CheckboxBase.displayName = CheckboxPrimitive.Root.displayName;
|
|
1928
|
-
|
|
1929
|
-
// src/components/ui/ProgressBase.tsx
|
|
1930
|
-
import * as React18 from "react";
|
|
1931
|
-
import * as ProgressPrimitive from "@radix-ui/react-progress";
|
|
1932
|
-
import { jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1933
|
-
var ProgressBase = React18.forwardRef(({ className, value, label, leftIcon, rightIcon, ...props }, ref) => {
|
|
1934
|
-
return /* @__PURE__ */ jsxs16("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
|
|
1935
|
-
label && /* @__PURE__ */ jsx25(LabelBase_default, { className: "py-2", children: label }),
|
|
1936
|
-
/* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-2", children: [
|
|
1937
|
-
leftIcon && /* @__PURE__ */ jsx25("div", { className: "flex items-center justify-center", children: leftIcon }),
|
|
1938
|
-
/* @__PURE__ */ jsx25(
|
|
1939
|
-
ProgressPrimitive.Root,
|
|
1940
|
-
{
|
|
1941
|
-
ref,
|
|
1942
|
-
className: cn(
|
|
1943
|
-
"relative h-3 w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-800 shadow-inner transition-all",
|
|
1944
|
-
className
|
|
1945
|
-
),
|
|
1946
|
-
value,
|
|
1947
|
-
...props,
|
|
1948
|
-
children: /* @__PURE__ */ jsx25(
|
|
1949
|
-
ProgressPrimitive.Indicator,
|
|
1950
|
-
{
|
|
1951
|
-
className: "h-full w-full flex-1 bg-primary transition-all duration-500 ease-in-out",
|
|
1952
|
-
style: { transform: `translateX(-${100 - (value || 0)}%)` }
|
|
1953
|
-
}
|
|
1954
|
-
)
|
|
1955
|
-
}
|
|
1956
|
-
),
|
|
1957
|
-
rightIcon && /* @__PURE__ */ jsx25("div", { className: "flex items-center justify-center", children: rightIcon })
|
|
1958
|
-
] })
|
|
1959
|
-
] });
|
|
1960
|
-
});
|
|
1961
|
-
ProgressBase.displayName = "ProgressBase";
|
|
1962
|
-
var ProgressSegmentsBase = ({
|
|
1963
|
-
label,
|
|
1964
|
-
segments,
|
|
1965
|
-
value
|
|
1966
|
-
}) => {
|
|
1967
|
-
const filled = Math.round(value / 100 * segments);
|
|
1968
|
-
return /* @__PURE__ */ jsxs16("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
|
|
1969
|
-
label && /* @__PURE__ */ jsx25(LabelBase_default, { className: "py-2", children: label }),
|
|
1970
|
-
/* @__PURE__ */ jsx25("div", { className: "flex gap-1 w-full", children: Array.from({ length: segments }).map((_, idx) => /* @__PURE__ */ jsx25(
|
|
1971
|
-
"div",
|
|
1972
|
-
{
|
|
1973
|
-
className: cn(
|
|
1974
|
-
"h-2 flex-1 rounded-full transition-all duration-300",
|
|
1975
|
-
idx < filled ? "bg-primary" : "bg-zinc-300 hover:bg-zinc-400"
|
|
1976
|
-
)
|
|
1977
|
-
},
|
|
1978
|
-
idx
|
|
1979
|
-
)) })
|
|
1980
|
-
] });
|
|
1981
|
-
};
|
|
1982
|
-
var ArrowRightIcon = () => /* @__PURE__ */ jsx25(
|
|
1983
|
-
"svg",
|
|
1984
|
-
{
|
|
1985
|
-
className: "w-6 h-6 text-zinc-400 transition-transform duration-300 group-hover:translate-x-1",
|
|
1986
|
-
fill: "none",
|
|
1987
|
-
stroke: "currentColor",
|
|
1988
|
-
strokeWidth: 2,
|
|
1989
|
-
viewBox: "0 0 24 24",
|
|
1990
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
1991
|
-
children: /* @__PURE__ */ jsx25("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" })
|
|
1992
|
-
}
|
|
1993
|
-
);
|
|
1994
|
-
var ProgressPanelsBase = ({
|
|
1995
|
-
label,
|
|
1996
|
-
steps,
|
|
1997
|
-
currentStep
|
|
1998
|
-
}) => {
|
|
1999
|
-
return /* @__PURE__ */ jsxs16("div", { className: "flex flex-col gap-1 w-full", children: [
|
|
2000
|
-
label && /* @__PURE__ */ jsx25(LabelBase_default, { className: "py-2", children: label }),
|
|
2001
|
-
/* @__PURE__ */ jsx25("div", { className: "flex w-full gap-1 rounded-lg overflow-hidden", children: steps.map((step, idx) => {
|
|
2002
|
-
const isActive = idx === currentStep;
|
|
2003
|
-
const isLast = idx === steps.length - 1;
|
|
2004
|
-
return /* @__PURE__ */ jsxs16(React18.Fragment, { children: [
|
|
2005
|
-
/* @__PURE__ */ jsxs16(
|
|
2006
|
-
"div",
|
|
2007
|
-
{
|
|
2008
|
-
className: cn(
|
|
2009
|
-
"relative flex items-center justify-center cursor-pointer select-none rounded-lg border transition-shadow duration-300 ease-in-out",
|
|
2010
|
-
"hover:shadow-md hover:z-10",
|
|
2011
|
-
"aspect-[5/1] min-w-[90px] px-4",
|
|
2012
|
-
isActive ? "bg-primary/20 border-2 border-primary shadow-lg font-semibold" : "border-zinc-300"
|
|
2013
|
-
),
|
|
2014
|
-
style: { flex: "1 1 0" },
|
|
2015
|
-
children: [
|
|
2016
|
-
/* @__PURE__ */ jsx25("span", { className: "truncate", children: step }),
|
|
2017
|
-
isActive && /* @__PURE__ */ jsx25("div", { className: "absolute bottom-0 left-0 h-1 w-full animate-pulse rounded-b-lg" })
|
|
2018
|
-
]
|
|
2019
|
-
}
|
|
2020
|
-
),
|
|
2021
|
-
!isLast && /* @__PURE__ */ jsx25("div", { className: "flex items-center px-2 group", children: /* @__PURE__ */ jsx25(ArrowRightIcon, {}) })
|
|
2022
|
-
] }, idx);
|
|
2023
|
-
}) })
|
|
2024
|
-
] });
|
|
2025
|
-
};
|
|
2026
|
-
var ProgressCirclesBase = ({
|
|
2027
|
-
label,
|
|
2028
|
-
steps,
|
|
2029
|
-
currentStep
|
|
2030
|
-
}) => {
|
|
2031
|
-
return /* @__PURE__ */ jsxs16("div", { className: "flex flex-col gap-2 w-full", children: [
|
|
2032
|
-
label && /* @__PURE__ */ jsx25("label", { className: "py-2 text-base font-semibold text-gray-700 dark:text-gray-300", children: label }),
|
|
2033
|
-
/* @__PURE__ */ jsxs16("div", { className: "relative flex items-center justify-between w-full", children: [
|
|
2034
|
-
/* @__PURE__ */ jsx25("div", { className: "absolute top-5 left-0 w-full h-1 bg-zinc-200 dark:bg-zinc-700" }),
|
|
2035
|
-
/* @__PURE__ */ jsx25(
|
|
2036
|
-
"div",
|
|
2037
|
-
{
|
|
2038
|
-
className: "absolute top-5 left-0 h-1 bg-primary transition-all duration-300",
|
|
2039
|
-
style: {
|
|
2040
|
-
width: `${currentStep / (steps.length - 1) * 100}%`
|
|
2041
|
-
}
|
|
2042
|
-
}
|
|
2043
|
-
),
|
|
2044
|
-
steps.map((step, idx) => {
|
|
2045
|
-
const isActive = idx <= currentStep;
|
|
2046
|
-
return /* @__PURE__ */ jsxs16(
|
|
2047
|
-
"div",
|
|
2048
|
-
{
|
|
2049
|
-
className: "relative flex flex-col items-center w-10",
|
|
2050
|
-
style: { zIndex: isActive ? 10 : 1 },
|
|
2051
|
-
children: [
|
|
2052
|
-
/* @__PURE__ */ jsx25(
|
|
2053
|
-
"div",
|
|
2054
|
-
{
|
|
2055
|
-
className: cn(
|
|
2056
|
-
"w-10 h-10 rounded-full flex items-center justify-center font-bold text-sm transition-all duration-300 cursor-pointer select-none",
|
|
2057
|
-
isActive ? "bg-primary text-white dark:text-black shadow-md" : "bg-zinc-200 text-zinc-500 hover:bg-zinc-300 dark:bg-zinc-500 dark:text-black"
|
|
2058
|
-
),
|
|
2059
|
-
children: idx + 1
|
|
2060
|
-
}
|
|
2061
|
-
),
|
|
2062
|
-
/* @__PURE__ */ jsx25("span", { className: "text-xs text-center font-medium mt-1 max-w-[80px] break-words", children: step })
|
|
2063
|
-
]
|
|
2064
|
-
},
|
|
2065
|
-
idx
|
|
2066
|
-
);
|
|
2067
|
-
})
|
|
2068
|
-
] })
|
|
2069
|
-
] });
|
|
2070
|
-
};
|
|
2071
32
|
|
|
2072
|
-
// src/components/ui/
|
|
2073
|
-
import
|
|
2074
|
-
|
|
2075
|
-
|
|
2076
|
-
|
|
2077
|
-
|
|
2078
|
-
|
|
2079
|
-
const isHorizontal = orientation === "horizontal";
|
|
2080
|
-
return /* @__PURE__ */ jsx26(
|
|
2081
|
-
SeparatorPrimitive.Root,
|
|
33
|
+
// src/components/ui/LabelBase.tsx
|
|
34
|
+
import { jsx } from "react/jsx-runtime";
|
|
35
|
+
var LabelBase = React2.forwardRef(
|
|
36
|
+
({ className, asChild = false, testid = "label-base", ...props }, ref) => {
|
|
37
|
+
const Comp = asChild ? Slot : "label";
|
|
38
|
+
return /* @__PURE__ */ jsx(RadixLabel, { children: /* @__PURE__ */ jsx(
|
|
39
|
+
Comp,
|
|
2082
40
|
{
|
|
2083
41
|
ref,
|
|
2084
|
-
decorative,
|
|
2085
|
-
orientation,
|
|
2086
|
-
asChild: true,
|
|
2087
|
-
...props,
|
|
2088
|
-
children: /* @__PURE__ */ jsx26(
|
|
2089
|
-
motion6.div,
|
|
2090
|
-
{
|
|
2091
|
-
className: cn(
|
|
2092
|
-
"shrink-0 bg-border",
|
|
2093
|
-
isHorizontal ? "h-[1px] w-full" : "h-full w-[1px]",
|
|
2094
|
-
className
|
|
2095
|
-
),
|
|
2096
|
-
initial: { scaleX: isHorizontal ? 0 : 1, scaleY: isHorizontal ? 1 : 0 },
|
|
2097
|
-
animate: { scaleX: 1, scaleY: 1 },
|
|
2098
|
-
transition: { duration: 0.2, ease: "easeInOut" }
|
|
2099
|
-
}
|
|
2100
|
-
)
|
|
2101
|
-
}
|
|
2102
|
-
);
|
|
2103
|
-
}
|
|
2104
|
-
);
|
|
2105
|
-
SeparatorBase.displayName = SeparatorPrimitive.Root.displayName;
|
|
2106
|
-
|
|
2107
|
-
// src/components/ui/SheetBase.tsx
|
|
2108
|
-
import * as React20 from "react";
|
|
2109
|
-
import * as SheetPrimitive from "@radix-ui/react-dialog";
|
|
2110
|
-
import { cva as cva2 } from "class-variance-authority";
|
|
2111
|
-
import { X as X4 } from "phosphor-react";
|
|
2112
|
-
import { jsx as jsx27, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2113
|
-
var SheetBase = SheetPrimitive.Root;
|
|
2114
|
-
var SheetTriggerBase = SheetPrimitive.Trigger;
|
|
2115
|
-
var SheetCloseBase = SheetPrimitive.Close;
|
|
2116
|
-
var SheetPortalBase = SheetPrimitive.Portal;
|
|
2117
|
-
var SheetOverlayBase = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx27(
|
|
2118
|
-
SheetPrimitive.Overlay,
|
|
2119
|
-
{
|
|
2120
|
-
className: cn(
|
|
2121
|
-
"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",
|
|
2122
|
-
className
|
|
2123
|
-
),
|
|
2124
|
-
...props,
|
|
2125
|
-
ref
|
|
2126
|
-
}
|
|
2127
|
-
));
|
|
2128
|
-
SheetOverlayBase.displayName = SheetPrimitive.Overlay.displayName;
|
|
2129
|
-
var sheetVariants = cva2(
|
|
2130
|
-
"fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out",
|
|
2131
|
-
{
|
|
2132
|
-
variants: {
|
|
2133
|
-
side: {
|
|
2134
|
-
top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
|
|
2135
|
-
bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
|
|
2136
|
-
left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
|
|
2137
|
-
right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm"
|
|
2138
|
-
}
|
|
2139
|
-
},
|
|
2140
|
-
defaultVariants: {
|
|
2141
|
-
side: "right"
|
|
2142
|
-
}
|
|
2143
|
-
}
|
|
2144
|
-
);
|
|
2145
|
-
var SheetContentBase = React20.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs17(SheetPortalBase, { children: [
|
|
2146
|
-
/* @__PURE__ */ jsx27(SheetOverlayBase, {}),
|
|
2147
|
-
/* @__PURE__ */ jsxs17(
|
|
2148
|
-
SheetPrimitive.Content,
|
|
2149
|
-
{
|
|
2150
|
-
ref,
|
|
2151
|
-
className: cn(sheetVariants({ side }), className),
|
|
2152
|
-
...props,
|
|
2153
|
-
children: [
|
|
2154
|
-
/* @__PURE__ */ jsxs17(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
|
|
2155
|
-
/* @__PURE__ */ jsx27(X4, { className: "h-4 w-4" }),
|
|
2156
|
-
/* @__PURE__ */ jsx27("span", { className: "sr-only", children: "Close" })
|
|
2157
|
-
] }),
|
|
2158
|
-
children
|
|
2159
|
-
]
|
|
2160
|
-
}
|
|
2161
|
-
)
|
|
2162
|
-
] }));
|
|
2163
|
-
SheetContentBase.displayName = SheetPrimitive.Content.displayName;
|
|
2164
|
-
var SheetHeaderBase = ({
|
|
2165
|
-
className,
|
|
2166
|
-
...props
|
|
2167
|
-
}) => /* @__PURE__ */ jsx27(
|
|
2168
|
-
"div",
|
|
2169
|
-
{
|
|
2170
|
-
className: cn(
|
|
2171
|
-
"flex flex-col space-y-2 text-center sm:text-left",
|
|
2172
|
-
className
|
|
2173
|
-
),
|
|
2174
|
-
...props
|
|
2175
|
-
}
|
|
2176
|
-
);
|
|
2177
|
-
SheetHeaderBase.displayName = "SheetHeaderBase";
|
|
2178
|
-
var SheetFooterBase = ({
|
|
2179
|
-
className,
|
|
2180
|
-
...props
|
|
2181
|
-
}) => /* @__PURE__ */ jsx27(
|
|
2182
|
-
"div",
|
|
2183
|
-
{
|
|
2184
|
-
className: cn(
|
|
2185
|
-
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
|
|
2186
|
-
className
|
|
2187
|
-
),
|
|
2188
|
-
...props
|
|
2189
|
-
}
|
|
2190
|
-
);
|
|
2191
|
-
SheetFooterBase.displayName = "SheetFooterBase";
|
|
2192
|
-
var SheetTitleBase = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx27(
|
|
2193
|
-
SheetPrimitive.Title,
|
|
2194
|
-
{
|
|
2195
|
-
ref,
|
|
2196
|
-
className: cn("text-lg font-semibold text-foreground", className),
|
|
2197
|
-
...props
|
|
2198
|
-
}
|
|
2199
|
-
));
|
|
2200
|
-
SheetTitleBase.displayName = SheetPrimitive.Title.displayName;
|
|
2201
|
-
var SheetDescriptionBase = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx27(
|
|
2202
|
-
SheetPrimitive.Description,
|
|
2203
|
-
{
|
|
2204
|
-
ref,
|
|
2205
|
-
className: cn("text-sm text-muted-foreground", className),
|
|
2206
|
-
...props
|
|
2207
|
-
}
|
|
2208
|
-
));
|
|
2209
|
-
SheetDescriptionBase.displayName = SheetPrimitive.Description.displayName;
|
|
2210
|
-
|
|
2211
|
-
// src/components/ui/SidebarBase.tsx
|
|
2212
|
-
import * as React22 from "react";
|
|
2213
|
-
import { Slot as Slot3 } from "@radix-ui/react-slot";
|
|
2214
|
-
import { cva as cva3 } from "class-variance-authority";
|
|
2215
|
-
|
|
2216
|
-
// src/components/ui/SkeletonBase.tsx
|
|
2217
|
-
import { jsx as jsx28 } from "react/jsx-runtime";
|
|
2218
|
-
function SkeletonBase({
|
|
2219
|
-
className,
|
|
2220
|
-
...props
|
|
2221
|
-
}) {
|
|
2222
|
-
return /* @__PURE__ */ jsx28(
|
|
2223
|
-
"div",
|
|
2224
|
-
{
|
|
2225
|
-
className: cn("animate-pulse bg-primary/10", className),
|
|
2226
|
-
...props
|
|
2227
|
-
}
|
|
2228
|
-
);
|
|
2229
|
-
}
|
|
2230
|
-
|
|
2231
|
-
// src/components/ui/SidebarBase.tsx
|
|
2232
|
-
import { SidebarSimple } from "phosphor-react";
|
|
2233
|
-
|
|
2234
|
-
// src/components/ui/TooltipBase.tsx
|
|
2235
|
-
import * as React21 from "react";
|
|
2236
|
-
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
2237
|
-
import { jsx as jsx29 } from "react/jsx-runtime";
|
|
2238
|
-
var TooltipProviderBase = TooltipPrimitive.Provider;
|
|
2239
|
-
var TooltipBase = TooltipPrimitive.Root;
|
|
2240
|
-
var TooltipTriggerBase = TooltipPrimitive.Trigger;
|
|
2241
|
-
var TooltipContentBase = React21.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx29(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx29(
|
|
2242
|
-
TooltipPrimitive.Content,
|
|
2243
|
-
{
|
|
2244
|
-
ref,
|
|
2245
|
-
sideOffset,
|
|
2246
|
-
className: cn(
|
|
2247
|
-
"z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs 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",
|
|
2248
|
-
className
|
|
2249
|
-
),
|
|
2250
|
-
...props
|
|
2251
|
-
}
|
|
2252
|
-
) }));
|
|
2253
|
-
TooltipContentBase.displayName = TooltipPrimitive.Content.displayName;
|
|
2254
|
-
|
|
2255
|
-
// src/components/ui/SidebarBase.tsx
|
|
2256
|
-
import { jsx as jsx30, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
2257
|
-
var SIDEBAR_COOKIE_NAME = "sidebar:state";
|
|
2258
|
-
var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
|
|
2259
|
-
var SIDEBAR_WIDTH = "16rem";
|
|
2260
|
-
var SIDEBAR_WIDTH_MOBILE = "18rem";
|
|
2261
|
-
var SIDEBAR_WIDTH_ICON = "3rem";
|
|
2262
|
-
var SIDEBAR_KEYBOARD_SHORTCUT = "b";
|
|
2263
|
-
var SidebarContext = React22.createContext(null);
|
|
2264
|
-
function UseSideBarBase() {
|
|
2265
|
-
const context = React22.useContext(SidebarContext);
|
|
2266
|
-
if (!context) {
|
|
2267
|
-
throw new Error(
|
|
2268
|
-
"UseSideBarBase must be used within a SidebarProviderBase."
|
|
2269
|
-
);
|
|
2270
|
-
}
|
|
2271
|
-
return context;
|
|
2272
|
-
}
|
|
2273
|
-
var SidebarProviderBase = React22.forwardRef(
|
|
2274
|
-
({
|
|
2275
|
-
defaultOpen = true,
|
|
2276
|
-
open: openProp,
|
|
2277
|
-
onOpenChange: setOpenProp,
|
|
2278
|
-
className,
|
|
2279
|
-
style,
|
|
2280
|
-
children,
|
|
2281
|
-
...props
|
|
2282
|
-
}, ref) => {
|
|
2283
|
-
const isMobile = useIsMobile();
|
|
2284
|
-
const [openMobile, setOpenMobile] = React22.useState(false);
|
|
2285
|
-
const [_open, _setOpen] = React22.useState(defaultOpen);
|
|
2286
|
-
const open = openProp ?? _open;
|
|
2287
|
-
const setOpen = React22.useCallback(
|
|
2288
|
-
(value) => {
|
|
2289
|
-
const openState = typeof value === "function" ? value(open) : value;
|
|
2290
|
-
if (setOpenProp) {
|
|
2291
|
-
setOpenProp(openState);
|
|
2292
|
-
} else {
|
|
2293
|
-
_setOpen(openState);
|
|
2294
|
-
}
|
|
2295
|
-
document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
|
|
2296
|
-
},
|
|
2297
|
-
[setOpenProp, open]
|
|
2298
|
-
);
|
|
2299
|
-
const toggleSidebar = React22.useCallback(() => {
|
|
2300
|
-
return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
|
|
2301
|
-
}, [isMobile, setOpen, setOpenMobile]);
|
|
2302
|
-
React22.useEffect(() => {
|
|
2303
|
-
const handleKeyDown = (event) => {
|
|
2304
|
-
if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
|
|
2305
|
-
event.preventDefault();
|
|
2306
|
-
toggleSidebar();
|
|
2307
|
-
}
|
|
2308
|
-
};
|
|
2309
|
-
window.addEventListener("keydown", handleKeyDown);
|
|
2310
|
-
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
2311
|
-
}, [toggleSidebar]);
|
|
2312
|
-
const state = open ? "expanded" : "collapsed";
|
|
2313
|
-
const contextValue = React22.useMemo(
|
|
2314
|
-
() => ({
|
|
2315
|
-
state,
|
|
2316
|
-
open,
|
|
2317
|
-
setOpen,
|
|
2318
|
-
isMobile,
|
|
2319
|
-
openMobile,
|
|
2320
|
-
setOpenMobile,
|
|
2321
|
-
toggleSidebar
|
|
2322
|
-
}),
|
|
2323
|
-
[state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
|
|
2324
|
-
);
|
|
2325
|
-
return /* @__PURE__ */ jsx30(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx30(TooltipProviderBase, { delayDuration: 0, children: /* @__PURE__ */ jsx30(
|
|
2326
|
-
"div",
|
|
2327
|
-
{
|
|
2328
|
-
style: {
|
|
2329
|
-
"--sidebar-width": SIDEBAR_WIDTH,
|
|
2330
|
-
"--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
|
|
2331
|
-
...style
|
|
2332
|
-
},
|
|
2333
42
|
className: cn(
|
|
2334
|
-
"
|
|
43
|
+
"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
|
|
2335
44
|
className
|
|
2336
45
|
),
|
|
2337
|
-
|
|
2338
|
-
...props,
|
|
2339
|
-
children
|
|
2340
|
-
}
|
|
2341
|
-
) }) });
|
|
2342
|
-
}
|
|
2343
|
-
);
|
|
2344
|
-
SidebarProviderBase.displayName = "SidebarProviderBase";
|
|
2345
|
-
var SidebarBase = React22.forwardRef(
|
|
2346
|
-
({
|
|
2347
|
-
side = "left",
|
|
2348
|
-
variant = "sidebar",
|
|
2349
|
-
collapsible = "offcanvas",
|
|
2350
|
-
className,
|
|
2351
|
-
children,
|
|
2352
|
-
...props
|
|
2353
|
-
}, ref) => {
|
|
2354
|
-
const { isMobile, state, openMobile, setOpenMobile } = UseSideBarBase();
|
|
2355
|
-
if (collapsible === "none") {
|
|
2356
|
-
return /* @__PURE__ */ jsx30(
|
|
2357
|
-
"div",
|
|
2358
|
-
{
|
|
2359
|
-
className: cn(
|
|
2360
|
-
"flex h-full w-[--sidebar-width] flex-col bg-sidebar text-sidebar-foreground",
|
|
2361
|
-
className
|
|
2362
|
-
),
|
|
2363
|
-
ref,
|
|
2364
|
-
...props,
|
|
2365
|
-
children
|
|
2366
|
-
}
|
|
2367
|
-
);
|
|
2368
|
-
}
|
|
2369
|
-
if (isMobile) {
|
|
2370
|
-
return /* @__PURE__ */ jsx30(SheetBase, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsx30(
|
|
2371
|
-
SheetContentBase,
|
|
2372
|
-
{
|
|
2373
|
-
"data-sidebar": "sidebar",
|
|
2374
|
-
"data-mobile": "true",
|
|
2375
|
-
className: "w-[--sidebar-width] bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden",
|
|
2376
|
-
style: {
|
|
2377
|
-
"--sidebar-width": SIDEBAR_WIDTH_MOBILE
|
|
2378
|
-
},
|
|
2379
|
-
side,
|
|
2380
|
-
children: /* @__PURE__ */ jsx30("div", { className: "flex h-full w-full flex-col", children })
|
|
2381
|
-
}
|
|
2382
|
-
) });
|
|
2383
|
-
}
|
|
2384
|
-
return /* @__PURE__ */ jsxs18(
|
|
2385
|
-
"div",
|
|
2386
|
-
{
|
|
2387
|
-
ref,
|
|
2388
|
-
className: "group peer hidden text-sidebar-foreground md:block",
|
|
2389
|
-
"data-state": state,
|
|
2390
|
-
"data-collapsible": state === "collapsed" ? collapsible : "",
|
|
2391
|
-
"data-variant": variant,
|
|
2392
|
-
"data-side": side,
|
|
2393
|
-
children: [
|
|
2394
|
-
/* @__PURE__ */ jsx30(
|
|
2395
|
-
"div",
|
|
2396
|
-
{
|
|
2397
|
-
className: cn(
|
|
2398
|
-
"relative h-svh w-[--sidebar-width] bg-transparent transition-[width] duration-200 ease-linear",
|
|
2399
|
-
"group-data-[collapsible=offcanvas]:w-0",
|
|
2400
|
-
"group-data-[side=right]:rotate-180",
|
|
2401
|
-
variant === "floating" || variant === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]" : "group-data-[collapsible=icon]:w-[--sidebar-width-icon]"
|
|
2402
|
-
)
|
|
2403
|
-
}
|
|
2404
|
-
),
|
|
2405
|
-
/* @__PURE__ */ jsx30(
|
|
2406
|
-
"div",
|
|
2407
|
-
{
|
|
2408
|
-
className: cn(
|
|
2409
|
-
"fixed inset-y-0 z-10 hidden h-svh w-[--sidebar-width] transition-[left,right,width] duration-200 ease-linear md:flex",
|
|
2410
|
-
side === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
|
|
2411
|
-
// Adjust the padding for floating and inset variants.
|
|
2412
|
-
variant === "floating" || variant === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]" : "group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l",
|
|
2413
|
-
className
|
|
2414
|
-
),
|
|
2415
|
-
...props,
|
|
2416
|
-
children: /* @__PURE__ */ jsx30(
|
|
2417
|
-
"div",
|
|
2418
|
-
{
|
|
2419
|
-
"data-sidebar": "sidebar",
|
|
2420
|
-
className: "flex h-full w-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:border-sidebar-border group-data-[variant=floating]:shadow",
|
|
2421
|
-
children
|
|
2422
|
-
}
|
|
2423
|
-
)
|
|
2424
|
-
}
|
|
2425
|
-
)
|
|
2426
|
-
]
|
|
2427
|
-
}
|
|
2428
|
-
);
|
|
2429
|
-
}
|
|
2430
|
-
);
|
|
2431
|
-
SidebarBase.displayName = "SidebarBase";
|
|
2432
|
-
var SidebarTriggerBase = React22.forwardRef(({ className, onClick, ...props }, ref) => {
|
|
2433
|
-
const { toggleSidebar } = UseSideBarBase();
|
|
2434
|
-
return /* @__PURE__ */ jsx30("div", { children: /* @__PURE__ */ jsxs18(
|
|
2435
|
-
ButtonBase,
|
|
2436
|
-
{
|
|
2437
|
-
ref,
|
|
2438
|
-
"data-sidebar": "trigger",
|
|
2439
|
-
variant: "ghost",
|
|
2440
|
-
size: "icon",
|
|
2441
|
-
className: cn("h-7 w-7", className),
|
|
2442
|
-
onClick: (event) => {
|
|
2443
|
-
onClick?.(event);
|
|
2444
|
-
toggleSidebar();
|
|
2445
|
-
},
|
|
2446
|
-
...props,
|
|
2447
|
-
children: [
|
|
2448
|
-
/* @__PURE__ */ jsx30("span", { className: "sr-only", children: "Toggle SidebarBase" }),
|
|
2449
|
-
/* @__PURE__ */ jsx30(SidebarSimple, {})
|
|
2450
|
-
]
|
|
2451
|
-
}
|
|
2452
|
-
) });
|
|
2453
|
-
});
|
|
2454
|
-
SidebarTriggerBase.displayName = "SidebarTriggerBase";
|
|
2455
|
-
var SidebarRailBase = React22.forwardRef(({ className, ...props }, ref) => {
|
|
2456
|
-
const { toggleSidebar } = UseSideBarBase();
|
|
2457
|
-
return /* @__PURE__ */ jsx30(
|
|
2458
|
-
"button",
|
|
2459
|
-
{
|
|
2460
|
-
ref,
|
|
2461
|
-
"data-sidebar": "rail",
|
|
2462
|
-
"aria-label": "Toggle SidebarBase",
|
|
2463
|
-
tabIndex: -1,
|
|
2464
|
-
onClick: toggleSidebar,
|
|
2465
|
-
title: "Toggle SidebarBase",
|
|
2466
|
-
className: cn(
|
|
2467
|
-
"absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=left]:-right-4 group-data-[side=right]:left-0 sm:flex",
|
|
2468
|
-
"[[data-side=left]_&]:cursor-w-resize [[data-side=right]_&]:cursor-e-resize",
|
|
2469
|
-
"[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
|
|
2470
|
-
"group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full group-data-[collapsible=offcanvas]:hover:bg-sidebar",
|
|
2471
|
-
"[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
|
|
2472
|
-
"[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
|
|
2473
|
-
className
|
|
2474
|
-
),
|
|
2475
|
-
...props
|
|
2476
|
-
}
|
|
2477
|
-
);
|
|
2478
|
-
});
|
|
2479
|
-
SidebarRailBase.displayName = "SidebarRailBase";
|
|
2480
|
-
var SidebarInsetBase = React22.forwardRef(({ className, ...props }, ref) => {
|
|
2481
|
-
return /* @__PURE__ */ jsx30(
|
|
2482
|
-
"main",
|
|
2483
|
-
{
|
|
2484
|
-
ref,
|
|
2485
|
-
className: cn(
|
|
2486
|
-
"relative flex min-h-svh flex-1 flex-col bg-background",
|
|
2487
|
-
"peer-data-[variant=inset]:min-h-[calc(100svh-theme(spacing.4))] md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow",
|
|
2488
|
-
className
|
|
2489
|
-
),
|
|
2490
|
-
...props
|
|
2491
|
-
}
|
|
2492
|
-
);
|
|
2493
|
-
});
|
|
2494
|
-
SidebarInsetBase.displayName = "SidebarInsetBase";
|
|
2495
|
-
var SidebarInputBase = React22.forwardRef(({ className, ...props }, ref) => {
|
|
2496
|
-
return /* @__PURE__ */ jsx30(
|
|
2497
|
-
InputBase,
|
|
2498
|
-
{
|
|
2499
|
-
ref,
|
|
2500
|
-
"data-sidebar": "input",
|
|
2501
|
-
className: cn(
|
|
2502
|
-
"h-8 w-full bg-background shadow-none focus-visible:ring-2 focus-visible:ring-sidebar-ring",
|
|
2503
|
-
className
|
|
2504
|
-
),
|
|
2505
|
-
...props
|
|
2506
|
-
}
|
|
2507
|
-
);
|
|
2508
|
-
});
|
|
2509
|
-
SidebarInputBase.displayName = "SidebarInputBase";
|
|
2510
|
-
var SidebarHeaderBase = React22.forwardRef(({ className, ...props }, ref) => {
|
|
2511
|
-
return /* @__PURE__ */ jsx30(
|
|
2512
|
-
"div",
|
|
2513
|
-
{
|
|
2514
|
-
ref,
|
|
2515
|
-
"data-sidebar": "header",
|
|
2516
|
-
className: cn("flex flex-col gap-2 p-2", className),
|
|
2517
|
-
...props
|
|
2518
|
-
}
|
|
2519
|
-
);
|
|
2520
|
-
});
|
|
2521
|
-
SidebarHeaderBase.displayName = "SidebarHeaderBase";
|
|
2522
|
-
var SidebarFooterBase = React22.forwardRef(({ className, ...props }, ref) => {
|
|
2523
|
-
return /* @__PURE__ */ jsx30(
|
|
2524
|
-
"div",
|
|
2525
|
-
{
|
|
2526
|
-
ref,
|
|
2527
|
-
"data-sidebar": "footer",
|
|
2528
|
-
className: cn("flex flex-col gap-2 p-2", className),
|
|
2529
|
-
...props
|
|
2530
|
-
}
|
|
2531
|
-
);
|
|
2532
|
-
});
|
|
2533
|
-
SidebarFooterBase.displayName = "SidebarFooterBase";
|
|
2534
|
-
var SidebarSeparatorBase = React22.forwardRef(({ className, ...props }, ref) => {
|
|
2535
|
-
return /* @__PURE__ */ jsx30(
|
|
2536
|
-
SeparatorBase,
|
|
2537
|
-
{
|
|
2538
|
-
ref,
|
|
2539
|
-
"data-sidebar": "separator",
|
|
2540
|
-
className: cn("mx-2 w-auto bg-sidebar-border", className),
|
|
2541
|
-
...props
|
|
2542
|
-
}
|
|
2543
|
-
);
|
|
2544
|
-
});
|
|
2545
|
-
SidebarSeparatorBase.displayName = "SidebarSeparatorBase";
|
|
2546
|
-
var SidebarContentBase = React22.forwardRef(({ className, ...props }, ref) => {
|
|
2547
|
-
return /* @__PURE__ */ jsx30(
|
|
2548
|
-
"div",
|
|
2549
|
-
{
|
|
2550
|
-
ref,
|
|
2551
|
-
"data-sidebar": "content",
|
|
2552
|
-
className: cn(
|
|
2553
|
-
"flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
|
|
2554
|
-
className
|
|
2555
|
-
),
|
|
2556
|
-
...props
|
|
2557
|
-
}
|
|
2558
|
-
);
|
|
2559
|
-
});
|
|
2560
|
-
SidebarContentBase.displayName = "SidebarContentBase";
|
|
2561
|
-
var SidebarGroupBase = React22.forwardRef(({ className, ...props }, ref) => {
|
|
2562
|
-
return /* @__PURE__ */ jsx30(
|
|
2563
|
-
"div",
|
|
2564
|
-
{
|
|
2565
|
-
ref,
|
|
2566
|
-
"data-sidebar": "group",
|
|
2567
|
-
className: cn("relative flex w-full min-w-0 flex-col p-2", className),
|
|
2568
|
-
...props
|
|
2569
|
-
}
|
|
2570
|
-
);
|
|
2571
|
-
});
|
|
2572
|
-
SidebarGroupBase.displayName = "SidebarGroupBase";
|
|
2573
|
-
var SidebarGroupLabelBase = React22.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
2574
|
-
const Comp = asChild ? Slot3 : "div";
|
|
2575
|
-
return /* @__PURE__ */ jsx30(
|
|
2576
|
-
Comp,
|
|
2577
|
-
{
|
|
2578
|
-
ref,
|
|
2579
|
-
"data-sidebar": "group-label",
|
|
2580
|
-
className: cn(
|
|
2581
|
-
"flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 outline-none ring-sidebar-ring transition-[margin,opa] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
|
|
2582
|
-
"group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
|
|
2583
|
-
className
|
|
2584
|
-
),
|
|
2585
|
-
...props
|
|
2586
|
-
}
|
|
2587
|
-
);
|
|
2588
|
-
});
|
|
2589
|
-
SidebarGroupLabelBase.displayName = "SidebarGroupLabelBase";
|
|
2590
|
-
var SidebarGroupActionBase = React22.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
2591
|
-
const Comp = asChild ? Slot3 : "button";
|
|
2592
|
-
return /* @__PURE__ */ jsx30(
|
|
2593
|
-
Comp,
|
|
2594
|
-
{
|
|
2595
|
-
ref,
|
|
2596
|
-
"data-sidebar": "group-action",
|
|
2597
|
-
className: cn(
|
|
2598
|
-
"absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
|
|
2599
|
-
// Increases the hit area of the button on mobile.
|
|
2600
|
-
"after:absolute after:-inset-2 after:md:hidden",
|
|
2601
|
-
"group-data-[collapsible=icon]:hidden",
|
|
2602
|
-
className
|
|
2603
|
-
),
|
|
2604
|
-
...props
|
|
2605
|
-
}
|
|
2606
|
-
);
|
|
2607
|
-
});
|
|
2608
|
-
SidebarGroupActionBase.displayName = "SidebarGroupActionBase";
|
|
2609
|
-
var SidebarGroupContentBase = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
|
|
2610
|
-
"div",
|
|
2611
|
-
{
|
|
2612
|
-
ref,
|
|
2613
|
-
"data-sidebar": "group-content",
|
|
2614
|
-
className: cn("w-full text-sm", className),
|
|
2615
|
-
...props
|
|
2616
|
-
}
|
|
2617
|
-
));
|
|
2618
|
-
SidebarGroupContentBase.displayName = "SidebarGroupContentBase";
|
|
2619
|
-
var SidebarMenuBase = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
|
|
2620
|
-
"ul",
|
|
2621
|
-
{
|
|
2622
|
-
ref,
|
|
2623
|
-
"data-sidebar": "menu",
|
|
2624
|
-
className: cn("flex w-full min-w-0 flex-col gap-1", className),
|
|
2625
|
-
...props
|
|
2626
|
-
}
|
|
2627
|
-
));
|
|
2628
|
-
SidebarMenuBase.displayName = "SidebarMenuBase";
|
|
2629
|
-
var SidebarMenuItemBase = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
|
|
2630
|
-
"li",
|
|
2631
|
-
{
|
|
2632
|
-
ref,
|
|
2633
|
-
"data-sidebar": "menu-item",
|
|
2634
|
-
className: cn("group/menu-item relative", className),
|
|
2635
|
-
...props
|
|
2636
|
-
}
|
|
2637
|
-
));
|
|
2638
|
-
SidebarMenuItemBase.displayName = "SidebarMenuItemBase";
|
|
2639
|
-
var sidebarMenuButtonVariants = cva3(
|
|
2640
|
-
"peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-none ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-[[data-sidebar=menu-action]]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-2 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
|
|
2641
|
-
{
|
|
2642
|
-
variants: {
|
|
2643
|
-
variant: {
|
|
2644
|
-
default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
|
|
2645
|
-
outline: "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]"
|
|
2646
|
-
},
|
|
2647
|
-
size: {
|
|
2648
|
-
default: "h-8 text-sm",
|
|
2649
|
-
sm: "h-7 text-xs",
|
|
2650
|
-
lg: "h-12 text-sm group-data-[collapsible=icon]:!p-0"
|
|
2651
|
-
}
|
|
2652
|
-
},
|
|
2653
|
-
defaultVariants: {
|
|
2654
|
-
variant: "default",
|
|
2655
|
-
size: "default"
|
|
2656
|
-
}
|
|
2657
|
-
}
|
|
2658
|
-
);
|
|
2659
|
-
var SidebarMenuButtonBase = React22.forwardRef(
|
|
2660
|
-
({
|
|
2661
|
-
asChild = false,
|
|
2662
|
-
isActive = false,
|
|
2663
|
-
variant = "default",
|
|
2664
|
-
size = "default",
|
|
2665
|
-
tooltip,
|
|
2666
|
-
className,
|
|
2667
|
-
...props
|
|
2668
|
-
}, ref) => {
|
|
2669
|
-
const Comp = asChild ? Slot3 : "button";
|
|
2670
|
-
const { isMobile, state } = UseSideBarBase();
|
|
2671
|
-
const button = /* @__PURE__ */ jsx30(
|
|
2672
|
-
Comp,
|
|
2673
|
-
{
|
|
2674
|
-
ref,
|
|
2675
|
-
"data-sidebar": "menu-button",
|
|
2676
|
-
"data-size": size,
|
|
2677
|
-
"data-active": isActive,
|
|
2678
|
-
className: cn(sidebarMenuButtonVariants({ variant, size }), className),
|
|
46
|
+
"data-testid": testid,
|
|
2679
47
|
...props
|
|
2680
48
|
}
|
|
2681
|
-
);
|
|
2682
|
-
if (!tooltip) {
|
|
2683
|
-
return button;
|
|
2684
|
-
}
|
|
2685
|
-
if (typeof tooltip === "string") {
|
|
2686
|
-
tooltip = {
|
|
2687
|
-
children: tooltip
|
|
2688
|
-
};
|
|
2689
|
-
}
|
|
2690
|
-
return /* @__PURE__ */ jsxs18(TooltipBase, { children: [
|
|
2691
|
-
/* @__PURE__ */ jsx30(TooltipTriggerBase, { asChild: true, children: button }),
|
|
2692
|
-
/* @__PURE__ */ jsx30(
|
|
2693
|
-
TooltipContentBase,
|
|
2694
|
-
{
|
|
2695
|
-
side: "right",
|
|
2696
|
-
align: "center",
|
|
2697
|
-
hidden: state !== "collapsed" || isMobile,
|
|
2698
|
-
...tooltip
|
|
2699
|
-
}
|
|
2700
|
-
)
|
|
2701
|
-
] });
|
|
2702
|
-
}
|
|
2703
|
-
);
|
|
2704
|
-
SidebarMenuButtonBase.displayName = "SidebarMenuButtonBase";
|
|
2705
|
-
var SidebarMenuActionBase = React22.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
|
|
2706
|
-
const Comp = asChild ? Slot3 : "button";
|
|
2707
|
-
return /* @__PURE__ */ jsx30(
|
|
2708
|
-
Comp,
|
|
2709
|
-
{
|
|
2710
|
-
ref,
|
|
2711
|
-
"data-sidebar": "menu-action",
|
|
2712
|
-
className: cn(
|
|
2713
|
-
"absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0",
|
|
2714
|
-
// Increases the hit area of the button on mobile.
|
|
2715
|
-
"after:absolute after:-inset-2 after:md:hidden",
|
|
2716
|
-
"peer-data-[size=sm]/menu-button:top-1",
|
|
2717
|
-
"peer-data-[size=default]/menu-button:top-1.5",
|
|
2718
|
-
"peer-data-[size=lg]/menu-button:top-2.5",
|
|
2719
|
-
"group-data-[collapsible=icon]:hidden",
|
|
2720
|
-
showOnHover && "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground md:opacity-0",
|
|
2721
|
-
className
|
|
2722
|
-
),
|
|
2723
|
-
...props
|
|
2724
|
-
}
|
|
2725
|
-
);
|
|
2726
|
-
});
|
|
2727
|
-
SidebarMenuActionBase.displayName = "SidebarMenuActionBase";
|
|
2728
|
-
var SidebarMenuBadgeBase = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
|
|
2729
|
-
"div",
|
|
2730
|
-
{
|
|
2731
|
-
ref,
|
|
2732
|
-
"data-sidebar": "menu-badge",
|
|
2733
|
-
className: cn(
|
|
2734
|
-
"pointer-events-none absolute right-1 flex h-5 min-w-5 select-none items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums text-sidebar-foreground",
|
|
2735
|
-
"peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
|
|
2736
|
-
"peer-data-[size=sm]/menu-button:top-1",
|
|
2737
|
-
"peer-data-[size=default]/menu-button:top-1.5",
|
|
2738
|
-
"peer-data-[size=lg]/menu-button:top-2.5",
|
|
2739
|
-
"group-data-[collapsible=icon]:hidden",
|
|
2740
|
-
className
|
|
2741
|
-
),
|
|
2742
|
-
...props
|
|
2743
|
-
}
|
|
2744
|
-
));
|
|
2745
|
-
SidebarMenuBadgeBase.displayName = "SidebarMenuBadgeBase";
|
|
2746
|
-
var SidebarMenuSkeletonBase = React22.forwardRef(({ className, showIcon = false, ...props }, ref) => {
|
|
2747
|
-
const width = React22.useMemo(() => {
|
|
2748
|
-
return `${Math.floor(Math.random() * 40) + 50}%`;
|
|
2749
|
-
}, []);
|
|
2750
|
-
return /* @__PURE__ */ jsxs18(
|
|
2751
|
-
"div",
|
|
2752
|
-
{
|
|
2753
|
-
ref,
|
|
2754
|
-
"data-sidebar": "menu-skeleton",
|
|
2755
|
-
className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
|
|
2756
|
-
...props,
|
|
2757
|
-
children: [
|
|
2758
|
-
showIcon && /* @__PURE__ */ jsx30(
|
|
2759
|
-
SkeletonBase,
|
|
2760
|
-
{
|
|
2761
|
-
className: "size-4 rounded-md",
|
|
2762
|
-
"data-sidebar": "menu-skeleton-icon"
|
|
2763
|
-
}
|
|
2764
|
-
),
|
|
2765
|
-
/* @__PURE__ */ jsx30(
|
|
2766
|
-
SkeletonBase,
|
|
2767
|
-
{
|
|
2768
|
-
className: "h-4 max-w-[--skeleton-width] flex-1",
|
|
2769
|
-
"data-sidebar": "menu-skeleton-text",
|
|
2770
|
-
style: {
|
|
2771
|
-
"--skeleton-width": width
|
|
2772
|
-
}
|
|
2773
|
-
}
|
|
2774
|
-
)
|
|
2775
|
-
]
|
|
2776
|
-
}
|
|
2777
|
-
);
|
|
2778
|
-
});
|
|
2779
|
-
SidebarMenuSkeletonBase.displayName = "SidebarMenuSkeletonBase";
|
|
2780
|
-
var SidebarMenuSubBase = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
|
|
2781
|
-
"ul",
|
|
2782
|
-
{
|
|
2783
|
-
ref,
|
|
2784
|
-
"data-sidebar": "menu-sub",
|
|
2785
|
-
className: cn(
|
|
2786
|
-
"mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5",
|
|
2787
|
-
"group-data-[collapsible=icon]:hidden",
|
|
2788
|
-
className
|
|
2789
|
-
),
|
|
2790
|
-
...props
|
|
2791
|
-
}
|
|
2792
|
-
));
|
|
2793
|
-
SidebarMenuSubBase.displayName = "SidebarMenuSubBase";
|
|
2794
|
-
var SidebarMenuSubItemBase = React22.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx30("li", { ref, ...props }));
|
|
2795
|
-
SidebarMenuSubItemBase.displayName = "SidebarMenuSubItemBase";
|
|
2796
|
-
var SidebarMenuSubButtonBase = React22.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
|
|
2797
|
-
const Comp = asChild ? Slot3 : "a";
|
|
2798
|
-
return /* @__PURE__ */ jsx30(
|
|
2799
|
-
Comp,
|
|
2800
|
-
{
|
|
2801
|
-
ref,
|
|
2802
|
-
"data-sidebar": "menu-sub-button",
|
|
2803
|
-
"data-size": size,
|
|
2804
|
-
"data-active": isActive,
|
|
2805
|
-
className: cn(
|
|
2806
|
-
"flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
|
|
2807
|
-
"data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
|
|
2808
|
-
size === "sm" && "text-xs",
|
|
2809
|
-
size === "md" && "text-sm",
|
|
2810
|
-
"group-data-[collapsible=icon]:hidden",
|
|
2811
|
-
className
|
|
2812
|
-
),
|
|
2813
|
-
...props
|
|
2814
|
-
}
|
|
2815
|
-
);
|
|
2816
|
-
});
|
|
2817
|
-
SidebarMenuSubButtonBase.displayName = "SidebarMenuSubButtonBase";
|
|
2818
|
-
|
|
2819
|
-
// src/components/ui/SliderBase.tsx
|
|
2820
|
-
import * as React23 from "react";
|
|
2821
|
-
import * as SliderPrimitive from "@radix-ui/react-slider";
|
|
2822
|
-
import { jsx as jsx31, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
2823
|
-
var SlideBase = React23.forwardRef(
|
|
2824
|
-
({
|
|
2825
|
-
className,
|
|
2826
|
-
orientation = "horizontal",
|
|
2827
|
-
label,
|
|
2828
|
-
leftIcon,
|
|
2829
|
-
rightIcon,
|
|
2830
|
-
...props
|
|
2831
|
-
}, ref) => {
|
|
2832
|
-
const isVertical = orientation === "vertical";
|
|
2833
|
-
return /* @__PURE__ */ jsxs19(
|
|
2834
|
-
"div",
|
|
2835
|
-
{
|
|
2836
|
-
className: cn(
|
|
2837
|
-
"flex flex-col gap-1",
|
|
2838
|
-
isVertical ? "h-full " : "w-full"
|
|
2839
|
-
),
|
|
2840
|
-
children: [
|
|
2841
|
-
label && /* @__PURE__ */ jsx31(LabelBase_default, { className: "py-2", children: label }),
|
|
2842
|
-
/* @__PURE__ */ jsxs19(
|
|
2843
|
-
"div",
|
|
2844
|
-
{
|
|
2845
|
-
className: cn(
|
|
2846
|
-
"flex gap-2",
|
|
2847
|
-
isVertical ? "flex-col h-full" : "flex-row items-center w-full"
|
|
2848
|
-
),
|
|
2849
|
-
children: [
|
|
2850
|
-
leftIcon && /* @__PURE__ */ jsx31("div", { className: "flex items-center justify-center", children: leftIcon }),
|
|
2851
|
-
/* @__PURE__ */ jsxs19(
|
|
2852
|
-
SliderPrimitive.Root,
|
|
2853
|
-
{
|
|
2854
|
-
ref,
|
|
2855
|
-
orientation,
|
|
2856
|
-
className: cn(
|
|
2857
|
-
"relative flex touch-none select-none items-center",
|
|
2858
|
-
isVertical ? "flex-col h-full" : "flex-row w-full",
|
|
2859
|
-
className
|
|
2860
|
-
),
|
|
2861
|
-
...props,
|
|
2862
|
-
children: [
|
|
2863
|
-
/* @__PURE__ */ jsx31(
|
|
2864
|
-
SliderPrimitive.Track,
|
|
2865
|
-
{
|
|
2866
|
-
className: cn(
|
|
2867
|
-
"relative overflow-hidden bg-primary/20 rounded-full",
|
|
2868
|
-
isVertical ? "w-1.5 h-full" : "h-1.5 w-full"
|
|
2869
|
-
),
|
|
2870
|
-
children: /* @__PURE__ */ jsx31(
|
|
2871
|
-
SliderPrimitive.Range,
|
|
2872
|
-
{
|
|
2873
|
-
className: cn(
|
|
2874
|
-
"absolute bg-primary",
|
|
2875
|
-
isVertical ? "w-full" : "h-full"
|
|
2876
|
-
)
|
|
2877
|
-
}
|
|
2878
|
-
)
|
|
2879
|
-
}
|
|
2880
|
-
),
|
|
2881
|
-
/* @__PURE__ */ jsx31(
|
|
2882
|
-
SliderPrimitive.Thumb,
|
|
2883
|
-
{
|
|
2884
|
-
className: cn(
|
|
2885
|
-
"block h-4 w-4 rounded-full border border-primary/70 bg-background shadow-md transition-transform",
|
|
2886
|
-
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2",
|
|
2887
|
-
"hover:scale-125 active:scale-125"
|
|
2888
|
-
)
|
|
2889
|
-
}
|
|
2890
|
-
)
|
|
2891
|
-
]
|
|
2892
|
-
}
|
|
2893
|
-
),
|
|
2894
|
-
rightIcon && /* @__PURE__ */ jsx31("div", { className: "flex items-center justify-center", children: rightIcon })
|
|
2895
|
-
]
|
|
2896
|
-
}
|
|
2897
|
-
)
|
|
2898
|
-
]
|
|
2899
|
-
}
|
|
2900
|
-
);
|
|
49
|
+
) });
|
|
2901
50
|
}
|
|
2902
51
|
);
|
|
2903
|
-
|
|
2904
|
-
|
|
2905
|
-
// src/components/ui/SonnerBase.tsx
|
|
2906
|
-
import {
|
|
2907
|
-
CheckCircle,
|
|
2908
|
-
XCircle,
|
|
2909
|
-
Info,
|
|
2910
|
-
Warning,
|
|
2911
|
-
Spinner
|
|
2912
|
-
} from "phosphor-react";
|
|
2913
|
-
import { Toaster as Sonner, toast as sonnertoast } from "sonner";
|
|
2914
|
-
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
2915
|
-
var iconBaseClass = "w-5 h-auto";
|
|
2916
|
-
var Toaster = ({ testId, ...props }) => {
|
|
2917
|
-
return /* @__PURE__ */ jsx32(
|
|
2918
|
-
Sonner,
|
|
2919
|
-
{
|
|
2920
|
-
className: "toaster group",
|
|
2921
|
-
position: "top-center",
|
|
2922
|
-
toastOptions: {
|
|
2923
|
-
classNames: {
|
|
2924
|
-
toast: `
|
|
2925
|
-
group toast
|
|
2926
|
-
bg-white
|
|
2927
|
-
text-neutral-800
|
|
2928
|
-
shadow-lg rounded-md
|
|
2929
|
-
border-l-4
|
|
2930
|
-
border-neutral-200
|
|
2931
|
-
flex items-center gap-3
|
|
2932
|
-
data-[type=success]:border-l-green-500 data-[type=success]:bg-green-50 data-[type=success]:text-green-800 data-[type=success]:border-green-500
|
|
2933
|
-
data-[type=error]:border-l-red-500 data-[type=error]:bg-red-50 data-[type=error]:text-red-800 data-[type=error]:border-red-500
|
|
2934
|
-
data-[type=warning]:border-l-yellow-500 data-[type=warning]:bg-yellow-50 data-[type=warning]:text-yellow-800 data-[type=warning]:border-yellow-500
|
|
2935
|
-
data-[type=info]:border-l-blue-500 data-[type=info]:bg-blue-50 data-[type=info]:text-blue-800 data-[type=info]:border-blue-500
|
|
2936
|
-
`,
|
|
2937
|
-
description: `
|
|
2938
|
-
text-sm
|
|
2939
|
-
group-[.toast]:text-neutral-600
|
|
2940
|
-
`,
|
|
2941
|
-
actionButton: `
|
|
2942
|
-
ml-auto
|
|
2943
|
-
rounded-md px-3 py-1 text-sm font-semibold
|
|
2944
|
-
bg-neutral-800 text-white
|
|
2945
|
-
hover:bg-neutral-700
|
|
2946
|
-
transition-colors duration-200
|
|
2947
|
-
`,
|
|
2948
|
-
cancelButton: `
|
|
2949
|
-
ml-2
|
|
2950
|
-
rounded-md px-3 py-1 text-sm font-semibold
|
|
2951
|
-
bg-neutral-100 text-neutral-700
|
|
2952
|
-
hover:bg-neutral-200
|
|
2953
|
-
transition-colors duration-200
|
|
2954
|
-
`
|
|
2955
|
-
}
|
|
2956
|
-
},
|
|
2957
|
-
"data-testid": testId,
|
|
2958
|
-
...props
|
|
2959
|
-
}
|
|
2960
|
-
);
|
|
2961
|
-
};
|
|
2962
|
-
var toast = {
|
|
2963
|
-
success: (message) => sonnertoast.success(message, {
|
|
2964
|
-
icon: /* @__PURE__ */ jsx32(CheckCircle, { className: `${iconBaseClass} text-green-600`, weight: "fill" }),
|
|
2965
|
-
className: "sonner-success"
|
|
2966
|
-
}),
|
|
2967
|
-
error: (message) => sonnertoast.error(message, {
|
|
2968
|
-
icon: /* @__PURE__ */ jsx32(XCircle, { className: `${iconBaseClass} text-red-600`, weight: "fill" }),
|
|
2969
|
-
className: "sonner-error"
|
|
2970
|
-
}),
|
|
2971
|
-
warning: (message) => sonnertoast.warning(message, {
|
|
2972
|
-
icon: /* @__PURE__ */ jsx32(Warning, { className: `${iconBaseClass} text-yellow-600`, weight: "fill" }),
|
|
2973
|
-
className: "sonner-warning"
|
|
2974
|
-
}),
|
|
2975
|
-
info: (message) => sonnertoast.info(message, {
|
|
2976
|
-
icon: /* @__PURE__ */ jsx32(Info, { className: `${iconBaseClass} text-blue-600`, weight: "fill" }),
|
|
2977
|
-
className: "sonner-info"
|
|
2978
|
-
}),
|
|
2979
|
-
loading: (message) => sonnertoast(message, {
|
|
2980
|
-
icon: /* @__PURE__ */ jsx32(Spinner, { className: `${iconBaseClass} animate-spin text-neutral-500`, weight: "fill" }),
|
|
2981
|
-
className: "sonner-loading"
|
|
2982
|
-
})
|
|
2983
|
-
};
|
|
2984
|
-
|
|
2985
|
-
// src/components/ui/SwitchBase.tsx
|
|
2986
|
-
import * as React24 from "react";
|
|
2987
|
-
import * as SwitchPrimitives from "@radix-ui/react-switch";
|
|
2988
|
-
import { jsx as jsx33 } from "react/jsx-runtime";
|
|
2989
|
-
var SwitchBase = React24.forwardRef(({ className, testid: dataTestId = "switch-base", ...props }, ref) => {
|
|
2990
|
-
return /* @__PURE__ */ jsx33(
|
|
2991
|
-
SwitchPrimitives.Root,
|
|
2992
|
-
{
|
|
2993
|
-
...props,
|
|
2994
|
-
ref,
|
|
2995
|
-
className: cn(
|
|
2996
|
-
"peer relative inline-flex w-12 cursor-pointer items-center rounded-full border-2 border-transparent shadow-md transition-colors duration-300 ease-in-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input data-[state=checked]:shadow-[0_0_15px_4px_var(--tw-shadow-color)] data-[state=checked]:shadow-primary/30",
|
|
2997
|
-
className
|
|
2998
|
-
),
|
|
2999
|
-
"data-testid": dataTestId,
|
|
3000
|
-
children: /* @__PURE__ */ jsx33(
|
|
3001
|
-
SwitchPrimitives.Thumb,
|
|
3002
|
-
{
|
|
3003
|
-
className: cn(
|
|
3004
|
-
"pointer-events-none block h-4 w-4 rounded-full bg-background shadow-xl ring-0 transition-transform duration-350 ease-out peer-focus:shadow-lg peer-focus:ring-2 peer-focus:ring-primary/70 data-[state=unchecked]:translate-x-0 data-[state=checked]:translate-x-7 data-[state=checked]:animate-bounce-thumb"
|
|
3005
|
-
),
|
|
3006
|
-
style: {
|
|
3007
|
-
transformOrigin: "center",
|
|
3008
|
-
transition: "transform 350ms cubic-bezier(0.68, -0.55, 0.265, 1.55)"
|
|
3009
|
-
}
|
|
3010
|
-
}
|
|
3011
|
-
)
|
|
3012
|
-
}
|
|
3013
|
-
);
|
|
3014
|
-
});
|
|
3015
|
-
SwitchBase.displayName = SwitchPrimitives.Root.displayName;
|
|
3016
|
-
|
|
3017
|
-
// src/components/ui/TableBase.tsx
|
|
3018
|
-
import * as React25 from "react";
|
|
3019
|
-
import { jsx as jsx34 } from "react/jsx-runtime";
|
|
3020
|
-
var TableBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx34(
|
|
3021
|
-
"table",
|
|
3022
|
-
{
|
|
3023
|
-
ref,
|
|
3024
|
-
className: cn("w-full caption-bottom text-sm", className),
|
|
3025
|
-
...props
|
|
3026
|
-
}
|
|
3027
|
-
) }));
|
|
3028
|
-
TableBase.displayName = "TableBase";
|
|
3029
|
-
var TableHeaderBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34("thead", { ref, className: cn("[&_tr]:border-b", className), ...props }));
|
|
3030
|
-
TableHeaderBase.displayName = "TableHeaderBase";
|
|
3031
|
-
var TableBodyBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
|
|
3032
|
-
"tbody",
|
|
3033
|
-
{
|
|
3034
|
-
ref,
|
|
3035
|
-
className: cn("[&_tr:last-child]:border-0", className),
|
|
3036
|
-
...props
|
|
3037
|
-
}
|
|
3038
|
-
));
|
|
3039
|
-
TableBodyBase.displayName = "TableBodyBase";
|
|
3040
|
-
var TableFooterBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
|
|
3041
|
-
"tfoot",
|
|
3042
|
-
{
|
|
3043
|
-
ref,
|
|
3044
|
-
className: cn(
|
|
3045
|
-
"border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
|
|
3046
|
-
className
|
|
3047
|
-
),
|
|
3048
|
-
...props
|
|
3049
|
-
}
|
|
3050
|
-
));
|
|
3051
|
-
TableFooterBase.displayName = "TableFooterBase";
|
|
3052
|
-
var TableRowBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
|
|
3053
|
-
"tr",
|
|
3054
|
-
{
|
|
3055
|
-
ref,
|
|
3056
|
-
className: cn(
|
|
3057
|
-
"border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
|
|
3058
|
-
className
|
|
3059
|
-
),
|
|
3060
|
-
...props
|
|
3061
|
-
}
|
|
3062
|
-
));
|
|
3063
|
-
TableRowBase.displayName = "TableRowBase";
|
|
3064
|
-
var TableHeadBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
|
|
3065
|
-
"th",
|
|
3066
|
-
{
|
|
3067
|
-
ref,
|
|
3068
|
-
className: cn(
|
|
3069
|
-
"h-10 px-2 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
|
|
3070
|
-
className
|
|
3071
|
-
),
|
|
3072
|
-
...props
|
|
3073
|
-
}
|
|
3074
|
-
));
|
|
3075
|
-
TableHeadBase.displayName = "TableHeadBase";
|
|
3076
|
-
var TableCellBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
|
|
3077
|
-
"td",
|
|
3078
|
-
{
|
|
3079
|
-
ref,
|
|
3080
|
-
className: cn(
|
|
3081
|
-
"p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
|
|
3082
|
-
className
|
|
3083
|
-
),
|
|
3084
|
-
...props
|
|
3085
|
-
}
|
|
3086
|
-
));
|
|
3087
|
-
TableCellBase.displayName = "TableCellBase";
|
|
3088
|
-
var TableCaptionBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
|
|
3089
|
-
"caption",
|
|
3090
|
-
{
|
|
3091
|
-
ref,
|
|
3092
|
-
className: cn("mt-4 text-sm text-muted-foreground", className),
|
|
3093
|
-
...props
|
|
3094
|
-
}
|
|
3095
|
-
));
|
|
3096
|
-
TableCaptionBase.displayName = "TableCaptionBase";
|
|
3097
|
-
|
|
3098
|
-
// src/components/ui/TabsBase.tsx
|
|
3099
|
-
import * as React26 from "react";
|
|
3100
|
-
import * as TabsPrimitive from "@radix-ui/react-tabs";
|
|
3101
|
-
import { jsx as jsx35 } from "react/jsx-runtime";
|
|
3102
|
-
var TabsBase = TabsPrimitive.Root;
|
|
3103
|
-
var TabsListBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
|
|
3104
|
-
TabsPrimitive.List,
|
|
3105
|
-
{
|
|
3106
|
-
ref,
|
|
3107
|
-
className: cn(
|
|
3108
|
-
"relative flex w-full items-center justify-start gap-4 border-b-2 border-border",
|
|
3109
|
-
className
|
|
3110
|
-
),
|
|
3111
|
-
...props
|
|
3112
|
-
}
|
|
3113
|
-
));
|
|
3114
|
-
TabsListBase.displayName = TabsPrimitive.List.displayName;
|
|
3115
|
-
var TabsTriggerBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
|
|
3116
|
-
TabsPrimitive.Trigger,
|
|
3117
|
-
{
|
|
3118
|
-
ref,
|
|
3119
|
-
className: cn(
|
|
3120
|
-
"relative inline-flex items-center justify-center whitespace-nowrap px-3 py-2 text-sm font-medium transition-colors",
|
|
3121
|
-
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-3",
|
|
3122
|
-
"disabled:pointer-events-none disabled:opacity-50",
|
|
3123
|
-
"data-[state=active]:text-primary",
|
|
3124
|
-
"after:absolute after:bottom-0 after:left-0 after:h-[1.5px] after:w-full",
|
|
3125
|
-
"after:scale-x-0 after:bg-primary after:origin-left",
|
|
3126
|
-
"after:transition-transform after:duration-300 after:ease-[cubic-bezier(0.65,0,0.35,1)]",
|
|
3127
|
-
"data-[state=active]:after:scale-x-100",
|
|
3128
|
-
className
|
|
3129
|
-
),
|
|
3130
|
-
...props
|
|
3131
|
-
}
|
|
3132
|
-
));
|
|
3133
|
-
var TabsContentBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx35(
|
|
3134
|
-
TabsPrimitive.Content,
|
|
3135
|
-
{
|
|
3136
|
-
ref,
|
|
3137
|
-
className: cn(
|
|
3138
|
-
"mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
|
|
3139
|
-
"animate-fade-in",
|
|
3140
|
-
className
|
|
3141
|
-
),
|
|
3142
|
-
...props
|
|
3143
|
-
}
|
|
3144
|
-
));
|
|
3145
|
-
TabsContentBase.displayName = TabsPrimitive.Content.displayName;
|
|
3146
|
-
|
|
3147
|
-
// src/components/ui/TextAreaBase.tsx
|
|
3148
|
-
import * as React27 from "react";
|
|
3149
|
-
import { jsx as jsx36 } from "react/jsx-runtime";
|
|
3150
|
-
var TextAreaBase = React27.forwardRef(({ className, ...props }, ref) => {
|
|
3151
|
-
return /* @__PURE__ */ jsx36(
|
|
3152
|
-
"textarea",
|
|
3153
|
-
{
|
|
3154
|
-
className: cn(
|
|
3155
|
-
"flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-sm 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",
|
|
3156
|
-
className
|
|
3157
|
-
),
|
|
3158
|
-
ref,
|
|
3159
|
-
...props
|
|
3160
|
-
}
|
|
3161
|
-
);
|
|
3162
|
-
});
|
|
3163
|
-
TextAreaBase.displayName = "TextAreaBase";
|
|
3164
|
-
|
|
3165
|
-
// src/utils/stringHelpers.ts
|
|
3166
|
-
var cleanString = (str) => str.toString().trim().replace(/[^a-zA-Z0-9\s]/g, "").toLowerCase();
|
|
3167
|
-
function includes(input, query) {
|
|
3168
|
-
return cleanString(input).includes(cleanString(query));
|
|
3169
|
-
}
|
|
3170
|
-
|
|
3171
|
-
// src/components/filter/services/apply-filter.ts
|
|
3172
|
-
function applyfilter({
|
|
3173
|
-
condition,
|
|
3174
|
-
filterValue,
|
|
3175
|
-
valueType,
|
|
3176
|
-
value
|
|
3177
|
-
}) {
|
|
3178
|
-
if (!valueType || value === void 0) return true;
|
|
3179
|
-
if (valueType === "string") {
|
|
3180
|
-
if (!filterValue) return true;
|
|
3181
|
-
switch (condition) {
|
|
3182
|
-
case "$eq":
|
|
3183
|
-
return value === filterValue;
|
|
3184
|
-
case "$startsWith":
|
|
3185
|
-
return cleanString(value).startsWith(cleanString(filterValue));
|
|
3186
|
-
case "$endsWith":
|
|
3187
|
-
return cleanString(value).endsWith(cleanString(filterValue));
|
|
3188
|
-
case "$contains":
|
|
3189
|
-
return includes(value, String(filterValue));
|
|
3190
|
-
default:
|
|
3191
|
-
return false;
|
|
3192
|
-
}
|
|
3193
|
-
}
|
|
3194
|
-
if (valueType === "boolean") {
|
|
3195
|
-
switch (condition) {
|
|
3196
|
-
case "$exists":
|
|
3197
|
-
return Boolean(value) === true;
|
|
3198
|
-
case "$notExists":
|
|
3199
|
-
return Boolean(value) === false;
|
|
3200
|
-
default:
|
|
3201
|
-
return false;
|
|
3202
|
-
}
|
|
3203
|
-
}
|
|
3204
|
-
if (valueType === "select") {
|
|
3205
|
-
if (!filterValue) return true;
|
|
3206
|
-
switch (condition) {
|
|
3207
|
-
case "$eq":
|
|
3208
|
-
return cleanString(value) === cleanString(filterValue);
|
|
3209
|
-
case "$ne":
|
|
3210
|
-
return cleanString(value) !== cleanString(filterValue);
|
|
3211
|
-
default:
|
|
3212
|
-
return false;
|
|
3213
|
-
}
|
|
3214
|
-
}
|
|
3215
|
-
if (valueType === "multi-select") {
|
|
3216
|
-
if (!filterValue || !Array.isArray(filterValue)) return true;
|
|
3217
|
-
const filterValues = filterValue.map((value2) => cleanString(value2));
|
|
3218
|
-
switch (condition) {
|
|
3219
|
-
case "$eq":
|
|
3220
|
-
return filterValues.includes(cleanString(value));
|
|
3221
|
-
case "$ne":
|
|
3222
|
-
return !filterValues.includes(cleanString(value));
|
|
3223
|
-
default:
|
|
3224
|
-
return false;
|
|
3225
|
-
}
|
|
3226
|
-
}
|
|
3227
|
-
}
|
|
3228
|
-
|
|
3229
|
-
// src/components/filter/services/default-conditions.ts
|
|
3230
|
-
var defaultStringConditions = [
|
|
3231
|
-
{
|
|
3232
|
-
conditionId: "$contains",
|
|
3233
|
-
conditionName: "cont\xE9m",
|
|
3234
|
-
valueType: "string"
|
|
3235
|
-
},
|
|
3236
|
-
{
|
|
3237
|
-
conditionId: "$startsWith",
|
|
3238
|
-
conditionName: "come\xE7a com",
|
|
3239
|
-
valueType: "string"
|
|
3240
|
-
},
|
|
3241
|
-
{
|
|
3242
|
-
conditionId: "$endsWith",
|
|
3243
|
-
conditionName: "termina com",
|
|
3244
|
-
valueType: "string"
|
|
3245
|
-
},
|
|
3246
|
-
{
|
|
3247
|
-
conditionId: "$eq",
|
|
3248
|
-
conditionName: "\xE9 igual a",
|
|
3249
|
-
valueType: "string"
|
|
3250
|
-
},
|
|
3251
|
-
{
|
|
3252
|
-
conditionId: "$ne",
|
|
3253
|
-
conditionName: "n\xE3o \xE9 igual a",
|
|
3254
|
-
valueType: "string"
|
|
3255
|
-
}
|
|
3256
|
-
];
|
|
3257
|
-
|
|
3258
|
-
// src/components/filter/utils/build-summary.ts
|
|
3259
|
-
function buildFilterSummary(filter, availableFilters) {
|
|
3260
|
-
if (!filter) return null;
|
|
3261
|
-
const foundFilter = availableFilters.find((f) => f.filterId == filter.id);
|
|
3262
|
-
if (!foundFilter) return null;
|
|
3263
|
-
const foundCondition = foundFilter.conditions.find(
|
|
3264
|
-
(c) => c.conditionId == filter.conditionId
|
|
3265
|
-
);
|
|
3266
|
-
if (!foundCondition) return null;
|
|
3267
|
-
if (filter.conditionId === "$exists" || filter.conditionId === "$notExists") {
|
|
3268
|
-
return `${foundFilter.filterName} ${foundCondition.conditionName}`;
|
|
3269
|
-
}
|
|
3270
|
-
if (!filter.value) return null;
|
|
3271
|
-
let value = filter.value.toString();
|
|
3272
|
-
switch (foundCondition.valueType) {
|
|
3273
|
-
case "select": {
|
|
3274
|
-
const selected = foundCondition.selectValues?.find(
|
|
3275
|
-
(s) => s.value == filter.value
|
|
3276
|
-
);
|
|
3277
|
-
if (selected) {
|
|
3278
|
-
value = selected.label;
|
|
3279
|
-
}
|
|
3280
|
-
break;
|
|
3281
|
-
}
|
|
3282
|
-
}
|
|
3283
|
-
return `${foundFilter.filterName} ${foundCondition.conditionName} '${value}'`;
|
|
3284
|
-
}
|
|
52
|
+
LabelBase.displayName = "LabelBase";
|
|
53
|
+
var LabelBase_default = LabelBase;
|
|
3285
54
|
export {
|
|
3286
|
-
AlertDialogActionBase,
|
|
3287
|
-
AlertDialogBase,
|
|
3288
|
-
AlertDialogCancelBase,
|
|
3289
|
-
AlertDialogContentBase,
|
|
3290
|
-
AlertDialogDescriptionBase,
|
|
3291
|
-
AlertDialogFooterBase,
|
|
3292
|
-
AlertDialogHeaderBase,
|
|
3293
|
-
AlertDialogOverlayBase,
|
|
3294
|
-
AlertDialogPortalBase,
|
|
3295
|
-
AlertDialogTitleBase,
|
|
3296
|
-
AlertDialogTriggerBase,
|
|
3297
|
-
AvatarBase,
|
|
3298
|
-
AvatarFallbackBase,
|
|
3299
|
-
AvatarImageBase,
|
|
3300
|
-
ButtonBase,
|
|
3301
|
-
ButtonGroupBase,
|
|
3302
|
-
CalendarBase2 as CalendarBase,
|
|
3303
|
-
CardBase,
|
|
3304
|
-
CardContentBase,
|
|
3305
|
-
CardDescriptionBase,
|
|
3306
|
-
CardFooterBase,
|
|
3307
|
-
CardHeaderBase,
|
|
3308
|
-
CardTitleBase,
|
|
3309
|
-
CheckboxBase,
|
|
3310
|
-
Combobox,
|
|
3311
|
-
CommandBase,
|
|
3312
|
-
CommandDialogBase,
|
|
3313
|
-
CommandEmptyBase,
|
|
3314
|
-
CommandGroupBase,
|
|
3315
|
-
CommandInputBase,
|
|
3316
|
-
CommandItemBase,
|
|
3317
|
-
CommandListBase,
|
|
3318
|
-
CommandSeparatorBase,
|
|
3319
|
-
CommandShortcutBase,
|
|
3320
|
-
DateTimePicker,
|
|
3321
|
-
DialogBase,
|
|
3322
|
-
DialogCloseBase,
|
|
3323
|
-
DialogContentBase,
|
|
3324
|
-
DialogDescriptionBase,
|
|
3325
|
-
DialogFooterBase,
|
|
3326
|
-
DialogHeaderBase,
|
|
3327
|
-
DialogOverlayBase,
|
|
3328
|
-
DialogPortalBase,
|
|
3329
|
-
DialogTitleBase,
|
|
3330
|
-
DialogTriggerBase,
|
|
3331
|
-
DropDownMenuBase,
|
|
3332
|
-
DropDownMenuCheckboxItemBase,
|
|
3333
|
-
DropDownMenuContentBase,
|
|
3334
|
-
DropDownMenuGroupBase,
|
|
3335
|
-
DropDownMenuItemBase,
|
|
3336
|
-
DropDownMenuLabelBase,
|
|
3337
|
-
DropDownMenuPortalBase,
|
|
3338
|
-
DropDownMenuRadioGroupBase,
|
|
3339
|
-
DropDownMenuRadioItemBase,
|
|
3340
|
-
DropDownMenuSeparatorBase,
|
|
3341
|
-
DropDownMenuShortcutBase,
|
|
3342
|
-
DropDownMenuSubBase,
|
|
3343
|
-
DropDownMenuSubContentBase,
|
|
3344
|
-
DropDownMenuSubTriggerBase,
|
|
3345
|
-
DropDownMenuTriggerBase,
|
|
3346
|
-
InputBase,
|
|
3347
55
|
LabelBase_default as LabelBase,
|
|
3348
|
-
|
|
3349
|
-
MultiCombobox,
|
|
3350
|
-
PopoverAnchorBase,
|
|
3351
|
-
PopoverBase,
|
|
3352
|
-
PopoverContentBase,
|
|
3353
|
-
PopoverTriggerBase,
|
|
3354
|
-
ProgressBase,
|
|
3355
|
-
ProgressCirclesBase,
|
|
3356
|
-
ProgressPanelsBase,
|
|
3357
|
-
ProgressSegmentsBase,
|
|
3358
|
-
ScrollAreaBase,
|
|
3359
|
-
ScrollBarBase,
|
|
3360
|
-
Select,
|
|
3361
|
-
SelectBase,
|
|
3362
|
-
SelectContentBase,
|
|
3363
|
-
SelectGroupBase,
|
|
3364
|
-
SelectItemBase,
|
|
3365
|
-
SelectLabelBase,
|
|
3366
|
-
SelectScrollDownButtonBase,
|
|
3367
|
-
SelectScrollUpButtonBase,
|
|
3368
|
-
SelectSeparatorBase,
|
|
3369
|
-
SelectTriggerBase,
|
|
3370
|
-
SelectValueBase,
|
|
3371
|
-
SeparatorBase,
|
|
3372
|
-
SheetBase,
|
|
3373
|
-
SheetCloseBase,
|
|
3374
|
-
SheetContentBase,
|
|
3375
|
-
SheetDescriptionBase,
|
|
3376
|
-
SheetFooterBase,
|
|
3377
|
-
SheetHeaderBase,
|
|
3378
|
-
SheetOverlayBase,
|
|
3379
|
-
SheetPortalBase,
|
|
3380
|
-
SheetTitleBase,
|
|
3381
|
-
SheetTriggerBase,
|
|
3382
|
-
SidebarBase,
|
|
3383
|
-
SidebarContentBase,
|
|
3384
|
-
SidebarFooterBase,
|
|
3385
|
-
SidebarGroupActionBase,
|
|
3386
|
-
SidebarGroupBase,
|
|
3387
|
-
SidebarGroupContentBase,
|
|
3388
|
-
SidebarGroupLabelBase,
|
|
3389
|
-
SidebarHeaderBase,
|
|
3390
|
-
SidebarInputBase,
|
|
3391
|
-
SidebarInsetBase,
|
|
3392
|
-
SidebarMenuActionBase,
|
|
3393
|
-
SidebarMenuBadgeBase,
|
|
3394
|
-
SidebarMenuBase,
|
|
3395
|
-
SidebarMenuButtonBase,
|
|
3396
|
-
SidebarMenuItemBase,
|
|
3397
|
-
SidebarMenuSkeletonBase,
|
|
3398
|
-
SidebarMenuSubBase,
|
|
3399
|
-
SidebarMenuSubButtonBase,
|
|
3400
|
-
SidebarMenuSubItemBase,
|
|
3401
|
-
SidebarProviderBase,
|
|
3402
|
-
SidebarRailBase,
|
|
3403
|
-
SidebarSeparatorBase,
|
|
3404
|
-
SidebarTriggerBase,
|
|
3405
|
-
SkeletonBase,
|
|
3406
|
-
SlideBase,
|
|
3407
|
-
SwitchBase,
|
|
3408
|
-
TableBase,
|
|
3409
|
-
TableBodyBase,
|
|
3410
|
-
TableCaptionBase,
|
|
3411
|
-
TableCellBase,
|
|
3412
|
-
TableFooterBase,
|
|
3413
|
-
TableHeadBase,
|
|
3414
|
-
TableHeaderBase,
|
|
3415
|
-
TableRowBase,
|
|
3416
|
-
TabsBase,
|
|
3417
|
-
TabsContentBase,
|
|
3418
|
-
TabsListBase,
|
|
3419
|
-
TabsTriggerBase,
|
|
3420
|
-
TextAreaBase,
|
|
3421
|
-
ThemeProviderBase,
|
|
3422
|
-
TimePicker,
|
|
3423
|
-
TimePickerInput,
|
|
3424
|
-
Toaster,
|
|
3425
|
-
TooltipBase,
|
|
3426
|
-
TooltipContentBase,
|
|
3427
|
-
TooltipProviderBase,
|
|
3428
|
-
TooltipTriggerBase,
|
|
3429
|
-
UseSideBarBase,
|
|
3430
|
-
applyfilter,
|
|
3431
|
-
buildFilterSummary,
|
|
3432
|
-
buttonVariantsBase,
|
|
3433
|
-
defaultStringConditions,
|
|
3434
|
-
toast,
|
|
3435
|
-
useIsMobile,
|
|
3436
|
-
useTheme
|
|
56
|
+
useIsMobile
|
|
3437
57
|
};
|