@underverse-ui/underverse 0.1.8 → 0.1.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +2574 -125
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +118 -1
- package/dist/index.d.ts +118 -1
- package/dist/index.js +2554 -126
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -45,12 +45,25 @@ __export(index_exports, {
|
|
|
45
45
|
Checkbox: () => Checkbox,
|
|
46
46
|
ClientOnly: () => ClientOnly,
|
|
47
47
|
Combobox: () => Combobox,
|
|
48
|
+
CompactPagination: () => CompactPagination,
|
|
48
49
|
DataTable: () => DataTable_default,
|
|
49
50
|
DatePicker: () => DatePicker,
|
|
51
|
+
DateRangePicker: () => DateRangePicker,
|
|
50
52
|
DateUtils: () => date_exports,
|
|
51
53
|
Drawer: () => Drawer,
|
|
52
54
|
DropdownMenu: () => DropdownMenu_default,
|
|
53
55
|
FloatingContacts: () => FloatingContacts,
|
|
56
|
+
Form: () => Form,
|
|
57
|
+
FormActions: () => FormActions,
|
|
58
|
+
FormCheckbox: () => FormCheckbox,
|
|
59
|
+
FormControl: () => FormControl,
|
|
60
|
+
FormDescription: () => FormDescription,
|
|
61
|
+
FormField: () => FormField,
|
|
62
|
+
FormInput: () => FormInput,
|
|
63
|
+
FormItem: () => FormItem,
|
|
64
|
+
FormLabel: () => FormLabel,
|
|
65
|
+
FormMessage: () => FormMessage,
|
|
66
|
+
FormSubmitButton: () => FormSubmitButton,
|
|
54
67
|
GlobalLoading: () => GlobalLoading,
|
|
55
68
|
GradientBadge: () => GradientBadge,
|
|
56
69
|
ImageUpload: () => ImageUpload,
|
|
@@ -58,6 +71,8 @@ __export(index_exports, {
|
|
|
58
71
|
Input: () => Input_default,
|
|
59
72
|
InteractiveBadge: () => InteractiveBadge,
|
|
60
73
|
Label: () => Label,
|
|
74
|
+
LanguageSwitcher: () => LanguageSwitcherHeadless,
|
|
75
|
+
LanguageSwitcherHeadless: () => LanguageSwitcherHeadless,
|
|
61
76
|
LoadingBar: () => LoadingBar,
|
|
62
77
|
LoadingDots: () => LoadingDots,
|
|
63
78
|
LoadingSpinner: () => LoadingSpinner,
|
|
@@ -65,8 +80,10 @@ __export(index_exports, {
|
|
|
65
80
|
MultiCombobox: () => MultiCombobox,
|
|
66
81
|
NotificationBadge: () => NotificationBadge,
|
|
67
82
|
NotificationModal: () => NotificationModal_default,
|
|
83
|
+
NumberInput: () => NumberInput,
|
|
68
84
|
PageLoading: () => PageLoading,
|
|
69
85
|
Pagination: () => Pagination,
|
|
86
|
+
PasswordInput: () => PasswordInput,
|
|
70
87
|
PillTabs: () => PillTabs,
|
|
71
88
|
Popover: () => Popover,
|
|
72
89
|
Progress: () => Progress_default,
|
|
@@ -77,6 +94,7 @@ __export(index_exports, {
|
|
|
77
94
|
Section: () => Section_default,
|
|
78
95
|
Sheet: () => Sheet,
|
|
79
96
|
SidebarSheet: () => SidebarSheet,
|
|
97
|
+
SimplePagination: () => SimplePagination,
|
|
80
98
|
SimpleTabs: () => SimpleTabs,
|
|
81
99
|
Skeleton: () => Skeleton_default,
|
|
82
100
|
SlideOver: () => SlideOver,
|
|
@@ -95,6 +113,8 @@ __export(index_exports, {
|
|
|
95
113
|
Tabs: () => Tabs,
|
|
96
114
|
TagBadge: () => TagBadge,
|
|
97
115
|
Textarea: () => Textarea_default,
|
|
116
|
+
ThemeToggle: () => ThemeToggleHeadless,
|
|
117
|
+
ThemeToggleHeadless: () => ThemeToggleHeadless,
|
|
98
118
|
ToastProvider: () => Toast_default,
|
|
99
119
|
Tooltip: () => Tooltip,
|
|
100
120
|
VARIANT_STYLES_ALERT: () => VARIANT_STYLES_ALERT,
|
|
@@ -103,6 +123,7 @@ __export(index_exports, {
|
|
|
103
123
|
cn: () => cn,
|
|
104
124
|
getUnderverseMessages: () => getUnderverseMessages,
|
|
105
125
|
underverseMessages: () => underverseMessages,
|
|
126
|
+
useFormField: () => useFormField,
|
|
106
127
|
useToast: () => useToast
|
|
107
128
|
});
|
|
108
129
|
module.exports = __toCommonJS(index_exports);
|
|
@@ -3834,6 +3855,113 @@ var Pagination = ({
|
|
|
3834
3855
|
] })
|
|
3835
3856
|
] });
|
|
3836
3857
|
};
|
|
3858
|
+
var SimplePagination = ({
|
|
3859
|
+
page,
|
|
3860
|
+
totalPages,
|
|
3861
|
+
onChange,
|
|
3862
|
+
className,
|
|
3863
|
+
size = "md",
|
|
3864
|
+
variant = "outline",
|
|
3865
|
+
disabled = false,
|
|
3866
|
+
showInfo = false,
|
|
3867
|
+
totalItems,
|
|
3868
|
+
pageSize = 10
|
|
3869
|
+
}) => {
|
|
3870
|
+
if (totalPages <= 1) return null;
|
|
3871
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: cn("flex flex-col gap-2", className), children: [
|
|
3872
|
+
showInfo && totalItems && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "text-sm text-muted-foreground text-center", children: [
|
|
3873
|
+
"Page ",
|
|
3874
|
+
page,
|
|
3875
|
+
" of ",
|
|
3876
|
+
totalPages,
|
|
3877
|
+
" (",
|
|
3878
|
+
totalItems,
|
|
3879
|
+
" total items)"
|
|
3880
|
+
] }),
|
|
3881
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
3882
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Button_default, { variant, size, icon: import_lucide_react13.ChevronLeft, onClick: () => onChange(Math.max(1, page - 1)), disabled: disabled || page === 1, children: "Previous" }),
|
|
3883
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
|
|
3884
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: "Page" }),
|
|
3885
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "font-medium text-foreground", children: page }),
|
|
3886
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: "of" }),
|
|
3887
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "font-medium text-foreground", children: totalPages })
|
|
3888
|
+
] }),
|
|
3889
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3890
|
+
Button_default,
|
|
3891
|
+
{
|
|
3892
|
+
variant,
|
|
3893
|
+
size,
|
|
3894
|
+
iconRight: import_lucide_react13.ChevronRight,
|
|
3895
|
+
onClick: () => onChange(Math.min(totalPages, page + 1)),
|
|
3896
|
+
disabled: disabled || page === totalPages,
|
|
3897
|
+
children: "Next"
|
|
3898
|
+
}
|
|
3899
|
+
)
|
|
3900
|
+
] })
|
|
3901
|
+
] });
|
|
3902
|
+
};
|
|
3903
|
+
var CompactPagination = ({
|
|
3904
|
+
page,
|
|
3905
|
+
totalPages,
|
|
3906
|
+
onChange,
|
|
3907
|
+
className,
|
|
3908
|
+
variant = "outline",
|
|
3909
|
+
disabled = false
|
|
3910
|
+
}) => {
|
|
3911
|
+
if (totalPages <= 1) return null;
|
|
3912
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("nav", { className: cn("flex items-center gap-1", className), "aria-label": "Compact Pagination", children: [
|
|
3913
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3914
|
+
Button_default,
|
|
3915
|
+
{
|
|
3916
|
+
variant,
|
|
3917
|
+
size: "icon",
|
|
3918
|
+
icon: import_lucide_react13.ChevronsLeft,
|
|
3919
|
+
onClick: () => onChange(1),
|
|
3920
|
+
disabled: disabled || page === 1,
|
|
3921
|
+
title: "First page",
|
|
3922
|
+
"aria-label": "First page"
|
|
3923
|
+
}
|
|
3924
|
+
),
|
|
3925
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3926
|
+
Button_default,
|
|
3927
|
+
{
|
|
3928
|
+
variant,
|
|
3929
|
+
size: "icon",
|
|
3930
|
+
icon: import_lucide_react13.ChevronLeft,
|
|
3931
|
+
onClick: () => onChange(Math.max(1, page - 1)),
|
|
3932
|
+
disabled: disabled || page === 1,
|
|
3933
|
+
title: "Previous page"
|
|
3934
|
+
}
|
|
3935
|
+
),
|
|
3936
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "px-2 py-1 text-sm text-muted-foreground min-w-[4rem] text-center", children: [
|
|
3937
|
+
page,
|
|
3938
|
+
" / ",
|
|
3939
|
+
totalPages
|
|
3940
|
+
] }),
|
|
3941
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3942
|
+
Button_default,
|
|
3943
|
+
{
|
|
3944
|
+
variant,
|
|
3945
|
+
size: "icon",
|
|
3946
|
+
icon: import_lucide_react13.ChevronRight,
|
|
3947
|
+
onClick: () => onChange(Math.min(totalPages, page + 1)),
|
|
3948
|
+
disabled: disabled || page === totalPages,
|
|
3949
|
+
title: "Next page"
|
|
3950
|
+
}
|
|
3951
|
+
),
|
|
3952
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
3953
|
+
Button_default,
|
|
3954
|
+
{
|
|
3955
|
+
variant,
|
|
3956
|
+
size: "icon",
|
|
3957
|
+
icon: import_lucide_react13.ChevronsRight,
|
|
3958
|
+
onClick: () => onChange(totalPages),
|
|
3959
|
+
disabled: disabled || page === totalPages,
|
|
3960
|
+
title: "Last page"
|
|
3961
|
+
}
|
|
3962
|
+
)
|
|
3963
|
+
] });
|
|
3964
|
+
};
|
|
3837
3965
|
|
|
3838
3966
|
// ../../components/ui/Section.tsx
|
|
3839
3967
|
var import_react11 = __toESM(require("react"), 1);
|
|
@@ -4296,6 +4424,215 @@ var DatePicker = ({
|
|
|
4296
4424
|
isOpen && dropdownPosition && typeof window !== "undefined" && (0, import_react_dom7.createPortal)(datePickerContent, document.body)
|
|
4297
4425
|
] });
|
|
4298
4426
|
};
|
|
4427
|
+
var DateRangePicker = ({ startDate, endDate, onChange, placeholder = "Select date range...", className }) => {
|
|
4428
|
+
const [isOpen, setIsOpen] = React21.useState(false);
|
|
4429
|
+
const [dropdownPosition, setDropdownPosition] = React21.useState(null);
|
|
4430
|
+
const triggerRef = React21.useRef(null);
|
|
4431
|
+
const panelRef = React21.useRef(null);
|
|
4432
|
+
const [viewDate, setViewDate] = React21.useState(startDate || /* @__PURE__ */ new Date());
|
|
4433
|
+
const [tempStart, setTempStart] = React21.useState(startDate || null);
|
|
4434
|
+
const [tempEnd, setTempEnd] = React21.useState(endDate || null);
|
|
4435
|
+
const [hoveredDate, setHoveredDate] = React21.useState(null);
|
|
4436
|
+
React21.useEffect(() => {
|
|
4437
|
+
setTempStart(startDate || null);
|
|
4438
|
+
}, [startDate]);
|
|
4439
|
+
React21.useEffect(() => {
|
|
4440
|
+
setTempEnd(endDate || null);
|
|
4441
|
+
}, [endDate]);
|
|
4442
|
+
const calculatePosition = React21.useCallback(() => {
|
|
4443
|
+
if (!triggerRef.current) return null;
|
|
4444
|
+
const rect = triggerRef.current.getBoundingClientRect();
|
|
4445
|
+
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
|
|
4446
|
+
const scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
|
|
4447
|
+
return { top: rect.bottom + scrollTop + 4, left: rect.left + scrollLeft, width: rect.width };
|
|
4448
|
+
}, []);
|
|
4449
|
+
React21.useEffect(() => {
|
|
4450
|
+
if (!isOpen) return;
|
|
4451
|
+
const handler = () => {
|
|
4452
|
+
const pos = calculatePosition();
|
|
4453
|
+
if (pos) setDropdownPosition(pos);
|
|
4454
|
+
};
|
|
4455
|
+
window.addEventListener("resize", handler);
|
|
4456
|
+
window.addEventListener("scroll", handler, true);
|
|
4457
|
+
return () => {
|
|
4458
|
+
window.removeEventListener("resize", handler);
|
|
4459
|
+
window.removeEventListener("scroll", handler, true);
|
|
4460
|
+
};
|
|
4461
|
+
}, [isOpen, calculatePosition]);
|
|
4462
|
+
React21.useEffect(() => {
|
|
4463
|
+
if (!isOpen) return;
|
|
4464
|
+
const handleClickOutside = (event) => {
|
|
4465
|
+
if (triggerRef.current && !triggerRef.current.contains(event.target) && panelRef.current && !panelRef.current.contains(event.target)) {
|
|
4466
|
+
setIsOpen(false);
|
|
4467
|
+
}
|
|
4468
|
+
};
|
|
4469
|
+
const handleEscape = (event) => {
|
|
4470
|
+
if (event.key === "Escape") setIsOpen(false);
|
|
4471
|
+
};
|
|
4472
|
+
document.addEventListener("mousedown", handleClickOutside);
|
|
4473
|
+
document.addEventListener("keydown", handleEscape);
|
|
4474
|
+
return () => {
|
|
4475
|
+
document.removeEventListener("mousedown", handleClickOutside);
|
|
4476
|
+
document.removeEventListener("keydown", handleEscape);
|
|
4477
|
+
};
|
|
4478
|
+
}, [isOpen]);
|
|
4479
|
+
const isSameDay = (a, b) => {
|
|
4480
|
+
if (!a || !b) return false;
|
|
4481
|
+
return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
|
|
4482
|
+
};
|
|
4483
|
+
const inRange = (d, s, e) => d > s && d < e;
|
|
4484
|
+
const getDaysInMonth = (d) => new Date(d.getFullYear(), d.getMonth() + 1, 0).getDate();
|
|
4485
|
+
const getFirstDayOfMonth = (d) => new Date(d.getFullYear(), d.getMonth(), 1).getDay();
|
|
4486
|
+
const handleSelect = (date) => {
|
|
4487
|
+
if (!tempStart || tempStart && tempEnd) {
|
|
4488
|
+
setTempStart(date);
|
|
4489
|
+
setTempEnd(null);
|
|
4490
|
+
setHoveredDate(null);
|
|
4491
|
+
} else if (tempStart && !tempEnd) {
|
|
4492
|
+
if (date < tempStart) {
|
|
4493
|
+
setTempStart(date);
|
|
4494
|
+
} else {
|
|
4495
|
+
setTempEnd(date);
|
|
4496
|
+
onChange(tempStart, date);
|
|
4497
|
+
setIsOpen(false);
|
|
4498
|
+
}
|
|
4499
|
+
}
|
|
4500
|
+
};
|
|
4501
|
+
const renderGrid = () => {
|
|
4502
|
+
const nodes = [];
|
|
4503
|
+
const daysInMonth = getDaysInMonth(viewDate);
|
|
4504
|
+
const firstDay = getFirstDayOfMonth(viewDate);
|
|
4505
|
+
for (let i = 0; i < firstDay; i++) nodes.push(/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "w-8 h-8" }, `e-${i}`));
|
|
4506
|
+
for (let d = 1; d <= daysInMonth; d++) {
|
|
4507
|
+
const date = new Date(viewDate.getFullYear(), viewDate.getMonth(), d);
|
|
4508
|
+
const isSelectedStart = isSameDay(date, tempStart);
|
|
4509
|
+
const isSelectedEnd = isSameDay(date, tempEnd);
|
|
4510
|
+
const isHovering = hoveredDate && tempStart && !tempEnd;
|
|
4511
|
+
let isInRange = false;
|
|
4512
|
+
let isRangeStart = false;
|
|
4513
|
+
let isRangeEnd = false;
|
|
4514
|
+
if (tempStart && tempEnd) {
|
|
4515
|
+
if (isSameDay(date, tempStart)) isRangeStart = true;
|
|
4516
|
+
if (isSameDay(date, tempEnd)) isRangeEnd = true;
|
|
4517
|
+
if (inRange(date, tempStart, tempEnd)) isInRange = true;
|
|
4518
|
+
} else if (isHovering) {
|
|
4519
|
+
if (hoveredDate > tempStart) {
|
|
4520
|
+
if (isSameDay(date, tempStart)) isRangeStart = true;
|
|
4521
|
+
if (isSameDay(date, hoveredDate)) isRangeEnd = true;
|
|
4522
|
+
if (inRange(date, tempStart, hoveredDate)) isInRange = true;
|
|
4523
|
+
} else {
|
|
4524
|
+
if (isSameDay(date, hoveredDate)) isRangeStart = true;
|
|
4525
|
+
if (isSameDay(date, tempStart)) isRangeEnd = true;
|
|
4526
|
+
if (inRange(date, hoveredDate, tempStart)) isInRange = true;
|
|
4527
|
+
}
|
|
4528
|
+
}
|
|
4529
|
+
nodes.push(
|
|
4530
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
4531
|
+
"button",
|
|
4532
|
+
{
|
|
4533
|
+
onClick: () => handleSelect(date),
|
|
4534
|
+
onMouseEnter: () => tempStart && !tempEnd && setHoveredDate(date),
|
|
4535
|
+
onMouseLeave: () => tempStart && !tempEnd && setHoveredDate(null),
|
|
4536
|
+
className: cn(
|
|
4537
|
+
"w-8 h-8 text-sm transition-all duration-200 focus:outline-none relative font-medium",
|
|
4538
|
+
// Default state
|
|
4539
|
+
!isInRange && !isRangeStart && !isRangeEnd && "hover:bg-accent hover:text-accent-foreground rounded-md",
|
|
4540
|
+
// Range selection styling - smooth continuous background
|
|
4541
|
+
isInRange && "bg-primary/15 text-foreground shadow-sm",
|
|
4542
|
+
(isRangeStart || isRangeEnd) && "bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm",
|
|
4543
|
+
// Only round the actual start and end of the range
|
|
4544
|
+
isRangeStart && !isRangeEnd && "rounded-l-md rounded-r-none",
|
|
4545
|
+
isRangeEnd && !isRangeStart && "rounded-r-md rounded-l-none",
|
|
4546
|
+
isRangeStart && isRangeEnd && "rounded-md",
|
|
4547
|
+
// Single day selection
|
|
4548
|
+
// Hover effects for range
|
|
4549
|
+
isInRange && "hover:bg-primary/25",
|
|
4550
|
+
"focus:bg-accent focus:text-accent-foreground focus:z-10 focus:shadow-md"
|
|
4551
|
+
),
|
|
4552
|
+
children: d
|
|
4553
|
+
},
|
|
4554
|
+
d
|
|
4555
|
+
)
|
|
4556
|
+
);
|
|
4557
|
+
}
|
|
4558
|
+
return nodes;
|
|
4559
|
+
};
|
|
4560
|
+
const panel = isOpen && dropdownPosition ? /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
4561
|
+
"div",
|
|
4562
|
+
{
|
|
4563
|
+
style: { position: "absolute", top: dropdownPosition.top, left: dropdownPosition.left, width: dropdownPosition.width || 256, zIndex: 9999 },
|
|
4564
|
+
"data-state": isOpen ? "open" : "closed",
|
|
4565
|
+
className: cn(
|
|
4566
|
+
"z-[9999]",
|
|
4567
|
+
"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
|
|
4568
|
+
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95"
|
|
4569
|
+
),
|
|
4570
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
4571
|
+
"div",
|
|
4572
|
+
{
|
|
4573
|
+
ref: panelRef,
|
|
4574
|
+
className: cn("rounded-md border bg-popover text-popover-foreground shadow-md", "backdrop-blur-sm bg-popover/95 border-border/60 p-4 w-64"),
|
|
4575
|
+
children: [
|
|
4576
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex items-center justify-between mb-3", children: [
|
|
4577
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
4578
|
+
Button_default,
|
|
4579
|
+
{
|
|
4580
|
+
variant: "ghost",
|
|
4581
|
+
size: "sm",
|
|
4582
|
+
onClick: () => setViewDate(new Date(viewDate.getFullYear(), viewDate.getMonth() - 1, 1)),
|
|
4583
|
+
className: "p-1 h-auto",
|
|
4584
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react14.ChevronLeft, { className: "h-4 w-4" })
|
|
4585
|
+
}
|
|
4586
|
+
),
|
|
4587
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "text-sm font-semibold", children: viewDate.toLocaleDateString("en-US", { month: "long", year: "numeric" }) }),
|
|
4588
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
|
|
4589
|
+
Button_default,
|
|
4590
|
+
{
|
|
4591
|
+
variant: "ghost",
|
|
4592
|
+
size: "sm",
|
|
4593
|
+
onClick: () => setViewDate(new Date(viewDate.getFullYear(), viewDate.getMonth() + 1, 1)),
|
|
4594
|
+
className: "p-1 h-auto",
|
|
4595
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react14.ChevronRight, { className: "h-4 w-4" })
|
|
4596
|
+
}
|
|
4597
|
+
)
|
|
4598
|
+
] }),
|
|
4599
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "grid grid-cols-7 gap-1 mb-2", children: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"].map((d) => /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "text-xs text-muted-foreground text-center py-1 font-medium", children: d }, d)) }),
|
|
4600
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "grid grid-cols-7", children: renderGrid() })
|
|
4601
|
+
]
|
|
4602
|
+
}
|
|
4603
|
+
)
|
|
4604
|
+
}
|
|
4605
|
+
) : null;
|
|
4606
|
+
const displayFormat = (date) => formatDateShort(date);
|
|
4607
|
+
const label = tempStart && tempEnd ? `${displayFormat(tempStart)} - ${displayFormat(tempEnd)}` : tempStart ? `${displayFormat(tempStart)} - ...` : placeholder;
|
|
4608
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_jsx_runtime27.Fragment, { children: [
|
|
4609
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
|
|
4610
|
+
"button",
|
|
4611
|
+
{
|
|
4612
|
+
ref: triggerRef,
|
|
4613
|
+
type: "button",
|
|
4614
|
+
onClick: () => {
|
|
4615
|
+
const next = !isOpen;
|
|
4616
|
+
if (next) {
|
|
4617
|
+
const pos = calculatePosition();
|
|
4618
|
+
if (pos) setDropdownPosition(pos);
|
|
4619
|
+
}
|
|
4620
|
+
setIsOpen(next);
|
|
4621
|
+
},
|
|
4622
|
+
className: cn(
|
|
4623
|
+
"flex w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm",
|
|
4624
|
+
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
|
|
4625
|
+
className
|
|
4626
|
+
),
|
|
4627
|
+
children: [
|
|
4628
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: cn("truncate", !tempStart && !tempEnd && "text-muted-foreground"), children: label }),
|
|
4629
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react14.Calendar, { className: "h-4 w-4 text-muted-foreground ml-2" })
|
|
4630
|
+
]
|
|
4631
|
+
}
|
|
4632
|
+
),
|
|
4633
|
+
isOpen && dropdownPosition && typeof window !== "undefined" && (0, import_react_dom7.createPortal)(panel, document.body)
|
|
4634
|
+
] });
|
|
4635
|
+
};
|
|
4299
4636
|
|
|
4300
4637
|
// ../../components/ui/MultiCombobox.tsx
|
|
4301
4638
|
var React22 = __toESM(require("react"), 1);
|
|
@@ -6032,116 +6369,2014 @@ function DataTable({
|
|
|
6032
6369
|
}
|
|
6033
6370
|
var DataTable_default = DataTable;
|
|
6034
6371
|
|
|
6035
|
-
// ../../components/ui/
|
|
6036
|
-
var
|
|
6037
|
-
var import_next_intl8 = require("next-intl");
|
|
6038
|
-
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
6039
|
-
function NotificationModal({ isOpen, onClose, notification, titleText, openLinkText, closeText }) {
|
|
6040
|
-
const t = (0, import_next_intl8.useTranslations)("Common");
|
|
6041
|
-
if (!notification) return null;
|
|
6042
|
-
const formatTime2 = (dateString) => {
|
|
6043
|
-
const date = new Date(dateString);
|
|
6044
|
-
return date.toLocaleString(void 0, {
|
|
6045
|
-
year: "numeric",
|
|
6046
|
-
month: "2-digit",
|
|
6047
|
-
day: "2-digit",
|
|
6048
|
-
hour: "2-digit",
|
|
6049
|
-
minute: "2-digit"
|
|
6050
|
-
});
|
|
6051
|
-
};
|
|
6052
|
-
const hasLink = notification.metadata?.link;
|
|
6053
|
-
const handleLinkClick = () => {
|
|
6054
|
-
if (hasLink) {
|
|
6055
|
-
window.open(notification.metadata.link, "_blank");
|
|
6056
|
-
onClose();
|
|
6057
|
-
}
|
|
6058
|
-
};
|
|
6059
|
-
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
6060
|
-
Modal_default,
|
|
6061
|
-
{
|
|
6062
|
-
isOpen,
|
|
6063
|
-
onClose,
|
|
6064
|
-
title: titleText || t("notifications"),
|
|
6065
|
-
size: "md",
|
|
6066
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "space-y-4", children: [
|
|
6067
|
-
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "flex items-center gap-2 pb-2 border-b border-border", children: [
|
|
6068
|
-
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: cn(
|
|
6069
|
-
"w-2 h-2 rounded-full",
|
|
6070
|
-
!notification.is_read ? "bg-primary" : "bg-border"
|
|
6071
|
-
) }),
|
|
6072
|
-
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "text-xs text-muted-foreground", children: !notification.is_read ? t("newNotification") : t("readStatus") })
|
|
6073
|
-
] }),
|
|
6074
|
-
notification.title && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("h3", { className: "text-lg font-semibold text-foreground", children: notification.title }),
|
|
6075
|
-
notification.body && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "text-sm text-muted-foreground whitespace-pre-wrap leading-relaxed", children: notification.body }),
|
|
6076
|
-
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "text-xs text-muted-foreground border-t border-border pt-2", children: formatTime2(notification.created_at) }),
|
|
6077
|
-
/* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "flex gap-2 justify-end pt-2", children: [
|
|
6078
|
-
hasLink && /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
|
|
6079
|
-
Button_default,
|
|
6080
|
-
{
|
|
6081
|
-
variant: "primary",
|
|
6082
|
-
size: "sm",
|
|
6083
|
-
onClick: handleLinkClick,
|
|
6084
|
-
className: "gap-2",
|
|
6085
|
-
children: [
|
|
6086
|
-
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react21.ExternalLink, { className: "w-4 h-4" }),
|
|
6087
|
-
openLinkText || t("openLink")
|
|
6088
|
-
]
|
|
6089
|
-
}
|
|
6090
|
-
),
|
|
6091
|
-
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
6092
|
-
Button_default,
|
|
6093
|
-
{
|
|
6094
|
-
variant: "ghost",
|
|
6095
|
-
size: "sm",
|
|
6096
|
-
onClick: onClose,
|
|
6097
|
-
children: closeText || t("close")
|
|
6098
|
-
}
|
|
6099
|
-
)
|
|
6100
|
-
] })
|
|
6101
|
-
] })
|
|
6102
|
-
}
|
|
6103
|
-
);
|
|
6104
|
-
}
|
|
6105
|
-
var NotificationModal_default = NotificationModal;
|
|
6106
|
-
|
|
6107
|
-
// ../../components/ui/FloatingContacts.tsx
|
|
6108
|
-
var import_link2 = __toESM(require("next/link"), 1);
|
|
6109
|
-
var import_navigation = require("next/navigation");
|
|
6110
|
-
var import_lucide_react22 = require("lucide-react");
|
|
6111
|
-
|
|
6112
|
-
// ../../node_modules/react-icons/lib/iconBase.mjs
|
|
6113
|
-
var import_react22 = __toESM(require("react"), 1);
|
|
6372
|
+
// ../../components/ui/Form.tsx
|
|
6373
|
+
var React31 = __toESM(require("react"), 1);
|
|
6114
6374
|
|
|
6115
|
-
// ../../node_modules/react-
|
|
6375
|
+
// ../../node_modules/react-hook-form/dist/index.esm.mjs
|
|
6116
6376
|
var import_react21 = __toESM(require("react"), 1);
|
|
6117
|
-
var
|
|
6118
|
-
|
|
6119
|
-
|
|
6120
|
-
|
|
6121
|
-
|
|
6122
|
-
|
|
6377
|
+
var isCheckBoxInput = (element) => element.type === "checkbox";
|
|
6378
|
+
var isDateObject = (value) => value instanceof Date;
|
|
6379
|
+
var isNullOrUndefined = (value) => value == null;
|
|
6380
|
+
var isObjectType = (value) => typeof value === "object";
|
|
6381
|
+
var isObject = (value) => !isNullOrUndefined(value) && !Array.isArray(value) && isObjectType(value) && !isDateObject(value);
|
|
6382
|
+
var getEventValue = (event) => isObject(event) && event.target ? isCheckBoxInput(event.target) ? event.target.checked : event.target.value : event;
|
|
6383
|
+
var getNodeParentName = (name) => name.substring(0, name.search(/\.\d+(\.|$)/)) || name;
|
|
6384
|
+
var isNameInFieldArray = (names, name) => names.has(getNodeParentName(name));
|
|
6385
|
+
var isPlainObject = (tempObject) => {
|
|
6386
|
+
const prototypeCopy = tempObject.constructor && tempObject.constructor.prototype;
|
|
6387
|
+
return isObject(prototypeCopy) && prototypeCopy.hasOwnProperty("isPrototypeOf");
|
|
6123
6388
|
};
|
|
6124
|
-
var
|
|
6125
|
-
|
|
6126
|
-
|
|
6127
|
-
|
|
6128
|
-
|
|
6129
|
-
if (
|
|
6130
|
-
|
|
6131
|
-
|
|
6132
|
-
|
|
6133
|
-
|
|
6134
|
-
|
|
6135
|
-
|
|
6136
|
-
|
|
6137
|
-
|
|
6138
|
-
|
|
6389
|
+
var isWeb = typeof window !== "undefined" && typeof window.HTMLElement !== "undefined" && typeof document !== "undefined";
|
|
6390
|
+
function cloneObject(data) {
|
|
6391
|
+
let copy;
|
|
6392
|
+
const isArray = Array.isArray(data);
|
|
6393
|
+
const isFileListInstance = typeof FileList !== "undefined" ? data instanceof FileList : false;
|
|
6394
|
+
if (data instanceof Date) {
|
|
6395
|
+
copy = new Date(data);
|
|
6396
|
+
} else if (!(isWeb && (data instanceof Blob || isFileListInstance)) && (isArray || isObject(data))) {
|
|
6397
|
+
copy = isArray ? [] : Object.create(Object.getPrototypeOf(data));
|
|
6398
|
+
if (!isArray && !isPlainObject(data)) {
|
|
6399
|
+
copy = data;
|
|
6400
|
+
} else {
|
|
6401
|
+
for (const key in data) {
|
|
6402
|
+
if (data.hasOwnProperty(key)) {
|
|
6403
|
+
copy[key] = cloneObject(data[key]);
|
|
6404
|
+
}
|
|
6405
|
+
}
|
|
6139
6406
|
}
|
|
6407
|
+
} else {
|
|
6408
|
+
return data;
|
|
6140
6409
|
}
|
|
6141
|
-
return
|
|
6410
|
+
return copy;
|
|
6142
6411
|
}
|
|
6143
|
-
|
|
6144
|
-
|
|
6412
|
+
var isKey = (value) => /^\w*$/.test(value);
|
|
6413
|
+
var isUndefined = (val) => val === void 0;
|
|
6414
|
+
var compact = (value) => Array.isArray(value) ? value.filter(Boolean) : [];
|
|
6415
|
+
var stringToPath = (input) => compact(input.replace(/["|']|\]/g, "").split(/\.|\[/));
|
|
6416
|
+
var get = (object, path, defaultValue) => {
|
|
6417
|
+
if (!path || !isObject(object)) {
|
|
6418
|
+
return defaultValue;
|
|
6419
|
+
}
|
|
6420
|
+
const result = (isKey(path) ? [path] : stringToPath(path)).reduce((result2, key) => isNullOrUndefined(result2) ? result2 : result2[key], object);
|
|
6421
|
+
return isUndefined(result) || result === object ? isUndefined(object[path]) ? defaultValue : object[path] : result;
|
|
6422
|
+
};
|
|
6423
|
+
var isBoolean = (value) => typeof value === "boolean";
|
|
6424
|
+
var set = (object, path, value) => {
|
|
6425
|
+
let index = -1;
|
|
6426
|
+
const tempPath = isKey(path) ? [path] : stringToPath(path);
|
|
6427
|
+
const length = tempPath.length;
|
|
6428
|
+
const lastIndex = length - 1;
|
|
6429
|
+
while (++index < length) {
|
|
6430
|
+
const key = tempPath[index];
|
|
6431
|
+
let newValue = value;
|
|
6432
|
+
if (index !== lastIndex) {
|
|
6433
|
+
const objValue = object[key];
|
|
6434
|
+
newValue = isObject(objValue) || Array.isArray(objValue) ? objValue : !isNaN(+tempPath[index + 1]) ? [] : {};
|
|
6435
|
+
}
|
|
6436
|
+
if (key === "__proto__" || key === "constructor" || key === "prototype") {
|
|
6437
|
+
return;
|
|
6438
|
+
}
|
|
6439
|
+
object[key] = newValue;
|
|
6440
|
+
object = object[key];
|
|
6441
|
+
}
|
|
6442
|
+
};
|
|
6443
|
+
var EVENTS = {
|
|
6444
|
+
BLUR: "blur",
|
|
6445
|
+
FOCUS_OUT: "focusout",
|
|
6446
|
+
CHANGE: "change"
|
|
6447
|
+
};
|
|
6448
|
+
var VALIDATION_MODE = {
|
|
6449
|
+
onBlur: "onBlur",
|
|
6450
|
+
onChange: "onChange",
|
|
6451
|
+
onSubmit: "onSubmit",
|
|
6452
|
+
onTouched: "onTouched",
|
|
6453
|
+
all: "all"
|
|
6454
|
+
};
|
|
6455
|
+
var INPUT_VALIDATION_RULES = {
|
|
6456
|
+
max: "max",
|
|
6457
|
+
min: "min",
|
|
6458
|
+
maxLength: "maxLength",
|
|
6459
|
+
minLength: "minLength",
|
|
6460
|
+
pattern: "pattern",
|
|
6461
|
+
required: "required",
|
|
6462
|
+
validate: "validate"
|
|
6463
|
+
};
|
|
6464
|
+
var HookFormContext = import_react21.default.createContext(null);
|
|
6465
|
+
HookFormContext.displayName = "HookFormContext";
|
|
6466
|
+
var useFormContext = () => import_react21.default.useContext(HookFormContext);
|
|
6467
|
+
var FormProvider = (props) => {
|
|
6468
|
+
const { children, ...data } = props;
|
|
6469
|
+
return import_react21.default.createElement(HookFormContext.Provider, { value: data }, children);
|
|
6470
|
+
};
|
|
6471
|
+
var getProxyFormState = (formState, control, localProxyFormState, isRoot = true) => {
|
|
6472
|
+
const result = {
|
|
6473
|
+
defaultValues: control._defaultValues
|
|
6474
|
+
};
|
|
6475
|
+
for (const key in formState) {
|
|
6476
|
+
Object.defineProperty(result, key, {
|
|
6477
|
+
get: () => {
|
|
6478
|
+
const _key = key;
|
|
6479
|
+
if (control._proxyFormState[_key] !== VALIDATION_MODE.all) {
|
|
6480
|
+
control._proxyFormState[_key] = !isRoot || VALIDATION_MODE.all;
|
|
6481
|
+
}
|
|
6482
|
+
localProxyFormState && (localProxyFormState[_key] = true);
|
|
6483
|
+
return formState[_key];
|
|
6484
|
+
}
|
|
6485
|
+
});
|
|
6486
|
+
}
|
|
6487
|
+
return result;
|
|
6488
|
+
};
|
|
6489
|
+
var useIsomorphicLayoutEffect = typeof window !== "undefined" ? import_react21.default.useLayoutEffect : import_react21.default.useEffect;
|
|
6490
|
+
function useFormState(props) {
|
|
6491
|
+
const methods = useFormContext();
|
|
6492
|
+
const { control = methods.control, disabled, name, exact } = props || {};
|
|
6493
|
+
const [formState, updateFormState] = import_react21.default.useState(control._formState);
|
|
6494
|
+
const _localProxyFormState = import_react21.default.useRef({
|
|
6495
|
+
isDirty: false,
|
|
6496
|
+
isLoading: false,
|
|
6497
|
+
dirtyFields: false,
|
|
6498
|
+
touchedFields: false,
|
|
6499
|
+
validatingFields: false,
|
|
6500
|
+
isValidating: false,
|
|
6501
|
+
isValid: false,
|
|
6502
|
+
errors: false
|
|
6503
|
+
});
|
|
6504
|
+
useIsomorphicLayoutEffect(() => control._subscribe({
|
|
6505
|
+
name,
|
|
6506
|
+
formState: _localProxyFormState.current,
|
|
6507
|
+
exact,
|
|
6508
|
+
callback: (formState2) => {
|
|
6509
|
+
!disabled && updateFormState({
|
|
6510
|
+
...control._formState,
|
|
6511
|
+
...formState2
|
|
6512
|
+
});
|
|
6513
|
+
}
|
|
6514
|
+
}), [name, disabled, exact]);
|
|
6515
|
+
import_react21.default.useEffect(() => {
|
|
6516
|
+
_localProxyFormState.current.isValid && control._setValid(true);
|
|
6517
|
+
}, [control]);
|
|
6518
|
+
return import_react21.default.useMemo(() => getProxyFormState(formState, control, _localProxyFormState.current, false), [formState, control]);
|
|
6519
|
+
}
|
|
6520
|
+
var isString = (value) => typeof value === "string";
|
|
6521
|
+
var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) => {
|
|
6522
|
+
if (isString(names)) {
|
|
6523
|
+
isGlobal && _names.watch.add(names);
|
|
6524
|
+
return get(formValues, names, defaultValue);
|
|
6525
|
+
}
|
|
6526
|
+
if (Array.isArray(names)) {
|
|
6527
|
+
return names.map((fieldName) => (isGlobal && _names.watch.add(fieldName), get(formValues, fieldName)));
|
|
6528
|
+
}
|
|
6529
|
+
isGlobal && (_names.watchAll = true);
|
|
6530
|
+
return formValues;
|
|
6531
|
+
};
|
|
6532
|
+
var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
|
|
6533
|
+
function deepEqual(object1, object2, _internal_visited = /* @__PURE__ */ new WeakSet()) {
|
|
6534
|
+
if (isPrimitive(object1) || isPrimitive(object2)) {
|
|
6535
|
+
return object1 === object2;
|
|
6536
|
+
}
|
|
6537
|
+
if (isDateObject(object1) && isDateObject(object2)) {
|
|
6538
|
+
return object1.getTime() === object2.getTime();
|
|
6539
|
+
}
|
|
6540
|
+
const keys1 = Object.keys(object1);
|
|
6541
|
+
const keys2 = Object.keys(object2);
|
|
6542
|
+
if (keys1.length !== keys2.length) {
|
|
6543
|
+
return false;
|
|
6544
|
+
}
|
|
6545
|
+
if (_internal_visited.has(object1) || _internal_visited.has(object2)) {
|
|
6546
|
+
return true;
|
|
6547
|
+
}
|
|
6548
|
+
_internal_visited.add(object1);
|
|
6549
|
+
_internal_visited.add(object2);
|
|
6550
|
+
for (const key of keys1) {
|
|
6551
|
+
const val1 = object1[key];
|
|
6552
|
+
if (!keys2.includes(key)) {
|
|
6553
|
+
return false;
|
|
6554
|
+
}
|
|
6555
|
+
if (key !== "ref") {
|
|
6556
|
+
const val2 = object2[key];
|
|
6557
|
+
if (isDateObject(val1) && isDateObject(val2) || isObject(val1) && isObject(val2) || Array.isArray(val1) && Array.isArray(val2) ? !deepEqual(val1, val2, _internal_visited) : val1 !== val2) {
|
|
6558
|
+
return false;
|
|
6559
|
+
}
|
|
6560
|
+
}
|
|
6561
|
+
}
|
|
6562
|
+
return true;
|
|
6563
|
+
}
|
|
6564
|
+
function useWatch(props) {
|
|
6565
|
+
const methods = useFormContext();
|
|
6566
|
+
const { control = methods.control, name, defaultValue, disabled, exact, compute } = props || {};
|
|
6567
|
+
const _defaultValue = import_react21.default.useRef(defaultValue);
|
|
6568
|
+
const _compute = import_react21.default.useRef(compute);
|
|
6569
|
+
const _computeFormValues = import_react21.default.useRef(void 0);
|
|
6570
|
+
_compute.current = compute;
|
|
6571
|
+
const defaultValueMemo = import_react21.default.useMemo(() => control._getWatch(name, _defaultValue.current), [control, name]);
|
|
6572
|
+
const [value, updateValue] = import_react21.default.useState(_compute.current ? _compute.current(defaultValueMemo) : defaultValueMemo);
|
|
6573
|
+
useIsomorphicLayoutEffect(() => control._subscribe({
|
|
6574
|
+
name,
|
|
6575
|
+
formState: {
|
|
6576
|
+
values: true
|
|
6577
|
+
},
|
|
6578
|
+
exact,
|
|
6579
|
+
callback: (formState) => {
|
|
6580
|
+
if (!disabled) {
|
|
6581
|
+
const formValues = generateWatchOutput(name, control._names, formState.values || control._formValues, false, _defaultValue.current);
|
|
6582
|
+
if (_compute.current) {
|
|
6583
|
+
const computedFormValues = _compute.current(formValues);
|
|
6584
|
+
if (!deepEqual(computedFormValues, _computeFormValues.current)) {
|
|
6585
|
+
updateValue(computedFormValues);
|
|
6586
|
+
_computeFormValues.current = computedFormValues;
|
|
6587
|
+
}
|
|
6588
|
+
} else {
|
|
6589
|
+
updateValue(formValues);
|
|
6590
|
+
}
|
|
6591
|
+
}
|
|
6592
|
+
}
|
|
6593
|
+
}), [control, disabled, name, exact]);
|
|
6594
|
+
import_react21.default.useEffect(() => control._removeUnmounted());
|
|
6595
|
+
return value;
|
|
6596
|
+
}
|
|
6597
|
+
function useController(props) {
|
|
6598
|
+
const methods = useFormContext();
|
|
6599
|
+
const { name, disabled, control = methods.control, shouldUnregister, defaultValue } = props;
|
|
6600
|
+
const isArrayField = isNameInFieldArray(control._names.array, name);
|
|
6601
|
+
const defaultValueMemo = import_react21.default.useMemo(() => get(control._formValues, name, get(control._defaultValues, name, defaultValue)), [control, name, defaultValue]);
|
|
6602
|
+
const value = useWatch({
|
|
6603
|
+
control,
|
|
6604
|
+
name,
|
|
6605
|
+
defaultValue: defaultValueMemo,
|
|
6606
|
+
exact: true
|
|
6607
|
+
});
|
|
6608
|
+
const formState = useFormState({
|
|
6609
|
+
control,
|
|
6610
|
+
name,
|
|
6611
|
+
exact: true
|
|
6612
|
+
});
|
|
6613
|
+
const _props = import_react21.default.useRef(props);
|
|
6614
|
+
const _previousNameRef = import_react21.default.useRef(void 0);
|
|
6615
|
+
const _registerProps = import_react21.default.useRef(control.register(name, {
|
|
6616
|
+
...props.rules,
|
|
6617
|
+
value,
|
|
6618
|
+
...isBoolean(props.disabled) ? { disabled: props.disabled } : {}
|
|
6619
|
+
}));
|
|
6620
|
+
_props.current = props;
|
|
6621
|
+
const fieldState = import_react21.default.useMemo(() => Object.defineProperties({}, {
|
|
6622
|
+
invalid: {
|
|
6623
|
+
enumerable: true,
|
|
6624
|
+
get: () => !!get(formState.errors, name)
|
|
6625
|
+
},
|
|
6626
|
+
isDirty: {
|
|
6627
|
+
enumerable: true,
|
|
6628
|
+
get: () => !!get(formState.dirtyFields, name)
|
|
6629
|
+
},
|
|
6630
|
+
isTouched: {
|
|
6631
|
+
enumerable: true,
|
|
6632
|
+
get: () => !!get(formState.touchedFields, name)
|
|
6633
|
+
},
|
|
6634
|
+
isValidating: {
|
|
6635
|
+
enumerable: true,
|
|
6636
|
+
get: () => !!get(formState.validatingFields, name)
|
|
6637
|
+
},
|
|
6638
|
+
error: {
|
|
6639
|
+
enumerable: true,
|
|
6640
|
+
get: () => get(formState.errors, name)
|
|
6641
|
+
}
|
|
6642
|
+
}), [formState, name]);
|
|
6643
|
+
const onChange = import_react21.default.useCallback((event) => _registerProps.current.onChange({
|
|
6644
|
+
target: {
|
|
6645
|
+
value: getEventValue(event),
|
|
6646
|
+
name
|
|
6647
|
+
},
|
|
6648
|
+
type: EVENTS.CHANGE
|
|
6649
|
+
}), [name]);
|
|
6650
|
+
const onBlur = import_react21.default.useCallback(() => _registerProps.current.onBlur({
|
|
6651
|
+
target: {
|
|
6652
|
+
value: get(control._formValues, name),
|
|
6653
|
+
name
|
|
6654
|
+
},
|
|
6655
|
+
type: EVENTS.BLUR
|
|
6656
|
+
}), [name, control._formValues]);
|
|
6657
|
+
const ref = import_react21.default.useCallback((elm) => {
|
|
6658
|
+
const field2 = get(control._fields, name);
|
|
6659
|
+
if (field2 && elm) {
|
|
6660
|
+
field2._f.ref = {
|
|
6661
|
+
focus: () => elm.focus && elm.focus(),
|
|
6662
|
+
select: () => elm.select && elm.select(),
|
|
6663
|
+
setCustomValidity: (message) => elm.setCustomValidity(message),
|
|
6664
|
+
reportValidity: () => elm.reportValidity()
|
|
6665
|
+
};
|
|
6666
|
+
}
|
|
6667
|
+
}, [control._fields, name]);
|
|
6668
|
+
const field = import_react21.default.useMemo(() => ({
|
|
6669
|
+
name,
|
|
6670
|
+
value,
|
|
6671
|
+
...isBoolean(disabled) || formState.disabled ? { disabled: formState.disabled || disabled } : {},
|
|
6672
|
+
onChange,
|
|
6673
|
+
onBlur,
|
|
6674
|
+
ref
|
|
6675
|
+
}), [name, disabled, formState.disabled, onChange, onBlur, ref, value]);
|
|
6676
|
+
import_react21.default.useEffect(() => {
|
|
6677
|
+
const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
|
|
6678
|
+
const previousName = _previousNameRef.current;
|
|
6679
|
+
if (previousName && previousName !== name && !isArrayField) {
|
|
6680
|
+
control.unregister(previousName);
|
|
6681
|
+
}
|
|
6682
|
+
control.register(name, {
|
|
6683
|
+
..._props.current.rules,
|
|
6684
|
+
...isBoolean(_props.current.disabled) ? { disabled: _props.current.disabled } : {}
|
|
6685
|
+
});
|
|
6686
|
+
const updateMounted = (name2, value2) => {
|
|
6687
|
+
const field2 = get(control._fields, name2);
|
|
6688
|
+
if (field2 && field2._f) {
|
|
6689
|
+
field2._f.mount = value2;
|
|
6690
|
+
}
|
|
6691
|
+
};
|
|
6692
|
+
updateMounted(name, true);
|
|
6693
|
+
if (_shouldUnregisterField) {
|
|
6694
|
+
const value2 = cloneObject(get(control._options.defaultValues, name, _props.current.defaultValue));
|
|
6695
|
+
set(control._defaultValues, name, value2);
|
|
6696
|
+
if (isUndefined(get(control._formValues, name))) {
|
|
6697
|
+
set(control._formValues, name, value2);
|
|
6698
|
+
}
|
|
6699
|
+
}
|
|
6700
|
+
!isArrayField && control.register(name);
|
|
6701
|
+
_previousNameRef.current = name;
|
|
6702
|
+
return () => {
|
|
6703
|
+
(isArrayField ? _shouldUnregisterField && !control._state.action : _shouldUnregisterField) ? control.unregister(name) : updateMounted(name, false);
|
|
6704
|
+
};
|
|
6705
|
+
}, [name, control, isArrayField, shouldUnregister]);
|
|
6706
|
+
import_react21.default.useEffect(() => {
|
|
6707
|
+
control._setDisabledField({
|
|
6708
|
+
disabled,
|
|
6709
|
+
name
|
|
6710
|
+
});
|
|
6711
|
+
}, [disabled, name, control]);
|
|
6712
|
+
return import_react21.default.useMemo(() => ({
|
|
6713
|
+
field,
|
|
6714
|
+
formState,
|
|
6715
|
+
fieldState
|
|
6716
|
+
}), [field, formState, fieldState]);
|
|
6717
|
+
}
|
|
6718
|
+
var Controller = (props) => props.render(useController(props));
|
|
6719
|
+
var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => validateAllFieldCriteria ? {
|
|
6720
|
+
...errors[name],
|
|
6721
|
+
types: {
|
|
6722
|
+
...errors[name] && errors[name].types ? errors[name].types : {},
|
|
6723
|
+
[type]: message || true
|
|
6724
|
+
}
|
|
6725
|
+
} : {};
|
|
6726
|
+
var convertToArrayPayload = (value) => Array.isArray(value) ? value : [value];
|
|
6727
|
+
var createSubject = () => {
|
|
6728
|
+
let _observers = [];
|
|
6729
|
+
const next = (value) => {
|
|
6730
|
+
for (const observer of _observers) {
|
|
6731
|
+
observer.next && observer.next(value);
|
|
6732
|
+
}
|
|
6733
|
+
};
|
|
6734
|
+
const subscribe = (observer) => {
|
|
6735
|
+
_observers.push(observer);
|
|
6736
|
+
return {
|
|
6737
|
+
unsubscribe: () => {
|
|
6738
|
+
_observers = _observers.filter((o) => o !== observer);
|
|
6739
|
+
}
|
|
6740
|
+
};
|
|
6741
|
+
};
|
|
6742
|
+
const unsubscribe = () => {
|
|
6743
|
+
_observers = [];
|
|
6744
|
+
};
|
|
6745
|
+
return {
|
|
6746
|
+
get observers() {
|
|
6747
|
+
return _observers;
|
|
6748
|
+
},
|
|
6749
|
+
next,
|
|
6750
|
+
subscribe,
|
|
6751
|
+
unsubscribe
|
|
6752
|
+
};
|
|
6753
|
+
};
|
|
6754
|
+
function extractFormValues(fieldsState, formValues) {
|
|
6755
|
+
const values = {};
|
|
6756
|
+
for (const key in fieldsState) {
|
|
6757
|
+
if (fieldsState.hasOwnProperty(key)) {
|
|
6758
|
+
const fieldState = fieldsState[key];
|
|
6759
|
+
const fieldValue = formValues[key];
|
|
6760
|
+
if (fieldState && isObject(fieldState) && fieldValue) {
|
|
6761
|
+
const nestedFieldsState = extractFormValues(fieldState, fieldValue);
|
|
6762
|
+
if (isObject(nestedFieldsState)) {
|
|
6763
|
+
values[key] = nestedFieldsState;
|
|
6764
|
+
}
|
|
6765
|
+
} else if (fieldsState[key]) {
|
|
6766
|
+
values[key] = fieldValue;
|
|
6767
|
+
}
|
|
6768
|
+
}
|
|
6769
|
+
}
|
|
6770
|
+
return values;
|
|
6771
|
+
}
|
|
6772
|
+
var isEmptyObject = (value) => isObject(value) && !Object.keys(value).length;
|
|
6773
|
+
var isFileInput = (element) => element.type === "file";
|
|
6774
|
+
var isFunction = (value) => typeof value === "function";
|
|
6775
|
+
var isHTMLElement = (value) => {
|
|
6776
|
+
if (!isWeb) {
|
|
6777
|
+
return false;
|
|
6778
|
+
}
|
|
6779
|
+
const owner = value ? value.ownerDocument : 0;
|
|
6780
|
+
return value instanceof (owner && owner.defaultView ? owner.defaultView.HTMLElement : HTMLElement);
|
|
6781
|
+
};
|
|
6782
|
+
var isMultipleSelect = (element) => element.type === `select-multiple`;
|
|
6783
|
+
var isRadioInput = (element) => element.type === "radio";
|
|
6784
|
+
var isRadioOrCheckbox = (ref) => isRadioInput(ref) || isCheckBoxInput(ref);
|
|
6785
|
+
var live = (ref) => isHTMLElement(ref) && ref.isConnected;
|
|
6786
|
+
function baseGet(object, updatePath) {
|
|
6787
|
+
const length = updatePath.slice(0, -1).length;
|
|
6788
|
+
let index = 0;
|
|
6789
|
+
while (index < length) {
|
|
6790
|
+
object = isUndefined(object) ? index++ : object[updatePath[index++]];
|
|
6791
|
+
}
|
|
6792
|
+
return object;
|
|
6793
|
+
}
|
|
6794
|
+
function isEmptyArray(obj) {
|
|
6795
|
+
for (const key in obj) {
|
|
6796
|
+
if (obj.hasOwnProperty(key) && !isUndefined(obj[key])) {
|
|
6797
|
+
return false;
|
|
6798
|
+
}
|
|
6799
|
+
}
|
|
6800
|
+
return true;
|
|
6801
|
+
}
|
|
6802
|
+
function unset(object, path) {
|
|
6803
|
+
const paths = Array.isArray(path) ? path : isKey(path) ? [path] : stringToPath(path);
|
|
6804
|
+
const childObject = paths.length === 1 ? object : baseGet(object, paths);
|
|
6805
|
+
const index = paths.length - 1;
|
|
6806
|
+
const key = paths[index];
|
|
6807
|
+
if (childObject) {
|
|
6808
|
+
delete childObject[key];
|
|
6809
|
+
}
|
|
6810
|
+
if (index !== 0 && (isObject(childObject) && isEmptyObject(childObject) || Array.isArray(childObject) && isEmptyArray(childObject))) {
|
|
6811
|
+
unset(object, paths.slice(0, -1));
|
|
6812
|
+
}
|
|
6813
|
+
return object;
|
|
6814
|
+
}
|
|
6815
|
+
var objectHasFunction = (data) => {
|
|
6816
|
+
for (const key in data) {
|
|
6817
|
+
if (isFunction(data[key])) {
|
|
6818
|
+
return true;
|
|
6819
|
+
}
|
|
6820
|
+
}
|
|
6821
|
+
return false;
|
|
6822
|
+
};
|
|
6823
|
+
function isTraversable(value) {
|
|
6824
|
+
return Array.isArray(value) || isObject(value) && !objectHasFunction(value);
|
|
6825
|
+
}
|
|
6826
|
+
function markFieldsDirty(data, fields = {}) {
|
|
6827
|
+
for (const key in data) {
|
|
6828
|
+
if (isTraversable(data[key])) {
|
|
6829
|
+
fields[key] = Array.isArray(data[key]) ? [] : {};
|
|
6830
|
+
markFieldsDirty(data[key], fields[key]);
|
|
6831
|
+
} else if (!isUndefined(data[key])) {
|
|
6832
|
+
fields[key] = true;
|
|
6833
|
+
}
|
|
6834
|
+
}
|
|
6835
|
+
return fields;
|
|
6836
|
+
}
|
|
6837
|
+
function getDirtyFields(data, formValues, dirtyFieldsFromValues) {
|
|
6838
|
+
if (!dirtyFieldsFromValues) {
|
|
6839
|
+
dirtyFieldsFromValues = markFieldsDirty(formValues);
|
|
6840
|
+
}
|
|
6841
|
+
for (const key in data) {
|
|
6842
|
+
if (isTraversable(data[key])) {
|
|
6843
|
+
if (isUndefined(formValues) || isPrimitive(dirtyFieldsFromValues[key])) {
|
|
6844
|
+
dirtyFieldsFromValues[key] = markFieldsDirty(data[key], Array.isArray(data[key]) ? [] : {});
|
|
6845
|
+
} else {
|
|
6846
|
+
getDirtyFields(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
|
|
6847
|
+
}
|
|
6848
|
+
} else {
|
|
6849
|
+
dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]);
|
|
6850
|
+
}
|
|
6851
|
+
}
|
|
6852
|
+
return dirtyFieldsFromValues;
|
|
6853
|
+
}
|
|
6854
|
+
var defaultResult = {
|
|
6855
|
+
value: false,
|
|
6856
|
+
isValid: false
|
|
6857
|
+
};
|
|
6858
|
+
var validResult = { value: true, isValid: true };
|
|
6859
|
+
var getCheckboxValue = (options) => {
|
|
6860
|
+
if (Array.isArray(options)) {
|
|
6861
|
+
if (options.length > 1) {
|
|
6862
|
+
const values = options.filter((option) => option && option.checked && !option.disabled).map((option) => option.value);
|
|
6863
|
+
return { value: values, isValid: !!values.length };
|
|
6864
|
+
}
|
|
6865
|
+
return options[0].checked && !options[0].disabled ? (
|
|
6866
|
+
// @ts-expect-error expected to work in the browser
|
|
6867
|
+
options[0].attributes && !isUndefined(options[0].attributes.value) ? isUndefined(options[0].value) || options[0].value === "" ? validResult : { value: options[0].value, isValid: true } : validResult
|
|
6868
|
+
) : defaultResult;
|
|
6869
|
+
}
|
|
6870
|
+
return defaultResult;
|
|
6871
|
+
};
|
|
6872
|
+
var getFieldValueAs = (value, { valueAsNumber, valueAsDate, setValueAs }) => isUndefined(value) ? value : valueAsNumber ? value === "" ? NaN : value ? +value : value : valueAsDate && isString(value) ? new Date(value) : setValueAs ? setValueAs(value) : value;
|
|
6873
|
+
var defaultReturn = {
|
|
6874
|
+
isValid: false,
|
|
6875
|
+
value: null
|
|
6876
|
+
};
|
|
6877
|
+
var getRadioValue = (options) => Array.isArray(options) ? options.reduce((previous, option) => option && option.checked && !option.disabled ? {
|
|
6878
|
+
isValid: true,
|
|
6879
|
+
value: option.value
|
|
6880
|
+
} : previous, defaultReturn) : defaultReturn;
|
|
6881
|
+
function getFieldValue(_f) {
|
|
6882
|
+
const ref = _f.ref;
|
|
6883
|
+
if (isFileInput(ref)) {
|
|
6884
|
+
return ref.files;
|
|
6885
|
+
}
|
|
6886
|
+
if (isRadioInput(ref)) {
|
|
6887
|
+
return getRadioValue(_f.refs).value;
|
|
6888
|
+
}
|
|
6889
|
+
if (isMultipleSelect(ref)) {
|
|
6890
|
+
return [...ref.selectedOptions].map(({ value }) => value);
|
|
6891
|
+
}
|
|
6892
|
+
if (isCheckBoxInput(ref)) {
|
|
6893
|
+
return getCheckboxValue(_f.refs).value;
|
|
6894
|
+
}
|
|
6895
|
+
return getFieldValueAs(isUndefined(ref.value) ? _f.ref.value : ref.value, _f);
|
|
6896
|
+
}
|
|
6897
|
+
var getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeValidation) => {
|
|
6898
|
+
const fields = {};
|
|
6899
|
+
for (const name of fieldsNames) {
|
|
6900
|
+
const field = get(_fields, name);
|
|
6901
|
+
field && set(fields, name, field._f);
|
|
6902
|
+
}
|
|
6903
|
+
return {
|
|
6904
|
+
criteriaMode,
|
|
6905
|
+
names: [...fieldsNames],
|
|
6906
|
+
fields,
|
|
6907
|
+
shouldUseNativeValidation
|
|
6908
|
+
};
|
|
6909
|
+
};
|
|
6910
|
+
var isRegex = (value) => value instanceof RegExp;
|
|
6911
|
+
var getRuleValue = (rule) => isUndefined(rule) ? rule : isRegex(rule) ? rule.source : isObject(rule) ? isRegex(rule.value) ? rule.value.source : rule.value : rule;
|
|
6912
|
+
var getValidationModes = (mode) => ({
|
|
6913
|
+
isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit,
|
|
6914
|
+
isOnBlur: mode === VALIDATION_MODE.onBlur,
|
|
6915
|
+
isOnChange: mode === VALIDATION_MODE.onChange,
|
|
6916
|
+
isOnAll: mode === VALIDATION_MODE.all,
|
|
6917
|
+
isOnTouch: mode === VALIDATION_MODE.onTouched
|
|
6918
|
+
});
|
|
6919
|
+
var ASYNC_FUNCTION = "AsyncFunction";
|
|
6920
|
+
var hasPromiseValidation = (fieldReference) => !!fieldReference && !!fieldReference.validate && !!(isFunction(fieldReference.validate) && fieldReference.validate.constructor.name === ASYNC_FUNCTION || isObject(fieldReference.validate) && Object.values(fieldReference.validate).find((validateFunction) => validateFunction.constructor.name === ASYNC_FUNCTION));
|
|
6921
|
+
var hasValidation = (options) => options.mount && (options.required || options.min || options.max || options.maxLength || options.minLength || options.pattern || options.validate);
|
|
6922
|
+
var isWatched = (name, _names, isBlurEvent) => !isBlurEvent && (_names.watchAll || _names.watch.has(name) || [..._names.watch].some((watchName) => name.startsWith(watchName) && /^\.\w+/.test(name.slice(watchName.length))));
|
|
6923
|
+
var iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {
|
|
6924
|
+
for (const key of fieldsNames || Object.keys(fields)) {
|
|
6925
|
+
const field = get(fields, key);
|
|
6926
|
+
if (field) {
|
|
6927
|
+
const { _f, ...currentField } = field;
|
|
6928
|
+
if (_f) {
|
|
6929
|
+
if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {
|
|
6930
|
+
return true;
|
|
6931
|
+
} else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {
|
|
6932
|
+
return true;
|
|
6933
|
+
} else {
|
|
6934
|
+
if (iterateFieldsByAction(currentField, action)) {
|
|
6935
|
+
break;
|
|
6936
|
+
}
|
|
6937
|
+
}
|
|
6938
|
+
} else if (isObject(currentField)) {
|
|
6939
|
+
if (iterateFieldsByAction(currentField, action)) {
|
|
6940
|
+
break;
|
|
6941
|
+
}
|
|
6942
|
+
}
|
|
6943
|
+
}
|
|
6944
|
+
}
|
|
6945
|
+
return;
|
|
6946
|
+
};
|
|
6947
|
+
function schemaErrorLookup(errors, _fields, name) {
|
|
6948
|
+
const error = get(errors, name);
|
|
6949
|
+
if (error || isKey(name)) {
|
|
6950
|
+
return {
|
|
6951
|
+
error,
|
|
6952
|
+
name
|
|
6953
|
+
};
|
|
6954
|
+
}
|
|
6955
|
+
const names = name.split(".");
|
|
6956
|
+
while (names.length) {
|
|
6957
|
+
const fieldName = names.join(".");
|
|
6958
|
+
const field = get(_fields, fieldName);
|
|
6959
|
+
const foundError = get(errors, fieldName);
|
|
6960
|
+
if (field && !Array.isArray(field) && name !== fieldName) {
|
|
6961
|
+
return { name };
|
|
6962
|
+
}
|
|
6963
|
+
if (foundError && foundError.type) {
|
|
6964
|
+
return {
|
|
6965
|
+
name: fieldName,
|
|
6966
|
+
error: foundError
|
|
6967
|
+
};
|
|
6968
|
+
}
|
|
6969
|
+
if (foundError && foundError.root && foundError.root.type) {
|
|
6970
|
+
return {
|
|
6971
|
+
name: `${fieldName}.root`,
|
|
6972
|
+
error: foundError.root
|
|
6973
|
+
};
|
|
6974
|
+
}
|
|
6975
|
+
names.pop();
|
|
6976
|
+
}
|
|
6977
|
+
return {
|
|
6978
|
+
name
|
|
6979
|
+
};
|
|
6980
|
+
}
|
|
6981
|
+
var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, isRoot) => {
|
|
6982
|
+
updateFormState(formStateData);
|
|
6983
|
+
const { name, ...formState } = formStateData;
|
|
6984
|
+
return isEmptyObject(formState) || Object.keys(formState).length >= Object.keys(_proxyFormState).length || Object.keys(formState).find((key) => _proxyFormState[key] === (!isRoot || VALIDATION_MODE.all));
|
|
6985
|
+
};
|
|
6986
|
+
var shouldSubscribeByName = (name, signalName, exact) => !name || !signalName || name === signalName || convertToArrayPayload(name).some((currentName) => currentName && (exact ? currentName === signalName : currentName.startsWith(signalName) || signalName.startsWith(currentName)));
|
|
6987
|
+
var skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode) => {
|
|
6988
|
+
if (mode.isOnAll) {
|
|
6989
|
+
return false;
|
|
6990
|
+
} else if (!isSubmitted && mode.isOnTouch) {
|
|
6991
|
+
return !(isTouched || isBlurEvent);
|
|
6992
|
+
} else if (isSubmitted ? reValidateMode.isOnBlur : mode.isOnBlur) {
|
|
6993
|
+
return !isBlurEvent;
|
|
6994
|
+
} else if (isSubmitted ? reValidateMode.isOnChange : mode.isOnChange) {
|
|
6995
|
+
return isBlurEvent;
|
|
6996
|
+
}
|
|
6997
|
+
return true;
|
|
6998
|
+
};
|
|
6999
|
+
var unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(ref, name);
|
|
7000
|
+
var updateFieldArrayRootError = (errors, error, name) => {
|
|
7001
|
+
const fieldArrayErrors = convertToArrayPayload(get(errors, name));
|
|
7002
|
+
set(fieldArrayErrors, "root", error[name]);
|
|
7003
|
+
set(errors, name, fieldArrayErrors);
|
|
7004
|
+
return errors;
|
|
7005
|
+
};
|
|
7006
|
+
function getValidateError(result, ref, type = "validate") {
|
|
7007
|
+
if (isString(result) || Array.isArray(result) && result.every(isString) || isBoolean(result) && !result) {
|
|
7008
|
+
return {
|
|
7009
|
+
type,
|
|
7010
|
+
message: isString(result) ? result : "",
|
|
7011
|
+
ref
|
|
7012
|
+
};
|
|
7013
|
+
}
|
|
7014
|
+
}
|
|
7015
|
+
var getValueAndMessage = (validationData) => isObject(validationData) && !isRegex(validationData) ? validationData : {
|
|
7016
|
+
value: validationData,
|
|
7017
|
+
message: ""
|
|
7018
|
+
};
|
|
7019
|
+
var validateField = async (field, disabledFieldNames, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {
|
|
7020
|
+
const { ref, refs, required, maxLength, minLength, min, max, pattern, validate, name, valueAsNumber, mount } = field._f;
|
|
7021
|
+
const inputValue = get(formValues, name);
|
|
7022
|
+
if (!mount || disabledFieldNames.has(name)) {
|
|
7023
|
+
return {};
|
|
7024
|
+
}
|
|
7025
|
+
const inputRef = refs ? refs[0] : ref;
|
|
7026
|
+
const setCustomValidity = (message) => {
|
|
7027
|
+
if (shouldUseNativeValidation && inputRef.reportValidity) {
|
|
7028
|
+
inputRef.setCustomValidity(isBoolean(message) ? "" : message || "");
|
|
7029
|
+
inputRef.reportValidity();
|
|
7030
|
+
}
|
|
7031
|
+
};
|
|
7032
|
+
const error = {};
|
|
7033
|
+
const isRadio = isRadioInput(ref);
|
|
7034
|
+
const isCheckBox = isCheckBoxInput(ref);
|
|
7035
|
+
const isRadioOrCheckbox2 = isRadio || isCheckBox;
|
|
7036
|
+
const isEmpty = (valueAsNumber || isFileInput(ref)) && isUndefined(ref.value) && isUndefined(inputValue) || isHTMLElement(ref) && ref.value === "" || inputValue === "" || Array.isArray(inputValue) && !inputValue.length;
|
|
7037
|
+
const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error);
|
|
7038
|
+
const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => {
|
|
7039
|
+
const message = exceedMax ? maxLengthMessage : minLengthMessage;
|
|
7040
|
+
error[name] = {
|
|
7041
|
+
type: exceedMax ? maxType : minType,
|
|
7042
|
+
message,
|
|
7043
|
+
ref,
|
|
7044
|
+
...appendErrorsCurry(exceedMax ? maxType : minType, message)
|
|
7045
|
+
};
|
|
7046
|
+
};
|
|
7047
|
+
if (isFieldArray ? !Array.isArray(inputValue) || !inputValue.length : required && (!isRadioOrCheckbox2 && (isEmpty || isNullOrUndefined(inputValue)) || isBoolean(inputValue) && !inputValue || isCheckBox && !getCheckboxValue(refs).isValid || isRadio && !getRadioValue(refs).isValid)) {
|
|
7048
|
+
const { value, message } = isString(required) ? { value: !!required, message: required } : getValueAndMessage(required);
|
|
7049
|
+
if (value) {
|
|
7050
|
+
error[name] = {
|
|
7051
|
+
type: INPUT_VALIDATION_RULES.required,
|
|
7052
|
+
message,
|
|
7053
|
+
ref: inputRef,
|
|
7054
|
+
...appendErrorsCurry(INPUT_VALIDATION_RULES.required, message)
|
|
7055
|
+
};
|
|
7056
|
+
if (!validateAllFieldCriteria) {
|
|
7057
|
+
setCustomValidity(message);
|
|
7058
|
+
return error;
|
|
7059
|
+
}
|
|
7060
|
+
}
|
|
7061
|
+
}
|
|
7062
|
+
if (!isEmpty && (!isNullOrUndefined(min) || !isNullOrUndefined(max))) {
|
|
7063
|
+
let exceedMax;
|
|
7064
|
+
let exceedMin;
|
|
7065
|
+
const maxOutput = getValueAndMessage(max);
|
|
7066
|
+
const minOutput = getValueAndMessage(min);
|
|
7067
|
+
if (!isNullOrUndefined(inputValue) && !isNaN(inputValue)) {
|
|
7068
|
+
const valueNumber = ref.valueAsNumber || (inputValue ? +inputValue : inputValue);
|
|
7069
|
+
if (!isNullOrUndefined(maxOutput.value)) {
|
|
7070
|
+
exceedMax = valueNumber > maxOutput.value;
|
|
7071
|
+
}
|
|
7072
|
+
if (!isNullOrUndefined(minOutput.value)) {
|
|
7073
|
+
exceedMin = valueNumber < minOutput.value;
|
|
7074
|
+
}
|
|
7075
|
+
} else {
|
|
7076
|
+
const valueDate = ref.valueAsDate || new Date(inputValue);
|
|
7077
|
+
const convertTimeToDate = (time) => /* @__PURE__ */ new Date((/* @__PURE__ */ new Date()).toDateString() + " " + time);
|
|
7078
|
+
const isTime = ref.type == "time";
|
|
7079
|
+
const isWeek = ref.type == "week";
|
|
7080
|
+
if (isString(maxOutput.value) && inputValue) {
|
|
7081
|
+
exceedMax = isTime ? convertTimeToDate(inputValue) > convertTimeToDate(maxOutput.value) : isWeek ? inputValue > maxOutput.value : valueDate > new Date(maxOutput.value);
|
|
7082
|
+
}
|
|
7083
|
+
if (isString(minOutput.value) && inputValue) {
|
|
7084
|
+
exceedMin = isTime ? convertTimeToDate(inputValue) < convertTimeToDate(minOutput.value) : isWeek ? inputValue < minOutput.value : valueDate < new Date(minOutput.value);
|
|
7085
|
+
}
|
|
7086
|
+
}
|
|
7087
|
+
if (exceedMax || exceedMin) {
|
|
7088
|
+
getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min);
|
|
7089
|
+
if (!validateAllFieldCriteria) {
|
|
7090
|
+
setCustomValidity(error[name].message);
|
|
7091
|
+
return error;
|
|
7092
|
+
}
|
|
7093
|
+
}
|
|
7094
|
+
}
|
|
7095
|
+
if ((maxLength || minLength) && !isEmpty && (isString(inputValue) || isFieldArray && Array.isArray(inputValue))) {
|
|
7096
|
+
const maxLengthOutput = getValueAndMessage(maxLength);
|
|
7097
|
+
const minLengthOutput = getValueAndMessage(minLength);
|
|
7098
|
+
const exceedMax = !isNullOrUndefined(maxLengthOutput.value) && inputValue.length > +maxLengthOutput.value;
|
|
7099
|
+
const exceedMin = !isNullOrUndefined(minLengthOutput.value) && inputValue.length < +minLengthOutput.value;
|
|
7100
|
+
if (exceedMax || exceedMin) {
|
|
7101
|
+
getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);
|
|
7102
|
+
if (!validateAllFieldCriteria) {
|
|
7103
|
+
setCustomValidity(error[name].message);
|
|
7104
|
+
return error;
|
|
7105
|
+
}
|
|
7106
|
+
}
|
|
7107
|
+
}
|
|
7108
|
+
if (pattern && !isEmpty && isString(inputValue)) {
|
|
7109
|
+
const { value: patternValue, message } = getValueAndMessage(pattern);
|
|
7110
|
+
if (isRegex(patternValue) && !inputValue.match(patternValue)) {
|
|
7111
|
+
error[name] = {
|
|
7112
|
+
type: INPUT_VALIDATION_RULES.pattern,
|
|
7113
|
+
message,
|
|
7114
|
+
ref,
|
|
7115
|
+
...appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message)
|
|
7116
|
+
};
|
|
7117
|
+
if (!validateAllFieldCriteria) {
|
|
7118
|
+
setCustomValidity(message);
|
|
7119
|
+
return error;
|
|
7120
|
+
}
|
|
7121
|
+
}
|
|
7122
|
+
}
|
|
7123
|
+
if (validate) {
|
|
7124
|
+
if (isFunction(validate)) {
|
|
7125
|
+
const result = await validate(inputValue, formValues);
|
|
7126
|
+
const validateError = getValidateError(result, inputRef);
|
|
7127
|
+
if (validateError) {
|
|
7128
|
+
error[name] = {
|
|
7129
|
+
...validateError,
|
|
7130
|
+
...appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message)
|
|
7131
|
+
};
|
|
7132
|
+
if (!validateAllFieldCriteria) {
|
|
7133
|
+
setCustomValidity(validateError.message);
|
|
7134
|
+
return error;
|
|
7135
|
+
}
|
|
7136
|
+
}
|
|
7137
|
+
} else if (isObject(validate)) {
|
|
7138
|
+
let validationResult = {};
|
|
7139
|
+
for (const key in validate) {
|
|
7140
|
+
if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {
|
|
7141
|
+
break;
|
|
7142
|
+
}
|
|
7143
|
+
const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key);
|
|
7144
|
+
if (validateError) {
|
|
7145
|
+
validationResult = {
|
|
7146
|
+
...validateError,
|
|
7147
|
+
...appendErrorsCurry(key, validateError.message)
|
|
7148
|
+
};
|
|
7149
|
+
setCustomValidity(validateError.message);
|
|
7150
|
+
if (validateAllFieldCriteria) {
|
|
7151
|
+
error[name] = validationResult;
|
|
7152
|
+
}
|
|
7153
|
+
}
|
|
7154
|
+
}
|
|
7155
|
+
if (!isEmptyObject(validationResult)) {
|
|
7156
|
+
error[name] = {
|
|
7157
|
+
ref: inputRef,
|
|
7158
|
+
...validationResult
|
|
7159
|
+
};
|
|
7160
|
+
if (!validateAllFieldCriteria) {
|
|
7161
|
+
return error;
|
|
7162
|
+
}
|
|
7163
|
+
}
|
|
7164
|
+
}
|
|
7165
|
+
}
|
|
7166
|
+
setCustomValidity(true);
|
|
7167
|
+
return error;
|
|
7168
|
+
};
|
|
7169
|
+
var defaultOptions = {
|
|
7170
|
+
mode: VALIDATION_MODE.onSubmit,
|
|
7171
|
+
reValidateMode: VALIDATION_MODE.onChange,
|
|
7172
|
+
shouldFocusError: true
|
|
7173
|
+
};
|
|
7174
|
+
function createFormControl(props = {}) {
|
|
7175
|
+
let _options = {
|
|
7176
|
+
...defaultOptions,
|
|
7177
|
+
...props
|
|
7178
|
+
};
|
|
7179
|
+
let _formState = {
|
|
7180
|
+
submitCount: 0,
|
|
7181
|
+
isDirty: false,
|
|
7182
|
+
isReady: false,
|
|
7183
|
+
isLoading: isFunction(_options.defaultValues),
|
|
7184
|
+
isValidating: false,
|
|
7185
|
+
isSubmitted: false,
|
|
7186
|
+
isSubmitting: false,
|
|
7187
|
+
isSubmitSuccessful: false,
|
|
7188
|
+
isValid: false,
|
|
7189
|
+
touchedFields: {},
|
|
7190
|
+
dirtyFields: {},
|
|
7191
|
+
validatingFields: {},
|
|
7192
|
+
errors: _options.errors || {},
|
|
7193
|
+
disabled: _options.disabled || false
|
|
7194
|
+
};
|
|
7195
|
+
let _fields = {};
|
|
7196
|
+
let _defaultValues = isObject(_options.defaultValues) || isObject(_options.values) ? cloneObject(_options.defaultValues || _options.values) || {} : {};
|
|
7197
|
+
let _formValues = _options.shouldUnregister ? {} : cloneObject(_defaultValues);
|
|
7198
|
+
let _state = {
|
|
7199
|
+
action: false,
|
|
7200
|
+
mount: false,
|
|
7201
|
+
watch: false
|
|
7202
|
+
};
|
|
7203
|
+
let _names = {
|
|
7204
|
+
mount: /* @__PURE__ */ new Set(),
|
|
7205
|
+
disabled: /* @__PURE__ */ new Set(),
|
|
7206
|
+
unMount: /* @__PURE__ */ new Set(),
|
|
7207
|
+
array: /* @__PURE__ */ new Set(),
|
|
7208
|
+
watch: /* @__PURE__ */ new Set()
|
|
7209
|
+
};
|
|
7210
|
+
let delayErrorCallback;
|
|
7211
|
+
let timer = 0;
|
|
7212
|
+
const _proxyFormState = {
|
|
7213
|
+
isDirty: false,
|
|
7214
|
+
dirtyFields: false,
|
|
7215
|
+
validatingFields: false,
|
|
7216
|
+
touchedFields: false,
|
|
7217
|
+
isValidating: false,
|
|
7218
|
+
isValid: false,
|
|
7219
|
+
errors: false
|
|
7220
|
+
};
|
|
7221
|
+
let _proxySubscribeFormState = {
|
|
7222
|
+
..._proxyFormState
|
|
7223
|
+
};
|
|
7224
|
+
const _subjects = {
|
|
7225
|
+
array: createSubject(),
|
|
7226
|
+
state: createSubject()
|
|
7227
|
+
};
|
|
7228
|
+
const shouldDisplayAllAssociatedErrors = _options.criteriaMode === VALIDATION_MODE.all;
|
|
7229
|
+
const debounce = (callback) => (wait) => {
|
|
7230
|
+
clearTimeout(timer);
|
|
7231
|
+
timer = setTimeout(callback, wait);
|
|
7232
|
+
};
|
|
7233
|
+
const _setValid = async (shouldUpdateValid) => {
|
|
7234
|
+
if (!_options.disabled && (_proxyFormState.isValid || _proxySubscribeFormState.isValid || shouldUpdateValid)) {
|
|
7235
|
+
const isValid = _options.resolver ? isEmptyObject((await _runSchema()).errors) : await executeBuiltInValidation(_fields, true);
|
|
7236
|
+
if (isValid !== _formState.isValid) {
|
|
7237
|
+
_subjects.state.next({
|
|
7238
|
+
isValid
|
|
7239
|
+
});
|
|
7240
|
+
}
|
|
7241
|
+
}
|
|
7242
|
+
};
|
|
7243
|
+
const _updateIsValidating = (names, isValidating) => {
|
|
7244
|
+
if (!_options.disabled && (_proxyFormState.isValidating || _proxyFormState.validatingFields || _proxySubscribeFormState.isValidating || _proxySubscribeFormState.validatingFields)) {
|
|
7245
|
+
(names || Array.from(_names.mount)).forEach((name) => {
|
|
7246
|
+
if (name) {
|
|
7247
|
+
isValidating ? set(_formState.validatingFields, name, isValidating) : unset(_formState.validatingFields, name);
|
|
7248
|
+
}
|
|
7249
|
+
});
|
|
7250
|
+
_subjects.state.next({
|
|
7251
|
+
validatingFields: _formState.validatingFields,
|
|
7252
|
+
isValidating: !isEmptyObject(_formState.validatingFields)
|
|
7253
|
+
});
|
|
7254
|
+
}
|
|
7255
|
+
};
|
|
7256
|
+
const _setFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
|
|
7257
|
+
if (args && method && !_options.disabled) {
|
|
7258
|
+
_state.action = true;
|
|
7259
|
+
if (shouldUpdateFieldsAndState && Array.isArray(get(_fields, name))) {
|
|
7260
|
+
const fieldValues = method(get(_fields, name), args.argA, args.argB);
|
|
7261
|
+
shouldSetValues && set(_fields, name, fieldValues);
|
|
7262
|
+
}
|
|
7263
|
+
if (shouldUpdateFieldsAndState && Array.isArray(get(_formState.errors, name))) {
|
|
7264
|
+
const errors = method(get(_formState.errors, name), args.argA, args.argB);
|
|
7265
|
+
shouldSetValues && set(_formState.errors, name, errors);
|
|
7266
|
+
unsetEmptyArray(_formState.errors, name);
|
|
7267
|
+
}
|
|
7268
|
+
if ((_proxyFormState.touchedFields || _proxySubscribeFormState.touchedFields) && shouldUpdateFieldsAndState && Array.isArray(get(_formState.touchedFields, name))) {
|
|
7269
|
+
const touchedFields = method(get(_formState.touchedFields, name), args.argA, args.argB);
|
|
7270
|
+
shouldSetValues && set(_formState.touchedFields, name, touchedFields);
|
|
7271
|
+
}
|
|
7272
|
+
if (_proxyFormState.dirtyFields || _proxySubscribeFormState.dirtyFields) {
|
|
7273
|
+
_formState.dirtyFields = getDirtyFields(_defaultValues, _formValues);
|
|
7274
|
+
}
|
|
7275
|
+
_subjects.state.next({
|
|
7276
|
+
name,
|
|
7277
|
+
isDirty: _getDirty(name, values),
|
|
7278
|
+
dirtyFields: _formState.dirtyFields,
|
|
7279
|
+
errors: _formState.errors,
|
|
7280
|
+
isValid: _formState.isValid
|
|
7281
|
+
});
|
|
7282
|
+
} else {
|
|
7283
|
+
set(_formValues, name, values);
|
|
7284
|
+
}
|
|
7285
|
+
};
|
|
7286
|
+
const updateErrors = (name, error) => {
|
|
7287
|
+
set(_formState.errors, name, error);
|
|
7288
|
+
_subjects.state.next({
|
|
7289
|
+
errors: _formState.errors
|
|
7290
|
+
});
|
|
7291
|
+
};
|
|
7292
|
+
const _setErrors = (errors) => {
|
|
7293
|
+
_formState.errors = errors;
|
|
7294
|
+
_subjects.state.next({
|
|
7295
|
+
errors: _formState.errors,
|
|
7296
|
+
isValid: false
|
|
7297
|
+
});
|
|
7298
|
+
};
|
|
7299
|
+
const updateValidAndValue = (name, shouldSkipSetValueAs, value, ref) => {
|
|
7300
|
+
const field = get(_fields, name);
|
|
7301
|
+
if (field) {
|
|
7302
|
+
const defaultValue = get(_formValues, name, isUndefined(value) ? get(_defaultValues, name) : value);
|
|
7303
|
+
isUndefined(defaultValue) || ref && ref.defaultChecked || shouldSkipSetValueAs ? set(_formValues, name, shouldSkipSetValueAs ? defaultValue : getFieldValue(field._f)) : setFieldValue(name, defaultValue);
|
|
7304
|
+
_state.mount && _setValid();
|
|
7305
|
+
}
|
|
7306
|
+
};
|
|
7307
|
+
const updateTouchAndDirty = (name, fieldValue, isBlurEvent, shouldDirty, shouldRender) => {
|
|
7308
|
+
let shouldUpdateField = false;
|
|
7309
|
+
let isPreviousDirty = false;
|
|
7310
|
+
const output = {
|
|
7311
|
+
name
|
|
7312
|
+
};
|
|
7313
|
+
if (!_options.disabled) {
|
|
7314
|
+
if (!isBlurEvent || shouldDirty) {
|
|
7315
|
+
if (_proxyFormState.isDirty || _proxySubscribeFormState.isDirty) {
|
|
7316
|
+
isPreviousDirty = _formState.isDirty;
|
|
7317
|
+
_formState.isDirty = output.isDirty = _getDirty();
|
|
7318
|
+
shouldUpdateField = isPreviousDirty !== output.isDirty;
|
|
7319
|
+
}
|
|
7320
|
+
const isCurrentFieldPristine = deepEqual(get(_defaultValues, name), fieldValue);
|
|
7321
|
+
isPreviousDirty = !!get(_formState.dirtyFields, name);
|
|
7322
|
+
isCurrentFieldPristine ? unset(_formState.dirtyFields, name) : set(_formState.dirtyFields, name, true);
|
|
7323
|
+
output.dirtyFields = _formState.dirtyFields;
|
|
7324
|
+
shouldUpdateField = shouldUpdateField || (_proxyFormState.dirtyFields || _proxySubscribeFormState.dirtyFields) && isPreviousDirty !== !isCurrentFieldPristine;
|
|
7325
|
+
}
|
|
7326
|
+
if (isBlurEvent) {
|
|
7327
|
+
const isPreviousFieldTouched = get(_formState.touchedFields, name);
|
|
7328
|
+
if (!isPreviousFieldTouched) {
|
|
7329
|
+
set(_formState.touchedFields, name, isBlurEvent);
|
|
7330
|
+
output.touchedFields = _formState.touchedFields;
|
|
7331
|
+
shouldUpdateField = shouldUpdateField || (_proxyFormState.touchedFields || _proxySubscribeFormState.touchedFields) && isPreviousFieldTouched !== isBlurEvent;
|
|
7332
|
+
}
|
|
7333
|
+
}
|
|
7334
|
+
shouldUpdateField && shouldRender && _subjects.state.next(output);
|
|
7335
|
+
}
|
|
7336
|
+
return shouldUpdateField ? output : {};
|
|
7337
|
+
};
|
|
7338
|
+
const shouldRenderByError = (name, isValid, error, fieldState) => {
|
|
7339
|
+
const previousFieldError = get(_formState.errors, name);
|
|
7340
|
+
const shouldUpdateValid = (_proxyFormState.isValid || _proxySubscribeFormState.isValid) && isBoolean(isValid) && _formState.isValid !== isValid;
|
|
7341
|
+
if (_options.delayError && error) {
|
|
7342
|
+
delayErrorCallback = debounce(() => updateErrors(name, error));
|
|
7343
|
+
delayErrorCallback(_options.delayError);
|
|
7344
|
+
} else {
|
|
7345
|
+
clearTimeout(timer);
|
|
7346
|
+
delayErrorCallback = null;
|
|
7347
|
+
error ? set(_formState.errors, name, error) : unset(_formState.errors, name);
|
|
7348
|
+
}
|
|
7349
|
+
if ((error ? !deepEqual(previousFieldError, error) : previousFieldError) || !isEmptyObject(fieldState) || shouldUpdateValid) {
|
|
7350
|
+
const updatedFormState = {
|
|
7351
|
+
...fieldState,
|
|
7352
|
+
...shouldUpdateValid && isBoolean(isValid) ? { isValid } : {},
|
|
7353
|
+
errors: _formState.errors,
|
|
7354
|
+
name
|
|
7355
|
+
};
|
|
7356
|
+
_formState = {
|
|
7357
|
+
..._formState,
|
|
7358
|
+
...updatedFormState
|
|
7359
|
+
};
|
|
7360
|
+
_subjects.state.next(updatedFormState);
|
|
7361
|
+
}
|
|
7362
|
+
};
|
|
7363
|
+
const _runSchema = async (name) => {
|
|
7364
|
+
_updateIsValidating(name, true);
|
|
7365
|
+
const result = await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
|
|
7366
|
+
_updateIsValidating(name);
|
|
7367
|
+
return result;
|
|
7368
|
+
};
|
|
7369
|
+
const executeSchemaAndUpdateState = async (names) => {
|
|
7370
|
+
const { errors } = await _runSchema(names);
|
|
7371
|
+
if (names) {
|
|
7372
|
+
for (const name of names) {
|
|
7373
|
+
const error = get(errors, name);
|
|
7374
|
+
error ? set(_formState.errors, name, error) : unset(_formState.errors, name);
|
|
7375
|
+
}
|
|
7376
|
+
} else {
|
|
7377
|
+
_formState.errors = errors;
|
|
7378
|
+
}
|
|
7379
|
+
return errors;
|
|
7380
|
+
};
|
|
7381
|
+
const executeBuiltInValidation = async (fields, shouldOnlyCheckValid, context = {
|
|
7382
|
+
valid: true
|
|
7383
|
+
}) => {
|
|
7384
|
+
for (const name in fields) {
|
|
7385
|
+
const field = fields[name];
|
|
7386
|
+
if (field) {
|
|
7387
|
+
const { _f, ...fieldValue } = field;
|
|
7388
|
+
if (_f) {
|
|
7389
|
+
const isFieldArrayRoot = _names.array.has(_f.name);
|
|
7390
|
+
const isPromiseFunction = field._f && hasPromiseValidation(field._f);
|
|
7391
|
+
if (isPromiseFunction && _proxyFormState.validatingFields) {
|
|
7392
|
+
_updateIsValidating([_f.name], true);
|
|
7393
|
+
}
|
|
7394
|
+
const fieldError = await validateField(field, _names.disabled, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !shouldOnlyCheckValid, isFieldArrayRoot);
|
|
7395
|
+
if (isPromiseFunction && _proxyFormState.validatingFields) {
|
|
7396
|
+
_updateIsValidating([_f.name]);
|
|
7397
|
+
}
|
|
7398
|
+
if (fieldError[_f.name]) {
|
|
7399
|
+
context.valid = false;
|
|
7400
|
+
if (shouldOnlyCheckValid) {
|
|
7401
|
+
break;
|
|
7402
|
+
}
|
|
7403
|
+
}
|
|
7404
|
+
!shouldOnlyCheckValid && (get(fieldError, _f.name) ? isFieldArrayRoot ? updateFieldArrayRootError(_formState.errors, fieldError, _f.name) : set(_formState.errors, _f.name, fieldError[_f.name]) : unset(_formState.errors, _f.name));
|
|
7405
|
+
}
|
|
7406
|
+
!isEmptyObject(fieldValue) && await executeBuiltInValidation(fieldValue, shouldOnlyCheckValid, context);
|
|
7407
|
+
}
|
|
7408
|
+
}
|
|
7409
|
+
return context.valid;
|
|
7410
|
+
};
|
|
7411
|
+
const _removeUnmounted = () => {
|
|
7412
|
+
for (const name of _names.unMount) {
|
|
7413
|
+
const field = get(_fields, name);
|
|
7414
|
+
field && (field._f.refs ? field._f.refs.every((ref) => !live(ref)) : !live(field._f.ref)) && unregister(name);
|
|
7415
|
+
}
|
|
7416
|
+
_names.unMount = /* @__PURE__ */ new Set();
|
|
7417
|
+
};
|
|
7418
|
+
const _getDirty = (name, data) => !_options.disabled && (name && data && set(_formValues, name, data), !deepEqual(getValues(), _defaultValues));
|
|
7419
|
+
const _getWatch = (names, defaultValue, isGlobal) => generateWatchOutput(names, _names, {
|
|
7420
|
+
..._state.mount ? _formValues : isUndefined(defaultValue) ? _defaultValues : isString(names) ? { [names]: defaultValue } : defaultValue
|
|
7421
|
+
}, isGlobal, defaultValue);
|
|
7422
|
+
const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name, _options.shouldUnregister ? get(_defaultValues, name, []) : []));
|
|
7423
|
+
const setFieldValue = (name, value, options = {}) => {
|
|
7424
|
+
const field = get(_fields, name);
|
|
7425
|
+
let fieldValue = value;
|
|
7426
|
+
if (field) {
|
|
7427
|
+
const fieldReference = field._f;
|
|
7428
|
+
if (fieldReference) {
|
|
7429
|
+
!fieldReference.disabled && set(_formValues, name, getFieldValueAs(value, fieldReference));
|
|
7430
|
+
fieldValue = isHTMLElement(fieldReference.ref) && isNullOrUndefined(value) ? "" : value;
|
|
7431
|
+
if (isMultipleSelect(fieldReference.ref)) {
|
|
7432
|
+
[...fieldReference.ref.options].forEach((optionRef) => optionRef.selected = fieldValue.includes(optionRef.value));
|
|
7433
|
+
} else if (fieldReference.refs) {
|
|
7434
|
+
if (isCheckBoxInput(fieldReference.ref)) {
|
|
7435
|
+
fieldReference.refs.forEach((checkboxRef) => {
|
|
7436
|
+
if (!checkboxRef.defaultChecked || !checkboxRef.disabled) {
|
|
7437
|
+
if (Array.isArray(fieldValue)) {
|
|
7438
|
+
checkboxRef.checked = !!fieldValue.find((data) => data === checkboxRef.value);
|
|
7439
|
+
} else {
|
|
7440
|
+
checkboxRef.checked = fieldValue === checkboxRef.value || !!fieldValue;
|
|
7441
|
+
}
|
|
7442
|
+
}
|
|
7443
|
+
});
|
|
7444
|
+
} else {
|
|
7445
|
+
fieldReference.refs.forEach((radioRef) => radioRef.checked = radioRef.value === fieldValue);
|
|
7446
|
+
}
|
|
7447
|
+
} else if (isFileInput(fieldReference.ref)) {
|
|
7448
|
+
fieldReference.ref.value = "";
|
|
7449
|
+
} else {
|
|
7450
|
+
fieldReference.ref.value = fieldValue;
|
|
7451
|
+
if (!fieldReference.ref.type) {
|
|
7452
|
+
_subjects.state.next({
|
|
7453
|
+
name,
|
|
7454
|
+
values: cloneObject(_formValues)
|
|
7455
|
+
});
|
|
7456
|
+
}
|
|
7457
|
+
}
|
|
7458
|
+
}
|
|
7459
|
+
}
|
|
7460
|
+
(options.shouldDirty || options.shouldTouch) && updateTouchAndDirty(name, fieldValue, options.shouldTouch, options.shouldDirty, true);
|
|
7461
|
+
options.shouldValidate && trigger(name);
|
|
7462
|
+
};
|
|
7463
|
+
const setValues = (name, value, options) => {
|
|
7464
|
+
for (const fieldKey in value) {
|
|
7465
|
+
if (!value.hasOwnProperty(fieldKey)) {
|
|
7466
|
+
return;
|
|
7467
|
+
}
|
|
7468
|
+
const fieldValue = value[fieldKey];
|
|
7469
|
+
const fieldName = name + "." + fieldKey;
|
|
7470
|
+
const field = get(_fields, fieldName);
|
|
7471
|
+
(_names.array.has(name) || isObject(fieldValue) || field && !field._f) && !isDateObject(fieldValue) ? setValues(fieldName, fieldValue, options) : setFieldValue(fieldName, fieldValue, options);
|
|
7472
|
+
}
|
|
7473
|
+
};
|
|
7474
|
+
const setValue = (name, value, options = {}) => {
|
|
7475
|
+
const field = get(_fields, name);
|
|
7476
|
+
const isFieldArray = _names.array.has(name);
|
|
7477
|
+
const cloneValue = cloneObject(value);
|
|
7478
|
+
set(_formValues, name, cloneValue);
|
|
7479
|
+
if (isFieldArray) {
|
|
7480
|
+
_subjects.array.next({
|
|
7481
|
+
name,
|
|
7482
|
+
values: cloneObject(_formValues)
|
|
7483
|
+
});
|
|
7484
|
+
if ((_proxyFormState.isDirty || _proxyFormState.dirtyFields || _proxySubscribeFormState.isDirty || _proxySubscribeFormState.dirtyFields) && options.shouldDirty) {
|
|
7485
|
+
_subjects.state.next({
|
|
7486
|
+
name,
|
|
7487
|
+
dirtyFields: getDirtyFields(_defaultValues, _formValues),
|
|
7488
|
+
isDirty: _getDirty(name, cloneValue)
|
|
7489
|
+
});
|
|
7490
|
+
}
|
|
7491
|
+
} else {
|
|
7492
|
+
field && !field._f && !isNullOrUndefined(cloneValue) ? setValues(name, cloneValue, options) : setFieldValue(name, cloneValue, options);
|
|
7493
|
+
}
|
|
7494
|
+
isWatched(name, _names) && _subjects.state.next({ ..._formState, name });
|
|
7495
|
+
_subjects.state.next({
|
|
7496
|
+
name: _state.mount ? name : void 0,
|
|
7497
|
+
values: cloneObject(_formValues)
|
|
7498
|
+
});
|
|
7499
|
+
};
|
|
7500
|
+
const onChange = async (event) => {
|
|
7501
|
+
_state.mount = true;
|
|
7502
|
+
const target = event.target;
|
|
7503
|
+
let name = target.name;
|
|
7504
|
+
let isFieldValueUpdated = true;
|
|
7505
|
+
const field = get(_fields, name);
|
|
7506
|
+
const _updateIsFieldValueUpdated = (fieldValue) => {
|
|
7507
|
+
isFieldValueUpdated = Number.isNaN(fieldValue) || isDateObject(fieldValue) && isNaN(fieldValue.getTime()) || deepEqual(fieldValue, get(_formValues, name, fieldValue));
|
|
7508
|
+
};
|
|
7509
|
+
const validationModeBeforeSubmit = getValidationModes(_options.mode);
|
|
7510
|
+
const validationModeAfterSubmit = getValidationModes(_options.reValidateMode);
|
|
7511
|
+
if (field) {
|
|
7512
|
+
let error;
|
|
7513
|
+
let isValid;
|
|
7514
|
+
const fieldValue = target.type ? getFieldValue(field._f) : getEventValue(event);
|
|
7515
|
+
const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT;
|
|
7516
|
+
const shouldSkipValidation = !hasValidation(field._f) && !_options.resolver && !get(_formState.errors, name) && !field._f.deps || skipValidation(isBlurEvent, get(_formState.touchedFields, name), _formState.isSubmitted, validationModeAfterSubmit, validationModeBeforeSubmit);
|
|
7517
|
+
const watched = isWatched(name, _names, isBlurEvent);
|
|
7518
|
+
set(_formValues, name, fieldValue);
|
|
7519
|
+
if (isBlurEvent) {
|
|
7520
|
+
if (!target || !target.readOnly) {
|
|
7521
|
+
field._f.onBlur && field._f.onBlur(event);
|
|
7522
|
+
delayErrorCallback && delayErrorCallback(0);
|
|
7523
|
+
}
|
|
7524
|
+
} else if (field._f.onChange) {
|
|
7525
|
+
field._f.onChange(event);
|
|
7526
|
+
}
|
|
7527
|
+
const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent);
|
|
7528
|
+
const shouldRender = !isEmptyObject(fieldState) || watched;
|
|
7529
|
+
!isBlurEvent && _subjects.state.next({
|
|
7530
|
+
name,
|
|
7531
|
+
type: event.type,
|
|
7532
|
+
values: cloneObject(_formValues)
|
|
7533
|
+
});
|
|
7534
|
+
if (shouldSkipValidation) {
|
|
7535
|
+
if (_proxyFormState.isValid || _proxySubscribeFormState.isValid) {
|
|
7536
|
+
if (_options.mode === "onBlur") {
|
|
7537
|
+
if (isBlurEvent) {
|
|
7538
|
+
_setValid();
|
|
7539
|
+
}
|
|
7540
|
+
} else if (!isBlurEvent) {
|
|
7541
|
+
_setValid();
|
|
7542
|
+
}
|
|
7543
|
+
}
|
|
7544
|
+
return shouldRender && _subjects.state.next({ name, ...watched ? {} : fieldState });
|
|
7545
|
+
}
|
|
7546
|
+
!isBlurEvent && watched && _subjects.state.next({ ..._formState });
|
|
7547
|
+
if (_options.resolver) {
|
|
7548
|
+
const { errors } = await _runSchema([name]);
|
|
7549
|
+
_updateIsFieldValueUpdated(fieldValue);
|
|
7550
|
+
if (isFieldValueUpdated) {
|
|
7551
|
+
const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
|
|
7552
|
+
const errorLookupResult = schemaErrorLookup(errors, _fields, previousErrorLookupResult.name || name);
|
|
7553
|
+
error = errorLookupResult.error;
|
|
7554
|
+
name = errorLookupResult.name;
|
|
7555
|
+
isValid = isEmptyObject(errors);
|
|
7556
|
+
}
|
|
7557
|
+
} else {
|
|
7558
|
+
_updateIsValidating([name], true);
|
|
7559
|
+
error = (await validateField(field, _names.disabled, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];
|
|
7560
|
+
_updateIsValidating([name]);
|
|
7561
|
+
_updateIsFieldValueUpdated(fieldValue);
|
|
7562
|
+
if (isFieldValueUpdated) {
|
|
7563
|
+
if (error) {
|
|
7564
|
+
isValid = false;
|
|
7565
|
+
} else if (_proxyFormState.isValid || _proxySubscribeFormState.isValid) {
|
|
7566
|
+
isValid = await executeBuiltInValidation(_fields, true);
|
|
7567
|
+
}
|
|
7568
|
+
}
|
|
7569
|
+
}
|
|
7570
|
+
if (isFieldValueUpdated) {
|
|
7571
|
+
field._f.deps && (!Array.isArray(field._f.deps) || field._f.deps.length > 0) && trigger(field._f.deps);
|
|
7572
|
+
shouldRenderByError(name, isValid, error, fieldState);
|
|
7573
|
+
}
|
|
7574
|
+
}
|
|
7575
|
+
};
|
|
7576
|
+
const _focusInput = (ref, key) => {
|
|
7577
|
+
if (get(_formState.errors, key) && ref.focus) {
|
|
7578
|
+
ref.focus();
|
|
7579
|
+
return 1;
|
|
7580
|
+
}
|
|
7581
|
+
return;
|
|
7582
|
+
};
|
|
7583
|
+
const trigger = async (name, options = {}) => {
|
|
7584
|
+
let isValid;
|
|
7585
|
+
let validationResult;
|
|
7586
|
+
const fieldNames = convertToArrayPayload(name);
|
|
7587
|
+
if (_options.resolver) {
|
|
7588
|
+
const errors = await executeSchemaAndUpdateState(isUndefined(name) ? name : fieldNames);
|
|
7589
|
+
isValid = isEmptyObject(errors);
|
|
7590
|
+
validationResult = name ? !fieldNames.some((name2) => get(errors, name2)) : isValid;
|
|
7591
|
+
} else if (name) {
|
|
7592
|
+
validationResult = (await Promise.all(fieldNames.map(async (fieldName) => {
|
|
7593
|
+
const field = get(_fields, fieldName);
|
|
7594
|
+
return await executeBuiltInValidation(field && field._f ? { [fieldName]: field } : field);
|
|
7595
|
+
}))).every(Boolean);
|
|
7596
|
+
!(!validationResult && !_formState.isValid) && _setValid();
|
|
7597
|
+
} else {
|
|
7598
|
+
validationResult = isValid = await executeBuiltInValidation(_fields);
|
|
7599
|
+
}
|
|
7600
|
+
_subjects.state.next({
|
|
7601
|
+
...!isString(name) || (_proxyFormState.isValid || _proxySubscribeFormState.isValid) && isValid !== _formState.isValid ? {} : { name },
|
|
7602
|
+
..._options.resolver || !name ? { isValid } : {},
|
|
7603
|
+
errors: _formState.errors
|
|
7604
|
+
});
|
|
7605
|
+
options.shouldFocus && !validationResult && iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount);
|
|
7606
|
+
return validationResult;
|
|
7607
|
+
};
|
|
7608
|
+
const getValues = (fieldNames, config) => {
|
|
7609
|
+
let values = {
|
|
7610
|
+
..._state.mount ? _formValues : _defaultValues
|
|
7611
|
+
};
|
|
7612
|
+
if (config) {
|
|
7613
|
+
values = extractFormValues(config.dirtyFields ? _formState.dirtyFields : _formState.touchedFields, values);
|
|
7614
|
+
}
|
|
7615
|
+
return isUndefined(fieldNames) ? values : isString(fieldNames) ? get(values, fieldNames) : fieldNames.map((name) => get(values, name));
|
|
7616
|
+
};
|
|
7617
|
+
const getFieldState = (name, formState) => ({
|
|
7618
|
+
invalid: !!get((formState || _formState).errors, name),
|
|
7619
|
+
isDirty: !!get((formState || _formState).dirtyFields, name),
|
|
7620
|
+
error: get((formState || _formState).errors, name),
|
|
7621
|
+
isValidating: !!get(_formState.validatingFields, name),
|
|
7622
|
+
isTouched: !!get((formState || _formState).touchedFields, name)
|
|
7623
|
+
});
|
|
7624
|
+
const clearErrors = (name) => {
|
|
7625
|
+
name && convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName));
|
|
7626
|
+
_subjects.state.next({
|
|
7627
|
+
errors: name ? _formState.errors : {}
|
|
7628
|
+
});
|
|
7629
|
+
};
|
|
7630
|
+
const setError = (name, error, options) => {
|
|
7631
|
+
const ref = (get(_fields, name, { _f: {} })._f || {}).ref;
|
|
7632
|
+
const currentError = get(_formState.errors, name) || {};
|
|
7633
|
+
const { ref: currentRef, message, type, ...restOfErrorTree } = currentError;
|
|
7634
|
+
set(_formState.errors, name, {
|
|
7635
|
+
...restOfErrorTree,
|
|
7636
|
+
...error,
|
|
7637
|
+
ref
|
|
7638
|
+
});
|
|
7639
|
+
_subjects.state.next({
|
|
7640
|
+
name,
|
|
7641
|
+
errors: _formState.errors,
|
|
7642
|
+
isValid: false
|
|
7643
|
+
});
|
|
7644
|
+
options && options.shouldFocus && ref && ref.focus && ref.focus();
|
|
7645
|
+
};
|
|
7646
|
+
const watch = (name, defaultValue) => isFunction(name) ? _subjects.state.subscribe({
|
|
7647
|
+
next: (payload) => "values" in payload && name(_getWatch(void 0, defaultValue), payload)
|
|
7648
|
+
}) : _getWatch(name, defaultValue, true);
|
|
7649
|
+
const _subscribe = (props2) => _subjects.state.subscribe({
|
|
7650
|
+
next: (formState) => {
|
|
7651
|
+
if (shouldSubscribeByName(props2.name, formState.name, props2.exact) && shouldRenderFormState(formState, props2.formState || _proxyFormState, _setFormState, props2.reRenderRoot)) {
|
|
7652
|
+
props2.callback({
|
|
7653
|
+
values: { ..._formValues },
|
|
7654
|
+
..._formState,
|
|
7655
|
+
...formState,
|
|
7656
|
+
defaultValues: _defaultValues
|
|
7657
|
+
});
|
|
7658
|
+
}
|
|
7659
|
+
}
|
|
7660
|
+
}).unsubscribe;
|
|
7661
|
+
const subscribe = (props2) => {
|
|
7662
|
+
_state.mount = true;
|
|
7663
|
+
_proxySubscribeFormState = {
|
|
7664
|
+
..._proxySubscribeFormState,
|
|
7665
|
+
...props2.formState
|
|
7666
|
+
};
|
|
7667
|
+
return _subscribe({
|
|
7668
|
+
...props2,
|
|
7669
|
+
formState: _proxySubscribeFormState
|
|
7670
|
+
});
|
|
7671
|
+
};
|
|
7672
|
+
const unregister = (name, options = {}) => {
|
|
7673
|
+
for (const fieldName of name ? convertToArrayPayload(name) : _names.mount) {
|
|
7674
|
+
_names.mount.delete(fieldName);
|
|
7675
|
+
_names.array.delete(fieldName);
|
|
7676
|
+
if (!options.keepValue) {
|
|
7677
|
+
unset(_fields, fieldName);
|
|
7678
|
+
unset(_formValues, fieldName);
|
|
7679
|
+
}
|
|
7680
|
+
!options.keepError && unset(_formState.errors, fieldName);
|
|
7681
|
+
!options.keepDirty && unset(_formState.dirtyFields, fieldName);
|
|
7682
|
+
!options.keepTouched && unset(_formState.touchedFields, fieldName);
|
|
7683
|
+
!options.keepIsValidating && unset(_formState.validatingFields, fieldName);
|
|
7684
|
+
!_options.shouldUnregister && !options.keepDefaultValue && unset(_defaultValues, fieldName);
|
|
7685
|
+
}
|
|
7686
|
+
_subjects.state.next({
|
|
7687
|
+
values: cloneObject(_formValues)
|
|
7688
|
+
});
|
|
7689
|
+
_subjects.state.next({
|
|
7690
|
+
..._formState,
|
|
7691
|
+
...!options.keepDirty ? {} : { isDirty: _getDirty() }
|
|
7692
|
+
});
|
|
7693
|
+
!options.keepIsValid && _setValid();
|
|
7694
|
+
};
|
|
7695
|
+
const _setDisabledField = ({ disabled, name }) => {
|
|
7696
|
+
if (isBoolean(disabled) && _state.mount || !!disabled || _names.disabled.has(name)) {
|
|
7697
|
+
disabled ? _names.disabled.add(name) : _names.disabled.delete(name);
|
|
7698
|
+
}
|
|
7699
|
+
};
|
|
7700
|
+
const register = (name, options = {}) => {
|
|
7701
|
+
let field = get(_fields, name);
|
|
7702
|
+
const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
|
|
7703
|
+
set(_fields, name, {
|
|
7704
|
+
...field || {},
|
|
7705
|
+
_f: {
|
|
7706
|
+
...field && field._f ? field._f : { ref: { name } },
|
|
7707
|
+
name,
|
|
7708
|
+
mount: true,
|
|
7709
|
+
...options
|
|
7710
|
+
}
|
|
7711
|
+
});
|
|
7712
|
+
_names.mount.add(name);
|
|
7713
|
+
if (field) {
|
|
7714
|
+
_setDisabledField({
|
|
7715
|
+
disabled: isBoolean(options.disabled) ? options.disabled : _options.disabled,
|
|
7716
|
+
name
|
|
7717
|
+
});
|
|
7718
|
+
} else {
|
|
7719
|
+
updateValidAndValue(name, true, options.value);
|
|
7720
|
+
}
|
|
7721
|
+
return {
|
|
7722
|
+
...disabledIsDefined ? { disabled: options.disabled || _options.disabled } : {},
|
|
7723
|
+
..._options.progressive ? {
|
|
7724
|
+
required: !!options.required,
|
|
7725
|
+
min: getRuleValue(options.min),
|
|
7726
|
+
max: getRuleValue(options.max),
|
|
7727
|
+
minLength: getRuleValue(options.minLength),
|
|
7728
|
+
maxLength: getRuleValue(options.maxLength),
|
|
7729
|
+
pattern: getRuleValue(options.pattern)
|
|
7730
|
+
} : {},
|
|
7731
|
+
name,
|
|
7732
|
+
onChange,
|
|
7733
|
+
onBlur: onChange,
|
|
7734
|
+
ref: (ref) => {
|
|
7735
|
+
if (ref) {
|
|
7736
|
+
register(name, options);
|
|
7737
|
+
field = get(_fields, name);
|
|
7738
|
+
const fieldRef = isUndefined(ref.value) ? ref.querySelectorAll ? ref.querySelectorAll("input,select,textarea")[0] || ref : ref : ref;
|
|
7739
|
+
const radioOrCheckbox = isRadioOrCheckbox(fieldRef);
|
|
7740
|
+
const refs = field._f.refs || [];
|
|
7741
|
+
if (radioOrCheckbox ? refs.find((option) => option === fieldRef) : fieldRef === field._f.ref) {
|
|
7742
|
+
return;
|
|
7743
|
+
}
|
|
7744
|
+
set(_fields, name, {
|
|
7745
|
+
_f: {
|
|
7746
|
+
...field._f,
|
|
7747
|
+
...radioOrCheckbox ? {
|
|
7748
|
+
refs: [
|
|
7749
|
+
...refs.filter(live),
|
|
7750
|
+
fieldRef,
|
|
7751
|
+
...Array.isArray(get(_defaultValues, name)) ? [{}] : []
|
|
7752
|
+
],
|
|
7753
|
+
ref: { type: fieldRef.type, name }
|
|
7754
|
+
} : { ref: fieldRef }
|
|
7755
|
+
}
|
|
7756
|
+
});
|
|
7757
|
+
updateValidAndValue(name, false, void 0, fieldRef);
|
|
7758
|
+
} else {
|
|
7759
|
+
field = get(_fields, name, {});
|
|
7760
|
+
if (field._f) {
|
|
7761
|
+
field._f.mount = false;
|
|
7762
|
+
}
|
|
7763
|
+
(_options.shouldUnregister || options.shouldUnregister) && !(isNameInFieldArray(_names.array, name) && _state.action) && _names.unMount.add(name);
|
|
7764
|
+
}
|
|
7765
|
+
}
|
|
7766
|
+
};
|
|
7767
|
+
};
|
|
7768
|
+
const _focusError = () => _options.shouldFocusError && iterateFieldsByAction(_fields, _focusInput, _names.mount);
|
|
7769
|
+
const _disableForm = (disabled) => {
|
|
7770
|
+
if (isBoolean(disabled)) {
|
|
7771
|
+
_subjects.state.next({ disabled });
|
|
7772
|
+
iterateFieldsByAction(_fields, (ref, name) => {
|
|
7773
|
+
const currentField = get(_fields, name);
|
|
7774
|
+
if (currentField) {
|
|
7775
|
+
ref.disabled = currentField._f.disabled || disabled;
|
|
7776
|
+
if (Array.isArray(currentField._f.refs)) {
|
|
7777
|
+
currentField._f.refs.forEach((inputRef) => {
|
|
7778
|
+
inputRef.disabled = currentField._f.disabled || disabled;
|
|
7779
|
+
});
|
|
7780
|
+
}
|
|
7781
|
+
}
|
|
7782
|
+
}, 0, false);
|
|
7783
|
+
}
|
|
7784
|
+
};
|
|
7785
|
+
const handleSubmit = (onValid, onInvalid) => async (e) => {
|
|
7786
|
+
let onValidError = void 0;
|
|
7787
|
+
if (e) {
|
|
7788
|
+
e.preventDefault && e.preventDefault();
|
|
7789
|
+
e.persist && e.persist();
|
|
7790
|
+
}
|
|
7791
|
+
let fieldValues = cloneObject(_formValues);
|
|
7792
|
+
_subjects.state.next({
|
|
7793
|
+
isSubmitting: true
|
|
7794
|
+
});
|
|
7795
|
+
if (_options.resolver) {
|
|
7796
|
+
const { errors, values } = await _runSchema();
|
|
7797
|
+
_formState.errors = errors;
|
|
7798
|
+
fieldValues = cloneObject(values);
|
|
7799
|
+
} else {
|
|
7800
|
+
await executeBuiltInValidation(_fields);
|
|
7801
|
+
}
|
|
7802
|
+
if (_names.disabled.size) {
|
|
7803
|
+
for (const name of _names.disabled) {
|
|
7804
|
+
unset(fieldValues, name);
|
|
7805
|
+
}
|
|
7806
|
+
}
|
|
7807
|
+
unset(_formState.errors, "root");
|
|
7808
|
+
if (isEmptyObject(_formState.errors)) {
|
|
7809
|
+
_subjects.state.next({
|
|
7810
|
+
errors: {}
|
|
7811
|
+
});
|
|
7812
|
+
try {
|
|
7813
|
+
await onValid(fieldValues, e);
|
|
7814
|
+
} catch (error) {
|
|
7815
|
+
onValidError = error;
|
|
7816
|
+
}
|
|
7817
|
+
} else {
|
|
7818
|
+
if (onInvalid) {
|
|
7819
|
+
await onInvalid({ ..._formState.errors }, e);
|
|
7820
|
+
}
|
|
7821
|
+
_focusError();
|
|
7822
|
+
setTimeout(_focusError);
|
|
7823
|
+
}
|
|
7824
|
+
_subjects.state.next({
|
|
7825
|
+
isSubmitted: true,
|
|
7826
|
+
isSubmitting: false,
|
|
7827
|
+
isSubmitSuccessful: isEmptyObject(_formState.errors) && !onValidError,
|
|
7828
|
+
submitCount: _formState.submitCount + 1,
|
|
7829
|
+
errors: _formState.errors
|
|
7830
|
+
});
|
|
7831
|
+
if (onValidError) {
|
|
7832
|
+
throw onValidError;
|
|
7833
|
+
}
|
|
7834
|
+
};
|
|
7835
|
+
const resetField = (name, options = {}) => {
|
|
7836
|
+
if (get(_fields, name)) {
|
|
7837
|
+
if (isUndefined(options.defaultValue)) {
|
|
7838
|
+
setValue(name, cloneObject(get(_defaultValues, name)));
|
|
7839
|
+
} else {
|
|
7840
|
+
setValue(name, options.defaultValue);
|
|
7841
|
+
set(_defaultValues, name, cloneObject(options.defaultValue));
|
|
7842
|
+
}
|
|
7843
|
+
if (!options.keepTouched) {
|
|
7844
|
+
unset(_formState.touchedFields, name);
|
|
7845
|
+
}
|
|
7846
|
+
if (!options.keepDirty) {
|
|
7847
|
+
unset(_formState.dirtyFields, name);
|
|
7848
|
+
_formState.isDirty = options.defaultValue ? _getDirty(name, cloneObject(get(_defaultValues, name))) : _getDirty();
|
|
7849
|
+
}
|
|
7850
|
+
if (!options.keepError) {
|
|
7851
|
+
unset(_formState.errors, name);
|
|
7852
|
+
_proxyFormState.isValid && _setValid();
|
|
7853
|
+
}
|
|
7854
|
+
_subjects.state.next({ ..._formState });
|
|
7855
|
+
}
|
|
7856
|
+
};
|
|
7857
|
+
const _reset = (formValues, keepStateOptions = {}) => {
|
|
7858
|
+
const updatedValues = formValues ? cloneObject(formValues) : _defaultValues;
|
|
7859
|
+
const cloneUpdatedValues = cloneObject(updatedValues);
|
|
7860
|
+
const isEmptyResetValues = isEmptyObject(formValues);
|
|
7861
|
+
const values = isEmptyResetValues ? _defaultValues : cloneUpdatedValues;
|
|
7862
|
+
if (!keepStateOptions.keepDefaultValues) {
|
|
7863
|
+
_defaultValues = updatedValues;
|
|
7864
|
+
}
|
|
7865
|
+
if (!keepStateOptions.keepValues) {
|
|
7866
|
+
if (keepStateOptions.keepDirtyValues) {
|
|
7867
|
+
const fieldsToCheck = /* @__PURE__ */ new Set([
|
|
7868
|
+
..._names.mount,
|
|
7869
|
+
...Object.keys(getDirtyFields(_defaultValues, _formValues))
|
|
7870
|
+
]);
|
|
7871
|
+
for (const fieldName of Array.from(fieldsToCheck)) {
|
|
7872
|
+
get(_formState.dirtyFields, fieldName) ? set(values, fieldName, get(_formValues, fieldName)) : setValue(fieldName, get(values, fieldName));
|
|
7873
|
+
}
|
|
7874
|
+
} else {
|
|
7875
|
+
if (isWeb && isUndefined(formValues)) {
|
|
7876
|
+
for (const name of _names.mount) {
|
|
7877
|
+
const field = get(_fields, name);
|
|
7878
|
+
if (field && field._f) {
|
|
7879
|
+
const fieldReference = Array.isArray(field._f.refs) ? field._f.refs[0] : field._f.ref;
|
|
7880
|
+
if (isHTMLElement(fieldReference)) {
|
|
7881
|
+
const form = fieldReference.closest("form");
|
|
7882
|
+
if (form) {
|
|
7883
|
+
form.reset();
|
|
7884
|
+
break;
|
|
7885
|
+
}
|
|
7886
|
+
}
|
|
7887
|
+
}
|
|
7888
|
+
}
|
|
7889
|
+
}
|
|
7890
|
+
if (keepStateOptions.keepFieldsRef) {
|
|
7891
|
+
for (const fieldName of _names.mount) {
|
|
7892
|
+
setValue(fieldName, get(values, fieldName));
|
|
7893
|
+
}
|
|
7894
|
+
} else {
|
|
7895
|
+
_fields = {};
|
|
7896
|
+
}
|
|
7897
|
+
}
|
|
7898
|
+
_formValues = _options.shouldUnregister ? keepStateOptions.keepDefaultValues ? cloneObject(_defaultValues) : {} : cloneObject(values);
|
|
7899
|
+
_subjects.array.next({
|
|
7900
|
+
values: { ...values }
|
|
7901
|
+
});
|
|
7902
|
+
_subjects.state.next({
|
|
7903
|
+
values: { ...values }
|
|
7904
|
+
});
|
|
7905
|
+
}
|
|
7906
|
+
_names = {
|
|
7907
|
+
mount: keepStateOptions.keepDirtyValues ? _names.mount : /* @__PURE__ */ new Set(),
|
|
7908
|
+
unMount: /* @__PURE__ */ new Set(),
|
|
7909
|
+
array: /* @__PURE__ */ new Set(),
|
|
7910
|
+
disabled: /* @__PURE__ */ new Set(),
|
|
7911
|
+
watch: /* @__PURE__ */ new Set(),
|
|
7912
|
+
watchAll: false,
|
|
7913
|
+
focus: ""
|
|
7914
|
+
};
|
|
7915
|
+
_state.mount = !_proxyFormState.isValid || !!keepStateOptions.keepIsValid || !!keepStateOptions.keepDirtyValues;
|
|
7916
|
+
_state.watch = !!_options.shouldUnregister;
|
|
7917
|
+
_subjects.state.next({
|
|
7918
|
+
submitCount: keepStateOptions.keepSubmitCount ? _formState.submitCount : 0,
|
|
7919
|
+
isDirty: isEmptyResetValues ? false : keepStateOptions.keepDirty ? _formState.isDirty : !!(keepStateOptions.keepDefaultValues && !deepEqual(formValues, _defaultValues)),
|
|
7920
|
+
isSubmitted: keepStateOptions.keepIsSubmitted ? _formState.isSubmitted : false,
|
|
7921
|
+
dirtyFields: isEmptyResetValues ? {} : keepStateOptions.keepDirtyValues ? keepStateOptions.keepDefaultValues && _formValues ? getDirtyFields(_defaultValues, _formValues) : _formState.dirtyFields : keepStateOptions.keepDefaultValues && formValues ? getDirtyFields(_defaultValues, formValues) : keepStateOptions.keepDirty ? _formState.dirtyFields : {},
|
|
7922
|
+
touchedFields: keepStateOptions.keepTouched ? _formState.touchedFields : {},
|
|
7923
|
+
errors: keepStateOptions.keepErrors ? _formState.errors : {},
|
|
7924
|
+
isSubmitSuccessful: keepStateOptions.keepIsSubmitSuccessful ? _formState.isSubmitSuccessful : false,
|
|
7925
|
+
isSubmitting: false,
|
|
7926
|
+
defaultValues: _defaultValues
|
|
7927
|
+
});
|
|
7928
|
+
};
|
|
7929
|
+
const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues) ? formValues(_formValues) : formValues, keepStateOptions);
|
|
7930
|
+
const setFocus = (name, options = {}) => {
|
|
7931
|
+
const field = get(_fields, name);
|
|
7932
|
+
const fieldReference = field && field._f;
|
|
7933
|
+
if (fieldReference) {
|
|
7934
|
+
const fieldRef = fieldReference.refs ? fieldReference.refs[0] : fieldReference.ref;
|
|
7935
|
+
if (fieldRef.focus) {
|
|
7936
|
+
fieldRef.focus();
|
|
7937
|
+
options.shouldSelect && isFunction(fieldRef.select) && fieldRef.select();
|
|
7938
|
+
}
|
|
7939
|
+
}
|
|
7940
|
+
};
|
|
7941
|
+
const _setFormState = (updatedFormState) => {
|
|
7942
|
+
_formState = {
|
|
7943
|
+
..._formState,
|
|
7944
|
+
...updatedFormState
|
|
7945
|
+
};
|
|
7946
|
+
};
|
|
7947
|
+
const _resetDefaultValues = () => isFunction(_options.defaultValues) && _options.defaultValues().then((values) => {
|
|
7948
|
+
reset(values, _options.resetOptions);
|
|
7949
|
+
_subjects.state.next({
|
|
7950
|
+
isLoading: false
|
|
7951
|
+
});
|
|
7952
|
+
});
|
|
7953
|
+
const methods = {
|
|
7954
|
+
control: {
|
|
7955
|
+
register,
|
|
7956
|
+
unregister,
|
|
7957
|
+
getFieldState,
|
|
7958
|
+
handleSubmit,
|
|
7959
|
+
setError,
|
|
7960
|
+
_subscribe,
|
|
7961
|
+
_runSchema,
|
|
7962
|
+
_focusError,
|
|
7963
|
+
_getWatch,
|
|
7964
|
+
_getDirty,
|
|
7965
|
+
_setValid,
|
|
7966
|
+
_setFieldArray,
|
|
7967
|
+
_setDisabledField,
|
|
7968
|
+
_setErrors,
|
|
7969
|
+
_getFieldArray,
|
|
7970
|
+
_reset,
|
|
7971
|
+
_resetDefaultValues,
|
|
7972
|
+
_removeUnmounted,
|
|
7973
|
+
_disableForm,
|
|
7974
|
+
_subjects,
|
|
7975
|
+
_proxyFormState,
|
|
7976
|
+
get _fields() {
|
|
7977
|
+
return _fields;
|
|
7978
|
+
},
|
|
7979
|
+
get _formValues() {
|
|
7980
|
+
return _formValues;
|
|
7981
|
+
},
|
|
7982
|
+
get _state() {
|
|
7983
|
+
return _state;
|
|
7984
|
+
},
|
|
7985
|
+
set _state(value) {
|
|
7986
|
+
_state = value;
|
|
7987
|
+
},
|
|
7988
|
+
get _defaultValues() {
|
|
7989
|
+
return _defaultValues;
|
|
7990
|
+
},
|
|
7991
|
+
get _names() {
|
|
7992
|
+
return _names;
|
|
7993
|
+
},
|
|
7994
|
+
set _names(value) {
|
|
7995
|
+
_names = value;
|
|
7996
|
+
},
|
|
7997
|
+
get _formState() {
|
|
7998
|
+
return _formState;
|
|
7999
|
+
},
|
|
8000
|
+
get _options() {
|
|
8001
|
+
return _options;
|
|
8002
|
+
},
|
|
8003
|
+
set _options(value) {
|
|
8004
|
+
_options = {
|
|
8005
|
+
..._options,
|
|
8006
|
+
...value
|
|
8007
|
+
};
|
|
8008
|
+
}
|
|
8009
|
+
},
|
|
8010
|
+
subscribe,
|
|
8011
|
+
trigger,
|
|
8012
|
+
register,
|
|
8013
|
+
handleSubmit,
|
|
8014
|
+
watch,
|
|
8015
|
+
setValue,
|
|
8016
|
+
getValues,
|
|
8017
|
+
reset,
|
|
8018
|
+
resetField,
|
|
8019
|
+
clearErrors,
|
|
8020
|
+
unregister,
|
|
8021
|
+
setError,
|
|
8022
|
+
setFocus,
|
|
8023
|
+
getFieldState
|
|
8024
|
+
};
|
|
8025
|
+
return {
|
|
8026
|
+
...methods,
|
|
8027
|
+
formControl: methods
|
|
8028
|
+
};
|
|
8029
|
+
}
|
|
8030
|
+
function useForm(props = {}) {
|
|
8031
|
+
const _formControl = import_react21.default.useRef(void 0);
|
|
8032
|
+
const _values = import_react21.default.useRef(void 0);
|
|
8033
|
+
const [formState, updateFormState] = import_react21.default.useState({
|
|
8034
|
+
isDirty: false,
|
|
8035
|
+
isValidating: false,
|
|
8036
|
+
isLoading: isFunction(props.defaultValues),
|
|
8037
|
+
isSubmitted: false,
|
|
8038
|
+
isSubmitting: false,
|
|
8039
|
+
isSubmitSuccessful: false,
|
|
8040
|
+
isValid: false,
|
|
8041
|
+
submitCount: 0,
|
|
8042
|
+
dirtyFields: {},
|
|
8043
|
+
touchedFields: {},
|
|
8044
|
+
validatingFields: {},
|
|
8045
|
+
errors: props.errors || {},
|
|
8046
|
+
disabled: props.disabled || false,
|
|
8047
|
+
isReady: false,
|
|
8048
|
+
defaultValues: isFunction(props.defaultValues) ? void 0 : props.defaultValues
|
|
8049
|
+
});
|
|
8050
|
+
if (!_formControl.current) {
|
|
8051
|
+
if (props.formControl) {
|
|
8052
|
+
_formControl.current = {
|
|
8053
|
+
...props.formControl,
|
|
8054
|
+
formState
|
|
8055
|
+
};
|
|
8056
|
+
if (props.defaultValues && !isFunction(props.defaultValues)) {
|
|
8057
|
+
props.formControl.reset(props.defaultValues, props.resetOptions);
|
|
8058
|
+
}
|
|
8059
|
+
} else {
|
|
8060
|
+
const { formControl, ...rest } = createFormControl(props);
|
|
8061
|
+
_formControl.current = {
|
|
8062
|
+
...rest,
|
|
8063
|
+
formState
|
|
8064
|
+
};
|
|
8065
|
+
}
|
|
8066
|
+
}
|
|
8067
|
+
const control = _formControl.current.control;
|
|
8068
|
+
control._options = props;
|
|
8069
|
+
useIsomorphicLayoutEffect(() => {
|
|
8070
|
+
const sub = control._subscribe({
|
|
8071
|
+
formState: control._proxyFormState,
|
|
8072
|
+
callback: () => updateFormState({ ...control._formState }),
|
|
8073
|
+
reRenderRoot: true
|
|
8074
|
+
});
|
|
8075
|
+
updateFormState((data) => ({
|
|
8076
|
+
...data,
|
|
8077
|
+
isReady: true
|
|
8078
|
+
}));
|
|
8079
|
+
control._formState.isReady = true;
|
|
8080
|
+
return sub;
|
|
8081
|
+
}, [control]);
|
|
8082
|
+
import_react21.default.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);
|
|
8083
|
+
import_react21.default.useEffect(() => {
|
|
8084
|
+
if (props.mode) {
|
|
8085
|
+
control._options.mode = props.mode;
|
|
8086
|
+
}
|
|
8087
|
+
if (props.reValidateMode) {
|
|
8088
|
+
control._options.reValidateMode = props.reValidateMode;
|
|
8089
|
+
}
|
|
8090
|
+
}, [control, props.mode, props.reValidateMode]);
|
|
8091
|
+
import_react21.default.useEffect(() => {
|
|
8092
|
+
if (props.errors) {
|
|
8093
|
+
control._setErrors(props.errors);
|
|
8094
|
+
control._focusError();
|
|
8095
|
+
}
|
|
8096
|
+
}, [control, props.errors]);
|
|
8097
|
+
import_react21.default.useEffect(() => {
|
|
8098
|
+
props.shouldUnregister && control._subjects.state.next({
|
|
8099
|
+
values: control._getWatch()
|
|
8100
|
+
});
|
|
8101
|
+
}, [control, props.shouldUnregister]);
|
|
8102
|
+
import_react21.default.useEffect(() => {
|
|
8103
|
+
if (control._proxyFormState.isDirty) {
|
|
8104
|
+
const isDirty = control._getDirty();
|
|
8105
|
+
if (isDirty !== formState.isDirty) {
|
|
8106
|
+
control._subjects.state.next({
|
|
8107
|
+
isDirty
|
|
8108
|
+
});
|
|
8109
|
+
}
|
|
8110
|
+
}
|
|
8111
|
+
}, [control, formState.isDirty]);
|
|
8112
|
+
import_react21.default.useEffect(() => {
|
|
8113
|
+
if (props.values && !deepEqual(props.values, _values.current)) {
|
|
8114
|
+
control._reset(props.values, {
|
|
8115
|
+
keepFieldsRef: true,
|
|
8116
|
+
...control._options.resetOptions
|
|
8117
|
+
});
|
|
8118
|
+
_values.current = props.values;
|
|
8119
|
+
updateFormState((state) => ({ ...state }));
|
|
8120
|
+
} else {
|
|
8121
|
+
control._resetDefaultValues();
|
|
8122
|
+
}
|
|
8123
|
+
}, [control, props.values]);
|
|
8124
|
+
import_react21.default.useEffect(() => {
|
|
8125
|
+
if (!control._state.mount) {
|
|
8126
|
+
control._setValid();
|
|
8127
|
+
control._state.mount = true;
|
|
8128
|
+
}
|
|
8129
|
+
if (control._state.watch) {
|
|
8130
|
+
control._state.watch = false;
|
|
8131
|
+
control._subjects.state.next({ ...control._formState });
|
|
8132
|
+
}
|
|
8133
|
+
control._removeUnmounted();
|
|
8134
|
+
});
|
|
8135
|
+
_formControl.current.formState = getProxyFormState(formState, control);
|
|
8136
|
+
return _formControl.current;
|
|
8137
|
+
}
|
|
8138
|
+
|
|
8139
|
+
// ../../components/ui/Form.tsx
|
|
8140
|
+
var import_next_intl8 = require("next-intl");
|
|
8141
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
8142
|
+
var FormConfigContext = React31.createContext({ size: "md" });
|
|
8143
|
+
var FormWrapper = ({
|
|
8144
|
+
children,
|
|
8145
|
+
onSubmit,
|
|
8146
|
+
initialValues,
|
|
8147
|
+
validationSchema,
|
|
8148
|
+
className,
|
|
8149
|
+
size = "md",
|
|
8150
|
+
...props
|
|
8151
|
+
}) => {
|
|
8152
|
+
const methods = useForm({
|
|
8153
|
+
defaultValues: initialValues
|
|
8154
|
+
});
|
|
8155
|
+
React31.useEffect(() => {
|
|
8156
|
+
if (initialValues) {
|
|
8157
|
+
methods.reset(initialValues);
|
|
8158
|
+
}
|
|
8159
|
+
}, [JSON.stringify(initialValues)]);
|
|
8160
|
+
const { validationSchema: _, ...formProps } = props;
|
|
8161
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormProvider, { ...methods, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormConfigContext.Provider, { value: { size }, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("form", { onSubmit: methods.handleSubmit(onSubmit), className, ...formProps, children }) }) });
|
|
8162
|
+
};
|
|
8163
|
+
var Form = FormWrapper;
|
|
8164
|
+
var FormFieldContext = React31.createContext({});
|
|
8165
|
+
var FormField = ({
|
|
8166
|
+
...props
|
|
8167
|
+
}) => {
|
|
8168
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Controller, { ...props }) });
|
|
8169
|
+
};
|
|
8170
|
+
var useFormField = () => {
|
|
8171
|
+
const fieldContext = React31.useContext(FormFieldContext);
|
|
8172
|
+
const itemContext = React31.useContext(FormItemContext);
|
|
8173
|
+
const { getFieldState, formState } = useFormContext();
|
|
8174
|
+
const t = (0, import_next_intl8.useTranslations)("Form");
|
|
8175
|
+
const fieldState = getFieldState(fieldContext.name, formState);
|
|
8176
|
+
if (!fieldContext) {
|
|
8177
|
+
throw new Error(t("validation.mustBeUsedWithinForm"));
|
|
8178
|
+
}
|
|
8179
|
+
const { id } = itemContext;
|
|
8180
|
+
return {
|
|
8181
|
+
id,
|
|
8182
|
+
name: fieldContext.name,
|
|
8183
|
+
formItemId: `${id}-form-item`,
|
|
8184
|
+
formDescriptionId: `${id}-form-item-description`,
|
|
8185
|
+
formMessageId: `${id}-form-item-message`,
|
|
8186
|
+
...fieldState
|
|
8187
|
+
};
|
|
8188
|
+
};
|
|
8189
|
+
var FormItemContext = React31.createContext({});
|
|
8190
|
+
var FormItem = React31.forwardRef(({ className, ...props }, ref) => {
|
|
8191
|
+
const id = React31.useId();
|
|
8192
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormItemContext.Provider, { value: { id }, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { ref, className: cn("space-y-2", className), ...props }) });
|
|
8193
|
+
});
|
|
8194
|
+
FormItem.displayName = "FormItem";
|
|
8195
|
+
var FormLabel = React31.forwardRef(({ className, ...props }, ref) => {
|
|
8196
|
+
const { error, formItemId } = useFormField();
|
|
8197
|
+
const config = React31.useContext(FormConfigContext);
|
|
8198
|
+
const sizeClass = config.size === "sm" ? "text-xs" : config.size === "lg" ? "text-base" : "text-sm";
|
|
8199
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Label, { ref, className: cn(sizeClass, error && "text-destructive", className), htmlFor: formItemId, ...props });
|
|
8200
|
+
});
|
|
8201
|
+
FormLabel.displayName = "FormLabel";
|
|
8202
|
+
var FormControl = React31.forwardRef(({ ...props }, ref) => {
|
|
8203
|
+
const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
|
|
8204
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
8205
|
+
"div",
|
|
8206
|
+
{
|
|
8207
|
+
ref,
|
|
8208
|
+
id: formItemId,
|
|
8209
|
+
"aria-describedby": !error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`,
|
|
8210
|
+
"aria-invalid": !!error,
|
|
8211
|
+
...props
|
|
8212
|
+
}
|
|
8213
|
+
);
|
|
8214
|
+
});
|
|
8215
|
+
FormControl.displayName = "FormControl";
|
|
8216
|
+
var FormDescription = React31.forwardRef(({ className, ...props }, ref) => {
|
|
8217
|
+
const { formDescriptionId } = useFormField();
|
|
8218
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("p", { ref, id: formDescriptionId, className: cn("text-sm text-muted-foreground", className), ...props });
|
|
8219
|
+
});
|
|
8220
|
+
FormDescription.displayName = "FormDescription";
|
|
8221
|
+
var FormMessage = React31.forwardRef(({ className, children, ...props }, ref) => {
|
|
8222
|
+
const { error, formMessageId } = useFormField();
|
|
8223
|
+
const body = error ? String(error?.message) : children;
|
|
8224
|
+
if (!body) {
|
|
8225
|
+
return null;
|
|
8226
|
+
}
|
|
8227
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("p", { ref, id: formMessageId, className: cn("text-sm font-medium text-destructive", className), ...props, children: body });
|
|
8228
|
+
});
|
|
8229
|
+
FormMessage.displayName = "FormMessage";
|
|
8230
|
+
var FormInput = React31.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
8231
|
+
FormField,
|
|
8232
|
+
{
|
|
8233
|
+
name,
|
|
8234
|
+
render: ({ field }) => /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(FormItem, { children: [
|
|
8235
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormControl, { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Input_default, { size: props.size ?? size, ...field, ...props }) }),
|
|
8236
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormMessage, {})
|
|
8237
|
+
] })
|
|
8238
|
+
}
|
|
8239
|
+
) }));
|
|
8240
|
+
FormInput.displayName = "FormInput";
|
|
8241
|
+
var FormCheckbox = React31.forwardRef(({ name, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
8242
|
+
FormField,
|
|
8243
|
+
{
|
|
8244
|
+
name,
|
|
8245
|
+
render: ({ field }) => /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(FormItem, { children: [
|
|
8246
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormControl, { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
8247
|
+
Checkbox,
|
|
8248
|
+
{
|
|
8249
|
+
ref,
|
|
8250
|
+
checked: field.value,
|
|
8251
|
+
onChange: (e) => field.onChange(e.target.checked),
|
|
8252
|
+
labelClassName: cn(
|
|
8253
|
+
// align label text size with inputs/buttons by form size
|
|
8254
|
+
size === "sm" ? "text-xs" : size === "lg" ? "text-base" : "text-sm",
|
|
8255
|
+
props.labelClassName
|
|
8256
|
+
),
|
|
8257
|
+
...props
|
|
8258
|
+
}
|
|
8259
|
+
) }),
|
|
8260
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormMessage, {})
|
|
8261
|
+
] })
|
|
8262
|
+
}
|
|
8263
|
+
) }));
|
|
8264
|
+
FormCheckbox.displayName = "FormCheckbox";
|
|
8265
|
+
var FormActions = React31.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { ref, className: cn("flex gap-2 justify-end", className), ...props }));
|
|
8266
|
+
FormActions.displayName = "FormActions";
|
|
8267
|
+
var FormSubmitButton = React31.forwardRef(({ children, loading: loading2, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(FormConfigContext.Consumer, { children: ({ size }) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Button_default, { ref, type: "submit", size: props.size ?? size, disabled: loading2, ...props, children }) }));
|
|
8268
|
+
FormSubmitButton.displayName = "FormSubmitButton";
|
|
8269
|
+
|
|
8270
|
+
// ../../components/ui/NotificationModal.tsx
|
|
8271
|
+
var import_lucide_react21 = require("lucide-react");
|
|
8272
|
+
var import_next_intl9 = require("next-intl");
|
|
8273
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
8274
|
+
function NotificationModal({ isOpen, onClose, notification, titleText, openLinkText, closeText }) {
|
|
8275
|
+
const t = (0, import_next_intl9.useTranslations)("Common");
|
|
8276
|
+
if (!notification) return null;
|
|
8277
|
+
const formatTime2 = (dateString) => {
|
|
8278
|
+
const date = new Date(dateString);
|
|
8279
|
+
return date.toLocaleString(void 0, {
|
|
8280
|
+
year: "numeric",
|
|
8281
|
+
month: "2-digit",
|
|
8282
|
+
day: "2-digit",
|
|
8283
|
+
hour: "2-digit",
|
|
8284
|
+
minute: "2-digit"
|
|
8285
|
+
});
|
|
8286
|
+
};
|
|
8287
|
+
const hasLink = notification.metadata?.link;
|
|
8288
|
+
const handleLinkClick = () => {
|
|
8289
|
+
if (hasLink) {
|
|
8290
|
+
window.open(notification.metadata.link, "_blank");
|
|
8291
|
+
onClose();
|
|
8292
|
+
}
|
|
8293
|
+
};
|
|
8294
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8295
|
+
Modal_default,
|
|
8296
|
+
{
|
|
8297
|
+
isOpen,
|
|
8298
|
+
onClose,
|
|
8299
|
+
title: titleText || t("notifications"),
|
|
8300
|
+
size: "md",
|
|
8301
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "space-y-4", children: [
|
|
8302
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center gap-2 pb-2 border-b border-border", children: [
|
|
8303
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: cn(
|
|
8304
|
+
"w-2 h-2 rounded-full",
|
|
8305
|
+
!notification.is_read ? "bg-primary" : "bg-border"
|
|
8306
|
+
) }),
|
|
8307
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-xs text-muted-foreground", children: !notification.is_read ? t("newNotification") : t("readStatus") })
|
|
8308
|
+
] }),
|
|
8309
|
+
notification.title && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("h3", { className: "text-lg font-semibold text-foreground", children: notification.title }),
|
|
8310
|
+
notification.body && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "text-sm text-muted-foreground whitespace-pre-wrap leading-relaxed", children: notification.body }),
|
|
8311
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "text-xs text-muted-foreground border-t border-border pt-2", children: formatTime2(notification.created_at) }),
|
|
8312
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex gap-2 justify-end pt-2", children: [
|
|
8313
|
+
hasLink && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
8314
|
+
Button_default,
|
|
8315
|
+
{
|
|
8316
|
+
variant: "primary",
|
|
8317
|
+
size: "sm",
|
|
8318
|
+
onClick: handleLinkClick,
|
|
8319
|
+
className: "gap-2",
|
|
8320
|
+
children: [
|
|
8321
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react21.ExternalLink, { className: "w-4 h-4" }),
|
|
8322
|
+
openLinkText || t("openLink")
|
|
8323
|
+
]
|
|
8324
|
+
}
|
|
8325
|
+
),
|
|
8326
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8327
|
+
Button_default,
|
|
8328
|
+
{
|
|
8329
|
+
variant: "ghost",
|
|
8330
|
+
size: "sm",
|
|
8331
|
+
onClick: onClose,
|
|
8332
|
+
children: closeText || t("close")
|
|
8333
|
+
}
|
|
8334
|
+
)
|
|
8335
|
+
] })
|
|
8336
|
+
] })
|
|
8337
|
+
}
|
|
8338
|
+
);
|
|
8339
|
+
}
|
|
8340
|
+
var NotificationModal_default = NotificationModal;
|
|
8341
|
+
|
|
8342
|
+
// ../../components/ui/FloatingContacts.tsx
|
|
8343
|
+
var import_link2 = __toESM(require("next/link"), 1);
|
|
8344
|
+
var import_navigation = require("next/navigation");
|
|
8345
|
+
var import_lucide_react22 = require("lucide-react");
|
|
8346
|
+
|
|
8347
|
+
// ../../node_modules/react-icons/lib/iconBase.mjs
|
|
8348
|
+
var import_react23 = __toESM(require("react"), 1);
|
|
8349
|
+
|
|
8350
|
+
// ../../node_modules/react-icons/lib/iconContext.mjs
|
|
8351
|
+
var import_react22 = __toESM(require("react"), 1);
|
|
8352
|
+
var DefaultContext = {
|
|
8353
|
+
color: void 0,
|
|
8354
|
+
size: void 0,
|
|
8355
|
+
className: void 0,
|
|
8356
|
+
style: void 0,
|
|
8357
|
+
attr: void 0
|
|
8358
|
+
};
|
|
8359
|
+
var IconContext = import_react22.default.createContext && /* @__PURE__ */ import_react22.default.createContext(DefaultContext);
|
|
8360
|
+
|
|
8361
|
+
// ../../node_modules/react-icons/lib/iconBase.mjs
|
|
8362
|
+
var _excluded = ["attr", "size", "title"];
|
|
8363
|
+
function _objectWithoutProperties(source, excluded) {
|
|
8364
|
+
if (source == null) return {};
|
|
8365
|
+
var target = _objectWithoutPropertiesLoose(source, excluded);
|
|
8366
|
+
var key, i;
|
|
8367
|
+
if (Object.getOwnPropertySymbols) {
|
|
8368
|
+
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
8369
|
+
for (i = 0; i < sourceSymbolKeys.length; i++) {
|
|
8370
|
+
key = sourceSymbolKeys[i];
|
|
8371
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
8372
|
+
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
8373
|
+
target[key] = source[key];
|
|
8374
|
+
}
|
|
8375
|
+
}
|
|
8376
|
+
return target;
|
|
8377
|
+
}
|
|
8378
|
+
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
8379
|
+
if (source == null) return {};
|
|
6145
8380
|
var target = {};
|
|
6146
8381
|
for (var key in source) {
|
|
6147
8382
|
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
@@ -6210,12 +8445,12 @@ function _toPrimitive(t, r) {
|
|
|
6210
8445
|
return ("string" === r ? String : Number)(t);
|
|
6211
8446
|
}
|
|
6212
8447
|
function Tree2Element(tree) {
|
|
6213
|
-
return tree && tree.map((node, i) => /* @__PURE__ */
|
|
8448
|
+
return tree && tree.map((node, i) => /* @__PURE__ */ import_react23.default.createElement(node.tag, _objectSpread({
|
|
6214
8449
|
key: i
|
|
6215
8450
|
}, node.attr), Tree2Element(node.child)));
|
|
6216
8451
|
}
|
|
6217
8452
|
function GenIcon(data) {
|
|
6218
|
-
return (props) => /* @__PURE__ */
|
|
8453
|
+
return (props) => /* @__PURE__ */ import_react23.default.createElement(IconBase, _extends({
|
|
6219
8454
|
attr: _objectSpread({}, data.attr)
|
|
6220
8455
|
}, props), Tree2Element(data.child));
|
|
6221
8456
|
}
|
|
@@ -6230,7 +8465,7 @@ function IconBase(props) {
|
|
|
6230
8465
|
var className;
|
|
6231
8466
|
if (conf.className) className = conf.className;
|
|
6232
8467
|
if (props.className) className = (className ? className + " " : "") + props.className;
|
|
6233
|
-
return /* @__PURE__ */
|
|
8468
|
+
return /* @__PURE__ */ import_react23.default.createElement("svg", _extends({
|
|
6234
8469
|
stroke: "currentColor",
|
|
6235
8470
|
fill: "currentColor",
|
|
6236
8471
|
strokeWidth: "0"
|
|
@@ -6242,9 +8477,9 @@ function IconBase(props) {
|
|
|
6242
8477
|
height: computedSize,
|
|
6243
8478
|
width: computedSize,
|
|
6244
8479
|
xmlns: "http://www.w3.org/2000/svg"
|
|
6245
|
-
}), title && /* @__PURE__ */
|
|
8480
|
+
}), title && /* @__PURE__ */ import_react23.default.createElement("title", null, title), props.children);
|
|
6246
8481
|
};
|
|
6247
|
-
return IconContext !== void 0 ? /* @__PURE__ */
|
|
8482
|
+
return IconContext !== void 0 ? /* @__PURE__ */ import_react23.default.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
|
|
6248
8483
|
}
|
|
6249
8484
|
|
|
6250
8485
|
// ../../node_modules/react-icons/fa/index.mjs
|
|
@@ -6258,9 +8493,9 @@ function SiZalo(props) {
|
|
|
6258
8493
|
}
|
|
6259
8494
|
|
|
6260
8495
|
// ../../components/ui/FloatingContacts.tsx
|
|
6261
|
-
var
|
|
8496
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
6262
8497
|
function MessengerIcon(props) {
|
|
6263
|
-
return /* @__PURE__ */ (0,
|
|
8498
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("svg", { viewBox: "0 0 24 24", width: 24, height: 24, "aria-hidden": "true", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
6264
8499
|
"path",
|
|
6265
8500
|
{
|
|
6266
8501
|
d: "M12 2C6.477 2 2 6.145 2 11.235c0 2.93 1.35 5.542 3.464 7.25v3.515l3.344-1.836c.894.247 1.843.375 2.192.375 5.523 0 10-4.145 10-9.235S17.523 2 12 2zm.994 12.444l-2.563-2.73-5.004 2.73 5.507-5.84 2.626 2.729 4.942-2.729-5.508 5.84z",
|
|
@@ -6269,10 +8504,10 @@ function MessengerIcon(props) {
|
|
|
6269
8504
|
) });
|
|
6270
8505
|
}
|
|
6271
8506
|
function ZaloIcon(props) {
|
|
6272
|
-
return /* @__PURE__ */ (0,
|
|
8507
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SiZalo, { size: 20, ...props });
|
|
6273
8508
|
}
|
|
6274
8509
|
function InstagramIcon(props) {
|
|
6275
|
-
return /* @__PURE__ */ (0,
|
|
8510
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(FaInstagram, { size: 20, ...props });
|
|
6276
8511
|
}
|
|
6277
8512
|
function FloatingContacts({ className }) {
|
|
6278
8513
|
const pathname = (0, import_navigation.usePathname)();
|
|
@@ -6307,8 +8542,8 @@ function FloatingContacts({ className }) {
|
|
|
6307
8542
|
external: true
|
|
6308
8543
|
}
|
|
6309
8544
|
];
|
|
6310
|
-
return /* @__PURE__ */ (0,
|
|
6311
|
-
/* @__PURE__ */ (0,
|
|
8545
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: cn("fixed bottom-6 right-4 z-[100000]", "flex flex-col items-end gap-3", className), "aria-label": "Quick contacts", children: [
|
|
8546
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
6312
8547
|
import_link2.default,
|
|
6313
8548
|
{
|
|
6314
8549
|
href: `tel:${hotline.replace(/\D/g, "")}`,
|
|
@@ -6319,10 +8554,10 @@ function FloatingContacts({ className }) {
|
|
|
6319
8554
|
"hover:scale-105 active:scale-95 transition-transform",
|
|
6320
8555
|
"bg-[#22c55e]"
|
|
6321
8556
|
),
|
|
6322
|
-
children: /* @__PURE__ */ (0,
|
|
8557
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react22.Phone, { className: "w-6 h-6" })
|
|
6323
8558
|
}
|
|
6324
8559
|
),
|
|
6325
|
-
moreItems.map(({ key, href, label, bg, Icon, external }) => /* @__PURE__ */ (0,
|
|
8560
|
+
moreItems.map(({ key, href, label, bg, Icon, external }) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
6326
8561
|
import_link2.default,
|
|
6327
8562
|
{
|
|
6328
8563
|
href,
|
|
@@ -6334,7 +8569,7 @@ function FloatingContacts({ className }) {
|
|
|
6334
8569
|
"hover:scale-105 active:scale-95 transition-transform",
|
|
6335
8570
|
bg
|
|
6336
8571
|
),
|
|
6337
|
-
children: /* @__PURE__ */ (0,
|
|
8572
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Icon, { className: "w-6 h-6" })
|
|
6338
8573
|
},
|
|
6339
8574
|
key
|
|
6340
8575
|
))
|
|
@@ -6343,7 +8578,7 @@ function FloatingContacts({ className }) {
|
|
|
6343
8578
|
|
|
6344
8579
|
// ../../components/ui/AccessDenied.tsx
|
|
6345
8580
|
var import_lucide_react23 = require("lucide-react");
|
|
6346
|
-
var
|
|
8581
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
6347
8582
|
var VARIANT_STYLES = {
|
|
6348
8583
|
destructive: { bg: "bg-destructive/5", border: "border-destructive/20", text: "text-destructive" },
|
|
6349
8584
|
warning: { bg: "bg-warning/5", border: "border-warning/20", text: "text-warning" },
|
|
@@ -6364,16 +8599,209 @@ function AccessDenied({
|
|
|
6364
8599
|
}) {
|
|
6365
8600
|
const styles = VARIANT_STYLES[variant];
|
|
6366
8601
|
const UsedIcon = Icon || DEFAULT_ICONS[variant];
|
|
6367
|
-
return /* @__PURE__ */ (0,
|
|
6368
|
-
/* @__PURE__ */ (0,
|
|
6369
|
-
/* @__PURE__ */ (0,
|
|
6370
|
-
/* @__PURE__ */ (0,
|
|
6371
|
-
/* @__PURE__ */ (0,
|
|
8602
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(Card_default, { className: cn("p-8 text-center shadow-sm", styles.bg, styles.border, className), children: /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-col items-center gap-4", children: [
|
|
8603
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: cn("p-3 rounded-lg", styles.bg.replace("/5", "/10")), children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(UsedIcon, { className: cn("w-8 h-8", styles.text) }) }),
|
|
8604
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { children: [
|
|
8605
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("h3", { className: cn("font-semibold mb-2", styles.text), children: title }),
|
|
8606
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("p", { className: cn(styles.text.replace("text-", "text-") + "/80", "text-sm"), children: description })
|
|
6372
8607
|
] }),
|
|
6373
|
-
children && /* @__PURE__ */ (0,
|
|
8608
|
+
children && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "mt-2 flex flex-wrap gap-2 justify-center", children })
|
|
6374
8609
|
] }) });
|
|
6375
8610
|
}
|
|
6376
8611
|
|
|
8612
|
+
// ../../components/ui/ThemeToggleHeadless.tsx
|
|
8613
|
+
var import_lucide_react24 = require("lucide-react");
|
|
8614
|
+
var import_react24 = require("react");
|
|
8615
|
+
var import_react_dom9 = require("react-dom");
|
|
8616
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
8617
|
+
function ThemeToggleHeadless({
|
|
8618
|
+
theme,
|
|
8619
|
+
onChange,
|
|
8620
|
+
labels,
|
|
8621
|
+
className
|
|
8622
|
+
}) {
|
|
8623
|
+
const [isOpen, setIsOpen] = (0, import_react24.useState)(false);
|
|
8624
|
+
const [mounted, setMounted] = (0, import_react24.useState)(false);
|
|
8625
|
+
const triggerRef = (0, import_react24.useRef)(null);
|
|
8626
|
+
const [dropdownPosition, setDropdownPosition] = (0, import_react24.useState)(null);
|
|
8627
|
+
(0, import_react24.useEffect)(() => setMounted(true), []);
|
|
8628
|
+
const themes = [
|
|
8629
|
+
{ value: "light", label: labels?.light ?? "Light", icon: import_lucide_react24.Sun },
|
|
8630
|
+
{ value: "dark", label: labels?.dark ?? "Dark", icon: import_lucide_react24.Moon },
|
|
8631
|
+
{ value: "system", label: labels?.system ?? "System", icon: import_lucide_react24.Monitor }
|
|
8632
|
+
];
|
|
8633
|
+
const current = mounted ? themes.find((t) => t.value === theme) || themes[2] : themes[2];
|
|
8634
|
+
const CurrentIcon = current.icon;
|
|
8635
|
+
const calculatePosition = () => {
|
|
8636
|
+
const rect = triggerRef.current?.getBoundingClientRect();
|
|
8637
|
+
if (!rect) return null;
|
|
8638
|
+
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
|
|
8639
|
+
const scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
|
|
8640
|
+
const width = 192;
|
|
8641
|
+
const left = rect.right + scrollLeft - width;
|
|
8642
|
+
const top = rect.bottom + scrollTop + 8;
|
|
8643
|
+
return { top, left, width };
|
|
8644
|
+
};
|
|
8645
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: cn("relative", className), children: [
|
|
8646
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
8647
|
+
Button_default,
|
|
8648
|
+
{
|
|
8649
|
+
variant: "ghost",
|
|
8650
|
+
size: "icon",
|
|
8651
|
+
ref: triggerRef,
|
|
8652
|
+
onClick: () => {
|
|
8653
|
+
const next = !isOpen;
|
|
8654
|
+
if (next) {
|
|
8655
|
+
const pos = calculatePosition();
|
|
8656
|
+
if (pos) setDropdownPosition(pos);
|
|
8657
|
+
}
|
|
8658
|
+
setIsOpen(next);
|
|
8659
|
+
},
|
|
8660
|
+
className: "bg-muted hover:bg-accent",
|
|
8661
|
+
"aria-haspopup": "menu",
|
|
8662
|
+
"aria-expanded": isOpen,
|
|
8663
|
+
"aria-label": labels?.heading ?? "Theme",
|
|
8664
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(CurrentIcon, { className: "h-5 w-5" })
|
|
8665
|
+
}
|
|
8666
|
+
),
|
|
8667
|
+
isOpen && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_jsx_runtime43.Fragment, { children: [
|
|
8668
|
+
typeof window !== "undefined" && (0, import_react_dom9.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "fixed inset-0 z-[9998]", onClick: () => setIsOpen(false) }), document.body),
|
|
8669
|
+
typeof window !== "undefined" && dropdownPosition && (0, import_react_dom9.createPortal)(
|
|
8670
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
|
|
8671
|
+
"div",
|
|
8672
|
+
{
|
|
8673
|
+
className: "z-[9999] bg-card border border-border rounded-lg shadow-lg overflow-hidden",
|
|
8674
|
+
style: { position: "absolute", top: dropdownPosition.top, left: dropdownPosition.left, width: dropdownPosition.width },
|
|
8675
|
+
onMouseDown: (e) => e.stopPropagation(),
|
|
8676
|
+
role: "menu",
|
|
8677
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "p-2", children: [
|
|
8678
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "px-3 py-2 text-sm font-medium text-muted-foreground border-b border-border mb-2", children: labels?.heading ?? "Theme" }),
|
|
8679
|
+
themes.map((opt) => {
|
|
8680
|
+
const Icon = opt.icon;
|
|
8681
|
+
const active = theme === opt.value;
|
|
8682
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
|
|
8683
|
+
Button_default,
|
|
8684
|
+
{
|
|
8685
|
+
variant: "ghost",
|
|
8686
|
+
size: "sm",
|
|
8687
|
+
onClick: () => {
|
|
8688
|
+
onChange(opt.value);
|
|
8689
|
+
setIsOpen(false);
|
|
8690
|
+
},
|
|
8691
|
+
className: cn(
|
|
8692
|
+
"w-full justify-start gap-3 h-auto py-2 px-3",
|
|
8693
|
+
active && "bg-primary/10 text-primary"
|
|
8694
|
+
),
|
|
8695
|
+
role: "menuitemradio",
|
|
8696
|
+
"aria-checked": active,
|
|
8697
|
+
children: [
|
|
8698
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Icon, { className: "h-4 w-4" }),
|
|
8699
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "flex-1 text-left", children: opt.label }),
|
|
8700
|
+
active && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "w-2 h-2 rounded-full bg-primary" })
|
|
8701
|
+
]
|
|
8702
|
+
},
|
|
8703
|
+
opt.value
|
|
8704
|
+
);
|
|
8705
|
+
})
|
|
8706
|
+
] })
|
|
8707
|
+
}
|
|
8708
|
+
),
|
|
8709
|
+
document.body
|
|
8710
|
+
)
|
|
8711
|
+
] })
|
|
8712
|
+
] });
|
|
8713
|
+
}
|
|
8714
|
+
|
|
8715
|
+
// ../../components/ui/LanguageSwitcherHeadless.tsx
|
|
8716
|
+
var import_react25 = require("react");
|
|
8717
|
+
var import_react_dom10 = require("react-dom");
|
|
8718
|
+
var import_lucide_react25 = require("lucide-react");
|
|
8719
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
8720
|
+
function LanguageSwitcherHeadless({
|
|
8721
|
+
locales,
|
|
8722
|
+
currentLocale,
|
|
8723
|
+
onSwitch,
|
|
8724
|
+
labels,
|
|
8725
|
+
className
|
|
8726
|
+
}) {
|
|
8727
|
+
const [isOpen, setIsOpen] = (0, import_react25.useState)(false);
|
|
8728
|
+
const [dropdownPosition, setDropdownPosition] = (0, import_react25.useState)(null);
|
|
8729
|
+
const triggerButtonRef = (0, import_react25.useRef)(null);
|
|
8730
|
+
const currentLanguage = locales.find((l) => l.code === currentLocale) || locales[0];
|
|
8731
|
+
const calculatePosition = () => {
|
|
8732
|
+
const rect = triggerButtonRef.current?.getBoundingClientRect();
|
|
8733
|
+
if (!rect) return null;
|
|
8734
|
+
const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
|
|
8735
|
+
const scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
|
|
8736
|
+
const width = 192;
|
|
8737
|
+
const left = rect.right + scrollLeft - width;
|
|
8738
|
+
const top = rect.bottom + scrollTop + 8;
|
|
8739
|
+
return { top, left, width };
|
|
8740
|
+
};
|
|
8741
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: cn("relative", className), children: [
|
|
8742
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
8743
|
+
Button_default,
|
|
8744
|
+
{
|
|
8745
|
+
variant: "ghost",
|
|
8746
|
+
size: "icon",
|
|
8747
|
+
ref: triggerButtonRef,
|
|
8748
|
+
onClick: () => {
|
|
8749
|
+
const next = !isOpen;
|
|
8750
|
+
if (next) {
|
|
8751
|
+
const pos = calculatePosition();
|
|
8752
|
+
if (pos) setDropdownPosition(pos);
|
|
8753
|
+
}
|
|
8754
|
+
setIsOpen(next);
|
|
8755
|
+
},
|
|
8756
|
+
className: "bg-muted hover:bg-accent",
|
|
8757
|
+
"aria-haspopup": "menu",
|
|
8758
|
+
"aria-expanded": isOpen,
|
|
8759
|
+
"aria-label": labels?.heading ?? "Language",
|
|
8760
|
+
title: labels?.heading ?? "Language",
|
|
8761
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react25.Globe, { className: "h-5 w-5" })
|
|
8762
|
+
}
|
|
8763
|
+
),
|
|
8764
|
+
isOpen && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_jsx_runtime44.Fragment, { children: [
|
|
8765
|
+
typeof window !== "undefined" && (0, import_react_dom10.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "fixed inset-0 z-[9998]", onClick: () => setIsOpen(false) }), document.body),
|
|
8766
|
+
typeof window !== "undefined" && dropdownPosition && (0, import_react_dom10.createPortal)(
|
|
8767
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
|
|
8768
|
+
"div",
|
|
8769
|
+
{
|
|
8770
|
+
className: "z-[9999] bg-card border border-border rounded-lg shadow-lg overflow-hidden",
|
|
8771
|
+
style: { position: "absolute", top: dropdownPosition.top, left: dropdownPosition.left, width: dropdownPosition.width },
|
|
8772
|
+
onMouseDown: (e) => e.stopPropagation(),
|
|
8773
|
+
role: "menu",
|
|
8774
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "p-2", children: [
|
|
8775
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "px-3 py-2 text-sm font-medium text-muted-foreground border-b border-border mb-2", children: labels?.heading ?? "Language" }),
|
|
8776
|
+
locales.map((language) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
|
|
8777
|
+
Button_default,
|
|
8778
|
+
{
|
|
8779
|
+
variant: "ghost",
|
|
8780
|
+
size: "sm",
|
|
8781
|
+
onClick: () => {
|
|
8782
|
+
onSwitch(language.code);
|
|
8783
|
+
setIsOpen(false);
|
|
8784
|
+
},
|
|
8785
|
+
className: cn("w-full justify-start gap-3 h-auto py-2 px-3", currentLocale === language.code && "bg-primary/10 text-primary"),
|
|
8786
|
+
role: "menuitemradio",
|
|
8787
|
+
"aria-checked": currentLocale === language.code,
|
|
8788
|
+
children: [
|
|
8789
|
+
language.flag && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "text-lg", children: language.flag }),
|
|
8790
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "flex-1 text-left", children: language.name }),
|
|
8791
|
+
currentLocale === language.code && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "w-2 h-2 rounded-full bg-primary" })
|
|
8792
|
+
]
|
|
8793
|
+
},
|
|
8794
|
+
language.code
|
|
8795
|
+
))
|
|
8796
|
+
] })
|
|
8797
|
+
}
|
|
8798
|
+
),
|
|
8799
|
+
document.body
|
|
8800
|
+
)
|
|
8801
|
+
] })
|
|
8802
|
+
] });
|
|
8803
|
+
}
|
|
8804
|
+
|
|
6377
8805
|
// locales/en.json
|
|
6378
8806
|
var en_default = {
|
|
6379
8807
|
Common: {
|
|
@@ -6522,12 +8950,25 @@ function getUnderverseMessages(locale = "en") {
|
|
|
6522
8950
|
Checkbox,
|
|
6523
8951
|
ClientOnly,
|
|
6524
8952
|
Combobox,
|
|
8953
|
+
CompactPagination,
|
|
6525
8954
|
DataTable,
|
|
6526
8955
|
DatePicker,
|
|
8956
|
+
DateRangePicker,
|
|
6527
8957
|
DateUtils,
|
|
6528
8958
|
Drawer,
|
|
6529
8959
|
DropdownMenu,
|
|
6530
8960
|
FloatingContacts,
|
|
8961
|
+
Form,
|
|
8962
|
+
FormActions,
|
|
8963
|
+
FormCheckbox,
|
|
8964
|
+
FormControl,
|
|
8965
|
+
FormDescription,
|
|
8966
|
+
FormField,
|
|
8967
|
+
FormInput,
|
|
8968
|
+
FormItem,
|
|
8969
|
+
FormLabel,
|
|
8970
|
+
FormMessage,
|
|
8971
|
+
FormSubmitButton,
|
|
6531
8972
|
GlobalLoading,
|
|
6532
8973
|
GradientBadge,
|
|
6533
8974
|
ImageUpload,
|
|
@@ -6535,6 +8976,8 @@ function getUnderverseMessages(locale = "en") {
|
|
|
6535
8976
|
Input,
|
|
6536
8977
|
InteractiveBadge,
|
|
6537
8978
|
Label,
|
|
8979
|
+
LanguageSwitcher,
|
|
8980
|
+
LanguageSwitcherHeadless,
|
|
6538
8981
|
LoadingBar,
|
|
6539
8982
|
LoadingDots,
|
|
6540
8983
|
LoadingSpinner,
|
|
@@ -6542,8 +8985,10 @@ function getUnderverseMessages(locale = "en") {
|
|
|
6542
8985
|
MultiCombobox,
|
|
6543
8986
|
NotificationBadge,
|
|
6544
8987
|
NotificationModal,
|
|
8988
|
+
NumberInput,
|
|
6545
8989
|
PageLoading,
|
|
6546
8990
|
Pagination,
|
|
8991
|
+
PasswordInput,
|
|
6547
8992
|
PillTabs,
|
|
6548
8993
|
Popover,
|
|
6549
8994
|
Progress,
|
|
@@ -6554,6 +8999,7 @@ function getUnderverseMessages(locale = "en") {
|
|
|
6554
8999
|
Section,
|
|
6555
9000
|
Sheet,
|
|
6556
9001
|
SidebarSheet,
|
|
9002
|
+
SimplePagination,
|
|
6557
9003
|
SimpleTabs,
|
|
6558
9004
|
Skeleton,
|
|
6559
9005
|
SlideOver,
|
|
@@ -6572,6 +9018,8 @@ function getUnderverseMessages(locale = "en") {
|
|
|
6572
9018
|
Tabs,
|
|
6573
9019
|
TagBadge,
|
|
6574
9020
|
Textarea,
|
|
9021
|
+
ThemeToggle,
|
|
9022
|
+
ThemeToggleHeadless,
|
|
6575
9023
|
ToastProvider,
|
|
6576
9024
|
Tooltip,
|
|
6577
9025
|
VARIANT_STYLES_ALERT,
|
|
@@ -6580,6 +9028,7 @@ function getUnderverseMessages(locale = "en") {
|
|
|
6580
9028
|
cn,
|
|
6581
9029
|
getUnderverseMessages,
|
|
6582
9030
|
underverseMessages,
|
|
9031
|
+
useFormField,
|
|
6583
9032
|
useToast
|
|
6584
9033
|
});
|
|
6585
9034
|
//# sourceMappingURL=index.cjs.map
|