@geomak/ui 7.5.0 → 7.5.2
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 +339 -322
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +12 -5
- package/dist/index.d.ts +12 -5
- package/dist/index.js +47 -30
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var chunk4V4U2W7K_cjs = require('./chunk-4V4U2W7K.cjs');
|
|
4
4
|
var chunkCNUDNGJM_cjs = require('./chunk-CNUDNGJM.cjs');
|
|
5
|
-
var
|
|
5
|
+
var React31 = require('react');
|
|
6
6
|
var reactDom = require('react-dom');
|
|
7
7
|
var jsxRuntime = require('react/jsx-runtime');
|
|
8
8
|
var AvatarPrimitive = require('@radix-ui/react-avatar');
|
|
@@ -41,7 +41,7 @@ function _interopNamespace(e) {
|
|
|
41
41
|
return Object.freeze(n);
|
|
42
42
|
}
|
|
43
43
|
|
|
44
|
-
var
|
|
44
|
+
var React31__default = /*#__PURE__*/_interopDefault(React31);
|
|
45
45
|
var AvatarPrimitive__namespace = /*#__PURE__*/_interopNamespace(AvatarPrimitive);
|
|
46
46
|
var DropdownMenu2__namespace = /*#__PURE__*/_interopNamespace(DropdownMenu2);
|
|
47
47
|
var Dialog__namespace = /*#__PURE__*/_interopNamespace(Dialog);
|
|
@@ -67,8 +67,8 @@ function cx(...values) {
|
|
|
67
67
|
return out;
|
|
68
68
|
}
|
|
69
69
|
function Portal({ children, target }) {
|
|
70
|
-
const [resolved, setResolved] =
|
|
71
|
-
|
|
70
|
+
const [resolved, setResolved] = React31.useState(null);
|
|
71
|
+
React31.useEffect(() => {
|
|
72
72
|
if (target === null) {
|
|
73
73
|
setResolved(null);
|
|
74
74
|
return;
|
|
@@ -489,7 +489,7 @@ function Typography({
|
|
|
489
489
|
}
|
|
490
490
|
);
|
|
491
491
|
}
|
|
492
|
-
|
|
492
|
+
var IconButton = React31__default.default.forwardRef(function IconButton2({
|
|
493
493
|
icon,
|
|
494
494
|
onClick,
|
|
495
495
|
type = "primary",
|
|
@@ -501,8 +501,8 @@ function IconButton({
|
|
|
501
501
|
title,
|
|
502
502
|
className = "",
|
|
503
503
|
style
|
|
504
|
-
}) {
|
|
505
|
-
const colorScheme =
|
|
504
|
+
}, ref) {
|
|
505
|
+
const colorScheme = React31.useMemo(() => {
|
|
506
506
|
if (type === "primary") {
|
|
507
507
|
return "bg-accent text-accent-fg hover:bg-accent-hover";
|
|
508
508
|
}
|
|
@@ -517,6 +517,7 @@ function IconButton({
|
|
|
517
517
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
518
518
|
"button",
|
|
519
519
|
{
|
|
520
|
+
ref,
|
|
520
521
|
type: buttonType,
|
|
521
522
|
disabled: disabled || loading,
|
|
522
523
|
onClick,
|
|
@@ -527,7 +528,9 @@ function IconButton({
|
|
|
527
528
|
children: loading ? loadingIcon : icon
|
|
528
529
|
}
|
|
529
530
|
);
|
|
530
|
-
}
|
|
531
|
+
});
|
|
532
|
+
IconButton.displayName = "IconButton";
|
|
533
|
+
var IconButton_default = IconButton;
|
|
531
534
|
var VARIANT_CLASSES = {
|
|
532
535
|
primary: [
|
|
533
536
|
"bg-accent text-accent-fg",
|
|
@@ -595,7 +598,7 @@ var SIZE_CLASSES = {
|
|
|
595
598
|
md: "h-9 px-4 text-sm gap-1.5 rounded-lg",
|
|
596
599
|
lg: "h-11 px-5 text-sm gap-2 rounded-xl"
|
|
597
600
|
};
|
|
598
|
-
var Button =
|
|
601
|
+
var Button = React31__default.default.forwardRef(function Button2({
|
|
599
602
|
content,
|
|
600
603
|
variant = "primary",
|
|
601
604
|
size = "md",
|
|
@@ -703,7 +706,7 @@ function MenuButton({
|
|
|
703
706
|
"data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
|
|
704
707
|
"data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95"
|
|
705
708
|
].join(" "),
|
|
706
|
-
children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
709
|
+
children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(React31__default.default.Fragment, { children: [
|
|
707
710
|
item.separatorBefore && /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu2__namespace.Separator, { className: "my-1 h-px bg-border" }),
|
|
708
711
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
709
712
|
DropdownMenu2__namespace.Item,
|
|
@@ -946,9 +949,9 @@ function Tooltip({
|
|
|
946
949
|
] }) });
|
|
947
950
|
}
|
|
948
951
|
var TooltipProvider = TooltipPrimitive__namespace.Provider;
|
|
949
|
-
var TabsContext =
|
|
952
|
+
var TabsContext = React31.createContext(null);
|
|
950
953
|
function useTabsContext() {
|
|
951
|
-
const ctx =
|
|
954
|
+
const ctx = React31.useContext(TabsContext);
|
|
952
955
|
if (!ctx) throw new Error("Tabs.List / Tabs.Trigger / Tabs.Panel must be rendered inside <Tabs>.");
|
|
953
956
|
return ctx;
|
|
954
957
|
}
|
|
@@ -970,26 +973,26 @@ function Tabs({
|
|
|
970
973
|
children
|
|
971
974
|
}) {
|
|
972
975
|
const isControlled = value !== void 0;
|
|
973
|
-
const [internal, setInternal] =
|
|
976
|
+
const [internal, setInternal] = React31.useState(defaultValue);
|
|
974
977
|
const current = isControlled ? value : internal;
|
|
975
978
|
const reduced = !!framerMotion.useReducedMotion();
|
|
976
|
-
const indicatorId =
|
|
977
|
-
const select =
|
|
979
|
+
const indicatorId = React31.useId();
|
|
980
|
+
const select = React31.useCallback((next) => {
|
|
978
981
|
if (!isControlled) setInternal(next);
|
|
979
982
|
onChange?.(next);
|
|
980
983
|
}, [isControlled, onChange]);
|
|
981
|
-
const registry =
|
|
982
|
-
const orderRef =
|
|
983
|
-
const [, bump] =
|
|
984
|
-
const registerTab =
|
|
984
|
+
const registry = React31.useRef(/* @__PURE__ */ new Map());
|
|
985
|
+
const orderRef = React31.useRef(0);
|
|
986
|
+
const [, bump] = React31.useState(0);
|
|
987
|
+
const registerTab = React31.useCallback((val, meta) => {
|
|
985
988
|
const existing = registry.current.get(val);
|
|
986
989
|
registry.current.set(val, { ...meta, order: existing?.order ?? orderRef.current++ });
|
|
987
990
|
if (!existing) bump((v) => v + 1);
|
|
988
991
|
}, []);
|
|
989
|
-
const unregisterTab =
|
|
992
|
+
const unregisterTab = React31.useCallback((val) => {
|
|
990
993
|
if (registry.current.delete(val)) bump((v) => v + 1);
|
|
991
994
|
}, []);
|
|
992
|
-
const getTabs =
|
|
995
|
+
const getTabs = React31.useCallback(() => [...registry.current.entries()].sort((a, b) => a[1].order - b[1].order).map(([val, m]) => ({ value: val, label: m.label, icon: m.icon, disabled: m.disabled })), []);
|
|
993
996
|
return /* @__PURE__ */ jsxRuntime.jsx(TabsContext.Provider, { value: { value: current, variant, size, orientation, indicatorId, reduced, select, registerTab, unregisterTab, getTabs }, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
994
997
|
TabsPrimitive__namespace.Root,
|
|
995
998
|
{
|
|
@@ -1009,10 +1012,10 @@ function Tabs({
|
|
|
1009
1012
|
function TabsList({ children, "aria-label": ariaLabel, className = "" }) {
|
|
1010
1013
|
const { variant, orientation, reduced, value } = useTabsContext();
|
|
1011
1014
|
const horizontal = orientation === "horizontal";
|
|
1012
|
-
const scrollRef =
|
|
1013
|
-
const [edges, setEdges] =
|
|
1015
|
+
const scrollRef = React31.useRef(null);
|
|
1016
|
+
const [edges, setEdges] = React31.useState({ start: false, end: false });
|
|
1014
1017
|
const scrollable = variant !== "segmented";
|
|
1015
|
-
|
|
1018
|
+
React31.useLayoutEffect(() => {
|
|
1016
1019
|
const el = scrollRef.current;
|
|
1017
1020
|
if (!el || !scrollable) return;
|
|
1018
1021
|
const update = () => {
|
|
@@ -1037,13 +1040,13 @@ function TabsList({ children, "aria-label": ariaLabel, className = "" }) {
|
|
|
1037
1040
|
ro.disconnect();
|
|
1038
1041
|
};
|
|
1039
1042
|
}, [horizontal, scrollable, children]);
|
|
1040
|
-
const nudge =
|
|
1043
|
+
const nudge = React31.useCallback((dir) => {
|
|
1041
1044
|
const el = scrollRef.current;
|
|
1042
1045
|
if (!el) return;
|
|
1043
1046
|
const amount = (horizontal ? el.clientWidth : el.clientHeight) * 0.7 * dir;
|
|
1044
1047
|
el.scrollBy({ [horizontal ? "left" : "top"]: amount, behavior: reduced ? "auto" : "smooth" });
|
|
1045
1048
|
}, [horizontal, reduced]);
|
|
1046
|
-
|
|
1049
|
+
React31.useLayoutEffect(() => {
|
|
1047
1050
|
const el = scrollRef.current;
|
|
1048
1051
|
if (!el || !scrollable) return;
|
|
1049
1052
|
const active = el.querySelector("[role=tab][data-state=active]");
|
|
@@ -1101,9 +1104,9 @@ function Chevron2({ side, orientation, onClick }) {
|
|
|
1101
1104
|
function OverflowMenu() {
|
|
1102
1105
|
const { getTabs, value, select, orientation } = useTabsContext();
|
|
1103
1106
|
const horizontal = orientation === "horizontal";
|
|
1104
|
-
const [open, setOpen] =
|
|
1105
|
-
const wrapRef =
|
|
1106
|
-
const timer =
|
|
1107
|
+
const [open, setOpen] = React31.useState(false);
|
|
1108
|
+
const wrapRef = React31.useRef(null);
|
|
1109
|
+
const timer = React31.useRef(null);
|
|
1107
1110
|
const openNow = () => {
|
|
1108
1111
|
if (timer.current) clearTimeout(timer.current);
|
|
1109
1112
|
setOpen(true);
|
|
@@ -1111,7 +1114,7 @@ function OverflowMenu() {
|
|
|
1111
1114
|
const closeSoon = () => {
|
|
1112
1115
|
timer.current = setTimeout(() => setOpen(false), 160);
|
|
1113
1116
|
};
|
|
1114
|
-
|
|
1117
|
+
React31.useLayoutEffect(() => {
|
|
1115
1118
|
if (!open) return;
|
|
1116
1119
|
const onDoc = (e) => {
|
|
1117
1120
|
if (wrapRef.current && !wrapRef.current.contains(e.target)) setOpen(false);
|
|
@@ -1192,7 +1195,7 @@ function TabsTrigger({ value, icon, badge, closeable, onClose, disabled, classNa
|
|
|
1192
1195
|
const isActive = active === value;
|
|
1193
1196
|
const horizontal = orientation === "horizontal";
|
|
1194
1197
|
const sz = SIZE[size];
|
|
1195
|
-
|
|
1198
|
+
React31.useLayoutEffect(() => {
|
|
1196
1199
|
registerTab(value, { label: children, icon, disabled });
|
|
1197
1200
|
return () => unregisterTab(value);
|
|
1198
1201
|
}, [value, children, icon, disabled, registerTab, unregisterTab]);
|
|
@@ -1379,7 +1382,7 @@ function Tree({
|
|
|
1379
1382
|
item.key
|
|
1380
1383
|
)) });
|
|
1381
1384
|
}
|
|
1382
|
-
var AccordionCtx =
|
|
1385
|
+
var AccordionCtx = React31.createContext({ variant: "separated" });
|
|
1383
1386
|
function Accordion2({
|
|
1384
1387
|
children,
|
|
1385
1388
|
type = "single",
|
|
@@ -1438,7 +1441,7 @@ var Chevron3 = /* @__PURE__ */ jsxRuntime.jsx(
|
|
|
1438
1441
|
}
|
|
1439
1442
|
);
|
|
1440
1443
|
function AccordionItem({ value, title, icon, children, disabled, className = "" }) {
|
|
1441
|
-
const { variant } =
|
|
1444
|
+
const { variant } = React31.useContext(AccordionCtx);
|
|
1442
1445
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1443
1446
|
AccordionPrimitive__namespace.Item,
|
|
1444
1447
|
{
|
|
@@ -1497,7 +1500,7 @@ function Breadcrumbs({
|
|
|
1497
1500
|
className = "",
|
|
1498
1501
|
style
|
|
1499
1502
|
}) {
|
|
1500
|
-
const [expanded, setExpanded] =
|
|
1503
|
+
const [expanded, setExpanded] = React31.useState(false);
|
|
1501
1504
|
const shouldCollapse = maxItems > 0 && items.length > maxItems && !expanded;
|
|
1502
1505
|
const visible = [];
|
|
1503
1506
|
if (shouldCollapse) {
|
|
@@ -1681,8 +1684,8 @@ function Stepper({
|
|
|
1681
1684
|
className = ""
|
|
1682
1685
|
}) {
|
|
1683
1686
|
const reduced = framerMotion.useReducedMotion();
|
|
1684
|
-
const [forcedVertical, setForcedVertical] =
|
|
1685
|
-
|
|
1687
|
+
const [forcedVertical, setForcedVertical] = React31.useState(false);
|
|
1688
|
+
React31.useEffect(() => {
|
|
1686
1689
|
if (!responsive || orientation === "vertical") return;
|
|
1687
1690
|
if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
|
|
1688
1691
|
const mq = window.matchMedia("(max-width: 767px)");
|
|
@@ -1791,7 +1794,7 @@ function Kbd({
|
|
|
1791
1794
|
style
|
|
1792
1795
|
}) {
|
|
1793
1796
|
if (keys && keys.length > 0) {
|
|
1794
|
-
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx("inline-flex items-center gap-1", className), style, children: keys.map((k, i) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1797
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: cx("inline-flex items-center gap-1", className), style, children: keys.map((k, i) => /* @__PURE__ */ jsxRuntime.jsxs(React31__default.default.Fragment, { children: [
|
|
1795
1798
|
i > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground-muted text-xs select-none", children: separator }),
|
|
1796
1799
|
/* @__PURE__ */ jsxRuntime.jsx("kbd", { className: [cap, SIZE3[size]].join(" "), children: k })
|
|
1797
1800
|
] }, `${k}-${i}`)) });
|
|
@@ -1882,13 +1885,13 @@ function FlatCarousel({
|
|
|
1882
1885
|
className = "",
|
|
1883
1886
|
style
|
|
1884
1887
|
}) {
|
|
1885
|
-
const scrollerRef =
|
|
1886
|
-
const slides =
|
|
1887
|
-
const [active, setActive] =
|
|
1888
|
-
const [atStart, setAtStart] =
|
|
1889
|
-
const [atEnd, setAtEnd] =
|
|
1888
|
+
const scrollerRef = React31.useRef(null);
|
|
1889
|
+
const slides = React31__default.default.Children.toArray(children);
|
|
1890
|
+
const [active, setActive] = React31.useState(0);
|
|
1891
|
+
const [atStart, setAtStart] = React31.useState(true);
|
|
1892
|
+
const [atEnd, setAtEnd] = React31.useState(false);
|
|
1890
1893
|
const width = typeof itemWidth === "number" ? `${itemWidth}px` : itemWidth;
|
|
1891
|
-
const update =
|
|
1894
|
+
const update = React31.useCallback(() => {
|
|
1892
1895
|
const el = scrollerRef.current;
|
|
1893
1896
|
if (!el) return;
|
|
1894
1897
|
setAtStart(el.scrollLeft <= 1);
|
|
@@ -1897,7 +1900,7 @@ function FlatCarousel({
|
|
|
1897
1900
|
const slideW = first ? first.getBoundingClientRect().width + gap : el.clientWidth;
|
|
1898
1901
|
setActive(Math.round(el.scrollLeft / slideW));
|
|
1899
1902
|
}, [gap]);
|
|
1900
|
-
|
|
1903
|
+
React31.useEffect(() => {
|
|
1901
1904
|
update();
|
|
1902
1905
|
const el = scrollerRef.current;
|
|
1903
1906
|
if (!el) return;
|
|
@@ -1938,9 +1941,9 @@ function RotatingCarousel({
|
|
|
1938
1941
|
className = "",
|
|
1939
1942
|
style
|
|
1940
1943
|
}) {
|
|
1941
|
-
const slides =
|
|
1944
|
+
const slides = React31__default.default.Children.toArray(children);
|
|
1942
1945
|
const count = slides.length;
|
|
1943
|
-
const [active, setActive] =
|
|
1946
|
+
const [active, setActive] = React31.useState(0);
|
|
1944
1947
|
const reduced = framerMotion.useReducedMotion();
|
|
1945
1948
|
const wrap = (n) => count > 0 ? (n % count + count) % count : 0;
|
|
1946
1949
|
const idx = wrap(active);
|
|
@@ -2178,13 +2181,13 @@ function Chat({
|
|
|
2178
2181
|
className = "",
|
|
2179
2182
|
style
|
|
2180
2183
|
}) {
|
|
2181
|
-
const listRef =
|
|
2182
|
-
const atBottomRef =
|
|
2183
|
-
const [showJump, setShowJump] =
|
|
2184
|
-
const [draft, setDraft] =
|
|
2184
|
+
const listRef = React31.useRef(null);
|
|
2185
|
+
const atBottomRef = React31.useRef(true);
|
|
2186
|
+
const [showJump, setShowJump] = React31.useState(false);
|
|
2187
|
+
const [draft, setDraft] = React31.useState("");
|
|
2185
2188
|
const hasHeader = title != null || subtitle != null || avatar != null || headerActions != null;
|
|
2186
2189
|
const isTyping = typingNames.length > 0;
|
|
2187
|
-
const scrollToBottom =
|
|
2190
|
+
const scrollToBottom = React31.useCallback((smooth = true) => {
|
|
2188
2191
|
const el = listRef.current;
|
|
2189
2192
|
if (!el) return;
|
|
2190
2193
|
if (typeof el.scrollTo === "function") el.scrollTo({ top: el.scrollHeight, behavior: smooth ? "smooth" : "auto" });
|
|
@@ -2197,10 +2200,10 @@ function Chat({
|
|
|
2197
2200
|
atBottomRef.current = near;
|
|
2198
2201
|
setShowJump(!near);
|
|
2199
2202
|
};
|
|
2200
|
-
|
|
2203
|
+
React31.useEffect(() => {
|
|
2201
2204
|
if (atBottomRef.current) scrollToBottom(messages.length > 0);
|
|
2202
2205
|
}, [messages.length, isTyping]);
|
|
2203
|
-
|
|
2206
|
+
React31.useEffect(() => {
|
|
2204
2207
|
scrollToBottom(false);
|
|
2205
2208
|
}, [scrollToBottom]);
|
|
2206
2209
|
const send = () => {
|
|
@@ -2297,7 +2300,7 @@ function Chat({
|
|
|
2297
2300
|
}
|
|
2298
2301
|
),
|
|
2299
2302
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2300
|
-
|
|
2303
|
+
IconButton_default,
|
|
2301
2304
|
{
|
|
2302
2305
|
type: "primary",
|
|
2303
2306
|
icon: /* @__PURE__ */ jsxRuntime.jsx(SendIcon, {}),
|
|
@@ -2390,7 +2393,7 @@ function FAB({
|
|
|
2390
2393
|
className = "",
|
|
2391
2394
|
style
|
|
2392
2395
|
}) {
|
|
2393
|
-
const [open, setOpen] =
|
|
2396
|
+
const [open, setOpen] = React31.useState(false);
|
|
2394
2397
|
const reduced = framerMotion.useReducedMotion();
|
|
2395
2398
|
const hasDial = !!actions && actions.length > 0;
|
|
2396
2399
|
const bottom = position.startsWith("bottom");
|
|
@@ -2492,8 +2495,8 @@ function PopConfirm({
|
|
|
2492
2495
|
onOpenChange,
|
|
2493
2496
|
className = ""
|
|
2494
2497
|
}) {
|
|
2495
|
-
const [uncontrolledOpen, setUncontrolledOpen] =
|
|
2496
|
-
const [loading, setLoading] =
|
|
2498
|
+
const [uncontrolledOpen, setUncontrolledOpen] = React31.useState(false);
|
|
2499
|
+
const [loading, setLoading] = React31.useState(false);
|
|
2497
2500
|
const isOpen = open ?? uncontrolledOpen;
|
|
2498
2501
|
const setOpen = (next) => {
|
|
2499
2502
|
onOpenChange?.(next);
|
|
@@ -2580,16 +2583,16 @@ function LogoutTimer({
|
|
|
2580
2583
|
logoutLabel = "Sign out now"
|
|
2581
2584
|
}) {
|
|
2582
2585
|
const reduced = framerMotion.useReducedMotion();
|
|
2583
|
-
const [warning, setWarning] =
|
|
2584
|
-
const [remaining, setRemaining] =
|
|
2585
|
-
const idleTimer =
|
|
2586
|
-
const tick =
|
|
2587
|
-
const deadline =
|
|
2588
|
-
const warningRef =
|
|
2589
|
-
const lastReset =
|
|
2590
|
-
const cbs =
|
|
2586
|
+
const [warning, setWarning] = React31.useState(false);
|
|
2587
|
+
const [remaining, setRemaining] = React31.useState(countdown);
|
|
2588
|
+
const idleTimer = React31.useRef(null);
|
|
2589
|
+
const tick = React31.useRef(null);
|
|
2590
|
+
const deadline = React31.useRef(0);
|
|
2591
|
+
const warningRef = React31.useRef(false);
|
|
2592
|
+
const lastReset = React31.useRef(0);
|
|
2593
|
+
const cbs = React31.useRef({ onLogout, onContinue, onWarning });
|
|
2591
2594
|
cbs.current = { onLogout, onContinue, onWarning };
|
|
2592
|
-
const clearTimers =
|
|
2595
|
+
const clearTimers = React31.useCallback(() => {
|
|
2593
2596
|
if (idleTimer.current) {
|
|
2594
2597
|
clearTimeout(idleTimer.current);
|
|
2595
2598
|
idleTimer.current = null;
|
|
@@ -2599,13 +2602,13 @@ function LogoutTimer({
|
|
|
2599
2602
|
tick.current = null;
|
|
2600
2603
|
}
|
|
2601
2604
|
}, []);
|
|
2602
|
-
const logout =
|
|
2605
|
+
const logout = React31.useCallback(() => {
|
|
2603
2606
|
clearTimers();
|
|
2604
2607
|
warningRef.current = false;
|
|
2605
2608
|
setWarning(false);
|
|
2606
2609
|
cbs.current.onLogout();
|
|
2607
2610
|
}, [clearTimers]);
|
|
2608
|
-
const startIdle =
|
|
2611
|
+
const startIdle = React31.useCallback(() => {
|
|
2609
2612
|
if (idleTimer.current) clearTimeout(idleTimer.current);
|
|
2610
2613
|
idleTimer.current = setTimeout(() => {
|
|
2611
2614
|
warningRef.current = true;
|
|
@@ -2620,7 +2623,7 @@ function LogoutTimer({
|
|
|
2620
2623
|
}, 250);
|
|
2621
2624
|
}, timeout);
|
|
2622
2625
|
}, [timeout, countdown, logout]);
|
|
2623
|
-
const stay =
|
|
2626
|
+
const stay = React31.useCallback(() => {
|
|
2624
2627
|
if (tick.current) {
|
|
2625
2628
|
clearInterval(tick.current);
|
|
2626
2629
|
tick.current = null;
|
|
@@ -2630,7 +2633,7 @@ function LogoutTimer({
|
|
|
2630
2633
|
cbs.current.onContinue?.();
|
|
2631
2634
|
startIdle();
|
|
2632
2635
|
}, [startIdle]);
|
|
2633
|
-
|
|
2636
|
+
React31.useEffect(() => {
|
|
2634
2637
|
if (!enabled) {
|
|
2635
2638
|
clearTimers();
|
|
2636
2639
|
warningRef.current = false;
|
|
@@ -2695,11 +2698,11 @@ function SegmentedControl({
|
|
|
2695
2698
|
"aria-label": ariaLabel
|
|
2696
2699
|
}) {
|
|
2697
2700
|
const sz = SIZE5[size];
|
|
2698
|
-
const groupId =
|
|
2699
|
-
const errorId =
|
|
2701
|
+
const groupId = React31.useId();
|
|
2702
|
+
const errorId = React31.useId();
|
|
2700
2703
|
const hasError = errorMessage != null;
|
|
2701
2704
|
const isControlled = value !== void 0;
|
|
2702
|
-
const [internal, setInternal] =
|
|
2705
|
+
const [internal, setInternal] = React31.useState(defaultValue);
|
|
2703
2706
|
const current = isControlled ? value : internal;
|
|
2704
2707
|
const handle = (v) => {
|
|
2705
2708
|
if (!v) return;
|
|
@@ -2860,22 +2863,22 @@ function Scheduler({
|
|
|
2860
2863
|
style
|
|
2861
2864
|
}) {
|
|
2862
2865
|
const reduced = framerMotion.useReducedMotion();
|
|
2863
|
-
const [view, setView] =
|
|
2864
|
-
const [cursor, setCursor] =
|
|
2865
|
-
const [loaded, setLoaded] =
|
|
2866
|
-
const [loading, setLoading] =
|
|
2867
|
-
const [error, setError] =
|
|
2868
|
-
const [reloadKey, setReloadKey] =
|
|
2869
|
-
const [dir, setDir] =
|
|
2870
|
-
const cbRef =
|
|
2866
|
+
const [view, setView] = React31.useState(defaultView);
|
|
2867
|
+
const [cursor, setCursor] = React31.useState(() => defaultDate ?? /* @__PURE__ */ new Date());
|
|
2868
|
+
const [loaded, setLoaded] = React31.useState([]);
|
|
2869
|
+
const [loading, setLoading] = React31.useState(false);
|
|
2870
|
+
const [error, setError] = React31.useState(null);
|
|
2871
|
+
const [reloadKey, setReloadKey] = React31.useState(0);
|
|
2872
|
+
const [dir, setDir] = React31.useState(0);
|
|
2873
|
+
const cbRef = React31.useRef({ loadEvents, onError });
|
|
2871
2874
|
cbRef.current = { loadEvents, onError };
|
|
2872
|
-
const range =
|
|
2875
|
+
const range = React31.useMemo(
|
|
2873
2876
|
() => view === "month" ? monthRange(cursor) : weekRange(cursor, weekStartsOn),
|
|
2874
2877
|
[view, cursor, weekStartsOn]
|
|
2875
2878
|
);
|
|
2876
2879
|
const fromKey = range.from.getTime();
|
|
2877
2880
|
const toKey = range.to.getTime();
|
|
2878
|
-
|
|
2881
|
+
React31.useEffect(() => {
|
|
2879
2882
|
const { loadEvents: loader, onError: onErr } = cbRef.current;
|
|
2880
2883
|
if (!loader) return;
|
|
2881
2884
|
let cancelled = false;
|
|
@@ -2895,16 +2898,16 @@ function Scheduler({
|
|
|
2895
2898
|
cancelled = true;
|
|
2896
2899
|
};
|
|
2897
2900
|
}, [fromKey, toKey, view, reloadKey]);
|
|
2898
|
-
const retry =
|
|
2899
|
-
const events =
|
|
2901
|
+
const retry = React31.useCallback(() => setReloadKey((k) => k + 1), []);
|
|
2902
|
+
const events = React31.useMemo(
|
|
2900
2903
|
() => (controlledEvents ?? loaded).map(normalize),
|
|
2901
2904
|
[controlledEvents, loaded]
|
|
2902
2905
|
);
|
|
2903
|
-
const go =
|
|
2906
|
+
const go = React31.useCallback((delta) => {
|
|
2904
2907
|
setDir(delta);
|
|
2905
2908
|
setCursor((c) => view === "month" ? addMonths(c, delta) : addDays(c, delta * 7));
|
|
2906
2909
|
}, [view]);
|
|
2907
|
-
const goToday =
|
|
2910
|
+
const goToday = React31.useCallback(() => {
|
|
2908
2911
|
setDir(0);
|
|
2909
2912
|
setCursor(/* @__PURE__ */ new Date());
|
|
2910
2913
|
}, []);
|
|
@@ -2918,8 +2921,8 @@ function Scheduler({
|
|
|
2918
2921
|
children: [
|
|
2919
2922
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3 border-b border-border px-4 py-3", children: [
|
|
2920
2923
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
2921
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2922
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2924
|
+
/* @__PURE__ */ jsxRuntime.jsx(IconButton_default, { type: "bordered", size: "sm", icon: /* @__PURE__ */ jsxRuntime.jsx(Chevron4, { dir: "left" }), title: "Previous", onClick: () => go(-1) }),
|
|
2925
|
+
/* @__PURE__ */ jsxRuntime.jsx(IconButton_default, { type: "bordered", size: "sm", icon: /* @__PURE__ */ jsxRuntime.jsx(Chevron4, { dir: "right" }), title: "Next", onClick: () => go(1) }),
|
|
2923
2926
|
/* @__PURE__ */ jsxRuntime.jsx(Button_default, { variant: "ghost", size: "sm", content: "Today", onClick: goToday }),
|
|
2924
2927
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2925
2928
|
MonthYearPicker,
|
|
@@ -3014,9 +3017,9 @@ function SchedulerError({ onRetry }) {
|
|
|
3014
3017
|
] });
|
|
3015
3018
|
}
|
|
3016
3019
|
function MonthYearPicker({ label, cursor, onPick }) {
|
|
3017
|
-
const [open, setOpen] =
|
|
3018
|
-
const [viewYear, setViewYear] =
|
|
3019
|
-
|
|
3020
|
+
const [open, setOpen] = React31.useState(false);
|
|
3021
|
+
const [viewYear, setViewYear] = React31.useState(cursor.getFullYear());
|
|
3022
|
+
React31.useEffect(() => {
|
|
3020
3023
|
if (open) setViewYear(cursor.getFullYear());
|
|
3021
3024
|
}, [open, cursor]);
|
|
3022
3025
|
return /* @__PURE__ */ jsxRuntime.jsxs(Popover__namespace.Root, { open, onOpenChange: setOpen, children: [
|
|
@@ -3043,9 +3046,9 @@ function MonthYearPicker({ label, cursor, onPick }) {
|
|
|
3043
3046
|
].join(" "),
|
|
3044
3047
|
children: [
|
|
3045
3048
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex items-center justify-between", children: [
|
|
3046
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3049
|
+
/* @__PURE__ */ jsxRuntime.jsx(IconButton_default, { size: "sm", type: "bordered", icon: /* @__PURE__ */ jsxRuntime.jsx(Chevron4, { dir: "left" }), title: "Previous year", onClick: () => setViewYear((y) => y - 1) }),
|
|
3047
3050
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold tabular-nums text-foreground", children: viewYear }),
|
|
3048
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
3051
|
+
/* @__PURE__ */ jsxRuntime.jsx(IconButton_default, { size: "sm", type: "bordered", icon: /* @__PURE__ */ jsxRuntime.jsx(Chevron4, { dir: "right" }), title: "Next year", onClick: () => setViewYear((y) => y + 1) })
|
|
3049
3052
|
] }),
|
|
3050
3053
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-3 gap-1", children: MONTHS_SHORT.map((m, i) => {
|
|
3051
3054
|
const current = i === cursor.getMonth() && viewYear === cursor.getFullYear();
|
|
@@ -3090,8 +3093,8 @@ function MonthView({
|
|
|
3090
3093
|
onSelectSlot,
|
|
3091
3094
|
onSelectEvent
|
|
3092
3095
|
}) {
|
|
3093
|
-
const grid =
|
|
3094
|
-
const eventsByDay =
|
|
3096
|
+
const grid = React31.useMemo(() => buildMonthGrid(cursor, weekStartsOn), [cursor, weekStartsOn]);
|
|
3097
|
+
const eventsByDay = React31.useMemo(() => bucketByDay(events), [events]);
|
|
3095
3098
|
const labels = weekdayLabels(weekStartsOn);
|
|
3096
3099
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col", children: [
|
|
3097
3100
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7 border-b border-border", children: labels.map((l) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-2 py-1.5 text-center text-[11px] font-medium uppercase tracking-wide text-foreground-muted", children: l }, l)) }),
|
|
@@ -3165,12 +3168,12 @@ function WeekView({
|
|
|
3165
3168
|
onSelectSlot,
|
|
3166
3169
|
onSelectEvent
|
|
3167
3170
|
}) {
|
|
3168
|
-
const days =
|
|
3169
|
-
const eventsByDay =
|
|
3170
|
-
const labels =
|
|
3171
|
+
const days = React31.useMemo(() => getWeekDays(cursor, weekStartsOn), [cursor, weekStartsOn]);
|
|
3172
|
+
const eventsByDay = React31.useMemo(() => bucketByDay(events), [events]);
|
|
3173
|
+
const labels = React31.useMemo(() => weekdayLabels(weekStartsOn), [weekStartsOn]);
|
|
3171
3174
|
const dow = (d) => labels[(d.getDay() - weekStartsOn + 7) % 7];
|
|
3172
3175
|
const [startHour, endHour] = dayHours;
|
|
3173
|
-
const hours =
|
|
3176
|
+
const hours = React31.useMemo(
|
|
3174
3177
|
() => Array.from({ length: endHour - startHour }, (_, i) => startHour + i),
|
|
3175
3178
|
[startHour, endHour]
|
|
3176
3179
|
);
|
|
@@ -3361,17 +3364,17 @@ function Cart({
|
|
|
3361
3364
|
] })
|
|
3362
3365
|
] });
|
|
3363
3366
|
}
|
|
3364
|
-
var CartContext =
|
|
3367
|
+
var CartContext = React31.createContext(null);
|
|
3365
3368
|
var clampQty = (qty, max) => {
|
|
3366
3369
|
const lower = Math.max(1, Math.round(qty));
|
|
3367
3370
|
return max != null ? Math.min(lower, max) : lower;
|
|
3368
3371
|
};
|
|
3369
3372
|
function CartProvider({ children, initialItems = [], onChange }) {
|
|
3370
|
-
const [items, setItems] =
|
|
3371
|
-
|
|
3373
|
+
const [items, setItems] = React31.useState(initialItems);
|
|
3374
|
+
React31.useEffect(() => {
|
|
3372
3375
|
onChange?.(items);
|
|
3373
3376
|
}, [items]);
|
|
3374
|
-
const addToCart =
|
|
3377
|
+
const addToCart = React31.useCallback((item, quantity) => {
|
|
3375
3378
|
const addQty = quantity ?? item.quantity ?? 1;
|
|
3376
3379
|
setItems((prev) => {
|
|
3377
3380
|
const existing = prev.find((it) => it.id === item.id);
|
|
@@ -3384,29 +3387,29 @@ function CartProvider({ children, initialItems = [], onChange }) {
|
|
|
3384
3387
|
return [...prev, { ...rest, quantity: clampQty(addQty, item.max) }];
|
|
3385
3388
|
});
|
|
3386
3389
|
}, []);
|
|
3387
|
-
const removeFromCart =
|
|
3390
|
+
const removeFromCart = React31.useCallback((id) => {
|
|
3388
3391
|
setItems((prev) => prev.filter((it) => it.id !== id));
|
|
3389
3392
|
}, []);
|
|
3390
|
-
const updateQuantity =
|
|
3393
|
+
const updateQuantity = React31.useCallback((id, quantity) => {
|
|
3391
3394
|
setItems(
|
|
3392
3395
|
(prev) => prev.map((it) => it.id === id ? { ...it, quantity: clampQty(quantity, it.max) } : it)
|
|
3393
3396
|
);
|
|
3394
3397
|
}, []);
|
|
3395
|
-
const clearCart =
|
|
3396
|
-
const isInCart =
|
|
3397
|
-
const getItemCount =
|
|
3398
|
-
const getCartTotal =
|
|
3398
|
+
const clearCart = React31.useCallback(() => setItems([]), []);
|
|
3399
|
+
const isInCart = React31.useCallback((id) => items.some((it) => it.id === id), [items]);
|
|
3400
|
+
const getItemCount = React31.useCallback(() => items.reduce((sum, it) => sum + it.quantity, 0), [items]);
|
|
3401
|
+
const getCartTotal = React31.useCallback(
|
|
3399
3402
|
() => items.reduce((sum, it) => sum + it.price * it.quantity, 0),
|
|
3400
3403
|
[items]
|
|
3401
3404
|
);
|
|
3402
|
-
const value =
|
|
3405
|
+
const value = React31.useMemo(
|
|
3403
3406
|
() => ({ items, addToCart, removeFromCart, updateQuantity, clearCart, isInCart, getItemCount, getCartTotal }),
|
|
3404
3407
|
[items, addToCart, removeFromCart, updateQuantity, clearCart, isInCart, getItemCount, getCartTotal]
|
|
3405
3408
|
);
|
|
3406
3409
|
return /* @__PURE__ */ jsxRuntime.jsx(CartContext.Provider, { value, children });
|
|
3407
3410
|
}
|
|
3408
3411
|
function useCart() {
|
|
3409
|
-
const ctx =
|
|
3412
|
+
const ctx = React31.useContext(CartContext);
|
|
3410
3413
|
if (!ctx) {
|
|
3411
3414
|
throw new Error("useCart must be used within a <CartProvider>.");
|
|
3412
3415
|
}
|
|
@@ -3429,7 +3432,7 @@ function CartButton({
|
|
|
3429
3432
|
const { getItemCount } = useCart();
|
|
3430
3433
|
const count = getItemCount();
|
|
3431
3434
|
return /* @__PURE__ */ jsxRuntime.jsx(Badge, { count, max, tone: badgeTone, className, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
3432
|
-
|
|
3435
|
+
IconButton_default,
|
|
3433
3436
|
{
|
|
3434
3437
|
type: variant,
|
|
3435
3438
|
icon,
|
|
@@ -3548,7 +3551,10 @@ var FormStore = class {
|
|
|
3548
3551
|
errors = {};
|
|
3549
3552
|
touched = {};
|
|
3550
3553
|
submitted = false;
|
|
3554
|
+
/** True while async field validation runs. */
|
|
3551
3555
|
validating = false;
|
|
3556
|
+
/** True while the submit handler (`onFinish` / `action`) is executing. */
|
|
3557
|
+
submitting = false;
|
|
3552
3558
|
initialValues;
|
|
3553
3559
|
rules;
|
|
3554
3560
|
validateOn;
|
|
@@ -3633,6 +3639,10 @@ var FormStore = class {
|
|
|
3633
3639
|
this.submitted = v;
|
|
3634
3640
|
this.emit();
|
|
3635
3641
|
};
|
|
3642
|
+
setSubmitting = (v) => {
|
|
3643
|
+
this.submitting = v;
|
|
3644
|
+
this.emit();
|
|
3645
|
+
};
|
|
3636
3646
|
// ── validation ─────────────────────────────────────────────────────────────
|
|
3637
3647
|
async validateField(name) {
|
|
3638
3648
|
const err = await runFieldRules(getPath(this.values, name), this.rules[name], this.values);
|
|
@@ -3658,6 +3668,7 @@ var FormStore = class {
|
|
|
3658
3668
|
this.errors = {};
|
|
3659
3669
|
this.touched = {};
|
|
3660
3670
|
this.submitted = false;
|
|
3671
|
+
this.submitting = false;
|
|
3661
3672
|
this.keys = {};
|
|
3662
3673
|
this.fieldCache.clear();
|
|
3663
3674
|
this.emit();
|
|
@@ -3740,11 +3751,11 @@ function buildBindings(store, name, kind, snap) {
|
|
|
3740
3751
|
|
|
3741
3752
|
// src/form/useForm.ts
|
|
3742
3753
|
function useForm(options = {}) {
|
|
3743
|
-
const ref =
|
|
3754
|
+
const ref = React31.useRef(null);
|
|
3744
3755
|
if (ref.current === null) ref.current = new FormStore(options);
|
|
3745
3756
|
const store = ref.current;
|
|
3746
|
-
|
|
3747
|
-
const make =
|
|
3757
|
+
React31.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
|
|
3758
|
+
const make = React31.useCallback(
|
|
3748
3759
|
(kind) => (name, rules) => {
|
|
3749
3760
|
if (rules !== void 0) store.setRule(name, rules);
|
|
3750
3761
|
return buildBindings(store, name, kind, store.getFieldSnapshot(name));
|
|
@@ -3757,7 +3768,8 @@ function useForm(options = {}) {
|
|
|
3757
3768
|
errors: store.errors,
|
|
3758
3769
|
touched: store.touched,
|
|
3759
3770
|
submitted: store.submitted,
|
|
3760
|
-
|
|
3771
|
+
// True for the whole submit cycle: async validation → onFinish execution.
|
|
3772
|
+
isSubmitting: store.submitting || store.validating,
|
|
3761
3773
|
isValid: store.isValid,
|
|
3762
3774
|
getValue: store.getValue,
|
|
3763
3775
|
getValues: store.getValues,
|
|
@@ -3773,9 +3785,9 @@ function useForm(options = {}) {
|
|
|
3773
3785
|
fieldTarget: make("target")
|
|
3774
3786
|
};
|
|
3775
3787
|
}
|
|
3776
|
-
var FormContext =
|
|
3788
|
+
var FormContext = React31.createContext(null);
|
|
3777
3789
|
function useFormStore() {
|
|
3778
|
-
const store =
|
|
3790
|
+
const store = React31.useContext(FormContext);
|
|
3779
3791
|
if (!store) {
|
|
3780
3792
|
throw new Error("useFormStore must be used within a <Form>. Did you forget to wrap your fields?");
|
|
3781
3793
|
}
|
|
@@ -3789,8 +3801,8 @@ function Form({
|
|
|
3789
3801
|
children,
|
|
3790
3802
|
...rest
|
|
3791
3803
|
}) {
|
|
3792
|
-
const ref =
|
|
3793
|
-
const bypass =
|
|
3804
|
+
const ref = React31.useRef(null);
|
|
3805
|
+
const bypass = React31.useRef(false);
|
|
3794
3806
|
const handleSubmit = async (e) => {
|
|
3795
3807
|
if (bypass.current) {
|
|
3796
3808
|
bypass.current = false;
|
|
@@ -3807,7 +3819,12 @@ function Form({
|
|
|
3807
3819
|
return;
|
|
3808
3820
|
}
|
|
3809
3821
|
if (onFinish) {
|
|
3810
|
-
|
|
3822
|
+
store.setSubmitting(true);
|
|
3823
|
+
try {
|
|
3824
|
+
await onFinish(store.getValues());
|
|
3825
|
+
} finally {
|
|
3826
|
+
store.setSubmitting(false);
|
|
3827
|
+
}
|
|
3811
3828
|
return;
|
|
3812
3829
|
}
|
|
3813
3830
|
if (typeof action === "function") {
|
|
@@ -3842,12 +3859,12 @@ function useFormField(name, options = {}) {
|
|
|
3842
3859
|
const store = useFormStore();
|
|
3843
3860
|
const { kind = "value", rules } = options;
|
|
3844
3861
|
if (rules !== void 0 && store.getRule(name) !== rules) store.setRule(name, rules);
|
|
3845
|
-
|
|
3862
|
+
React31.useEffect(() => {
|
|
3846
3863
|
return () => {
|
|
3847
3864
|
if (rules !== void 0) store.removeRule(name);
|
|
3848
3865
|
};
|
|
3849
3866
|
}, [store, name]);
|
|
3850
|
-
const snap =
|
|
3867
|
+
const snap = React31.useSyncExternalStore(
|
|
3851
3868
|
store.subscribe,
|
|
3852
3869
|
() => store.getFieldSnapshot(name)
|
|
3853
3870
|
);
|
|
@@ -3859,7 +3876,7 @@ function FormField({ name, kind, rules, children }) {
|
|
|
3859
3876
|
}
|
|
3860
3877
|
function useFieldArray(name) {
|
|
3861
3878
|
const store = useFormStore();
|
|
3862
|
-
|
|
3879
|
+
React31.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
|
|
3863
3880
|
const arr = store.getValue(name) ?? [];
|
|
3864
3881
|
const keys = store.getKeys(name);
|
|
3865
3882
|
return {
|
|
@@ -3892,7 +3909,7 @@ function TextInput({
|
|
|
3892
3909
|
suffix,
|
|
3893
3910
|
id
|
|
3894
3911
|
}) {
|
|
3895
|
-
const errorId =
|
|
3912
|
+
const errorId = React31.useId();
|
|
3896
3913
|
const hasError = errorMessage != null;
|
|
3897
3914
|
const hasAdornment = prefix != null || suffix != null;
|
|
3898
3915
|
const inputId = htmlFor ?? id;
|
|
@@ -4053,7 +4070,7 @@ function CreditCardForm({
|
|
|
4053
4070
|
className = "",
|
|
4054
4071
|
style
|
|
4055
4072
|
}) {
|
|
4056
|
-
const initial =
|
|
4073
|
+
const initial = React31.useRef({
|
|
4057
4074
|
number: formatCardNumber(defaultValue?.number ?? ""),
|
|
4058
4075
|
name: defaultValue?.name ?? "",
|
|
4059
4076
|
expiry: formatExpiry(defaultValue?.expiry ?? ""),
|
|
@@ -4062,7 +4079,7 @@ function CreditCardForm({
|
|
|
4062
4079
|
const form = useForm({ initialValues: initial });
|
|
4063
4080
|
const numberStr = String(form.values.number ?? "");
|
|
4064
4081
|
const brand = detectBrand(numberStr);
|
|
4065
|
-
|
|
4082
|
+
React31.useEffect(() => {
|
|
4066
4083
|
onChange?.(toCard(form.values));
|
|
4067
4084
|
}, [form.values.number, form.values.name, form.values.expiry, form.values.cvv]);
|
|
4068
4085
|
const numberBind = form.fieldNative("number", {
|
|
@@ -4185,7 +4202,7 @@ function Checkout({
|
|
|
4185
4202
|
] })
|
|
4186
4203
|
] });
|
|
4187
4204
|
}
|
|
4188
|
-
var NotificationContext =
|
|
4205
|
+
var NotificationContext = React31.createContext({
|
|
4189
4206
|
open: () => void 0,
|
|
4190
4207
|
close: () => void 0
|
|
4191
4208
|
});
|
|
@@ -4243,26 +4260,26 @@ function NotificationItem({
|
|
|
4243
4260
|
onClose,
|
|
4244
4261
|
reduced
|
|
4245
4262
|
}) {
|
|
4246
|
-
const [paused, setPaused] =
|
|
4263
|
+
const [paused, setPaused] = React31.useState(false);
|
|
4247
4264
|
const duration = n.duration ?? 4e3;
|
|
4248
4265
|
const isAutoDismissing = isFinite(duration) && duration > 0;
|
|
4249
4266
|
const showProgress = !reduced && isAutoDismissing;
|
|
4250
|
-
const timerRef =
|
|
4251
|
-
const startTimeRef =
|
|
4252
|
-
const remainingRef =
|
|
4253
|
-
const clearTimer =
|
|
4267
|
+
const timerRef = React31.useRef(null);
|
|
4268
|
+
const startTimeRef = React31.useRef(0);
|
|
4269
|
+
const remainingRef = React31.useRef(duration);
|
|
4270
|
+
const clearTimer = React31.useCallback(() => {
|
|
4254
4271
|
if (timerRef.current !== null) {
|
|
4255
4272
|
clearTimeout(timerRef.current);
|
|
4256
4273
|
timerRef.current = null;
|
|
4257
4274
|
}
|
|
4258
4275
|
}, []);
|
|
4259
|
-
const scheduleDismiss =
|
|
4276
|
+
const scheduleDismiss = React31.useCallback((ms) => {
|
|
4260
4277
|
clearTimer();
|
|
4261
4278
|
if (!isAutoDismissing) return;
|
|
4262
4279
|
startTimeRef.current = Date.now();
|
|
4263
4280
|
timerRef.current = setTimeout(() => onClose(n.id), ms);
|
|
4264
4281
|
}, [clearTimer, isAutoDismissing, n.id, onClose]);
|
|
4265
|
-
|
|
4282
|
+
React31.useEffect(() => {
|
|
4266
4283
|
if (paused || !isAutoDismissing) return;
|
|
4267
4284
|
scheduleDismiss(remainingRef.current);
|
|
4268
4285
|
return clearTimer;
|
|
@@ -4345,15 +4362,15 @@ function NotificationProvider({
|
|
|
4345
4362
|
children,
|
|
4346
4363
|
position = "top-right"
|
|
4347
4364
|
}) {
|
|
4348
|
-
const [notifications, setNotifications] =
|
|
4365
|
+
const [notifications, setNotifications] = React31.useState([]);
|
|
4349
4366
|
const reduced = framerMotion.useReducedMotion();
|
|
4350
|
-
const open =
|
|
4367
|
+
const open = React31.useCallback((payload) => {
|
|
4351
4368
|
setNotifications((prev) => [
|
|
4352
4369
|
...prev,
|
|
4353
4370
|
{ duration: 4e3, ...payload, id: Date.now() + Math.random() }
|
|
4354
4371
|
]);
|
|
4355
4372
|
}, []);
|
|
4356
|
-
const close =
|
|
4373
|
+
const close = React31.useCallback((id) => {
|
|
4357
4374
|
setNotifications((prev) => prev.filter((n) => n.id !== id));
|
|
4358
4375
|
}, []);
|
|
4359
4376
|
return /* @__PURE__ */ jsxRuntime.jsxs(NotificationContext.Provider, { value: { open, close }, children: [
|
|
@@ -4382,7 +4399,7 @@ function NotificationProvider({
|
|
|
4382
4399
|
] });
|
|
4383
4400
|
}
|
|
4384
4401
|
function useNotification() {
|
|
4385
|
-
const { open } =
|
|
4402
|
+
const { open } = React31.useContext(NotificationContext);
|
|
4386
4403
|
return {
|
|
4387
4404
|
info: (props) => open({ type: "info", ...props }),
|
|
4388
4405
|
success: (props) => open({ type: "success", ...props }),
|
|
@@ -4499,10 +4516,10 @@ function FadingBase({
|
|
|
4499
4516
|
isMounted = false,
|
|
4500
4517
|
children
|
|
4501
4518
|
}) {
|
|
4502
|
-
const [shouldRender, setShouldRender] =
|
|
4503
|
-
const [visible, setVisible] =
|
|
4504
|
-
const timerRef =
|
|
4505
|
-
|
|
4519
|
+
const [shouldRender, setShouldRender] = React31.useState(isMounted);
|
|
4520
|
+
const [visible, setVisible] = React31.useState(false);
|
|
4521
|
+
const timerRef = React31.useRef(null);
|
|
4522
|
+
React31.useEffect(() => {
|
|
4506
4523
|
if (isMounted) {
|
|
4507
4524
|
setShouldRender(true);
|
|
4508
4525
|
const rafId = requestAnimationFrame(() => setVisible(true));
|
|
@@ -4602,13 +4619,13 @@ function ScalableContainer({
|
|
|
4602
4619
|
expandRatio = 3,
|
|
4603
4620
|
className = ""
|
|
4604
4621
|
}) {
|
|
4605
|
-
const containerRef =
|
|
4606
|
-
const [internalScaled, setInternalScaled] =
|
|
4622
|
+
const containerRef = React31.useRef(null);
|
|
4623
|
+
const [internalScaled, setInternalScaled] = React31.useState(false);
|
|
4607
4624
|
const isScaled = expanded ?? internalScaled;
|
|
4608
4625
|
const reduced = framerMotion.useReducedMotion();
|
|
4609
4626
|
const usePush = expandContainerRef != null;
|
|
4610
|
-
const grownRef =
|
|
4611
|
-
const prevScaled =
|
|
4627
|
+
const grownRef = React31.useRef([]);
|
|
4628
|
+
const prevScaled = React31.useRef(isScaled);
|
|
4612
4629
|
const kickResizeDuringTransition = () => {
|
|
4613
4630
|
if (typeof window === "undefined") return;
|
|
4614
4631
|
const kick = () => window.dispatchEvent(new Event("resize"));
|
|
@@ -4666,14 +4683,14 @@ function ScalableContainer({
|
|
|
4666
4683
|
}
|
|
4667
4684
|
grownRef.current = [];
|
|
4668
4685
|
};
|
|
4669
|
-
|
|
4686
|
+
React31.useEffect(() => {
|
|
4670
4687
|
if (!usePush || isScaled === prevScaled.current) return;
|
|
4671
4688
|
prevScaled.current = isScaled;
|
|
4672
4689
|
if (isScaled) growAncestors();
|
|
4673
4690
|
else restoreAncestors();
|
|
4674
4691
|
kickResizeDuringTransition();
|
|
4675
4692
|
}, [isScaled, usePush]);
|
|
4676
|
-
|
|
4693
|
+
React31.useEffect(() => () => {
|
|
4677
4694
|
for (const { el, parent, prev } of grownRef.current) {
|
|
4678
4695
|
el.style.flexGrow = prev.flexGrow;
|
|
4679
4696
|
el.style.flexBasis = prev.flexBasis;
|
|
@@ -4823,17 +4840,17 @@ function CatalogGrid({ items, buttonText, onOpen, className = "" }) {
|
|
|
4823
4840
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `flex flex-wrap gap-2 ${className}`.trim(), children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(GridCard, { item, buttonText, onOpen }, item.key)) });
|
|
4824
4841
|
}
|
|
4825
4842
|
function CatalogCarousel({ items, buttonText, onOpen, className = "" }) {
|
|
4826
|
-
const [activeIndex, setActiveIndex] =
|
|
4827
|
-
const [indexPool, setIndexPool] =
|
|
4828
|
-
const cardRefs =
|
|
4829
|
-
const getIndexes =
|
|
4843
|
+
const [activeIndex, setActiveIndex] = React31.useState(0);
|
|
4844
|
+
const [indexPool, setIndexPool] = React31.useState([]);
|
|
4845
|
+
const cardRefs = React31.useRef([]);
|
|
4846
|
+
const getIndexes = React31.useMemo(() => {
|
|
4830
4847
|
let nextIndex = activeIndex + 1;
|
|
4831
4848
|
let previousIndex = activeIndex - 1;
|
|
4832
4849
|
if (activeIndex === 0) previousIndex = items.length - 1;
|
|
4833
4850
|
if (activeIndex === items.length - 1) nextIndex = 0;
|
|
4834
4851
|
return { previousIndex, nextIndex };
|
|
4835
4852
|
}, [activeIndex, items.length]);
|
|
4836
|
-
|
|
4853
|
+
React31.useEffect(() => {
|
|
4837
4854
|
const { nextIndex, previousIndex } = getIndexes;
|
|
4838
4855
|
let indexes = [previousIndex, activeIndex, nextIndex];
|
|
4839
4856
|
if (activeIndex !== 0 && activeIndex !== items.length - 1) {
|
|
@@ -5006,8 +5023,8 @@ function writeDismissed(key) {
|
|
|
5006
5023
|
}
|
|
5007
5024
|
}
|
|
5008
5025
|
function useTargetBbox(ref) {
|
|
5009
|
-
const [bbox, setBbox] =
|
|
5010
|
-
|
|
5026
|
+
const [bbox, setBbox] = React31.useState(null);
|
|
5027
|
+
React31.useLayoutEffect(() => {
|
|
5011
5028
|
const el = ref?.current;
|
|
5012
5029
|
if (!el) {
|
|
5013
5030
|
setBbox(null);
|
|
@@ -5037,7 +5054,7 @@ function tooltipStyleFor(bbox, placement) {
|
|
|
5037
5054
|
return { left: bbox.left + bbox.width / 2, top: bbox.top - TOOLTIP_GAP, transform: "translate(-50%, -100%)", width: TOOLTIP_WIDTH };
|
|
5038
5055
|
}
|
|
5039
5056
|
function useFocusTrap(containerRef, active) {
|
|
5040
|
-
|
|
5057
|
+
React31.useEffect(() => {
|
|
5041
5058
|
if (!active) return;
|
|
5042
5059
|
const el = containerRef.current;
|
|
5043
5060
|
if (!el) return;
|
|
@@ -5076,16 +5093,16 @@ function Wizard({
|
|
|
5076
5093
|
onComplete,
|
|
5077
5094
|
onSkip
|
|
5078
5095
|
}) {
|
|
5079
|
-
const tooltipRef =
|
|
5080
|
-
const tooltipTitleId =
|
|
5081
|
-
const tooltipBodyId =
|
|
5096
|
+
const tooltipRef = React31.useRef(null);
|
|
5097
|
+
const tooltipTitleId = React31.useId();
|
|
5098
|
+
const tooltipBodyId = React31.useId();
|
|
5082
5099
|
const reduced = framerMotion.useReducedMotion();
|
|
5083
|
-
const [open, setOpen] =
|
|
5084
|
-
const [activeIndex, setActiveIndex] =
|
|
5100
|
+
const [open, setOpen] = React31.useState(() => steps.length > 0 && !readDismissed(storageKey));
|
|
5101
|
+
const [activeIndex, setActiveIndex] = React31.useState(0);
|
|
5085
5102
|
const step = steps[activeIndex];
|
|
5086
5103
|
const bbox = useTargetBbox(step?.stepRef);
|
|
5087
5104
|
useFocusTrap(tooltipRef, open);
|
|
5088
|
-
|
|
5105
|
+
React31.useEffect(() => {
|
|
5089
5106
|
if (!open || !dismissible) return;
|
|
5090
5107
|
const onKey = (e) => {
|
|
5091
5108
|
if (e.key === "Escape") {
|
|
@@ -5096,12 +5113,12 @@ function Wizard({
|
|
|
5096
5113
|
document.addEventListener("keydown", onKey);
|
|
5097
5114
|
return () => document.removeEventListener("keydown", onKey);
|
|
5098
5115
|
}, [open, dismissible]);
|
|
5099
|
-
const handleSkip =
|
|
5116
|
+
const handleSkip = React31.useCallback(() => {
|
|
5100
5117
|
writeDismissed(storageKey);
|
|
5101
5118
|
setOpen(false);
|
|
5102
5119
|
onSkip?.();
|
|
5103
5120
|
}, [storageKey, onSkip]);
|
|
5104
|
-
const handleComplete =
|
|
5121
|
+
const handleComplete = React31.useCallback(() => {
|
|
5105
5122
|
writeDismissed(storageKey);
|
|
5106
5123
|
setOpen(false);
|
|
5107
5124
|
onComplete?.();
|
|
@@ -5244,7 +5261,7 @@ function Wizard({
|
|
|
5244
5261
|
] });
|
|
5245
5262
|
}
|
|
5246
5263
|
var SearchIcon = /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "currentColor", className: "w-4 h-4", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx("path", { fillRule: "evenodd", d: "M10.5 3.75a6.75 6.75 0 100 13.5 6.75 6.75 0 000-13.5zM2.25 10.5a8.25 8.25 0 1114.59 5.28l4.69 4.69a.75.75 0 11-1.06 1.06l-4.69-4.69A8.25 8.25 0 012.25 10.5z", clipRule: "evenodd" }) });
|
|
5247
|
-
var SearchInput =
|
|
5264
|
+
var SearchInput = React31__default.default.forwardRef(function SearchInput2({ value, onChange, disabled, label, htmlFor, placeholder, name, inputStyle, style, layout = "vertical", size = "md", icon, helperText, className }, ref) {
|
|
5248
5265
|
return /* @__PURE__ */ jsxRuntime.jsx(Field, { className, label, htmlFor, layout, helperText, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
5249
5266
|
"div",
|
|
5250
5267
|
{
|
|
@@ -5479,7 +5496,7 @@ function EditableCell({
|
|
|
5479
5496
|
rowIndex,
|
|
5480
5497
|
onCellEdit
|
|
5481
5498
|
}) {
|
|
5482
|
-
const [editing, setEditing] =
|
|
5499
|
+
const [editing, setEditing] = React31.useState(false);
|
|
5483
5500
|
const value = row[col.keyBind];
|
|
5484
5501
|
const commit = (next) => {
|
|
5485
5502
|
setEditing(false);
|
|
@@ -5527,7 +5544,7 @@ function TableBody({
|
|
|
5527
5544
|
getRowKey,
|
|
5528
5545
|
onCellEdit
|
|
5529
5546
|
}) {
|
|
5530
|
-
const [expanded, setExpanded] =
|
|
5547
|
+
const [expanded, setExpanded] = React31.useState(() => /* @__PURE__ */ new Set());
|
|
5531
5548
|
const reduced = framerMotion.useReducedMotion();
|
|
5532
5549
|
const toggleRow = (rowKey) => {
|
|
5533
5550
|
setExpanded((prev) => {
|
|
@@ -5542,7 +5559,7 @@ function TableBody({
|
|
|
5542
5559
|
return /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: rows.map((row, i) => {
|
|
5543
5560
|
const rowKey = getRowKey(row, i);
|
|
5544
5561
|
const isExpanded = expanded.has(rowKey);
|
|
5545
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
5562
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(React31__default.default.Fragment, { children: [
|
|
5546
5563
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
5547
5564
|
"tr",
|
|
5548
5565
|
{
|
|
@@ -5654,13 +5671,13 @@ function Table({
|
|
|
5654
5671
|
className = "",
|
|
5655
5672
|
style
|
|
5656
5673
|
}) {
|
|
5657
|
-
const searchRef =
|
|
5658
|
-
const [searchTerm, setSearchTerm] =
|
|
5659
|
-
const [perPage, setPerPage] =
|
|
5674
|
+
const searchRef = React31.useRef(null);
|
|
5675
|
+
const [searchTerm, setSearchTerm] = React31.useState("");
|
|
5676
|
+
const [perPage, setPerPage] = React31.useState(
|
|
5660
5677
|
typeof pagination.perPage === "number" ? pagination.perPage : 15
|
|
5661
5678
|
);
|
|
5662
|
-
const [activePage, setActivePage] =
|
|
5663
|
-
const [sortState, setSortState] =
|
|
5679
|
+
const [activePage, setActivePage] = React31.useState(0);
|
|
5680
|
+
const [sortState, setSortState] = React31.useState(defaultSort);
|
|
5664
5681
|
const isServerSide = !!(pagination.enabled && pagination.serverSide);
|
|
5665
5682
|
const handleSort = (col) => {
|
|
5666
5683
|
const key = col.keyBind;
|
|
@@ -5672,8 +5689,8 @@ function Table({
|
|
|
5672
5689
|
onSortChange?.(next);
|
|
5673
5690
|
};
|
|
5674
5691
|
const debounceMs = search?.debounceMs ?? 0;
|
|
5675
|
-
const [debouncedTerm, setDebouncedTerm] =
|
|
5676
|
-
|
|
5692
|
+
const [debouncedTerm, setDebouncedTerm] = React31.useState("");
|
|
5693
|
+
React31.useEffect(() => {
|
|
5677
5694
|
if (debounceMs <= 0) {
|
|
5678
5695
|
setDebouncedTerm(searchTerm);
|
|
5679
5696
|
return;
|
|
@@ -5682,7 +5699,7 @@ function Table({
|
|
|
5682
5699
|
return () => clearTimeout(t);
|
|
5683
5700
|
}, [searchTerm, debounceMs]);
|
|
5684
5701
|
const term = debounceMs > 0 ? debouncedTerm : searchTerm;
|
|
5685
|
-
const filteredRows =
|
|
5702
|
+
const filteredRows = React31.useMemo(() => {
|
|
5686
5703
|
if (isServerSide || !term) return rows;
|
|
5687
5704
|
if (search?.predicate) return rows.filter((row) => search.predicate(row, term));
|
|
5688
5705
|
const cs = !!search?.caseSensitive;
|
|
@@ -5696,7 +5713,7 @@ function Table({
|
|
|
5696
5713
|
};
|
|
5697
5714
|
return rows.filter((row) => keys ? keys.some((k) => test(row[k])) : Object.values(row).some(test));
|
|
5698
5715
|
}, [rows, term, isServerSide, search?.predicate, search?.caseSensitive, search?.matchMode, search?.keys]);
|
|
5699
|
-
const sortedRows =
|
|
5716
|
+
const sortedRows = React31.useMemo(() => {
|
|
5700
5717
|
if (isServerSide || !sortState) return filteredRows;
|
|
5701
5718
|
const col = columns.find((c) => c.keyBind === sortState.key);
|
|
5702
5719
|
const accessor = col?.sortAccessor ?? ((r) => r[sortState.key]);
|
|
@@ -5704,29 +5721,29 @@ function Table({
|
|
|
5704
5721
|
if (sortState.direction === "desc") out.reverse();
|
|
5705
5722
|
return out;
|
|
5706
5723
|
}, [filteredRows, sortState, isServerSide, columns]);
|
|
5707
|
-
const datasets =
|
|
5724
|
+
const datasets = React31.useMemo(() => {
|
|
5708
5725
|
if (isServerSide) return [rows];
|
|
5709
5726
|
return createDatasets(sortedRows, pagination.enabled ? perPage : null);
|
|
5710
5727
|
}, [sortedRows, perPage, pagination.enabled, isServerSide, rows]);
|
|
5711
|
-
const MAX_PAGE =
|
|
5728
|
+
const MAX_PAGE = React31.useMemo(() => {
|
|
5712
5729
|
if (isServerSide && typeof pagination.maxPage === "number") return Math.max(0, pagination.maxPage);
|
|
5713
5730
|
if (isServerSide && typeof pagination.totalCount === "number")
|
|
5714
5731
|
return Math.max(0, Math.ceil(pagination.totalCount / perPage) - 1);
|
|
5715
5732
|
return datasets.length ? datasets.length - 1 : 0;
|
|
5716
5733
|
}, [isServerSide, pagination.maxPage, pagination.totalCount, perPage, datasets.length]);
|
|
5717
|
-
const currentPageRows =
|
|
5734
|
+
const currentPageRows = React31.useMemo(() => {
|
|
5718
5735
|
if (isServerSide) return rows;
|
|
5719
5736
|
return datasets[activePage] ?? [];
|
|
5720
5737
|
}, [isServerSide, rows, datasets, activePage]);
|
|
5721
|
-
|
|
5738
|
+
React31.useEffect(() => {
|
|
5722
5739
|
if (pagination.enabled && !isServerSide && typeof pagination.perPage === "number") {
|
|
5723
5740
|
setPerPage(pagination.perPage);
|
|
5724
5741
|
}
|
|
5725
5742
|
}, [pagination.enabled, pagination.perPage, isServerSide]);
|
|
5726
|
-
|
|
5743
|
+
React31.useEffect(() => {
|
|
5727
5744
|
if (isServerSide && typeof pagination.perPage === "number") setPerPage(pagination.perPage);
|
|
5728
5745
|
}, [isServerSide, pagination.perPage]);
|
|
5729
|
-
|
|
5746
|
+
React31.useEffect(() => {
|
|
5730
5747
|
if (isServerSide && typeof pagination.page === "number" && pagination.page >= 1)
|
|
5731
5748
|
setActivePage(pagination.page - 1);
|
|
5732
5749
|
}, [isServerSide, pagination.page]);
|
|
@@ -5815,7 +5832,7 @@ function TableSkeletonBody({
|
|
|
5815
5832
|
i
|
|
5816
5833
|
)) });
|
|
5817
5834
|
}
|
|
5818
|
-
var useIsoLayoutEffect = typeof window !== "undefined" ?
|
|
5835
|
+
var useIsoLayoutEffect = typeof window !== "undefined" ? React31.useLayoutEffect : React31.useEffect;
|
|
5819
5836
|
function VirtualList({
|
|
5820
5837
|
items,
|
|
5821
5838
|
rowHeight,
|
|
@@ -5832,10 +5849,10 @@ function VirtualList({
|
|
|
5832
5849
|
className = "",
|
|
5833
5850
|
style
|
|
5834
5851
|
}) {
|
|
5835
|
-
const scrollRef =
|
|
5836
|
-
const [scrollTop, setScrollTop] =
|
|
5837
|
-
const [viewport, setViewport] =
|
|
5838
|
-
const [term, setTerm] =
|
|
5852
|
+
const scrollRef = React31.useRef(null);
|
|
5853
|
+
const [scrollTop, setScrollTop] = React31.useState(0);
|
|
5854
|
+
const [viewport, setViewport] = React31.useState(typeof height === "number" ? height : 400);
|
|
5855
|
+
const [term, setTerm] = React31.useState("");
|
|
5839
5856
|
useIsoLayoutEffect(() => {
|
|
5840
5857
|
const el = scrollRef.current;
|
|
5841
5858
|
if (!el) return;
|
|
@@ -5846,7 +5863,7 @@ function VirtualList({
|
|
|
5846
5863
|
ro.observe(el);
|
|
5847
5864
|
return () => ro.disconnect();
|
|
5848
5865
|
}, []);
|
|
5849
|
-
const filtered =
|
|
5866
|
+
const filtered = React31.useMemo(() => {
|
|
5850
5867
|
if (!searchable || !term) return items;
|
|
5851
5868
|
if (filter) return items.filter((it) => filter(it, term));
|
|
5852
5869
|
const needle = term.toLowerCase();
|
|
@@ -5894,7 +5911,7 @@ function VirtualList({
|
|
|
5894
5911
|
] });
|
|
5895
5912
|
}
|
|
5896
5913
|
function ThemeSwitch({ checked, onChange, label = "Toggle dark mode", className = "" }) {
|
|
5897
|
-
const id =
|
|
5914
|
+
const id = React31.useId();
|
|
5898
5915
|
return /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: id, className: `flex items-center gap-2 cursor-pointer select-none ${className}`.trim(), children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
5899
5916
|
SwitchPrimitive__namespace.Root,
|
|
5900
5917
|
{
|
|
@@ -5992,8 +6009,8 @@ function FlyoutItems({ items }) {
|
|
|
5992
6009
|
}) });
|
|
5993
6010
|
}
|
|
5994
6011
|
function CollapsedFlyout({ item, trigger }) {
|
|
5995
|
-
const [open, setOpen] =
|
|
5996
|
-
const closeTimer =
|
|
6012
|
+
const [open, setOpen] = React31.useState(false);
|
|
6013
|
+
const closeTimer = React31__default.default.useRef(void 0);
|
|
5997
6014
|
const openNow = () => {
|
|
5998
6015
|
window.clearTimeout(closeTimer.current);
|
|
5999
6016
|
setOpen(true);
|
|
@@ -6002,7 +6019,7 @@ function CollapsedFlyout({ item, trigger }) {
|
|
|
6002
6019
|
window.clearTimeout(closeTimer.current);
|
|
6003
6020
|
closeTimer.current = window.setTimeout(() => setOpen(false), 150);
|
|
6004
6021
|
};
|
|
6005
|
-
|
|
6022
|
+
React31__default.default.useEffect(() => () => window.clearTimeout(closeTimer.current), []);
|
|
6006
6023
|
return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu2__namespace.Root, { open, onOpenChange: setOpen, modal: false, children: [
|
|
6007
6024
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6008
6025
|
DropdownMenu2__namespace.Trigger,
|
|
@@ -6040,7 +6057,7 @@ function NavItem({
|
|
|
6040
6057
|
depth = 0
|
|
6041
6058
|
}) {
|
|
6042
6059
|
const hasChildren = !!(item.items && item.items.length);
|
|
6043
|
-
const [open, setOpen] =
|
|
6060
|
+
const [open, setOpen] = React31.useState(item.defaultOpen ?? (hasChildren && hasActiveDescendant(item)));
|
|
6044
6061
|
const handleClick = () => {
|
|
6045
6062
|
if (hasChildren && isExpanded) setOpen((o) => !o);
|
|
6046
6063
|
item.onClick?.();
|
|
@@ -6178,7 +6195,7 @@ function Sidebar({
|
|
|
6178
6195
|
}
|
|
6179
6196
|
) });
|
|
6180
6197
|
}
|
|
6181
|
-
var MegaMenuContext =
|
|
6198
|
+
var MegaMenuContext = React31.createContext({ align: "start" });
|
|
6182
6199
|
function MegaMenu({
|
|
6183
6200
|
children,
|
|
6184
6201
|
align = "start",
|
|
@@ -6209,7 +6226,7 @@ function MegaMenu({
|
|
|
6209
6226
|
}
|
|
6210
6227
|
var TOP_ITEM = "group/top inline-flex items-center gap-1.5 h-10 px-3 rounded-md text-sm font-medium select-none text-foreground-secondary hover:text-foreground hover:bg-surface-raised data-[state=open]:text-accent data-[active]:text-accent transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-accent";
|
|
6211
6228
|
function MegaMenuItem({ label, icon, href, children, className = "" }) {
|
|
6212
|
-
const { align } =
|
|
6229
|
+
const { align } = React31.useContext(MegaMenuContext);
|
|
6213
6230
|
const pos = align === "center" ? "left-1/2 -translate-x-1/2" : align === "end" ? "right-0" : "left-0";
|
|
6214
6231
|
if (!children) {
|
|
6215
6232
|
return /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu__namespace.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenu__namespace.Link, { href, className: cx(TOP_ITEM, className), children: [
|
|
@@ -6294,8 +6311,8 @@ function MegaMenuLink({ href, icon, description, active, onClick, children, clas
|
|
|
6294
6311
|
function MegaMenuFeatured({ children, className = "" }) {
|
|
6295
6312
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx("min-w-0 rounded-lg bg-surface-raised border border-border p-4 flex flex-col", className), children });
|
|
6296
6313
|
}
|
|
6297
|
-
var elementsOfType = (children, type) =>
|
|
6298
|
-
(c) =>
|
|
6314
|
+
var elementsOfType = (children, type) => React31__default.default.Children.toArray(children).filter(
|
|
6315
|
+
(c) => React31__default.default.isValidElement(c) && c.type === type
|
|
6299
6316
|
);
|
|
6300
6317
|
var MOBILE_CHEVRON = /* @__PURE__ */ jsxRuntime.jsx(
|
|
6301
6318
|
"svg",
|
|
@@ -6332,9 +6349,9 @@ function MobileLinkRow({ link, onNavigate }) {
|
|
|
6332
6349
|
);
|
|
6333
6350
|
}
|
|
6334
6351
|
function MobilePanel({ panel, onNavigate }) {
|
|
6335
|
-
const nodes =
|
|
6352
|
+
const nodes = React31__default.default.Children.toArray(panel.props.children);
|
|
6336
6353
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 px-2 pb-3 pt-1", children: nodes.map((node, i) => {
|
|
6337
|
-
if (!
|
|
6354
|
+
if (!React31__default.default.isValidElement(node)) return null;
|
|
6338
6355
|
const el = node;
|
|
6339
6356
|
if (el.type === MegaMenuSection) {
|
|
6340
6357
|
const { title, children } = el.props;
|
|
@@ -6353,8 +6370,8 @@ function MegaMenuMobile({
|
|
|
6353
6370
|
children,
|
|
6354
6371
|
label
|
|
6355
6372
|
}) {
|
|
6356
|
-
const [open, setOpen] =
|
|
6357
|
-
const [expanded, setExpanded] =
|
|
6373
|
+
const [open, setOpen] = React31.useState(false);
|
|
6374
|
+
const [expanded, setExpanded] = React31.useState(null);
|
|
6358
6375
|
const items = elementsOfType(children, MegaMenuItem);
|
|
6359
6376
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "md:hidden w-full", children: [
|
|
6360
6377
|
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -6427,17 +6444,17 @@ function AppShell({
|
|
|
6427
6444
|
children,
|
|
6428
6445
|
className = ""
|
|
6429
6446
|
}) {
|
|
6430
|
-
const [expanded, setExpanded] =
|
|
6431
|
-
const [isMobile, setIsMobile] =
|
|
6432
|
-
const [mobileOpen, setMobileOpen] =
|
|
6433
|
-
|
|
6447
|
+
const [expanded, setExpanded] = React31.useState(sidebarDefaultExpanded);
|
|
6448
|
+
const [isMobile, setIsMobile] = React31.useState(false);
|
|
6449
|
+
const [mobileOpen, setMobileOpen] = React31.useState(false);
|
|
6450
|
+
React31.useEffect(() => {
|
|
6434
6451
|
const mq = window.matchMedia("(max-width: 767px)");
|
|
6435
6452
|
const update = (e) => setIsMobile(e.matches);
|
|
6436
6453
|
update(mq);
|
|
6437
6454
|
mq.addEventListener("change", update);
|
|
6438
6455
|
return () => mq.removeEventListener("change", update);
|
|
6439
6456
|
}, []);
|
|
6440
|
-
|
|
6457
|
+
React31.useEffect(() => {
|
|
6441
6458
|
if (!isMobile) setMobileOpen(false);
|
|
6442
6459
|
}, [isMobile]);
|
|
6443
6460
|
const hasSidebar = sidebarSections.length > 0;
|
|
@@ -6564,7 +6581,7 @@ function SecureLayout({
|
|
|
6564
6581
|
className = ""
|
|
6565
6582
|
}) {
|
|
6566
6583
|
const reduced = framerMotion.useReducedMotion();
|
|
6567
|
-
const cbs =
|
|
6584
|
+
const cbs = React31.useRef({ canAccess, onGranted, onDeny });
|
|
6568
6585
|
cbs.current = { canAccess, onGranted, onDeny };
|
|
6569
6586
|
const rolesKey = JSON.stringify(roles);
|
|
6570
6587
|
const requiredRolesKey = JSON.stringify(requiredRoles);
|
|
@@ -6579,10 +6596,10 @@ function SecureLayout({
|
|
|
6579
6596
|
if (requiredPermissions?.length && !has(permissions, requiredPermissions, requireAllPermissions)) return false;
|
|
6580
6597
|
return true;
|
|
6581
6598
|
};
|
|
6582
|
-
const [state, setState] =
|
|
6599
|
+
const [state, setState] = React31.useState(
|
|
6583
6600
|
() => !passesSync() ? "denied" : canAccess ? "checking" : "granted"
|
|
6584
6601
|
);
|
|
6585
|
-
|
|
6602
|
+
React31.useEffect(() => {
|
|
6586
6603
|
let cancelled = false;
|
|
6587
6604
|
const { canAccess: check, onGranted: granted, onDeny: deny } = cbs.current;
|
|
6588
6605
|
const finish = (ok) => {
|
|
@@ -6743,10 +6760,10 @@ function ThemeProvider({
|
|
|
6743
6760
|
className = "",
|
|
6744
6761
|
style
|
|
6745
6762
|
}) {
|
|
6746
|
-
const id =
|
|
6763
|
+
const id = React31__default.default.useId().replace(/:/g, "");
|
|
6747
6764
|
const scopeClass = `geo-th-${id}`;
|
|
6748
|
-
const divRef =
|
|
6749
|
-
|
|
6765
|
+
const divRef = React31.useRef(null);
|
|
6766
|
+
React31.useEffect(() => {
|
|
6750
6767
|
const el = divRef.current;
|
|
6751
6768
|
if (!el) return;
|
|
6752
6769
|
if (colorScheme === "auto") return;
|
|
@@ -6761,8 +6778,8 @@ function ThemeProvider({
|
|
|
6761
6778
|
}
|
|
6762
6779
|
el.classList.toggle("dark", colorScheme === "dark");
|
|
6763
6780
|
}, [colorScheme]);
|
|
6764
|
-
const lightVars =
|
|
6765
|
-
const darkVarStr =
|
|
6781
|
+
const lightVars = React31.useMemo(() => toCssVars(theme), [theme]);
|
|
6782
|
+
const darkVarStr = React31.useMemo(() => {
|
|
6766
6783
|
if (!darkTheme) return "";
|
|
6767
6784
|
const dvars = toCssVars(darkTheme);
|
|
6768
6785
|
if (!Object.keys(dvars).length) return "";
|
|
@@ -6804,7 +6821,7 @@ function NumberInput({
|
|
|
6804
6821
|
readOnly = false,
|
|
6805
6822
|
precision
|
|
6806
6823
|
}) {
|
|
6807
|
-
const errorId =
|
|
6824
|
+
const errorId = React31.useId();
|
|
6808
6825
|
const hasError = errorMessage != null;
|
|
6809
6826
|
const inferredPrecision = precision ?? (Number.isInteger(step) ? 0 : String(step).split(".")[1]?.length ?? 0);
|
|
6810
6827
|
const round = (n) => {
|
|
@@ -6935,8 +6952,8 @@ function Password({
|
|
|
6935
6952
|
showIcon,
|
|
6936
6953
|
hideIcon
|
|
6937
6954
|
}) {
|
|
6938
|
-
const [visible, setVisible] =
|
|
6939
|
-
const errorId =
|
|
6955
|
+
const [visible, setVisible] = React31.useState(false);
|
|
6956
|
+
const errorId = React31.useId();
|
|
6940
6957
|
const hasError = errorMessage != null;
|
|
6941
6958
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
6942
6959
|
Field,
|
|
@@ -7036,7 +7053,7 @@ function PasswordStrength({
|
|
|
7036
7053
|
className = "",
|
|
7037
7054
|
style
|
|
7038
7055
|
}) {
|
|
7039
|
-
const { score, label } =
|
|
7056
|
+
const { score, label } = React31.useMemo(() => scorer(value), [scorer, value]);
|
|
7040
7057
|
const showMatch = confirmValue != null && (value.length > 0 || confirmValue.length > 0);
|
|
7041
7058
|
const matches = value.length > 0 && value === confirmValue;
|
|
7042
7059
|
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx("flex flex-col gap-2", className), style, "aria-live": "polite", children: [
|
|
@@ -7095,8 +7112,8 @@ function RadioTile({
|
|
|
7095
7112
|
errorMessage,
|
|
7096
7113
|
className
|
|
7097
7114
|
}) {
|
|
7098
|
-
const groupId =
|
|
7099
|
-
const errorId =
|
|
7115
|
+
const groupId = React31.useId();
|
|
7116
|
+
const errorId = React31.useId();
|
|
7100
7117
|
const hasError = errorMessage != null;
|
|
7101
7118
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
7102
7119
|
Field,
|
|
@@ -7171,7 +7188,7 @@ function Checkbox({
|
|
|
7171
7188
|
}) {
|
|
7172
7189
|
const isChecked = checked ?? value ?? false;
|
|
7173
7190
|
const labelFirst = labelPosition === "left";
|
|
7174
|
-
const errorId =
|
|
7191
|
+
const errorId = React31.useId();
|
|
7175
7192
|
const hasError = errorMessage != null;
|
|
7176
7193
|
const box = /* @__PURE__ */ jsxRuntime.jsx(
|
|
7177
7194
|
CheckboxPrimitive__namespace.Root,
|
|
@@ -7279,8 +7296,8 @@ function RadioGroup({
|
|
|
7279
7296
|
className,
|
|
7280
7297
|
errorMessage
|
|
7281
7298
|
}) {
|
|
7282
|
-
const errorId =
|
|
7283
|
-
const groupId =
|
|
7299
|
+
const errorId = React31.useId();
|
|
7300
|
+
const groupId = React31.useId();
|
|
7284
7301
|
const hasError = errorMessage != null;
|
|
7285
7302
|
const labelFirst = labelPosition === "left";
|
|
7286
7303
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -7380,11 +7397,11 @@ function Switch({
|
|
|
7380
7397
|
disabled,
|
|
7381
7398
|
errorMessage
|
|
7382
7399
|
}) {
|
|
7383
|
-
const id =
|
|
7384
|
-
const errorId =
|
|
7400
|
+
const id = React31.useId();
|
|
7401
|
+
const errorId = React31.useId();
|
|
7385
7402
|
const hasError = errorMessage != null;
|
|
7386
7403
|
const isControlled = checked !== void 0;
|
|
7387
|
-
const [internal, setInternal] =
|
|
7404
|
+
const [internal, setInternal] = React31.useState(defaultChecked);
|
|
7388
7405
|
const isOn = isControlled ? checked : internal;
|
|
7389
7406
|
const handle = (c) => {
|
|
7390
7407
|
if (!isControlled) setInternal(c);
|
|
@@ -7460,11 +7477,11 @@ function MultiTagRow({
|
|
|
7460
7477
|
labelFor,
|
|
7461
7478
|
onRemove
|
|
7462
7479
|
}) {
|
|
7463
|
-
const wrapRef =
|
|
7464
|
-
const measureRef =
|
|
7465
|
-
const [visibleCount, setVisibleCount] =
|
|
7480
|
+
const wrapRef = React31.useRef(null);
|
|
7481
|
+
const measureRef = React31.useRef(null);
|
|
7482
|
+
const [visibleCount, setVisibleCount] = React31.useState(values.length);
|
|
7466
7483
|
const key = values.map(String).join("|");
|
|
7467
|
-
|
|
7484
|
+
React31.useLayoutEffect(() => {
|
|
7468
7485
|
const wrap = wrapRef.current;
|
|
7469
7486
|
const measure = measureRef.current;
|
|
7470
7487
|
if (!wrap || !measure) return;
|
|
@@ -7558,16 +7575,16 @@ function Dropdown({
|
|
|
7558
7575
|
size = "md",
|
|
7559
7576
|
className = ""
|
|
7560
7577
|
}) {
|
|
7561
|
-
const [open, setOpen] =
|
|
7562
|
-
const [selectedItems, setSelectedItems] =
|
|
7563
|
-
const [searchTerm, setSearchTerm] =
|
|
7564
|
-
const [innerItems, setInnerItems] =
|
|
7565
|
-
const errorId =
|
|
7578
|
+
const [open, setOpen] = React31.useState(false);
|
|
7579
|
+
const [selectedItems, setSelectedItems] = React31.useState([]);
|
|
7580
|
+
const [searchTerm, setSearchTerm] = React31.useState("");
|
|
7581
|
+
const [innerItems, setInnerItems] = React31.useState([]);
|
|
7582
|
+
const errorId = React31.useId();
|
|
7566
7583
|
const hasError = errorMessage != null;
|
|
7567
|
-
|
|
7584
|
+
React31.useEffect(() => {
|
|
7568
7585
|
setInnerItems(items);
|
|
7569
7586
|
}, [items]);
|
|
7570
|
-
|
|
7587
|
+
React31.useEffect(() => {
|
|
7571
7588
|
if (isMultiselect && Array.isArray(value)) {
|
|
7572
7589
|
setSelectedItems(value);
|
|
7573
7590
|
}
|
|
@@ -7760,19 +7777,19 @@ function AutoComplete({
|
|
|
7760
7777
|
required,
|
|
7761
7778
|
htmlFor
|
|
7762
7779
|
}) {
|
|
7763
|
-
const errorId =
|
|
7780
|
+
const errorId = React31.useId();
|
|
7764
7781
|
const hasError = errorMessage != null;
|
|
7765
|
-
const [term, setTerm] =
|
|
7766
|
-
const [open, setOpen] =
|
|
7767
|
-
const [asyncItems, setAsyncItems] =
|
|
7768
|
-
const [loading, setLoading] =
|
|
7782
|
+
const [term, setTerm] = React31.useState("");
|
|
7783
|
+
const [open, setOpen] = React31.useState(false);
|
|
7784
|
+
const [asyncItems, setAsyncItems] = React31.useState([]);
|
|
7785
|
+
const [loading, setLoading] = React31.useState(false);
|
|
7769
7786
|
const isAsync = typeof onSearch === "function";
|
|
7770
|
-
const debounceRef =
|
|
7771
|
-
const requestIdRef =
|
|
7787
|
+
const debounceRef = React31.useRef(null);
|
|
7788
|
+
const requestIdRef = React31.useRef(0);
|
|
7772
7789
|
const staticFiltered = isAsync || !items ? [] : term.trim() ? items.filter(
|
|
7773
7790
|
({ key, label: label2 }) => label2.toLowerCase().includes(term.toLowerCase()) || key.toLowerCase().includes(term.toLowerCase())
|
|
7774
7791
|
) : [];
|
|
7775
|
-
|
|
7792
|
+
React31.useEffect(() => {
|
|
7776
7793
|
if (!isAsync) return;
|
|
7777
7794
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7778
7795
|
if (!term.trim()) {
|
|
@@ -7929,15 +7946,15 @@ function TreeSelect({
|
|
|
7929
7946
|
defaultExpandedKeys = [],
|
|
7930
7947
|
size = "md"
|
|
7931
7948
|
}) {
|
|
7932
|
-
const errorId =
|
|
7949
|
+
const errorId = React31.useId();
|
|
7933
7950
|
const hasError = errorMessage != null;
|
|
7934
|
-
const [open, setOpen] =
|
|
7935
|
-
const [expanded, setExpanded] =
|
|
7936
|
-
const [activeIndex, setActiveIndex] =
|
|
7937
|
-
const listRef =
|
|
7938
|
-
const visible =
|
|
7939
|
-
const didSyncOnOpenRef =
|
|
7940
|
-
|
|
7951
|
+
const [open, setOpen] = React31.useState(false);
|
|
7952
|
+
const [expanded, setExpanded] = React31.useState(() => new Set(defaultExpandedKeys));
|
|
7953
|
+
const [activeIndex, setActiveIndex] = React31.useState(0);
|
|
7954
|
+
const listRef = React31.useRef(null);
|
|
7955
|
+
const visible = React31.useMemo(() => flattenVisible(items, expanded), [items, expanded]);
|
|
7956
|
+
const didSyncOnOpenRef = React31.useRef(false);
|
|
7957
|
+
React31.useEffect(() => {
|
|
7941
7958
|
if (!open) {
|
|
7942
7959
|
didSyncOnOpenRef.current = false;
|
|
7943
7960
|
return;
|
|
@@ -7947,7 +7964,7 @@ function TreeSelect({
|
|
|
7947
7964
|
setActiveIndex(selectedIdx >= 0 ? selectedIdx : 0);
|
|
7948
7965
|
didSyncOnOpenRef.current = true;
|
|
7949
7966
|
}, [open, value]);
|
|
7950
|
-
const selectedNode =
|
|
7967
|
+
const selectedNode = React31.useMemo(
|
|
7951
7968
|
() => value != null ? findNodeByKey(items, value) : null,
|
|
7952
7969
|
[items, value]
|
|
7953
7970
|
);
|
|
@@ -8179,11 +8196,11 @@ function FileInput({
|
|
|
8179
8196
|
required,
|
|
8180
8197
|
icon
|
|
8181
8198
|
}) {
|
|
8182
|
-
const inputRef =
|
|
8183
|
-
const errorId =
|
|
8184
|
-
const [files, setFiles] =
|
|
8185
|
-
const [dragging, setDragging] =
|
|
8186
|
-
const [sizeError, setSizeError] =
|
|
8199
|
+
const inputRef = React31.useRef(null);
|
|
8200
|
+
const errorId = React31.useId();
|
|
8201
|
+
const [files, setFiles] = React31.useState([]);
|
|
8202
|
+
const [dragging, setDragging] = React31.useState(false);
|
|
8203
|
+
const [sizeError, setSizeError] = React31.useState(null);
|
|
8187
8204
|
const effectiveError = errorMessage ?? sizeError ?? void 0;
|
|
8188
8205
|
const openPicker = () => {
|
|
8189
8206
|
if (!disabled) inputRef.current?.click();
|
|
@@ -8374,30 +8391,30 @@ function DatePicker({
|
|
|
8374
8391
|
size = "md",
|
|
8375
8392
|
className = ""
|
|
8376
8393
|
}) {
|
|
8377
|
-
const errorId =
|
|
8394
|
+
const errorId = React31.useId();
|
|
8378
8395
|
const hasError = errorMessage != null;
|
|
8379
|
-
const [open, setOpen] =
|
|
8380
|
-
const [viewMonth, setViewMonth] =
|
|
8381
|
-
const [focusDate, setFocusDate] =
|
|
8382
|
-
const [view, setView] =
|
|
8383
|
-
const gridRef =
|
|
8384
|
-
|
|
8396
|
+
const [open, setOpen] = React31.useState(false);
|
|
8397
|
+
const [viewMonth, setViewMonth] = React31.useState(() => startOfMonth2(value ?? /* @__PURE__ */ new Date()));
|
|
8398
|
+
const [focusDate, setFocusDate] = React31.useState(() => value ?? /* @__PURE__ */ new Date());
|
|
8399
|
+
const [view, setView] = React31.useState("days");
|
|
8400
|
+
const gridRef = React31.useRef(null);
|
|
8401
|
+
React31.useEffect(() => {
|
|
8385
8402
|
if (!open) return;
|
|
8386
8403
|
const target = value ?? /* @__PURE__ */ new Date();
|
|
8387
8404
|
setViewMonth(startOfMonth2(target));
|
|
8388
8405
|
setFocusDate(target);
|
|
8389
8406
|
setView("days");
|
|
8390
8407
|
}, [open, value]);
|
|
8391
|
-
|
|
8408
|
+
React31.useEffect(() => {
|
|
8392
8409
|
if (!open) return;
|
|
8393
8410
|
const cell = gridRef.current?.querySelector(`[data-day="${defaultFormat3(focusDate)}"]`);
|
|
8394
8411
|
cell?.focus();
|
|
8395
8412
|
}, [open, focusDate]);
|
|
8396
|
-
const weekdays =
|
|
8413
|
+
const weekdays = React31.useMemo(() => {
|
|
8397
8414
|
const ordered = WEEKDAY_SHORT.slice(weekStartsOn).concat(WEEKDAY_SHORT.slice(0, weekStartsOn));
|
|
8398
8415
|
return ordered;
|
|
8399
8416
|
}, [weekStartsOn]);
|
|
8400
|
-
const grid =
|
|
8417
|
+
const grid = React31.useMemo(() => buildGrid(viewMonth, weekStartsOn), [viewMonth, weekStartsOn]);
|
|
8401
8418
|
const isDisabled = (d) => {
|
|
8402
8419
|
if (min && d < min) return true;
|
|
8403
8420
|
if (max && d > max) return true;
|
|
@@ -8688,10 +8705,10 @@ function TextArea({
|
|
|
8688
8705
|
style,
|
|
8689
8706
|
inputStyle
|
|
8690
8707
|
}) {
|
|
8691
|
-
const errorId =
|
|
8708
|
+
const errorId = React31.useId();
|
|
8692
8709
|
const hasError = errorMessage != null;
|
|
8693
|
-
const ref =
|
|
8694
|
-
|
|
8710
|
+
const ref = React31.useRef(null);
|
|
8711
|
+
React31.useLayoutEffect(() => {
|
|
8695
8712
|
if (!autoGrow) return;
|
|
8696
8713
|
const el = ref.current;
|
|
8697
8714
|
if (!el) return;
|
|
@@ -8763,14 +8780,14 @@ function Slider({
|
|
|
8763
8780
|
name,
|
|
8764
8781
|
htmlFor
|
|
8765
8782
|
}) {
|
|
8766
|
-
const errorId =
|
|
8783
|
+
const errorId = React31.useId();
|
|
8767
8784
|
const hasError = errorMessage != null;
|
|
8768
8785
|
const isRange = Array.isArray(value ?? defaultValue);
|
|
8769
|
-
const [internal, setInternal] =
|
|
8786
|
+
const [internal, setInternal] = React31.useState(
|
|
8770
8787
|
() => toArray(value) ?? toArray(defaultValue) ?? [min]
|
|
8771
8788
|
);
|
|
8772
8789
|
const current = toArray(value) ?? internal;
|
|
8773
|
-
const [dragging, setDragging] =
|
|
8790
|
+
const [dragging, setDragging] = React31.useState(false);
|
|
8774
8791
|
const emit = (arr) => {
|
|
8775
8792
|
setInternal(arr);
|
|
8776
8793
|
const next = isRange ? [arr[0], arr[1]] : arr[0];
|
|
@@ -8865,11 +8882,11 @@ function TagsInput({
|
|
|
8865
8882
|
validate,
|
|
8866
8883
|
separators = ["Enter", ","]
|
|
8867
8884
|
}) {
|
|
8868
|
-
const errorId =
|
|
8869
|
-
const inputRef =
|
|
8870
|
-
const [internal, setInternal] =
|
|
8871
|
-
const [draft, setDraft] =
|
|
8872
|
-
const [localError, setLocalError] =
|
|
8885
|
+
const errorId = React31.useId();
|
|
8886
|
+
const inputRef = React31.useRef(null);
|
|
8887
|
+
const [internal, setInternal] = React31.useState(defaultValue ?? []);
|
|
8888
|
+
const [draft, setDraft] = React31.useState("");
|
|
8889
|
+
const [localError, setLocalError] = React31.useState(null);
|
|
8873
8890
|
const tags = value ?? internal;
|
|
8874
8891
|
const hasError = errorMessage != null || localError != null;
|
|
8875
8892
|
const errorText = errorMessage ?? localError ?? void 0;
|
|
@@ -9000,9 +9017,9 @@ function OtpInput({
|
|
|
9000
9017
|
className,
|
|
9001
9018
|
groupAfter
|
|
9002
9019
|
}) {
|
|
9003
|
-
const errorId =
|
|
9020
|
+
const errorId = React31.useId();
|
|
9004
9021
|
const hasError = errorMessage != null;
|
|
9005
|
-
const refs =
|
|
9022
|
+
const refs = React31.useRef([]);
|
|
9006
9023
|
const chars = Array.from({ length }, (_, i) => value[i] ?? "");
|
|
9007
9024
|
const pattern = mode === "numeric" ? /[0-9]/ : /[a-zA-Z0-9]/;
|
|
9008
9025
|
const emit = (next) => {
|
|
@@ -9051,7 +9068,7 @@ function OtpInput({
|
|
|
9051
9068
|
emit(valid.join(""));
|
|
9052
9069
|
focusBox(valid.length);
|
|
9053
9070
|
};
|
|
9054
|
-
return /* @__PURE__ */ jsxRuntime.jsx(Field, { className, label, htmlFor, errorId, errorMessage, required, layout, helperText, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap items-center gap-2", role: "group", "aria-label": typeof label === "string" ? label : "One-time code", children: chars.map((char, idx) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
9071
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Field, { className, label, htmlFor, errorId, errorMessage, required, layout, helperText, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap items-center gap-2", role: "group", "aria-label": typeof label === "string" ? label : "One-time code", children: chars.map((char, idx) => /* @__PURE__ */ jsxRuntime.jsxs(React31__default.default.Fragment, { children: [
|
|
9055
9072
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
9056
9073
|
"input",
|
|
9057
9074
|
{
|
|
@@ -9109,9 +9126,9 @@ function Rating({
|
|
|
9109
9126
|
className,
|
|
9110
9127
|
required
|
|
9111
9128
|
}) {
|
|
9112
|
-
const errorId =
|
|
9113
|
-
const [internal, setInternal] =
|
|
9114
|
-
const [hover, setHover] =
|
|
9129
|
+
const errorId = React31.useId();
|
|
9130
|
+
const [internal, setInternal] = React31.useState(defaultValue);
|
|
9131
|
+
const [hover, setHover] = React31.useState(null);
|
|
9115
9132
|
const current = value ?? internal;
|
|
9116
9133
|
const display2 = hover ?? current;
|
|
9117
9134
|
const interactive = !readOnly && !disabled;
|
|
@@ -9234,9 +9251,9 @@ function TimePicker({
|
|
|
9234
9251
|
required,
|
|
9235
9252
|
style
|
|
9236
9253
|
}) {
|
|
9237
|
-
const errorId =
|
|
9254
|
+
const errorId = React31.useId();
|
|
9238
9255
|
const hasError = errorMessage != null;
|
|
9239
|
-
const [open, setOpen] =
|
|
9256
|
+
const [open, setOpen] = React31.useState(false);
|
|
9240
9257
|
const parsed = parse(value) ?? { h: 0, m: 0, s: 0 };
|
|
9241
9258
|
const update = (next) => {
|
|
9242
9259
|
const merged = { ...parsed, ...next };
|
|
@@ -9361,13 +9378,13 @@ function DateRangePicker({
|
|
|
9361
9378
|
required,
|
|
9362
9379
|
style
|
|
9363
9380
|
}) {
|
|
9364
|
-
const errorId =
|
|
9381
|
+
const errorId = React31.useId();
|
|
9365
9382
|
const hasError = errorMessage != null;
|
|
9366
|
-
const [open, setOpen] =
|
|
9367
|
-
const [leftMonth, setLeftMonth] =
|
|
9368
|
-
const [pendingStart, setPendingStart] =
|
|
9369
|
-
const [hoverDate, setHoverDate] =
|
|
9370
|
-
const weekdays =
|
|
9383
|
+
const [open, setOpen] = React31.useState(false);
|
|
9384
|
+
const [leftMonth, setLeftMonth] = React31.useState(() => startOfMonth3(value.start ?? /* @__PURE__ */ new Date()));
|
|
9385
|
+
const [pendingStart, setPendingStart] = React31.useState(null);
|
|
9386
|
+
const [hoverDate, setHoverDate] = React31.useState(null);
|
|
9387
|
+
const weekdays = React31.useMemo(
|
|
9371
9388
|
() => WEEKDAY.slice(weekStartsOn).concat(WEEKDAY.slice(0, weekStartsOn)),
|
|
9372
9389
|
[weekStartsOn]
|
|
9373
9390
|
);
|
|
@@ -9544,10 +9561,10 @@ function ColorPicker({
|
|
|
9544
9561
|
required,
|
|
9545
9562
|
placeholder = "Pick a colour\u2026"
|
|
9546
9563
|
}) {
|
|
9547
|
-
const errorId =
|
|
9564
|
+
const errorId = React31.useId();
|
|
9548
9565
|
const hasError = errorMessage != null;
|
|
9549
|
-
const [open, setOpen] =
|
|
9550
|
-
const [draft, setDraft] =
|
|
9566
|
+
const [open, setOpen] = React31.useState(false);
|
|
9567
|
+
const [draft, setDraft] = React31.useState(value);
|
|
9551
9568
|
const valid = HEX_RE.test(value);
|
|
9552
9569
|
const pick = (hex) => {
|
|
9553
9570
|
onChange?.(hex);
|
|
@@ -9635,7 +9652,7 @@ function ColorPicker({
|
|
|
9635
9652
|
}
|
|
9636
9653
|
var CUSTOM_EVENT = "oxy-local-storage";
|
|
9637
9654
|
function useLocalStorage(key, initialValue) {
|
|
9638
|
-
const read =
|
|
9655
|
+
const read = React31.useCallback(() => {
|
|
9639
9656
|
if (typeof window === "undefined") return initialValue;
|
|
9640
9657
|
try {
|
|
9641
9658
|
const item = window.localStorage.getItem(key);
|
|
@@ -9644,8 +9661,8 @@ function useLocalStorage(key, initialValue) {
|
|
|
9644
9661
|
return initialValue;
|
|
9645
9662
|
}
|
|
9646
9663
|
}, [key]);
|
|
9647
|
-
const [stored, setStored] =
|
|
9648
|
-
const setValue =
|
|
9664
|
+
const [stored, setStored] = React31.useState(read);
|
|
9665
|
+
const setValue = React31.useCallback((value) => {
|
|
9649
9666
|
setStored((prev) => {
|
|
9650
9667
|
const next = value instanceof Function ? value(prev) : value;
|
|
9651
9668
|
try {
|
|
@@ -9658,7 +9675,7 @@ function useLocalStorage(key, initialValue) {
|
|
|
9658
9675
|
return next;
|
|
9659
9676
|
});
|
|
9660
9677
|
}, [key]);
|
|
9661
|
-
const remove =
|
|
9678
|
+
const remove = React31.useCallback(() => {
|
|
9662
9679
|
try {
|
|
9663
9680
|
if (typeof window !== "undefined") {
|
|
9664
9681
|
window.localStorage.removeItem(key);
|
|
@@ -9668,10 +9685,10 @@ function useLocalStorage(key, initialValue) {
|
|
|
9668
9685
|
}
|
|
9669
9686
|
setStored(initialValue);
|
|
9670
9687
|
}, [key]);
|
|
9671
|
-
|
|
9688
|
+
React31.useEffect(() => {
|
|
9672
9689
|
setStored(read());
|
|
9673
9690
|
}, [key, read]);
|
|
9674
|
-
|
|
9691
|
+
React31.useEffect(() => {
|
|
9675
9692
|
if (typeof window === "undefined") return;
|
|
9676
9693
|
const onStorage = (e) => {
|
|
9677
9694
|
if (e.key === null || e.key === key) setStored(read());
|
|
@@ -9690,8 +9707,8 @@ function useLocalStorage(key, initialValue) {
|
|
|
9690
9707
|
}
|
|
9691
9708
|
function useMediaQuery(query) {
|
|
9692
9709
|
const get = () => typeof window !== "undefined" && typeof window.matchMedia === "function" ? window.matchMedia(query).matches : false;
|
|
9693
|
-
const [matches, setMatches] =
|
|
9694
|
-
|
|
9710
|
+
const [matches, setMatches] = React31.useState(get);
|
|
9711
|
+
React31.useEffect(() => {
|
|
9695
9712
|
if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
|
|
9696
9713
|
const mql = window.matchMedia(query);
|
|
9697
9714
|
const onChange = () => setMatches(mql.matches);
|
|
@@ -9722,8 +9739,8 @@ function decodeSegment(seg) {
|
|
|
9722
9739
|
}
|
|
9723
9740
|
}
|
|
9724
9741
|
function useJwt(token) {
|
|
9725
|
-
const [, tick] =
|
|
9726
|
-
const decoded =
|
|
9742
|
+
const [, tick] = React31.useState(0);
|
|
9743
|
+
const decoded = React31.useMemo(() => {
|
|
9727
9744
|
if (!token) return { payload: null, header: null, exp: null };
|
|
9728
9745
|
const [h, p] = token.split(".");
|
|
9729
9746
|
const header = decodeSegment(h);
|
|
@@ -9731,7 +9748,7 @@ function useJwt(token) {
|
|
|
9731
9748
|
const exp = payload && typeof payload.exp === "number" ? payload.exp : null;
|
|
9732
9749
|
return { payload, header, exp };
|
|
9733
9750
|
}, [token]);
|
|
9734
|
-
|
|
9751
|
+
React31.useEffect(() => {
|
|
9735
9752
|
if (decoded.exp == null) return;
|
|
9736
9753
|
const ms = decoded.exp * 1e3 - Date.now();
|
|
9737
9754
|
if (ms <= 0) return;
|
|
@@ -9905,13 +9922,13 @@ function SlideShow({
|
|
|
9905
9922
|
style
|
|
9906
9923
|
}) {
|
|
9907
9924
|
const reduced = framerMotion.useReducedMotion();
|
|
9908
|
-
const [index, setIndex] =
|
|
9909
|
-
const [paused, setPaused] =
|
|
9925
|
+
const [index, setIndex] = React31.useState(0);
|
|
9926
|
+
const [paused, setPaused] = React31.useState(false);
|
|
9910
9927
|
const count = slides.length;
|
|
9911
9928
|
const idx = count ? (index % count + count) % count : 0;
|
|
9912
|
-
const go =
|
|
9913
|
-
const timer =
|
|
9914
|
-
|
|
9929
|
+
const go = React31.useCallback((d) => setIndex((i) => i + d), []);
|
|
9930
|
+
const timer = React31.useRef(null);
|
|
9931
|
+
React31.useEffect(() => {
|
|
9915
9932
|
if (!autoPlay || paused || count <= 1) return;
|
|
9916
9933
|
timer.current = setInterval(() => setIndex((i) => i + 1), interval);
|
|
9917
9934
|
return () => {
|
|
@@ -9987,7 +10004,7 @@ function Video({
|
|
|
9987
10004
|
className = "",
|
|
9988
10005
|
style
|
|
9989
10006
|
}) {
|
|
9990
|
-
const [playing, setPlaying] =
|
|
10007
|
+
const [playing, setPlaying] = React31.useState(autoPlay);
|
|
9991
10008
|
const frame = cx("relative w-full overflow-hidden bg-backdrop", framed ? "rounded-2xl border border-border shadow-sm" : "", className);
|
|
9992
10009
|
const ratio = aspect.replace("/", " / ");
|
|
9993
10010
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: frame, style: { aspectRatio: ratio, ...style }, children: embedUrl ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -10042,7 +10059,7 @@ function Parallax({
|
|
|
10042
10059
|
style
|
|
10043
10060
|
}) {
|
|
10044
10061
|
const reduced = framerMotion.useReducedMotion();
|
|
10045
|
-
const ref =
|
|
10062
|
+
const ref = React31.useRef(null);
|
|
10046
10063
|
const { scrollYProgress } = framerMotion.useScroll({ target: ref, offset: ["start end", "end start"] });
|
|
10047
10064
|
const shift = Math.max(0, Math.min(1, speed)) * 100;
|
|
10048
10065
|
const y = framerMotion.useTransform(scrollYProgress, [0, 1], reduced ? ["0%", "0%"] : [`-${shift / 2}%`, `${shift / 2}%`]);
|
|
@@ -10110,7 +10127,7 @@ function Blog({
|
|
|
10110
10127
|
post.tag != null && !post.image && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { tone: "accent", variant: "soft", size: "sm", children: post.tag }) }),
|
|
10111
10128
|
/* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-base font-semibold leading-snug text-foreground transition-colors group-hover:text-accent", children: post.title }),
|
|
10112
10129
|
post.excerpt != null && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "line-clamp-3 text-sm leading-relaxed text-foreground-secondary", children: post.excerpt }),
|
|
10113
|
-
meta.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-auto flex flex-wrap items-center gap-x-2 gap-y-1 pt-3 text-xs text-foreground-muted", children: meta.map((m, j) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
10130
|
+
meta.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-auto flex flex-wrap items-center gap-x-2 gap-y-1 pt-3 text-xs text-foreground-muted", children: meta.map((m, j) => /* @__PURE__ */ jsxRuntime.jsxs(React31__default.default.Fragment, { children: [
|
|
10114
10131
|
j > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: "\xB7" }),
|
|
10115
10132
|
/* @__PURE__ */ jsxRuntime.jsx("span", { children: m })
|
|
10116
10133
|
] }, j)) })
|
|
@@ -10239,8 +10256,8 @@ function LeadCapture({
|
|
|
10239
10256
|
className = "",
|
|
10240
10257
|
style
|
|
10241
10258
|
}) {
|
|
10242
|
-
const [email, setEmail] =
|
|
10243
|
-
const [done, setDone] =
|
|
10259
|
+
const [email, setEmail] = React31.useState("");
|
|
10260
|
+
const [done, setDone] = React31.useState(false);
|
|
10244
10261
|
const submit = (e) => {
|
|
10245
10262
|
e.preventDefault();
|
|
10246
10263
|
const value = email.trim();
|
|
@@ -10350,7 +10367,7 @@ exports.FormField = FormField;
|
|
|
10350
10367
|
exports.FormStore = FormStore;
|
|
10351
10368
|
exports.Grid = Grid;
|
|
10352
10369
|
exports.GridCard = GridCard;
|
|
10353
|
-
exports.IconButton =
|
|
10370
|
+
exports.IconButton = IconButton_default;
|
|
10354
10371
|
exports.Jumbotron = Jumbotron;
|
|
10355
10372
|
exports.Kbd = Kbd;
|
|
10356
10373
|
exports.LeadCapture = LeadCapture;
|