@geomak/ui 6.20.0 → 6.21.0

package/dist/index.cjs

@@ -2,9 +2,10 @@
 
 var chunkOAV4TA4B_cjs = require('./chunk-OAV4TA4B.cjs');
 var jsxRuntime = require('react/jsx-runtime');
-var React24 = require('react');
+var React26 = require('react');
 var reactDom = require('react-dom');
 var AvatarPrimitive = require('@radix-ui/react-avatar');
+var DropdownMenu = require('@radix-ui/react-dropdown-menu');
 var Dialog = require('@radix-ui/react-dialog');
 var framerMotion = require('framer-motion');
 var TooltipPrimitive = require('@radix-ui/react-tooltip');
@@ -39,8 +40,9 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React24__default = /*#__PURE__*/_interopDefault(React24);
+var React26__default = /*#__PURE__*/_interopDefault(React26);
 var AvatarPrimitive__namespace = /*#__PURE__*/_interopNamespace(AvatarPrimitive);
+var DropdownMenu__namespace = /*#__PURE__*/_interopNamespace(DropdownMenu);
 var Dialog__namespace = /*#__PURE__*/_interopNamespace(Dialog);
 var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
 var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
@@ -214,8 +216,8 @@ Icon.Copy = Copy;
 Icon.CircleStack = CircleStack;
 var icons_default = Icon;
 function Portal({ children, target }) {
-  const [resolved, setResolved] = React24.useState(null);
-  React24.useEffect(() => {
+  const [resolved, setResolved] = React26.useState(null);
+  React26.useEffect(() => {
     if (target === null) {
       setResolved(null);
       return;
@@ -649,7 +651,7 @@ function IconButton({
   className = "",
   style
 }) {
-  const colorScheme = React24.useMemo(() => {
+  const colorScheme = React26.useMemo(() => {
     if (type === "primary") {
       return "bg-accent text-accent-fg hover:bg-accent-hover";
     }
@@ -728,7 +730,7 @@ var SIZE_CLASSES = {
   md: "h-9  px-4   text-sm  gap-1.5 rounded-lg",
   lg: "h-11 px-5   text-sm  gap-2   rounded-xl"
 };
-var Button = React24__default.default.forwardRef(function Button2({
+var Button = React26__default.default.forwardRef(function Button2({
   content,
   variant = "primary",
   size = "md",
@@ -785,6 +787,80 @@ var Button = React24__default.default.forwardRef(function Button2({
 });
 Button.displayName = "Button";
 var Button_default = Button;
+var Chevron = () => /* @__PURE__ */ jsxRuntime.jsx(
+  "svg",
+  {
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: 2,
+    "aria-hidden": "true",
+    className: "h-4 w-4 transition-transform duration-150 group-data-[state=open]:rotate-180",
+    children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 9l6 6 6-6" })
+  }
+);
+function MenuButton({
+  label,
+  items,
+  variant = "secondary",
+  size = "md",
+  icon,
+  hideChevron = false,
+  disabled,
+  align = "start",
+  side = "bottom",
+  className = ""
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu__namespace.Root, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Trigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+      Button_default,
+      {
+        variant,
+        size,
+        icon,
+        disabled,
+        className: `group ${className}`.trim(),
+        content: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
+          label,
+          !hideChevron && /* @__PURE__ */ jsxRuntime.jsx(Chevron, {})
+        ] })
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      DropdownMenu__namespace.Content,
+      {
+        align,
+        side,
+        sideOffset: 6,
+        collisionPadding: 8,
+        className: [
+          "z-[400] min-w-[10rem] rounded-lg border border-border bg-surface p-1 shadow-lg",
+          "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
+          "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95"
+        ].join(" "),
+        children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(React26__default.default.Fragment, { children: [
+          item.separatorBefore && /* @__PURE__ */ jsxRuntime.jsx(DropdownMenu__namespace.Separator, { className: "my-1 h-px bg-border" }),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            DropdownMenu__namespace.Item,
+            {
+              disabled: item.disabled,
+              onSelect: () => item.onSelect?.(),
+              className: [
+                "flex items-center gap-2.5 rounded-md px-2.5 py-1.5 text-sm outline-none cursor-pointer select-none transition-colors",
+                "data-[disabled]:opacity-50 data-[disabled]:pointer-events-none",
+                item.danger ? "text-status-error data-[highlighted]:bg-status-error/10" : "text-foreground data-[highlighted]:bg-surface-raised"
+              ].join(" "),
+              children: [
+                item.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-4 w-4 flex-shrink-0 items-center justify-center", children: item.icon }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 truncate", children: item.label })
+              ]
+            }
+          )
+        ] }, item.key))
+      }
+    ) })
+  ] });
+}
 var SIZE_MAP = {
   sm: 400,
   md: 600,
@@ -1005,9 +1081,9 @@ function Tooltip({
   ] }) });
 }
 var TooltipProvider = TooltipPrimitive__namespace.Provider;
-var TabsContext = React24.createContext(null);
+var TabsContext = React26.createContext(null);
 function useTabsContext() {
-  const ctx = React24.useContext(TabsContext);
+  const ctx = React26.useContext(TabsContext);
   if (!ctx) throw new Error("Tabs.List / Tabs.Trigger / Tabs.Panel must be rendered inside <Tabs>.");
   return ctx;
 }
@@ -1029,26 +1105,26 @@ function Tabs({
   children
 }) {
   const isControlled = value !== void 0;
-  const [internal, setInternal] = React24.useState(defaultValue);
+  const [internal, setInternal] = React26.useState(defaultValue);
   const current = isControlled ? value : internal;
   const reduced = !!framerMotion.useReducedMotion();
-  const indicatorId = React24.useId();
-  const select = React24.useCallback((next) => {
+  const indicatorId = React26.useId();
+  const select = React26.useCallback((next) => {
     if (!isControlled) setInternal(next);
     onValueChange?.(next);
   }, [isControlled, onValueChange]);
-  const registry = React24.useRef(/* @__PURE__ */ new Map());
-  const orderRef = React24.useRef(0);
-  const [, bump] = React24.useState(0);
-  const registerTab = React24.useCallback((val, meta) => {
+  const registry = React26.useRef(/* @__PURE__ */ new Map());
+  const orderRef = React26.useRef(0);
+  const [, bump] = React26.useState(0);
+  const registerTab = React26.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 = React24.useCallback((val) => {
+  const unregisterTab = React26.useCallback((val) => {
     if (registry.current.delete(val)) bump((v) => v + 1);
   }, []);
-  const getTabs = React24.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 = React26.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,
     {
@@ -1068,10 +1144,10 @@ function Tabs({
 function TabsList({ children, "aria-label": ariaLabel, className = "" }) {
   const { variant, orientation, reduced, value } = useTabsContext();
   const horizontal = orientation === "horizontal";
-  const scrollRef = React24.useRef(null);
-  const [edges, setEdges] = React24.useState({ start: false, end: false });
+  const scrollRef = React26.useRef(null);
+  const [edges, setEdges] = React26.useState({ start: false, end: false });
   const scrollable = variant !== "segmented";
-  React24.useLayoutEffect(() => {
+  React26.useLayoutEffect(() => {
     const el = scrollRef.current;
     if (!el || !scrollable) return;
     const update = () => {
@@ -1096,13 +1172,13 @@ function TabsList({ children, "aria-label": ariaLabel, className = "" }) {
       ro.disconnect();
     };
   }, [horizontal, scrollable, children]);
-  const nudge = React24.useCallback((dir) => {
+  const nudge = React26.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]);
-  React24.useLayoutEffect(() => {
+  React26.useLayoutEffect(() => {
     const el = scrollRef.current;
     if (!el || !scrollable) return;
     const active = el.querySelector("[role=tab][data-state=active]");
@@ -1128,7 +1204,7 @@ function TabsList({ children, "aria-label": ariaLabel, className = "" }) {
   const scrollClass = scrollable ? horizontal ? "overflow-x-auto overflow-y-hidden hidden-scrollbar" : "overflow-y-auto overflow-x-hidden hidden-scrollbar" : "";
   const overflowing = scrollable && (edges.start || edges.end);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ["relative flex min-w-0 gap-1", horizontal ? "flex-row items-stretch" : "flex-col items-stretch", className].filter(Boolean).join(" "), children: [
-    scrollable && edges.start && /* @__PURE__ */ jsxRuntime.jsx(Chevron, { side: "start", orientation, onClick: () => nudge(-1) }),
+    scrollable && edges.start && /* @__PURE__ */ jsxRuntime.jsx(Chevron2, { side: "start", orientation, onClick: () => nudge(-1) }),
     /* @__PURE__ */ jsxRuntime.jsx(
       TabsPrimitive__namespace.List,
       {
@@ -1139,11 +1215,11 @@ function TabsList({ children, "aria-label": ariaLabel, className = "" }) {
         children
       }
     ),
-    scrollable && edges.end && /* @__PURE__ */ jsxRuntime.jsx(Chevron, { side: "end", orientation, onClick: () => nudge(1) }),
+    scrollable && edges.end && /* @__PURE__ */ jsxRuntime.jsx(Chevron2, { side: "end", orientation, onClick: () => nudge(1) }),
     overflowing && /* @__PURE__ */ jsxRuntime.jsx(OverflowMenu, {})
   ] });
 }
-function Chevron({ side, orientation, onClick }) {
+function Chevron2({ side, orientation, onClick }) {
   const horizontal = orientation === "horizontal";
   const rotate = horizontal ? side === "start" ? "rotate-180" : "" : side === "start" ? "-rotate-90" : "rotate-90";
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -1160,9 +1236,9 @@ function Chevron({ side, orientation, onClick }) {
 function OverflowMenu() {
   const { getTabs, value, select, orientation } = useTabsContext();
   const horizontal = orientation === "horizontal";
-  const [open, setOpen] = React24.useState(false);
-  const wrapRef = React24.useRef(null);
-  const timer = React24.useRef(null);
+  const [open, setOpen] = React26.useState(false);
+  const wrapRef = React26.useRef(null);
+  const timer = React26.useRef(null);
   const openNow = () => {
     if (timer.current) clearTimeout(timer.current);
     setOpen(true);
@@ -1170,7 +1246,7 @@ function OverflowMenu() {
   const closeSoon = () => {
     timer.current = setTimeout(() => setOpen(false), 160);
   };
-  React24.useLayoutEffect(() => {
+  React26.useLayoutEffect(() => {
     if (!open) return;
     const onDoc = (e) => {
       if (wrapRef.current && !wrapRef.current.contains(e.target)) setOpen(false);
@@ -1251,7 +1327,7 @@ function TabsTrigger({ value, icon, badge, closeable, onClose, disabled, classNa
   const isActive = active === value;
   const horizontal = orientation === "horizontal";
   const sz = SIZE[size];
-  React24.useLayoutEffect(() => {
+  React26.useLayoutEffect(() => {
     registerTab(value, { label: children, icon, disabled });
     return () => unregisterTab(value);
   }, [value, children, icon, disabled, registerTab, unregisterTab]);
@@ -1449,7 +1525,7 @@ function Tree({
     item.key
   )) });
 }
-var AccordionCtx = React24.createContext({ variant: "separated" });
+var AccordionCtx = React26.createContext({ variant: "separated" });
 function Accordion2({
   children,
   type = "single",
@@ -1495,7 +1571,7 @@ function Accordion2({
     }
   );
 }
-var Chevron2 = /* @__PURE__ */ jsxRuntime.jsx(
+var Chevron3 = /* @__PURE__ */ jsxRuntime.jsx(
   "svg",
   {
     viewBox: "0 0 24 24",
@@ -1508,7 +1584,7 @@ var Chevron2 = /* @__PURE__ */ jsxRuntime.jsx(
   }
 );
 function AccordionItem({ value, title, icon, children, disabled, className = "" }) {
-  const { variant } = React24.useContext(AccordionCtx);
+  const { variant } = React26.useContext(AccordionCtx);
   return /* @__PURE__ */ jsxRuntime.jsxs(
     AccordionPrimitive__namespace.Item,
     {
@@ -1527,7 +1603,7 @@ function AccordionItem({ value, title, icon, children, disabled, className = ""
             children: [
               icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex h-5 w-5 flex-shrink-0 items-center justify-center text-foreground-muted group-data-[state=open]/acc:text-accent", children: icon }),
               /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 min-w-0", children: title }),
-              Chevron2
+              Chevron3
             ]
           }
         ) }),
@@ -1567,7 +1643,7 @@ function Breadcrumbs({
   className = "",
   style
 }) {
-  const [expanded, setExpanded] = React24.useState(false);
+  const [expanded, setExpanded] = React26.useState(false);
   const shouldCollapse = maxItems > 0 && items.length > maxItems && !expanded;
   const visible = [];
   if (shouldCollapse) {
@@ -1697,6 +1773,156 @@ function Badge({
     !hidden && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -top-1 -right-1 flex", children: indicator })
   ] });
 }
+var SIZES = {
+  sm: { box: "h-7 w-7 text-xs", center: 14, title: "text-xs", desc: "text-[11px]" },
+  md: { box: "h-9 w-9 text-sm", center: 18, title: "text-sm", desc: "text-xs" }
+};
+var Check = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 3, "aria-hidden": "true", className: "h-1/2 w-1/2 animate-check-pop", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M20 6L9 17l-5-5" }) });
+var Cross = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 3, "aria-hidden": "true", className: "h-1/2 w-1/2", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M18 6 6 18M6 6l12 12" }) });
+var Spinner = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", className: "h-1/2 w-1/2 animate-spin", children: /* @__PURE__ */ jsxRuntime.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.755 10.059a7.5 7.5 0 0112.548-3.364l1.903 1.903h-3.183a.75.75 0 100 1.5h4.992a.75.75 0 00.75-.75V4.356a.75.75 0 00-1.5 0v3.18l-1.9-1.9A9 9 0 003.306 9.67a.75.75 0 101.45.388zm15.408 3.352a.75.75 0 00-.919.53 7.5 7.5 0 01-12.548 3.364l-1.902-1.903h3.183a.75.75 0 000-1.5H2.984a.75.75 0 00-.75.75v4.992a.75.75 0 001.5 0v-3.18l1.9 1.9a9 9 0 0015.059-4.035.75.75 0 00-.53-.918z" }) });
+function Indicator({ state, index, step, sizeKey }) {
+  const reduced = framerMotion.useReducedMotion();
+  const s = SIZES[sizeKey];
+  const base = `relative z-10 flex flex-shrink-0 items-center justify-center rounded-full font-semibold transition-colors ${s.box}`;
+  const tone = {
+    completed: "bg-accent text-accent-fg",
+    active: "border-2 border-accent bg-surface text-accent",
+    loading: "border-2 border-accent bg-surface text-accent",
+    error: "bg-status-error text-white",
+    pending: "border border-border bg-surface text-foreground-muted"
+  };
+  const content = step.icon ?? (state === "completed" ? /* @__PURE__ */ jsxRuntime.jsx(Check, {}) : state === "error" ? /* @__PURE__ */ jsxRuntime.jsx(Cross, {}) : state === "loading" ? /* @__PURE__ */ jsxRuntime.jsx(Spinner, {}) : index + 1);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    framerMotion.motion.span,
+    {
+      className: `${base} ${tone[state]}`,
+      initial: false,
+      animate: reduced ? void 0 : { scale: state === "active" || state === "loading" ? 1.06 : 1 },
+      transition: { type: "spring", stiffness: 320, damping: 24 },
+      "aria-current": state === "active" || state === "loading" ? "step" : void 0,
+      children: content
+    }
+  );
+}
+function VConnector({ filled, reduced }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative my-1 w-0.5 flex-1 bg-border", children: /* @__PURE__ */ jsxRuntime.jsx(
+    framerMotion.motion.span,
+    {
+      className: "absolute inset-0 bg-accent",
+      style: { originY: 0 },
+      initial: false,
+      animate: { scaleY: filled ? 1 : 0 },
+      transition: reduced ? { duration: 0 } : { duration: 0.35, ease: [0.16, 1, 0.3, 1] }
+    }
+  ) });
+}
+function Stepper({
+  steps,
+  current,
+  status = "active",
+  orientation = "horizontal",
+  responsive = true,
+  onStepClick,
+  size = "md",
+  className = ""
+}) {
+  const reduced = framerMotion.useReducedMotion();
+  const [forcedVertical, setForcedVertical] = React26.useState(false);
+  React26.useEffect(() => {
+    if (!responsive || orientation === "vertical") return;
+    if (typeof window === "undefined" || typeof window.matchMedia !== "function") return;
+    const mq = window.matchMedia("(max-width: 767px)");
+    const apply = (e) => setForcedVertical(e.matches);
+    apply(mq);
+    const handler = (e) => apply(e);
+    mq.addEventListener("change", handler);
+    return () => mq.removeEventListener("change", handler);
+  }, [responsive, orientation]);
+  const vertical = orientation === "vertical" || forcedVertical;
+  const s = SIZES[size];
+  const stateOf = (i) => i < current ? "completed" : i === current ? status : "pending";
+  const Label = ({ step, state, align }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: align === "center" ? "mt-2 text-center" : "pt-0.5", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: `font-medium leading-tight ${s.title} ${state === "pending" ? "text-foreground-muted" : "text-foreground"}`, children: step.title }),
+    step.description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: `mt-0.5 leading-snug text-foreground-muted ${s.desc}`, children: step.description })
+  ] });
+  const clickable = (i) => Boolean(onStepClick) && i <= current;
+  const stepButton = (i, node) => clickable(i) ? /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => onStepClick?.(i), className: "rounded-md text-left focus:outline-none focus-visible:ring-2 focus-visible:ring-accent", children: node }) : node;
+  if (vertical) {
+    return /* @__PURE__ */ jsxRuntime.jsx("ol", { className: ["flex flex-col", className].filter(Boolean).join(" "), children: steps.map((step, i) => {
+      const state = stateOf(i);
+      const last = i === steps.length - 1;
+      return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center self-stretch", children: [
+          stepButton(i, /* @__PURE__ */ jsxRuntime.jsx(Indicator, { state, index: i, step, sizeKey: size })),
+          !last && /* @__PURE__ */ jsxRuntime.jsx(VConnector, { filled: i < current, reduced })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: last ? "" : "pb-6", children: stepButton(i, /* @__PURE__ */ jsxRuntime.jsx(Label, { step, state, align: "left" })) })
+      ] }, step.key);
+    }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("ol", { className: ["flex items-start", className].filter(Boolean).join(" "), children: steps.map((step, i) => {
+    const state = stateOf(i);
+    return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "relative flex flex-1 flex-col items-center last:flex-none", children: [
+      i > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-1/2 h-0.5 w-full bg-border", style: { top: s.center - 1 }, children: /* @__PURE__ */ jsxRuntime.jsx(
+        framerMotion.motion.span,
+        {
+          className: "absolute inset-0 bg-accent",
+          style: { originX: 0 },
+          initial: false,
+          animate: { scaleX: i <= current ? 1 : 0 },
+          transition: reduced ? { duration: 0 } : { duration: 0.35, ease: [0.16, 1, 0.3, 1] }
+        }
+      ) }),
+      stepButton(i, /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Indicator, { state, index: i, step, sizeKey: size }),
+        /* @__PURE__ */ jsxRuntime.jsx(Label, { step, state, align: "center" })
+      ] }))
+    ] }, step.key);
+  }) });
+}
+var Check2 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 3, "aria-hidden": "true", className: "h-3 w-3", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M20 6L9 17l-5-5" }) });
+var Cross2 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 3, "aria-hidden": "true", className: "h-3 w-3", children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M18 6 6 18M6 6l12 12" }) });
+var NODE = {
+  complete: "bg-accent text-accent-fg border-accent",
+  current: "bg-surface text-accent border-accent",
+  upcoming: "bg-surface text-transparent border-border",
+  error: "bg-status-error text-white border-status-error"
+};
+function Timeline({ events, current, className = "" }) {
+  const statusOf = (e, i) => {
+    if (e.status) return e.status;
+    if (current == null) return "upcoming";
+    return i < current ? "complete" : i === current ? "current" : "upcoming";
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx("ol", { className: ["flex flex-col", className].filter(Boolean).join(" "), children: events.map((event, i) => {
+    const status = statusOf(event, i);
+    const last = i === events.length - 1;
+    const railFilled = status === "complete";
+    return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex gap-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center self-stretch", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "span",
+          {
+            className: [
+              "relative z-10 flex h-6 w-6 flex-shrink-0 items-center justify-center rounded-full border-2 transition-colors",
+              NODE[status]
+            ].join(" "),
+            children: [
+              status === "current" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inset-0 animate-breathe rounded-full ring-2 ring-accent/40", "aria-hidden": "true" }),
+              event.icon ?? (status === "complete" ? /* @__PURE__ */ jsxRuntime.jsx(Check2, {}) : status === "error" ? /* @__PURE__ */ jsxRuntime.jsx(Cross2, {}) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: `h-2 w-2 rounded-full ${status === "current" ? "bg-accent" : "bg-border"}` }))
+            ]
+          }
+        ),
+        !last && /* @__PURE__ */ jsxRuntime.jsx("span", { className: `my-1 w-0.5 flex-1 ${railFilled ? "bg-accent" : "bg-border"}` })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: last ? "pb-0" : "pb-6", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `text-sm font-medium leading-tight ${status === "upcoming" ? "text-foreground-muted" : "text-foreground"}`, children: event.title }),
+        event.description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-0.5 text-xs leading-snug text-foreground-secondary", children: event.description }),
+        event.timestamp && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-[11px] uppercase tracking-wide text-foreground-muted", children: event.timestamp })
+      ] })
+    ] }, event.key);
+  }) });
+}
 var SIZE3 = {
   sm: "h-5 min-w-[20px] px-1.5 text-[11px]",
   md: "h-6 min-w-[24px] px-2 text-xs"
@@ -1711,7 +1937,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(React24__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(React26__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}`)) });
@@ -1802,13 +2028,13 @@ function FlatCarousel({
   className = "",
   style
 }) {
-  const scrollerRef = React24.useRef(null);
-  const slides = React24__default.default.Children.toArray(children);
-  const [active, setActive] = React24.useState(0);
-  const [atStart, setAtStart] = React24.useState(true);
-  const [atEnd, setAtEnd] = React24.useState(false);
+  const scrollerRef = React26.useRef(null);
+  const slides = React26__default.default.Children.toArray(children);
+  const [active, setActive] = React26.useState(0);
+  const [atStart, setAtStart] = React26.useState(true);
+  const [atEnd, setAtEnd] = React26.useState(false);
   const width = typeof itemWidth === "number" ? `${itemWidth}px` : itemWidth;
-  const update = React24.useCallback(() => {
+  const update = React26.useCallback(() => {
     const el = scrollerRef.current;
     if (!el) return;
     setAtStart(el.scrollLeft <= 1);
@@ -1817,7 +2043,7 @@ function FlatCarousel({
     const slideW = first ? first.getBoundingClientRect().width + gap : el.clientWidth;
     setActive(Math.round(el.scrollLeft / slideW));
   }, [gap]);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     update();
     const el = scrollerRef.current;
     if (!el) return;
@@ -1858,9 +2084,9 @@ function RotatingCarousel({
   className = "",
   style
 }) {
-  const slides = React24__default.default.Children.toArray(children);
+  const slides = React26__default.default.Children.toArray(children);
   const count = slides.length;
-  const [active, setActive] = React24.useState(0);
+  const [active, setActive] = React26.useState(0);
   const reduced = framerMotion.useReducedMotion();
   const wrap = (n) => count > 0 ? (n % count + count) % count : 0;
   const idx = wrap(active);
@@ -2010,7 +2236,7 @@ function FAB({
   className = "",
   style
 }) {
-  const [open, setOpen] = React24.useState(false);
+  const [open, setOpen] = React26.useState(false);
   const reduced = framerMotion.useReducedMotion();
   const hasDial = !!actions && actions.length > 0;
   const bottom = position.startsWith("bottom");
@@ -2112,8 +2338,8 @@ function PopConfirm({
   onOpenChange,
   className = ""
 }) {
-  const [uncontrolledOpen, setUncontrolledOpen] = React24.useState(false);
-  const [loading, setLoading] = React24.useState(false);
+  const [uncontrolledOpen, setUncontrolledOpen] = React26.useState(false);
+  const [loading, setLoading] = React26.useState(false);
   const isOpen = open ?? uncontrolledOpen;
   const setOpen = (next) => {
     onOpenChange?.(next);
@@ -2209,16 +2435,16 @@ function Calendar2({
   className = "",
   style
 }) {
-  const today = React24.useMemo(() => startOfDay(/* @__PURE__ */ new Date()), []);
-  const [internalMonth, setInternalMonth] = React24.useState(() => month ?? defaultMonth ?? value ?? today);
+  const today = React26.useMemo(() => startOfDay(/* @__PURE__ */ new Date()), []);
+  const [internalMonth, setInternalMonth] = React26.useState(() => month ?? defaultMonth ?? value ?? today);
   const visible = month ?? internalMonth;
   const setMonth = (next) => {
     onMonthChange?.(next);
     if (month === void 0) setInternalMonth(next);
   };
-  const grid = React24.useMemo(() => buildGrid(visible, weekStartsOn), [visible, weekStartsOn]);
-  const weekdays = React24.useMemo(() => Array.from({ length: 7 }, (_, i) => WEEKDAYS[(i + weekStartsOn) % 7]), [weekStartsOn]);
-  const eventsByDay = React24.useMemo(() => {
+  const grid = React26.useMemo(() => buildGrid(visible, weekStartsOn), [visible, weekStartsOn]);
+  const weekdays = React26.useMemo(() => Array.from({ length: 7 }, (_, i) => WEEKDAYS[(i + weekStartsOn) % 7]), [weekStartsOn]);
+  const eventsByDay = React26.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     for (const ev of events ?? []) {
       const key = startOfDay(ev.date).toDateString();
@@ -2351,7 +2577,7 @@ function EmptyCart({
   );
 }
 var defaultFormat = (v) => `${v < 0 ? "-" : ""}$${Math.abs(v).toFixed(2)}`;
-var Stepper = ({
+var Stepper2 = ({
   quantity,
   max,
   onChange
@@ -2384,7 +2610,7 @@ function Cart({
         /* @__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)) }),
+          /* @__PURE__ */ jsxRuntime.jsx(Stepper2, { quantity: it.quantity, max: it.max, onChange: (q) => onQuantityChange?.(it.id, Math.max(1, q)) }),
           onRemove && /* @__PURE__ */ jsxRuntime.jsx(
             "button",
             {
@@ -2425,17 +2651,17 @@ function Cart({
     ] })
   ] });
 }
-var CartContext = React24.createContext(null);
+var CartContext = React26.createContext(null);
 var clampQty = (qty, max) => {
   const lower = Math.max(1, Math.round(qty));
   return max != null ? Math.min(lower, max) : lower;
 };
 function CartProvider({ children, initialItems = [], onChange }) {
-  const [items, setItems] = React24.useState(initialItems);
-  React24.useEffect(() => {
+  const [items, setItems] = React26.useState(initialItems);
+  React26.useEffect(() => {
     onChange?.(items);
   }, [items]);
-  const addToCart = React24.useCallback((item, quantity) => {
+  const addToCart = React26.useCallback((item, quantity) => {
     const addQty = quantity ?? item.quantity ?? 1;
     setItems((prev) => {
       const existing = prev.find((it) => it.id === item.id);
@@ -2448,29 +2674,29 @@ function CartProvider({ children, initialItems = [], onChange }) {
       return [...prev, { ...rest, quantity: clampQty(addQty, item.max) }];
     });
   }, []);
-  const removeFromCart = React24.useCallback((id) => {
+  const removeFromCart = React26.useCallback((id) => {
     setItems((prev) => prev.filter((it) => it.id !== id));
   }, []);
-  const updateQuantity = React24.useCallback((id, quantity) => {
+  const updateQuantity = React26.useCallback((id, quantity) => {
     setItems(
       (prev) => prev.map((it) => it.id === id ? { ...it, quantity: clampQty(quantity, it.max) } : it)
     );
   }, []);
-  const clearCart = React24.useCallback(() => setItems([]), []);
-  const isInCart = React24.useCallback((id) => items.some((it) => it.id === id), [items]);
-  const getItemCount = React24.useCallback(() => items.reduce((sum, it) => sum + it.quantity, 0), [items]);
-  const getCartTotal = React24.useCallback(
+  const clearCart = React26.useCallback(() => setItems([]), []);
+  const isInCart = React26.useCallback((id) => items.some((it) => it.id === id), [items]);
+  const getItemCount = React26.useCallback(() => items.reduce((sum, it) => sum + it.quantity, 0), [items]);
+  const getCartTotal = React26.useCallback(
     () => items.reduce((sum, it) => sum + it.price * it.quantity, 0),
     [items]
   );
-  const value = React24.useMemo(
+  const value = React26.useMemo(
     () => ({ items, addToCart, removeFromCart, updateQuantity, clearCart, isInCart, getItemCount, getCartTotal }),
     [items, addToCart, removeFromCart, updateQuantity, clearCart, isInCart, getItemCount, getCartTotal]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(CartContext.Provider, { value, children });
 }
 function useCart() {
-  const ctx = React24.useContext(CartContext);
+  const ctx = React26.useContext(CartContext);
   if (!ctx) {
     throw new Error("useCart must be used within a <CartProvider>.");
   }
@@ -2804,11 +3030,11 @@ function buildBindings(store, name, kind, snap) {
 
 // src/form/useForm.ts
 function useForm(options = {}) {
-  const ref = React24.useRef(null);
+  const ref = React26.useRef(null);
   if (ref.current === null) ref.current = new FormStore(options);
   const store = ref.current;
-  React24.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
-  const make = React24.useCallback(
+  React26.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
+  const make = React26.useCallback(
     (kind) => (name, rules) => {
       if (rules !== void 0) store.setRule(name, rules);
       return buildBindings(store, name, kind, store.getFieldSnapshot(name));
@@ -2837,9 +3063,9 @@ function useForm(options = {}) {
     fieldTarget: make("target")
   };
 }
-var FormContext = React24.createContext(null);
+var FormContext = React26.createContext(null);
 function useFormStore() {
-  const store = React24.useContext(FormContext);
+  const store = React26.useContext(FormContext);
   if (!store) {
     throw new Error("useFormStore must be used within a <Form>. Did you forget to wrap your fields?");
   }
@@ -2853,8 +3079,8 @@ function Form({
   children,
   ...rest
 }) {
-  const ref = React24.useRef(null);
-  const bypass = React24.useRef(false);
+  const ref = React26.useRef(null);
+  const bypass = React26.useRef(false);
   const handleSubmit = async (e) => {
     if (bypass.current) {
       bypass.current = false;
@@ -2906,12 +3132,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);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     return () => {
       if (rules !== void 0) store.removeRule(name);
     };
   }, [store, name]);
-  const snap = React24.useSyncExternalStore(
+  const snap = React26.useSyncExternalStore(
     store.subscribe,
     () => store.getFieldSnapshot(name)
   );
@@ -2923,7 +3149,7 @@ function FormField({ name, kind, rules, children }) {
 }
 function useFieldArray(name) {
   const store = useFormStore();
-  React24.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
+  React26.useSyncExternalStore(store.subscribe, store.getRootSnapshot, store.getRootSnapshot);
   const arr = store.getValue(name) ?? [];
   const keys = store.getKeys(name);
   return {
@@ -3084,7 +3310,7 @@ function TextInput({
   suffix,
   id
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
   const hasAdornment = prefix != null || suffix != null;
   const inputId = htmlFor ?? id;
@@ -3245,7 +3471,7 @@ function CreditCardForm({
   className = "",
   style
 }) {
-  const initial = React24.useRef({
+  const initial = React26.useRef({
     number: formatCardNumber(defaultValue?.number ?? ""),
     name: defaultValue?.name ?? "",
     expiry: formatExpiry(defaultValue?.expiry ?? ""),
@@ -3254,7 +3480,7 @@ function CreditCardForm({
   const form = useForm({ initialValues: initial });
   const numberStr = String(form.values.number ?? "");
   const brand = detectBrand(numberStr);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     onChange?.(toCard(form.values));
   }, [form.values.number, form.values.name, form.values.expiry, form.values.cvv]);
   const numberBind = form.fieldNative("number", {
@@ -3377,7 +3603,7 @@ function Checkout({
     ] })
   ] });
 }
-var NotificationContext = React24.createContext({
+var NotificationContext = React26.createContext({
   open: () => void 0,
   close: () => void 0
 });
@@ -3435,26 +3661,26 @@ function NotificationItem({
   onClose,
   reduced
 }) {
-  const [paused, setPaused] = React24.useState(false);
+  const [paused, setPaused] = React26.useState(false);
   const duration = n.duration ?? 4e3;
   const isAutoDismissing = isFinite(duration) && duration > 0;
   const showProgress = !reduced && isAutoDismissing;
-  const timerRef = React24.useRef(null);
-  const startTimeRef = React24.useRef(0);
-  const remainingRef = React24.useRef(duration);
-  const clearTimer = React24.useCallback(() => {
+  const timerRef = React26.useRef(null);
+  const startTimeRef = React26.useRef(0);
+  const remainingRef = React26.useRef(duration);
+  const clearTimer = React26.useCallback(() => {
     if (timerRef.current !== null) {
       clearTimeout(timerRef.current);
       timerRef.current = null;
     }
   }, []);
-  const scheduleDismiss = React24.useCallback((ms) => {
+  const scheduleDismiss = React26.useCallback((ms) => {
     clearTimer();
     if (!isAutoDismissing) return;
     startTimeRef.current = Date.now();
     timerRef.current = setTimeout(() => onClose(n.id), ms);
   }, [clearTimer, isAutoDismissing, n.id, onClose]);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (paused || !isAutoDismissing) return;
     scheduleDismiss(remainingRef.current);
     return clearTimer;
@@ -3537,15 +3763,15 @@ function NotificationProvider({
   children,
   position = "top-right"
 }) {
-  const [notifications, setNotifications] = React24.useState([]);
+  const [notifications, setNotifications] = React26.useState([]);
   const reduced = framerMotion.useReducedMotion();
-  const open = React24.useCallback((payload) => {
+  const open = React26.useCallback((payload) => {
     setNotifications((prev) => [
       ...prev,
       { duration: 4e3, ...payload, id: Date.now() + Math.random() }
     ]);
   }, []);
-  const close = React24.useCallback((id) => {
+  const close = React26.useCallback((id) => {
     setNotifications((prev) => prev.filter((n) => n.id !== id));
   }, []);
   return /* @__PURE__ */ jsxRuntime.jsxs(NotificationContext.Provider, { value: { open, close }, children: [
@@ -3574,7 +3800,7 @@ function NotificationProvider({
   ] });
 }
 function useNotification() {
-  const { open } = React24.useContext(NotificationContext);
+  const { open } = React26.useContext(NotificationContext);
   return {
     info: (props) => open({ type: "info", ...props }),
     success: (props) => open({ type: "success", ...props }),
@@ -3691,10 +3917,10 @@ function FadingBase({
   isMounted = false,
   children
 }) {
-  const [shouldRender, setShouldRender] = React24.useState(isMounted);
-  const [visible, setVisible] = React24.useState(false);
-  const timerRef = React24.useRef(null);
-  React24.useEffect(() => {
+  const [shouldRender, setShouldRender] = React26.useState(isMounted);
+  const [visible, setVisible] = React26.useState(false);
+  const timerRef = React26.useRef(null);
+  React26.useEffect(() => {
     if (isMounted) {
       setShouldRender(true);
       const rafId = requestAnimationFrame(() => setVisible(true));
@@ -3792,8 +4018,8 @@ function ScalableContainer({
   togglePosition = "top-right",
   className = ""
 }) {
-  const containerRef = React24.useRef(null);
-  const [internalScaled, setInternalScaled] = React24.useState(false);
+  const containerRef = React26.useRef(null);
+  const [internalScaled, setInternalScaled] = React26.useState(false);
   const isScaled = expanded ?? internalScaled;
   const reduced = framerMotion.useReducedMotion();
   const onToggle = () => {
@@ -3931,17 +4157,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] = React24.useState(0);
-  const [indexPool, setIndexPool] = React24.useState([]);
-  const cardRefs = React24.useRef([]);
-  const getIndexes = React24.useMemo(() => {
+  const [activeIndex, setActiveIndex] = React26.useState(0);
+  const [indexPool, setIndexPool] = React26.useState([]);
+  const cardRefs = React26.useRef([]);
+  const getIndexes = React26.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]);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     const { nextIndex, previousIndex } = getIndexes;
     let indexes = [previousIndex, activeIndex, nextIndex];
     if (activeIndex !== 0 && activeIndex !== items.length - 1) {
@@ -4114,8 +4340,8 @@ function writeDismissed(key) {
   }
 }
 function useTargetBbox(ref) {
-  const [bbox, setBbox] = React24.useState(null);
-  React24.useLayoutEffect(() => {
+  const [bbox, setBbox] = React26.useState(null);
+  React26.useLayoutEffect(() => {
     const el = ref?.current;
     if (!el) {
       setBbox(null);
@@ -4145,7 +4371,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) {
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (!active) return;
     const el = containerRef.current;
     if (!el) return;
@@ -4184,16 +4410,16 @@ function Wizard({
   onComplete,
   onSkip
 }) {
-  const tooltipRef = React24.useRef(null);
-  const tooltipTitleId = React24.useId();
-  const tooltipBodyId = React24.useId();
+  const tooltipRef = React26.useRef(null);
+  const tooltipTitleId = React26.useId();
+  const tooltipBodyId = React26.useId();
   const reduced = framerMotion.useReducedMotion();
-  const [open, setOpen] = React24.useState(() => steps.length > 0 && !readDismissed(storageKey));
-  const [activeIndex, setActiveIndex] = React24.useState(0);
+  const [open, setOpen] = React26.useState(() => steps.length > 0 && !readDismissed(storageKey));
+  const [activeIndex, setActiveIndex] = React26.useState(0);
   const step = steps[activeIndex];
   const bbox = useTargetBbox(step?.stepRef);
   useFocusTrap(tooltipRef, open);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (!open || !dismissible) return;
     const onKey = (e) => {
       if (e.key === "Escape") {
@@ -4204,12 +4430,12 @@ function Wizard({
     document.addEventListener("keydown", onKey);
     return () => document.removeEventListener("keydown", onKey);
   }, [open, dismissible]);
-  const handleSkip = React24.useCallback(() => {
+  const handleSkip = React26.useCallback(() => {
     writeDismissed(storageKey);
     setOpen(false);
     onSkip?.();
   }, [storageKey, onSkip]);
-  const handleComplete = React24.useCallback(() => {
+  const handleComplete = React26.useCallback(() => {
     writeDismissed(storageKey);
     setOpen(false);
     onComplete?.();
@@ -4352,7 +4578,7 @@ function Wizard({
   ] });
 }
 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 = React24__default.default.forwardRef(function SearchInput2({ value, onChange, disabled, label, htmlFor, placeholder, name, inputStyle, style, layout = "vertical", size = "md", icon, helperText, className }, ref) {
+var SearchInput = React26__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",
     {
@@ -4406,11 +4632,11 @@ function MultiTagRow({
   labelFor,
   onRemove
 }) {
-  const wrapRef = React24.useRef(null);
-  const measureRef = React24.useRef(null);
-  const [visibleCount, setVisibleCount] = React24.useState(values.length);
+  const wrapRef = React26.useRef(null);
+  const measureRef = React26.useRef(null);
+  const [visibleCount, setVisibleCount] = React26.useState(values.length);
   const key = values.map(String).join("|");
-  React24.useLayoutEffect(() => {
+  React26.useLayoutEffect(() => {
     const wrap = wrapRef.current;
     const measure = measureRef.current;
     if (!wrap || !measure) return;
@@ -4504,16 +4730,16 @@ function Dropdown({
   size = "md",
   className = ""
 }) {
-  const [open, setOpen] = React24.useState(false);
-  const [selectedItems, setSelectedItems] = React24.useState([]);
-  const [searchTerm, setSearchTerm] = React24.useState("");
-  const [innerItems, setInnerItems] = React24.useState([]);
-  const errorId = React24.useId();
+  const [open, setOpen] = React26.useState(false);
+  const [selectedItems, setSelectedItems] = React26.useState([]);
+  const [searchTerm, setSearchTerm] = React26.useState("");
+  const [innerItems, setInnerItems] = React26.useState([]);
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     setInnerItems(items);
   }, [items]);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (isMultiselect && Array.isArray(value)) {
       setSelectedItems(value);
     }
@@ -4838,7 +5064,7 @@ function TableBody({
   expandRow,
   getRowKey
 }) {
-  const [expanded, setExpanded] = React24.useState(() => /* @__PURE__ */ new Set());
+  const [expanded, setExpanded] = React26.useState(() => /* @__PURE__ */ new Set());
   const reduced = framerMotion.useReducedMotion();
   const toggleRow = (rowKey) => {
     setExpanded((prev) => {
@@ -4853,7 +5079,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(React24__default.default.Fragment, { children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs(React26__default.default.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsxs(
         "tr",
         {
@@ -4909,9 +5135,9 @@ function Pagination({
   const matchedOption = picker.find(
     (o) => o.label === options.perPage || o.value === options.perPage
   );
-  const [perPageKey, setPerPageKey] = React24.useState(() => matchedOption?.key ?? picker[0]?.key);
+  const [perPageKey, setPerPageKey] = React26.useState(() => matchedOption?.key ?? picker[0]?.key);
   const displayPerPageKey = serverSide ? matchedOption?.key ?? perPageKey : perPageKey;
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (serverSide && options.perPage != null) {
       const next = picker.find((o) => o.label === options.perPage || o.value === options.perPage);
       if (next) setPerPageKey(next.key);
@@ -4975,14 +5201,14 @@ function Table({
   className = "",
   style
 }) {
-  const searchRef = React24.useRef(null);
-  const [searchTerm, setSearchTerm] = React24.useState("");
-  const [perPage, setPerPage] = React24.useState(
+  const searchRef = React26.useRef(null);
+  const [searchTerm, setSearchTerm] = React26.useState("");
+  const [perPage, setPerPage] = React26.useState(
     typeof pagination.perPage === "number" ? pagination.perPage : 15
   );
-  const [activePage, setActivePage] = React24.useState(0);
+  const [activePage, setActivePage] = React26.useState(0);
   const isServerSide = !!(pagination.enabled && pagination.serverSide);
-  const filteredRows = React24.useMemo(() => {
+  const filteredRows = React26.useMemo(() => {
     if (isServerSide || !searchTerm) return rows;
     const term = searchTerm.toLowerCase();
     return rows.filter(
@@ -4991,29 +5217,29 @@ function Table({
       )
     );
   }, [rows, searchTerm, isServerSide]);
-  const datasets = React24.useMemo(() => {
+  const datasets = React26.useMemo(() => {
     if (isServerSide) return [rows];
     return createDatasets(filteredRows, pagination.enabled ? perPage : null);
   }, [filteredRows, perPage, pagination.enabled, isServerSide, rows]);
-  const MAX_PAGE = React24.useMemo(() => {
+  const MAX_PAGE = React26.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 = React24.useMemo(() => {
+  const currentPageRows = React26.useMemo(() => {
     if (isServerSide) return rows;
     return datasets[activePage] ?? [];
   }, [isServerSide, rows, datasets, activePage]);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (pagination.enabled && !isServerSide && typeof pagination.perPage === "number") {
       setPerPage(pagination.perPage);
     }
   }, [pagination.enabled, pagination.perPage, isServerSide]);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (isServerSide && typeof pagination.perPage === "number") setPerPage(pagination.perPage);
   }, [isServerSide, pagination.perPage]);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (isServerSide && typeof pagination.page === "number" && pagination.page >= 1)
       setActivePage(pagination.page - 1);
   }, [isServerSide, pagination.page]);
@@ -5097,7 +5323,7 @@ function TableSkeletonBody({
   )) });
 }
 function ThemeSwitch({ checked, onChange, label = "Toggle dark mode", className = "" }) {
-  const id = React24.useId();
+  const id = React26.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,
     {
@@ -5281,7 +5507,7 @@ function Sidebar({
     }
   ) });
 }
-var MegaMenuContext = React24.createContext({ align: "start" });
+var MegaMenuContext = React26.createContext({ align: "start" });
 function MegaMenu({
   children,
   align = "start",
@@ -5312,7 +5538,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 } = React24.useContext(MegaMenuContext);
+  const { align } = React26.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: [
@@ -5397,8 +5623,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) => React24__default.default.Children.toArray(children).filter(
-  (c) => React24__default.default.isValidElement(c) && c.type === type
+var elementsOfType = (children, type) => React26__default.default.Children.toArray(children).filter(
+  (c) => React26__default.default.isValidElement(c) && c.type === type
 );
 var MOBILE_CHEVRON = /* @__PURE__ */ jsxRuntime.jsx(
   "svg",
@@ -5435,9 +5661,9 @@ function MobileLinkRow({ link, onNavigate }) {
   );
 }
 function MobilePanel({ panel, onNavigate }) {
-  const nodes = React24__default.default.Children.toArray(panel.props.children);
+  const nodes = React26__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 (!React24__default.default.isValidElement(node)) return null;
+    if (!React26__default.default.isValidElement(node)) return null;
     const el = node;
     if (el.type === MegaMenuSection) {
       const { title, children } = el.props;
@@ -5456,8 +5682,8 @@ function MegaMenuMobile({
   children,
   label
 }) {
-  const [open, setOpen] = React24.useState(false);
-  const [expanded, setExpanded] = React24.useState(null);
+  const [open, setOpen] = React26.useState(false);
+  const [expanded, setExpanded] = React26.useState(null);
   const items = elementsOfType(children, MegaMenuItem);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "md:hidden w-full", children: [
     /* @__PURE__ */ jsxRuntime.jsxs(
@@ -5530,17 +5756,17 @@ function AppShell({
   children,
   className = ""
 }) {
-  const [expanded, setExpanded] = React24.useState(sidebarDefaultExpanded);
-  const [isMobile, setIsMobile] = React24.useState(false);
-  const [mobileOpen, setMobileOpen] = React24.useState(false);
-  React24.useEffect(() => {
+  const [expanded, setExpanded] = React26.useState(sidebarDefaultExpanded);
+  const [isMobile, setIsMobile] = React26.useState(false);
+  const [mobileOpen, setMobileOpen] = React26.useState(false);
+  React26.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);
   }, []);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (!isMobile) setMobileOpen(false);
   }, [isMobile]);
   const hasSidebar = sidebarSections.length > 0;
@@ -5627,6 +5853,101 @@ function AppShell({
     ] })
   ] });
 }
+function parseJwt(token) {
+  try {
+    const part = token.split(".")[1];
+    if (!part || typeof atob === "undefined") return null;
+    const json = decodeURIComponent(
+      atob(part.replace(/-/g, "+").replace(/_/g, "/")).split("").map((c) => "%" + ("00" + c.charCodeAt(0).toString(16)).slice(-2)).join("")
+    );
+    return JSON.parse(json);
+  } catch {
+    return null;
+  }
+}
+function tokenValid(token) {
+  const payload = parseJwt(token);
+  if (!payload) return false;
+  const exp = typeof payload.exp === "number" ? payload.exp : null;
+  if (exp == null) return true;
+  return exp * 1e3 > Date.now();
+}
+var has = (have, need, all) => all ? need.every((n) => have?.includes(n)) : need.some((n) => have?.includes(n));
+var Spinner2 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", className: "h-6 w-6 animate-spin text-accent", children: /* @__PURE__ */ jsxRuntime.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.755 10.059a7.5 7.5 0 0112.548-3.364l1.903 1.903h-3.183a.75.75 0 100 1.5h4.992a.75.75 0 00.75-.75V4.356a.75.75 0 00-1.5 0v3.18l-1.9-1.9A9 9 0 003.306 9.67a.75.75 0 101.45.388zm15.408 3.352a.75.75 0 00-.919.53 7.5 7.5 0 01-12.548 3.364l-1.902-1.903h3.183a.75.75 0 000-1.5H2.984a.75.75 0 00-.75.75v4.992a.75.75 0 001.5 0v-3.18l1.9 1.9a9 9 0 0015.059-4.035.75.75 0 00-.53-.918z" }) });
+function SecureLayout({
+  children,
+  isAuthenticated,
+  token,
+  roles,
+  requiredRoles,
+  requireAllRoles,
+  permissions,
+  requiredPermissions,
+  requireAllPermissions,
+  canAccess,
+  loadingFallback,
+  fallback,
+  onDeny,
+  className = ""
+}) {
+  const reduced = framerMotion.useReducedMotion();
+  const [state, setState] = React26.useState("checking");
+  const rolesKey = JSON.stringify(roles);
+  const requiredRolesKey = JSON.stringify(requiredRoles);
+  const permissionsKey = JSON.stringify(permissions);
+  const requiredPermissionsKey = JSON.stringify(requiredPermissions);
+  React26.useEffect(() => {
+    let cancelled = false;
+    setState("checking");
+    const evaluate = async () => {
+      let authed = isAuthenticated;
+      if (authed === void 0 && token !== void 0) authed = tokenValid(token);
+      if (authed === void 0) authed = true;
+      if (!authed) return false;
+      if (requiredRoles?.length && !has(roles, requiredRoles, requireAllRoles)) return false;
+      if (requiredPermissions?.length && !has(permissions, requiredPermissions, requireAllPermissions)) return false;
+      if (canAccess && !await canAccess()) return false;
+      return true;
+    };
+    evaluate().then((ok) => {
+      if (cancelled) return;
+      setState(ok ? "granted" : "denied");
+      if (!ok) onDeny?.();
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [
+    isAuthenticated,
+    token,
+    requireAllRoles,
+    requireAllPermissions,
+    canAccess,
+    rolesKey,
+    requiredRolesKey,
+    permissionsKey,
+    requiredPermissionsKey
+  ]);
+  if (state === "checking") {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: ["flex min-h-[8rem] items-center justify-center", className].filter(Boolean).join(" "), children: loadingFallback ?? /* @__PURE__ */ jsxRuntime.jsx(Spinner2, {}) });
+  }
+  if (state === "denied") {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: className || void 0, children: fallback ?? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-[8rem] flex-col items-center justify-center gap-1 rounded-xl border border-border bg-surface p-8 text-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-semibold text-foreground", children: "Access denied" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-foreground-muted", children: "You don\u2019t have permission to view this content." })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    framerMotion.motion.div,
+    {
+      className: className || void 0,
+      initial: reduced ? false : { opacity: 0 },
+      animate: { opacity: 1 },
+      transition: { duration: reduced ? 0 : 0.2, ease: "easeOut" },
+      children
+    }
+  );
+}
 function px(v) {
   return typeof v === "number" ? `${v}px` : v;
 }
@@ -5730,10 +6051,10 @@ function ThemeProvider({
   className = "",
   style
 }) {
-  const id = React24__default.default.useId().replace(/:/g, "");
+  const id = React26__default.default.useId().replace(/:/g, "");
   const scopeClass = `geo-th-${id}`;
-  const divRef = React24.useRef(null);
-  React24.useEffect(() => {
+  const divRef = React26.useRef(null);
+  React26.useEffect(() => {
     const el = divRef.current;
     if (!el) return;
     if (colorScheme === "auto") return;
@@ -5748,8 +6069,8 @@ function ThemeProvider({
     }
     el.classList.toggle("dark", colorScheme === "dark");
   }, [colorScheme]);
-  const lightVars = React24.useMemo(() => toCssVars(theme), [theme]);
-  const darkVarStr = React24.useMemo(() => {
+  const lightVars = React26.useMemo(() => toCssVars(theme), [theme]);
+  const darkVarStr = React26.useMemo(() => {
     if (!darkTheme) return "";
     const dvars = toCssVars(darkTheme);
     if (!Object.keys(dvars).length) return "";
@@ -5791,7 +6112,7 @@ function NumberInput({
   readOnly = false,
   precision
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
   const inferredPrecision = precision ?? (Number.isInteger(step) ? 0 : String(step).split(".")[1]?.length ?? 0);
   const round = (n) => {
@@ -5922,8 +6243,8 @@ function Password({
   showIcon,
   hideIcon
 }) {
-  const [visible, setVisible] = React24.useState(false);
-  const errorId = React24.useId();
+  const [visible, setVisible] = React26.useState(false);
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
   return /* @__PURE__ */ jsxRuntime.jsx(
     Field,
@@ -5996,7 +6317,7 @@ function Checkbox({
 }) {
   const isChecked = checked ?? value ?? false;
   const labelFirst = labelPosition === "left";
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
   const box = /* @__PURE__ */ jsxRuntime.jsx(
     CheckboxPrimitive__namespace.Root,
@@ -6104,8 +6425,8 @@ function RadioGroup({
   className,
   errorMessage
 }) {
-  const errorId = React24.useId();
-  const groupId = React24.useId();
+  const errorId = React26.useId();
+  const groupId = React26.useId();
   const hasError = errorMessage != null;
   const labelFirst = labelPosition === "left";
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -6205,11 +6526,11 @@ function Switch({
   disabled,
   errorMessage
 }) {
-  const id = React24.useId();
-  const errorId = React24.useId();
+  const id = React26.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
   const isControlled = checked !== void 0;
-  const [internal, setInternal] = React24.useState(defaultChecked);
+  const [internal, setInternal] = React26.useState(defaultChecked);
   const isOn = isControlled ? checked : internal;
   const handle = (c) => {
     if (!isControlled) setInternal(c);
@@ -6282,19 +6603,19 @@ function AutoComplete({
   required,
   htmlFor
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
-  const [term, setTerm] = React24.useState("");
-  const [open, setOpen] = React24.useState(false);
-  const [asyncItems, setAsyncItems] = React24.useState([]);
-  const [loading, setLoading] = React24.useState(false);
+  const [term, setTerm] = React26.useState("");
+  const [open, setOpen] = React26.useState(false);
+  const [asyncItems, setAsyncItems] = React26.useState([]);
+  const [loading, setLoading] = React26.useState(false);
   const isAsync = typeof onSearch === "function";
-  const debounceRef = React24.useRef(null);
-  const requestIdRef = React24.useRef(0);
+  const debounceRef = React26.useRef(null);
+  const requestIdRef = React26.useRef(0);
   const staticFiltered = isAsync || !items ? [] : term.trim() ? items.filter(
     ({ key, label: label2 }) => label2.toLowerCase().includes(term.toLowerCase()) || key.toLowerCase().includes(term.toLowerCase())
   ) : [];
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (!isAsync) return;
     if (debounceRef.current) clearTimeout(debounceRef.current);
     if (!term.trim()) {
@@ -6450,15 +6771,15 @@ function TreeSelect({
   defaultExpandedKeys = [],
   size = "md"
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
-  const [open, setOpen] = React24.useState(false);
-  const [expanded, setExpanded] = React24.useState(() => new Set(defaultExpandedKeys));
-  const [activeIndex, setActiveIndex] = React24.useState(0);
-  const listRef = React24.useRef(null);
-  const visible = React24.useMemo(() => flattenVisible(items, expanded), [items, expanded]);
-  const didSyncOnOpenRef = React24.useRef(false);
-  React24.useEffect(() => {
+  const [open, setOpen] = React26.useState(false);
+  const [expanded, setExpanded] = React26.useState(() => new Set(defaultExpandedKeys));
+  const [activeIndex, setActiveIndex] = React26.useState(0);
+  const listRef = React26.useRef(null);
+  const visible = React26.useMemo(() => flattenVisible(items, expanded), [items, expanded]);
+  const didSyncOnOpenRef = React26.useRef(false);
+  React26.useEffect(() => {
     if (!open) {
       didSyncOnOpenRef.current = false;
       return;
@@ -6468,7 +6789,7 @@ function TreeSelect({
     setActiveIndex(selectedIdx >= 0 ? selectedIdx : 0);
     didSyncOnOpenRef.current = true;
   }, [open, value]);
-  const selectedNode = React24.useMemo(
+  const selectedNode = React26.useMemo(
     () => value != null ? findNodeByKey(items, value) : null,
     [items, value]
   );
@@ -6699,11 +7020,11 @@ function FileInput({
   required,
   icon
 }) {
-  const inputRef = React24.useRef(null);
-  const errorId = React24.useId();
-  const [files, setFiles] = React24.useState([]);
-  const [dragging, setDragging] = React24.useState(false);
-  const [sizeError, setSizeError] = React24.useState(null);
+  const inputRef = React26.useRef(null);
+  const errorId = React26.useId();
+  const [files, setFiles] = React26.useState([]);
+  const [dragging, setDragging] = React26.useState(false);
+  const [sizeError, setSizeError] = React26.useState(null);
   const effectiveError = errorMessage ?? sizeError ?? void 0;
   const openPicker = () => {
     if (!disabled) inputRef.current?.click();
@@ -6894,30 +7215,30 @@ function DatePicker({
   size = "md",
   className = ""
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
-  const [open, setOpen] = React24.useState(false);
-  const [viewMonth, setViewMonth] = React24.useState(() => startOfMonth(value ?? /* @__PURE__ */ new Date()));
-  const [focusDate, setFocusDate] = React24.useState(() => value ?? /* @__PURE__ */ new Date());
-  const [view, setView] = React24.useState("days");
-  const gridRef = React24.useRef(null);
-  React24.useEffect(() => {
+  const [open, setOpen] = React26.useState(false);
+  const [viewMonth, setViewMonth] = React26.useState(() => startOfMonth(value ?? /* @__PURE__ */ new Date()));
+  const [focusDate, setFocusDate] = React26.useState(() => value ?? /* @__PURE__ */ new Date());
+  const [view, setView] = React26.useState("days");
+  const gridRef = React26.useRef(null);
+  React26.useEffect(() => {
     if (!open) return;
     const target = value ?? /* @__PURE__ */ new Date();
     setViewMonth(startOfMonth(target));
     setFocusDate(target);
     setView("days");
   }, [open, value]);
-  React24.useEffect(() => {
+  React26.useEffect(() => {
     if (!open) return;
     const cell = gridRef.current?.querySelector(`[data-day="${defaultFormat3(focusDate)}"]`);
     cell?.focus();
   }, [open, focusDate]);
-  const weekdays = React24.useMemo(() => {
+  const weekdays = React26.useMemo(() => {
     const ordered = WEEKDAY_SHORT.slice(weekStartsOn).concat(WEEKDAY_SHORT.slice(0, weekStartsOn));
     return ordered;
   }, [weekStartsOn]);
-  const grid = React24.useMemo(() => buildGrid2(viewMonth, weekStartsOn), [viewMonth, weekStartsOn]);
+  const grid = React26.useMemo(() => buildGrid2(viewMonth, weekStartsOn), [viewMonth, weekStartsOn]);
   const isDisabled = (d) => {
     if (min && d < min) return true;
     if (max && d > max) return true;
@@ -7207,10 +7528,10 @@ function TextArea({
   style,
   inputStyle
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
-  const ref = React24.useRef(null);
-  React24.useLayoutEffect(() => {
+  const ref = React26.useRef(null);
+  React26.useLayoutEffect(() => {
     if (!autoGrow) return;
     const el = ref.current;
     if (!el) return;
@@ -7280,11 +7601,11 @@ function SegmentedControl({
   "aria-label": ariaLabel
 }) {
   const sz = SIZE5[size];
-  const groupId = React24.useId();
-  const errorId = React24.useId();
+  const groupId = React26.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
   const isControlled = value !== void 0;
-  const [internal, setInternal] = React24.useState(defaultValue);
+  const [internal, setInternal] = React26.useState(defaultValue);
   const current = isControlled ? value : internal;
   const handle = (v) => {
     if (!v) return;
@@ -7378,14 +7699,14 @@ function Slider({
   name,
   htmlFor
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
   const isRange = Array.isArray(value ?? defaultValue);
-  const [internal, setInternal] = React24.useState(
+  const [internal, setInternal] = React26.useState(
     () => toArray(value) ?? toArray(defaultValue) ?? [min]
   );
   const current = toArray(value) ?? internal;
-  const [dragging, setDragging] = React24.useState(false);
+  const [dragging, setDragging] = React26.useState(false);
   const emit = (arr) => {
     setInternal(arr);
     const next = isRange ? [arr[0], arr[1]] : arr[0];
@@ -7480,11 +7801,11 @@ function TagsInput({
   validate,
   separators = ["Enter", ","]
 }) {
-  const errorId = React24.useId();
-  const inputRef = React24.useRef(null);
-  const [internal, setInternal] = React24.useState(defaultValue ?? []);
-  const [draft, setDraft] = React24.useState("");
-  const [localError, setLocalError] = React24.useState(null);
+  const errorId = React26.useId();
+  const inputRef = React26.useRef(null);
+  const [internal, setInternal] = React26.useState(defaultValue ?? []);
+  const [draft, setDraft] = React26.useState("");
+  const [localError, setLocalError] = React26.useState(null);
   const tags = value ?? internal;
   const hasError = errorMessage != null || localError != null;
   const errorText = errorMessage ?? localError ?? void 0;
@@ -7615,9 +7936,9 @@ function OtpInput({
   className,
   groupAfter
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
-  const refs = React24.useRef([]);
+  const refs = React26.useRef([]);
   const chars = Array.from({ length }, (_, i) => value[i] ?? "");
   const pattern = mode === "numeric" ? /[0-9]/ : /[a-zA-Z0-9]/;
   const emit = (next) => {
@@ -7666,7 +7987,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(React24__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(React26__default.default.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       "input",
       {
@@ -7724,9 +8045,9 @@ function Rating({
   className,
   required
 }) {
-  const errorId = React24.useId();
-  const [internal, setInternal] = React24.useState(defaultValue);
-  const [hover, setHover] = React24.useState(null);
+  const errorId = React26.useId();
+  const [internal, setInternal] = React26.useState(defaultValue);
+  const [hover, setHover] = React26.useState(null);
   const current = value ?? internal;
   const display2 = hover ?? current;
   const interactive = !readOnly && !disabled;
@@ -7849,9 +8170,9 @@ function TimePicker({
   required,
   style
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
-  const [open, setOpen] = React24.useState(false);
+  const [open, setOpen] = React26.useState(false);
   const parsed = parse(value) ?? { h: 0, m: 0, s: 0 };
   const update = (next) => {
     const merged = { ...parsed, ...next };
@@ -7975,13 +8296,13 @@ function DateRangePicker({
   required,
   style
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
-  const [open, setOpen] = React24.useState(false);
-  const [leftMonth, setLeftMonth] = React24.useState(() => startOfMonth2(value.start ?? /* @__PURE__ */ new Date()));
-  const [pendingStart, setPendingStart] = React24.useState(null);
-  const [hoverDate, setHoverDate] = React24.useState(null);
-  const weekdays = React24.useMemo(
+  const [open, setOpen] = React26.useState(false);
+  const [leftMonth, setLeftMonth] = React26.useState(() => startOfMonth2(value.start ?? /* @__PURE__ */ new Date()));
+  const [pendingStart, setPendingStart] = React26.useState(null);
+  const [hoverDate, setHoverDate] = React26.useState(null);
+  const weekdays = React26.useMemo(
     () => WEEKDAY.slice(weekStartsOn).concat(WEEKDAY.slice(0, weekStartsOn)),
     [weekStartsOn]
   );
@@ -8157,10 +8478,10 @@ function ColorPicker({
   required,
   placeholder = "Pick a colour\u2026"
 }) {
-  const errorId = React24.useId();
+  const errorId = React26.useId();
   const hasError = errorMessage != null;
-  const [open, setOpen] = React24.useState(false);
-  const [draft, setDraft] = React24.useState(value);
+  const [open, setOpen] = React26.useState(false);
+  const [draft, setDraft] = React26.useState(value);
   const valid = HEX_RE.test(value);
   const pick = (hex) => {
     onChange?.(hex);
@@ -8308,6 +8629,7 @@ exports.Kbd = Kbd;
 exports.List = List2;
 exports.LoadingSpinner = LoadingSpinner;
 exports.MegaMenu = MegaMenu_default;
+exports.MenuButton = MenuButton;
 exports.Modal = Modal;
 exports.NotificationProvider = NotificationProvider;
 exports.NumberInput = NumberInput;
@@ -8320,6 +8642,7 @@ exports.RadioGroup = RadioGroup;
 exports.Rating = Rating;
 exports.ScalableContainer = ScalableContainer;
 exports.SearchInput = SearchInput_default;
+exports.SecureLayout = SecureLayout;
 exports.SegmentedControl = SegmentedControl;
 exports.Sidebar = Sidebar;
 exports.SkeletonBox = SkeletonBox;
@@ -8328,6 +8651,7 @@ exports.SkeletonCircle = SkeletonCircle;
 exports.SkeletonText = SkeletonText;
 exports.Slider = Slider;
 exports.Statistic = Statistic;
+exports.Stepper = Stepper;
 exports.Switch = Switch;
 exports.Table = Table;
 exports.Tabs = Tabs_default;
@@ -8338,6 +8662,7 @@ exports.TextInput = TextInput;
 exports.ThemeProvider = ThemeProvider;
 exports.ThemeSwitch = ThemeSwitch;
 exports.TimePicker = TimePicker;
+exports.Timeline = Timeline;
 exports.Tooltip = Tooltip;
 exports.TooltipProvider = TooltipProvider;
 exports.TopBar = TopBar;