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