@geomak/ui 6.9.0 → 6.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  var chunk255PCZIW_cjs = require('./chunk-255PCZIW.cjs');
4
4
  var jsxRuntime = require('react/jsx-runtime');
5
- var React17 = require('react');
5
+ var React18 = require('react');
6
6
  var reactDom = require('react-dom');
7
7
  var AvatarPrimitive = require('@radix-ui/react-avatar');
8
8
  var Dialog = require('@radix-ui/react-dialog');
@@ -10,8 +10,8 @@ var framerMotion = require('framer-motion');
10
10
  var TooltipPrimitive = require('@radix-ui/react-tooltip');
11
11
  var TabsPrimitive = require('@radix-ui/react-tabs');
12
12
  var AccordionPrimitive = require('@radix-ui/react-accordion');
13
- var ContextMenuPrimitive = require('@radix-ui/react-context-menu');
14
13
  var Popover = require('@radix-ui/react-popover');
14
+ var ContextMenuPrimitive = require('@radix-ui/react-context-menu');
15
15
  var SwitchPrimitive = require('@radix-ui/react-switch');
16
16
  var NavigationMenu = require('@radix-ui/react-navigation-menu');
17
17
  var CheckboxPrimitive = require('@radix-ui/react-checkbox');
@@ -39,14 +39,14 @@ function _interopNamespace(e) {
39
39
  return Object.freeze(n);
40
40
  }
41
41
 
42
- var React17__default = /*#__PURE__*/_interopDefault(React17);
42
+ var React18__default = /*#__PURE__*/_interopDefault(React18);
43
43
  var AvatarPrimitive__namespace = /*#__PURE__*/_interopNamespace(AvatarPrimitive);
44
44
  var Dialog__namespace = /*#__PURE__*/_interopNamespace(Dialog);
45
45
  var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
46
46
  var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
47
47
  var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrimitive);
48
- var ContextMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(ContextMenuPrimitive);
49
48
  var Popover__namespace = /*#__PURE__*/_interopNamespace(Popover);
49
+ var ContextMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(ContextMenuPrimitive);
50
50
  var SwitchPrimitive__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitive);
51
51
  var NavigationMenu__namespace = /*#__PURE__*/_interopNamespace(NavigationMenu);
52
52
  var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
@@ -214,8 +214,8 @@ Icon.Copy = Copy;
214
214
  Icon.CircleStack = CircleStack;
215
215
  var icons_default = Icon;
