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