@pos-360/horizon 0.30.2 → 0.31.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-EZL7UCWW.mjs → chunk-2GMOVXHC.mjs} +55 -55
- package/dist/chunk-2GMOVXHC.mjs.map +1 -0
- package/dist/{chunk-HFDHLY24.mjs → chunk-3CXBEGTO.mjs} +452 -151
- package/dist/chunk-3CXBEGTO.mjs.map +1 -0
- package/dist/{chunk-NTUQQDCL.js → chunk-D2BLWOWK.js} +55 -55
- package/dist/chunk-D2BLWOWK.js.map +1 -0
- package/dist/{chunk-ZYPPWLV6.js → chunk-HKUYZ5K6.js} +575 -273
- package/dist/chunk-HKUYZ5K6.js.map +1 -0
- package/dist/{chunk-3FXR4PA7.js → chunk-KKAQLA3Z.js} +83 -83
- package/dist/{chunk-3FXR4PA7.js.map → chunk-KKAQLA3Z.js.map} +1 -1
- package/dist/{chunk-FUSOMGHI.mjs → chunk-MOQF2VCC.mjs} +3 -3
- package/dist/{chunk-FUSOMGHI.mjs.map → chunk-MOQF2VCC.mjs.map} +1 -1
- package/dist/enhanced.js +32 -32
- package/dist/enhanced.mjs +2 -2
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +157 -153
- package/dist/index.mjs +3 -3
- package/dist/primitives.d.mts +38 -3
- package/dist/primitives.d.ts +38 -3
- package/dist/primitives.js +124 -120
- package/dist/primitives.mjs +2 -2
- package/package.json +1 -1
- package/dist/chunk-EZL7UCWW.mjs.map +0 -1
- package/dist/chunk-HFDHLY24.mjs.map +0 -1
- package/dist/chunk-NTUQQDCL.js.map +0 -1
- package/dist/chunk-ZYPPWLV6.js.map +0 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { cn, Label, Tooltip, Text, TextButton, mergeRefs } from './chunk-
|
|
2
|
-
import * as
|
|
1
|
+
import { cn, Label, Tooltip, Text, TextButton, mergeRefs } from './chunk-2GMOVXHC.mjs';
|
|
2
|
+
import * as React11 from 'react';
|
|
3
3
|
import { useState, useEffect, useCallback } from 'react';
|
|
4
4
|
import { Slot } from '@radix-ui/react-slot';
|
|
5
5
|
import { cva } from 'class-variance-authority';
|
|
@@ -42,7 +42,7 @@ var buttonVariants = cva(
|
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
44
|
);
|
|
45
|
-
var Button =
|
|
45
|
+
var Button = React11.forwardRef(
|
|
46
46
|
({
|
|
47
47
|
className,
|
|
48
48
|
variant,
|
|
@@ -82,7 +82,7 @@ var Button = React10.forwardRef(
|
|
|
82
82
|
}
|
|
83
83
|
);
|
|
84
84
|
Button.displayName = "Button";
|
|
85
|
-
var Card =
|
|
85
|
+
var Card = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
86
86
|
"div",
|
|
87
87
|
{
|
|
88
88
|
ref,
|
|
@@ -94,7 +94,7 @@ var Card = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
|
|
|
94
94
|
}
|
|
95
95
|
));
|
|
96
96
|
Card.displayName = "Card";
|
|
97
|
-
var CardHeader =
|
|
97
|
+
var CardHeader = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
98
98
|
"div",
|
|
99
99
|
{
|
|
100
100
|
ref,
|
|
@@ -103,7 +103,7 @@ var CardHeader = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
103
103
|
}
|
|
104
104
|
));
|
|
105
105
|
CardHeader.displayName = "CardHeader";
|
|
106
|
-
var CardTitle =
|
|
106
|
+
var CardTitle = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
107
107
|
"div",
|
|
108
108
|
{
|
|
109
109
|
ref,
|
|
@@ -112,7 +112,7 @@ var CardTitle = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE_
|
|
|
112
112
|
}
|
|
113
113
|
));
|
|
114
114
|
CardTitle.displayName = "CardTitle";
|
|
115
|
-
var CardDescription =
|
|
115
|
+
var CardDescription = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
116
116
|
"div",
|
|
117
117
|
{
|
|
118
118
|
ref,
|
|
@@ -121,7 +121,7 @@ var CardDescription = React10.forwardRef(({ className, ...props }, ref) => /* @_
|
|
|
121
121
|
}
|
|
122
122
|
));
|
|
123
123
|
CardDescription.displayName = "CardDescription";
|
|
124
|
-
var CardContent =
|
|
124
|
+
var CardContent = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
125
125
|
"div",
|
|
126
126
|
{
|
|
127
127
|
ref,
|
|
@@ -130,7 +130,7 @@ var CardContent = React10.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
130
130
|
}
|
|
131
131
|
));
|
|
132
132
|
CardContent.displayName = "CardContent";
|
|
133
|
-
var CardFooter =
|
|
133
|
+
var CardFooter = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
134
134
|
"div",
|
|
135
135
|
{
|
|
136
136
|
ref,
|
|
@@ -139,7 +139,7 @@ var CardFooter = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE
|
|
|
139
139
|
}
|
|
140
140
|
));
|
|
141
141
|
CardFooter.displayName = "CardFooter";
|
|
142
|
-
var Checkbox =
|
|
142
|
+
var Checkbox = React11.forwardRef(({ className, indicatorIcon, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
143
143
|
CheckboxPrimitive.Root,
|
|
144
144
|
{
|
|
145
145
|
ref,
|
|
@@ -162,7 +162,7 @@ var Dialog = DialogPrimitive.Root;
|
|
|
162
162
|
var DialogTrigger = DialogPrimitive.Trigger;
|
|
163
163
|
var DialogPortal = DialogPrimitive.Portal;
|
|
164
164
|
var DialogClose = DialogPrimitive.Close;
|
|
165
|
-
var DialogOverlay =
|
|
165
|
+
var DialogOverlay = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
166
166
|
DialogPrimitive.Overlay,
|
|
167
167
|
{
|
|
168
168
|
ref,
|
|
@@ -174,7 +174,7 @@ var DialogOverlay = React10.forwardRef(({ className, ...props }, ref) => /* @__P
|
|
|
174
174
|
}
|
|
175
175
|
));
|
|
176
176
|
DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
|
|
177
|
-
var DialogContent =
|
|
177
|
+
var DialogContent = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(DialogPortal, { children: [
|
|
178
178
|
/* @__PURE__ */ jsx(DialogOverlay, {}),
|
|
179
179
|
/* @__PURE__ */ jsxs(
|
|
180
180
|
DialogPrimitive.Content,
|
|
@@ -224,7 +224,7 @@ var DialogFooter = ({
|
|
|
224
224
|
}
|
|
225
225
|
);
|
|
226
226
|
DialogFooter.displayName = "DialogFooter";
|
|
227
|
-
var DialogTitle =
|
|
227
|
+
var DialogTitle = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
228
228
|
DialogPrimitive.Title,
|
|
229
229
|
{
|
|
230
230
|
ref,
|
|
@@ -236,7 +236,7 @@ var DialogTitle = React10.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
236
236
|
}
|
|
237
237
|
));
|
|
238
238
|
DialogTitle.displayName = DialogPrimitive.Title.displayName;
|
|
239
|
-
var DialogDescription =
|
|
239
|
+
var DialogDescription = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
240
240
|
DialogPrimitive.Description,
|
|
241
241
|
{
|
|
242
242
|
ref,
|
|
@@ -251,7 +251,7 @@ var DropdownMenuGroup = DropdownMenuPrimitive.Group;
|
|
|
251
251
|
var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
|
|
252
252
|
var DropdownMenuSub = DropdownMenuPrimitive.Sub;
|
|
253
253
|
var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
|
|
254
|
-
var DropdownMenuSubTrigger =
|
|
254
|
+
var DropdownMenuSubTrigger = React11.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
255
255
|
DropdownMenuPrimitive.SubTrigger,
|
|
256
256
|
{
|
|
257
257
|
ref,
|
|
@@ -268,7 +268,7 @@ var DropdownMenuSubTrigger = React10.forwardRef(({ className, inset, children, .
|
|
|
268
268
|
}
|
|
269
269
|
));
|
|
270
270
|
DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
|
|
271
|
-
var DropdownMenuSubContent =
|
|
271
|
+
var DropdownMenuSubContent = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
272
272
|
DropdownMenuPrimitive.SubContent,
|
|
273
273
|
{
|
|
274
274
|
ref,
|
|
@@ -280,7 +280,7 @@ var DropdownMenuSubContent = React10.forwardRef(({ className, ...props }, ref) =
|
|
|
280
280
|
}
|
|
281
281
|
));
|
|
282
282
|
DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
|
|
283
|
-
var DropdownMenuContent =
|
|
283
|
+
var DropdownMenuContent = React11.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(
|
|
284
284
|
DropdownMenuPrimitive.Content,
|
|
285
285
|
{
|
|
286
286
|
ref,
|
|
@@ -294,7 +294,7 @@ var DropdownMenuContent = React10.forwardRef(({ className, sideOffset = 4, ...pr
|
|
|
294
294
|
}
|
|
295
295
|
) }));
|
|
296
296
|
DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
|
|
297
|
-
var DropdownMenuItem =
|
|
297
|
+
var DropdownMenuItem = React11.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
298
298
|
DropdownMenuPrimitive.Item,
|
|
299
299
|
{
|
|
300
300
|
ref,
|
|
@@ -307,7 +307,7 @@ var DropdownMenuItem = React10.forwardRef(({ className, inset, ...props }, ref)
|
|
|
307
307
|
}
|
|
308
308
|
));
|
|
309
309
|
DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
|
|
310
|
-
var DropdownMenuCheckboxItem =
|
|
310
|
+
var DropdownMenuCheckboxItem = React11.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
311
311
|
DropdownMenuPrimitive.CheckboxItem,
|
|
312
312
|
{
|
|
313
313
|
ref,
|
|
@@ -324,7 +324,7 @@ var DropdownMenuCheckboxItem = React10.forwardRef(({ className, children, checke
|
|
|
324
324
|
}
|
|
325
325
|
));
|
|
326
326
|
DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
|
|
327
|
-
var DropdownMenuRadioItem =
|
|
327
|
+
var DropdownMenuRadioItem = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
328
328
|
DropdownMenuPrimitive.RadioItem,
|
|
329
329
|
{
|
|
330
330
|
ref,
|
|
@@ -340,7 +340,7 @@ var DropdownMenuRadioItem = React10.forwardRef(({ className, children, ...props
|
|
|
340
340
|
}
|
|
341
341
|
));
|
|
342
342
|
DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
|
|
343
|
-
var DropdownMenuLabel =
|
|
343
|
+
var DropdownMenuLabel = React11.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
344
344
|
DropdownMenuPrimitive.Label,
|
|
345
345
|
{
|
|
346
346
|
ref,
|
|
@@ -353,7 +353,7 @@ var DropdownMenuLabel = React10.forwardRef(({ className, inset, ...props }, ref)
|
|
|
353
353
|
}
|
|
354
354
|
));
|
|
355
355
|
DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
|
|
356
|
-
var DropdownMenuSeparator =
|
|
356
|
+
var DropdownMenuSeparator = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
357
357
|
DropdownMenuPrimitive.Separator,
|
|
358
358
|
{
|
|
359
359
|
ref,
|
|
@@ -375,19 +375,19 @@ var DropdownMenuShortcut = ({
|
|
|
375
375
|
);
|
|
376
376
|
};
|
|
377
377
|
DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
|
|
378
|
-
var FormContext =
|
|
378
|
+
var FormContext = React11.createContext(null);
|
|
379
379
|
function useFormContext() {
|
|
380
|
-
const context =
|
|
380
|
+
const context = React11.useContext(FormContext);
|
|
381
381
|
if (!context) {
|
|
382
382
|
throw new Error("useFormContext must be used within a Form component");
|
|
383
383
|
}
|
|
384
384
|
return context;
|
|
385
385
|
}
|
|
386
|
-
var FormFieldContext =
|
|
386
|
+
var FormFieldContext = React11.createContext(
|
|
387
387
|
null
|
|
388
388
|
);
|
|
389
389
|
function useFormFieldContext() {
|
|
390
|
-
const context =
|
|
390
|
+
const context = React11.useContext(FormFieldContext);
|
|
391
391
|
if (!context) {
|
|
392
392
|
throw new Error(
|
|
393
393
|
"useFormFieldContext must be used within a FormField component"
|
|
@@ -395,24 +395,24 @@ function useFormFieldContext() {
|
|
|
395
395
|
}
|
|
396
396
|
return context;
|
|
397
397
|
}
|
|
398
|
-
var Form =
|
|
398
|
+
var Form = React11.forwardRef(
|
|
399
399
|
({ className, children, onFormSubmit, ...props }, ref) => {
|
|
400
|
-
const [errors, setErrors] =
|
|
401
|
-
const [isSubmitting, setIsSubmitting] =
|
|
402
|
-
const setError =
|
|
400
|
+
const [errors, setErrors] = React11.useState({});
|
|
401
|
+
const [isSubmitting, setIsSubmitting] = React11.useState(false);
|
|
402
|
+
const setError = React11.useCallback(
|
|
403
403
|
(name, message) => {
|
|
404
404
|
setErrors((prev) => ({ ...prev, [name]: message }));
|
|
405
405
|
},
|
|
406
406
|
[]
|
|
407
407
|
);
|
|
408
|
-
const clearError =
|
|
408
|
+
const clearError = React11.useCallback((name) => {
|
|
409
409
|
setErrors((prev) => {
|
|
410
410
|
const next = { ...prev };
|
|
411
411
|
delete next[name];
|
|
412
412
|
return next;
|
|
413
413
|
});
|
|
414
414
|
}, []);
|
|
415
|
-
const clearAllErrors =
|
|
415
|
+
const clearAllErrors = React11.useCallback(() => {
|
|
416
416
|
setErrors({});
|
|
417
417
|
}, []);
|
|
418
418
|
const isValid = Object.keys(errors).length === 0;
|
|
@@ -431,7 +431,7 @@ var Form = React10.forwardRef(
|
|
|
431
431
|
}
|
|
432
432
|
}
|
|
433
433
|
};
|
|
434
|
-
const contextValue =
|
|
434
|
+
const contextValue = React11.useMemo(
|
|
435
435
|
() => ({
|
|
436
436
|
errors,
|
|
437
437
|
setError,
|
|
@@ -455,12 +455,12 @@ var Form = React10.forwardRef(
|
|
|
455
455
|
}
|
|
456
456
|
);
|
|
457
457
|
Form.displayName = "Form";
|
|
458
|
-
var FormField =
|
|
458
|
+
var FormField = React11.forwardRef(
|
|
459
459
|
({ className, name, children, ...props }, ref) => {
|
|
460
460
|
const { errors } = useFormContext();
|
|
461
|
-
const id =
|
|
461
|
+
const id = React11.useId();
|
|
462
462
|
const error = errors[name];
|
|
463
|
-
const contextValue =
|
|
463
|
+
const contextValue = React11.useMemo(
|
|
464
464
|
() => ({ name, error, id }),
|
|
465
465
|
[name, error, id]
|
|
466
466
|
);
|
|
@@ -468,7 +468,7 @@ var FormField = React10.forwardRef(
|
|
|
468
468
|
}
|
|
469
469
|
);
|
|
470
470
|
FormField.displayName = "FormField";
|
|
471
|
-
var FormLabel =
|
|
471
|
+
var FormLabel = React11.forwardRef(({ className, ...props }, ref) => {
|
|
472
472
|
const { id, error } = useFormFieldContext();
|
|
473
473
|
return /* @__PURE__ */ jsx(
|
|
474
474
|
Label,
|
|
@@ -481,10 +481,10 @@ var FormLabel = React10.forwardRef(({ className, ...props }, ref) => {
|
|
|
481
481
|
);
|
|
482
482
|
});
|
|
483
483
|
FormLabel.displayName = "FormLabel";
|
|
484
|
-
var FormControl =
|
|
484
|
+
var FormControl = React11.forwardRef(
|
|
485
485
|
({ children, ...props }, ref) => {
|
|
486
486
|
const { id, error, name } = useFormFieldContext();
|
|
487
|
-
const child =
|
|
487
|
+
const child = React11.cloneElement(children, {
|
|
488
488
|
id,
|
|
489
489
|
name,
|
|
490
490
|
"aria-invalid": !!error,
|
|
@@ -495,7 +495,7 @@ var FormControl = React10.forwardRef(
|
|
|
495
495
|
}
|
|
496
496
|
);
|
|
497
497
|
FormControl.displayName = "FormControl";
|
|
498
|
-
var FormDescription =
|
|
498
|
+
var FormDescription = React11.forwardRef(
|
|
499
499
|
({ className, ...props }, ref) => {
|
|
500
500
|
return /* @__PURE__ */ jsx(
|
|
501
501
|
"span",
|
|
@@ -511,9 +511,9 @@ var FormDescription = React10.forwardRef(
|
|
|
511
511
|
}
|
|
512
512
|
);
|
|
513
513
|
FormDescription.displayName = "FormDescription";
|
|
514
|
-
var FormMessage =
|
|
514
|
+
var FormMessage = React11.forwardRef(
|
|
515
515
|
({ className, children, error: errorProp, ...props }, ref) => {
|
|
516
|
-
const fieldContext =
|
|
516
|
+
const fieldContext = React11.useContext(FormFieldContext);
|
|
517
517
|
const error = errorProp ?? fieldContext?.error;
|
|
518
518
|
const id = fieldContext?.id;
|
|
519
519
|
if (!error && !children) {
|
|
@@ -537,14 +537,14 @@ var FormMessage = React10.forwardRef(
|
|
|
537
537
|
}
|
|
538
538
|
);
|
|
539
539
|
FormMessage.displayName = "FormMessage";
|
|
540
|
-
var PopoverContext =
|
|
540
|
+
var PopoverContext = React11.createContext({ open: false });
|
|
541
541
|
var Popover = ({
|
|
542
542
|
children,
|
|
543
543
|
open: controlledOpen,
|
|
544
544
|
onOpenChange,
|
|
545
545
|
...props
|
|
546
546
|
}) => {
|
|
547
|
-
const [uncontrolledOpen, setUncontrolledOpen] =
|
|
547
|
+
const [uncontrolledOpen, setUncontrolledOpen] = React11.useState(false);
|
|
548
548
|
const isControlled = controlledOpen !== void 0;
|
|
549
549
|
const open = isControlled ? controlledOpen : uncontrolledOpen;
|
|
550
550
|
const handleOpenChange = (newOpen) => {
|
|
@@ -565,8 +565,8 @@ var Popover = ({
|
|
|
565
565
|
};
|
|
566
566
|
var PopoverTrigger = PopoverPrimitive.Trigger;
|
|
567
567
|
var PopoverAnchor = PopoverPrimitive.Anchor;
|
|
568
|
-
var PopoverContent =
|
|
569
|
-
const { open } =
|
|
568
|
+
var PopoverContent = React11.forwardRef(({ className, align = "center", sideOffset = 4, children, ...props }, ref) => {
|
|
569
|
+
const { open } = React11.useContext(PopoverContext);
|
|
570
570
|
const {
|
|
571
571
|
onOpenAutoFocus,
|
|
572
572
|
onCloseAutoFocus,
|
|
@@ -626,15 +626,15 @@ var PopoverContent = React10.forwardRef(({ className, align = "center", sideOffs
|
|
|
626
626
|
) }) });
|
|
627
627
|
});
|
|
628
628
|
PopoverContent.displayName = PopoverPrimitive.Content.displayName;
|
|
629
|
-
var SelectContext =
|
|
630
|
-
var SelectSearchContext =
|
|
629
|
+
var SelectContext = React11.createContext({ open: false });
|
|
630
|
+
var SelectSearchContext = React11.createContext("");
|
|
631
631
|
var Select = ({
|
|
632
632
|
children,
|
|
633
633
|
open: controlledOpen,
|
|
634
634
|
onOpenChange,
|
|
635
635
|
...props
|
|
636
636
|
}) => {
|
|
637
|
-
const [uncontrolledOpen, setUncontrolledOpen] =
|
|
637
|
+
const [uncontrolledOpen, setUncontrolledOpen] = React11.useState(false);
|
|
638
638
|
const isControlled = controlledOpen !== void 0;
|
|
639
639
|
const open = isControlled ? controlledOpen : uncontrolledOpen;
|
|
640
640
|
const handleOpenChange = (newOpen) => {
|
|
@@ -654,9 +654,9 @@ var Select = ({
|
|
|
654
654
|
) });
|
|
655
655
|
};
|
|
656
656
|
var SelectGroup = SelectPrimitive.Group;
|
|
657
|
-
var SelectValue =
|
|
657
|
+
var SelectValue = React11.forwardRef(({ children, placeholder, ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Value, { ref, placeholder, ...props, children }));
|
|
658
658
|
SelectValue.displayName = SelectPrimitive.Value.displayName;
|
|
659
|
-
var SelectTrigger =
|
|
659
|
+
var SelectTrigger = React11.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
|
|
660
660
|
SelectPrimitive.Trigger,
|
|
661
661
|
{
|
|
662
662
|
ref,
|
|
@@ -672,7 +672,7 @@ var SelectTrigger = React10.forwardRef(({ className, children, ...props }, ref)
|
|
|
672
672
|
}
|
|
673
673
|
));
|
|
674
674
|
SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
|
|
675
|
-
var SelectScrollUpButton =
|
|
675
|
+
var SelectScrollUpButton = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
676
676
|
SelectPrimitive.ScrollUpButton,
|
|
677
677
|
{
|
|
678
678
|
ref,
|
|
@@ -685,7 +685,7 @@ var SelectScrollUpButton = React10.forwardRef(({ className, ...props }, ref) =>
|
|
|
685
685
|
}
|
|
686
686
|
));
|
|
687
687
|
SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
|
|
688
|
-
var SelectScrollDownButton =
|
|
688
|
+
var SelectScrollDownButton = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
689
689
|
SelectPrimitive.ScrollDownButton,
|
|
690
690
|
{
|
|
691
691
|
ref,
|
|
@@ -698,11 +698,11 @@ var SelectScrollDownButton = React10.forwardRef(({ className, ...props }, ref) =
|
|
|
698
698
|
}
|
|
699
699
|
));
|
|
700
700
|
SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
|
|
701
|
-
var SelectContent =
|
|
702
|
-
const { open } =
|
|
703
|
-
const [search, setSearch] =
|
|
704
|
-
const searchInputRef =
|
|
705
|
-
|
|
701
|
+
var SelectContent = React11.forwardRef(({ className, children, position = "popper", searchable = false, searchPlaceholder = "Search...", ...props }, ref) => {
|
|
702
|
+
const { open } = React11.useContext(SelectContext);
|
|
703
|
+
const [search, setSearch] = React11.useState("");
|
|
704
|
+
const searchInputRef = React11.useRef(null);
|
|
705
|
+
React11.useEffect(() => {
|
|
706
706
|
if (open && searchable) {
|
|
707
707
|
const frame = requestAnimationFrame(() => {
|
|
708
708
|
searchInputRef.current?.focus();
|
|
@@ -728,7 +728,7 @@ var SelectContent = React10.forwardRef(({ className, children, position = "poppe
|
|
|
728
728
|
} = props;
|
|
729
729
|
const ForceMountPortal = SelectPrimitive.Portal;
|
|
730
730
|
const ForceMountContent = SelectPrimitive.Content;
|
|
731
|
-
const AnimatedContent =
|
|
731
|
+
const AnimatedContent = React11.useMemo(() => React11.forwardRef(({ forceMount: _, ...props2 }, ref2) => /* @__PURE__ */ jsx(motion.div, { ref: ref2, ...props2 })), []);
|
|
732
732
|
return /* @__PURE__ */ jsx(ForceMountPortal, { forceMount: true, children: /* @__PURE__ */ jsx(
|
|
733
733
|
ForceMountContent,
|
|
734
734
|
{
|
|
@@ -801,7 +801,7 @@ var SelectContent = React10.forwardRef(({ className, children, position = "poppe
|
|
|
801
801
|
) });
|
|
802
802
|
});
|
|
803
803
|
SelectContent.displayName = SelectPrimitive.Content.displayName;
|
|
804
|
-
var SelectLabel =
|
|
804
|
+
var SelectLabel = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
805
805
|
SelectPrimitive.Label,
|
|
806
806
|
{
|
|
807
807
|
ref,
|
|
@@ -810,8 +810,8 @@ var SelectLabel = React10.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
810
810
|
}
|
|
811
811
|
));
|
|
812
812
|
SelectLabel.displayName = SelectPrimitive.Label.displayName;
|
|
813
|
-
var SelectItem =
|
|
814
|
-
const search =
|
|
813
|
+
var SelectItem = React11.forwardRef(({ className, children, textValue, ...props }, ref) => {
|
|
814
|
+
const search = React11.useContext(SelectSearchContext);
|
|
815
815
|
const itemText = textValue ?? (typeof children === "string" ? children : "");
|
|
816
816
|
if (search && itemText && !itemText.toLowerCase().includes(search.toLowerCase())) {
|
|
817
817
|
return null;
|
|
@@ -834,7 +834,7 @@ var SelectItem = React10.forwardRef(({ className, children, textValue, ...props
|
|
|
834
834
|
);
|
|
835
835
|
});
|
|
836
836
|
SelectItem.displayName = SelectPrimitive.Item.displayName;
|
|
837
|
-
var SelectSeparator =
|
|
837
|
+
var SelectSeparator = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
838
838
|
SelectPrimitive.Separator,
|
|
839
839
|
{
|
|
840
840
|
ref,
|
|
@@ -843,6 +843,307 @@ var SelectSeparator = React10.forwardRef(({ className, ...props }, ref) => /* @_
|
|
|
843
843
|
}
|
|
844
844
|
));
|
|
845
845
|
SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
|
|
846
|
+
var SelectBar = React11.forwardRef(({
|
|
847
|
+
options,
|
|
848
|
+
value,
|
|
849
|
+
onChange,
|
|
850
|
+
multiple = false,
|
|
851
|
+
multiValue,
|
|
852
|
+
onMultiChange,
|
|
853
|
+
manualApply = false,
|
|
854
|
+
searchable = false,
|
|
855
|
+
searchPlaceholder = "Search...",
|
|
856
|
+
placeholder = "Select\u2026",
|
|
857
|
+
label,
|
|
858
|
+
disabled = false,
|
|
859
|
+
className,
|
|
860
|
+
maxVisibleChips = 2
|
|
861
|
+
}, ref) => {
|
|
862
|
+
const [open, setOpen] = React11.useState(false);
|
|
863
|
+
const [search, setSearch] = React11.useState("");
|
|
864
|
+
const searchRef = React11.useRef(null);
|
|
865
|
+
const [internalValue, setInternalValue] = React11.useState(
|
|
866
|
+
void 0
|
|
867
|
+
);
|
|
868
|
+
const [internalMultiValue, setInternalMultiValue] = React11.useState(
|
|
869
|
+
[]
|
|
870
|
+
);
|
|
871
|
+
const [draftValue, setDraftValue] = React11.useState(
|
|
872
|
+
void 0
|
|
873
|
+
);
|
|
874
|
+
const [draftMultiValue, setDraftMultiValue] = React11.useState([]);
|
|
875
|
+
const committedSingle = value !== void 0 ? value : internalValue;
|
|
876
|
+
const committedMulti = multiValue !== void 0 ? multiValue : internalMultiValue;
|
|
877
|
+
const activeSingle = manualApply ? draftValue : committedSingle;
|
|
878
|
+
const activeMulti = manualApply ? draftMultiValue : committedMulti;
|
|
879
|
+
const commitSingle = React11.useCallback(
|
|
880
|
+
(v) => {
|
|
881
|
+
if (value === void 0) setInternalValue(v);
|
|
882
|
+
onChange?.(v);
|
|
883
|
+
},
|
|
884
|
+
[value, onChange]
|
|
885
|
+
);
|
|
886
|
+
const commitMulti = React11.useCallback(
|
|
887
|
+
(v) => {
|
|
888
|
+
if (multiValue === void 0) setInternalMultiValue(v);
|
|
889
|
+
onMultiChange?.(v);
|
|
890
|
+
},
|
|
891
|
+
[multiValue, onMultiChange]
|
|
892
|
+
);
|
|
893
|
+
const handleOpenChange = (newOpen) => {
|
|
894
|
+
if (newOpen) {
|
|
895
|
+
setDraftValue(committedSingle);
|
|
896
|
+
setDraftMultiValue(committedMulti);
|
|
897
|
+
setSearch("");
|
|
898
|
+
if (searchable) {
|
|
899
|
+
requestAnimationFrame(() => searchRef.current?.focus());
|
|
900
|
+
}
|
|
901
|
+
}
|
|
902
|
+
setOpen(newOpen);
|
|
903
|
+
};
|
|
904
|
+
const filtered = React11.useMemo(
|
|
905
|
+
() => search ? options.filter(
|
|
906
|
+
(o) => o.label.toLowerCase().includes(search.toLowerCase())
|
|
907
|
+
) : options,
|
|
908
|
+
[options, search]
|
|
909
|
+
);
|
|
910
|
+
const handleSingleSelect = (optionValue) => {
|
|
911
|
+
if (manualApply) {
|
|
912
|
+
setDraftValue(optionValue);
|
|
913
|
+
} else {
|
|
914
|
+
commitSingle(optionValue);
|
|
915
|
+
setOpen(false);
|
|
916
|
+
}
|
|
917
|
+
};
|
|
918
|
+
const handleMultiToggle = (optionValue) => {
|
|
919
|
+
const current = manualApply ? draftMultiValue : committedMulti;
|
|
920
|
+
const next = current.includes(optionValue) ? current.filter((v) => v !== optionValue) : [...current, optionValue];
|
|
921
|
+
if (manualApply) {
|
|
922
|
+
setDraftMultiValue(next);
|
|
923
|
+
} else {
|
|
924
|
+
commitMulti(next);
|
|
925
|
+
}
|
|
926
|
+
};
|
|
927
|
+
const handleApply = () => {
|
|
928
|
+
if (multiple) {
|
|
929
|
+
commitMulti(draftMultiValue);
|
|
930
|
+
} else {
|
|
931
|
+
commitSingle(draftValue);
|
|
932
|
+
}
|
|
933
|
+
setOpen(false);
|
|
934
|
+
};
|
|
935
|
+
const handleClear = () => {
|
|
936
|
+
if (manualApply) {
|
|
937
|
+
if (multiple) {
|
|
938
|
+
setDraftMultiValue([]);
|
|
939
|
+
} else {
|
|
940
|
+
setDraftValue(void 0);
|
|
941
|
+
}
|
|
942
|
+
} else {
|
|
943
|
+
if (multiple) {
|
|
944
|
+
commitMulti([]);
|
|
945
|
+
} else {
|
|
946
|
+
commitSingle(void 0);
|
|
947
|
+
}
|
|
948
|
+
setOpen(false);
|
|
949
|
+
}
|
|
950
|
+
};
|
|
951
|
+
const handleChipRemove = (e, chipValue) => {
|
|
952
|
+
e.stopPropagation();
|
|
953
|
+
const next = committedMulti.filter((v) => v !== chipValue);
|
|
954
|
+
commitMulti(next);
|
|
955
|
+
};
|
|
956
|
+
const canApply = (() => {
|
|
957
|
+
if (!manualApply) return false;
|
|
958
|
+
if (multiple) {
|
|
959
|
+
const a = [...draftMultiValue].sort();
|
|
960
|
+
const b = [...committedMulti].sort();
|
|
961
|
+
return JSON.stringify(a) !== JSON.stringify(b);
|
|
962
|
+
}
|
|
963
|
+
return draftValue !== committedSingle;
|
|
964
|
+
})();
|
|
965
|
+
const canClear = (() => {
|
|
966
|
+
if (manualApply) {
|
|
967
|
+
return multiple ? draftMultiValue.length > 0 : draftValue !== void 0;
|
|
968
|
+
}
|
|
969
|
+
return multiple ? committedMulti.length > 0 : committedSingle !== void 0;
|
|
970
|
+
})();
|
|
971
|
+
const labelFor = (v) => options.find((o) => o.value === v)?.label ?? v;
|
|
972
|
+
const renderTriggerContent = () => {
|
|
973
|
+
if (multiple) {
|
|
974
|
+
if (committedMulti.length === 0) {
|
|
975
|
+
return /* @__PURE__ */ jsx("span", { className: "text-gray-400 dark:text-gray-500 truncate", children: placeholder });
|
|
976
|
+
}
|
|
977
|
+
const visible = committedMulti.slice(0, maxVisibleChips);
|
|
978
|
+
const overflow = committedMulti.length - maxVisibleChips;
|
|
979
|
+
return /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 min-w-0 flex-wrap", children: [
|
|
980
|
+
visible.map((v) => /* @__PURE__ */ jsxs(
|
|
981
|
+
"span",
|
|
982
|
+
{
|
|
983
|
+
className: "inline-flex items-center gap-1 bg-blue-50 text-blue-700 border border-blue-200 dark:bg-blue-950/50 dark:text-blue-400 dark:border-blue-800/50 rounded-md px-2 py-0.5 text-xs font-medium max-w-[120px]",
|
|
984
|
+
children: [
|
|
985
|
+
/* @__PURE__ */ jsx("span", { className: "truncate", children: labelFor(v) }),
|
|
986
|
+
/* @__PURE__ */ jsx(
|
|
987
|
+
"button",
|
|
988
|
+
{
|
|
989
|
+
type: "button",
|
|
990
|
+
className: "shrink-0 hover:text-blue-900 dark:hover:text-blue-200",
|
|
991
|
+
onClick: (e) => handleChipRemove(e, v),
|
|
992
|
+
"aria-label": `Remove ${labelFor(v)}`,
|
|
993
|
+
children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" })
|
|
994
|
+
}
|
|
995
|
+
)
|
|
996
|
+
]
|
|
997
|
+
},
|
|
998
|
+
v
|
|
999
|
+
)),
|
|
1000
|
+
overflow > 0 && /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center bg-blue-50 text-blue-700 border border-blue-200 dark:bg-blue-950/50 dark:text-blue-400 dark:border-blue-800/50 rounded-md px-2 py-0.5 text-xs font-medium", children: [
|
|
1001
|
+
"+",
|
|
1002
|
+
overflow,
|
|
1003
|
+
" more"
|
|
1004
|
+
] })
|
|
1005
|
+
] });
|
|
1006
|
+
}
|
|
1007
|
+
if (committedSingle !== void 0) {
|
|
1008
|
+
return /* @__PURE__ */ jsx("span", { className: "truncate text-gray-900 dark:text-gray-100", children: labelFor(committedSingle) });
|
|
1009
|
+
}
|
|
1010
|
+
return /* @__PURE__ */ jsx("span", { className: "text-gray-400 dark:text-gray-500 truncate", children: placeholder });
|
|
1011
|
+
};
|
|
1012
|
+
return /* @__PURE__ */ jsxs("div", { className: cn("space-y-1.5", className), children: [
|
|
1013
|
+
label && /* @__PURE__ */ jsx(Label, { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: label }),
|
|
1014
|
+
/* @__PURE__ */ jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
|
|
1015
|
+
/* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
|
|
1016
|
+
"button",
|
|
1017
|
+
{
|
|
1018
|
+
ref,
|
|
1019
|
+
type: "button",
|
|
1020
|
+
disabled,
|
|
1021
|
+
className: cn(
|
|
1022
|
+
"flex h-[42px] min-h-[42px] w-full items-center justify-between gap-2 rounded-hz-md border border-gray-300 bg-white px-3 text-sm shadow-sm transition-colors",
|
|
1023
|
+
"hover:bg-gray-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
|
|
1024
|
+
"dark:border-neutral-600 dark:bg-neutral-800 dark:hover:bg-neutral-700",
|
|
1025
|
+
"disabled:pointer-events-none disabled:opacity-50"
|
|
1026
|
+
),
|
|
1027
|
+
children: [
|
|
1028
|
+
/* @__PURE__ */ jsx("span", { className: "flex-1 min-w-0 flex items-center", children: renderTriggerContent() }),
|
|
1029
|
+
/* @__PURE__ */ jsx(ChevronDown, { className: "h-4 w-4 shrink-0 opacity-50" })
|
|
1030
|
+
]
|
|
1031
|
+
}
|
|
1032
|
+
) }),
|
|
1033
|
+
/* @__PURE__ */ jsxs(
|
|
1034
|
+
PopoverContent,
|
|
1035
|
+
{
|
|
1036
|
+
align: "start",
|
|
1037
|
+
className: "w-[var(--radix-popover-trigger-width)] min-w-[200px] p-0 overflow-hidden",
|
|
1038
|
+
children: [
|
|
1039
|
+
searchable && /* @__PURE__ */ jsxs("div", { className: "flex items-center border-b border-neutral-200/50 dark:border-neutral-700/50", children: [
|
|
1040
|
+
/* @__PURE__ */ jsx(Search, { className: "mr-2 h-6 w-6 shrink-0 opacity-50 pl-2" }),
|
|
1041
|
+
/* @__PURE__ */ jsx(
|
|
1042
|
+
"input",
|
|
1043
|
+
{
|
|
1044
|
+
ref: searchRef,
|
|
1045
|
+
value: search,
|
|
1046
|
+
onChange: (e) => setSearch(e.target.value),
|
|
1047
|
+
placeholder: searchPlaceholder,
|
|
1048
|
+
onKeyDown: (e) => e.stopPropagation(),
|
|
1049
|
+
className: "flex h-10 w-full py-2 bg-transparent text-sm placeholder:text-neutral-400 dark:placeholder:text-neutral-500 px-2 focus-visible:ring-0 focus-visible:ring-offset-0 focus-visible:outline-none"
|
|
1050
|
+
}
|
|
1051
|
+
)
|
|
1052
|
+
] }),
|
|
1053
|
+
/* @__PURE__ */ jsx("div", { className: "p-1 max-h-[240px] overflow-y-auto", children: filtered.length === 0 ? /* @__PURE__ */ jsx("p", { className: "px-2 py-4 text-center text-sm text-gray-400 dark:text-gray-500", children: "No results found." }) : filtered.map((option) => {
|
|
1054
|
+
if (multiple) {
|
|
1055
|
+
const checked = activeMulti.includes(option.value);
|
|
1056
|
+
return /* @__PURE__ */ jsxs(
|
|
1057
|
+
"button",
|
|
1058
|
+
{
|
|
1059
|
+
type: "button",
|
|
1060
|
+
disabled: option.disabled,
|
|
1061
|
+
onClick: () => handleMultiToggle(option.value),
|
|
1062
|
+
className: cn(
|
|
1063
|
+
"relative flex w-full cursor-default select-none items-center gap-2 rounded-hz-md py-1.5 px-2 text-sm outline-none transition-colors",
|
|
1064
|
+
"hover:bg-black/5 dark:hover:bg-white/10",
|
|
1065
|
+
option.disabled && "pointer-events-none opacity-50"
|
|
1066
|
+
),
|
|
1067
|
+
children: [
|
|
1068
|
+
/* @__PURE__ */ jsx(
|
|
1069
|
+
CheckboxPrimitive.Root,
|
|
1070
|
+
{
|
|
1071
|
+
checked,
|
|
1072
|
+
tabIndex: -1,
|
|
1073
|
+
className: cn(
|
|
1074
|
+
"peer h-4 w-4 shrink-0 rounded-hz-sm border border-gray-300 bg-transparent shadow focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-blue-600 data-[state=checked]:border-blue-600 data-[state=checked]:text-white dark:border-neutral-600 dark:data-[state=checked]:bg-blue-600"
|
|
1075
|
+
),
|
|
1076
|
+
style: { pointerEvents: "none" },
|
|
1077
|
+
children: /* @__PURE__ */ jsx(CheckboxPrimitive.Indicator, { className: "flex items-center justify-center text-current", children: /* @__PURE__ */ jsx(
|
|
1078
|
+
Check,
|
|
1079
|
+
{
|
|
1080
|
+
className: "h-3.5 w-3.5",
|
|
1081
|
+
strokeWidth: 3
|
|
1082
|
+
}
|
|
1083
|
+
) })
|
|
1084
|
+
}
|
|
1085
|
+
),
|
|
1086
|
+
/* @__PURE__ */ jsx("span", { className: "truncate", children: option.label })
|
|
1087
|
+
]
|
|
1088
|
+
},
|
|
1089
|
+
option.value
|
|
1090
|
+
);
|
|
1091
|
+
}
|
|
1092
|
+
const selected = activeSingle === option.value;
|
|
1093
|
+
return /* @__PURE__ */ jsxs(
|
|
1094
|
+
"button",
|
|
1095
|
+
{
|
|
1096
|
+
type: "button",
|
|
1097
|
+
disabled: option.disabled,
|
|
1098
|
+
onClick: () => handleSingleSelect(option.value),
|
|
1099
|
+
className: cn(
|
|
1100
|
+
"relative flex w-full cursor-default select-none items-center rounded-hz-md py-1.5 pl-2 pr-8 text-sm outline-none transition-colors",
|
|
1101
|
+
"hover:bg-black/5 dark:hover:bg-white/10",
|
|
1102
|
+
option.disabled && "pointer-events-none opacity-50"
|
|
1103
|
+
),
|
|
1104
|
+
children: [
|
|
1105
|
+
/* @__PURE__ */ jsx("span", { className: "truncate", children: option.label }),
|
|
1106
|
+
selected && /* @__PURE__ */ jsx("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx(Check, { className: "h-4 w-4" }) })
|
|
1107
|
+
]
|
|
1108
|
+
},
|
|
1109
|
+
option.value
|
|
1110
|
+
);
|
|
1111
|
+
}) }),
|
|
1112
|
+
manualApply && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-2 px-2 py-3 border-t border-gray-100 dark:border-neutral-700", children: [
|
|
1113
|
+
/* @__PURE__ */ jsx(
|
|
1114
|
+
"button",
|
|
1115
|
+
{
|
|
1116
|
+
type: "button",
|
|
1117
|
+
onClick: handleClear,
|
|
1118
|
+
disabled: !canClear,
|
|
1119
|
+
className: cn(
|
|
1120
|
+
"px-3 py-1.5 rounded-md text-sm transition-colors",
|
|
1121
|
+
canClear ? "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700" : "text-gray-300 dark:text-gray-600 cursor-not-allowed"
|
|
1122
|
+
),
|
|
1123
|
+
children: "Clear"
|
|
1124
|
+
}
|
|
1125
|
+
),
|
|
1126
|
+
/* @__PURE__ */ jsx(
|
|
1127
|
+
"button",
|
|
1128
|
+
{
|
|
1129
|
+
type: "button",
|
|
1130
|
+
onClick: handleApply,
|
|
1131
|
+
disabled: !canApply,
|
|
1132
|
+
className: cn(
|
|
1133
|
+
"px-3 py-1.5 rounded-md text-sm font-medium transition-colors",
|
|
1134
|
+
canApply ? "bg-blue-600 text-white hover:bg-blue-700 dark:hover:bg-blue-500" : "bg-blue-100 text-blue-300 cursor-not-allowed dark:bg-blue-950/30 dark:text-blue-800"
|
|
1135
|
+
),
|
|
1136
|
+
children: "Apply"
|
|
1137
|
+
}
|
|
1138
|
+
)
|
|
1139
|
+
] })
|
|
1140
|
+
]
|
|
1141
|
+
}
|
|
1142
|
+
)
|
|
1143
|
+
] })
|
|
1144
|
+
] });
|
|
1145
|
+
});
|
|
1146
|
+
SelectBar.displayName = "SelectBar";
|
|
846
1147
|
var separatorVariants = cva("shrink-0 bg-gray-200 dark:bg-neutral-700", {
|
|
847
1148
|
variants: {
|
|
848
1149
|
orientation: {
|
|
@@ -1023,8 +1324,8 @@ function SegmentedControl({
|
|
|
1023
1324
|
);
|
|
1024
1325
|
}
|
|
1025
1326
|
function BulkEditPopover({ column, onApply }) {
|
|
1026
|
-
const [value, setValue] =
|
|
1027
|
-
const [open, setOpen] =
|
|
1327
|
+
const [value, setValue] = React11.useState("");
|
|
1328
|
+
const [open, setOpen] = React11.useState(false);
|
|
1028
1329
|
const { bulkEdit } = column;
|
|
1029
1330
|
if (!bulkEdit) return null;
|
|
1030
1331
|
const isValid = bulkEdit.kind === "input" ? !!value.trim() : !!value;
|
|
@@ -1098,12 +1399,12 @@ function BulkEditPopover({ column, onApply }) {
|
|
|
1098
1399
|
] })
|
|
1099
1400
|
] }) }) });
|
|
1100
1401
|
}
|
|
1101
|
-
var TableContext =
|
|
1402
|
+
var TableContext = React11.createContext(null);
|
|
1102
1403
|
var useTableContext = () => {
|
|
1103
|
-
const context =
|
|
1404
|
+
const context = React11.useContext(TableContext);
|
|
1104
1405
|
return context;
|
|
1105
1406
|
};
|
|
1106
|
-
var TableInner =
|
|
1407
|
+
var TableInner = React11.forwardRef(
|
|
1107
1408
|
({
|
|
1108
1409
|
className,
|
|
1109
1410
|
selectionMode = "multiple",
|
|
@@ -1129,23 +1430,23 @@ var TableInner = React10.forwardRef(
|
|
|
1129
1430
|
}, ref) => {
|
|
1130
1431
|
const effectiveActionColumns = actionColumns ?? [];
|
|
1131
1432
|
const effectiveSelectable = effectiveActionColumns.includes("checkbox");
|
|
1132
|
-
const [internalSelectedRows, setInternalSelectedRows] =
|
|
1133
|
-
const [registeredRowIds, setRegisteredRowIds] =
|
|
1134
|
-
const wrapperRef =
|
|
1433
|
+
const [internalSelectedRows, setInternalSelectedRows] = React11.useState(/* @__PURE__ */ new Set());
|
|
1434
|
+
const [registeredRowIds, setRegisteredRowIds] = React11.useState(/* @__PURE__ */ new Set());
|
|
1435
|
+
const wrapperRef = React11.useRef(null);
|
|
1135
1436
|
const isControlled = controlledSelectedRows !== void 0;
|
|
1136
1437
|
const selectedRowsSet = isControlled ? new Set(controlledSelectedRows) : internalSelectedRows;
|
|
1137
|
-
const defaultGetRowId =
|
|
1438
|
+
const defaultGetRowId = React11.useCallback((row) => {
|
|
1138
1439
|
if (typeof row === "string") return row;
|
|
1139
1440
|
if (typeof row === "object" && row?.id) return String(row.id);
|
|
1140
1441
|
return String(row);
|
|
1141
1442
|
}, []);
|
|
1142
1443
|
const finalGetRowId = getRowId || defaultGetRowId;
|
|
1143
|
-
const allRowIds =
|
|
1444
|
+
const allRowIds = React11.useMemo(() => {
|
|
1144
1445
|
if (rows) return new Set(rows.map(finalGetRowId));
|
|
1145
1446
|
if (data) return new Set(data.map(finalGetRowId));
|
|
1146
1447
|
return registeredRowIds;
|
|
1147
1448
|
}, [rows, data, finalGetRowId, registeredRowIds]);
|
|
1148
|
-
const registerRowId =
|
|
1449
|
+
const registerRowId = React11.useCallback((rowId) => {
|
|
1149
1450
|
if (rowId) {
|
|
1150
1451
|
setRegisteredRowIds((prev) => {
|
|
1151
1452
|
if (prev.has(rowId)) return prev;
|
|
@@ -1153,7 +1454,7 @@ var TableInner = React10.forwardRef(
|
|
|
1153
1454
|
});
|
|
1154
1455
|
}
|
|
1155
1456
|
}, []);
|
|
1156
|
-
const unregisterRowId =
|
|
1457
|
+
const unregisterRowId = React11.useCallback((rowId) => {
|
|
1157
1458
|
if (rowId) {
|
|
1158
1459
|
setRegisteredRowIds((prev) => {
|
|
1159
1460
|
if (!prev.has(rowId)) return prev;
|
|
@@ -1163,7 +1464,7 @@ var TableInner = React10.forwardRef(
|
|
|
1163
1464
|
});
|
|
1164
1465
|
}
|
|
1165
1466
|
}, []);
|
|
1166
|
-
const toggleRow =
|
|
1467
|
+
const toggleRow = React11.useCallback(
|
|
1167
1468
|
(rowId) => {
|
|
1168
1469
|
if (!effectiveSelectable) return;
|
|
1169
1470
|
const next = new Set(selectedRowsSet);
|
|
@@ -1188,7 +1489,7 @@ var TableInner = React10.forwardRef(
|
|
|
1188
1489
|
},
|
|
1189
1490
|
[effectiveSelectable, selectionMode, selectedRowsSet, isControlled, onSelectionChange]
|
|
1190
1491
|
);
|
|
1191
|
-
const selectAll =
|
|
1492
|
+
const selectAll = React11.useCallback(() => {
|
|
1192
1493
|
if (!effectiveSelectable || selectionMode !== "multiple" || allRowIds.size === 0) return;
|
|
1193
1494
|
const next = new Set(allRowIds);
|
|
1194
1495
|
if (isControlled) {
|
|
@@ -1198,7 +1499,7 @@ var TableInner = React10.forwardRef(
|
|
|
1198
1499
|
onSelectionChange?.(Array.from(next));
|
|
1199
1500
|
}
|
|
1200
1501
|
}, [effectiveSelectable, selectionMode, allRowIds, isControlled, onSelectionChange]);
|
|
1201
|
-
const deselectAll =
|
|
1502
|
+
const deselectAll = React11.useCallback(() => {
|
|
1202
1503
|
if (!effectiveSelectable) return;
|
|
1203
1504
|
const next = /* @__PURE__ */ new Set();
|
|
1204
1505
|
if (isControlled) {
|
|
@@ -1208,19 +1509,19 @@ var TableInner = React10.forwardRef(
|
|
|
1208
1509
|
onSelectionChange?.(Array.from(next));
|
|
1209
1510
|
}
|
|
1210
1511
|
}, [effectiveSelectable, isControlled, onSelectionChange]);
|
|
1211
|
-
const isRowSelected =
|
|
1512
|
+
const isRowSelected = React11.useCallback(
|
|
1212
1513
|
(rowId) => selectedRowsSet.has(rowId),
|
|
1213
1514
|
[selectedRowsSet]
|
|
1214
1515
|
);
|
|
1215
|
-
const isAllSelected =
|
|
1516
|
+
const isAllSelected = React11.useMemo(() => {
|
|
1216
1517
|
if (!effectiveSelectable || allRowIds.size === 0) return false;
|
|
1217
1518
|
return allRowIds.size > 0 && Array.from(allRowIds).every((id) => selectedRowsSet.has(id));
|
|
1218
1519
|
}, [effectiveSelectable, allRowIds, selectedRowsSet]);
|
|
1219
|
-
const isSomeSelected =
|
|
1520
|
+
const isSomeSelected = React11.useMemo(() => {
|
|
1220
1521
|
if (!effectiveSelectable) return false;
|
|
1221
1522
|
return selectedRowsSet.size > 0 && !isAllSelected;
|
|
1222
1523
|
}, [effectiveSelectable, selectedRowsSet.size, isAllSelected]);
|
|
1223
|
-
const contextValue =
|
|
1524
|
+
const contextValue = React11.useMemo(() => ({
|
|
1224
1525
|
selectable: effectiveSelectable,
|
|
1225
1526
|
selectionMode,
|
|
1226
1527
|
selectedRows: selectedRowsSet,
|
|
@@ -1249,7 +1550,7 @@ var TableInner = React10.forwardRef(
|
|
|
1249
1550
|
unregisterRowId,
|
|
1250
1551
|
stickyYHeader
|
|
1251
1552
|
]);
|
|
1252
|
-
|
|
1553
|
+
React11.useEffect(() => {
|
|
1253
1554
|
const wrapper = wrapperRef.current;
|
|
1254
1555
|
if (!wrapper || highlightMode === "none") return;
|
|
1255
1556
|
let prevCell = null;
|
|
@@ -1436,7 +1737,7 @@ var TableInner = React10.forwardRef(
|
|
|
1436
1737
|
);
|
|
1437
1738
|
TableInner.displayName = "Table";
|
|
1438
1739
|
var Table = TableInner;
|
|
1439
|
-
var TableHeader =
|
|
1740
|
+
var TableHeader = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1440
1741
|
"thead",
|
|
1441
1742
|
{
|
|
1442
1743
|
ref,
|
|
@@ -1445,7 +1746,7 @@ var TableHeader = React10.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
1445
1746
|
}
|
|
1446
1747
|
));
|
|
1447
1748
|
TableHeader.displayName = "TableHeader";
|
|
1448
|
-
var TableBody =
|
|
1749
|
+
var TableBody = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1449
1750
|
"tbody",
|
|
1450
1751
|
{
|
|
1451
1752
|
ref,
|
|
@@ -1454,7 +1755,7 @@ var TableBody = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE_
|
|
|
1454
1755
|
}
|
|
1455
1756
|
));
|
|
1456
1757
|
TableBody.displayName = "TableBody";
|
|
1457
|
-
var TableFooter =
|
|
1758
|
+
var TableFooter = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1458
1759
|
"tfoot",
|
|
1459
1760
|
{
|
|
1460
1761
|
ref,
|
|
@@ -1466,19 +1767,19 @@ var TableFooter = React10.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
1466
1767
|
}
|
|
1467
1768
|
));
|
|
1468
1769
|
TableFooter.displayName = "TableFooter";
|
|
1469
|
-
var TableRow =
|
|
1770
|
+
var TableRow = React11.forwardRef(
|
|
1470
1771
|
({ className, rowId, rowData, onClick, ...props }, ref) => {
|
|
1471
1772
|
const context = useTableContext();
|
|
1472
1773
|
const getRowId = context?.getRowId;
|
|
1473
1774
|
const selectable = context?.selectable;
|
|
1474
1775
|
const registerRowId = context?.registerRowId;
|
|
1475
1776
|
const unregisterRowId = context?.unregisterRowId;
|
|
1476
|
-
const finalRowId =
|
|
1777
|
+
const finalRowId = React11.useMemo(() => {
|
|
1477
1778
|
if (rowId) return rowId;
|
|
1478
1779
|
if (rowData && getRowId) return getRowId(rowData);
|
|
1479
1780
|
return props.id || void 0;
|
|
1480
1781
|
}, [rowId, rowData, getRowId, props.id]);
|
|
1481
|
-
|
|
1782
|
+
React11.useEffect(() => {
|
|
1482
1783
|
if (finalRowId && selectable) {
|
|
1483
1784
|
registerRowId?.(finalRowId);
|
|
1484
1785
|
return () => {
|
|
@@ -1487,7 +1788,7 @@ var TableRow = React10.forwardRef(
|
|
|
1487
1788
|
}
|
|
1488
1789
|
}, [finalRowId, selectable, registerRowId, unregisterRowId]);
|
|
1489
1790
|
const isSelected = finalRowId ? context?.isRowSelected(finalRowId) : false;
|
|
1490
|
-
const handleClick =
|
|
1791
|
+
const handleClick = React11.useCallback(
|
|
1491
1792
|
(e) => {
|
|
1492
1793
|
onClick?.(e);
|
|
1493
1794
|
},
|
|
@@ -1510,7 +1811,7 @@ var TableRow = React10.forwardRef(
|
|
|
1510
1811
|
}
|
|
1511
1812
|
);
|
|
1512
1813
|
TableRow.displayName = "TableRow";
|
|
1513
|
-
var TableHead =
|
|
1814
|
+
var TableHead = React11.forwardRef(({ className, style, ...props }, ref) => {
|
|
1514
1815
|
const context = useTableContext();
|
|
1515
1816
|
const isDark = typeof document !== "undefined" && document.documentElement.classList.contains("dark");
|
|
1516
1817
|
const yShadow = `inset 0 -1px 0 0 ${isDark ? "rgba(255,255,255,0.1)" : "rgba(0,0,0,0.1)"}`;
|
|
@@ -1529,7 +1830,7 @@ var TableHead = React10.forwardRef(({ className, style, ...props }, ref) => {
|
|
|
1529
1830
|
);
|
|
1530
1831
|
});
|
|
1531
1832
|
TableHead.displayName = "TableHead";
|
|
1532
|
-
var TableCell =
|
|
1833
|
+
var TableCell = React11.forwardRef(
|
|
1533
1834
|
({ className, variant = "default", ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1534
1835
|
"td",
|
|
1535
1836
|
{
|
|
@@ -1544,7 +1845,7 @@ var TableCell = React10.forwardRef(
|
|
|
1544
1845
|
)
|
|
1545
1846
|
);
|
|
1546
1847
|
TableCell.displayName = "TableCell";
|
|
1547
|
-
var TableCaption =
|
|
1848
|
+
var TableCaption = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1548
1849
|
"caption",
|
|
1549
1850
|
{
|
|
1550
1851
|
ref,
|
|
@@ -1553,7 +1854,7 @@ var TableCaption = React10.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
1553
1854
|
}
|
|
1554
1855
|
));
|
|
1555
1856
|
TableCaption.displayName = "TableCaption";
|
|
1556
|
-
var TableSelectAll =
|
|
1857
|
+
var TableSelectAll = React11.forwardRef(({ className, ...props }, ref) => {
|
|
1557
1858
|
const context = useTableContext();
|
|
1558
1859
|
if (!context?.selectable || context.selectionMode !== "multiple") {
|
|
1559
1860
|
return null;
|
|
@@ -1577,13 +1878,13 @@ var TableSelectAll = React10.forwardRef(({ className, ...props }, ref) => {
|
|
|
1577
1878
|
) });
|
|
1578
1879
|
});
|
|
1579
1880
|
TableSelectAll.displayName = "TableSelectAll";
|
|
1580
|
-
var TableRowCheckbox =
|
|
1881
|
+
var TableRowCheckbox = React11.forwardRef(({ rowId, rowData, className, ...props }, ref) => {
|
|
1581
1882
|
const context = useTableContext();
|
|
1582
1883
|
const getRowId = context?.getRowId;
|
|
1583
1884
|
if (!context?.selectable) {
|
|
1584
1885
|
return null;
|
|
1585
1886
|
}
|
|
1586
|
-
const finalRowId =
|
|
1887
|
+
const finalRowId = React11.useMemo(() => {
|
|
1587
1888
|
if (rowId) return rowId;
|
|
1588
1889
|
if (rowData && getRowId) return getRowId(rowData);
|
|
1589
1890
|
return void 0;
|
|
@@ -1668,7 +1969,7 @@ function ColumnSelection({
|
|
|
1668
1969
|
triggerLabel = "Manage Columns",
|
|
1669
1970
|
trigger
|
|
1670
1971
|
}) {
|
|
1671
|
-
const handleToggle =
|
|
1972
|
+
const handleToggle = React11.useCallback((key, checked) => {
|
|
1672
1973
|
if (checked) {
|
|
1673
1974
|
if (!visibleColumns.includes(key)) {
|
|
1674
1975
|
onVisibleColumnsChange([...visibleColumns, key]);
|
|
@@ -1715,33 +2016,33 @@ function ColumnSelection({
|
|
|
1715
2016
|
] })
|
|
1716
2017
|
] });
|
|
1717
2018
|
}
|
|
1718
|
-
var TabsContext =
|
|
2019
|
+
var TabsContext = React11.createContext(null);
|
|
1719
2020
|
var useTabsContext = () => {
|
|
1720
|
-
const context =
|
|
2021
|
+
const context = React11.useContext(TabsContext);
|
|
1721
2022
|
if (!context) {
|
|
1722
2023
|
throw new Error("Tabs components must be used within a Tabs provider");
|
|
1723
2024
|
}
|
|
1724
2025
|
return context;
|
|
1725
2026
|
};
|
|
1726
|
-
var TabsListContext =
|
|
1727
|
-
var useTabsListContext = () =>
|
|
1728
|
-
var Tabs =
|
|
1729
|
-
const [activeTab, setActiveTabState] =
|
|
1730
|
-
const tabRefs =
|
|
1731
|
-
const listRef =
|
|
1732
|
-
const setActiveTab =
|
|
2027
|
+
var TabsListContext = React11.createContext({ variant: "pill" });
|
|
2028
|
+
var useTabsListContext = () => React11.useContext(TabsListContext);
|
|
2029
|
+
var Tabs = React11.forwardRef(({ defaultValue, value, onValueChange, children, ...props }, ref) => {
|
|
2030
|
+
const [activeTab, setActiveTabState] = React11.useState(value ?? defaultValue);
|
|
2031
|
+
const tabRefs = React11.useRef(/* @__PURE__ */ new Map()).current;
|
|
2032
|
+
const listRef = React11.useRef(null);
|
|
2033
|
+
const setActiveTab = React11.useCallback(
|
|
1733
2034
|
(newValue) => {
|
|
1734
2035
|
setActiveTabState(newValue);
|
|
1735
2036
|
onValueChange?.(newValue);
|
|
1736
2037
|
},
|
|
1737
2038
|
[onValueChange]
|
|
1738
2039
|
);
|
|
1739
|
-
|
|
2040
|
+
React11.useEffect(() => {
|
|
1740
2041
|
if (value !== void 0) {
|
|
1741
2042
|
setActiveTabState(value);
|
|
1742
2043
|
}
|
|
1743
2044
|
}, [value]);
|
|
1744
|
-
const registerTab =
|
|
2045
|
+
const registerTab = React11.useCallback(
|
|
1745
2046
|
(tabValue, element) => {
|
|
1746
2047
|
tabRefs.set(tabValue, element);
|
|
1747
2048
|
},
|
|
@@ -1766,10 +2067,10 @@ var Tabs = React10.forwardRef(({ defaultValue, value, onValueChange, children, .
|
|
|
1766
2067
|
);
|
|
1767
2068
|
});
|
|
1768
2069
|
Tabs.displayName = "Tabs";
|
|
1769
|
-
var TabsList =
|
|
2070
|
+
var TabsList = React11.forwardRef(({ className, children, variant = "pill", ...props }, ref) => {
|
|
1770
2071
|
const { activeTab, tabRefs, listRef } = useTabsContext();
|
|
1771
|
-
const [indicatorStyle, setIndicatorStyle] =
|
|
1772
|
-
|
|
2072
|
+
const [indicatorStyle, setIndicatorStyle] = React11.useState(null);
|
|
2073
|
+
React11.useEffect(() => {
|
|
1773
2074
|
if (variant !== "pill") return;
|
|
1774
2075
|
const updateIndicator = () => {
|
|
1775
2076
|
if (!activeTab || !listRef.current) return;
|
|
@@ -1822,11 +2123,11 @@ var TabsList = React10.forwardRef(({ className, children, variant = "pill", ...p
|
|
|
1822
2123
|
) });
|
|
1823
2124
|
});
|
|
1824
2125
|
TabsList.displayName = TabsPrimitive.List.displayName;
|
|
1825
|
-
var TabsTrigger =
|
|
2126
|
+
var TabsTrigger = React11.forwardRef(({ className, value, icon, children, ...props }, ref) => {
|
|
1826
2127
|
const { registerTab, activeTab } = useTabsContext();
|
|
1827
2128
|
const { variant } = useTabsListContext();
|
|
1828
|
-
const triggerRef =
|
|
1829
|
-
|
|
2129
|
+
const triggerRef = React11.useRef(null);
|
|
2130
|
+
React11.useEffect(() => {
|
|
1830
2131
|
registerTab(value, triggerRef.current);
|
|
1831
2132
|
return () => registerTab(value, null);
|
|
1832
2133
|
}, [value, registerTab]);
|
|
@@ -1860,7 +2161,7 @@ var TabsTrigger = React10.forwardRef(({ className, value, icon, children, ...pro
|
|
|
1860
2161
|
);
|
|
1861
2162
|
});
|
|
1862
2163
|
TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
|
|
1863
|
-
var TabsContent =
|
|
2164
|
+
var TabsContent = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
|
|
1864
2165
|
TabsPrimitive.Content,
|
|
1865
2166
|
{
|
|
1866
2167
|
ref,
|
|
@@ -1872,7 +2173,7 @@ var TabsContent = React10.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
1872
2173
|
}
|
|
1873
2174
|
));
|
|
1874
2175
|
TabsContent.displayName = TabsPrimitive.Content.displayName;
|
|
1875
|
-
var Textarea =
|
|
2176
|
+
var Textarea = React11.forwardRef(
|
|
1876
2177
|
({ className, ...props }, ref) => {
|
|
1877
2178
|
return /* @__PURE__ */ jsx(
|
|
1878
2179
|
"textarea",
|
|
@@ -2029,8 +2330,8 @@ var switchLabelVariants = cva("select-none", {
|
|
|
2029
2330
|
size: "default"
|
|
2030
2331
|
}
|
|
2031
2332
|
});
|
|
2032
|
-
var Switch =
|
|
2033
|
-
const generatedId =
|
|
2333
|
+
var Switch = React11.forwardRef(({ className, size, label, labelPosition = "right", ...props }, ref) => {
|
|
2334
|
+
const generatedId = React11.useId();
|
|
2034
2335
|
const switchId = props.id ?? generatedId;
|
|
2035
2336
|
const switchEl = /* @__PURE__ */ jsx(
|
|
2036
2337
|
SwitchPrimitive.Root,
|
|
@@ -2113,11 +2414,11 @@ function TimeInput({
|
|
|
2113
2414
|
disabled = false,
|
|
2114
2415
|
"aria-label": ariaLabel
|
|
2115
2416
|
}) {
|
|
2116
|
-
const [editValue, setEditValue] =
|
|
2117
|
-
const internalRef =
|
|
2118
|
-
const committedRef =
|
|
2119
|
-
const pendingDigitRef =
|
|
2120
|
-
const setRefs =
|
|
2417
|
+
const [editValue, setEditValue] = React11.useState(null);
|
|
2418
|
+
const internalRef = React11.useRef(null);
|
|
2419
|
+
const committedRef = React11.useRef(false);
|
|
2420
|
+
const pendingDigitRef = React11.useRef(null);
|
|
2421
|
+
const setRefs = React11.useCallback(mergeRefs(internalRef, inputRef), [inputRef]);
|
|
2121
2422
|
const commitTwoDigits = (raw) => {
|
|
2122
2423
|
const parsed = parseInt(raw, 10);
|
|
2123
2424
|
const clamped = clamp(parsed, min2, max);
|
|
@@ -2261,8 +2562,8 @@ function TimeField({
|
|
|
2261
2562
|
disabled = false
|
|
2262
2563
|
}) {
|
|
2263
2564
|
const { hour12, period } = to12Hour(value.hour);
|
|
2264
|
-
const minuteInputRef =
|
|
2265
|
-
const mergedMinuteRef =
|
|
2565
|
+
const minuteInputRef = React11.useRef(null);
|
|
2566
|
+
const mergedMinuteRef = React11.useCallback(mergeRefs(minuteInputRef, minuteRef), [minuteRef]);
|
|
2266
2567
|
const handleHourChange = (newHour12) => {
|
|
2267
2568
|
onChange({ ...value, hour: to24Hour(newHour12, period) });
|
|
2268
2569
|
};
|
|
@@ -2358,7 +2659,7 @@ function useTimeFieldState(value) {
|
|
|
2358
2659
|
return { showDuration, durationLabel, isOvernight, incompleteHint };
|
|
2359
2660
|
}
|
|
2360
2661
|
function TimePickerColumn({ value, onChange, disabled = false, onRemove, showRemove = false, onDirty }) {
|
|
2361
|
-
const toHourRef =
|
|
2662
|
+
const toHourRef = React11.useRef(null);
|
|
2362
2663
|
const { showDuration, durationLabel, isOvernight, incompleteHint } = useTimeFieldState(value);
|
|
2363
2664
|
return /* @__PURE__ */ jsxs("div", { className: "flex flex-col px-2 pt-2 pb-2 gap-1", children: [
|
|
2364
2665
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
|
|
@@ -2425,7 +2726,7 @@ function TimePickerColumn({ value, onChange, disabled = false, onRemove, showRem
|
|
|
2425
2726
|
] });
|
|
2426
2727
|
}
|
|
2427
2728
|
function TimePickerRow({ value, onChange, disabled = false, onRemove, showRemove = false, onDirty }) {
|
|
2428
|
-
const toHourRef =
|
|
2729
|
+
const toHourRef = React11.useRef(null);
|
|
2429
2730
|
const { showDuration, durationLabel, isOvernight, incompleteHint } = useTimeFieldState(value);
|
|
2430
2731
|
return /* @__PURE__ */ jsx("div", { className: "flex flex-col px-4 pt-2 pb-3 gap-1", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4", children: [
|
|
2431
2732
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-1", children: [
|
|
@@ -2624,24 +2925,24 @@ function useDateRangePicker({
|
|
|
2624
2925
|
timeValue,
|
|
2625
2926
|
onTimeChange
|
|
2626
2927
|
}) {
|
|
2627
|
-
const [open, setOpen] =
|
|
2628
|
-
const [internalRange, setInternalRange] =
|
|
2928
|
+
const [open, setOpen] = React11.useState(false);
|
|
2929
|
+
const [internalRange, setInternalRange] = React11.useState({
|
|
2629
2930
|
from: void 0,
|
|
2630
2931
|
to: void 0
|
|
2631
2932
|
});
|
|
2632
|
-
const [draft, setDraft] =
|
|
2933
|
+
const [draft, setDraft] = React11.useState({
|
|
2633
2934
|
from: void 0,
|
|
2634
2935
|
to: void 0
|
|
2635
2936
|
});
|
|
2636
|
-
const [hoverDate, setHoverDate] =
|
|
2637
|
-
const [viewMonth, setViewMonth] =
|
|
2937
|
+
const [hoverDate, setHoverDate] = React11.useState();
|
|
2938
|
+
const [viewMonth, setViewMonth] = React11.useState(
|
|
2638
2939
|
() => startOfMonth(value?.from ?? /* @__PURE__ */ new Date())
|
|
2639
2940
|
);
|
|
2640
|
-
const [activePreset, setActivePreset] =
|
|
2641
|
-
const [committedInternalTime, setCommittedInternalTime] =
|
|
2642
|
-
const [draftTime, setDraftTime] =
|
|
2643
|
-
const [timeExpanded, setTimeExpanded] =
|
|
2644
|
-
const [timeDirty, setTimeDirty] =
|
|
2941
|
+
const [activePreset, setActivePreset] = React11.useState();
|
|
2942
|
+
const [committedInternalTime, setCommittedInternalTime] = React11.useState(DEFAULT_TIME_RANGE);
|
|
2943
|
+
const [draftTime, setDraftTime] = React11.useState(DEFAULT_TIME_RANGE);
|
|
2944
|
+
const [timeExpanded, setTimeExpanded] = React11.useState(false);
|
|
2945
|
+
const [timeDirty, setTimeDirty] = React11.useState(false);
|
|
2645
2946
|
const committedRange = value ?? internalRange;
|
|
2646
2947
|
const committedTime = timeValue ?? committedInternalTime;
|
|
2647
2948
|
const timeVisible = !!(draft.from && draft.to);
|
|
@@ -2650,15 +2951,15 @@ function useDateRangePicker({
|
|
|
2650
2951
|
const hasPartialTime = showTimePicker && timeExpanded && !isTimeComplete2;
|
|
2651
2952
|
const canClear = !!(draft.from || committedRange.from);
|
|
2652
2953
|
const canApply = !(draft.from && !draft.to) && !!(draft.from || committedRange.from) && !hasPartialTime;
|
|
2653
|
-
const resetTime =
|
|
2954
|
+
const resetTime = React11.useCallback(() => {
|
|
2654
2955
|
setDraftTime(DEFAULT_TIME_RANGE);
|
|
2655
2956
|
setTimeExpanded(false);
|
|
2656
2957
|
setTimeDirty(false);
|
|
2657
2958
|
}, []);
|
|
2658
|
-
const handleTimeChange =
|
|
2959
|
+
const handleTimeChange = React11.useCallback((newTime) => {
|
|
2659
2960
|
setDraftTime(newTime);
|
|
2660
2961
|
}, []);
|
|
2661
|
-
const handleOpenChange =
|
|
2962
|
+
const handleOpenChange = React11.useCallback(
|
|
2662
2963
|
(newOpen) => {
|
|
2663
2964
|
if (newOpen) {
|
|
2664
2965
|
setDraft(committedRange);
|
|
@@ -2673,7 +2974,7 @@ function useDateRangePicker({
|
|
|
2673
2974
|
},
|
|
2674
2975
|
[committedRange, committedTime]
|
|
2675
2976
|
);
|
|
2676
|
-
const handleDayClick =
|
|
2977
|
+
const handleDayClick = React11.useCallback(
|
|
2677
2978
|
(date) => {
|
|
2678
2979
|
const { from, to } = draft;
|
|
2679
2980
|
if (!from || from && to) {
|
|
@@ -2690,7 +2991,7 @@ function useDateRangePicker({
|
|
|
2690
2991
|
},
|
|
2691
2992
|
[draft, showTimePicker, timeExpanded, resetTime]
|
|
2692
2993
|
);
|
|
2693
|
-
const handlePreset =
|
|
2994
|
+
const handlePreset = React11.useCallback(
|
|
2694
2995
|
(preset) => {
|
|
2695
2996
|
const newRange = preset.getRange();
|
|
2696
2997
|
setDraft(newRange);
|
|
@@ -2700,7 +3001,7 @@ function useDateRangePicker({
|
|
|
2700
3001
|
},
|
|
2701
3002
|
[showTimePicker, resetTime]
|
|
2702
3003
|
);
|
|
2703
|
-
const handleApply =
|
|
3004
|
+
const handleApply = React11.useCallback(() => {
|
|
2704
3005
|
if (draft.from && !draft.to) return;
|
|
2705
3006
|
const newRange = draft.from && draft.to ? draft : void 0;
|
|
2706
3007
|
const rangeChanged = newRange?.from?.getTime() !== committedRange.from?.getTime() || newRange?.to?.getTime() !== committedRange.to?.getTime();
|
|
@@ -2715,15 +3016,15 @@ function useDateRangePicker({
|
|
|
2715
3016
|
}
|
|
2716
3017
|
setOpen(false);
|
|
2717
3018
|
}, [draft, onChange, committedRange, draftTime, committedTime, onTimeChange]);
|
|
2718
|
-
const handleClear =
|
|
3019
|
+
const handleClear = React11.useCallback(() => {
|
|
2719
3020
|
setDraft({ from: void 0, to: void 0 });
|
|
2720
3021
|
setActivePreset(void 0);
|
|
2721
3022
|
if (showTimePicker) resetTime();
|
|
2722
3023
|
}, [showTimePicker, resetTime]);
|
|
2723
|
-
const expandTime =
|
|
3024
|
+
const expandTime = React11.useCallback(() => {
|
|
2724
3025
|
setTimeExpanded(true);
|
|
2725
3026
|
}, []);
|
|
2726
|
-
const markTimeDirty =
|
|
3027
|
+
const markTimeDirty = React11.useCallback(() => {
|
|
2727
3028
|
setTimeDirty(true);
|
|
2728
3029
|
}, []);
|
|
2729
3030
|
return {
|
|
@@ -2870,7 +3171,7 @@ function DateRangePicker({
|
|
|
2870
3171
|
}
|
|
2871
3172
|
) }),
|
|
2872
3173
|
/* @__PURE__ */ jsx(PopoverContent, { align, className: "w-auto p-0 overflow-hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex divide-x divide-gray-100 dark:divide-neutral-700", children: [
|
|
2873
|
-
/* @__PURE__ */ jsx("div", { className: "flex flex-col p-3 gap-0.5 min-w-[130px]", children: (presetSections ?? [{ title: "Presets", options: presets }]).map((section, si) => /* @__PURE__ */ jsxs(
|
|
3174
|
+
/* @__PURE__ */ jsx("div", { className: "flex flex-col p-3 gap-0.5 min-w-[130px]", children: (presetSections ?? [{ title: "Presets", options: presets }]).map((section, si) => /* @__PURE__ */ jsxs(React11.Fragment, { children: [
|
|
2874
3175
|
si > 0 && /* @__PURE__ */ jsx("div", { className: "my-2 border-t border-gray-100 dark:border-neutral-700" }),
|
|
2875
3176
|
/* @__PURE__ */ jsx("p", { className: "text-xs font-semibold text-gray-400 dark:text-gray-500 uppercase tracking-wider mb-1 px-2", children: section.title }),
|
|
2876
3177
|
section.options.map((preset) => /* @__PURE__ */ jsx(
|
|
@@ -3039,7 +3340,7 @@ function DateRangePickerMobile({
|
|
|
3039
3340
|
) }),
|
|
3040
3341
|
/* @__PURE__ */ jsx(PopoverContent, { align: "center", className: "w-auto p-0 overflow-hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex divide-x divide-gray-100 dark:divide-neutral-700", children: [
|
|
3041
3342
|
/* @__PURE__ */ jsx("div", { className: "flex flex-col p-2 gap-0.5 min-w-[110px] max-h-[360px] overflow-y-auto", children: (presetSections ?? [{ title: "Presets", options: presets }]).map(
|
|
3042
|
-
(section, si) => /* @__PURE__ */ jsxs(
|
|
3343
|
+
(section, si) => /* @__PURE__ */ jsxs(React11.Fragment, { children: [
|
|
3043
3344
|
si > 0 && /* @__PURE__ */ jsx("div", { className: "my-2 border-t border-gray-100 dark:border-neutral-700" }),
|
|
3044
3345
|
/* @__PURE__ */ jsx("p", { className: "text-xs font-semibold text-gray-400 dark:text-gray-500 uppercase tracking-wider mb-1 px-2", children: section.title }),
|
|
3045
3346
|
section.options.map((preset) => /* @__PURE__ */ jsx(
|
|
@@ -3397,6 +3698,6 @@ function PeriodComparisonSelector({
|
|
|
3397
3698
|
] });
|
|
3398
3699
|
}
|
|
3399
3700
|
|
|
3400
|
-
export { Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColumnSelection, DEFAULT_COMPARISON_PERIODS, DEFAULT_PRESETS, DEFAULT_TIME_RANGE, DateRangePicker, DateRangePickerMobile, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormLabel, FormMessage, MobileDataCard, PeriodComparisonSelector, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, SegmentedControl, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, Skeleton, SkeletonAvatar, SkeletonBadge, SkeletonButton, SkeletonCard, SkeletonIcon, SkeletonInput, SkeletonSubtitle, SkeletonTableRow, SkeletonTableRows, SkeletonText, SkeletonTitle, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, TableRowCheckbox, TableSelectAll, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toggle, buttonVariants, segmentedControlItemVariants, segmentedControlVariants, separatorVariants, switchLabelVariants, switchThumbVariants, switchTrackVariants, toggleGroupVariants, toggleItemVariants, useColumnVisibility, useFormContext, useFormFieldContext, useTableSelection };
|
|
3401
|
-
//# sourceMappingURL=chunk-
|
|
3402
|
-
//# sourceMappingURL=chunk-
|
|
3701
|
+
export { Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColumnSelection, DEFAULT_COMPARISON_PERIODS, DEFAULT_PRESETS, DEFAULT_TIME_RANGE, DateRangePicker, DateRangePickerMobile, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormLabel, FormMessage, MobileDataCard, PeriodComparisonSelector, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, SegmentedControl, Select, SelectBar, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, Skeleton, SkeletonAvatar, SkeletonBadge, SkeletonButton, SkeletonCard, SkeletonIcon, SkeletonInput, SkeletonSubtitle, SkeletonTableRow, SkeletonTableRows, SkeletonText, SkeletonTitle, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, TableRowCheckbox, TableSelectAll, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toggle, buttonVariants, segmentedControlItemVariants, segmentedControlVariants, separatorVariants, switchLabelVariants, switchThumbVariants, switchTrackVariants, toggleGroupVariants, toggleItemVariants, useColumnVisibility, useFormContext, useFormFieldContext, useTableSelection };
|
|
3702
|
+
//# sourceMappingURL=chunk-3CXBEGTO.mjs.map
|
|
3703
|
+
//# sourceMappingURL=chunk-3CXBEGTO.mjs.map
|