216
216
  function Portal({ children, target }) {
217
- const [resolved, setResolved] = React17.useState(null);
218
- React17.useEffect(() => {
217
+ const [resolved, setResolved] = React18.useState(null);
218
+ React18.useEffect(() => {
219
219
  if (target === null) {
220
220
  setResolved(null);
221
221
  return;
@@ -648,7 +648,7 @@ function IconButton({
648
648
  className = "",
649
649
  style
650
650
  }) {
651
- const colorScheme = React17.useMemo(() => {
651
+ const colorScheme = React18.useMemo(() => {
652
652
  if (type === "primary") {
653
653
  return "bg-accent text-accent-fg hover:bg-accent-hover";
654
654
  }
@@ -960,9 +960,9 @@ function Tooltip({
960
960
  ] }) });
961
961
  }
962
962
  var TooltipProvider = TooltipPrimitive__namespace.Provider;
963
- var TabsContext = React17.createContext(null);
963
+ var TabsContext = React18.createContext(null);
964
964
  function useTabsContext() {
965
- const ctx = React17.useContext(TabsContext);
965
+ const ctx = React18.useContext(TabsContext);
966
966
  if (!ctx) throw new Error("Tabs.List / Tabs.Trigger / Tabs.Panel must be rendered inside <Tabs>.");
967
967
  return ctx;
968
968
  }
@@ -984,26 +984,26 @@ function Tabs({
984
984
  children
985
985
  }) {
986
986
  const isControlled = value !== void 0;
987
- const [internal, setInternal] = React17.useState(defaultValue);
987
+ const [internal, setInternal] = React18.useState(defaultValue);
988
988
  const current = isControlled ? value : internal;
989
989
  const reduced = !!framerMotion.useReducedMotion();
990
- const indicatorId = React17.useId();
991
- const select = React17.useCallback((next) => {
990
+ const indicatorId = React18.useId();
991
+ const select = React18.useCallback((next) => {
992
992
  if (!isControlled) setInternal(next);
993
993
  onValueChange?.(next);
994
994
  }, [isControlled, onValueChange]);
995
- const registry = React17.useRef(/* @__PURE__ */ new Map());
996
- const orderRef = React17.useRef(0);
997
- const [, bump] = React17.useState(0);
998
- const registerTab = React17.useCallback((val, meta) => {
995
+ const registry = React18.useRef(/* @__PURE__ */ new Map());
996
+ const orderRef = React18.useRef(0);
997
+ const [, bump] = React18.useState(0);
998
+ const registerTab = React18.useCallback((val, meta) => {
999
999
  const existing = registry.current.get(val);
1000
1000
  registry.current.set(val, { ...meta, order: existing?.order ?? orderRef.current++ });
1001
1001
  if (!existing) bump((v) => v + 1);
1002
1002
  }, []);
1003
- const unregisterTab = React17.useCallback((val) => {
1003
+ const unregisterTab = React18.useCallback((val) => {
1004
1004
  if (registry.current.delete(val)) bump((v) => v + 1);
1005
1005
  }, []);
1006
- const getTabs = React17.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 })), []);
1006
+ const getTabs = React18.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 })), []);
1007
1007
  return /* @__PURE__ */ jsxRuntime.jsx(TabsContext.Provider, { value: { value: current, variant, size, orientation, indicatorId, reduced, select, registerTab, unregisterTab, getTabs }, children: /* @__PURE__ */ jsxRuntime.jsx(
1008
1008
  TabsPrimitive__namespace.Root,
1009
1009
  {
@@ -1023,10 +1023,10 @@ function Tabs({
1023
1023
  function TabsList({ children, "aria-label": ariaLabel, className = "" }) {
1024
1024
  const { variant, orientation, reduced, value } = useTabsContext();
1025
1025
  const horizontal = orientation === "horizontal";
1026
- const scrollRef = React17.useRef(null);
1027
- const [edges, setEdges] = React17.useState({ start: false, end: false });
1026
+ const scrollRef = React18.useRef(null);
1027
+ const [edges, setEdges] = React18.useState({ start: false, end: false });
1028
1028
  const scrollable = variant !== "segmented";
1029
- React17.useLayoutEffect(() => {
1029
+ React18.useLayoutEffect(() => {
1030
1030
  const el = scrollRef.current;
1031
1031
  if (!el || !scrollable) return;
1032
1032
  const update = () => {
@@ -1051,13 +1051,13 @@ function TabsList({ children, "aria-label": ariaLabel, className = "" }) {
1051
1051
  ro.disconnect();
1052
1052
  };
1053
1053
  }, [horizontal, scrollable, children]);
1054
- const nudge = React17.useCallback((dir) => {
1054
+ const nudge = React18.useCallback((dir) => {
1055
1055
  const el = scrollRef.current;
1056
1056
  if (!el) return;
1057
1057
  const amount = (horizontal ? el.clientWidth : el.clientHeight) * 0.7 * dir;
1058
1058
  el.scrollBy({ [horizontal ? "left" : "top"]: amount, behavior: reduced ? "auto" : "smooth" });
1059
1059
  }, [horizontal, reduced]);
1060
- React17.useLayoutEffect(() => {
1060
+ React18.useLayoutEffect(() => {
1061
1061
  const el = scrollRef.current;
1062
1062
  if (!el || !scrollable) return;
1063
1063
  const active = el.querySelector("[role=tab][data-state=active]");
@@ -1115,9 +1115,9 @@ function Chevron({ side, orientation, onClick }) {
1115
1115
  function OverflowMenu() {
1116
1116
  const { getTabs, value, select, orientation } = useTabsContext();
1117
1117
  const horizontal = orientation === "horizontal";
1118
- const [open, setOpen] = React17.useState(false);
1119
- const wrapRef = React17.useRef(null);
1120
- const timer = React17.useRef(null);
1118
+ const [open, setOpen] = React18.useState(false);
1119
+ const wrapRef = React18.useRef(null);
1120
+ const timer = React18.useRef(null);
1121
1121
  const openNow = () => {
1122
1122
  if (timer.current) clearTimeout(timer.current);
1123
1123
  setOpen(true);
@@ -1125,7 +1125,7 @@ function OverflowMenu() {
1125
1125
  const closeSoon = () => {
1126
1126
  timer.current = setTimeout(() => setOpen(false), 160);
1127
1127
  };
1128
- React17.useLayoutEffect(() => {
1128
+ React18.useLayoutEffect(() => {
1129
1129
  if (!open) return;
1130
1130
  const onDoc = (e) => {
1131
1131
  if (wrapRef.current && !wrapRef.current.contains(e.target)) setOpen(false);
@@ -1206,7 +1206,7 @@ function TabsTrigger({ value, icon, badge, closeable, onClose, disabled, classNa
1206
1206
  const isActive = active === value;
1207
1207
  const horizontal = orientation === "horizontal";
1208
1208
  const sz = SIZE[size];
1209
- React17.useLayoutEffect(() => {
1209
+ React18.useLayoutEffect(() => {
1210
1210
  registerTab(value, { label: children, icon, disabled });
1211
1211
  return () => unregisterTab(value);
1212
1212
  }, [value, children, icon, disabled, registerTab, unregisterTab]);
@@ -1404,7 +1404,7 @@ function Tree({
1404
1404
  item.key
1405
1405
  )) });
1406
1406
  }
1407
- var AccordionCtx = React17.createContext({ variant: "separated" });
1407
+ var AccordionCtx = React18.createContext({ variant: "separated" });
1408
1408
  function Accordion2({
1409
1409
  children,
1410
1410
  type = "single",
@@ -1463,7 +1463,7 @@ var Chevron2 = /* @__PURE__ */ jsxRuntime.jsx(
1463
1463
  }
1464
1464
  );
1465
1465
  function AccordionItem({ value, title, icon, children, disabled, className = "" }) {
1466
- const { variant } = React17.useContext(AccordionCtx);
1466
+ const { variant } = React18.useContext(AccordionCtx);
1467
1467
  return /* @__PURE__ */ jsxRuntime.jsxs(
1468
1468
  AccordionPrimitive__namespace.Item,
1469
1469
  {
@@ -1522,7 +1522,7 @@ function Breadcrumbs({
1522
1522
  className = "",
1523
1523
  style
1524
1524
  }) {
1525
- const [expanded, setExpanded] = React17.useState(false);
1525
+ const [expanded, setExpanded] = React18.useState(false);
1526
1526
  const shouldCollapse = maxItems > 0 && items.length > maxItems && !expanded;
1527
1527
  const visible = [];
1528
1528
  if (shouldCollapse) {
@@ -1666,7 +1666,7 @@ function Kbd({
1666
1666
  style
1667
1667
  }) {
1668
1668
  if (keys && keys.length > 0) {
1669
- return /* @__PURE__ */ jsxRuntime.jsx("span", { className: ["inline-flex items-center gap-1", className].filter(Boolean).join(" "), style, children: keys.map((k, i) => /* @__PURE__ */ jsxRuntime.jsxs(React17__default.default.Fragment, { children: [
1669
+ return /* @__PURE__ */ jsxRuntime.jsx("span", { className: ["inline-flex items-center gap-1", className].filter(Boolean).join(" "), style, children: keys.map((k, i) => /* @__PURE__ */ jsxRuntime.jsxs(React18__default.default.Fragment, { children: [
1670
1670
  i > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground-muted text-xs select-none", children: separator }),
1671
1671
  /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: [cap, SIZE3[size]].join(" "), children: k })
1672
1672
  ] }, `${k}-${i}`)) });
@@ -1739,13 +1739,13 @@ function CardCarousel({
1739
1739
  className = "",
1740
1740
  style
1741
1741
  }) {
1742
- const scrollerRef = React17.useRef(null);
1743
- const slides = React17__default.default.Children.toArray(children);
1744
- const [active, setActive] = React17.useState(0);
1745
- const [atStart, setAtStart] = React17.useState(true);
1746
- const [atEnd, setAtEnd] = React17.useState(false);
1742
+ const scrollerRef = React18.useRef(null);
1743
+ const slides = React18__default.default.Children.toArray(children);
1744
+ const [active, setActive] = React18.useState(0);
1745
+ const [atStart, setAtStart] = React18.useState(true);
1746
+ const [atEnd, setAtEnd] = React18.useState(false);
1747
1747
  const width = typeof itemWidth === "number" ? `${itemWidth}px` : itemWidth;
1748
- const update = React17.useCallback(() => {
1748
+ const update = React18.useCallback(() => {
1749
1749
  const el = scrollerRef.current;
1750
1750
  if (!el) return;
1751
1751
  el.clientWidth;
@@ -1755,7 +1755,7 @@ function CardCarousel({
1755
1755
  const slideW = first ? first.getBoundingClientRect().width + gap : el.clientWidth;
1756
1756
  setActive(Math.round(el.scrollLeft / slideW));
1757
1757
  }, [gap]);
1758
- React17.useEffect(() => {
1758
+ React18.useEffect(() => {
1759
1759
  update();
1760
1760
  const el = scrollerRef.current;
1761
1761
  if (!el) return;
@@ -1888,7 +1888,7 @@ function FAB({
1888
1888
  className = "",
1889
1889
  style
1890
1890
  }) {
1891
- const [open, setOpen] = React17.useState(false);
1891
+ const [open, setOpen] = React18.useState(false);
1892
1892
  const reduced = framerMotion.useReducedMotion();
1893
1893
  const hasDial = !!actions && actions.length > 0;
1894
1894
  const bottom = position.startsWith("bottom");
@@ -1959,7 +1959,83 @@ function FAB({
1959
1959
  }
1960
1960
  );
1961
1961
  }
1962
- var NotificationContext = React17.createContext({
1962
+ function PopConfirm({
1963
+ children,
1964
+ title,
1965
+ description,
1966
+ onConfirm,
1967
+ onCancel,
1968
+ confirmText = "Confirm",
1969
+ cancelText = "Cancel",
1970
+ tone = "default",
1971
+ icon,
1972
+ side = "top",
1973
+ open,
1974
+ onOpenChange,
1975
+ className = ""
1976
+ }) {
1977
+ const [uncontrolledOpen, setUncontrolledOpen] = React18.useState(false);
1978
+ const [loading, setLoading] = React18.useState(false);
1979
+ const isOpen = open ?? uncontrolledOpen;
1980
+ const setOpen = (next) => {
1981
+ onOpenChange?.(next);
1982
+ if (open === void 0) setUncontrolledOpen(next);
1983
+ };
1984
+ const handleConfirm = async () => {
1985
+ try {
1986
+ setLoading(true);
1987
+ await onConfirm?.();
1988
+ setOpen(false);
1989
+ } finally {
1990
+ setLoading(false);
1991
+ }
1992
+ };
1993
+ const handleCancel = () => {
1994
+ onCancel?.();
1995
+ setOpen(false);
1996
+ };
1997
+ return /* @__PURE__ */ jsxRuntime.jsxs(Popover__namespace.Root, { open: isOpen, onOpenChange: (o) => o ? setOpen(true) : handleCancel(), children: [
1998
+ /* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Trigger, { asChild: true, children }),
1999
+ /* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
2000
+ Popover__namespace.Content,
2001
+ {
2002
+ side,
2003
+ sideOffset: 8,
2004
+ collisionPadding: 12,
2005
+ className: [
2006
+ "z-[400] w-64 rounded-lg border border-border bg-surface p-3.5 shadow-lg",
2007
+ "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
2008
+ "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
2009
+ className
2010
+ ].filter(Boolean).join(" "),
2011
+ children: [
2012
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2.5", children: [
2013
+ icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `mt-0.5 flex h-5 w-5 flex-shrink-0 items-center justify-center ${tone === "danger" ? "text-status-error" : "text-status-warning"}`, children: icon }),
2014
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
2015
+ /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-medium text-foreground", children: title }),
2016
+ description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-xs text-foreground-secondary leading-snug", children: description })
2017
+ ] })
2018
+ ] }),
2019
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 flex justify-end gap-2", children: [
2020
+ /* @__PURE__ */ jsxRuntime.jsx(Button, { content: cancelText, size: "sm", variant: "ghost", onClick: handleCancel }),
2021
+ /* @__PURE__ */ jsxRuntime.jsx(
2022
+ Button,
2023
+ {
2024
+ content: confirmText,
2025
+ size: "sm",
2026
+ variant: tone === "danger" ? "danger" : "primary",
2027
+ loading,
2028
+ onClick: handleConfirm
2029
+ }
2030
+ )
2031
+ ] }),
2032
+ /* @__PURE__ */ jsxRuntime.jsx(Popover__namespace.Arrow, { className: "fill-surface" })
2033
+ ]
2034
+ }
2035
+ ) })
2036
+ ] });
2037
+ }
2038
+ var NotificationContext = React18.createContext({
1963
2039
  open: () => void 0,
1964
2040
  close: () => void 0
1965
2041
  });
@@ -2017,26 +2093,26 @@ function NotificationItem({
2017
2093
  onClose,
2018
2094
  reduced
2019
2095
  }) {
2020
- const [paused, setPaused] = React17.useState(false);
2096
+ const [paused, setPaused] = React18.useState(false);
2021
2097
  const duration = n.duration ?? 4e3;
2022
2098
  const isAutoDismissing = isFinite(duration) && duration > 0;
2023
2099
  const showProgress = !reduced && isAutoDismissing;
2024
- const timerRef = React17.useRef(null);
2025
- const startTimeRef = React17.useRef(0);
2026
- const remainingRef = React17.useRef(duration);
2027
- const clearTimer = React17.useCallback(() => {
2100
+ const timerRef = React18.useRef(null);
2101
+ const startTimeRef = React18.useRef(0);
2102
+ const remainingRef = React18.useRef(duration);
2103
+ const clearTimer = React18.useCallback(() => {
2028
2104
  if (timerRef.current !== null) {
2029
2105
  clearTimeout(timerRef.current);
2030
2106
  timerRef.current = null;
2031
2107
  }
2032
2108
  }, []);
2033
- const scheduleDismiss = React17.useCallback((ms) => {
2109
+ const scheduleDismiss = React18.useCallback((ms) => {
2034
2110
  clearTimer();
2035
2111
  if (!isAutoDismissing) return;
2036
2112
  startTimeRef.current = Date.now();
2037
2113
  timerRef.current = setTimeout(() => onClose(n.id), ms);
2038
2114
  }, [clearTimer, isAutoDismissing, n.id, onClose]);
2039
- React17.useEffect(() => {
2115
+ React18.useEffect(() => {
2040
2116
  if (paused || !isAutoDismissing) return;
2041
2117
  scheduleDismiss(remainingRef.current);
2042
2118
  return clearTimer;
@@ -2119,15 +2195,15 @@ function NotificationProvider({
2119
2195
  children,
2120
2196
  position = "top-right"
2121
2197
  }) {
2122
- const [notifications, setNotifications] = React17.useState([]);
2198
+ const [notifications, setNotifications] = React18.useState([]);
2123
2199
  const reduced = framerMotion.useReducedMotion();
2124
- const open = React17.useCallback((payload) => {
2200
+ const open = React18.useCallback((payload) => {
2125
2201
  setNotifications((prev) => [
2126
2202
  ...prev,
2127
2203
  { duration: 4e3, ...payload, id: Date.now() + Math.random() }
2128
2204
  ]);
2129
2205
  }, []);
2130
- const close = React17.useCallback((id) => {
2206
+ const close = React18.useCallback((id) => {
2131
2207
  setNotifications((prev) => prev.filter((n) => n.id !== id));
2132
2208
  }, []);
2133
2209
  return /* @__PURE__ */ jsxRuntime.jsxs(NotificationContext.Provider, { value: { open, close }, children: [
@@ -2156,7 +2232,7 @@ function NotificationProvider({
2156
2232
  ] });
2157
2233
  }
2158
2234
  function useNotification() {
2159
- const { open } = React17.useContext(NotificationContext);
2235
+ const { open } = React18.useContext(NotificationContext);
2160
2236
  return {
2161
2237
  info: (props) => open({ type: "info", ...props }),
2162
2238
  success: (props) => open({ type: "success", ...props }),
@@ -2273,10 +2349,10 @@ function FadingBase({
2273
2349
  isMounted = false,
2274
2350
  children
2275
2351
  }) {
2276
- const [shouldRender, setShouldRender] = React17.useState(isMounted);
2277
- const [visible, setVisible] = React17.useState(false);
2278
- const timerRef = React17.useRef(null);
2279
- React17.useEffect(() => {
2352
+ const [shouldRender, setShouldRender] = React18.useState(isMounted);
2353
+ const [visible, setVisible] = React18.useState(false);
2354
+ const timerRef = React18.useRef(null);
2355
+ React18.useEffect(() => {
2280
2356
  if (isMounted) {
2281
2357
  setShouldRender(true);
2282
2358
  const rafId = requestAnimationFrame(() => setVisible(true));
@@ -2374,8 +2450,8 @@ function ScalableContainer({
2374
2450
  togglePosition = "top-right",
2375
2451
  className = ""
2376
2452
  }) {
2377
- const containerRef = React17.useRef(null);
2378
- const [internalScaled, setInternalScaled] = React17.useState(false);
2453
+ const containerRef = React18.useRef(null);
2454
+ const [internalScaled, setInternalScaled] = React18.useState(false);
2379
2455
  const isScaled = expanded ?? internalScaled;
2380
2456
  const reduced = framerMotion.useReducedMotion();
2381
2457
  const onToggle = () => {
@@ -2513,17 +2589,17 @@ function CatalogGrid({ items, buttonText, onOpen, className = "" }) {
2513
2589
  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)) });
2514
2590
  }
2515
2591
  function CatalogCarousel({ items, buttonText, onOpen, className = "" }) {
2516
- const [activeIndex, setActiveIndex] = React17.useState(0);
2517
- const [indexPool, setIndexPool] = React17.useState([]);
2518
- const cardRefs = React17.useRef([]);
2519
- const getIndexes = React17.useMemo(() => {
2592
+ const [activeIndex, setActiveIndex] = React18.useState(0);
2593
+ const [indexPool, setIndexPool] = React18.useState([]);
2594
+ const cardRefs = React18.useRef([]);
2595
+ const getIndexes = React18.useMemo(() => {
2520
2596
  let nextIndex = activeIndex + 1;
2521
2597
  let previousIndex = activeIndex - 1;
2522
2598
  if (activeIndex === 0) previousIndex = items.length - 1;
2523
2599
  if (activeIndex === items.length - 1) nextIndex = 0;
2524
2600
  return { previousIndex, nextIndex };
2525
2601
  }, [activeIndex, items.length]);
2526
- React17.useEffect(() => {
2602
+ React18.useEffect(() => {
2527
2603
  const { nextIndex, previousIndex } = getIndexes;
2528
2604
  let indexes = [previousIndex, activeIndex, nextIndex];
2529
2605
  if (activeIndex !== 0 && activeIndex !== items.length - 1) {
@@ -2696,8 +2772,8 @@ function writeDismissed(key) {
2696
2772
  }
2697
2773
  }
2698
2774
  function useTargetBbox(ref) {
2699
- const [bbox, setBbox] = React17.useState(null);
2700
- React17.useLayoutEffect(() => {
2775
+ const [bbox, setBbox] = React18.useState(null);
2776
+ React18.useLayoutEffect(() => {
2701
2777
  const el = ref?.current;
2702
2778
  if (!el) {
2703
2779
  setBbox(null);
@@ -2727,7 +2803,7 @@ function tooltipStyleFor(bbox, placement) {
2727
2803
  return { left: bbox.left + bbox.width / 2, top: bbox.top - TOOLTIP_GAP, transform: "translate(-50%, -100%)", width: TOOLTIP_WIDTH };
2728
2804
  }
2729
2805
  function useFocusTrap(containerRef, active) {
2730
- React17.useEffect(() => {
2806
+ React18.useEffect(() => {
2731
2807
  if (!active) return;
2732
2808
  const el = containerRef.current;
2733
2809
  if (!el) return;
@@ -2766,16 +2842,16 @@ function Wizard({
2766
2842
  onComplete,
2767
2843
  onSkip
2768
2844
  }) {
2769
- const tooltipRef = React17.useRef(null);
2770
- const tooltipTitleId = React17.useId();
2771
- const tooltipBodyId = React17.useId();
2845
+ const tooltipRef = React18.useRef(null);
2846
+ const tooltipTitleId = React18.useId();
2847
+ const tooltipBodyId = React18.useId();
2772
2848
  const reduced = framerMotion.useReducedMotion();
2773
- const [open, setOpen] = React17.useState(() => steps.length > 0 && !readDismissed(storageKey));
2774
- const [activeIndex, setActiveIndex] = React17.useState(0);
2849
+ const [open, setOpen] = React18.useState(() => steps.length > 0 && !readDismissed(storageKey));
2850
+ const [activeIndex, setActiveIndex] = React18.useState(0);
2775
2851
  const step = steps[activeIndex];
2776
2852
  const bbox = useTargetBbox(step?.stepRef);
2777
2853
  useFocusTrap(tooltipRef, open);
2778
- React17.useEffect(() => {
2854
+ React18.useEffect(() => {
2779
2855
  if (!open || !dismissible) return;
2780
2856
  const onKey = (e) => {
2781
2857
  if (e.key === "Escape") {
@@ -2786,12 +2862,12 @@ function Wizard({
2786
2862
  document.addEventListener("keydown", onKey);
2787
2863
  return () => document.removeEventListener("keydown", onKey);
2788
2864
  }, [open, dismissible]);
2789
- const handleSkip = React17.useCallback(() => {
2865
+ const handleSkip = React18.useCallback(() => {
2790
2866
  writeDismissed(storageKey);
2791
2867
  setOpen(false);
2792
2868
  onSkip?.();
2793
2869
  }, [storageKey, onSkip]);
2794
- const handleComplete = React17.useCallback(() => {
2870
+ const handleComplete = React18.useCallback(() => {
2795
2871
  writeDismissed(storageKey);
2796
2872
  setOpen(false);
2797
2873
  onComplete?.();
@@ -3062,7 +3138,7 @@ function Field({
3062
3138
  );
3063
3139
  }
3064
3140
  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" }) });
3065
- var SearchInput = React17__default.default.forwardRef(function SearchInput2({ value, onChange, disabled, label, htmlFor, placeholder, name, inputStyle, style, layout = "vertical", size = "md", icon, helperText, className }, ref) {
3141
+ var SearchInput = React18__default.default.forwardRef(function SearchInput2({ value, onChange, disabled, label, htmlFor, placeholder, name, inputStyle, style, layout = "vertical", size = "md", icon, helperText, className }, ref) {
3066
3142
  return /* @__PURE__ */ jsxRuntime.jsx(Field, { className, label, htmlFor, layout, helperText, children: /* @__PURE__ */ jsxRuntime.jsxs(
3067
3143
  "div",
3068
3144
  {
@@ -3116,11 +3192,11 @@ function MultiTagRow({
3116
3192
  labelFor,
3117
3193
  onRemove
3118
3194
  }) {
3119
- const wrapRef = React17.useRef(null);
3120
- const measureRef = React17.useRef(null);
3121
- const [visibleCount, setVisibleCount] = React17.useState(values.length);
3195
+ const wrapRef = React18.useRef(null);
3196
+ const measureRef = React18.useRef(null);
3197
+ const [visibleCount, setVisibleCount] = React18.useState(values.length);
3122
3198
  const key = values.map(String).join("|");
3123
- React17.useLayoutEffect(() => {
3199
+ React18.useLayoutEffect(() => {
3124
3200
  const wrap = wrapRef.current;
3125
3201
  const measure = measureRef.current;
3126
3202
  if (!wrap || !measure) return;
@@ -3214,16 +3290,16 @@ function Dropdown({
3214
3290
  size = "md",
3215
3291
  className = ""
3216
3292
  }) {
3217
- const [open, setOpen] = React17.useState(false);
3218
- const [selectedItems, setSelectedItems] = React17.useState([]);
3219
- const [searchTerm, setSearchTerm] = React17.useState("");
3220
- const [innerItems, setInnerItems] = React17.useState([]);
3221
- const errorId = React17.useId();
3293
+ const [open, setOpen] = React18.useState(false);
3294
+ const [selectedItems, setSelectedItems] = React18.useState([]);
3295
+ const [searchTerm, setSearchTerm] = React18.useState("");
3296
+ const [innerItems, setInnerItems] = React18.useState([]);
3297
+ const errorId = React18.useId();
3222
3298
  const hasError = errorMessage != null;
3223
- React17.useEffect(() => {
3299
+ React18.useEffect(() => {
3224
3300
  setInnerItems(items);
3225
3301
  }, [items]);
3226
- React17.useEffect(() => {
3302
+ React18.useEffect(() => {
3227
3303
  if (isMultiselect && Array.isArray(value)) {
3228
3304
  setSelectedItems(value);
3229
3305
  }
@@ -3548,7 +3624,7 @@ function TableBody({
3548
3624
  expandRow,
3549
3625
  getRowKey
3550
3626
  }) {
3551
- const [expanded, setExpanded] = React17.useState(() => /* @__PURE__ */ new Set());
3627
+ const [expanded, setExpanded] = React18.useState(() => /* @__PURE__ */ new Set());
3552
3628
  const reduced = framerMotion.useReducedMotion();
3553
3629
  const toggleRow = (rowKey) => {
3554
3630
  setExpanded((prev) => {
@@ -3563,7 +3639,7 @@ function TableBody({
3563
3639
  return /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: rows.map((row, i) => {
3564
3640
  const rowKey = getRowKey(row, i);
3565
3641
  const isExpanded = expanded.has(rowKey);
3566
- return /* @__PURE__ */ jsxRuntime.jsxs(React17__default.default.Fragment, { children: [
3642
+ return /* @__PURE__ */ jsxRuntime.jsxs(React18__default.default.Fragment, { children: [
3567
3643
  /* @__PURE__ */ jsxRuntime.jsxs(
3568
3644
  "tr",
3569
3645
  {
@@ -3619,9 +3695,9 @@ function Pagination({
3619
3695
  const matchedOption = picker.find(
3620
3696
  (o) => o.label === options.perPage || o.value === options.perPage
3621
3697
  );
3622
- const [perPageKey, setPerPageKey] = React17.useState(() => matchedOption?.key ?? picker[0]?.key);
3698
+ const [perPageKey, setPerPageKey] = React18.useState(() => matchedOption?.key ?? picker[0]?.key);
3623
3699
  const displayPerPageKey = serverSide ? matchedOption?.key ?? perPageKey : perPageKey;
3624
- React17.useEffect(() => {
3700
+ React18.useEffect(() => {
3625
3701
  if (serverSide && options.perPage != null) {
3626
3702
  const next = picker.find((o) => o.label === options.perPage || o.value === options.perPage);
3627
3703
  if (next) setPerPageKey(next.key);
@@ -3685,14 +3761,14 @@ function Table({
3685
3761
  className = "",
3686
3762
  style
3687
3763
  }) {
3688
- const searchRef = React17.useRef(null);
3689
- const [searchTerm, setSearchTerm] = React17.useState("");
3690
- const [perPage, setPerPage] = React17.useState(
3764
+ const searchRef = React18.useRef(null);
3765
+ const [searchTerm, setSearchTerm] = React18.useState("");
3766
+ const [perPage, setPerPage] = React18.useState(
3691
3767
  typeof pagination.perPage === "number" ? pagination.perPage : 15
3692
3768
  );
3693
- const [activePage, setActivePage] = React17.useState(0);
3769
+ const [activePage, setActivePage] = React18.useState(0);
3694
3770
  const isServerSide = !!(pagination.enabled && pagination.serverSide);
3695
- const filteredRows = React17.useMemo(() => {
3771
+ const filteredRows = React18.useMemo(() => {
3696
3772
  if (isServerSide || !searchTerm) return rows;
3697
3773
  const term = searchTerm.toLowerCase();
3698
3774
  return rows.filter(
@@ -3701,29 +3777,29 @@ function Table({
3701
3777
  )
3702
3778
  );
3703
3779
  }, [rows, searchTerm, isServerSide]);
3704
- const datasets = React17.useMemo(() => {
3780
+ const datasets = React18.useMemo(() => {
3705
3781
  if (isServerSide) return [rows];
3706
3782
  return createDatasets(filteredRows, pagination.enabled ? perPage : null);
3707
3783
  }, [filteredRows, perPage, pagination.enabled, isServerSide, rows]);
3708
- const MAX_PAGE = React17.useMemo(() => {
3784
+ const MAX_PAGE = React18.useMemo(() => {
3709
3785
  if (isServerSide && typeof pagination.maxPage === "number") return Math.max(0, pagination.maxPage);
3710
3786
  if (isServerSide && typeof pagination.totalCount === "number")
3711
3787
  return Math.max(0, Math.ceil(pagination.totalCount / perPage) - 1);
3712
3788
  return datasets.length ? datasets.length - 1 : 0;
3713
3789
  }, [isServerSide, pagination.maxPage, pagination.totalCount, perPage, datasets.length]);
3714
- const currentPageRows = React17.useMemo(() => {
3790
+ const currentPageRows = React18.useMemo(() => {
3715
3791
  if (isServerSide) return rows;
3716
3792
  return datasets[activePage] ?? [];
3717
3793
  }, [isServerSide, rows, datasets, activePage]);
3718
- React17.useEffect(() => {
3794
+ React18.useEffect(() => {
3719
3795
  if (pagination.enabled && !isServerSide && typeof pagination.perPage === "number") {
3720
3796
  setPerPage(pagination.perPage);
3721
3797
  }
3722
3798
  }, [pagination.enabled, pagination.perPage, isServerSide]);
3723
- React17.useEffect(() => {
3799
+ React18.useEffect(() => {
3724
3800
  if (isServerSide && typeof pagination.perPage === "number") setPerPage(pagination.perPage);
3725
3801
  }, [isServerSide, pagination.perPage]);
3726
- React17.useEffect(() => {
3802
+ React18.useEffect(() => {
3727
3803
  if (isServerSide && typeof pagination.page === "number" && pagination.page >= 1)
3728
3804
  setActivePage(pagination.page - 1);
3729
3805
  }, [isServerSide, pagination.page]);
@@ -3807,7 +3883,7 @@ function TableSkeletonBody({
3807
3883
  )) });
3808
3884
  }
3809
3885
  function ThemeSwitch({ checked, onChange, label = "Toggle dark mode", className = "" }) {
3810
- const id = React17.useId();
3886
+ const id = React18.useId();
3811
3887
  return /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: id, className: `flex items-center gap-2 cursor-pointer select-none ${className}`.trim(), children: /* @__PURE__ */ jsxRuntime.jsx(
3812
3888
  SwitchPrimitive__namespace.Root,
3813
3889
  {
@@ -3991,7 +4067,7 @@ function Sidebar({
3991
4067
  }
3992
4068
  ) });
3993
4069
  }
3994
- var MegaMenuContext = React17.createContext({ align: "start" });
4070
+ var MegaMenuContext = React18.createContext({ align: "start" });
3995
4071
  function MegaMenu({
3996
4072
  children,
3997
4073
  align = "start",
@@ -4022,7 +4098,7 @@ function MegaMenu({
4022
4098
  }
4023
4099
  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";
4024
4100
  function MegaMenuItem({ label, icon, href, children, className = "" }) {
4025
- const { align } = React17.useContext(MegaMenuContext);
4101
+ const { align } = React18.useContext(MegaMenuContext);
4026
4102
  const pos = align === "center" ? "left-1/2 -translate-x-1/2" : align === "end" ? "right-0" : "left-0";
4027
4103
  if (!children) {
4028
4104
  return /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu__namespace.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenu__namespace.Link, { href, className: [TOP_ITEM, className].filter(Boolean).join(" "), children: [
@@ -4107,8 +4183,8 @@ function MegaMenuLink({ href, icon, description, active, onClick, children, clas
4107
4183
  function MegaMenuFeatured({ children, className = "" }) {
4108
4184
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: ["min-w-0 rounded-lg bg-surface-raised border border-border p-4 flex flex-col", className].filter(Boolean).join(" "), children });
4109
4185
  }
4110
- var elementsOfType = (children, type) => React17__default.default.Children.toArray(children).filter(
4111
- (c) => React17__default.default.isValidElement(c) && c.type === type
4186
+ var elementsOfType = (children, type) => React18__default.default.Children.toArray(children).filter(
4187
+ (c) => React18__default.default.isValidElement(c) && c.type === type
4112
4188
  );
4113
4189
  var MOBILE_CHEVRON = /* @__PURE__ */ jsxRuntime.jsx(
4114
4190
  "svg",
@@ -4145,9 +4221,9 @@ function MobileLinkRow({ link, onNavigate }) {
4145
4221
  );
4146
4222
  }
4147
4223
  function MobilePanel({ panel, onNavigate }) {
4148
- const nodes = React17__default.default.Children.toArray(panel.props.children);
4224
+ const nodes = React18__default.default.Children.toArray(panel.props.children);
4149
4225
  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 px-2 pb-3 pt-1", children: nodes.map((node, i) => {
4150
- if (!React17__default.default.isValidElement(node)) return null;
4226
+ if (!React18__default.default.isValidElement(node)) return null;
4151
4227
  const el = node;
4152
4228
  if (el.type === MegaMenuSection) {
4153
4229
  const { title, children } = el.props;
@@ -4166,8 +4242,8 @@ function MegaMenuMobile({
4166
4242
  children,
4167
4243
  label
4168
4244
  }) {
4169
- const [open, setOpen] = React17.useState(false);
4170
- const [expanded, setExpanded] = React17.useState(null);
4245
+ const [open, setOpen] = React18.useState(false);
4246
+ const [expanded, setExpanded] = React18.useState(null);
4171
4247
  const items = elementsOfType(children, MegaMenuItem);
4172
4248
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "md:hidden w-full", children: [
4173
4249
  /* @__PURE__ */ jsxRuntime.jsxs(
@@ -4240,17 +4316,17 @@ function AppShell({
4240
4316
  children,
4241
4317
  className = ""
4242
4318
  }) {
4243
- const [expanded, setExpanded] = React17.useState(sidebarDefaultExpanded);
4244
- const [isMobile, setIsMobile] = React17.useState(false);
4245
- const [mobileOpen, setMobileOpen] = React17.useState(false);
4246
- React17.useEffect(() => {
4319
+ const [expanded, setExpanded] = React18.useState(sidebarDefaultExpanded);
4320
+ const [isMobile, setIsMobile] = React18.useState(false);
4321
+ const [mobileOpen, setMobileOpen] = React18.useState(false);
4322
+ React18.useEffect(() => {
4247
4323
  const mq = window.matchMedia("(max-width: 767px)");
4248
4324
  const update = (e) => setIsMobile(e.matches);
4249
4325
  update(mq);
4250
4326
  mq.addEventListener("change", update);
4251
4327
  return () => mq.removeEventListener("change", update);
4252
4328
  }, []);
4253
- React17.useEffect(() => {
4329
+ React18.useEffect(() => {
4254
4330
  if (!isMobile) setMobileOpen(false);
4255
4331
  }, [isMobile]);
4256
4332
  const hasSidebar = sidebarSections.length > 0;
@@ -4440,10 +4516,10 @@ function ThemeProvider({
4440
4516
  className = "",
4441
4517
  style
4442
4518
  }) {
4443
- const id = React17__default.default.useId().replace(/:/g, "");
4519
+ const id = React18__default.default.useId().replace(/:/g, "");
4444
4520
  const scopeClass = `geo-th-${id}`;
4445
- const divRef = React17.useRef(null);
4446
- React17.useEffect(() => {
4521
+ const divRef = React18.useRef(null);
4522
+ React18.useEffect(() => {
4447
4523
  const el = divRef.current;
4448
4524
  if (!el) return;
4449
4525
  if (colorScheme === "auto") return;
@@ -4458,8 +4534,8 @@ function ThemeProvider({
4458
4534
  }
4459
4535
  el.classList.toggle("dark", colorScheme === "dark");
4460
4536
  }, [colorScheme]);
4461
- const lightVars = React17.useMemo(() => toCssVars(theme), [theme]);
4462
- const darkVarStr = React17.useMemo(() => {
4537
+ const lightVars = React18.useMemo(() => toCssVars(theme), [theme]);
4538
+ const darkVarStr = React18.useMemo(() => {
4463
4539
  if (!darkTheme) return "";
4464
4540
  const dvars = toCssVars(darkTheme);
4465
4541
  if (!Object.keys(dvars).length) return "";
@@ -4499,7 +4575,7 @@ function TextInput({
4499
4575
  prefix,
4500
4576
  suffix
4501
4577
  }) {
4502
- const errorId = React17.useId();
4578
+ const errorId = React18.useId();
4503
4579
  const hasError = errorMessage != null;
4504
4580
  const hasAdornment = prefix != null || suffix != null;
4505
4581
  const input = /* @__PURE__ */ jsxRuntime.jsx(
@@ -4569,7 +4645,7 @@ function NumberInput({
4569
4645
  readOnly = false,
4570
4646
  precision
4571
4647
  }) {
4572
- const errorId = React17.useId();
4648
+ const errorId = React18.useId();
4573
4649
  const hasError = errorMessage != null;
4574
4650
  const inferredPrecision = precision ?? (Number.isInteger(step) ? 0 : String(step).split(".")[1]?.length ?? 0);
4575
4651
  const round = (n) => {
@@ -4700,8 +4776,8 @@ function Password({
4700
4776
  showIcon,
4701
4777
  hideIcon
4702
4778
  }) {
4703
- const [visible, setVisible] = React17.useState(false);
4704
- const errorId = React17.useId();
4779
+ const [visible, setVisible] = React18.useState(false);
4780
+ const errorId = React18.useId();
4705
4781
  const hasError = errorMessage != null;
4706
4782
  return /* @__PURE__ */ jsxRuntime.jsx(
4707
4783
  Field,
@@ -4774,7 +4850,7 @@ function Checkbox({
4774
4850
  }) {
4775
4851
  const isChecked = checked ?? value ?? false;
4776
4852
  const labelFirst = labelPosition === "left";
4777
- const errorId = React17.useId();
4853
+ const errorId = React18.useId();
4778
4854
  const hasError = errorMessage != null;
4779
4855
  const box = /* @__PURE__ */ jsxRuntime.jsx(
4780
4856
  CheckboxPrimitive__namespace.Root,
@@ -4882,8 +4958,8 @@ function RadioGroup({
4882
4958
  className,
4883
4959
  errorMessage
4884
4960
  }) {
4885
- const errorId = React17.useId();
4886
- const groupId = React17.useId();
4961
+ const errorId = React18.useId();
4962
+ const groupId = React18.useId();
4887
4963
  const hasError = errorMessage != null;
4888
4964
  const labelFirst = labelPosition === "left";
4889
4965
  return /* @__PURE__ */ jsxRuntime.jsx(
@@ -4983,11 +5059,11 @@ function Switch({
4983
5059
  disabled,
4984
5060
  errorMessage
4985
5061
  }) {
4986
- const id = React17.useId();
4987
- const errorId = React17.useId();
5062
+ const id = React18.useId();
5063
+ const errorId = React18.useId();
4988
5064
  const hasError = errorMessage != null;
4989
5065
  const isControlled = checked !== void 0;
4990
- const [internal, setInternal] = React17.useState(defaultChecked);
5066
+ const [internal, setInternal] = React18.useState(defaultChecked);
4991
5067
  const isOn = isControlled ? checked : internal;
4992
5068
  const handle = (c) => {
4993
5069
  if (!isControlled) setInternal(c);
@@ -5060,19 +5136,19 @@ function AutoComplete({
5060
5136
  required,
5061
5137
  htmlFor
5062
5138
  }) {
5063
- const errorId = React17.useId();
5139
+ const errorId = React18.useId();
5064
5140
  const hasError = errorMessage != null;
5065
- const [term, setTerm] = React17.useState("");
5066
- const [open, setOpen] = React17.useState(false);
5067
- const [asyncItems, setAsyncItems] = React17.useState([]);
5068
- const [loading, setLoading] = React17.useState(false);
5141
+ const [term, setTerm] = React18.useState("");
5142
+ const [open, setOpen] = React18.useState(false);
5143
+ const [asyncItems, setAsyncItems] = React18.useState([]);
5144
+ const [loading, setLoading] = React18.useState(false);
5069
5145
  const isAsync = typeof onSearch === "function";
5070
- const debounceRef = React17.useRef(null);
5071
- const requestIdRef = React17.useRef(0);
5146
+ const debounceRef = React18.useRef(null);
5147
+ const requestIdRef = React18.useRef(0);
5072
5148
  const staticFiltered = isAsync || !items ? [] : term.trim() ? items.filter(
5073
5149
  ({ key, label: label2 }) => label2.toLowerCase().includes(term.toLowerCase()) || key.toLowerCase().includes(term.toLowerCase())
5074
5150
  ) : [];
5075
- React17.useEffect(() => {
5151
+ React18.useEffect(() => {
5076
5152
  if (!isAsync) return;
5077
5153
  if (debounceRef.current) clearTimeout(debounceRef.current);
5078
5154
  if (!term.trim()) {
@@ -5228,15 +5304,15 @@ function TreeSelect({
5228
5304
  defaultExpandedKeys = [],
5229
5305
  size = "md"
5230
5306
  }) {
5231
- const errorId = React17.useId();
5307
+ const errorId = React18.useId();
5232
5308
  const hasError = errorMessage != null;
5233
- const [open, setOpen] = React17.useState(false);
5234
- const [expanded, setExpanded] = React17.useState(() => new Set(defaultExpandedKeys));
5235
- const [activeIndex, setActiveIndex] = React17.useState(0);
5236
- const listRef = React17.useRef(null);
5237
- const visible = React17.useMemo(() => flattenVisible(items, expanded), [items, expanded]);
5238
- const didSyncOnOpenRef = React17.useRef(false);
5239
- React17.useEffect(() => {
5309
+ const [open, setOpen] = React18.useState(false);
5310
+ const [expanded, setExpanded] = React18.useState(() => new Set(defaultExpandedKeys));
5311
+ const [activeIndex, setActiveIndex] = React18.useState(0);
5312
+ const listRef = React18.useRef(null);
5313
+ const visible = React18.useMemo(() => flattenVisible(items, expanded), [items, expanded]);
5314
+ const didSyncOnOpenRef = React18.useRef(false);
5315
+ React18.useEffect(() => {
5240
5316
  if (!open) {
5241
5317
  didSyncOnOpenRef.current = false;
5242
5318
  return;
@@ -5246,7 +5322,7 @@ function TreeSelect({
5246
5322
  setActiveIndex(selectedIdx >= 0 ? selectedIdx : 0);
5247
5323
  didSyncOnOpenRef.current = true;
5248
5324
  }, [open, value]);
5249
- const selectedNode = React17.useMemo(
5325
+ const selectedNode = React18.useMemo(
5250
5326
  () => value != null ? findNodeByKey(items, value) : null,
5251
5327
  [items, value]
5252
5328
  );
@@ -5477,11 +5553,11 @@ function FileInput({
5477
5553
  required,
5478
5554
  icon
5479
5555
  }) {
5480
- const inputRef = React17.useRef(null);
5481
- const errorId = React17.useId();
5482
- const [files, setFiles] = React17.useState([]);
5483
- const [dragging, setDragging] = React17.useState(false);
5484
- const [sizeError, setSizeError] = React17.useState(null);
5556
+ const inputRef = React18.useRef(null);
5557
+ const errorId = React18.useId();
5558
+ const [files, setFiles] = React18.useState([]);
5559
+ const [dragging, setDragging] = React18.useState(false);
5560
+ const [sizeError, setSizeError] = React18.useState(null);
5485
5561
  const effectiveError = errorMessage ?? sizeError ?? void 0;
5486
5562
  const openPicker = () => {
5487
5563
  if (!disabled) inputRef.current?.click();
@@ -5672,30 +5748,30 @@ function DatePicker({
5672
5748
  size = "md",
5673
5749
  className = ""
5674
5750
  }) {
5675
- const errorId = React17.useId();
5751
+ const errorId = React18.useId();
5676
5752
  const hasError = errorMessage != null;
5677
- const [open, setOpen] = React17.useState(false);
5678
- const [viewMonth, setViewMonth] = React17.useState(() => startOfMonth(value ?? /* @__PURE__ */ new Date()));
5679
- const [focusDate, setFocusDate] = React17.useState(() => value ?? /* @__PURE__ */ new Date());
5680
- const [view, setView] = React17.useState("days");
5681
- const gridRef = React17.useRef(null);
5682
- React17.useEffect(() => {
5753
+ const [open, setOpen] = React18.useState(false);
5754
+ const [viewMonth, setViewMonth] = React18.useState(() => startOfMonth(value ?? /* @__PURE__ */ new Date()));
5755
+ const [focusDate, setFocusDate] = React18.useState(() => value ?? /* @__PURE__ */ new Date());
5756
+ const [view, setView] = React18.useState("days");
5757
+ const gridRef = React18.useRef(null);
5758
+ React18.useEffect(() => {
5683
5759
  if (!open) return;
5684
5760
  const target = value ?? /* @__PURE__ */ new Date();
5685
5761
  setViewMonth(startOfMonth(target));
5686
5762
  setFocusDate(target);
5687
5763
  setView("days");
5688
5764
  }, [open, value]);
5689
- React17.useEffect(() => {
5765
+ React18.useEffect(() => {
5690
5766
  if (!open) return;
5691
5767
  const cell = gridRef.current?.querySelector(`[data-day="${defaultFormat(focusDate)}"]`);
5692
5768
  cell?.focus();
5693
5769
  }, [open, focusDate]);
5694
- const weekdays = React17.useMemo(() => {
5770
+ const weekdays = React18.useMemo(() => {
5695
5771
  const ordered = WEEKDAY_SHORT.slice(weekStartsOn).concat(WEEKDAY_SHORT.slice(0, weekStartsOn));
5696
5772
  return ordered;
5697
5773
  }, [weekStartsOn]);
5698
- const grid = React17.useMemo(() => buildGrid(viewMonth, weekStartsOn), [viewMonth, weekStartsOn]);
5774
+ const grid = React18.useMemo(() => buildGrid(viewMonth, weekStartsOn), [viewMonth, weekStartsOn]);
5699
5775
  const isDisabled = (d) => {
5700
5776
  if (min && d < min) return true;
5701
5777
  if (max && d > max) return true;
@@ -5985,10 +6061,10 @@ function TextArea({
5985
6061
  style,
5986
6062
  inputStyle
5987
6063
  }) {
5988
- const errorId = React17.useId();
6064
+ const errorId = React18.useId();
5989
6065
  const hasError = errorMessage != null;
5990
- const ref = React17.useRef(null);
5991
- React17.useLayoutEffect(() => {
6066
+ const ref = React18.useRef(null);
6067
+ React18.useLayoutEffect(() => {
5992
6068
  if (!autoGrow) return;
5993
6069
  const el = ref.current;
5994
6070
  if (!el) return;
@@ -6058,11 +6134,11 @@ function SegmentedControl({
6058
6134
  "aria-label": ariaLabel
6059
6135
  }) {
6060
6136
  const sz = SIZE5[size];
6061
- const groupId = React17.useId();
6062
- const errorId = React17.useId();
6137
+ const groupId = React18.useId();
6138
+ const errorId = React18.useId();
6063
6139
  const hasError = errorMessage != null;
6064
6140
  const isControlled = value !== void 0;
6065
- const [internal, setInternal] = React17.useState(defaultValue);
6141
+ const [internal, setInternal] = React18.useState(defaultValue);
6066
6142
  const current = isControlled ? value : internal;
6067
6143
  const handle = (v) => {
6068
6144
  if (!v) return;
@@ -6156,14 +6232,14 @@ function Slider({
6156
6232
  name,
6157
6233
  htmlFor
6158
6234
  }) {
6159
- const errorId = React17.useId();
6235
+ const errorId = React18.useId();
6160
6236
  const hasError = errorMessage != null;
6161
6237
  const isRange = Array.isArray(value ?? defaultValue);
6162
- const [internal, setInternal] = React17.useState(
6238
+ const [internal, setInternal] = React18.useState(
6163
6239
  () => toArray(value) ?? toArray(defaultValue) ?? [min]
6164
6240
  );
6165
6241
  const current = toArray(value) ?? internal;
6166
- const [dragging, setDragging] = React17.useState(false);
6242
+ const [dragging, setDragging] = React18.useState(false);
6167
6243
  const emit = (arr) => {
6168
6244
  setInternal(arr);
6169
6245
  const next = isRange ? [arr[0], arr[1]] : arr[0];
@@ -6258,11 +6334,11 @@ function TagsInput({
6258
6334
  validate,
6259
6335
  separators = ["Enter", ","]
6260
6336
  }) {
6261
- const errorId = React17.useId();
6262
- const inputRef = React17.useRef(null);
6263
- const [internal, setInternal] = React17.useState(defaultValue ?? []);
6264
- const [draft, setDraft] = React17.useState("");
6265
- const [localError, setLocalError] = React17.useState(null);
6337
+ const errorId = React18.useId();
6338
+ const inputRef = React18.useRef(null);
6339
+ const [internal, setInternal] = React18.useState(defaultValue ?? []);
6340
+ const [draft, setDraft] = React18.useState("");
6341
+ const [localError, setLocalError] = React18.useState(null);
6266
6342
  const tags = value ?? internal;
6267
6343
  const hasError = errorMessage != null || localError != null;
6268
6344
  const errorText = errorMessage ?? localError ?? void 0;
@@ -6393,9 +6469,9 @@ function OtpInput({
6393
6469
  className,
6394
6470
  groupAfter
6395
6471
  }) {
6396
- const errorId = React17.useId();
6472
+ const errorId = React18.useId();
6397
6473
  const hasError = errorMessage != null;
6398
- const refs = React17.useRef([]);
6474
+ const refs = React18.useRef([]);
6399
6475
  const chars = Array.from({ length }, (_, i) => value[i] ?? "");
6400
6476
  const pattern = mode === "numeric" ? /[0-9]/ : /[a-zA-Z0-9]/;
6401
6477
  const emit = (next) => {
@@ -6444,7 +6520,7 @@ function OtpInput({
6444
6520
  emit(valid.join(""));
6445
6521
  focusBox(valid.length);
6446
6522
  };
6447
- return /* @__PURE__ */ jsxRuntime.jsx(Field, { className, label, htmlFor, errorId, errorMessage, required, layout, helperText, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", role: "group", "aria-label": typeof label === "string" ? label : "One-time code", children: chars.map((char, idx) => /* @__PURE__ */ jsxRuntime.jsxs(React17__default.default.Fragment, { children: [
6523
+ return /* @__PURE__ */ jsxRuntime.jsx(Field, { className, label, htmlFor, errorId, errorMessage, required, layout, helperText, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", role: "group", "aria-label": typeof label === "string" ? label : "One-time code", children: chars.map((char, idx) => /* @__PURE__ */ jsxRuntime.jsxs(React18__default.default.Fragment, { children: [
6448
6524
  /* @__PURE__ */ jsxRuntime.jsx(
6449
6525
  "input",
6450
6526
  {
@@ -6502,9 +6578,9 @@ function Rating({
6502
6578
  className,
6503
6579
  required
6504
6580
  }) {
6505
- const errorId = React17.useId();
6506
- const [internal, setInternal] = React17.useState(defaultValue);
6507
- const [hover, setHover] = React17.useState(null);
6581
+ const errorId = React18.useId();
6582
+ const [internal, setInternal] = React18.useState(defaultValue);
6583
+ const [hover, setHover] = React18.useState(null);
6508
6584
  const current = value ?? internal;
6509
6585
  const display2 = hover ?? current;
6510
6586
  const interactive = !readOnly && !disabled;
@@ -6627,9 +6703,9 @@ function TimePicker({
6627
6703
  required,
6628
6704
  style
6629
6705
  }) {
6630
- const errorId = React17.useId();
6706
+ const errorId = React18.useId();
6631
6707
  const hasError = errorMessage != null;
6632
- const [open, setOpen] = React17.useState(false);
6708
+ const [open, setOpen] = React18.useState(false);
6633
6709
  const parsed = parse(value) ?? { h: 0, m: 0, s: 0 };
6634
6710
  const update = (next) => {
6635
6711
  const merged = { ...parsed, ...next };
@@ -6753,13 +6829,13 @@ function DateRangePicker({
6753
6829
  required,
6754
6830
  style
6755
6831
  }) {
6756
- const errorId = React17.useId();
6832
+ const errorId = React18.useId();
6757
6833
  const hasError = errorMessage != null;
6758
- const [open, setOpen] = React17.useState(false);
6759
- const [leftMonth, setLeftMonth] = React17.useState(() => startOfMonth2(value.start ?? /* @__PURE__ */ new Date()));
6760
- const [pendingStart, setPendingStart] = React17.useState(null);
6761
- const [hoverDate, setHoverDate] = React17.useState(null);
6762
- const weekdays = React17.useMemo(
6834
+ const [open, setOpen] = React18.useState(false);
6835
+ const [leftMonth, setLeftMonth] = React18.useState(() => startOfMonth2(value.start ?? /* @__PURE__ */ new Date()));
6836
+ const [pendingStart, setPendingStart] = React18.useState(null);
6837
+ const [hoverDate, setHoverDate] = React18.useState(null);
6838
+ const weekdays = React18.useMemo(
6763
6839
  () => WEEKDAY.slice(weekStartsOn).concat(WEEKDAY.slice(0, weekStartsOn)),
6764
6840
  [weekStartsOn]
6765
6841
  );
@@ -6935,10 +7011,10 @@ function ColorPicker({
6935
7011
  required,
6936
7012
  placeholder = "Pick a colour\u2026"
6937
7013
  }) {
6938
- const errorId = React17.useId();
7014
+ const errorId = React18.useId();
6939
7015
  const hasError = errorMessage != null;
6940
- const [open, setOpen] = React17.useState(false);
6941
- const [draft, setDraft] = React17.useState(value);
7016
+ const [open, setOpen] = React18.useState(false);
7017
+ const [draft, setDraft] = React18.useState(value);
6942
7018
  const valid = HEX_RE.test(value);
6943
7019
  const pick = (hex) => {
6944
7020
  onChange?.(hex);
@@ -7325,11 +7401,11 @@ function buildBindings(store, name, kind, snap) {
7325
7401
 
7326
7402
  // src/form/useForm.ts
7327
7403
  function useForm(options = {}) {
7328
- const ref = React17.useRef(null);
7404
+ const ref = React18.useRef(null);
7329
7405
  if (ref.current === null) ref.current = new FormStore(options);
7330
7406
  const store = ref.current;
7331
- React17.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
7332
- const make = React17.useCallback(
7407
+ React18.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
7408
+ const make = React18.useCallback(
7333
7409
  (kind) => (name, rules) => {
7334
7410
  if (rules !== void 0) store.setRule(name, rules);
7335
7411
  return buildBindings(store, name, kind, store.getFieldSnapshot(name));
@@ -7358,9 +7434,9 @@ function useForm(options = {}) {
7358
7434
  fieldTarget: make("target")
7359
7435
  };
7360
7436
  }
7361
- var FormContext = React17.createContext(null);
7437
+ var FormContext = React18.createContext(null);
7362
7438
  function useFormStore() {
7363
- const store = React17.useContext(FormContext);
7439
+ const store = React18.useContext(FormContext);
7364
7440
  if (!store) {
7365
7441
  throw new Error("useFormStore must be used within a <Form>. Did you forget to wrap your fields?");
7366
7442
  }
@@ -7374,8 +7450,8 @@ function Form({
7374
7450
  children,
7375
7451
  ...rest
7376
7452
  }) {
7377
- const ref = React17.useRef(null);
7378
- const bypass = React17.useRef(false);
7453
+ const ref = React18.useRef(null);
7454
+ const bypass = React18.useRef(false);
7379
7455
  const handleSubmit = async (e) => {
7380
7456
  if (bypass.current) {
7381
7457
  bypass.current = false;
@@ -7427,12 +7503,12 @@ function useFormField(name, options = {}) {
7427
7503
  const store = useFormStore();
7428
7504
  const { kind = "value", rules } = options;
7429
7505
  if (rules !== void 0 && store.getRule(name) !== rules) store.setRule(name, rules);
7430
- React17.useEffect(() => {
7506
+ React18.useEffect(() => {
7431
7507
  return () => {
7432
7508
  if (rules !== void 0) store.removeRule(name);
7433
7509
  };
7434
7510
  }, [store, name]);
7435
- const snap = React17.useSyncExternalStore(
7511
+ const snap = React18.useSyncExternalStore(
7436
7512
  store.subscribe,
7437
7513
  () => store.getFieldSnapshot(name)
7438
7514
  );
@@ -7444,7 +7520,7 @@ function FormField({ name, kind, rules, children }) {
7444
7520
  }
7445
7521
  function useFieldArray(name) {
7446
7522
  const store = useFormStore();
7447
- React17.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
7523
+ React18.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
7448
7524
  const arr = store.getValue(name) ?? [];
7449
7525
  const keys = store.getKeys(name);
7450
7526
  return {
@@ -7567,7 +7643,7 @@ function CreditCardForm({
7567
7643
  className = "",
7568
7644
  style
7569
7645
  }) {
7570
- const initial = React17.useRef({
7646
+ const initial = React18.useRef({
7571
7647
  number: formatCardNumber(defaultValue?.number ?? ""),
7572
7648
  name: defaultValue?.name ?? "",
7573
7649
  expiry: formatExpiry(defaultValue?.expiry ?? ""),
@@ -7576,7 +7652,7 @@ function CreditCardForm({
7576
7652
  const form = useForm({ initialValues: initial });
7577
7653
  const numberStr = String(form.values.number ?? "");
7578
7654
  const brand = detectBrand(numberStr);
7579
- React17.useEffect(() => {
7655
+ React18.useEffect(() => {
7580
7656
  onChange?.(toCard(form.values));
7581
7657
  }, [form.values.number, form.values.name, form.values.expiry, form.values.cvv]);
7582
7658
  const numberBind = form.fieldNative("number", {
@@ -7720,6 +7796,7 @@ exports.NumberInput = NumberInput;
7720
7796
  exports.OpaqueGridCard = OpaqueGridCard;
7721
7797
  exports.OtpInput = OtpInput;
7722
7798
  exports.Password = Password;
7799
+ exports.PopConfirm = PopConfirm;
7723
7800
  exports.Portal = Portal;
7724
7801
  exports.RadioGroup = RadioGroup;
7725
7802
  exports.Rating = Rating;