@geomak/ui 6.10.0 → 6.12.0

package/dist/index.cjs

@@ -2,7 +2,7 @@
 
 var chunk255PCZIW_cjs = require('./chunk-255PCZIW.cjs');
 var jsxRuntime = require('react/jsx-runtime');
-var React18 = require('react');
+var React19 = require('react');
 var reactDom = require('react-dom');
 var AvatarPrimitive = require('@radix-ui/react-avatar');
 var Dialog = require('@radix-ui/react-dialog');
@@ -39,7 +39,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React18__default = /*#__PURE__*/_interopDefault(React18);
+var React19__default = /*#__PURE__*/_interopDefault(React19);
 var AvatarPrimitive__namespace = /*#__PURE__*/_interopNamespace(AvatarPrimitive);
 var Dialog__namespace = /*#__PURE__*/_interopNamespace(Dialog);
 var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
@@ -214,8 +214,8 @@ Icon.Copy = Copy;
 Icon.CircleStack = CircleStack;
 var icons_default = Icon;
 function Portal({ children, target }) {
-  const [resolved, setResolved] = React18.useState(null);
-  React18.useEffect(() => {
+  const [resolved, setResolved] = React19.useState(null);
+  React19.useEffect(() => {
     if (target === null) {
       setResolved(null);
       return;
@@ -648,7 +648,7 @@ function IconButton({
   className = "",
   style
 }) {
-  const colorScheme = React18.useMemo(() => {
+  const colorScheme = React19.useMemo(() => {
     if (type === "primary") {
       return "bg-accent text-accent-fg hover:bg-accent-hover";
     }
@@ -960,9 +960,9 @@ function Tooltip({
   ] }) });
 }
 var TooltipProvider = TooltipPrimitive__namespace.Provider;
-var TabsContext = React18.createContext(null);
+var TabsContext = React19.createContext(null);
 function useTabsContext() {
-  const ctx = React18.useContext(TabsContext);
+  const ctx = React19.useContext(TabsContext);
   if (!ctx) throw new Error("Tabs.List / Tabs.Trigger / Tabs.Panel must be rendered inside <Tabs>.");
   return ctx;
 }
@@ -984,26 +984,26 @@ function Tabs({
   children
 }) {
   const isControlled = value !== void 0;
-  const [internal, setInternal] = React18.useState(defaultValue);
+  const [internal, setInternal] = React19.useState(defaultValue);
   const current = isControlled ? value : internal;
   const reduced = !!framerMotion.useReducedMotion();
-  const indicatorId = React18.useId();
-  const select = React18.useCallback((next) => {
+  const indicatorId = React19.useId();
+  const select = React19.useCallback((next) => {
     if (!isControlled) setInternal(next);
     onValueChange?.(next);
   }, [isControlled, onValueChange]);
-  const registry = React18.useRef(/* @__PURE__ */ new Map());
-  const orderRef = React18.useRef(0);
-  const [, bump] = React18.useState(0);
-  const registerTab = React18.useCallback((val, meta) => {
+  const registry = React19.useRef(/* @__PURE__ */ new Map());
+  const orderRef = React19.useRef(0);
+  const [, bump] = React19.useState(0);
+  const registerTab = React19.useCallback((val, meta) => {
     const existing = registry.current.get(val);
     registry.current.set(val, { ...meta, order: existing?.order ?? orderRef.current++ });
     if (!existing) bump((v) => v + 1);
   }, []);
-  const unregisterTab = React18.useCallback((val) => {
+  const unregisterTab = React19.useCallback((val) => {
     if (registry.current.delete(val)) bump((v) => v + 1);
   }, []);
-  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 })), []);
+  const getTabs = React19.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 })), []);
   return /* @__PURE__ */ jsxRuntime.jsx(TabsContext.Provider, { value: { value: current, variant, size, orientation, indicatorId, reduced, select, registerTab, unregisterTab, getTabs }, children: /* @__PURE__ */ jsxRuntime.jsx(
     TabsPrimitive__namespace.Root,
     {
@@ -1023,10 +1023,10 @@ function Tabs({
 function TabsList({ children, "aria-label": ariaLabel, className = "" }) {
   const { variant, orientation, reduced, value } = useTabsContext();
   const horizontal = orientation === "horizontal";
-  const scrollRef = React18.useRef(null);
-  const [edges, setEdges] = React18.useState({ start: false, end: false });
+  const scrollRef = React19.useRef(null);
+  const [edges, setEdges] = React19.useState({ start: false, end: false });
   const scrollable = variant !== "segmented";
-  React18.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     const el = scrollRef.current;
     if (!el || !scrollable) return;
     const update = () => {
@@ -1051,13 +1051,13 @@ function TabsList({ children, "aria-label": ariaLabel, className = "" }) {
       ro.disconnect();
     };
   }, [horizontal, scrollable, children]);
-  const nudge = React18.useCallback((dir) => {
+  const nudge = React19.useCallback((dir) => {
     const el = scrollRef.current;
     if (!el) return;
     const amount = (horizontal ? el.clientWidth : el.clientHeight) * 0.7 * dir;
     el.scrollBy({ [horizontal ? "left" : "top"]: amount, behavior: reduced ? "auto" : "smooth" });
   }, [horizontal, reduced]);
-  React18.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     const el = scrollRef.current;
     if (!el || !scrollable) return;
     const active = el.querySelector("[role=tab][data-state=active]");
@@ -1115,9 +1115,9 @@ function Chevron({ side, orientation, onClick }) {
 function OverflowMenu() {
   const { getTabs, value, select, orientation } = useTabsContext();
   const horizontal = orientation === "horizontal";
-  const [open, setOpen] = React18.useState(false);
-  const wrapRef = React18.useRef(null);
-  const timer = React18.useRef(null);
+  const [open, setOpen] = React19.useState(false);
+  const wrapRef = React19.useRef(null);
+  const timer = React19.useRef(null);
   const openNow = () => {
     if (timer.current) clearTimeout(timer.current);
     setOpen(true);
@@ -1125,7 +1125,7 @@ function OverflowMenu() {
   const closeSoon = () => {
     timer.current = setTimeout(() => setOpen(false), 160);
   };
-  React18.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     if (!open) return;
     const onDoc = (e) => {
       if (wrapRef.current && !wrapRef.current.contains(e.target)) setOpen(false);
@@ -1206,7 +1206,7 @@ function TabsTrigger({ value, icon, badge, closeable, onClose, disabled, classNa
   const isActive = active === value;
   const horizontal = orientation === "horizontal";
   const sz = SIZE[size];
-  React18.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     registerTab(value, { label: children, icon, disabled });
     return () => unregisterTab(value);
   }, [value, children, icon, disabled, registerTab, unregisterTab]);
@@ -1404,7 +1404,7 @@ function Tree({
     item.key
   )) });
 }
-var AccordionCtx = React18.createContext({ variant: "separated" });
+var AccordionCtx = React19.createContext({ variant: "separated" });
 function Accordion2({
   children,
   type = "single",
@@ -1463,7 +1463,7 @@ var Chevron2 = /* @__PURE__ */ jsxRuntime.jsx(
   }
 );
 function AccordionItem({ value, title, icon, children, disabled, className = "" }) {
-  const { variant } = React18.useContext(AccordionCtx);
+  const { variant } = React19.useContext(AccordionCtx);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     AccordionPrimitive__namespace.Item,
     {
@@ -1522,7 +1522,7 @@ function Breadcrumbs({
   className = "",
   style
 }) {
-  const [expanded, setExpanded] = React18.useState(false);
+  const [expanded, setExpanded] = React19.useState(false);
   const shouldCollapse = maxItems > 0 && items.length > maxItems && !expanded;
   const visible = [];
   if (shouldCollapse) {
@@ -1666,7 +1666,7 @@ function Kbd({
   style
 }) {
   if (keys && keys.length > 0) {
-    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: [
+    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(React19__default.default.Fragment, { children: [
       i > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground-muted text-xs select-none", children: separator }),
       /* @__PURE__ */ jsxRuntime.jsx("kbd", { className: [cap, SIZE3[size]].join(" "), children: k })
     ] }, `${k}-${i}`)) });
@@ -1739,13 +1739,13 @@ function CardCarousel({
   className = "",
   style
 }) {
-  const scrollerRef = React18.useRef(null);
-  const slides = React18__default.default.Children.toArray(children);
-  const [active, setActive] = React18.useState(0);
-  const [atStart, setAtStart] = React18.useState(true);
-  const [atEnd, setAtEnd] = React18.useState(false);
+  const scrollerRef = React19.useRef(null);
+  const slides = React19__default.default.Children.toArray(children);
+  const [active, setActive] = React19.useState(0);
+  const [atStart, setAtStart] = React19.useState(true);
+  const [atEnd, setAtEnd] = React19.useState(false);
   const width = typeof itemWidth === "number" ? `${itemWidth}px` : itemWidth;
-  const update = React18.useCallback(() => {
+  const update = React19.useCallback(() => {
     const el = scrollerRef.current;
     if (!el) return;
     el.clientWidth;
@@ -1755,7 +1755,7 @@ function CardCarousel({
     const slideW = first ? first.getBoundingClientRect().width + gap : el.clientWidth;
     setActive(Math.round(el.scrollLeft / slideW));
   }, [gap]);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     update();
     const el = scrollerRef.current;
     if (!el) return;
@@ -1888,7 +1888,7 @@ function FAB({
   className = "",
   style
 }) {
-  const [open, setOpen] = React18.useState(false);
+  const [open, setOpen] = React19.useState(false);
   const reduced = framerMotion.useReducedMotion();
   const hasDial = !!actions && actions.length > 0;
   const bottom = position.startsWith("bottom");
@@ -1974,8 +1974,8 @@ function PopConfirm({
   onOpenChange,
   className = ""
 }) {
-  const [uncontrolledOpen, setUncontrolledOpen] = React18.useState(false);
-  const [loading, setLoading] = React18.useState(false);
+  const [uncontrolledOpen, setUncontrolledOpen] = React19.useState(false);
+  const [loading, setLoading] = React19.useState(false);
   const isOpen = open ?? uncontrolledOpen;
   const setOpen = (next) => {
     onOpenChange?.(next);
@@ -2035,7 +2035,201 @@ function PopConfirm({
     ) })
   ] });
 }
-var NotificationContext = React18.createContext({
+var WEEKDAYS = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+var MONTHS = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+var startOfDay = (d) => new Date(d.getFullYear(), d.getMonth(), d.getDate());
+var sameDay = (a, b) => a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
+var addMonths = (d, n) => new Date(d.getFullYear(), d.getMonth() + n, 1);
+function buildGrid(month, weekStartsOn) {
+  const first = new Date(month.getFullYear(), month.getMonth(), 1);
+  const offset = (first.getDay() - weekStartsOn + 7) % 7;
+  const start = new Date(first);
+  start.setDate(first.getDate() - offset);
+  return Array.from({ length: 42 }, (_, i) => {
+    const d = new Date(start);
+    d.setDate(start.getDate() + i);
+    return d;
+  });
+}
+var NavIcon = ({ dir }) => /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, "aria-hidden": "true", className: "h-4 w-4", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: dir === "left" ? "M15 19l-7-7 7-7" : "M9 5l7 7-7 7" }) });
+function Calendar2({
+  value,
+  onChange,
+  month,
+  defaultMonth,
+  onMonthChange,
+  events,
+  min,
+  max,
+  weekStartsOn = 0,
+  className = "",
+  style
+}) {
+  const today = React19.useMemo(() => startOfDay(/* @__PURE__ */ new Date()), []);
+  const [internalMonth, setInternalMonth] = React19.useState(() => month ?? defaultMonth ?? value ?? today);
+  const visible = month ?? internalMonth;
+  const setMonth = (next) => {
+    onMonthChange?.(next);
+    if (month === void 0) setInternalMonth(next);
+  };
+  const grid = React19.useMemo(() => buildGrid(visible, weekStartsOn), [visible, weekStartsOn]);
+  const weekdays = React19.useMemo(() => Array.from({ length: 7 }, (_, i) => WEEKDAYS[(i + weekStartsOn) % 7]), [weekStartsOn]);
+  const eventsByDay = React19.useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const ev of events ?? []) {
+      const key = startOfDay(ev.date).toDateString();
+      const arr = map.get(key) ?? [];
+      arr.push(ev);
+      map.set(key, arr);
+    }
+    return map;
+  }, [events]);
+  const disabled = (d) => min && d < startOfDay(min) || max && d > startOfDay(max);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ["inline-block rounded-lg border border-border bg-surface p-3 select-none", className].filter(Boolean).join(" "), style, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-2 flex items-center justify-between px-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": "Previous month",
+          onClick: () => setMonth(addMonths(visible, -1)),
+          className: "flex h-7 w-7 items-center justify-center rounded-md text-foreground-secondary hover:bg-surface-raised hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
+          children: /* @__PURE__ */ jsxRuntime.jsx(NavIcon, { dir: "left" })
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-sm font-semibold text-foreground", "aria-live": "polite", children: [
+        MONTHS[visible.getMonth()],
+        " ",
+        visible.getFullYear()
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": "Next month",
+          onClick: () => setMonth(addMonths(visible, 1)),
+          className: "flex h-7 w-7 items-center justify-center rounded-md text-foreground-secondary hover:bg-surface-raised hover:text-foreground focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
+          children: /* @__PURE__ */ jsxRuntime.jsx(NavIcon, { dir: "right" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7 mb-1", children: weekdays.map((w) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-center text-[11px] font-medium uppercase tracking-wide text-foreground-muted py-1", children: w }, w)) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7 gap-0.5", role: "grid", children: grid.map((d, i) => {
+      const inMonth = d.getMonth() === visible.getMonth();
+      const isSelected = value != null && sameDay(d, value);
+      const isToday = sameDay(d, today);
+      const isDisabled = disabled(d);
+      const dayEvents = eventsByDay.get(d.toDateString()) ?? [];
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          role: "gridcell",
+          "aria-selected": isSelected,
+          "aria-current": isToday ? "date" : void 0,
+          disabled: isDisabled,
+          onClick: () => onChange?.(startOfDay(d)),
+          className: [
+            "relative flex h-9 w-9 flex-col items-center justify-center rounded-md text-sm transition-colors",
+            "focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
+            isSelected ? "bg-accent text-accent-fg font-semibold" : inMonth ? "text-foreground hover:bg-surface-raised" : "text-foreground-muted hover:bg-surface-raised",
+            isDisabled ? "opacity-40 cursor-not-allowed hover:bg-transparent" : "",
+            !isSelected && isToday ? "ring-1 ring-inset ring-accent/60" : ""
+          ].filter(Boolean).join(" "),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "leading-none", children: d.getDate() }),
+            dayEvents.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute bottom-1 flex gap-0.5", children: dayEvents.slice(0, 3).map((ev, j) => /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                title: ev.label,
+                className: "h-1 w-1 rounded-full",
+                style: { backgroundColor: ev.color ?? (isSelected ? "var(--color-accent-fg)" : "var(--color-accent)") }
+              },
+              j
+            )) })
+          ]
+        },
+        i
+      );
+    }) })
+  ] });
+}
+var defaultFormat = (v) => `${v < 0 ? "-" : ""}$${Math.abs(v).toFixed(2)}`;
+var Stepper = ({
+  quantity,
+  max,
+  onChange
+}) => {
+  const btn = "flex h-7 w-7 items-center justify-center text-foreground-secondary hover:bg-surface-raised disabled:opacity-40 disabled:hover:bg-transparent focus:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-inset transition-colors";
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center rounded-md border border-border overflow-hidden", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", "aria-label": "Decrease quantity", disabled: quantity <= 1, onClick: () => onChange?.(quantity - 1), className: btn, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, className: "h-3.5 w-3.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", d: "M5 12h14" }) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-8 text-center text-sm tabular-nums text-foreground select-none", children: quantity }),
+    /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", "aria-label": "Increase quantity", disabled: max != null && quantity >= max, onClick: () => onChange?.(quantity + 1), className: btn, children: /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, className: "h-3.5 w-3.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", d: "M12 5v14M5 12h14" }) }) })
+  ] });
+};
+function Cart({
+  items,
+  onQuantityChange,
+  onRemove,
+  summaryRows = [],
+  formatPrice = defaultFormat,
+  checkoutLabel = "Checkout",
+  onCheckout,
+  emptyState,
+  className = "",
+  style
+}) {
+  const subtotal = items.reduce((sum, it) => sum + it.price * it.quantity, 0);
+  const total = subtotal + summaryRows.reduce((sum, r) => sum + r.value, 0);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ["flex flex-col rounded-xl border border-border bg-surface", className].filter(Boolean).join(" "), style, children: [
+    items.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-8 text-center text-sm text-foreground-muted", children: emptyState ?? "Your cart is empty." }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "divide-y divide-border", children: items.map((it) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-center gap-3 p-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-14 w-14 flex-shrink-0 overflow-hidden rounded-md bg-surface-raised", children: it.image && /* @__PURE__ */ jsxRuntime.jsx("img", { src: it.image, alt: "", className: "h-full w-full object-cover" }) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-sm font-medium text-foreground", children: it.name }),
+        it.meta && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-xs text-foreground-muted mt-0.5", children: it.meta }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1.5 flex items-center gap-3", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Stepper, { quantity: it.quantity, max: it.max, onChange: (q) => onQuantityChange?.(it.id, Math.max(1, q)) }),
+          onRemove && /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => onRemove(it.id),
+              className: "text-xs text-foreground-muted hover:text-status-error transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-accent rounded px-1",
+              children: "Remove"
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-shrink-0 text-sm font-semibold text-foreground tabular-nums", children: formatPrice(it.price * it.quantity) })
+    ] }, it.id)) }),
+    items.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-t border-border p-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("dl", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-sm", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-foreground-secondary", children: "Subtotal" }),
+          /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "tabular-nums text-foreground", children: formatPrice(subtotal) })
+        ] }),
+        summaryRows.map((r, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-sm", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("dt", { className: r.muted ? "text-foreground-muted" : "text-foreground-secondary", children: r.label }),
+          /* @__PURE__ */ jsxRuntime.jsx("dd", { className: `tabular-nums ${r.value < 0 ? "text-status-success" : "text-foreground"}`, children: formatPrice(r.value) })
+        ] }, i)),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between border-t border-border pt-2 mt-1 text-base font-semibold", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-foreground", children: "Total" }),
+          /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "tabular-nums text-foreground", children: formatPrice(total) })
+        ] })
+      ] }),
+      onCheckout && /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: onCheckout,
+          className: "mt-4 w-full rounded-lg bg-accent px-4 py-2.5 text-sm font-semibold text-accent-fg transition-colors hover:bg-accent-hover focus:outline-none focus-visible:ring-2 focus-visible:ring-accent focus-visible:ring-offset-2",
+          children: checkoutLabel
+        }
+      )
+    ] })
+  ] });
+}
+var NotificationContext = React19.createContext({
   open: () => void 0,
   close: () => void 0
 });
