@dimasbaguspm/versaur 0.0.11 → 0.0.13
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/js/bottom-sheet-CBLNEX4F.js +281 -0
- package/dist/js/bottom-sheet.atoms-DFMOaMsU.js +78 -0
- package/dist/js/{calendar-De5dCVnE.js → calendar-B9rIZCdo.js} +318 -163
- package/dist/js/{index-DOdDlCoL.js → cn-BKwT3erk.js} +463 -788
- package/dist/js/enforce-subpath-import.js +1 -0
- package/dist/js/feedbacks/index.js +1 -1
- package/dist/js/{form-layout-BRqZZe8s.js → form-layout-PLH-7bWq.js} +14 -13
- package/dist/js/forms/index.js +1 -1
- package/dist/js/index-Dmu_fHni.js +329 -0
- package/dist/js/index.js +32 -31
- package/dist/js/layouts/index.js +1 -1
- package/dist/js/{menu-Du409VIG.js → menu-oRrbZAAy.js} +56 -60
- package/dist/js/navigation/index.js +1 -1
- package/dist/js/overlays/index.js +5 -4
- package/dist/js/primitive/index.js +2 -2
- package/dist/js/{skeleton-BNZyaRjo.js → skeleton-Ma-Fcs06.js} +6 -5
- package/dist/js/{switch-input-B-pwBWbi.js → switch-input-o8oO4Rf4.js} +482 -435
- package/dist/js/{tabs-BbOkYchB.js → tabs-DSeR5XxX.js} +6 -5
- package/dist/js/{tile-6SeBYc08.js → tile-8hqVMf2m.js} +110 -139
- package/dist/types/forms/chip-input/types.d.ts +16 -0
- package/dist/types/forms/date-range-picker-input/date-range-picker-input.d.ts +10 -0
- package/dist/types/forms/date-range-picker-input/index.d.ts +2 -0
- package/dist/types/forms/date-range-picker-input/types.d.ts +64 -0
- package/dist/types/forms/date-range-picker-input/use-date-range-picker.d.ts +13 -0
- package/dist/types/overlays/bottom-sheet/bottom-sheet.atoms.d.ts +17 -0
- package/dist/types/overlays/bottom-sheet/bottom-sheet.d.ts +7 -0
- package/dist/types/overlays/bottom-sheet/index.d.ts +2 -0
- package/dist/types/overlays/bottom-sheet/types.d.ts +22 -0
- package/dist/types/overlays/drawer/drawer.atoms.d.ts +2 -1
- package/dist/types/overlays/drawer/drawer.d.ts +1 -0
- package/dist/types/overlays/drawer/types.d.ts +6 -3
- package/dist/types/overlays/index.d.ts +1 -0
- package/dist/types/primitive/calendar/calendar.atoms.d.ts +13 -0
- package/dist/types/primitive/calendar/index.d.ts +1 -1
- package/dist/types/primitive/calendar/types.d.ts +38 -4
- package/dist/types/primitive/calendar/use-calendar.d.ts +18 -0
- package/package.json +1 -1
- package/dist/js/drawer-Cn7sreJG.js +0 -221
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { a as cva, j as jsxRuntimeExports } from "./index-Dmu_fHni.js";
|
|
2
2
|
import React__default, { useState, useRef, createContext, useContext, useEffect, useId, useCallback } from "react";
|
|
3
|
-
import { I as Icon, C as Calculator, B as Button, b as Calendar, T as Text } from "./calendar-
|
|
4
|
-
import { a as Modal, M as Menu } from "./menu-
|
|
3
|
+
import { I as Icon, C as Calculator, B as Button, b as Calendar, T as Text } from "./calendar-B9rIZCdo.js";
|
|
4
|
+
import { a as Modal, M as Menu } from "./menu-oRrbZAAy.js";
|
|
5
5
|
import { CalculatorIcon, Check, Clock } from "lucide-react";
|
|
6
|
+
import { c as cn } from "./cn-BKwT3erk.js";
|
|
6
7
|
const textInputVariants = cva(
|
|
7
8
|
"block w-full rounded-md border bg-white transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none disabled:bg-gray-50",
|
|
8
9
|
{
|
|
@@ -39,64 +40,64 @@ const textInputVariants = cva(
|
|
|
39
40
|
({
|
|
40
41
|
variant: e = "primary",
|
|
41
42
|
label: t,
|
|
42
|
-
leftContent:
|
|
43
|
-
rightContent:
|
|
44
|
-
helperText:
|
|
43
|
+
leftContent: n,
|
|
44
|
+
rightContent: o,
|
|
45
|
+
helperText: s,
|
|
45
46
|
error: c,
|
|
46
|
-
className:
|
|
47
|
-
disabled:
|
|
47
|
+
className: u,
|
|
48
|
+
disabled: a,
|
|
48
49
|
id: r,
|
|
49
|
-
...
|
|
50
|
+
...i
|
|
50
51
|
}, x) => {
|
|
51
|
-
const
|
|
52
|
+
const l = React__default.useId(), g = r || l, d = !!c;
|
|
52
53
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
|
|
53
54
|
t && /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
54
55
|
"label",
|
|
55
56
|
{
|
|
56
|
-
htmlFor:
|
|
57
|
+
htmlFor: g,
|
|
57
58
|
className: "block text-sm font-medium text-foreground mb-2",
|
|
58
59
|
children: t
|
|
59
60
|
}
|
|
60
61
|
),
|
|
61
|
-
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("relative w-full",
|
|
62
|
-
|
|
62
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("relative w-full", u), children: [
|
|
63
|
+
n && /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
63
64
|
"span",
|
|
64
65
|
{
|
|
65
66
|
className: "absolute left-2.5 top-0 bottom-0 pointer-events-none text-gray-500 flex items-center justify-center w-5",
|
|
66
67
|
"data-testid": "left-content",
|
|
67
|
-
children:
|
|
68
|
+
children: n
|
|
68
69
|
}
|
|
69
70
|
),
|
|
70
71
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
71
72
|
"input",
|
|
72
73
|
{
|
|
73
74
|
ref: x,
|
|
74
|
-
id:
|
|
75
|
-
"aria-invalid":
|
|
76
|
-
"aria-disabled":
|
|
77
|
-
disabled:
|
|
75
|
+
id: g,
|
|
76
|
+
"aria-invalid": d,
|
|
77
|
+
"aria-disabled": a,
|
|
78
|
+
disabled: a,
|
|
78
79
|
className: cn(
|
|
79
80
|
textInputVariants({
|
|
80
|
-
variant:
|
|
81
|
+
variant: d ? "danger" : e
|
|
81
82
|
}),
|
|
82
|
-
|
|
83
|
-
|
|
83
|
+
n ? "pl-9" : "pl-3",
|
|
84
|
+
o ? "pr-9" : "pr-3",
|
|
84
85
|
"h-10"
|
|
85
86
|
),
|
|
86
|
-
...
|
|
87
|
+
...i
|
|
87
88
|
}
|
|
88
89
|
),
|
|
89
|
-
|
|
90
|
+
o && /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
90
91
|
"span",
|
|
91
92
|
{
|
|
92
93
|
className: "absolute right-2.5 top-0 bottom-0 pointer-events-none text-gray-500 flex items-center justify-center w-5",
|
|
93
94
|
"data-testid": "right-content",
|
|
94
|
-
children:
|
|
95
|
+
children: o
|
|
95
96
|
}
|
|
96
97
|
)
|
|
97
98
|
] }),
|
|
98
|
-
|
|
99
|
-
!
|
|
99
|
+
d && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: c }),
|
|
100
|
+
!d && s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-gray-600", children: s })
|
|
100
101
|
] });
|
|
101
102
|
}
|
|
102
103
|
);
|
|
@@ -281,31 +282,31 @@ const DEFAULT_HEADER = "Enter Amount", CalculatorInput = ({
|
|
|
281
282
|
if (!e)
|
|
282
283
|
throw new Error("CheckboxOption must be used within CheckboxInput");
|
|
283
284
|
return e;
|
|
284
|
-
}, CheckboxOption = React__default.forwardRef(({ children: e, description: t, className:
|
|
285
|
-
const
|
|
285
|
+
}, CheckboxOption = React__default.forwardRef(({ children: e, description: t, className: n, disabled: o, id: s, ...c }, u) => {
|
|
286
|
+
const a = useCheckboxContext(), r = React__default.useId(), i = s || r, x = o || a.disabled, l = a.error ? "danger" : a.variant || "primary";
|
|
286
287
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
287
288
|
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative flex items-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
288
289
|
"input",
|
|
289
290
|
{
|
|
290
|
-
ref:
|
|
291
|
+
ref: u,
|
|
291
292
|
type: "checkbox",
|
|
292
|
-
id:
|
|
293
|
+
id: i,
|
|
293
294
|
disabled: x,
|
|
294
295
|
className: cn(
|
|
295
296
|
checkboxVariants({
|
|
296
|
-
variant:
|
|
297
|
-
size:
|
|
297
|
+
variant: l,
|
|
298
|
+
size: a.size
|
|
298
299
|
}),
|
|
299
300
|
// Custom checkmark styling using ::after - centered positioning with size variants
|
|
300
301
|
'after:content-[""] after:absolute after:left-1/2 after:top-[45%] after:-translate-x-1/2 after:-translate-y-1/2 after:border-b-2 after:border-r-2 after:border-white after:rotate-45 after:opacity-0 after:transition-opacity after:duration-200',
|
|
301
302
|
// Size-specific checkmark dimensions
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
303
|
+
a.size === "sm" && "after:w-[3px] after:h-[6px]",
|
|
304
|
+
a.size === "md" && "after:w-[4px] after:h-[8px]",
|
|
305
|
+
a.size === "lg" && "after:w-[6px] after:h-[10px]",
|
|
305
306
|
"checked:after:opacity-100",
|
|
306
307
|
// Outline variants use colored checkmark
|
|
307
|
-
|
|
308
|
-
|
|
308
|
+
l?.includes("outline") && "checked:after:border-current",
|
|
309
|
+
n
|
|
309
310
|
),
|
|
310
311
|
...c
|
|
311
312
|
}
|
|
@@ -314,9 +315,9 @@ const DEFAULT_HEADER = "Enter Amount", CalculatorInput = ({
|
|
|
314
315
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
315
316
|
"label",
|
|
316
317
|
{
|
|
317
|
-
htmlFor:
|
|
318
|
+
htmlFor: i,
|
|
318
319
|
className: checkboxLabelVariants({
|
|
319
|
-
size:
|
|
320
|
+
size: a.size,
|
|
320
321
|
disabled: x
|
|
321
322
|
}),
|
|
322
323
|
children: e
|
|
@@ -327,9 +328,9 @@ const DEFAULT_HEADER = "Enter Amount", CalculatorInput = ({
|
|
|
327
328
|
{
|
|
328
329
|
className: cn(
|
|
329
330
|
"text-gray-600 mt-1",
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
331
|
+
a.size === "sm" && "text-xs",
|
|
332
|
+
a.size === "md" && "text-xs",
|
|
333
|
+
a.size === "lg" && "text-sm",
|
|
333
334
|
x && "opacity-50"
|
|
334
335
|
),
|
|
335
336
|
children: t
|
|
@@ -343,26 +344,26 @@ const CheckboxInputRoot = React__default.forwardRef(
|
|
|
343
344
|
({
|
|
344
345
|
variant: e = "primary",
|
|
345
346
|
size: t = "md",
|
|
346
|
-
label:
|
|
347
|
-
helperText:
|
|
348
|
-
error:
|
|
347
|
+
label: n,
|
|
348
|
+
helperText: o,
|
|
349
|
+
error: s,
|
|
349
350
|
direction: c = "vertical",
|
|
350
|
-
className:
|
|
351
|
-
disabled:
|
|
351
|
+
className: u,
|
|
352
|
+
disabled: a,
|
|
352
353
|
children: r,
|
|
353
|
-
...
|
|
354
|
+
...i
|
|
354
355
|
}, x) => {
|
|
355
|
-
const
|
|
356
|
+
const l = !!s, g = {
|
|
356
357
|
variant: e,
|
|
357
358
|
size: t,
|
|
358
|
-
disabled:
|
|
359
|
-
error:
|
|
359
|
+
disabled: a,
|
|
360
|
+
error: l
|
|
360
361
|
};
|
|
361
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx(CheckboxContext.Provider, { value:
|
|
362
|
-
|
|
362
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsx(CheckboxContext.Provider, { value: g, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: x, className: cn("w-full", u), ...i, children: [
|
|
363
|
+
n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: n }),
|
|
363
364
|
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: checkboxGroupVariants({ direction: c }), children: r }),
|
|
364
|
-
|
|
365
|
-
!
|
|
365
|
+
l && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: s }),
|
|
366
|
+
!l && o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: o })
|
|
366
367
|
] }) });
|
|
367
368
|
}
|
|
368
369
|
);
|
|
@@ -377,7 +378,9 @@ const CheckboxInput = Object.assign(CheckboxInputRoot, {
|
|
|
377
378
|
throw new Error("useChipInputContext must be used within ChipInputContext");
|
|
378
379
|
return e;
|
|
379
380
|
}, chipOptionVariants = cva(
|
|
380
|
-
|
|
381
|
+
[
|
|
382
|
+
"inline-flex items-center bg-white font-regular transition-colors duration-200 cursor-pointer border border-border"
|
|
383
|
+
].join(" "),
|
|
381
384
|
{
|
|
382
385
|
variants: {
|
|
383
386
|
variant: {
|
|
@@ -448,104 +451,132 @@ const CheckboxInput = Object.assign(CheckboxInputRoot, {
|
|
|
448
451
|
selected: {
|
|
449
452
|
true: "",
|
|
450
453
|
false: ""
|
|
454
|
+
},
|
|
455
|
+
shape: {
|
|
456
|
+
circle: "rounded-full",
|
|
457
|
+
rounded: "rounded-lg"
|
|
458
|
+
},
|
|
459
|
+
size: {
|
|
460
|
+
sm: "px-2 py-1 text-xs gap-1",
|
|
461
|
+
md: "px-3 py-1.5 text-sm gap-1.5",
|
|
462
|
+
lg: "px-4 py-2 text-base gap-2"
|
|
451
463
|
}
|
|
452
464
|
},
|
|
453
465
|
defaultVariants: {
|
|
454
466
|
variant: "primary",
|
|
455
|
-
selected: !1
|
|
467
|
+
selected: !1,
|
|
468
|
+
shape: "circle",
|
|
469
|
+
size: "sm"
|
|
456
470
|
}
|
|
457
471
|
}
|
|
458
|
-
), ChipOption = React__default.forwardRef(
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
c
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
{
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
name: `${o.name}[]`,
|
|
475
|
-
value: n,
|
|
476
|
-
checked: d,
|
|
477
|
-
disabled: x,
|
|
478
|
-
onChange: g,
|
|
479
|
-
className: "sr-only",
|
|
480
|
-
...c
|
|
472
|
+
), ChipOption = React__default.forwardRef(
|
|
473
|
+
({
|
|
474
|
+
children: e,
|
|
475
|
+
className: t,
|
|
476
|
+
disabled: n,
|
|
477
|
+
id: o,
|
|
478
|
+
value: s,
|
|
479
|
+
check: c,
|
|
480
|
+
defaultCheck: u = !1,
|
|
481
|
+
...a
|
|
482
|
+
}, r) => {
|
|
483
|
+
const i = useChipInputContext(), x = React__default.useId(), l = o || x, g = n || i.disabled, d = i.error ? "danger" : i.variant || "primary", m = i.shape || "circle", f = i.size || "sm", h = i.value?.includes(s) ?? !1, w = (j) => {
|
|
484
|
+
if (!g) {
|
|
485
|
+
const b = i.value || [];
|
|
486
|
+
let C;
|
|
487
|
+
h ? C = b.filter((I) => I !== s) : C = [...b, s], i.onChange?.(C);
|
|
481
488
|
}
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
|
|
487
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
489
|
+
a.onChange?.(j);
|
|
490
|
+
}, y = f === "lg" ? 20 : f === "md" ? 18 : 16;
|
|
491
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
|
|
492
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
493
|
+
"input",
|
|
494
|
+
{
|
|
495
|
+
ref: r,
|
|
496
|
+
type: "checkbox",
|
|
497
|
+
id: l,
|
|
498
|
+
name: `${i.name}[]`,
|
|
499
|
+
value: s,
|
|
500
|
+
checked: h,
|
|
501
|
+
disabled: g,
|
|
502
|
+
onChange: w,
|
|
503
|
+
className: "sr-only",
|
|
504
|
+
...a
|
|
505
|
+
}
|
|
506
|
+
),
|
|
507
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
508
|
+
"label",
|
|
509
|
+
{
|
|
510
|
+
htmlFor: l,
|
|
511
|
+
"data-selected": h,
|
|
512
|
+
className: cn(
|
|
513
|
+
chipOptionVariants({
|
|
514
|
+
variant: d,
|
|
515
|
+
selected: h,
|
|
516
|
+
shape: m,
|
|
517
|
+
size: f
|
|
518
|
+
}),
|
|
519
|
+
g && "opacity-50 cursor-not-allowed pointer-events-none",
|
|
520
|
+
t
|
|
514
521
|
),
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
522
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "flex items-center", children: [
|
|
523
|
+
(c || u) && /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
524
|
+
"span",
|
|
525
|
+
{
|
|
526
|
+
className: cn(
|
|
527
|
+
"flex items-center",
|
|
528
|
+
"transition-transform transition-opacity duration-200",
|
|
529
|
+
h ? "opacity-100 scale-100 mr-1" : "opacity-0 scale-75"
|
|
530
|
+
),
|
|
531
|
+
"aria-hidden": "true",
|
|
532
|
+
children: h && (c || /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
533
|
+
Check,
|
|
534
|
+
{
|
|
535
|
+
size: y,
|
|
536
|
+
className: d === "primary" ? "text-primary" : d === "secondary" ? "text-secondary" : d === "tertiary" ? "text-tertiary" : d === "ghost" ? "text-ghost" : d === "success" ? "text-success" : d === "info" ? "text-info" : d === "warning" ? "text-warning" : d === "danger" ? "text-danger" : "text-primary"
|
|
537
|
+
}
|
|
538
|
+
))
|
|
539
|
+
}
|
|
540
|
+
),
|
|
541
|
+
e
|
|
542
|
+
] })
|
|
543
|
+
}
|
|
544
|
+
)
|
|
545
|
+
] });
|
|
546
|
+
}
|
|
547
|
+
);
|
|
521
548
|
ChipOption.displayName = "ChipOption";
|
|
522
549
|
const ChipInputRoot = React__default.forwardRef(
|
|
523
550
|
({
|
|
524
551
|
variant: e = "primary",
|
|
525
|
-
|
|
552
|
+
shape: t = "circle",
|
|
553
|
+
size: n = "sm",
|
|
554
|
+
label: o,
|
|
526
555
|
helperText: s,
|
|
527
|
-
error:
|
|
528
|
-
className:
|
|
529
|
-
disabled:
|
|
530
|
-
name:
|
|
531
|
-
value:
|
|
532
|
-
onChange:
|
|
533
|
-
children:
|
|
534
|
-
...
|
|
535
|
-
},
|
|
536
|
-
const
|
|
556
|
+
error: c,
|
|
557
|
+
className: u,
|
|
558
|
+
disabled: a,
|
|
559
|
+
name: r,
|
|
560
|
+
value: i = [],
|
|
561
|
+
onChange: x,
|
|
562
|
+
children: l,
|
|
563
|
+
...g
|
|
564
|
+
}, d) => {
|
|
565
|
+
const m = !!c, f = {
|
|
537
566
|
variant: e,
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
567
|
+
shape: t,
|
|
568
|
+
size: n,
|
|
569
|
+
disabled: a,
|
|
570
|
+
error: m,
|
|
571
|
+
name: r,
|
|
572
|
+
value: i,
|
|
573
|
+
onChange: x
|
|
543
574
|
};
|
|
544
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx(ChipInputContext.Provider, { value:
|
|
545
|
-
|
|
546
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-wrap gap-2", children:
|
|
547
|
-
|
|
548
|
-
!
|
|
575
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsx(ChipInputContext.Provider, { value: f, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: d, className: cn("w-full", u), ...g, children: [
|
|
576
|
+
o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: o }),
|
|
577
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-wrap gap-2", children: l }),
|
|
578
|
+
m && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: c }),
|
|
579
|
+
!m && s && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: s })
|
|
549
580
|
] }) });
|
|
550
581
|
}
|
|
551
582
|
), ChipInput = Object.assign(ChipInputRoot, {
|
|
@@ -554,28 +585,28 @@ const ChipInputRoot = React__default.forwardRef(
|
|
|
554
585
|
({
|
|
555
586
|
leftContent: e,
|
|
556
587
|
rightContent: t,
|
|
557
|
-
hasError:
|
|
558
|
-
variant:
|
|
559
|
-
value:
|
|
588
|
+
hasError: n,
|
|
589
|
+
variant: o = "primary",
|
|
590
|
+
value: s,
|
|
560
591
|
placeholder: c = "Select date",
|
|
561
|
-
formatDate:
|
|
562
|
-
className:
|
|
592
|
+
formatDate: u,
|
|
593
|
+
className: a,
|
|
563
594
|
...r
|
|
564
|
-
},
|
|
595
|
+
}, i) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
565
596
|
"button",
|
|
566
597
|
{
|
|
567
|
-
ref:
|
|
598
|
+
ref: i,
|
|
568
599
|
type: "button",
|
|
569
|
-
"aria-invalid":
|
|
600
|
+
"aria-invalid": n,
|
|
570
601
|
className: cn(
|
|
571
602
|
dateSinglePickerInputVariants({
|
|
572
|
-
variant:
|
|
603
|
+
variant: n ? "danger" : o
|
|
573
604
|
}),
|
|
574
605
|
e ? "pl-9" : "pl-3",
|
|
575
606
|
t ? "pr-9" : "pr-3",
|
|
576
607
|
"h-10 flex items-center justify-between cursor-pointer w-full relative",
|
|
577
608
|
"text-left",
|
|
578
|
-
|
|
609
|
+
a
|
|
579
610
|
),
|
|
580
611
|
...r,
|
|
581
612
|
children: [
|
|
@@ -595,7 +626,7 @@ const ChipInputRoot = React__default.forwardRef(
|
|
|
595
626
|
e ? "ml-2" : "",
|
|
596
627
|
t ? "mr-2" : ""
|
|
597
628
|
),
|
|
598
|
-
children:
|
|
629
|
+
children: u ? u(s) : c
|
|
599
630
|
}
|
|
600
631
|
),
|
|
601
632
|
t && /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
@@ -614,29 +645,37 @@ DateSinglePickerTrigger.displayName = "DateSinglePickerTrigger";
|
|
|
614
645
|
const DateSinglePickerDocked = ({
|
|
615
646
|
open: e,
|
|
616
647
|
value: t,
|
|
617
|
-
onChange:
|
|
618
|
-
handleMenuClose:
|
|
619
|
-
}) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Menu, { isOpen: e, onOutsideClick:
|
|
648
|
+
onChange: n,
|
|
649
|
+
handleMenuClose: o
|
|
650
|
+
}) => /* @__PURE__ */ jsxRuntimeExports.jsxs(Menu, { isOpen: e, onOutsideClick: o, children: [
|
|
620
651
|
/* @__PURE__ */ jsxRuntimeExports.jsx(Menu.Trigger, { className: "absolute top-[90%] left-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { "aria-hidden": "true" }) }),
|
|
621
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(Menu.Content, { className: "drop-shadow-lg rounded-lg bg-white border border-neutral", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
652
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(Menu.Content, { className: "drop-shadow-lg rounded-lg bg-white border border-neutral", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
653
|
+
Calendar,
|
|
654
|
+
{
|
|
655
|
+
value: t,
|
|
656
|
+
onChange: (s) => {
|
|
657
|
+
s instanceof Date && n(s);
|
|
658
|
+
}
|
|
659
|
+
}
|
|
660
|
+
) })
|
|
622
661
|
] }), DateSinglePickerModal = ({
|
|
623
662
|
open: e,
|
|
624
663
|
setOpen: t,
|
|
625
|
-
value:
|
|
626
|
-
onChange:
|
|
627
|
-
label:
|
|
664
|
+
value: n,
|
|
665
|
+
onChange: o,
|
|
666
|
+
label: s,
|
|
628
667
|
buttonRef: c
|
|
629
668
|
}) => {
|
|
630
|
-
const [
|
|
631
|
-
|
|
669
|
+
const [u, a] = useState(
|
|
670
|
+
n
|
|
632
671
|
);
|
|
633
672
|
useEffect(() => {
|
|
634
|
-
|
|
635
|
-
}, [
|
|
673
|
+
a(n);
|
|
674
|
+
}, [n, e]);
|
|
636
675
|
const r = () => {
|
|
637
|
-
t(!1),
|
|
638
|
-
},
|
|
639
|
-
|
|
676
|
+
t(!1), a(n), c.current?.focus();
|
|
677
|
+
}, i = () => {
|
|
678
|
+
u && (o(u), t(!1), c.current?.focus());
|
|
640
679
|
};
|
|
641
680
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
642
681
|
Modal,
|
|
@@ -645,11 +684,19 @@ const DateSinglePickerDocked = ({
|
|
|
645
684
|
onOpenChange: t,
|
|
646
685
|
placement: "top",
|
|
647
686
|
size: "md",
|
|
648
|
-
"aria-label":
|
|
687
|
+
"aria-label": s ? String(s) : "Select date",
|
|
649
688
|
disableOverlayClose: !1,
|
|
650
689
|
disableEscClose: !1,
|
|
651
690
|
children: [
|
|
652
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(Modal.Body, { className: "px-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
691
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(Modal.Body, { className: "px-2", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
692
|
+
Calendar,
|
|
693
|
+
{
|
|
694
|
+
value: u,
|
|
695
|
+
onChange: (x) => {
|
|
696
|
+
x instanceof Date && a(x);
|
|
697
|
+
}
|
|
698
|
+
}
|
|
699
|
+
) }),
|
|
653
700
|
/* @__PURE__ */ jsxRuntimeExports.jsxs(Modal.Footer, { className: "px-6", children: [
|
|
654
701
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
655
702
|
Button,
|
|
@@ -664,10 +711,10 @@ const DateSinglePickerDocked = ({
|
|
|
664
711
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
665
712
|
Button,
|
|
666
713
|
{
|
|
667
|
-
onClick:
|
|
714
|
+
onClick: i,
|
|
668
715
|
variant: "primary",
|
|
669
716
|
type: "button",
|
|
670
|
-
disabled: !
|
|
717
|
+
disabled: !u,
|
|
671
718
|
size: "sm",
|
|
672
719
|
children: "Confirm"
|
|
673
720
|
}
|
|
@@ -678,102 +725,102 @@ const DateSinglePickerDocked = ({
|
|
|
678
725
|
);
|
|
679
726
|
};
|
|
680
727
|
function useDateSinglePicker({ id: e }) {
|
|
681
|
-
const [t,
|
|
728
|
+
const [t, n] = useState(!1), o = useId(), s = e || o, c = useRef(null), u = useCallback(
|
|
682
729
|
(r) => {
|
|
683
|
-
(r.key === "ArrowDown" || r.key === "Enter" || r.key === " ") &&
|
|
730
|
+
(r.key === "ArrowDown" || r.key === "Enter" || r.key === " ") && n(!0);
|
|
684
731
|
},
|
|
685
732
|
[]
|
|
686
|
-
),
|
|
687
|
-
|
|
733
|
+
), a = useCallback(() => {
|
|
734
|
+
n(!1), c.current?.focus();
|
|
688
735
|
}, []);
|
|
689
736
|
return {
|
|
690
737
|
open: t,
|
|
691
|
-
setOpen:
|
|
692
|
-
inputId:
|
|
738
|
+
setOpen: n,
|
|
739
|
+
inputId: s,
|
|
693
740
|
buttonRef: c,
|
|
694
|
-
handleKeyDown:
|
|
695
|
-
handleMenuClose:
|
|
741
|
+
handleKeyDown: u,
|
|
742
|
+
handleMenuClose: a
|
|
696
743
|
};
|
|
697
744
|
}
|
|
698
745
|
const DateSinglePickerInput = React__default.forwardRef(
|
|
699
746
|
({
|
|
700
747
|
value: e,
|
|
701
748
|
onChange: t,
|
|
702
|
-
label:
|
|
703
|
-
leftContent:
|
|
704
|
-
rightContent:
|
|
749
|
+
label: n,
|
|
750
|
+
leftContent: o,
|
|
751
|
+
rightContent: s,
|
|
705
752
|
helperText: c,
|
|
706
|
-
error:
|
|
707
|
-
variant:
|
|
753
|
+
error: u,
|
|
754
|
+
variant: a = "primary",
|
|
708
755
|
disabled: r,
|
|
709
|
-
placeholder:
|
|
756
|
+
placeholder: i = "Select date",
|
|
710
757
|
id: x,
|
|
711
|
-
type:
|
|
712
|
-
...
|
|
713
|
-
},
|
|
758
|
+
type: l = "docked",
|
|
759
|
+
...g
|
|
760
|
+
}, d) => {
|
|
714
761
|
if (e === void 0 || typeof t != "function")
|
|
715
762
|
throw new Error(
|
|
716
763
|
"DateSinglePickerInput is a controlled component: value and onChange are required."
|
|
717
764
|
);
|
|
718
765
|
const {
|
|
719
766
|
open: m,
|
|
720
|
-
setOpen:
|
|
767
|
+
setOpen: f,
|
|
721
768
|
inputId: h,
|
|
722
|
-
buttonRef:
|
|
769
|
+
buttonRef: w,
|
|
723
770
|
handleKeyDown: y,
|
|
724
771
|
handleMenuClose: j
|
|
725
|
-
} = useDateSinglePicker({ id: x }),
|
|
772
|
+
} = useDateSinglePicker({ id: x }), b = !!u, C = (R) => R ? R.toLocaleDateString(void 0, {
|
|
726
773
|
year: "numeric",
|
|
727
774
|
month: "short",
|
|
728
775
|
day: "numeric"
|
|
729
|
-
}) : typeof
|
|
730
|
-
t?.(R),
|
|
776
|
+
}) : typeof i == "string" ? i : "Select date", I = (R) => typeof g.formatDate == "function" ? g.formatDate(R) : C(R), k = () => f((R) => !R), p = y, E = (R) => {
|
|
777
|
+
t?.(R), w.current?.focus();
|
|
731
778
|
};
|
|
732
779
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative w-full", children: [
|
|
733
780
|
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "relative", children: [
|
|
734
|
-
|
|
781
|
+
n && /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
735
782
|
"label",
|
|
736
783
|
{
|
|
737
784
|
htmlFor: h,
|
|
738
785
|
className: "block text-sm font-medium text-foreground mb-2",
|
|
739
|
-
children:
|
|
786
|
+
children: n
|
|
740
787
|
}
|
|
741
788
|
),
|
|
742
789
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
743
790
|
DateSinglePickerTrigger,
|
|
744
791
|
{
|
|
745
792
|
ref: (R) => {
|
|
746
|
-
|
|
793
|
+
w.current = R, typeof d == "function" ? d(R) : d && (d.current = R);
|
|
747
794
|
},
|
|
748
795
|
id: h,
|
|
749
796
|
"aria-haspopup": "dialog",
|
|
750
797
|
"aria-expanded": m,
|
|
751
798
|
"aria-controls": m ? `${h}-calendar` : void 0,
|
|
752
|
-
"aria-invalid":
|
|
799
|
+
"aria-invalid": b,
|
|
753
800
|
"aria-disabled": r,
|
|
754
801
|
disabled: r,
|
|
755
|
-
leftContent:
|
|
756
|
-
rightContent:
|
|
757
|
-
hasError:
|
|
758
|
-
variant:
|
|
802
|
+
leftContent: o,
|
|
803
|
+
rightContent: s,
|
|
804
|
+
hasError: b,
|
|
805
|
+
variant: a,
|
|
759
806
|
value: e,
|
|
760
|
-
placeholder: typeof
|
|
807
|
+
placeholder: typeof i == "string" ? i : "Select date",
|
|
761
808
|
formatDate: I,
|
|
762
809
|
onClick: k,
|
|
763
|
-
onKeyDown:
|
|
810
|
+
onKeyDown: p,
|
|
764
811
|
tabIndex: 0,
|
|
765
|
-
...
|
|
812
|
+
...g
|
|
766
813
|
}
|
|
767
814
|
),
|
|
768
|
-
|
|
815
|
+
b && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: u }),
|
|
769
816
|
c && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-muted-foreground", children: c })
|
|
770
817
|
] }),
|
|
771
|
-
|
|
818
|
+
l === "docked" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
772
819
|
DateSinglePickerDocked,
|
|
773
820
|
{
|
|
774
821
|
open: m,
|
|
775
822
|
value: e,
|
|
776
|
-
onChange:
|
|
823
|
+
onChange: E,
|
|
777
824
|
inputId: h,
|
|
778
825
|
handleMenuClose: j
|
|
779
826
|
}
|
|
@@ -781,11 +828,11 @@ const DateSinglePickerInput = React__default.forwardRef(
|
|
|
781
828
|
DateSinglePickerModal,
|
|
782
829
|
{
|
|
783
830
|
open: m,
|
|
784
|
-
setOpen:
|
|
831
|
+
setOpen: f,
|
|
785
832
|
value: e,
|
|
786
|
-
onChange:
|
|
787
|
-
label: typeof
|
|
788
|
-
buttonRef:
|
|
833
|
+
onChange: E,
|
|
834
|
+
label: typeof n == "string" ? n : void 0,
|
|
835
|
+
buttonRef: w
|
|
789
836
|
}
|
|
790
837
|
)
|
|
791
838
|
] });
|
|
@@ -867,21 +914,21 @@ const DateSinglePickerInput = React__default.forwardRef(
|
|
|
867
914
|
);
|
|
868
915
|
return e;
|
|
869
916
|
}, RadioOption = React__default.forwardRef(
|
|
870
|
-
({ children: e, description: t, className:
|
|
871
|
-
const r = useRadioInputContext(),
|
|
917
|
+
({ children: e, description: t, className: n, disabled: o, id: s, value: c, ...u }, a) => {
|
|
918
|
+
const r = useRadioInputContext(), i = React__default.useId(), x = s || i, l = o || r.disabled, g = r.error ? "danger" : r.variant || "primary";
|
|
872
919
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
873
920
|
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "relative flex items-center", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
874
921
|
"input",
|
|
875
922
|
{
|
|
876
|
-
ref:
|
|
923
|
+
ref: a,
|
|
877
924
|
type: "radio",
|
|
878
925
|
id: x,
|
|
879
926
|
name: r.name,
|
|
880
927
|
value: c,
|
|
881
|
-
disabled:
|
|
928
|
+
disabled: l,
|
|
882
929
|
className: cn(
|
|
883
930
|
radioOptionVariants({
|
|
884
|
-
variant:
|
|
931
|
+
variant: g,
|
|
885
932
|
size: r.size
|
|
886
933
|
}),
|
|
887
934
|
// Custom radio dot styling using ::before - centered positioning with size variants
|
|
@@ -892,10 +939,10 @@ const DateSinglePickerInput = React__default.forwardRef(
|
|
|
892
939
|
r.size === "lg" && "before:w-[10px] before:h-[10px]",
|
|
893
940
|
"checked:before:opacity-100",
|
|
894
941
|
// Outline variants use colored radio dot
|
|
895
|
-
|
|
896
|
-
|
|
942
|
+
g?.includes("outline") && "checked:before:bg-current",
|
|
943
|
+
n
|
|
897
944
|
),
|
|
898
|
-
...
|
|
945
|
+
...u
|
|
899
946
|
}
|
|
900
947
|
) }),
|
|
901
948
|
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex-1", children: [
|
|
@@ -905,7 +952,7 @@ const DateSinglePickerInput = React__default.forwardRef(
|
|
|
905
952
|
htmlFor: x,
|
|
906
953
|
className: radioLabelVariants({
|
|
907
954
|
size: r.size,
|
|
908
|
-
disabled:
|
|
955
|
+
disabled: l
|
|
909
956
|
}),
|
|
910
957
|
children: e
|
|
911
958
|
}
|
|
@@ -918,7 +965,7 @@ const DateSinglePickerInput = React__default.forwardRef(
|
|
|
918
965
|
r.size === "sm" && "text-xs",
|
|
919
966
|
r.size === "md" && "text-xs",
|
|
920
967
|
r.size === "lg" && "text-sm",
|
|
921
|
-
|
|
968
|
+
l && "opacity-50"
|
|
922
969
|
),
|
|
923
970
|
children: t
|
|
924
971
|
}
|
|
@@ -930,28 +977,28 @@ const DateSinglePickerInput = React__default.forwardRef(
|
|
|
930
977
|
({
|
|
931
978
|
variant: e = "primary",
|
|
932
979
|
size: t = "md",
|
|
933
|
-
label:
|
|
934
|
-
helperText:
|
|
935
|
-
error:
|
|
980
|
+
label: n,
|
|
981
|
+
helperText: o,
|
|
982
|
+
error: s,
|
|
936
983
|
direction: c = "vertical",
|
|
937
|
-
className:
|
|
938
|
-
disabled:
|
|
984
|
+
className: u,
|
|
985
|
+
disabled: a,
|
|
939
986
|
name: r,
|
|
940
|
-
children:
|
|
987
|
+
children: i,
|
|
941
988
|
...x
|
|
942
|
-
},
|
|
943
|
-
const
|
|
989
|
+
}, l) => {
|
|
990
|
+
const g = !!s, d = {
|
|
944
991
|
variant: e,
|
|
945
992
|
size: t,
|
|
946
|
-
disabled:
|
|
947
|
-
error:
|
|
993
|
+
disabled: a,
|
|
994
|
+
error: g,
|
|
948
995
|
name: r
|
|
949
996
|
};
|
|
950
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx(RadioInputContext.Provider, { value:
|
|
951
|
-
|
|
952
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: radioGroupVariants({ direction: c }), children:
|
|
953
|
-
|
|
954
|
-
!
|
|
997
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsx(RadioInputContext.Provider, { value: d, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { ref: l, className: cn("w-full", u), ...x, children: [
|
|
998
|
+
n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: n }),
|
|
999
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: radioGroupVariants({ direction: c }), children: i }),
|
|
1000
|
+
g && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: s }),
|
|
1001
|
+
!g && o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: o })
|
|
955
1002
|
] }) });
|
|
956
1003
|
}
|
|
957
1004
|
), RadioInput = Object.assign(RadioInputRoot, {
|
|
@@ -1077,28 +1124,28 @@ const DateSinglePickerInput = React__default.forwardRef(
|
|
|
1077
1124
|
);
|
|
1078
1125
|
return e;
|
|
1079
1126
|
}, SegmentOption$1 = React__default.forwardRef(
|
|
1080
|
-
({ children: e, className: t, disabled:
|
|
1081
|
-
const r = useSegmentSingleInputContext(),
|
|
1082
|
-
if (!
|
|
1083
|
-
const h = r.value ===
|
|
1127
|
+
({ children: e, className: t, disabled: n, id: o, value: s, position: c = "middle", ...u }, a) => {
|
|
1128
|
+
const r = useSegmentSingleInputContext(), i = React__default.useId(), x = o || i, l = n || r.disabled, g = r.error ? "danger" : r.variant || "primary", d = r.value === s, m = (f) => {
|
|
1129
|
+
if (!l) {
|
|
1130
|
+
const h = r.value === s ? null : s;
|
|
1084
1131
|
r.onChange?.(h);
|
|
1085
1132
|
}
|
|
1086
|
-
|
|
1133
|
+
u.onChange?.(f);
|
|
1087
1134
|
};
|
|
1088
1135
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
|
|
1089
1136
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1090
1137
|
"input",
|
|
1091
1138
|
{
|
|
1092
|
-
ref:
|
|
1139
|
+
ref: a,
|
|
1093
1140
|
type: "radio",
|
|
1094
1141
|
id: x,
|
|
1095
1142
|
name: r.name,
|
|
1096
|
-
value:
|
|
1097
|
-
checked:
|
|
1098
|
-
disabled:
|
|
1143
|
+
value: s,
|
|
1144
|
+
checked: d,
|
|
1145
|
+
disabled: l,
|
|
1099
1146
|
onChange: m,
|
|
1100
1147
|
className: "sr-only",
|
|
1101
|
-
...
|
|
1148
|
+
...u
|
|
1102
1149
|
}
|
|
1103
1150
|
),
|
|
1104
1151
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
@@ -1107,15 +1154,15 @@ const DateSinglePickerInput = React__default.forwardRef(
|
|
|
1107
1154
|
htmlFor: x,
|
|
1108
1155
|
className: cn(
|
|
1109
1156
|
segmentOptionVariants$1({
|
|
1110
|
-
variant:
|
|
1157
|
+
variant: g,
|
|
1111
1158
|
size: r.size,
|
|
1112
1159
|
rounded: c
|
|
1113
1160
|
}),
|
|
1114
1161
|
// Apply selected state styling
|
|
1115
|
-
|
|
1116
|
-
|
|
1162
|
+
d && getSegmentSelectedClasses$1(g),
|
|
1163
|
+
d && "relative z-10",
|
|
1117
1164
|
// Apply disabled styling directly since labels don't support disabled attribute
|
|
1118
|
-
|
|
1165
|
+
l && "opacity-50 cursor-not-allowed pointer-events-none",
|
|
1119
1166
|
r.fullWidth && "flex-1 min-w-0",
|
|
1120
1167
|
t
|
|
1121
1168
|
),
|
|
@@ -1130,45 +1177,45 @@ const SegmentSingleInputRoot = React__default.forwardRef(
|
|
|
1130
1177
|
({
|
|
1131
1178
|
variant: e = "primary",
|
|
1132
1179
|
size: t = "md",
|
|
1133
|
-
label:
|
|
1134
|
-
helperText:
|
|
1135
|
-
error:
|
|
1180
|
+
label: n,
|
|
1181
|
+
helperText: o,
|
|
1182
|
+
error: s,
|
|
1136
1183
|
className: c,
|
|
1137
|
-
disabled:
|
|
1138
|
-
name:
|
|
1184
|
+
disabled: u,
|
|
1185
|
+
name: a,
|
|
1139
1186
|
value: r,
|
|
1140
|
-
onChange:
|
|
1187
|
+
onChange: i,
|
|
1141
1188
|
children: x,
|
|
1142
|
-
fullWidth:
|
|
1143
|
-
...
|
|
1144
|
-
},
|
|
1145
|
-
const m = !!
|
|
1189
|
+
fullWidth: l = !1,
|
|
1190
|
+
...g
|
|
1191
|
+
}, d) => {
|
|
1192
|
+
const m = !!s, f = {
|
|
1146
1193
|
variant: e,
|
|
1147
1194
|
size: t,
|
|
1148
|
-
disabled:
|
|
1195
|
+
disabled: u,
|
|
1149
1196
|
error: m,
|
|
1150
|
-
name:
|
|
1197
|
+
name: a,
|
|
1151
1198
|
value: r,
|
|
1152
|
-
onChange:
|
|
1153
|
-
fullWidth:
|
|
1154
|
-
}, h = React__default.Children.toArray(x),
|
|
1199
|
+
onChange: i,
|
|
1200
|
+
fullWidth: l
|
|
1201
|
+
}, h = React__default.Children.toArray(x), w = h.map((y, j) => {
|
|
1155
1202
|
if (React__default.isValidElement(y)) {
|
|
1156
|
-
let
|
|
1157
|
-
return h.length === 1 ?
|
|
1203
|
+
let b;
|
|
1204
|
+
return h.length === 1 ? b = "single" : j === 0 ? b = "first" : j === h.length - 1 ? b = "last" : b = "middle", React__default.cloneElement(
|
|
1158
1205
|
y,
|
|
1159
|
-
{ position:
|
|
1206
|
+
{ position: b }
|
|
1160
1207
|
);
|
|
1161
1208
|
}
|
|
1162
1209
|
return y;
|
|
1163
1210
|
});
|
|
1164
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx(SegmentSingleInputContext.Provider, { value:
|
|
1211
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsx(SegmentSingleInputContext.Provider, { value: f, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
1165
1212
|
"div",
|
|
1166
1213
|
{
|
|
1167
|
-
ref:
|
|
1168
|
-
className: cn(
|
|
1169
|
-
...
|
|
1214
|
+
ref: d,
|
|
1215
|
+
className: cn(l ? "w-full" : "", c),
|
|
1216
|
+
...g,
|
|
1170
1217
|
children: [
|
|
1171
|
-
|
|
1218
|
+
n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: n }),
|
|
1172
1219
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1173
1220
|
"div",
|
|
1174
1221
|
{
|
|
@@ -1178,13 +1225,13 @@ const SegmentSingleInputRoot = React__default.forwardRef(
|
|
|
1178
1225
|
size: t,
|
|
1179
1226
|
error: m
|
|
1180
1227
|
}),
|
|
1181
|
-
|
|
1228
|
+
l ? "flex w-full" : ""
|
|
1182
1229
|
),
|
|
1183
|
-
children:
|
|
1230
|
+
children: w
|
|
1184
1231
|
}
|
|
1185
1232
|
),
|
|
1186
|
-
m && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children:
|
|
1187
|
-
!m &&
|
|
1233
|
+
m && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: s }),
|
|
1234
|
+
!m && o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: o })
|
|
1188
1235
|
]
|
|
1189
1236
|
}
|
|
1190
1237
|
) });
|
|
@@ -1312,29 +1359,29 @@ const SegmentSingleInputRoot = React__default.forwardRef(
|
|
|
1312
1359
|
);
|
|
1313
1360
|
return e;
|
|
1314
1361
|
}, SegmentOption = React__default.forwardRef(
|
|
1315
|
-
({ children: e, className: t, disabled:
|
|
1316
|
-
const r = useSegmentMultipleInputContext(),
|
|
1317
|
-
if (!
|
|
1362
|
+
({ children: e, className: t, disabled: n, id: o, value: s, position: c = "middle", ...u }, a) => {
|
|
1363
|
+
const r = useSegmentMultipleInputContext(), i = React__default.useId(), x = o || i, l = n || r.disabled, g = r.error ? "danger" : r.variant || "primary", d = r.value?.includes(s) ?? !1, m = (f) => {
|
|
1364
|
+
if (!l) {
|
|
1318
1365
|
const h = r.value || [];
|
|
1319
|
-
let
|
|
1320
|
-
|
|
1366
|
+
let w;
|
|
1367
|
+
d ? w = h.filter((y) => y !== s) : w = [...h, s], r.onChange?.(w);
|
|
1321
1368
|
}
|
|
1322
|
-
|
|
1369
|
+
u.onChange?.(f);
|
|
1323
1370
|
};
|
|
1324
1371
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
|
|
1325
1372
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1326
1373
|
"input",
|
|
1327
1374
|
{
|
|
1328
|
-
ref:
|
|
1375
|
+
ref: a,
|
|
1329
1376
|
type: "checkbox",
|
|
1330
1377
|
id: x,
|
|
1331
1378
|
name: `${r.name}[]`,
|
|
1332
|
-
value:
|
|
1333
|
-
checked:
|
|
1334
|
-
disabled:
|
|
1379
|
+
value: s,
|
|
1380
|
+
checked: d,
|
|
1381
|
+
disabled: l,
|
|
1335
1382
|
onChange: m,
|
|
1336
1383
|
className: "sr-only",
|
|
1337
|
-
...
|
|
1384
|
+
...u
|
|
1338
1385
|
}
|
|
1339
1386
|
),
|
|
1340
1387
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
@@ -1343,15 +1390,15 @@ const SegmentSingleInputRoot = React__default.forwardRef(
|
|
|
1343
1390
|
htmlFor: x,
|
|
1344
1391
|
className: cn(
|
|
1345
1392
|
segmentOptionVariants({
|
|
1346
|
-
variant:
|
|
1393
|
+
variant: g,
|
|
1347
1394
|
size: r.size,
|
|
1348
1395
|
rounded: c
|
|
1349
1396
|
}),
|
|
1350
1397
|
// Apply selected state styling
|
|
1351
|
-
|
|
1352
|
-
|
|
1398
|
+
d && getSegmentSelectedClasses(g),
|
|
1399
|
+
d && "relative z-10",
|
|
1353
1400
|
// Apply disabled styling directly since labels don't support disabled attribute
|
|
1354
|
-
|
|
1401
|
+
l && "opacity-50 cursor-not-allowed pointer-events-none",
|
|
1355
1402
|
t
|
|
1356
1403
|
),
|
|
1357
1404
|
children: e
|
|
@@ -1365,47 +1412,47 @@ const SegmentMultipleInputRoot = React__default.forwardRef(
|
|
|
1365
1412
|
({
|
|
1366
1413
|
variant: e = "primary",
|
|
1367
1414
|
size: t = "md",
|
|
1368
|
-
label:
|
|
1369
|
-
helperText:
|
|
1370
|
-
error:
|
|
1415
|
+
label: n,
|
|
1416
|
+
helperText: o,
|
|
1417
|
+
error: s,
|
|
1371
1418
|
className: c,
|
|
1372
|
-
disabled:
|
|
1373
|
-
name:
|
|
1419
|
+
disabled: u,
|
|
1420
|
+
name: a,
|
|
1374
1421
|
value: r = [],
|
|
1375
|
-
onChange:
|
|
1422
|
+
onChange: i,
|
|
1376
1423
|
children: x,
|
|
1377
|
-
fullWidth:
|
|
1378
|
-
...
|
|
1379
|
-
},
|
|
1380
|
-
const m = !!
|
|
1424
|
+
fullWidth: l = !1,
|
|
1425
|
+
...g
|
|
1426
|
+
}, d) => {
|
|
1427
|
+
const m = !!s, f = {
|
|
1381
1428
|
variant: e,
|
|
1382
1429
|
size: t,
|
|
1383
|
-
disabled:
|
|
1430
|
+
disabled: u,
|
|
1384
1431
|
error: m,
|
|
1385
|
-
name:
|
|
1432
|
+
name: a,
|
|
1386
1433
|
value: r,
|
|
1387
|
-
onChange:
|
|
1388
|
-
}, h = React__default.Children.toArray(x),
|
|
1434
|
+
onChange: i
|
|
1435
|
+
}, h = React__default.Children.toArray(x), w = h.map((y, j) => {
|
|
1389
1436
|
if (React__default.isValidElement(y)) {
|
|
1390
|
-
let
|
|
1391
|
-
return h.length === 1 ?
|
|
1437
|
+
let b;
|
|
1438
|
+
return h.length === 1 ? b = "single" : j === 0 ? b = "first" : j === h.length - 1 ? b = "last" : b = "middle", React__default.cloneElement(
|
|
1392
1439
|
y,
|
|
1393
|
-
{ position:
|
|
1440
|
+
{ position: b }
|
|
1394
1441
|
);
|
|
1395
1442
|
}
|
|
1396
1443
|
return y;
|
|
1397
1444
|
});
|
|
1398
|
-
return /* @__PURE__ */ jsxRuntimeExports.jsx(SegmentMultipleInputContext.Provider, { value:
|
|
1445
|
+
return /* @__PURE__ */ jsxRuntimeExports.jsx(SegmentMultipleInputContext.Provider, { value: f, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
1399
1446
|
"div",
|
|
1400
1447
|
{
|
|
1401
|
-
ref:
|
|
1448
|
+
ref: d,
|
|
1402
1449
|
className: cn(
|
|
1403
|
-
|
|
1450
|
+
l ? "flex w-full flex-col" : "w-full",
|
|
1404
1451
|
c
|
|
1405
1452
|
),
|
|
1406
|
-
...
|
|
1453
|
+
...g,
|
|
1407
1454
|
children: [
|
|
1408
|
-
|
|
1455
|
+
n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "block text-sm font-medium text-foreground mb-3", children: n }),
|
|
1409
1456
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1410
1457
|
"div",
|
|
1411
1458
|
{
|
|
@@ -1415,13 +1462,13 @@ const SegmentMultipleInputRoot = React__default.forwardRef(
|
|
|
1415
1462
|
size: t,
|
|
1416
1463
|
error: m
|
|
1417
1464
|
}),
|
|
1418
|
-
|
|
1465
|
+
l && "flex w-full"
|
|
1419
1466
|
),
|
|
1420
|
-
children:
|
|
1467
|
+
children: w
|
|
1421
1468
|
}
|
|
1422
1469
|
),
|
|
1423
|
-
m && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children:
|
|
1424
|
-
!m &&
|
|
1470
|
+
m && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-danger", role: "alert", children: s }),
|
|
1471
|
+
!m && o && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: o })
|
|
1425
1472
|
]
|
|
1426
1473
|
}
|
|
1427
1474
|
) });
|
|
@@ -1464,43 +1511,43 @@ const SegmentMultipleInputRoot = React__default.forwardRef(
|
|
|
1464
1511
|
({
|
|
1465
1512
|
variant: e = "primary",
|
|
1466
1513
|
label: t,
|
|
1467
|
-
helperText:
|
|
1468
|
-
error:
|
|
1469
|
-
className:
|
|
1514
|
+
helperText: n,
|
|
1515
|
+
error: o,
|
|
1516
|
+
className: s,
|
|
1470
1517
|
disabled: c,
|
|
1471
|
-
id:
|
|
1472
|
-
placeholder:
|
|
1518
|
+
id: u,
|
|
1519
|
+
placeholder: a,
|
|
1473
1520
|
children: r,
|
|
1474
|
-
...
|
|
1521
|
+
...i
|
|
1475
1522
|
}, x) => {
|
|
1476
|
-
const
|
|
1523
|
+
const l = React__default.useId(), g = u || l, d = !!o;
|
|
1477
1524
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
|
|
1478
1525
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1479
1526
|
"label",
|
|
1480
1527
|
{
|
|
1481
|
-
htmlFor:
|
|
1528
|
+
htmlFor: g,
|
|
1482
1529
|
className: "block text-sm font-medium text-foreground mb-2",
|
|
1483
1530
|
children: t
|
|
1484
1531
|
}
|
|
1485
1532
|
),
|
|
1486
|
-
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("relative w-full",
|
|
1533
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cn("relative w-full", s), children: [
|
|
1487
1534
|
/* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
1488
1535
|
"select",
|
|
1489
1536
|
{
|
|
1490
1537
|
ref: x,
|
|
1491
|
-
id:
|
|
1492
|
-
"aria-invalid":
|
|
1538
|
+
id: g,
|
|
1539
|
+
"aria-invalid": d,
|
|
1493
1540
|
"aria-disabled": c,
|
|
1494
1541
|
disabled: c,
|
|
1495
1542
|
className: cn(
|
|
1496
1543
|
selectInputVariants({
|
|
1497
|
-
variant:
|
|
1544
|
+
variant: d ? "danger" : e
|
|
1498
1545
|
}),
|
|
1499
1546
|
"h-10 pl-3"
|
|
1500
1547
|
),
|
|
1501
|
-
...
|
|
1548
|
+
...i,
|
|
1502
1549
|
children: [
|
|
1503
|
-
|
|
1550
|
+
a && /* @__PURE__ */ jsxRuntimeExports.jsx("option", { value: "", disabled: !0, hidden: !0, children: a }),
|
|
1504
1551
|
r
|
|
1505
1552
|
]
|
|
1506
1553
|
}
|
|
@@ -1524,8 +1571,8 @@ const SegmentMultipleInputRoot = React__default.forwardRef(
|
|
|
1524
1571
|
}
|
|
1525
1572
|
) })
|
|
1526
1573
|
] }),
|
|
1527
|
-
|
|
1528
|
-
!
|
|
1574
|
+
d && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: o }),
|
|
1575
|
+
!d && n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-gray-600", children: n })
|
|
1529
1576
|
] });
|
|
1530
1577
|
}
|
|
1531
1578
|
);
|
|
@@ -1571,20 +1618,20 @@ const textAreaInputVariants = cva(
|
|
|
1571
1618
|
({
|
|
1572
1619
|
variant: e = "primary",
|
|
1573
1620
|
label: t,
|
|
1574
|
-
helperText:
|
|
1575
|
-
error:
|
|
1576
|
-
className:
|
|
1621
|
+
helperText: n,
|
|
1622
|
+
error: o,
|
|
1623
|
+
className: s,
|
|
1577
1624
|
disabled: c,
|
|
1578
|
-
id:
|
|
1579
|
-
minRows:
|
|
1625
|
+
id: u,
|
|
1626
|
+
minRows: a = 3,
|
|
1580
1627
|
maxRows: r,
|
|
1581
|
-
fieldSizing:
|
|
1628
|
+
fieldSizing: i = "fixed",
|
|
1582
1629
|
style: x,
|
|
1583
|
-
rows:
|
|
1584
|
-
...
|
|
1585
|
-
},
|
|
1586
|
-
const m = React__default.useId(),
|
|
1587
|
-
...
|
|
1630
|
+
rows: l,
|
|
1631
|
+
...g
|
|
1632
|
+
}, d) => {
|
|
1633
|
+
const m = React__default.useId(), f = u || m, h = !!o, w = l || a, y = i === "content" ? void 0 : r, j = {
|
|
1634
|
+
...i === "content" && { fieldSizing: "content" },
|
|
1588
1635
|
...y && {
|
|
1589
1636
|
maxHeight: `${y * 1.5}rem`
|
|
1590
1637
|
// Approximate line height
|
|
@@ -1595,17 +1642,17 @@ const textAreaInputVariants = cva(
|
|
|
1595
1642
|
t && /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1596
1643
|
"label",
|
|
1597
1644
|
{
|
|
1598
|
-
htmlFor:
|
|
1645
|
+
htmlFor: f,
|
|
1599
1646
|
className: "block text-sm font-medium text-foreground mb-2",
|
|
1600
1647
|
children: t
|
|
1601
1648
|
}
|
|
1602
1649
|
),
|
|
1603
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn("relative w-full",
|
|
1650
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: cn("relative w-full", s), children: /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1604
1651
|
"textarea",
|
|
1605
1652
|
{
|
|
1606
|
-
ref:
|
|
1607
|
-
id:
|
|
1608
|
-
rows:
|
|
1653
|
+
ref: d,
|
|
1654
|
+
id: f,
|
|
1655
|
+
rows: w,
|
|
1609
1656
|
"aria-invalid": h,
|
|
1610
1657
|
"aria-disabled": c,
|
|
1611
1658
|
disabled: c,
|
|
@@ -1613,15 +1660,15 @@ const textAreaInputVariants = cva(
|
|
|
1613
1660
|
className: cn(
|
|
1614
1661
|
textAreaInputVariants({
|
|
1615
1662
|
variant: h ? "danger" : e,
|
|
1616
|
-
fieldSizing:
|
|
1663
|
+
fieldSizing: i
|
|
1617
1664
|
}),
|
|
1618
1665
|
"px-3 py-2"
|
|
1619
1666
|
),
|
|
1620
|
-
...
|
|
1667
|
+
...g
|
|
1621
1668
|
}
|
|
1622
1669
|
) }),
|
|
1623
|
-
h && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children:
|
|
1624
|
-
!h &&
|
|
1670
|
+
h && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-danger", role: "alert", children: o }),
|
|
1671
|
+
!h && n && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-1 text-sm text-gray-600", children: n })
|
|
1625
1672
|
] });
|
|
1626
1673
|
}
|
|
1627
1674
|
);
|
|
@@ -1648,9 +1695,9 @@ const timeSegmentButtonVariants = cva(
|
|
|
1648
1695
|
), TimeField = ({
|
|
1649
1696
|
value: e,
|
|
1650
1697
|
onChange: t,
|
|
1651
|
-
label:
|
|
1652
|
-
"aria-label":
|
|
1653
|
-
disabled:
|
|
1698
|
+
label: n,
|
|
1699
|
+
"aria-label": o,
|
|
1700
|
+
disabled: s
|
|
1654
1701
|
}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1655
1702
|
"input",
|
|
1656
1703
|
{
|
|
@@ -1661,79 +1708,79 @@ const timeSegmentButtonVariants = cva(
|
|
|
1661
1708
|
value: e,
|
|
1662
1709
|
onChange: (c) => t(c.target.value),
|
|
1663
1710
|
className: "w-12 h-12 text-center text-2xl border-b-2 border-primary bg-transparent focus:outline-none focus:border-primary",
|
|
1664
|
-
"aria-label":
|
|
1665
|
-
disabled:
|
|
1711
|
+
"aria-label": o || n,
|
|
1712
|
+
disabled: s,
|
|
1666
1713
|
autoComplete: "off"
|
|
1667
1714
|
}
|
|
1668
1715
|
), AmPmSegment = ({
|
|
1669
1716
|
value: e,
|
|
1670
1717
|
onChange: t,
|
|
1671
|
-
disabled:
|
|
1672
|
-
}) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-1 ml-4", children: ["AM", "PM"].map((
|
|
1718
|
+
disabled: n
|
|
1719
|
+
}) => /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col gap-1 ml-4", children: ["AM", "PM"].map((o) => /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1673
1720
|
"button",
|
|
1674
1721
|
{
|
|
1675
1722
|
type: "button",
|
|
1676
1723
|
className: cn(
|
|
1677
1724
|
timeSegmentButtonVariants({
|
|
1678
|
-
active: e ===
|
|
1725
|
+
active: e === o,
|
|
1679
1726
|
size: "sm"
|
|
1680
1727
|
})
|
|
1681
1728
|
),
|
|
1682
|
-
"aria-pressed": e ===
|
|
1683
|
-
onClick: () => t(
|
|
1684
|
-
disabled:
|
|
1685
|
-
children:
|
|
1729
|
+
"aria-pressed": e === o,
|
|
1730
|
+
onClick: () => t(o),
|
|
1731
|
+
disabled: n,
|
|
1732
|
+
children: o
|
|
1686
1733
|
},
|
|
1687
|
-
|
|
1734
|
+
o
|
|
1688
1735
|
)) }), TimePickerInput = ({
|
|
1689
1736
|
value: e,
|
|
1690
1737
|
onChange: t,
|
|
1691
|
-
label:
|
|
1692
|
-
helperText:
|
|
1693
|
-
disabled:
|
|
1738
|
+
label: n,
|
|
1739
|
+
helperText: o,
|
|
1740
|
+
disabled: s,
|
|
1694
1741
|
error: c,
|
|
1695
|
-
placement:
|
|
1696
|
-
"aria-label":
|
|
1742
|
+
placement: u,
|
|
1743
|
+
"aria-label": a,
|
|
1697
1744
|
"aria-labelledby": r,
|
|
1698
|
-
"aria-describedby":
|
|
1745
|
+
"aria-describedby": i
|
|
1699
1746
|
}) => {
|
|
1700
|
-
const [x,
|
|
1701
|
-
const
|
|
1702
|
-
return
|
|
1703
|
-
hour:
|
|
1704
|
-
minute:
|
|
1705
|
-
period:
|
|
1747
|
+
const [x, l] = useState(!1), g = (k) => {
|
|
1748
|
+
const p = k.match(/^(\d{1,2}):(\d{2})\s?(AM|PM)$/i);
|
|
1749
|
+
return p ? {
|
|
1750
|
+
hour: p[1],
|
|
1751
|
+
minute: p[2],
|
|
1752
|
+
period: p[3].toUpperCase()
|
|
1706
1753
|
} : { hour: "", minute: "", period: "AM" };
|
|
1707
|
-
}, [{ hour:
|
|
1708
|
-
|
|
1754
|
+
}, [{ hour: d, minute: m, period: f }, h] = useState(() => g(e)), w = () => {
|
|
1755
|
+
s || (h(g(e)), l(!0));
|
|
1709
1756
|
}, y = (k) => {
|
|
1710
|
-
let
|
|
1711
|
-
|
|
1757
|
+
let p = k.replace(/[^\d]/g, "");
|
|
1758
|
+
p.length > 2 && (p = p.slice(0, 2)), Number(p) > 12 && (p = "12"), h((E) => ({ ...E, hour: p }));
|
|
1712
1759
|
}, j = (k) => {
|
|
1713
|
-
let
|
|
1714
|
-
|
|
1715
|
-
},
|
|
1716
|
-
h((
|
|
1717
|
-
},
|
|
1718
|
-
h(
|
|
1760
|
+
let p = k.replace(/[^\d]/g, "");
|
|
1761
|
+
p.length > 2 && (p = p.slice(0, 2)), Number(p) > 59 && (p = "59"), h((E) => ({ ...E, minute: p }));
|
|
1762
|
+
}, b = (k) => {
|
|
1763
|
+
h((p) => ({ ...p, period: k }));
|
|
1764
|
+
}, C = () => {
|
|
1765
|
+
h(g(e)), l(!1);
|
|
1719
1766
|
}, I = () => {
|
|
1720
|
-
const k =
|
|
1721
|
-
t(`${k}:${
|
|
1767
|
+
const k = d.padStart(2, "0") || "12", p = m.padStart(2, "0") || "00";
|
|
1768
|
+
t(`${k}:${p} ${f}`), l(!1);
|
|
1722
1769
|
};
|
|
1723
1770
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
|
|
1724
1771
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1725
1772
|
TextInput,
|
|
1726
1773
|
{
|
|
1727
|
-
label:
|
|
1774
|
+
label: n,
|
|
1728
1775
|
value: e,
|
|
1729
|
-
onClick:
|
|
1776
|
+
onClick: w,
|
|
1730
1777
|
readOnly: !0,
|
|
1731
|
-
disabled:
|
|
1778
|
+
disabled: s,
|
|
1732
1779
|
error: c,
|
|
1733
|
-
helperText:
|
|
1734
|
-
"aria-label":
|
|
1780
|
+
helperText: o,
|
|
1781
|
+
"aria-label": a,
|
|
1735
1782
|
"aria-labelledby": r,
|
|
1736
|
-
"aria-describedby":
|
|
1783
|
+
"aria-describedby": i,
|
|
1737
1784
|
className: "cursor-pointer bg-white",
|
|
1738
1785
|
rightContent: /* @__PURE__ */ jsxRuntimeExports.jsx(Icon, { as: Clock, size: "sm", color: "ghost" })
|
|
1739
1786
|
}
|
|
@@ -1742,23 +1789,23 @@ const timeSegmentButtonVariants = cva(
|
|
|
1742
1789
|
Modal,
|
|
1743
1790
|
{
|
|
1744
1791
|
isOpen: x,
|
|
1745
|
-
onOpenChange:
|
|
1746
|
-
placement:
|
|
1792
|
+
onOpenChange: l,
|
|
1793
|
+
placement: u,
|
|
1747
1794
|
size: "sm",
|
|
1748
|
-
"aria-label":
|
|
1795
|
+
"aria-label": a,
|
|
1749
1796
|
"aria-labelledby": r,
|
|
1750
|
-
"aria-describedby":
|
|
1797
|
+
"aria-describedby": i,
|
|
1751
1798
|
children: [
|
|
1752
1799
|
/* @__PURE__ */ jsxRuntimeExports.jsx(Modal.Header, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(Text, { as: "span", fontSize: "lg", fontWeight: "semibold", children: "Select time" }) }),
|
|
1753
1800
|
/* @__PURE__ */ jsxRuntimeExports.jsx(Modal.Body, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 justify-center py-2", children: [
|
|
1754
1801
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1755
1802
|
TimeField,
|
|
1756
1803
|
{
|
|
1757
|
-
value:
|
|
1804
|
+
value: d,
|
|
1758
1805
|
onChange: y,
|
|
1759
1806
|
label: "Hour",
|
|
1760
1807
|
"aria-label": "Hour",
|
|
1761
|
-
disabled:
|
|
1808
|
+
disabled: s
|
|
1762
1809
|
}
|
|
1763
1810
|
),
|
|
1764
1811
|
/* @__PURE__ */ jsxRuntimeExports.jsx(Text, { as: "span", fontSize: "2xl", className: "select-none", children: ":" }),
|
|
@@ -1769,20 +1816,20 @@ const timeSegmentButtonVariants = cva(
|
|
|
1769
1816
|
onChange: j,
|
|
1770
1817
|
label: "Minute",
|
|
1771
1818
|
"aria-label": "Minute",
|
|
1772
|
-
disabled:
|
|
1819
|
+
disabled: s
|
|
1773
1820
|
}
|
|
1774
1821
|
),
|
|
1775
1822
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1776
1823
|
AmPmSegment,
|
|
1777
1824
|
{
|
|
1778
|
-
value:
|
|
1779
|
-
onChange:
|
|
1780
|
-
disabled:
|
|
1825
|
+
value: f === "AM" ? "AM" : "PM",
|
|
1826
|
+
onChange: b,
|
|
1827
|
+
disabled: s
|
|
1781
1828
|
}
|
|
1782
1829
|
)
|
|
1783
1830
|
] }) }),
|
|
1784
1831
|
/* @__PURE__ */ jsxRuntimeExports.jsxs(Modal.Footer, { children: [
|
|
1785
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "ghost", size: "md", onClick:
|
|
1832
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "ghost", size: "md", onClick: C, children: "Cancel" }),
|
|
1786
1833
|
/* @__PURE__ */ jsxRuntimeExports.jsx(Button, { variant: "primary", size: "md", onClick: I, children: "Confirm" })
|
|
1787
1834
|
] })
|
|
1788
1835
|
]
|
|
@@ -1867,27 +1914,27 @@ const timeSegmentButtonVariants = cva(
|
|
|
1867
1914
|
), SwitchTrack = ({
|
|
1868
1915
|
color: e = "primary",
|
|
1869
1916
|
size: t = "md",
|
|
1870
|
-
disabled:
|
|
1871
|
-
className:
|
|
1872
|
-
checked:
|
|
1917
|
+
disabled: n = !1,
|
|
1918
|
+
className: o,
|
|
1919
|
+
checked: s
|
|
1873
1920
|
}) => /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1874
1921
|
"span",
|
|
1875
1922
|
{
|
|
1876
1923
|
className: cn(
|
|
1877
|
-
switchVariants({ color: e, size: t, disabled:
|
|
1924
|
+
switchVariants({ color: e, size: t, disabled: n, checked: s }),
|
|
1878
1925
|
"rounded-full pointer-events-none",
|
|
1879
|
-
|
|
1926
|
+
o
|
|
1880
1927
|
),
|
|
1881
1928
|
"aria-hidden": "true"
|
|
1882
1929
|
}
|
|
1883
|
-
), SwitchThumb = ({ size: e = "md", checked: t = !1 }) => /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn(thumbVariants({ size: e, checked: t })), "aria-hidden": "true" }), SwitchLabel = ({ label: e, htmlFor: t, placement:
|
|
1930
|
+
), SwitchThumb = ({ size: e = "md", checked: t = !1 }) => /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: cn(thumbVariants({ size: e, checked: t })), "aria-hidden": "true" }), SwitchLabel = ({ label: e, htmlFor: t, placement: n = "top", disabled: o = !1 }) => e ? /* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1884
1931
|
"label",
|
|
1885
1932
|
{
|
|
1886
1933
|
htmlFor: t,
|
|
1887
1934
|
className: cn(
|
|
1888
1935
|
"text-sm select-none font-medium text-foreground",
|
|
1889
|
-
|
|
1890
|
-
|
|
1936
|
+
n === "inline" ? "ml-2 mb-0" : "mb-1",
|
|
1937
|
+
o && "opacity-50 cursor-not-allowed"
|
|
1891
1938
|
),
|
|
1892
1939
|
children: e
|
|
1893
1940
|
}
|
|
@@ -1895,28 +1942,28 @@ const timeSegmentButtonVariants = cva(
|
|
|
1895
1942
|
({
|
|
1896
1943
|
checked: e,
|
|
1897
1944
|
defaultChecked: t,
|
|
1898
|
-
onCheckedChange:
|
|
1899
|
-
color:
|
|
1900
|
-
size:
|
|
1945
|
+
onCheckedChange: n,
|
|
1946
|
+
color: o = "primary",
|
|
1947
|
+
size: s = "md",
|
|
1901
1948
|
label: c,
|
|
1902
|
-
labelPlacement:
|
|
1903
|
-
disabled:
|
|
1949
|
+
labelPlacement: u = "top",
|
|
1950
|
+
disabled: a = !1,
|
|
1904
1951
|
className: r,
|
|
1905
|
-
id:
|
|
1952
|
+
id: i,
|
|
1906
1953
|
ariaLabel: x,
|
|
1907
|
-
...
|
|
1908
|
-
},
|
|
1909
|
-
const [
|
|
1954
|
+
...l
|
|
1955
|
+
}, g) => {
|
|
1956
|
+
const [d, m] = useState(
|
|
1910
1957
|
t ?? !1
|
|
1911
|
-
),
|
|
1912
|
-
|
|
1958
|
+
), f = useId(), h = i || f, w = typeof e == "boolean", y = w ? e : d, j = (b) => {
|
|
1959
|
+
w || m(b.target.checked), n?.(b.target.checked);
|
|
1913
1960
|
};
|
|
1914
1961
|
return /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
1915
1962
|
"div",
|
|
1916
1963
|
{
|
|
1917
1964
|
className: cn(
|
|
1918
1965
|
"flex flex-col",
|
|
1919
|
-
|
|
1966
|
+
u === "inline" && "flex-row items-center",
|
|
1920
1967
|
r
|
|
1921
1968
|
),
|
|
1922
1969
|
children: [
|
|
@@ -1925,8 +1972,8 @@ const timeSegmentButtonVariants = cva(
|
|
|
1925
1972
|
{
|
|
1926
1973
|
label: c,
|
|
1927
1974
|
htmlFor: h,
|
|
1928
|
-
placement:
|
|
1929
|
-
disabled:
|
|
1975
|
+
placement: u,
|
|
1976
|
+
disabled: a
|
|
1930
1977
|
}
|
|
1931
1978
|
),
|
|
1932
1979
|
/* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
@@ -1934,33 +1981,33 @@ const timeSegmentButtonVariants = cva(
|
|
|
1934
1981
|
{
|
|
1935
1982
|
className: cn(
|
|
1936
1983
|
"relative flex items-center",
|
|
1937
|
-
|
|
1984
|
+
u === "inline" && "ml-2"
|
|
1938
1985
|
),
|
|
1939
1986
|
children: [
|
|
1940
1987
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1941
1988
|
"input",
|
|
1942
1989
|
{
|
|
1943
|
-
ref:
|
|
1990
|
+
ref: g,
|
|
1944
1991
|
type: "checkbox",
|
|
1945
1992
|
id: h,
|
|
1946
1993
|
"aria-label": x || c,
|
|
1947
1994
|
checked: y,
|
|
1948
|
-
disabled:
|
|
1995
|
+
disabled: a,
|
|
1949
1996
|
onChange: j,
|
|
1950
1997
|
className: "absolute inset-0 w-full h-full opacity-0 cursor-pointer z-10",
|
|
1951
|
-
...
|
|
1998
|
+
...l
|
|
1952
1999
|
}
|
|
1953
2000
|
),
|
|
1954
2001
|
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
1955
2002
|
SwitchTrack,
|
|
1956
2003
|
{
|
|
1957
|
-
color:
|
|
1958
|
-
size:
|
|
1959
|
-
disabled:
|
|
2004
|
+
color: o,
|
|
2005
|
+
size: s,
|
|
2006
|
+
disabled: a,
|
|
1960
2007
|
checked: y
|
|
1961
2008
|
}
|
|
1962
2009
|
),
|
|
1963
|
-
/* @__PURE__ */ jsxRuntimeExports.jsx(SwitchThumb, { size:
|
|
2010
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(SwitchThumb, { size: s, checked: y })
|
|
1964
2011
|
]
|
|
1965
2012
|
}
|
|
1966
2013
|
)
|