@@ -2093,26 +2287,26 @@ function NotificationItem({
   onClose,
   reduced
 }) {
-  const [paused, setPaused] = React18.useState(false);
+  const [paused, setPaused] = React19.useState(false);
   const duration = n.duration ?? 4e3;
   const isAutoDismissing = isFinite(duration) && duration > 0;
   const showProgress = !reduced && isAutoDismissing;
-  const timerRef = React18.useRef(null);
-  const startTimeRef = React18.useRef(0);
-  const remainingRef = React18.useRef(duration);
-  const clearTimer = React18.useCallback(() => {
+  const timerRef = React19.useRef(null);
+  const startTimeRef = React19.useRef(0);
+  const remainingRef = React19.useRef(duration);
+  const clearTimer = React19.useCallback(() => {
     if (timerRef.current !== null) {
       clearTimeout(timerRef.current);
       timerRef.current = null;
     }
   }, []);
-  const scheduleDismiss = React18.useCallback((ms) => {
+  const scheduleDismiss = React19.useCallback((ms) => {
     clearTimer();
     if (!isAutoDismissing) return;
     startTimeRef.current = Date.now();
     timerRef.current = setTimeout(() => onClose(n.id), ms);
   }, [clearTimer, isAutoDismissing, n.id, onClose]);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (paused || !isAutoDismissing) return;
     scheduleDismiss(remainingRef.current);
     return clearTimer;
@@ -2195,15 +2389,15 @@ function NotificationProvider({
   children,
   position = "top-right"
 }) {
-  const [notifications, setNotifications] = React18.useState([]);
+  const [notifications, setNotifications] = React19.useState([]);
   const reduced = framerMotion.useReducedMotion();
-  const open = React18.useCallback((payload) => {
+  const open = React19.useCallback((payload) => {
     setNotifications((prev) => [
       ...prev,
       { duration: 4e3, ...payload, id: Date.now() + Math.random() }
     ]);
   }, []);
-  const close = React18.useCallback((id) => {
+  const close = React19.useCallback((id) => {
     setNotifications((prev) => prev.filter((n) => n.id !== id));
   }, []);
   return /* @__PURE__ */ jsxRuntime.jsxs(NotificationContext.Provider, { value: { open, close }, children: [
@@ -2232,7 +2426,7 @@ function NotificationProvider({
   ] });
 }
 function useNotification() {
-  const { open } = React18.useContext(NotificationContext);
+  const { open } = React19.useContext(NotificationContext);
   return {
     info: (props) => open({ type: "info", ...props }),
     success: (props) => open({ type: "success", ...props }),
@@ -2349,10 +2543,10 @@ function FadingBase({
   isMounted = false,
   children
 }) {
-  const [shouldRender, setShouldRender] = React18.useState(isMounted);
-  const [visible, setVisible] = React18.useState(false);
-  const timerRef = React18.useRef(null);
-  React18.useEffect(() => {
+  const [shouldRender, setShouldRender] = React19.useState(isMounted);
+  const [visible, setVisible] = React19.useState(false);
+  const timerRef = React19.useRef(null);
+  React19.useEffect(() => {
     if (isMounted) {
       setShouldRender(true);
       const rafId = requestAnimationFrame(() => setVisible(true));
@@ -2450,8 +2644,8 @@ function ScalableContainer({
   togglePosition = "top-right",
   className = ""
 }) {
-  const containerRef = React18.useRef(null);
-  const [internalScaled, setInternalScaled] = React18.useState(false);
+  const containerRef = React19.useRef(null);
+  const [internalScaled, setInternalScaled] = React19.useState(false);
   const isScaled = expanded ?? internalScaled;
   const reduced = framerMotion.useReducedMotion();
   const onToggle = () => {
@@ -2589,17 +2783,17 @@ function CatalogGrid({ items, buttonText, onOpen, className = "" }) {
   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)) });
 }
 function CatalogCarousel({ items, buttonText, onOpen, className = "" }) {
-  const [activeIndex, setActiveIndex] = React18.useState(0);
-  const [indexPool, setIndexPool] = React18.useState([]);
-  const cardRefs = React18.useRef([]);
-  const getIndexes = React18.useMemo(() => {
+  const [activeIndex, setActiveIndex] = React19.useState(0);
+  const [indexPool, setIndexPool] = React19.useState([]);
+  const cardRefs = React19.useRef([]);
+  const getIndexes = React19.useMemo(() => {
     let nextIndex = activeIndex + 1;
     let previousIndex = activeIndex - 1;
     if (activeIndex === 0) previousIndex = items.length - 1;
     if (activeIndex === items.length - 1) nextIndex = 0;
     return { previousIndex, nextIndex };
   }, [activeIndex, items.length]);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     const { nextIndex, previousIndex } = getIndexes;
     let indexes = [previousIndex, activeIndex, nextIndex];
     if (activeIndex !== 0 && activeIndex !== items.length - 1) {
@@ -2772,8 +2966,8 @@ function writeDismissed(key) {
   }
 }
 function useTargetBbox(ref) {
-  const [bbox, setBbox] = React18.useState(null);
-  React18.useLayoutEffect(() => {
+  const [bbox, setBbox] = React19.useState(null);
+  React19.useLayoutEffect(() => {
     const el = ref?.current;
     if (!el) {
       setBbox(null);
@@ -2803,7 +2997,7 @@ function tooltipStyleFor(bbox, placement) {
   return { left: bbox.left + bbox.width / 2, top: bbox.top - TOOLTIP_GAP, transform: "translate(-50%, -100%)", width: TOOLTIP_WIDTH };
 }
 function useFocusTrap(containerRef, active) {
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (!active) return;
     const el = containerRef.current;
     if (!el) return;
@@ -2842,16 +3036,16 @@ function Wizard({
   onComplete,
   onSkip
 }) {
-  const tooltipRef = React18.useRef(null);
-  const tooltipTitleId = React18.useId();
-  const tooltipBodyId = React18.useId();
+  const tooltipRef = React19.useRef(null);
+  const tooltipTitleId = React19.useId();
+  const tooltipBodyId = React19.useId();
   const reduced = framerMotion.useReducedMotion();
-  const [open, setOpen] = React18.useState(() => steps.length > 0 && !readDismissed(storageKey));
-  const [activeIndex, setActiveIndex] = React18.useState(0);
+  const [open, setOpen] = React19.useState(() => steps.length > 0 && !readDismissed(storageKey));
+  const [activeIndex, setActiveIndex] = React19.useState(0);
   const step = steps[activeIndex];
   const bbox = useTargetBbox(step?.stepRef);
   useFocusTrap(tooltipRef, open);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (!open || !dismissible) return;
     const onKey = (e) => {
       if (e.key === "Escape") {
@@ -2862,12 +3056,12 @@ function Wizard({
     document.addEventListener("keydown", onKey);
     return () => document.removeEventListener("keydown", onKey);
   }, [open, dismissible]);
-  const handleSkip = React18.useCallback(() => {
+  const handleSkip = React19.useCallback(() => {
     writeDismissed(storageKey);
     setOpen(false);
     onSkip?.();
   }, [storageKey, onSkip]);
-  const handleComplete = React18.useCallback(() => {
+  const handleComplete = React19.useCallback(() => {
     writeDismissed(storageKey);
     setOpen(false);
     onComplete?.();
@@ -3138,7 +3332,7 @@ function Field({
   );
 }
 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" }) });
-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) {
+var SearchInput = React19__default.default.forwardRef(function SearchInput2({ value, onChange, disabled, label, htmlFor, placeholder, name, inputStyle, style, layout = "vertical", size = "md", icon, helperText, className }, ref) {
   return /* @__PURE__ */ jsxRuntime.jsx(Field, { className, label, htmlFor, layout, helperText, children: /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -3192,11 +3386,11 @@ function MultiTagRow({
   labelFor,
   onRemove
 }) {
-  const wrapRef = React18.useRef(null);
-  const measureRef = React18.useRef(null);
-  const [visibleCount, setVisibleCount] = React18.useState(values.length);
+  const wrapRef = React19.useRef(null);
+  const measureRef = React19.useRef(null);
+  const [visibleCount, setVisibleCount] = React19.useState(values.length);
   const key = values.map(String).join("|");
-  React18.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     const wrap = wrapRef.current;
     const measure = measureRef.current;
     if (!wrap || !measure) return;
@@ -3290,16 +3484,16 @@ function Dropdown({
   size = "md",
   className = ""
 }) {
-  const [open, setOpen] = React18.useState(false);
-  const [selectedItems, setSelectedItems] = React18.useState([]);
-  const [searchTerm, setSearchTerm] = React18.useState("");
-  const [innerItems, setInnerItems] = React18.useState([]);
-  const errorId = React18.useId();
+  const [open, setOpen] = React19.useState(false);
+  const [selectedItems, setSelectedItems] = React19.useState([]);
+  const [searchTerm, setSearchTerm] = React19.useState("");
+  const [innerItems, setInnerItems] = React19.useState([]);
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     setInnerItems(items);
   }, [items]);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (isMultiselect && Array.isArray(value)) {
       setSelectedItems(value);
     }
@@ -3624,7 +3818,7 @@ function TableBody({
   expandRow,
   getRowKey
 }) {
-  const [expanded, setExpanded] = React18.useState(() => /* @__PURE__ */ new Set());
+  const [expanded, setExpanded] = React19.useState(() => /* @__PURE__ */ new Set());
   const reduced = framerMotion.useReducedMotion();
   const toggleRow = (rowKey) => {
     setExpanded((prev) => {
@@ -3639,7 +3833,7 @@ function TableBody({
   return /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: rows.map((row, i) => {
     const rowKey = getRowKey(row, i);
     const isExpanded = expanded.has(rowKey);
-    return /* @__PURE__ */ jsxRuntime.jsxs(React18__default.default.Fragment, { children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs(React19__default.default.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsxs(
         "tr",
         {
@@ -3695,9 +3889,9 @@ function Pagination({
   const matchedOption = picker.find(
     (o) => o.label === options.perPage || o.value === options.perPage
   );
-  const [perPageKey, setPerPageKey] = React18.useState(() => matchedOption?.key ?? picker[0]?.key);
+  const [perPageKey, setPerPageKey] = React19.useState(() => matchedOption?.key ?? picker[0]?.key);
   const displayPerPageKey = serverSide ? matchedOption?.key ?? perPageKey : perPageKey;
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (serverSide && options.perPage != null) {
       const next = picker.find((o) => o.label === options.perPage || o.value === options.perPage);
       if (next) setPerPageKey(next.key);
@@ -3761,14 +3955,14 @@ function Table({
   className = "",
   style
 }) {
-  const searchRef = React18.useRef(null);
-  const [searchTerm, setSearchTerm] = React18.useState("");
-  const [perPage, setPerPage] = React18.useState(
+  const searchRef = React19.useRef(null);
+  const [searchTerm, setSearchTerm] = React19.useState("");
+  const [perPage, setPerPage] = React19.useState(
     typeof pagination.perPage === "number" ? pagination.perPage : 15
   );
-  const [activePage, setActivePage] = React18.useState(0);
+  const [activePage, setActivePage] = React19.useState(0);
   const isServerSide = !!(pagination.enabled && pagination.serverSide);
-  const filteredRows = React18.useMemo(() => {
+  const filteredRows = React19.useMemo(() => {
     if (isServerSide || !searchTerm) return rows;
     const term = searchTerm.toLowerCase();
     return rows.filter(
@@ -3777,29 +3971,29 @@ function Table({
       )
     );
   }, [rows, searchTerm, isServerSide]);
-  const datasets = React18.useMemo(() => {
+  const datasets = React19.useMemo(() => {
     if (isServerSide) return [rows];
     return createDatasets(filteredRows, pagination.enabled ? perPage : null);
   }, [filteredRows, perPage, pagination.enabled, isServerSide, rows]);
-  const MAX_PAGE = React18.useMemo(() => {
+  const MAX_PAGE = React19.useMemo(() => {
     if (isServerSide && typeof pagination.maxPage === "number") return Math.max(0, pagination.maxPage);
     if (isServerSide && typeof pagination.totalCount === "number")
       return Math.max(0, Math.ceil(pagination.totalCount / perPage) - 1);
     return datasets.length ? datasets.length - 1 : 0;
   }, [isServerSide, pagination.maxPage, pagination.totalCount, perPage, datasets.length]);
-  const currentPageRows = React18.useMemo(() => {
+  const currentPageRows = React19.useMemo(() => {
     if (isServerSide) return rows;
     return datasets[activePage] ?? [];
   }, [isServerSide, rows, datasets, activePage]);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (pagination.enabled && !isServerSide && typeof pagination.perPage === "number") {
       setPerPage(pagination.perPage);
     }
   }, [pagination.enabled, pagination.perPage, isServerSide]);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (isServerSide && typeof pagination.perPage === "number") setPerPage(pagination.perPage);
   }, [isServerSide, pagination.perPage]);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (isServerSide && typeof pagination.page === "number" && pagination.page >= 1)
       setActivePage(pagination.page - 1);
   }, [isServerSide, pagination.page]);
@@ -3883,7 +4077,7 @@ function TableSkeletonBody({
   )) });
 }
 function ThemeSwitch({ checked, onChange, label = "Toggle dark mode", className = "" }) {
-  const id = React18.useId();
+  const id = React19.useId();
   return /* @__PURE__ */ jsxRuntime.jsx("label", { htmlFor: id, className: `flex items-center gap-2 cursor-pointer select-none ${className}`.trim(), children: /* @__PURE__ */ jsxRuntime.jsx(
     SwitchPrimitive__namespace.Root,
     {
@@ -4067,7 +4261,7 @@ function Sidebar({
     }
   ) });
 }
-var MegaMenuContext = React18.createContext({ align: "start" });
+var MegaMenuContext = React19.createContext({ align: "start" });
 function MegaMenu({
   children,
   align = "start",
@@ -4098,7 +4292,7 @@ function MegaMenu({
 }
 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";
 function MegaMenuItem({ label, icon, href, children, className = "" }) {
-  const { align } = React18.useContext(MegaMenuContext);
+  const { align } = React19.useContext(MegaMenuContext);
   const pos = align === "center" ? "left-1/2 -translate-x-1/2" : align === "end" ? "right-0" : "left-0";
   if (!children) {
     return /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu__namespace.Item, { children: /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenu__namespace.Link, { href, className: [TOP_ITEM, className].filter(Boolean).join(" "), children: [
@@ -4183,8 +4377,8 @@ function MegaMenuLink({ href, icon, description, active, onClick, children, clas
 function MegaMenuFeatured({ children, className = "" }) {
   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 });
 }
-var elementsOfType = (children, type) => React18__default.default.Children.toArray(children).filter(
-  (c) => React18__default.default.isValidElement(c) && c.type === type
+var elementsOfType = (children, type) => React19__default.default.Children.toArray(children).filter(
+  (c) => React19__default.default.isValidElement(c) && c.type === type
 );
 var MOBILE_CHEVRON = /* @__PURE__ */ jsxRuntime.jsx(
   "svg",
@@ -4221,9 +4415,9 @@ function MobileLinkRow({ link, onNavigate }) {
   );
 }
 function MobilePanel({ panel, onNavigate }) {
-  const nodes = React18__default.default.Children.toArray(panel.props.children);
+  const nodes = React19__default.default.Children.toArray(panel.props.children);
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 px-2 pb-3 pt-1", children: nodes.map((node, i) => {
-    if (!React18__default.default.isValidElement(node)) return null;
+    if (!React19__default.default.isValidElement(node)) return null;
     const el = node;
     if (el.type === MegaMenuSection) {
       const { title, children } = el.props;
@@ -4242,8 +4436,8 @@ function MegaMenuMobile({
   children,
   label
 }) {
-  const [open, setOpen] = React18.useState(false);
-  const [expanded, setExpanded] = React18.useState(null);
+  const [open, setOpen] = React19.useState(false);
+  const [expanded, setExpanded] = React19.useState(null);
   const items = elementsOfType(children, MegaMenuItem);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "md:hidden w-full", children: [
     /* @__PURE__ */ jsxRuntime.jsxs(
@@ -4316,17 +4510,17 @@ function AppShell({
   children,
   className = ""
 }) {
-  const [expanded, setExpanded] = React18.useState(sidebarDefaultExpanded);
-  const [isMobile, setIsMobile] = React18.useState(false);
-  const [mobileOpen, setMobileOpen] = React18.useState(false);
-  React18.useEffect(() => {
+  const [expanded, setExpanded] = React19.useState(sidebarDefaultExpanded);
+  const [isMobile, setIsMobile] = React19.useState(false);
+  const [mobileOpen, setMobileOpen] = React19.useState(false);
+  React19.useEffect(() => {
     const mq = window.matchMedia("(max-width: 767px)");
     const update = (e) => setIsMobile(e.matches);
     update(mq);
     mq.addEventListener("change", update);
     return () => mq.removeEventListener("change", update);
   }, []);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (!isMobile) setMobileOpen(false);
   }, [isMobile]);
   const hasSidebar = sidebarSections.length > 0;
@@ -4516,10 +4710,10 @@ function ThemeProvider({
   className = "",
   style
 }) {
-  const id = React18__default.default.useId().replace(/:/g, "");
+  const id = React19__default.default.useId().replace(/:/g, "");
   const scopeClass = `geo-th-${id}`;
-  const divRef = React18.useRef(null);
-  React18.useEffect(() => {
+  const divRef = React19.useRef(null);
+  React19.useEffect(() => {
     const el = divRef.current;
     if (!el) return;
     if (colorScheme === "auto") return;
@@ -4534,8 +4728,8 @@ function ThemeProvider({
     }
     el.classList.toggle("dark", colorScheme === "dark");
   }, [colorScheme]);
-  const lightVars = React18.useMemo(() => toCssVars(theme), [theme]);
-  const darkVarStr = React18.useMemo(() => {
+  const lightVars = React19.useMemo(() => toCssVars(theme), [theme]);
+  const darkVarStr = React19.useMemo(() => {
     if (!darkTheme) return "";
     const dvars = toCssVars(darkTheme);
     if (!Object.keys(dvars).length) return "";
@@ -4575,7 +4769,7 @@ function TextInput({
   prefix,
   suffix
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
   const hasAdornment = prefix != null || suffix != null;
   const input = /* @__PURE__ */ jsxRuntime.jsx(
@@ -4645,7 +4839,7 @@ function NumberInput({
   readOnly = false,
   precision
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
   const inferredPrecision = precision ?? (Number.isInteger(step) ? 0 : String(step).split(".")[1]?.length ?? 0);
   const round = (n) => {
@@ -4776,8 +4970,8 @@ function Password({
   showIcon,
   hideIcon
 }) {
-  const [visible, setVisible] = React18.useState(false);
-  const errorId = React18.useId();
+  const [visible, setVisible] = React19.useState(false);
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
   return /* @__PURE__ */ jsxRuntime.jsx(
     Field,
@@ -4850,7 +5044,7 @@ function Checkbox({
 }) {
   const isChecked = checked ?? value ?? false;
   const labelFirst = labelPosition === "left";
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
   const box = /* @__PURE__ */ jsxRuntime.jsx(
     CheckboxPrimitive__namespace.Root,
@@ -4958,8 +5152,8 @@ function RadioGroup({
   className,
   errorMessage
 }) {
-  const errorId = React18.useId();
-  const groupId = React18.useId();
+  const errorId = React19.useId();
+  const groupId = React19.useId();
   const hasError = errorMessage != null;
   const labelFirst = labelPosition === "left";
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -5059,11 +5253,11 @@ function Switch({
   disabled,
   errorMessage
 }) {
-  const id = React18.useId();
-  const errorId = React18.useId();
+  const id = React19.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
   const isControlled = checked !== void 0;
-  const [internal, setInternal] = React18.useState(defaultChecked);
+  const [internal, setInternal] = React19.useState(defaultChecked);
   const isOn = isControlled ? checked : internal;
   const handle = (c) => {
     if (!isControlled) setInternal(c);
@@ -5136,19 +5330,19 @@ function AutoComplete({
   required,
   htmlFor
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
-  const [term, setTerm] = React18.useState("");
-  const [open, setOpen] = React18.useState(false);
-  const [asyncItems, setAsyncItems] = React18.useState([]);
-  const [loading, setLoading] = React18.useState(false);
+  const [term, setTerm] = React19.useState("");
+  const [open, setOpen] = React19.useState(false);
+  const [asyncItems, setAsyncItems] = React19.useState([]);
+  const [loading, setLoading] = React19.useState(false);
   const isAsync = typeof onSearch === "function";
-  const debounceRef = React18.useRef(null);
-  const requestIdRef = React18.useRef(0);
+  const debounceRef = React19.useRef(null);
+  const requestIdRef = React19.useRef(0);
   const staticFiltered = isAsync || !items ? [] : term.trim() ? items.filter(
     ({ key, label: label2 }) => label2.toLowerCase().includes(term.toLowerCase()) || key.toLowerCase().includes(term.toLowerCase())
   ) : [];
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (!isAsync) return;
     if (debounceRef.current) clearTimeout(debounceRef.current);
     if (!term.trim()) {
@@ -5304,15 +5498,15 @@ function TreeSelect({
   defaultExpandedKeys = [],
   size = "md"
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
-  const [open, setOpen] = React18.useState(false);
-  const [expanded, setExpanded] = React18.useState(() => new Set(defaultExpandedKeys));
-  const [activeIndex, setActiveIndex] = React18.useState(0);
-  const listRef = React18.useRef(null);
-  const visible = React18.useMemo(() => flattenVisible(items, expanded), [items, expanded]);
-  const didSyncOnOpenRef = React18.useRef(false);
-  React18.useEffect(() => {
+  const [open, setOpen] = React19.useState(false);
+  const [expanded, setExpanded] = React19.useState(() => new Set(defaultExpandedKeys));
+  const [activeIndex, setActiveIndex] = React19.useState(0);
+  const listRef = React19.useRef(null);
+  const visible = React19.useMemo(() => flattenVisible(items, expanded), [items, expanded]);
+  const didSyncOnOpenRef = React19.useRef(false);
+  React19.useEffect(() => {
     if (!open) {
       didSyncOnOpenRef.current = false;
       return;
@@ -5322,7 +5516,7 @@ function TreeSelect({
     setActiveIndex(selectedIdx >= 0 ? selectedIdx : 0);
     didSyncOnOpenRef.current = true;
   }, [open, value]);
-  const selectedNode = React18.useMemo(
+  const selectedNode = React19.useMemo(
     () => value != null ? findNodeByKey(items, value) : null,
     [items, value]
   );
@@ -5553,11 +5747,11 @@ function FileInput({
   required,
   icon
 }) {
-  const inputRef = React18.useRef(null);
-  const errorId = React18.useId();
-  const [files, setFiles] = React18.useState([]);
-  const [dragging, setDragging] = React18.useState(false);
-  const [sizeError, setSizeError] = React18.useState(null);
+  const inputRef = React19.useRef(null);
+  const errorId = React19.useId();
+  const [files, setFiles] = React19.useState([]);
+  const [dragging, setDragging] = React19.useState(false);
+  const [sizeError, setSizeError] = React19.useState(null);
   const effectiveError = errorMessage ?? sizeError ?? void 0;
   const openPicker = () => {
     if (!disabled) inputRef.current?.click();
@@ -5703,18 +5897,18 @@ function addDays(d, n) {
   c.setDate(c.getDate() + n);
   return c;
 }
-function addMonths(d, n) {
+function addMonths2(d, n) {
   const c = new Date(d);
   c.setMonth(c.getMonth() + n);
   return c;
 }
-function defaultFormat(d) {
+function defaultFormat2(d) {
   const y = d.getFullYear().toString().padStart(4, "0");
   const m = (d.getMonth() + 1).toString().padStart(2, "0");
   const day = d.getDate().toString().padStart(2, "0");
   return `${y}-${m}-${day}`;
 }
-function buildGrid(viewMonth, weekStartsOn) {
+function buildGrid2(viewMonth, weekStartsOn) {
   const first = startOfMonth(viewMonth);
   const startOffset = (first.getDay() - weekStartsOn + 7) % 7;
   const gridStart = addDays(first, -startOffset);
@@ -5742,36 +5936,36 @@ function DatePicker({
   min,
   max,
   style,
-  format = defaultFormat,
+  format = defaultFormat2,
   weekStartsOn = 0,
   clearable = true,
   size = "md",
   className = ""
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
-  const [open, setOpen] = React18.useState(false);
-  const [viewMonth, setViewMonth] = React18.useState(() => startOfMonth(value ?? /* @__PURE__ */ new Date()));
-  const [focusDate, setFocusDate] = React18.useState(() => value ?? /* @__PURE__ */ new Date());
-  const [view, setView] = React18.useState("days");
-  const gridRef = React18.useRef(null);
-  React18.useEffect(() => {
+  const [open, setOpen] = React19.useState(false);
+  const [viewMonth, setViewMonth] = React19.useState(() => startOfMonth(value ?? /* @__PURE__ */ new Date()));
+  const [focusDate, setFocusDate] = React19.useState(() => value ?? /* @__PURE__ */ new Date());
+  const [view, setView] = React19.useState("days");
+  const gridRef = React19.useRef(null);
+  React19.useEffect(() => {
     if (!open) return;
     const target = value ?? /* @__PURE__ */ new Date();
     setViewMonth(startOfMonth(target));
     setFocusDate(target);
     setView("days");
   }, [open, value]);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     if (!open) return;
-    const cell = gridRef.current?.querySelector(`[data-day="${defaultFormat(focusDate)}"]`);
+    const cell = gridRef.current?.querySelector(`[data-day="${defaultFormat2(focusDate)}"]`);
     cell?.focus();
   }, [open, focusDate]);
-  const weekdays = React18.useMemo(() => {
+  const weekdays = React19.useMemo(() => {
     const ordered = WEEKDAY_SHORT.slice(weekStartsOn).concat(WEEKDAY_SHORT.slice(0, weekStartsOn));
     return ordered;
   }, [weekStartsOn]);
-  const grid = React18.useMemo(() => buildGrid(viewMonth, weekStartsOn), [viewMonth, weekStartsOn]);
+  const grid = React19.useMemo(() => buildGrid2(viewMonth, weekStartsOn), [viewMonth, weekStartsOn]);
   const isDisabled = (d) => {
     if (min && d < min) return true;
     if (max && d > max) return true;
@@ -5802,14 +5996,14 @@ function DatePicker({
       next(7);
     } else if (e.key === "PageUp") {
       e.preventDefault();
-      const nm = addMonths(viewMonth, -1);
+      const nm = addMonths2(viewMonth, -1);
       setViewMonth(nm);
-      setFocusDate((d) => addMonths(d, -1));
+      setFocusDate((d) => addMonths2(d, -1));
     } else if (e.key === "PageDown") {
       e.preventDefault();
-      const nm = addMonths(viewMonth, 1);
+      const nm = addMonths2(viewMonth, 1);
       setViewMonth(nm);
-      setFocusDate((d) => addMonths(d, 1));
+      setFocusDate((d) => addMonths2(d, 1));
     } else if (e.key === "Home") {
       e.preventDefault();
       const dow = (focusDate.getDay() - weekStartsOn + 7) % 7;
@@ -5874,7 +6068,7 @@ function DatePicker({
                   {
                     type: "button",
                     onClick: () => {
-                      if (view === "days") setViewMonth(addMonths(viewMonth, -1));
+                      if (view === "days") setViewMonth(addMonths2(viewMonth, -1));
                       else if (view === "months") setViewMonth(new Date(viewMonth.getFullYear() - 1, viewMonth.getMonth(), 1));
                       else setViewMonth(new Date(viewMonth.getFullYear() - 10, viewMonth.getMonth(), 1));
                     },
@@ -5909,7 +6103,7 @@ function DatePicker({
                   {
                     type: "button",
                     onClick: () => {
-                      if (view === "days") setViewMonth(addMonths(viewMonth, 1));
+                      if (view === "days") setViewMonth(addMonths2(viewMonth, 1));
                       else if (view === "months") setViewMonth(new Date(viewMonth.getFullYear() + 1, viewMonth.getMonth(), 1));
                       else setViewMonth(new Date(viewMonth.getFullYear() + 10, viewMonth.getMonth(), 1));
                     },
@@ -5976,8 +6170,8 @@ function DatePicker({
                           type: "button",
                           disabled: dis,
                           tabIndex: focused ? 0 : -1,
-                          "data-day": defaultFormat(date),
-                          "aria-label": defaultFormat(date),
+                          "data-day": defaultFormat2(date),
+                          "aria-label": defaultFormat2(date),
                           "aria-selected": sel || void 0,
                           onClick: () => selectDate(date),
                           className: [
@@ -5988,7 +6182,7 @@ function DatePicker({
                           ].join(" "),
                           children: date.getDate()
                         }
-                      ) }, defaultFormat(date));
+                      ) }, defaultFormat2(date));
                     }) }, ri)) })
                   ]
                 }
@@ -6061,10 +6255,10 @@ function TextArea({
   style,
   inputStyle
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
-  const ref = React18.useRef(null);
-  React18.useLayoutEffect(() => {
+  const ref = React19.useRef(null);
+  React19.useLayoutEffect(() => {
     if (!autoGrow) return;
     const el = ref.current;
     if (!el) return;
@@ -6134,11 +6328,11 @@ function SegmentedControl({
   "aria-label": ariaLabel
 }) {
   const sz = SIZE5[size];
-  const groupId = React18.useId();
-  const errorId = React18.useId();
+  const groupId = React19.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
   const isControlled = value !== void 0;
-  const [internal, setInternal] = React18.useState(defaultValue);
+  const [internal, setInternal] = React19.useState(defaultValue);
   const current = isControlled ? value : internal;
   const handle = (v) => {
     if (!v) return;
@@ -6232,14 +6426,14 @@ function Slider({
   name,
   htmlFor
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
   const isRange = Array.isArray(value ?? defaultValue);
-  const [internal, setInternal] = React18.useState(
+  const [internal, setInternal] = React19.useState(
     () => toArray(value) ?? toArray(defaultValue) ?? [min]
   );
   const current = toArray(value) ?? internal;
-  const [dragging, setDragging] = React18.useState(false);
+  const [dragging, setDragging] = React19.useState(false);
   const emit = (arr) => {
     setInternal(arr);
     const next = isRange ? [arr[0], arr[1]] : arr[0];
@@ -6334,11 +6528,11 @@ function TagsInput({
   validate,
   separators = ["Enter", ","]
 }) {
-  const errorId = React18.useId();
-  const inputRef = React18.useRef(null);
-  const [internal, setInternal] = React18.useState(defaultValue ?? []);
-  const [draft, setDraft] = React18.useState("");
-  const [localError, setLocalError] = React18.useState(null);
+  const errorId = React19.useId();
+  const inputRef = React19.useRef(null);
+  const [internal, setInternal] = React19.useState(defaultValue ?? []);
+  const [draft, setDraft] = React19.useState("");
+  const [localError, setLocalError] = React19.useState(null);
   const tags = value ?? internal;
   const hasError = errorMessage != null || localError != null;
   const errorText = errorMessage ?? localError ?? void 0;
@@ -6469,9 +6663,9 @@ function OtpInput({
   className,
   groupAfter
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
-  const refs = React18.useRef([]);
+  const refs = React19.useRef([]);
   const chars = Array.from({ length }, (_, i) => value[i] ?? "");
   const pattern = mode === "numeric" ? /[0-9]/ : /[a-zA-Z0-9]/;
   const emit = (next) => {
@@ -6520,7 +6714,7 @@ function OtpInput({
     emit(valid.join(""));
     focusBox(valid.length);
   };
-  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: [
+  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(React19__default.default.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       "input",
       {
@@ -6578,9 +6772,9 @@ function Rating({
   className,
   required
 }) {
-  const errorId = React18.useId();
-  const [internal, setInternal] = React18.useState(defaultValue);
-  const [hover, setHover] = React18.useState(null);
+  const errorId = React19.useId();
+  const [internal, setInternal] = React19.useState(defaultValue);
+  const [hover, setHover] = React19.useState(null);
   const current = value ?? internal;
   const display2 = hover ?? current;
   const interactive = !readOnly && !disabled;
@@ -6703,9 +6897,9 @@ function TimePicker({
   required,
   style
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
-  const [open, setOpen] = React18.useState(false);
+  const [open, setOpen] = React19.useState(false);
   const parsed = parse(value) ?? { h: 0, m: 0, s: 0 };
   const update = (next) => {
     const merged = { ...parsed, ...next };
@@ -6791,16 +6985,16 @@ function TimePicker({
 var MONTH_NAMES2 = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
 var WEEKDAY = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
 var startOfMonth2 = (d) => new Date(d.getFullYear(), d.getMonth(), 1);
-var addMonths2 = (d, n) => new Date(d.getFullYear(), d.getMonth() + n, 1);
+var addMonths3 = (d, n) => new Date(d.getFullYear(), d.getMonth() + n, 1);
 var addDays2 = (d, n) => {
   const c = new Date(d);
   c.setDate(c.getDate() + n);
   return c;
 };
 var isSameDay2 = (a, b) => a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-var startOfDay = (d) => new Date(d.getFullYear(), d.getMonth(), d.getDate());
+var startOfDay2 = (d) => new Date(d.getFullYear(), d.getMonth(), d.getDate());
 var defaultFmt = (d) => `${d.getFullYear()}-${`${d.getMonth() + 1}`.padStart(2, "0")}-${`${d.getDate()}`.padStart(2, "0")}`;
-function buildGrid2(viewMonth, weekStartsOn) {
+function buildGrid3(viewMonth, weekStartsOn) {
   const first = startOfMonth2(viewMonth);
   const offset = (first.getDay() - weekStartsOn + 7) % 7;
   const gridStart = addDays2(first, -offset);
@@ -6829,23 +7023,23 @@ function DateRangePicker({
   required,
   style
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
-  const [open, setOpen] = React18.useState(false);
-  const [leftMonth, setLeftMonth] = React18.useState(() => startOfMonth2(value.start ?? /* @__PURE__ */ new Date()));
-  const [pendingStart, setPendingStart] = React18.useState(null);
-  const [hoverDate, setHoverDate] = React18.useState(null);
-  const weekdays = React18.useMemo(
+  const [open, setOpen] = React19.useState(false);
+  const [leftMonth, setLeftMonth] = React19.useState(() => startOfMonth2(value.start ?? /* @__PURE__ */ new Date()));
+  const [pendingStart, setPendingStart] = React19.useState(null);
+  const [hoverDate, setHoverDate] = React19.useState(null);
+  const weekdays = React19.useMemo(
     () => WEEKDAY.slice(weekStartsOn).concat(WEEKDAY.slice(0, weekStartsOn)),
     [weekStartsOn]
   );
-  const isDisabled = (d) => min && d < startOfDay(min) || max && d > startOfDay(max);
+  const isDisabled = (d) => min && d < startOfDay2(min) || max && d > startOfDay2(max);
   const effective = pendingStart ? { start: pendingStart, end: hoverDate } : value;
   const inRange = (d) => {
     const { start, end } = effective;
     if (!start || !end) return false;
     const [a, b] = start <= end ? [start, end] : [end, start];
-    return d >= startOfDay(a) && d <= startOfDay(b);
+    return d >= startOfDay2(a) && d <= startOfDay2(b);
   };
   const onDayClick = (d) => {
     if (isDisabled(d)) return;
@@ -6863,7 +7057,7 @@ function DateRangePicker({
   };
   const triggerText = value.start && value.end ? `${format(value.start)} \u2013 ${format(value.end)}` : value.start ? `${format(value.start)} \u2013 \u2026` : "";
   const renderMonth = (viewMonth) => {
-    const cells = buildGrid2(viewMonth, weekStartsOn);
+    const cells = buildGrid3(viewMonth, weekStartsOn);
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-sm font-semibold text-center mb-2 select-none", children: [
         MONTH_NAMES2[viewMonth.getMonth()],
@@ -6952,7 +7146,7 @@ function DateRangePicker({
                 "button",
                 {
                   type: "button",
-                  onClick: () => setLeftMonth(addMonths2(leftMonth, -1)),
+                  onClick: () => setLeftMonth(addMonths3(leftMonth, -1)),
                   "aria-label": "Previous month",
                   className: "absolute -top-1 left-0 w-7 h-7 inline-flex items-center justify-center rounded-md hover:bg-surface-raised focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
                   children: /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, className: "w-4 h-4", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M15 19l-7-7 7-7" }) })
@@ -6965,13 +7159,13 @@ function DateRangePicker({
                 "button",
                 {
                   type: "button",
-                  onClick: () => setLeftMonth(addMonths2(leftMonth, 1)),
+                  onClick: () => setLeftMonth(addMonths3(leftMonth, 1)),
                   "aria-label": "Next month",
                   className: "absolute -top-1 right-0 w-7 h-7 inline-flex items-center justify-center rounded-md hover:bg-surface-raised focus:outline-none focus-visible:ring-2 focus-visible:ring-accent",
                   children: /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, className: "w-4 h-4", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" }) })
                 }
               ),
-              renderMonth(addMonths2(leftMonth, 1))
+              renderMonth(addMonths3(leftMonth, 1))
             ] })
           ] })
         ]
@@ -7011,10 +7205,10 @@ function ColorPicker({
   required,
   placeholder = "Pick a colour\u2026"
 }) {
-  const errorId = React18.useId();
+  const errorId = React19.useId();
   const hasError = errorMessage != null;
-  const [open, setOpen] = React18.useState(false);
-  const [draft, setDraft] = React18.useState(value);
+  const [open, setOpen] = React19.useState(false);
+  const [draft, setDraft] = React19.useState(value);
   const valid = HEX_RE.test(value);
   const pick = (hex) => {
     onChange?.(hex);
@@ -7401,11 +7595,11 @@ function buildBindings(store, name, kind, snap) {
 
 // src/form/useForm.ts
 function useForm(options = {}) {
-  const ref = React18.useRef(null);
+  const ref = React19.useRef(null);
   if (ref.current === null) ref.current = new FormStore(options);
   const store = ref.current;
-  React18.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
-  const make = React18.useCallback(
+  React19.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
+  const make = React19.useCallback(
     (kind) => (name, rules) => {
       if (rules !== void 0) store.setRule(name, rules);
       return buildBindings(store, name, kind, store.getFieldSnapshot(name));
@@ -7434,9 +7628,9 @@ function useForm(options = {}) {
     fieldTarget: make("target")
   };
 }
-var FormContext = React18.createContext(null);
+var FormContext = React19.createContext(null);
 function useFormStore() {
-  const store = React18.useContext(FormContext);
+  const store = React19.useContext(FormContext);
   if (!store) {
     throw new Error("useFormStore must be used within a <Form>. Did you forget to wrap your fields?");
   }
@@ -7450,8 +7644,8 @@ function Form({
   children,
   ...rest
 }) {
-  const ref = React18.useRef(null);
-  const bypass = React18.useRef(false);
+  const ref = React19.useRef(null);
+  const bypass = React19.useRef(false);
   const handleSubmit = async (e) => {
     if (bypass.current) {
       bypass.current = false;
@@ -7503,12 +7697,12 @@ function useFormField(name, options = {}) {
   const store = useFormStore();
   const { kind = "value", rules } = options;
   if (rules !== void 0 && store.getRule(name) !== rules) store.setRule(name, rules);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     return () => {
       if (rules !== void 0) store.removeRule(name);
     };
   }, [store, name]);
-  const snap = React18.useSyncExternalStore(
+  const snap = React19.useSyncExternalStore(
     store.subscribe,
     () => store.getFieldSnapshot(name)
   );
@@ -7520,7 +7714,7 @@ function FormField({ name, kind, rules, children }) {
 }
 function useFieldArray(name) {
   const store = useFormStore();
-  React18.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
+  React19.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
   const arr = store.getValue(name) ?? [];
   const keys = store.getKeys(name);
   return {
@@ -7643,7 +7837,7 @@ function CreditCardForm({
   className = "",
   style
 }) {
-  const initial = React18.useRef({
+  const initial = React19.useRef({
     number: formatCardNumber(defaultValue?.number ?? ""),
     name: defaultValue?.name ?? "",
     expiry: formatExpiry(defaultValue?.expiry ?? ""),
@@ -7652,7 +7846,7 @@ function CreditCardForm({
   const form = useForm({ initialValues: initial });
   const numberStr = String(form.values.number ?? "");
   const brand = detectBrand(numberStr);
-  React18.useEffect(() => {
+  React19.useEffect(() => {
     onChange?.(toCard(form.values));
   }, [form.values.number, form.values.name, form.values.expiry, form.values.cvv]);
   const numberBind = form.fieldNative("number", {
@@ -7759,8 +7953,10 @@ exports.Box = Box;
 exports.Breadcrumbs = Breadcrumbs;
 exports.Button = Button;
 exports.CARD_BRANDS = CARD_BRANDS;
+exports.Calendar = Calendar2;
 exports.Card = Card_default;
 exports.CardCarousel = CardCarousel;
+exports.Cart = Cart;
 exports.Catalog = Catalog;
 exports.CatalogCarousel = CatalogCarousel;
 exports.CatalogGrid = CatalogGrid;