@octaviaflow/core 3.0.18-beta.31 → 3.0.18-beta.33

package/dist/index.cjs

@@ -5024,6 +5024,20 @@ var Select = (0, import_react33.forwardRef)(function Select2({
     };
   }, [state.isOpen, state.close, closeOnOutsideClick]);
   const selectedOption = options.find((o) => o.value === String(state.selectedKey ?? ""));
+  const wasOpenBeforePressRef = (0, import_react33.useRef)(false);
+  const handleTriggerPointerDown = (e) => {
+    wasOpenBeforePressRef.current = state.isOpen;
+    const baseHandler = buttonProps.onPointerDown;
+    baseHandler?.(e);
+  };
+  const handleTriggerClick = (e) => {
+    const baseHandler = buttonProps.onClick;
+    baseHandler?.(e);
+    if (wasOpenBeforePressRef.current && state.isOpen) {
+      state.close();
+    }
+    wasOpenBeforePressRef.current = false;
+  };
   return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
     "div",
     {
@@ -5041,6 +5055,8 @@ var Select = (0, import_react33.forwardRef)(function Select2({
           "button",
           {
             ...buttonProps,
+            onPointerDown: handleTriggerPointerDown,
+            onClick: handleTriggerClick,
             ref: setTriggerRef,
             id: baseId,
             form,
@@ -14434,13 +14450,57 @@ function FlowCanvas({
 }
 
 // src/components/FlowMinimap/FlowMinimap.tsx
-var import_react71 = require("react");
+var import_react72 = require("react");
 
-// src/workflow/hooks/useFlow.ts
+// src/workflow/components/Handle/handleRegistry.ts
 var import_react69 = require("react");
-var FlowInstanceContext = (0, import_react69.createContext)(null);
+var HandleRegistryContext = (0, import_react69.createContext)(null);
+function useHandleRegistry() {
+  const r = (0, import_react69.useContext)(HandleRegistryContext);
+  if (!r) {
+    throw new Error("[@octaviaflow/core/workflow] Handle must be used inside <FlowCanvas>.");
+  }
+  return r;
+}
+function createHandleRegistry() {
+  const map = /* @__PURE__ */ new Map();
+  const key = (n, t, h) => `${n}::${t}::${h}`;
+  const listeners = /* @__PURE__ */ new Set();
+  const notify = () => {
+    for (const l of listeners) l();
+  };
+  return {
+    register(d) {
+      map.set(key(d.nodeId, d.type, d.handleId), d);
+      notify();
+      return () => {
+        const k = key(d.nodeId, d.type, d.handleId);
+        if (map.get(k) === d) {
+          map.delete(k);
+          notify();
+        }
+      };
+    },
+    resolve(nodeId, type, handleId) {
+      return map.get(key(nodeId, type, handleId));
+    },
+    all() {
+      return Array.from(map.values());
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => {
+        listeners.delete(listener);
+      };
+    }
+  };
+}
+
+// src/workflow/hooks/useFlow.ts
+var import_react70 = require("react");
+var FlowInstanceContext = (0, import_react70.createContext)(null);
 function useFlow() {
-  const instance = (0, import_react69.useContext)(FlowInstanceContext);
+  const instance = (0, import_react70.useContext)(FlowInstanceContext);
   if (!instance) {
     throw new Error("[@octaviaflow/core/workflow] useFlow() must be called inside <FlowCanvas>.");
   }
@@ -14448,10 +14508,10 @@ function useFlow() {
 }
 
 // src/workflow/store/context.ts
-var import_react70 = require("react");
-var FlowStoreContext = (0, import_react70.createContext)(null);
+var import_react71 = require("react");
+var FlowStoreContext = (0, import_react71.createContext)(null);
 function useFlowStore() {
-  const store = (0, import_react70.useContext)(FlowStoreContext);
+  const store = (0, import_react71.useContext)(FlowStoreContext);
   if (!store) {
     throw new Error(
       "[@octaviaflow/core/workflow] useFlowStore must be called inside a <FlowCanvas>."
@@ -14460,12 +14520,56 @@ function useFlowStore() {
   return store;
 }
 
+// src/workflow/utils/geometry.ts
+var DEFAULT_NODE_WIDTH2 = 368;
+var DEFAULT_NODE_HEIGHT2 = 96;
+var COLLAPSED_GROUP_HEIGHT = 36;
+var COLLAPSED_FOREACH_HEIGHT = 40;
+function effectiveHeight(node) {
+  const data = node.data;
+  if (data?.collapsed) {
+    if (node.type === "group") return COLLAPSED_GROUP_HEIGHT;
+    if (node.type === "forEach") return COLLAPSED_FOREACH_HEIGHT;
+  }
+  return node.height ?? DEFAULT_NODE_HEIGHT2;
+}
+function handleCentre(node, side, index, total) {
+  const w = node.width ?? DEFAULT_NODE_WIDTH2;
+  const h = effectiveHeight(node);
+  const x0 = node.position.x;
+  const y0 = node.position.y;
+  const denom = total + 1;
+  const ratio = (index + 1) / denom;
+  switch (side) {
+    case "top":
+      return { x: x0 + w * ratio, y: y0 };
+    case "bottom":
+      return { x: x0 + w * ratio, y: y0 + h };
+    case "left":
+      return { x: x0, y: y0 + h * ratio };
+    case "right":
+      return { x: x0 + w, y: y0 + h * ratio };
+  }
+}
+function screenToFlow(p, vp) {
+  return {
+    x: (p.x - vp.x) / vp.zoom,
+    y: (p.y - vp.y) / vp.zoom
+  };
+}
+function flowToScreen(p, vp) {
+  return {
+    x: p.x * vp.zoom + vp.x,
+    y: p.y * vp.zoom + vp.y
+  };
+}
+
 // src/components/FlowMinimap/FlowMinimap.tsx
 var import_jsx_runtime52 = require("react/jsx-runtime");
 var MINIMAP_WIDTH = 140;
 var MINIMAP_HEIGHT = 100;
-var DEFAULT_NODE_WIDTH2 = 240;
-var DEFAULT_NODE_HEIGHT2 = 96;
+var DEFAULT_NODE_WIDTH3 = 240;
+var DEFAULT_NODE_HEIGHT3 = 96;
 var DRAG_THRESHOLD_PX2 = 3;
 var NO_STORE_SUBSCRIBE = (_cb) => () => {
 };
@@ -14483,43 +14587,71 @@ function FlowMinimap(props) {
     bounds_padding = 80,
     className
   } = props;
-  const store = (0, import_react71.useContext)(FlowStoreContext);
-  const instance = (0, import_react71.useContext)(FlowInstanceContext);
-  const { sub, snap } = (0, import_react71.useMemo)(
+  const store = (0, import_react72.useContext)(FlowStoreContext);
+  const instance = (0, import_react72.useContext)(FlowInstanceContext);
+  const handleRegistry = (0, import_react72.useContext)(HandleRegistryContext);
+  const { sub, snap } = (0, import_react72.useMemo)(
     () => store ? { sub: store.subscribe, snap: () => store.getSnapshot() } : { sub: NO_STORE_SUBSCRIBE, snap: NO_STORE_SNAPSHOT },
     [store]
   );
-  const liveSnapshot = (0, import_react71.useSyncExternalStore)(sub, snap, snap);
-  const resolvedNodes = (0, import_react71.useMemo)(() => {
+  const liveSnapshot = (0, import_react72.useSyncExternalStore)(sub, snap, snap);
+  const [registryVersion, setRegistryVersion] = (0, import_react72.useState)(0);
+  (0, import_react72.useEffect)(() => {
+    if (!handleRegistry) return;
+    return handleRegistry.subscribe(() => setRegistryVersion((v) => v + 1));
+  }, [handleRegistry]);
+  const resolvedNodes = (0, import_react72.useMemo)(() => {
     if (nodesProp) return nodesProp;
     if (!liveSnapshot) return [];
     return liveSnapshot.nodes.filter((n) => !n.hidden).map((n) => ({
       id: n.id,
       x: n.position.x,
       y: n.position.y,
-      width: n.width ?? DEFAULT_NODE_WIDTH2,
-      height: n.height ?? DEFAULT_NODE_HEIGHT2
+      width: n.width ?? DEFAULT_NODE_WIDTH3,
+      height: n.height ?? DEFAULT_NODE_HEIGHT3
     }));
   }, [nodesProp, liveSnapshot]);
-  const resolvedEdges = (0, import_react71.useMemo)(() => {
+  const resolvedEdges = (0, import_react72.useMemo)(() => {
     if (edgesProp) return edgesProp;
     if (!liveSnapshot) return [];
-    const nodeIndex = new Map(resolvedNodes.map((n) => [n.id, n]));
+    const nodeIndex = new Map(
+      liveSnapshot.nodes.filter((n) => !n.hidden).map((n) => [n.id, n])
+    );
+    const centreOf = (n) => {
+      const w = n.width ?? DEFAULT_NODE_WIDTH3;
+      const h = n.height ?? DEFAULT_NODE_HEIGHT3;
+      return { x: n.position.x + w / 2, y: n.position.y + h / 2 };
+    };
     return liveSnapshot.edges.flatMap((e) => {
+      if (e.hidden) return [];
       const s = nodeIndex.get(e.source);
       const t = nodeIndex.get(e.target);
       if (!s || !t) return [];
-      return [
-        {
-          from: { x: s.x + s.width / 2, y: s.y + s.height / 2 },
-          to: { x: t.x + t.width / 2, y: t.y + t.height / 2 }
-        }
-      ];
+      const srcDesc = handleRegistry?.resolve(
+        s.id,
+        "source",
+        e.sourceHandle ?? "default"
+      );
+      const tgtDesc = handleRegistry?.resolve(
+        t.id,
+        "target",
+        e.targetHandle ?? "default"
+      );
+      const from = srcDesc ? handleCentre(s, srcDesc.side, srcDesc.index, srcDesc.total) : (
+        // Fallback: source defaults to bottom centre (matches the
+        // canvas's source default before any Handle registers).
+        s.sourcePosition ? handleCentre(s, s.sourcePosition, 0, 1) : centreOf(s)
+      );
+      const to = tgtDesc ? handleCentre(t, tgtDesc.side, tgtDesc.index, tgtDesc.total) : (
+        // Fallback: target defaults to top centre.
+        t.targetPosition ? handleCentre(t, t.targetPosition, 0, 1) : centreOf(t)
+      );
+      return [{ from, to }];
     });
-  }, [edgesProp, liveSnapshot, resolvedNodes]);
-  const minimapRef = (0, import_react71.useRef)(null);
-  const [canvasSize, setCanvasSize] = (0, import_react71.useState)(null);
-  (0, import_react71.useEffect)(() => {
+  }, [edgesProp, liveSnapshot, handleRegistry, registryVersion]);
+  const minimapRef = (0, import_react72.useRef)(null);
+  const [canvasSize, setCanvasSize] = (0, import_react72.useState)(null);
+  (0, import_react72.useEffect)(() => {
     if (!liveSnapshot) return;
     const el = minimapRef.current?.closest(".ods-flow-canvas-v2");
     if (!el) return;
@@ -14532,7 +14664,7 @@ function FlowMinimap(props) {
     ro.observe(el);
     return () => ro.disconnect();
   }, [liveSnapshot !== null]);
-  const effectiveViewportRect = (0, import_react71.useMemo)(() => {
+  const effectiveViewportRect = (0, import_react72.useMemo)(() => {
     if (viewportRectProp) return viewportRectProp;
     if (!liveSnapshot || !canvasSize) return null;
     const vp = liveSnapshot.viewport;
@@ -14544,7 +14676,7 @@ function FlowMinimap(props) {
       height: canvasSize.height / z
     };
   }, [viewportRectProp, liveSnapshot, canvasSize]);
-  const contentBounds = (0, import_react71.useMemo)(() => {
+  const contentBounds = (0, import_react72.useMemo)(() => {
     if (resolvedNodes.length === 0) return null;
     let minX = Number.POSITIVE_INFINITY;
     let minY = Number.POSITIVE_INFINITY;
@@ -14558,7 +14690,7 @@ function FlowMinimap(props) {
     }
     return { minX, minY, maxX, maxY };
   }, [resolvedNodes]);
-  const viewBox = (0, import_react71.useMemo)(() => {
+  const viewBox = (0, import_react72.useMemo)(() => {
     if (totalWidthProp !== void 0 && totalHeightProp !== void 0) {
       return { x: 0, y: 0, w: totalWidthProp, h: totalHeightProp };
     }
@@ -14573,7 +14705,7 @@ function FlowMinimap(props) {
       h: maxY - minY + bounds_padding * 2
     };
   }, [totalWidthProp, totalHeightProp, contentBounds, bounds_padding]);
-  const clampWorldTopLeft = (0, import_react71.useCallback)(
+  const clampWorldTopLeft = (0, import_react72.useCallback)(
     (worldX, worldY, vw, vh) => {
       if (!contentBounds) return { x: worldX, y: worldY };
       const minTLX = viewBox.x;
@@ -14586,7 +14718,7 @@ function FlowMinimap(props) {
     },
     [contentBounds, viewBox.x, viewBox.y, viewBox.w, viewBox.h]
   );
-  const reportViewportChange = (0, import_react71.useCallback)(
+  const reportViewportChange = (0, import_react72.useCallback)(
     (worldX, worldY) => {
       if (effectiveViewportRect) {
         const clamped = clampWorldTopLeft(
@@ -14621,8 +14753,8 @@ function FlowMinimap(props) {
     },
     [onViewportChange, viewportProp?.zoom, instance, liveSnapshot, effectiveViewportRect, clampWorldTopLeft]
   );
-  const svgRef = (0, import_react71.useRef)(null);
-  const pointToWorld = (0, import_react71.useCallback)(
+  const svgRef = (0, import_react72.useRef)(null);
+  const pointToWorld = (0, import_react72.useCallback)(
     (clientX, clientY) => {
       const svg = svgRef.current;
       if (!svg) return null;
@@ -14637,7 +14769,7 @@ function FlowMinimap(props) {
     },
     [viewBox.x, viewBox.y, viewBox.w, viewBox.h]
   );
-  const dragRef = (0, import_react71.useRef)({
+  const dragRef = (0, import_react72.useRef)({
     dragging: false,
     pointerId: -1,
     startWorldX: 0,
@@ -14647,9 +14779,9 @@ function FlowMinimap(props) {
     startClientX: 0,
     startClientY: 0
   });
-  const suppressNextClickRef = (0, import_react71.useRef)(false);
-  const [isDragging, setIsDragging] = (0, import_react71.useState)(false);
-  const onViewportPointerDown = (0, import_react71.useCallback)(
+  const suppressNextClickRef = (0, import_react72.useRef)(false);
+  const [isDragging, setIsDragging] = (0, import_react72.useState)(false);
+  const onViewportPointerDown = (0, import_react72.useCallback)(
     (e) => {
       if (!effectiveViewportRect) return;
       e.stopPropagation();
@@ -14671,7 +14803,7 @@ function FlowMinimap(props) {
     },
     [effectiveViewportRect, pointToWorld]
   );
-  const onSvgPointerMove = (0, import_react71.useCallback)(
+  const onSvgPointerMove = (0, import_react72.useCallback)(
     (e) => {
       const d = dragRef.current;
       if (!d.dragging || d.pointerId !== e.pointerId) return;
@@ -14687,7 +14819,7 @@ function FlowMinimap(props) {
     },
     [pointToWorld, reportViewportChange]
   );
-  const onSvgPointerUp = (0, import_react71.useCallback)((e) => {
+  const onSvgPointerUp = (0, import_react72.useCallback)((e) => {
     const d = dragRef.current;
     if (d.dragging && d.pointerId === e.pointerId) {
       d.dragging = false;
@@ -14696,7 +14828,7 @@ function FlowMinimap(props) {
       e.currentTarget.releasePointerCapture?.(e.pointerId);
     }
   }, []);
-  const handleSvgClick = (0, import_react71.useCallback)(
+  const handleSvgClick = (0, import_react72.useCallback)(
     (e) => {
       if (suppressNextClickRef.current) {
         suppressNextClickRef.current = false;
@@ -14714,7 +14846,7 @@ function FlowMinimap(props) {
     },
     [pointToWorld, effectiveViewportRect, reportViewportChange]
   );
-  const handleWheel = (0, import_react71.useCallback)(
+  const handleWheel = (0, import_react72.useCallback)(
     (e) => {
       if (!zoomOnScroll) return;
       if (!instance || !liveSnapshot) return;
@@ -14740,7 +14872,7 @@ function FlowMinimap(props) {
     },
     [zoomOnScroll, instance, liveSnapshot, canvasSize, pointToWorld, clampWorldTopLeft]
   );
-  (0, import_react71.useEffect)(
+  (0, import_react72.useEffect)(
     () => () => {
       dragRef.current.dragging = false;
     },
@@ -14818,14 +14950,14 @@ function FlowMinimap(props) {
 
 // src/components/FlowToolbar/FlowToolbar.tsx
 var import_icons19 = require("@octaviaflow/icons");
-var import_react74 = require("react");
+var import_react75 = require("react");
 
 // src/workflow/store/selectors.ts
-var import_react72 = require("react");
+var import_react73 = require("react");
 function useFlowSelector(selector, isEqual = Object.is) {
   void isEqual;
   const store = useFlowStore();
-  return (0, import_react72.useSyncExternalStore)(
+  return (0, import_react73.useSyncExternalStore)(
     store.subscribe,
     () => selector(store.getSnapshot()),
     () => selector(store.getSnapshot())
@@ -14838,8 +14970,8 @@ var VIEWPORT_OR_NULL_NO_STORE_SUBSCRIBE = (_cb) => () => {
 };
 var VIEWPORT_OR_NULL_NO_STORE_SNAPSHOT = () => null;
 function useViewportOrNull() {
-  const store = (0, import_react72.useContext)(FlowStoreContext);
-  const { sub, snap } = (0, import_react72.useMemo)(
+  const store = (0, import_react73.useContext)(FlowStoreContext);
+  const { sub, snap } = (0, import_react73.useMemo)(
     () => store ? {
       sub: store.subscribe,
       snap: () => store.getSnapshot().viewport
@@ -14849,11 +14981,11 @@ function useViewportOrNull() {
     },
     [store]
   );
-  return (0, import_react72.useSyncExternalStore)(sub, snap, snap);
+  return (0, import_react73.useSyncExternalStore)(sub, snap, snap);
 }
 
 // src/components/Spinner/Spinner.tsx
-var import_react73 = require("react");
+var import_react74 = require("react");
 var import_jsx_runtime53 = require("react/jsx-runtime");
 var SIZE_PX = {
   sm: 16,
@@ -14861,7 +14993,7 @@ var SIZE_PX = {
   lg: 32,
   xl: 48
 };
-var Spinner = (0, import_react73.forwardRef)(function Spinner2({
+var Spinner = (0, import_react74.forwardRef)(function Spinner2({
   size = "md",
   tone = "accent",
   label = "Loading",
@@ -15003,10 +15135,10 @@ function FlowToolbarSave({
   showLabel = false,
   className
 }) {
-  const [inferred, setInferred] = (0, import_react74.useState)("idle");
-  const prevSavedAt = (0, import_react74.useRef)(lastSavedAt);
-  const prevLoading = (0, import_react74.useRef)(loading);
-  (0, import_react74.useEffect)(() => {
+  const [inferred, setInferred] = (0, import_react75.useState)("idle");
+  const prevSavedAt = (0, import_react75.useRef)(lastSavedAt);
+  const prevLoading = (0, import_react75.useRef)(loading);
+  (0, import_react75.useEffect)(() => {
     if (state !== void 0) return;
     if (error) {
       setInferred("error");
@@ -15260,7 +15392,7 @@ function FormSection({
 
 // src/components/Gauge/Gauge.tsx
 var import_framer_motion23 = require("framer-motion");
-var import_react75 = require("react");
+var import_react76 = require("react");
 var import_jsx_runtime56 = require("react/jsx-runtime");
 var defaultFormat3 = (n) => {
   if (Math.abs(n) >= 1e6) return `${(n / 1e6).toFixed(1)}M`;
@@ -15274,7 +15406,7 @@ function resolveBandColor(v, bands, fallback) {
   }
   return bands[bands.length - 1].color;
 }
-var Gauge = (0, import_react75.forwardRef)(function Gauge2({
+var Gauge = (0, import_react76.forwardRef)(function Gauge2({
   value,
   min = 0,
   max = 100,
@@ -15294,11 +15426,11 @@ var Gauge = (0, import_react75.forwardRef)(function Gauge2({
   "aria-label": ariaLabel,
   ...rest
 }, ref) {
-  const reactId = (0, import_react75.useId)();
+  const reactId = (0, import_react76.useId)();
   const clamped = Math.max(min, Math.min(max, value));
   const pct = (clamped - min) / Math.max(1e-6, max - min);
   const fillColor = resolveBandColor(clamped, bands, color);
-  const resolvedAriaLabel = (0, import_react75.useMemo)(() => {
+  const resolvedAriaLabel = (0, import_react76.useMemo)(() => {
     if (ariaLabel) return ariaLabel;
     const t = typeof title === "string" ? title : "Gauge";
     return `${t} \u2014 ${formatValue(clamped)} of ${formatValue(max)}`;
@@ -15556,7 +15688,7 @@ function LinearVariant({
 }
 
 // src/components/Grid/Grid.tsx
-var import_react76 = require("react");
+var import_react77 = require("react");
 var import_jsx_runtime57 = require("react/jsx-runtime");
 function resolveGap(gap) {
   if (gap === void 0) return void 0;
@@ -15578,7 +15710,7 @@ var ALIGN_MAP = {
   end: "end",
   stretch: "stretch"
 };
-var GridBase = (0, import_react76.forwardRef)(function Grid({
+var GridBase = (0, import_react77.forwardRef)(function Grid({
   columns = 12,
   minColumnWidth = "240px",
   gap = 4,
@@ -15613,7 +15745,7 @@ var GridBase = (0, import_react76.forwardRef)(function Grid({
   );
 });
 GridBase.displayName = "Grid";
-var GridItem = (0, import_react76.forwardRef)(
+var GridItem = (0, import_react77.forwardRef)(
   function GridItem2({ colSpan, rowSpan, colStart, rowStart, as, className, style, children, ...rest }, ref) {
     const Component = as ?? "div";
     return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
@@ -15639,7 +15771,7 @@ var Grid2 = Object.assign(GridBase, { Item: GridItem });
 
 // src/components/Heatmap/Heatmap.tsx
 var import_framer_motion24 = require("framer-motion");
-var import_react77 = require("react");
+var import_react78 = require("react");
 var import_jsx_runtime58 = require("react/jsx-runtime");
 var DEFAULT_SCALE2 = [
   "var(--ods-accent-soft)",
@@ -15663,7 +15795,7 @@ function bucketColor2(value, lo, hi, scale) {
   const i = bucketIndex(value, lo, hi, scale.length);
   return i < 0 ? "transparent" : scale[i];
 }
-var Heatmap = (0, import_react77.forwardRef)(
+var Heatmap = (0, import_react78.forwardRef)(
   function Heatmap2({
     data,
     xLabels,
@@ -15689,37 +15821,37 @@ var Heatmap = (0, import_react77.forwardRef)(
     onCellClick,
     ...rest
   }, ref) {
-    const reactId = (0, import_react77.useId)();
-    const xs = (0, import_react77.useMemo)(() => {
+    const reactId = (0, import_react78.useId)();
+    const xs = (0, import_react78.useMemo)(() => {
       if (xLabels) return xLabels;
       return Array.from(new Set(data.map((d) => d.x)));
     }, [xLabels, data]);
-    const ys = (0, import_react77.useMemo)(() => {
+    const ys = (0, import_react78.useMemo)(() => {
       if (yLabels) return yLabels;
       return Array.from(new Set(data.map((d) => d.y)));
     }, [yLabels, data]);
-    const cellMap = (0, import_react77.useMemo)(() => {
+    const cellMap = (0, import_react78.useMemo)(() => {
       const m = /* @__PURE__ */ new Map();
       for (const c of data) m.set(`${c.x}|${c.y}`, c);
       return m;
     }, [data]);
-    const vMin = (0, import_react77.useMemo)(
+    const vMin = (0, import_react78.useMemo)(
       () => domainMin ?? (data.length ? Math.min(...data.map((d) => d.value)) : 0),
       [domainMin, data]
     );
-    const vMax = (0, import_react77.useMemo)(
+    const vMax = (0, import_react78.useMemo)(
       () => domainMax ?? (data.length ? Math.max(...data.map((d) => d.value)) : 1),
       [domainMax, data]
     );
-    const [hovered, setHovered] = (0, import_react77.useState)(null);
-    const fire = (0, import_react77.useCallback)(
+    const [hovered, setHovered] = (0, import_react78.useState)(null);
+    const fire = (0, import_react78.useCallback)(
       (cell) => {
         setHovered(cell);
         onCellHover?.(cell);
       },
       [onCellHover]
     );
-    const handleKey = (0, import_react77.useCallback)(
+    const handleKey = (0, import_react78.useCallback)(
       (e, cell) => {
         if (!onCellClick) return;
         if (e.key === "Enter" || e.key === " ") {
@@ -15729,7 +15861,7 @@ var Heatmap = (0, import_react77.forwardRef)(
       },
       [onCellClick]
     );
-    const resolvedAriaLabel = (0, import_react77.useMemo)(() => {
+    const resolvedAriaLabel = (0, import_react78.useMemo)(() => {
       if (ariaLabel) return ariaLabel;
       const t = typeof title === "string" ? title : "Heatmap";
       return `${t} \u2014 ${xs.length}\xD7${ys.length} grid, ${data.length} cells, range ${formatValue(vMin)} to ${formatValue(vMax)}`;
@@ -15892,7 +16024,7 @@ var Heatmap = (0, import_react77.forwardRef)(
 Heatmap.displayName = "Heatmap";
 
 // src/components/HoverCard/HoverCard.tsx
-var import_react78 = require("react");
+var import_react79 = require("react");
 var import_react_dom9 = require("react-dom");
 var import_jsx_runtime59 = require("react/jsx-runtime");
 function computePosition3(rect, panelRect, placement, offset) {
@@ -15918,12 +16050,12 @@ function HoverCard({
   children,
   className
 }) {
-  const [open, setOpen] = (0, import_react78.useState)(false);
-  const triggerRef = (0, import_react78.useRef)(null);
-  const panelRef = (0, import_react78.useRef)(null);
-  const openTimer = (0, import_react78.useRef)(null);
-  const closeTimer = (0, import_react78.useRef)(null);
-  const [coords, setCoords] = (0, import_react78.useState)(null);
+  const [open, setOpen] = (0, import_react79.useState)(false);
+  const triggerRef = (0, import_react79.useRef)(null);
+  const panelRef = (0, import_react79.useRef)(null);
+  const openTimer = (0, import_react79.useRef)(null);
+  const closeTimer = (0, import_react79.useRef)(null);
+  const [coords, setCoords] = (0, import_react79.useState)(null);
   const clearTimers = () => {
     if (openTimer.current) {
       clearTimeout(openTimer.current);
@@ -15934,7 +16066,7 @@ function HoverCard({
       closeTimer.current = null;
     }
   };
-  (0, import_react78.useEffect)(() => () => clearTimers(), []);
+  (0, import_react79.useEffect)(() => () => clearTimers(), []);
   const show = () => {
     clearTimers();
     openTimer.current = setTimeout(() => setOpen(true), openDelay);
@@ -15943,19 +16075,19 @@ function HoverCard({
     clearTimers();
     closeTimer.current = setTimeout(() => setOpen(false), closeDelay);
   };
-  const reposition = (0, import_react78.useCallback)(() => {
+  const reposition = (0, import_react79.useCallback)(() => {
     if (!triggerRef.current || !panelRef.current) return;
     const trigRect = triggerRef.current.getBoundingClientRect();
     const panelRect = panelRef.current.getBoundingClientRect();
     setCoords(computePosition3(trigRect, panelRect, placement, offset));
   }, [placement, offset]);
-  (0, import_react78.useLayoutEffect)(() => {
+  (0, import_react79.useLayoutEffect)(() => {
     if (!open) return;
     reposition();
     const id = requestAnimationFrame(reposition);
     return () => cancelAnimationFrame(id);
   }, [open, reposition]);
-  (0, import_react78.useEffect)(() => {
+  (0, import_react79.useEffect)(() => {
     if (!open) return;
     const h = () => reposition();
     window.addEventListener("scroll", h, true);
@@ -16006,9 +16138,9 @@ function HoverCard({
 }
 
 // src/components/IconCard/IconCard.tsx
-var import_react79 = require("react");
+var import_react80 = require("react");
 var import_jsx_runtime60 = require("react/jsx-runtime");
-var IconCard = (0, import_react79.forwardRef)(
+var IconCard = (0, import_react80.forwardRef)(
   function IconCard2({
     variant = "default",
     size = "md",
@@ -16026,7 +16158,7 @@ var IconCard = (0, import_react79.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react79.useId)();
+    const reactId = (0, import_react80.useId)();
     const baseId = providedId ?? `ods-icon-card-${reactId}`;
     const titleId = `${baseId}-title`;
     const descId = description ? `${baseId}-desc` : void 0;
@@ -16109,10 +16241,10 @@ IconCard.displayName = "IconCard";
 
 // src/components/Input/Input.tsx
 var import_icons20 = require("@octaviaflow/icons");
-var import_react80 = require("react");
+var import_react81 = require("react");
 var import_jsx_runtime61 = require("react/jsx-runtime");
 var CLEAR_GLYPH = /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_icons20.CloseIcon, { width: 12, height: 12, "aria-hidden": "true" });
-var Input = (0, import_react80.forwardRef)(
+var Input = (0, import_react81.forwardRef)(
   ({
     type = "text",
     size = "md",
@@ -16135,9 +16267,9 @@ var Input = (0, import_react80.forwardRef)(
     onKeyDown,
     ...props
   }, forwardedRef) => {
-    const innerRef = (0, import_react80.useRef)(null);
-    (0, import_react80.useImperativeHandle)(forwardedRef, () => innerRef.current);
-    const reactId = (0, import_react80.useId)();
+    const innerRef = (0, import_react81.useRef)(null);
+    (0, import_react81.useImperativeHandle)(forwardedRef, () => innerRef.current);
+    const reactId = (0, import_react81.useId)();
     const inputId = id ?? `${reactId}-input`;
     const errorId = `${reactId}-err`;
     const helperId = `${reactId}-help`;
@@ -16238,7 +16370,7 @@ var Input = (0, import_react80.forwardRef)(
 Input.displayName = "Input";
 
 // src/components/IntegrationCard/IntegrationCard.tsx
-var import_react81 = require("react");
+var import_react82 = require("react");
 var import_jsx_runtime62 = require("react/jsx-runtime");
 var CATEGORY_LABEL = {
   communication: "Communication",
@@ -16258,7 +16390,7 @@ var STATUS_LABEL4 = {
   "coming-soon": "Coming soon",
   deprecated: "Deprecated"
 };
-var IntegrationCard = (0, import_react81.forwardRef)(function IntegrationCard2({
+var IntegrationCard = (0, import_react82.forwardRef)(function IntegrationCard2({
   name,
   nameAs = "h3",
   logo,
@@ -16282,7 +16414,7 @@ var IntegrationCard = (0, import_react81.forwardRef)(function IntegrationCard2({
   className,
   ...rest
 }, ref) {
-  const reactId = (0, import_react81.useId)();
+  const reactId = (0, import_react82.useId)();
   const baseId = providedId ?? `ods-integration-card-${reactId}`;
   const nameId = `${baseId}-name`;
   const descId = description ? `${baseId}-desc` : void 0;
@@ -16454,9 +16586,9 @@ IntegrationCard.displayName = "IntegrationCard";
 
 // src/components/JsonViewer/JsonViewer.tsx
 var import_icons21 = require("@octaviaflow/icons");
-var import_react82 = require("react");
+var import_react83 = require("react");
 var import_jsx_runtime63 = require("react/jsx-runtime");
-var JsonViewer = (0, import_react82.forwardRef)(
+var JsonViewer = (0, import_react83.forwardRef)(
   function JsonViewer2({
     data,
     mode = "view",
@@ -16504,11 +16636,11 @@ function JsonNode({
   truncateAt,
   isLast = true
 }) {
-  const [open, setOpen] = (0, import_react82.useState)(depth < defaultExpandDepth);
+  const [open, setOpen] = (0, import_react83.useState)(depth < defaultExpandDepth);
   const isObject = value !== null && typeof value === "object" && !Array.isArray(value);
   const isArray = Array.isArray(value);
   const isContainer = isObject || isArray;
-  const renderKey = (0, import_react82.useMemo)(() => {
+  const renderKey = (0, import_react83.useMemo)(() => {
     if (name === void 0) return null;
     if (typeof name === "number") {
       return showIndexes ? /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "ods-json-viewer__key ods-json-viewer__key--index", children: name }) : null;
@@ -16595,7 +16727,7 @@ function Leaf({
   truncateAt,
   copyable
 }) {
-  const [copied, setCopied] = (0, import_react82.useState)(false);
+  const [copied, setCopied] = (0, import_react83.useState)(false);
   let display;
   let variant;
   if (value === null) {
@@ -16674,15 +16806,15 @@ function extractJsonErrorPosition(err, text) {
   return { line: 1, col: 1, message };
 }
 function JsonEditBody({ data, onChange, onValidate }) {
-  const initial = (0, import_react82.useMemo)(() => {
+  const initial = (0, import_react83.useMemo)(() => {
     try {
       return JSON.stringify(data, null, 2);
     } catch {
       return "{}";
     }
   }, []);
-  const [text, setText] = (0, import_react82.useState)(initial);
-  const [parseError, setParseError] = (0, import_react82.useState)(null);
+  const [text, setText] = (0, import_react83.useState)(initial);
+  const [parseError, setParseError] = (0, import_react83.useState)(null);
   const validate = (next) => {
     try {
       JSON.parse(next);
@@ -16699,7 +16831,7 @@ function JsonEditBody({ data, onChange, onValidate }) {
     onChange?.(next);
     validate(next);
   };
-  (0, import_react82.useEffect)(() => {
+  (0, import_react83.useEffect)(() => {
     validate(initial);
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "ods-json-viewer__edit", children: [
@@ -16736,12 +16868,12 @@ function JsonEditBody({ data, onChange, onValidate }) {
 
 // src/components/KanbanCard/KanbanCard.tsx
 var import_icons22 = require("@octaviaflow/icons");
-var import_react83 = require("react");
+var import_react84 = require("react");
 var import_jsx_runtime64 = require("react/jsx-runtime");
 function isAssigneeObject(v) {
   return typeof v === "object" && v !== null && "name" in v;
 }
-var KanbanCard = (0, import_react83.forwardRef)(
+var KanbanCard = (0, import_react84.forwardRef)(
   function KanbanCard2({
     title,
     titleAs = "h3",
@@ -16762,7 +16894,7 @@ var KanbanCard = (0, import_react83.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react83.useId)();
+    const reactId = (0, import_react84.useId)();
     const baseId = providedId ?? `ods-kanban-card-${reactId}`;
     const titleId = `${baseId}-title`;
     const tagList = tags ?? (tag ? [tag] : []);
@@ -16882,9 +17014,9 @@ var KanbanCard = (0, import_react83.forwardRef)(
 KanbanCard.displayName = "KanbanCard";
 
 // src/components/Kbd/Kbd.tsx
-var import_react84 = require("react");
+var import_react85 = require("react");
 var import_jsx_runtime65 = require("react/jsx-runtime");
-var Kbd = (0, import_react84.forwardRef)(function Kbd2({ size = "md", children, className, ...rest }, ref) {
+var Kbd = (0, import_react85.forwardRef)(function Kbd2({ size = "md", children, className, ...rest }, ref) {
   return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
     "kbd",
     {
@@ -16896,7 +17028,7 @@ var Kbd = (0, import_react84.forwardRef)(function Kbd2({ size = "md", children,
   );
 });
 Kbd.displayName = "Kbd";
-var KbdGroup = (0, import_react84.forwardRef)(
+var KbdGroup = (0, import_react85.forwardRef)(
   function KbdGroup2({ size = "md", separator = "+", keys, className, ...rest }, ref) {
     return /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
       "span",
@@ -16920,7 +17052,7 @@ KbdGroup.displayName = "KbdGroup";
 
 // src/components/LineChart/LineChart.tsx
 var import_framer_motion25 = require("framer-motion");
-var import_react85 = require("react");
+var import_react86 = require("react");
 var import_jsx_runtime66 = require("react/jsx-runtime");
 var defaultFormat5 = (n) => {
   if (Math.abs(n) >= 1e6) return `${(n / 1e6).toFixed(1)}M`;
@@ -16955,7 +17087,7 @@ function buildTicks2(min, max, count) {
 var W = 360;
 var H = 100;
 var PAD = 6;
-var LineChart = (0, import_react85.forwardRef)(
+var LineChart = (0, import_react86.forwardRef)(
   function LineChart2({
     data,
     series,
@@ -16984,8 +17116,8 @@ var LineChart = (0, import_react85.forwardRef)(
     onZoomChange,
     ...rest
   }, ref) {
-    const reactId = (0, import_react85.useId)();
-    const allLines = (0, import_react85.useMemo)(() => {
+    const reactId = (0, import_react86.useId)();
+    const allLines = (0, import_react86.useMemo)(() => {
       if (series && series.length > 0) return series;
       return [
         {
@@ -16997,25 +17129,25 @@ var LineChart = (0, import_react85.forwardRef)(
         }
       ];
     }, [series, data, stroke, fill]);
-    const [zoom, setZoom] = (0, import_react85.useState)(
+    const [zoom, setZoom] = (0, import_react86.useState)(
       null
     );
     const totalX = allLines[0]?.data.length ?? 0;
     const visibleRange = zoom ?? { start: 0, end: Math.max(0, totalX - 1) };
-    const lines = (0, import_react85.useMemo)(
+    const lines = (0, import_react86.useMemo)(
       () => allLines.map((s) => ({
         ...s,
         data: s.data.slice(visibleRange.start, visibleRange.end + 1)
       })),
       [allLines, visibleRange.start, visibleRange.end]
     );
-    const xLabels = (0, import_react85.useMemo)(
+    const xLabels = (0, import_react86.useMemo)(
       () => lines[0]?.data.map((p) => p.x) ?? [],
       [lines]
     );
     const xCount = xLabels.length;
     const stepX = (W - PAD * 2) / Math.max(1, xCount - 1);
-    const allYs = (0, import_react85.useMemo)(
+    const allYs = (0, import_react86.useMemo)(
       () => lines.flatMap((s) => s.data.map((p) => p.y)),
       [lines]
     );
@@ -17023,7 +17155,7 @@ var LineChart = (0, import_react85.forwardRef)(
     const dataMax = allYs.length ? Math.max(...allYs) : 1;
     const lo = yMin ?? Math.min(0, dataMin);
     const hi = Math.max(lo + 1, yMax ?? dataMax);
-    const projected = (0, import_react85.useMemo)(
+    const projected = (0, import_react86.useMemo)(
       () => lines.map(
         (s) => s.data.map(
           (p, i) => [
@@ -17034,15 +17166,15 @@ var LineChart = (0, import_react85.forwardRef)(
       ),
       [lines, stepX, lo, hi]
     );
-    const ticks = (0, import_react85.useMemo)(
+    const ticks = (0, import_react86.useMemo)(
       () => buildTicks2(lo, hi, Math.max(2, yTicks)),
       [lo, hi, yTicks]
     );
-    const [hoveredIdx, setHoveredIdx] = (0, import_react85.useState)(null);
-    const [pointerPct, setPointerPct] = (0, import_react85.useState)(null);
-    const plotRef = (0, import_react85.useRef)(null);
-    const [brush, setBrush] = (0, import_react85.useState)(null);
-    const indexFromPct = (0, import_react85.useCallback)(
+    const [hoveredIdx, setHoveredIdx] = (0, import_react86.useState)(null);
+    const [pointerPct, setPointerPct] = (0, import_react86.useState)(null);
+    const plotRef = (0, import_react86.useRef)(null);
+    const [brush, setBrush] = (0, import_react86.useState)(null);
+    const indexFromPct = (0, import_react86.useCallback)(
       (pct) => {
         if (xCount === 0) return 0;
         return Math.max(
@@ -17052,7 +17184,7 @@ var LineChart = (0, import_react85.forwardRef)(
       },
       [xCount]
     );
-    const handlePlotMove = (0, import_react85.useCallback)(
+    const handlePlotMove = (0, import_react86.useCallback)(
       (e) => {
         if (xCount === 0) return;
         const rect = plotRef.current?.getBoundingClientRect();
@@ -17081,12 +17213,12 @@ var LineChart = (0, import_react85.forwardRef)(
         visibleRange.start
       ]
     );
-    const handlePlotLeave = (0, import_react85.useCallback)(() => {
+    const handlePlotLeave = (0, import_react86.useCallback)(() => {
       setHoveredIdx(null);
       setPointerPct(null);
       onPointHover?.(null, null, null);
     }, [onPointHover]);
-    const handlePlotDown = (0, import_react85.useCallback)(
+    const handlePlotDown = (0, import_react86.useCallback)(
       (e) => {
         if (!zoomable) return;
         const rect = plotRef.current?.getBoundingClientRect();
@@ -17099,7 +17231,7 @@ var LineChart = (0, import_react85.forwardRef)(
       },
       [zoomable]
     );
-    (0, import_react85.useEffect)(() => {
+    (0, import_react86.useEffect)(() => {
       if (!brush) return;
       const onUp = () => {
         const a = Math.min(brush.startPct, brush.currentPct);
@@ -17120,18 +17252,18 @@ var LineChart = (0, import_react85.forwardRef)(
       window.addEventListener("mouseup", onUp);
       return () => window.removeEventListener("mouseup", onUp);
     }, [brush, indexFromPct, visibleRange.start, onZoomChange]);
-    const handleDoubleClick = (0, import_react85.useCallback)(() => {
+    const handleDoubleClick = (0, import_react86.useCallback)(() => {
       if (!zoomable || !zoom) return;
       setZoom(null);
       onZoomChange?.(null);
     }, [zoomable, zoom, onZoomChange]);
-    const handlePlotClick = (0, import_react85.useCallback)(() => {
+    const handlePlotClick = (0, import_react86.useCallback)(() => {
       if (hoveredIdx === null || !onPointClick) return;
       const s = lines[0];
       const p = s?.data[hoveredIdx];
       if (p) onPointClick(p, s.id, visibleRange.start + hoveredIdx);
     }, [hoveredIdx, lines, onPointClick, visibleRange.start]);
-    const resolvedAriaLabel = (0, import_react85.useMemo)(() => {
+    const resolvedAriaLabel = (0, import_react86.useMemo)(() => {
       if (ariaLabel) return ariaLabel;
       const titleText = typeof title === "string" ? title : "";
       const summary = lines.map((s) => {
@@ -17145,11 +17277,11 @@ var LineChart = (0, import_react85.forwardRef)(
     const showX = showAxis === "x" || showAxis === "both";
     const isMulti = (series?.length ?? 0) > 0;
     const tooltipPoint = hoveredIdx !== null ? lines[0]?.data[hoveredIdx] : void 0;
-    const dataXPct = (0, import_react85.useCallback)(
+    const dataXPct = (0, import_react86.useCallback)(
       (i) => (PAD + i * stepX) / W * 100,
       [stepX]
     );
-    const dataYPct = (0, import_react85.useCallback)(
+    const dataYPct = (0, import_react86.useCallback)(
       (v) => (PAD + (1 - (v - lo) / (hi - lo)) * (H - PAD * 2)) / H * 100,
       [lo, hi]
     );
@@ -17457,9 +17589,9 @@ var LineChart = (0, import_react85.forwardRef)(
 LineChart.displayName = "LineChart";
 
 // src/components/LinkButton/LinkButton.tsx
-var import_react86 = require("react");
+var import_react87 = require("react");
 var import_jsx_runtime67 = require("react/jsx-runtime");
-var LinkButton = (0, import_react86.forwardRef)(
+var LinkButton = (0, import_react87.forwardRef)(
   function LinkButton2({
     variant = "primary",
     size = "md",
@@ -17531,16 +17663,16 @@ LinkButton.displayName = "LinkButton";
 
 // src/components/MetricCard/MetricCard.tsx
 var import_icons23 = require("@octaviaflow/icons");
-var import_react89 = require("react");
+var import_react90 = require("react");
 
 // src/components/CountUp/CountUp.tsx
-var import_react87 = require("react");
+var import_react88 = require("react");
 var import_jsx_runtime68 = require("react/jsx-runtime");
 var easeLinear = (t) => t;
 var easeOutCubic = (t) => 1 - Math.pow(1 - t, 3);
 var easeOutQuart = (t) => 1 - Math.pow(1 - t, 4);
 var easeOutExpo = (t) => t === 1 ? 1 : 1 - Math.pow(2, -10 * t);
-var CountUp = (0, import_react87.forwardRef)(
+var CountUp = (0, import_react88.forwardRef)(
   function CountUp2({
     value,
     from = 0,
@@ -17556,9 +17688,9 @@ var CountUp = (0, import_react87.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const [n, setN] = (0, import_react87.useState)(disableAnimation ? value : from);
-    const lastRendered = (0, import_react87.useRef)(disableAnimation ? value : from);
-    (0, import_react87.useEffect)(() => {
+    const [n, setN] = (0, import_react88.useState)(disableAnimation ? value : from);
+    const lastRendered = (0, import_react88.useRef)(disableAnimation ? value : from);
+    (0, import_react88.useEffect)(() => {
       const reduced = typeof window !== "undefined" && window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
       if (disableAnimation || reduced) {
         setN(value);
@@ -17625,7 +17757,7 @@ CountUp.displayName = "CountUp";
 
 // src/components/Sparkline/Sparkline.tsx
 var import_framer_motion26 = require("framer-motion");
-var import_react88 = require("react");
+var import_react89 = require("react");
 var import_jsx_runtime69 = require("react/jsx-runtime");
 var defaultFormat6 = (n) => {
   if (Math.abs(n) >= 1e6) return `${(n / 1e6).toFixed(1)}M`;
@@ -17650,7 +17782,7 @@ function buildSmoothPath(pts) {
 function buildLinePath(pts) {
   return `M${pts[0][0]},${pts[0][1]}` + pts.slice(1).map(([x, y]) => ` L${x},${y}`).join("");
 }
-var Sparkline = (0, import_react88.forwardRef)(
+var Sparkline = (0, import_react89.forwardRef)(
   function Sparkline2({
     data,
     variant = "line",
@@ -17673,11 +17805,11 @@ var Sparkline = (0, import_react88.forwardRef)(
     emptyState,
     ...rest
   }, ref) {
-    const reactId = (0, import_react88.useId)();
+    const reactId = (0, import_react89.useId)();
     const PAD2 = 1;
     const hasData = data.length > 0;
     const canDrawLine = variant === "line" ? data.length >= 2 : hasData;
-    const resolvedAriaLabel = (0, import_react88.useMemo)(() => {
+    const resolvedAriaLabel = (0, import_react89.useMemo)(() => {
       if (ariaLabel) return ariaLabel;
       if (!hasData) return "Sparkline \u2014 no data";
       const first = formatValue(data[0]);
@@ -17974,7 +18106,7 @@ function resolveDeltaTone(trend, direction) {
   }
   return trend === "up" ? "failed" : "success";
 }
-var MetricCard = (0, import_react89.forwardRef)(
+var MetricCard = (0, import_react90.forwardRef)(
   function MetricCard2({
     label,
     labelAs = "h3",
@@ -17997,7 +18129,7 @@ var MetricCard = (0, import_react89.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react89.useId)();
+    const reactId = (0, import_react90.useId)();
     const baseId = providedId ?? `ods-metric-card-${reactId}`;
     const labelId = `${baseId}-label`;
     const valueId = `${baseId}-value`;
@@ -18158,7 +18290,7 @@ MetricCard.displayName = "MetricCard";
 
 // src/components/MultiSelect/MultiSelect.tsx
 var import_framer_motion27 = require("framer-motion");
-var import_react90 = require("react");
+var import_react91 = require("react");
 var import_react_dom10 = require("react-dom");
 var import_icons24 = require("@octaviaflow/icons");
 var import_jsx_runtime71 = require("react/jsx-runtime");
@@ -18172,7 +18304,7 @@ function OverflowTooltip2({
   if (!enabled || content == null || content === "") return children;
   return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(Tooltip, { content, children });
 }
-var MultiSelect = (0, import_react90.forwardRef)(
+var MultiSelect = (0, import_react91.forwardRef)(
   function MultiSelect2({
     options,
     value: controlledValue,
@@ -18195,37 +18327,37 @@ var MultiSelect = (0, import_react90.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react90.useId)();
+    const reactId = (0, import_react91.useId)();
     const baseId = providedId ?? `ods-multiselect-${reactId}`;
-    const [internalValue, setInternalValue] = (0, import_react90.useState)(
+    const [internalValue, setInternalValue] = (0, import_react91.useState)(
       defaultValue ?? []
     );
     const selectedValues = controlledValue ?? internalValue;
-    const [open, setOpen] = (0, import_react90.useState)(false);
-    const [query, setQuery] = (0, import_react90.useState)("");
-    const [activeIdx, setActiveIdx] = (0, import_react90.useState)(0);
-    const [dropdownPos, setDropdownPos] = (0, import_react90.useState)({
+    const [open, setOpen] = (0, import_react91.useState)(false);
+    const [query, setQuery] = (0, import_react91.useState)("");
+    const [activeIdx, setActiveIdx] = (0, import_react91.useState)(0);
+    const [dropdownPos, setDropdownPos] = (0, import_react91.useState)({
       top: 0,
       left: 0,
       width: 0
     });
-    const wrapRef = (0, import_react90.useRef)(null);
-    const tagsRowRef = (0, import_react90.useRef)(null);
-    const searchRef = (0, import_react90.useRef)(null);
-    const dropdownRef = (0, import_react90.useRef)(null);
-    const chipRefs = (0, import_react90.useRef)([]);
-    const commit = (0, import_react90.useCallback)(
+    const wrapRef = (0, import_react91.useRef)(null);
+    const tagsRowRef = (0, import_react91.useRef)(null);
+    const searchRef = (0, import_react91.useRef)(null);
+    const dropdownRef = (0, import_react91.useRef)(null);
+    const chipRefs = (0, import_react91.useRef)([]);
+    const commit = (0, import_react91.useCallback)(
       (next) => {
         if (controlledValue === void 0) setInternalValue(next);
         onChange?.(next);
       },
       [controlledValue, onChange]
     );
-    const selectedSet = (0, import_react90.useMemo)(
+    const selectedSet = (0, import_react91.useMemo)(
       () => new Set(selectedValues),
       [selectedValues]
     );
-    const filteredOptions = (0, import_react90.useMemo)(() => {
+    const filteredOptions = (0, import_react91.useMemo)(() => {
       const base = hideSelected ? options.filter((o) => !selectedSet.has(o.value)) : options;
       if (!query.trim()) return base;
       const q2 = query.trim().toLowerCase();
@@ -18236,7 +18368,7 @@ var MultiSelect = (0, import_react90.forwardRef)(
     const showSearch = searchable ?? options.length > 6;
     const getLabel = (v) => options.find((o) => o.value === v)?.label ?? v;
     const getIcon = (v) => options.find((o) => o.value === v)?.icon;
-    const updatePosition = (0, import_react90.useCallback)(() => {
+    const updatePosition = (0, import_react91.useCallback)(() => {
       if (!wrapRef.current) return;
       const rect = wrapRef.current.getBoundingClientRect();
       setDropdownPos({
@@ -18245,7 +18377,7 @@ var MultiSelect = (0, import_react90.forwardRef)(
         width: rect.width
       });
     }, []);
-    (0, import_react90.useEffect)(() => {
+    (0, import_react91.useEffect)(() => {
       if (!open) return;
       updatePosition();
       window.addEventListener("scroll", updatePosition, true);
@@ -18255,7 +18387,7 @@ var MultiSelect = (0, import_react90.forwardRef)(
         window.removeEventListener("resize", updatePosition);
       };
     }, [open, updatePosition]);
-    (0, import_react90.useEffect)(() => {
+    (0, import_react91.useEffect)(() => {
       if (!open) return;
       const onDoc = (e) => {
         const t = e.target;
@@ -18267,15 +18399,15 @@ var MultiSelect = (0, import_react90.forwardRef)(
       document.addEventListener("mousedown", onDoc);
       return () => document.removeEventListener("mousedown", onDoc);
     }, [open]);
-    (0, import_react90.useEffect)(() => {
+    (0, import_react91.useEffect)(() => {
       if (open && showSearch) {
         requestAnimationFrame(() => searchRef.current?.focus());
       }
     }, [open, showSearch]);
-    (0, import_react90.useEffect)(() => setActiveIdx(0), [query, open]);
-    const [fitCount, setFitCount] = (0, import_react90.useState)(selectedValues.length);
-    const [tick, setTick] = (0, import_react90.useState)(0);
-    (0, import_react90.useLayoutEffect)(() => {
+    (0, import_react91.useEffect)(() => setActiveIdx(0), [query, open]);
+    const [fitCount, setFitCount] = (0, import_react91.useState)(selectedValues.length);
+    const [tick, setTick] = (0, import_react91.useState)(0);
+    (0, import_react91.useLayoutEffect)(() => {
       if (maxVisibleTags !== void 0) {
         setFitCount(Math.min(selectedValues.length, maxVisibleTags));
         return;
@@ -18302,7 +18434,7 @@ var MultiSelect = (0, import_react90.forwardRef)(
         count = Math.max(1, count - 1);
       setFitCount(count);
     }, [tick, selectedValues, maxVisibleTags]);
-    (0, import_react90.useEffect)(() => {
+    (0, import_react91.useEffect)(() => {
       if (typeof ResizeObserver === "undefined") return;
       const row = tagsRowRef.current;
       if (!row) return;
@@ -18310,7 +18442,7 @@ var MultiSelect = (0, import_react90.forwardRef)(
       ro.observe(row);
       return () => ro.disconnect();
     }, []);
-    const addValue = (0, import_react90.useCallback)(
+    const addValue = (0, import_react91.useCallback)(
       (val) => {
         if (maxTags && selectedValues.length >= maxTags) return;
         commit([...selectedValues, val]);
@@ -18320,13 +18452,13 @@ var MultiSelect = (0, import_react90.forwardRef)(
       },
       [selectedValues, maxTags, commit]
     );
-    const removeValue = (0, import_react90.useCallback)(
+    const removeValue = (0, import_react91.useCallback)(
       (val) => {
         commit(selectedValues.filter((v) => v !== val));
       },
       [selectedValues, commit]
     );
-    const toggleValue = (0, import_react90.useCallback)(
+    const toggleValue = (0, import_react91.useCallback)(
       (val) => {
         if (selectedSet.has(val)) {
           removeValue(val);
@@ -18336,11 +18468,11 @@ var MultiSelect = (0, import_react90.forwardRef)(
       },
       [selectedSet, addValue, removeValue]
     );
-    const clearAll = (0, import_react90.useCallback)(() => {
+    const clearAll = (0, import_react91.useCallback)(() => {
       commit([]);
       setQuery("");
     }, [commit]);
-    const handleSearchKey = (0, import_react90.useCallback)(
+    const handleSearchKey = (0, import_react91.useCallback)(
       (e) => {
         if (e.key === "Escape") {
           setOpen(false);
@@ -18423,7 +18555,10 @@ var MultiSelect = (0, import_react90.forwardRef)(
               "aria-label": labelId ? void 0 : ariaLabel ?? placeholder,
               "aria-disabled": disabled,
               tabIndex: disabled ? -1 : 0,
-              onClick: () => !disabled && setOpen(true),
+              onClick: () => {
+                if (disabled) return;
+                setOpen((prev) => !prev);
+              },
               onKeyDown: (e) => {
                 if (disabled) return;
                 if (!open && (e.key === "Enter" || e.key === " " || e.key === "ArrowDown")) {
@@ -18623,10 +18758,10 @@ var MultiSelect = (0, import_react90.forwardRef)(
 MultiSelect.displayName = "MultiSelect";
 
 // src/components/NumberInput/NumberInput.tsx
-var import_react91 = require("react");
+var import_react92 = require("react");
 var import_icons25 = require("@octaviaflow/icons");
 var import_jsx_runtime72 = require("react/jsx-runtime");
-var NumberInput = (0, import_react91.forwardRef)(
+var NumberInput = (0, import_react92.forwardRef)(
   function NumberInput2({
     label,
     value,
@@ -18648,11 +18783,11 @@ var NumberInput = (0, import_react91.forwardRef)(
     "aria-describedby": consumerDescribedBy,
     ...rest
   }, ref) {
-    const reactId = (0, import_react91.useId)();
+    const reactId = (0, import_react92.useId)();
     const inputId = providedId ?? `ods-num-${reactId}`;
     const labelId = label ? `${inputId}-label` : void 0;
     const hintId = error || helperText ? `${inputId}-hint` : void 0;
-    const clamp = (0, import_react91.useCallback)(
+    const clamp = (0, import_react92.useCallback)(
       (v) => {
         if (typeof min === "number") v = Math.max(min, v);
         if (typeof max === "number") v = Math.min(max, v);
@@ -18754,9 +18889,9 @@ var NumberInput = (0, import_react91.forwardRef)(
 NumberInput.displayName = "NumberInput";
 
 // src/components/OTPInput/OTPInput.tsx
-var import_react92 = require("react");
+var import_react93 = require("react");
 var import_jsx_runtime73 = require("react/jsx-runtime");
-var OTPInput = (0, import_react92.forwardRef)(
+var OTPInput = (0, import_react93.forwardRef)(
   function OTPInput2({
     label,
     length = 6,
@@ -18774,16 +18909,16 @@ var OTPInput = (0, import_react92.forwardRef)(
     "aria-label": ariaLabel,
     ...rest
   }, ref) {
-    const reactId = (0, import_react92.useId)();
+    const reactId = (0, import_react93.useId)();
     const baseId = providedId ?? `ods-otp-${reactId}`;
     const labelId = label ? `${baseId}-label` : void 0;
     const hintId = error ? `${baseId}-hint` : void 0;
-    const refs = (0, import_react92.useRef)([]);
+    const refs = (0, import_react93.useRef)([]);
     const resolvedMode = mode ?? (type === "alphanumeric" ? "alphanumeric" : mask ? "pin" : "otp");
     const isNumeric = resolvedMode !== "alphanumeric";
     const isMasked = mask ?? resolvedMode === "pin";
     const pattern = isNumeric ? /[^0-9]/g : /[^a-zA-Z0-9]/g;
-    (0, import_react92.useImperativeHandle)(
+    (0, import_react93.useImperativeHandle)(
       ref,
       () => ({
         focus: () => {
@@ -18797,7 +18932,7 @@ var OTPInput = (0, import_react92.forwardRef)(
       }),
       [value, length, onChange]
     );
-    const setCharAt = (0, import_react92.useCallback)(
+    const setCharAt = (0, import_react93.useCallback)(
       (idx, ch) => {
         const cleaned = ch.replace(pattern, "").slice(0, 1);
         const chars = value.split("");
@@ -18920,7 +19055,7 @@ function PageHeader({
 
 // src/components/Pagination/Pagination.tsx
 var import_icons26 = require("@octaviaflow/icons");
-var import_react93 = require("react");
+var import_react94 = require("react");
 var import_jsx_runtime75 = require("react/jsx-runtime");
 function buildPageRange(totalPages, current, siblingCount, boundaryCount) {
   const totalShown = boundaryCount * 2 + siblingCount * 2 + 3;
@@ -18966,7 +19101,7 @@ function buildPageRange(totalPages, current, siblingCount, boundaryCount) {
     ) === i
   );
 }
-var Pagination = (0, import_react93.forwardRef)(
+var Pagination = (0, import_react94.forwardRef)(
   function Pagination2({
     totalItems,
     pageSize,
@@ -18989,13 +19124,13 @@ var Pagination = (0, import_react93.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react93.useId)();
+    const reactId = (0, import_react94.useId)();
     const baseId = providedId ?? `ods-pagination-${reactId}`;
     const totalPages = Math.max(
       1,
       Math.ceil(Math.max(0, totalItems) / Math.max(1, pageSize))
     );
-    const [internalPage, setInternalPage] = (0, import_react93.useState)(
+    const [internalPage, setInternalPage] = (0, import_react94.useState)(
       Math.min(Math.max(1, defaultPage), totalPages)
     );
     const isControlled = controlledPage !== void 0;
@@ -19003,7 +19138,7 @@ var Pagination = (0, import_react93.forwardRef)(
       totalPages,
       Math.max(1, isControlled ? controlledPage : internalPage)
     );
-    const goTo = (0, import_react93.useCallback)(
+    const goTo = (0, import_react94.useCallback)(
       (next) => {
         const clamped = Math.min(totalPages, Math.max(1, next));
         if (clamped === currentPage) return;
@@ -19012,14 +19147,14 @@ var Pagination = (0, import_react93.forwardRef)(
       },
       [currentPage, isControlled, onPageChange, totalPages]
     );
-    const pages = (0, import_react93.useMemo)(
+    const pages = (0, import_react94.useMemo)(
       () => buildPageRange(totalPages, currentPage, siblingCount, boundaryCount),
       [totalPages, currentPage, siblingCount, boundaryCount]
     );
     const from = totalItems === 0 ? 0 : (currentPage - 1) * pageSize + 1;
     const to = Math.min(totalItems, currentPage * pageSize);
     const totalContent = formatTotal ? formatTotal({ from, to, total: totalItems }) : `Showing ${from.toLocaleString()}\u2013${to.toLocaleString()} of ${totalItems.toLocaleString()}`;
-    const [jumpValue, setJumpValue] = (0, import_react93.useState)("");
+    const [jumpValue, setJumpValue] = (0, import_react94.useState)("");
     const commitJump = (raw) => {
       const parsed = Number.parseInt(raw, 10);
       if (Number.isFinite(parsed)) goTo(parsed);
@@ -19200,11 +19335,11 @@ var Pagination = (0, import_react93.forwardRef)(
 Pagination.displayName = "Pagination";
 
 // src/components/PasswordInput/PasswordInput.tsx
-var import_react95 = require("react");
+var import_react96 = require("react");
 var import_icons27 = require("@octaviaflow/icons");
 
 // src/hooks/usePasswordStrength.ts
-var import_react94 = require("react");
+var import_react95 = require("react");
 var DEFAULT_PASSWORD_RULES = [
   { id: "length-8", label: "At least 8 characters", test: /.{8,}/ },
   { id: "lowercase", label: "A lower-case letter", test: /[a-z]/ },
@@ -19212,7 +19347,7 @@ var DEFAULT_PASSWORD_RULES = [
   { id: "digit", label: "A digit", test: /\d/ }
 ];
 function usePasswordStrength(value, rules = DEFAULT_PASSWORD_RULES) {
-  return (0, import_react94.useMemo)(() => {
+  return (0, import_react95.useMemo)(() => {
     const evaluated = rules.map((r) => ({
       id: r.id,
       label: r.label,
@@ -19250,7 +19385,7 @@ var strengthLabels = [
   "Strong",
   "Very strong"
 ];
-var PasswordInput = (0, import_react95.forwardRef)(
+var PasswordInput = (0, import_react96.forwardRef)(
   function PasswordInput2({
     label,
     value,
@@ -19272,11 +19407,11 @@ var PasswordInput = (0, import_react95.forwardRef)(
     "aria-describedby": consumerDescribedBy,
     ...rest
   }, ref) {
-    const reactId = (0, import_react95.useId)();
+    const reactId = (0, import_react96.useId)();
     const inputId = providedId ?? `ods-pwd-${reactId}`;
     const labelId = label ? `${inputId}-label` : void 0;
     const hintId = error || helperText ? `${inputId}-hint` : void 0;
-    const [shown, setShown] = (0, import_react95.useState)(false);
+    const [shown, setShown] = (0, import_react96.useState)(false);
     const handle = (e) => onChange?.(e.target.value);
     const derived = usePasswordStrength(value, strengthRules ?? []);
     const ruleDriven = (strengthRules?.length ?? 0) > 0;
@@ -19416,7 +19551,7 @@ var PasswordInput = (0, import_react95.forwardRef)(
 PasswordInput.displayName = "PasswordInput";
 
 // src/components/PhoneInput/PhoneInput.tsx
-var import_react96 = require("react");
+var import_react97 = require("react");
 var import_icons28 = require("@octaviaflow/icons");
 var import_jsx_runtime77 = require("react/jsx-runtime");
 var DEFAULT_COUNTRIES = [
@@ -19429,7 +19564,7 @@ var DEFAULT_COUNTRIES = [
   { code: "AU", name: "Australia", dialCode: "+61", flag: "\u{1F1E6}\u{1F1FA}" },
   { code: "BR", name: "Brazil", dialCode: "+55", flag: "\u{1F1E7}\u{1F1F7}" }
 ];
-var PhoneInput = (0, import_react96.forwardRef)(
+var PhoneInput = (0, import_react97.forwardRef)(
   function PhoneInput2({
     label,
     value,
@@ -19452,20 +19587,20 @@ var PhoneInput = (0, import_react96.forwardRef)(
     "aria-describedby": consumerDescribedBy,
     ...rest
   }, ref) {
-    const reactId = (0, import_react96.useId)();
+    const reactId = (0, import_react97.useId)();
     const baseId = providedId ?? `ods-phone-${reactId}`;
     const inputId = `${baseId}-input`;
     const labelId = label ? `${baseId}-label` : void 0;
     const hintId = error || helperText ? `${baseId}-hint` : void 0;
     const listboxId = `${baseId}-listbox`;
     const countryBtnId = `${baseId}-country`;
-    const [open, setOpen] = (0, import_react96.useState)(false);
-    const [activeIdx, setActiveIdx] = (0, import_react96.useState)(0);
-    const [query, setQuery] = (0, import_react96.useState)("");
-    const fieldRef = (0, import_react96.useRef)(null);
-    const menuRef = (0, import_react96.useRef)(null);
-    const listRef = (0, import_react96.useRef)(null);
-    const searchRef = (0, import_react96.useRef)(null);
+    const [open, setOpen] = (0, import_react97.useState)(false);
+    const [activeIdx, setActiveIdx] = (0, import_react97.useState)(0);
+    const [query, setQuery] = (0, import_react97.useState)("");
+    const fieldRef = (0, import_react97.useRef)(null);
+    const menuRef = (0, import_react97.useRef)(null);
+    const listRef = (0, import_react97.useRef)(null);
+    const searchRef = (0, import_react97.useRef)(null);
     const country = countries.find((c) => c.code === countryCode) ?? countries[0];
     const showSearch = searchable ?? countries.length > 8;
     const filteredCountries = (() => {
@@ -19475,7 +19610,7 @@ var PhoneInput = (0, import_react96.forwardRef)(
         (c) => c.name.toLowerCase().includes(q2) || c.dialCode.includes(q2) || c.code.toLowerCase().includes(q2)
       );
     })();
-    (0, import_react96.useEffect)(() => {
+    (0, import_react97.useEffect)(() => {
       if (!open) return;
       const onDocMouseDown = (e) => {
         const t = e.target;
@@ -19493,7 +19628,7 @@ var PhoneInput = (0, import_react96.forwardRef)(
         document.removeEventListener("keydown", onDocKey);
       };
     }, [open]);
-    (0, import_react96.useEffect)(() => {
+    (0, import_react97.useEffect)(() => {
       if (!open) {
         setQuery("");
         return;
@@ -19501,10 +19636,10 @@ var PhoneInput = (0, import_react96.forwardRef)(
       const idx = countries.findIndex((c) => c.code === country.code);
       setActiveIdx(idx === -1 ? 0 : idx);
     }, [open, countries, country.code]);
-    (0, import_react96.useEffect)(() => {
+    (0, import_react97.useEffect)(() => {
       setActiveIdx(0);
     }, [query]);
-    const handleTriggerKey = (0, import_react96.useCallback)(
+    const handleTriggerKey = (0, import_react97.useCallback)(
       (e) => {
         if (disabled) return;
         if (e.key === "ArrowDown" || e.key === "Enter" || e.key === " ") {
@@ -19514,7 +19649,7 @@ var PhoneInput = (0, import_react96.forwardRef)(
       },
       [disabled]
     );
-    const handleNavKey = (0, import_react96.useCallback)(
+    const handleNavKey = (0, import_react97.useCallback)(
       (e) => {
         if (e.key === "ArrowDown") {
           e.preventDefault();
@@ -19541,7 +19676,7 @@ var PhoneInput = (0, import_react96.forwardRef)(
       },
       [filteredCountries, activeIdx, onCountryChange]
     );
-    (0, import_react96.useEffect)(() => {
+    (0, import_react97.useEffect)(() => {
       if (!open) return;
       if (showSearch) searchRef.current?.focus();
       else listRef.current?.focus();
@@ -20009,7 +20144,7 @@ function getAllCountries(locale = "en") {
 // src/components/PipelineCard/PipelineCard.tsx
 var import_icons29 = require("@octaviaflow/icons");
 var import_framer_motion28 = require("framer-motion");
-var import_react97 = require("react");
+var import_react98 = require("react");
 var import_jsx_runtime78 = require("react/jsx-runtime");
 var STATUS_LABEL5 = {
   queued: "Queued",
@@ -20156,7 +20291,7 @@ function StatusRing({
     }
   );
 }
-var PipelineCard = (0, import_react97.forwardRef)(
+var PipelineCard = (0, import_react98.forwardRef)(
   function PipelineCard2({
     name,
     nameAs = "h3",
@@ -20186,7 +20321,7 @@ var PipelineCard = (0, import_react97.forwardRef)(
     ...rest
   }, ref) {
     const reducedMotion = (0, import_framer_motion28.useReducedMotion)() ?? false;
-    const reactId = (0, import_react97.useId)();
+    const reactId = (0, import_react98.useId)();
     const baseId = providedId ?? `ods-pipeline-card-${reactId}`;
     const nameId = `${baseId}-name`;
     const isInteractive = Boolean(href || onClick) && !disabled && !loading;
@@ -20398,7 +20533,7 @@ var PipelineCard = (0, import_react97.forwardRef)(
 PipelineCard.displayName = "PipelineCard";
 
 // src/components/Popover/Popover.tsx
-var import_react98 = require("react");
+var import_react99 = require("react");
 var import_react_dom11 = require("react-dom");
 var import_jsx_runtime79 = require("react/jsx-runtime");
 function computePosition4(rect, popRect, placement, offset) {
@@ -20430,31 +20565,31 @@ function Popover({
   children,
   className
 }) {
-  const [openState, setOpenState] = (0, import_react98.useState)(defaultOpen);
+  const [openState, setOpenState] = (0, import_react99.useState)(defaultOpen);
   const open = openProp ?? openState;
-  const setOpen = (0, import_react98.useCallback)(
+  const setOpen = (0, import_react99.useCallback)(
     (v) => {
       if (openProp === void 0) setOpenState(v);
       onOpenChange?.(v);
     },
     [openProp, onOpenChange]
   );
-  const triggerRef = (0, import_react98.useRef)(null);
-  const popRef = (0, import_react98.useRef)(null);
-  const [coords, setCoords] = (0, import_react98.useState)(null);
-  const reposition = (0, import_react98.useCallback)(() => {
+  const triggerRef = (0, import_react99.useRef)(null);
+  const popRef = (0, import_react99.useRef)(null);
+  const [coords, setCoords] = (0, import_react99.useState)(null);
+  const reposition = (0, import_react99.useCallback)(() => {
     if (!triggerRef.current || !popRef.current) return;
     const trigRect = triggerRef.current.getBoundingClientRect();
     const popRect = popRef.current.getBoundingClientRect();
     setCoords(computePosition4(trigRect, popRect, placement, offset));
   }, [placement, offset]);
-  (0, import_react98.useLayoutEffect)(() => {
+  (0, import_react99.useLayoutEffect)(() => {
     if (!open) return;
     reposition();
     const id = requestAnimationFrame(reposition);
     return () => cancelAnimationFrame(id);
   }, [open, reposition, content]);
-  (0, import_react98.useEffect)(() => {
+  (0, import_react99.useEffect)(() => {
     if (!open) return;
     const onScroll = () => reposition();
     window.addEventListener("scroll", onScroll, true);
@@ -20464,7 +20599,7 @@ function Popover({
       window.removeEventListener("resize", onScroll);
     };
   }, [open, reposition]);
-  (0, import_react98.useEffect)(() => {
+  (0, import_react99.useEffect)(() => {
     if (!open || !closeOnClickOutside) return;
     const onDoc = (e) => {
       const t = e.target;
@@ -20475,7 +20610,7 @@ function Popover({
     document.addEventListener("mousedown", onDoc);
     return () => document.removeEventListener("mousedown", onDoc);
   }, [open, closeOnClickOutside, setOpen]);
-  (0, import_react98.useEffect)(() => {
+  (0, import_react99.useEffect)(() => {
     if (!open || !closeOnEsc) return;
     const onKey = (e) => {
       if (e.key === "Escape") setOpen(false);
@@ -20528,12 +20663,12 @@ function Popover({
 
 // src/components/PricingCard/PricingCard.tsx
 var import_icons30 = require("@octaviaflow/icons");
-var import_react99 = require("react");
+var import_react100 = require("react");
 var import_jsx_runtime80 = require("react/jsx-runtime");
 function isStructuredFeature(f) {
   return typeof f === "object" && f !== null && "text" in f;
 }
-var PricingCard = (0, import_react99.forwardRef)(
+var PricingCard = (0, import_react100.forwardRef)(
   function PricingCard2({
     name,
     nameAs = "h3",
@@ -20549,7 +20684,7 @@ var PricingCard = (0, import_react99.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react99.useId)();
+    const reactId = (0, import_react100.useId)();
     const baseId = providedId ?? `ods-pricing-card-${reactId}`;
     const nameId = `${baseId}-name`;
     const descId = description ? `${baseId}-desc` : void 0;
@@ -20635,7 +20770,7 @@ PricingCard.displayName = "PricingCard";
 
 // src/components/ProductCard/ProductCard.tsx
 var import_icons31 = require("@octaviaflow/icons");
-var import_react100 = require("react");
+var import_react101 = require("react");
 var import_jsx_runtime81 = require("react/jsx-runtime");
 function Stars({ value, max = 5, count }) {
   return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
@@ -20658,7 +20793,7 @@ function Stars({ value, max = 5, count }) {
     }
   );
 }
-var ProductCard = (0, import_react100.forwardRef)(
+var ProductCard = (0, import_react101.forwardRef)(
   function ProductCard2({
     image,
     imageAspect = "4/3",
@@ -20679,7 +20814,7 @@ var ProductCard = (0, import_react100.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react100.useId)();
+    const reactId = (0, import_react101.useId)();
     const baseId = providedId ?? `ods-product-card-${reactId}`;
     const nameId = `${baseId}-name`;
     const descId = description ? `${baseId}-desc` : void 0;
@@ -20777,9 +20912,9 @@ var ProductCard = (0, import_react100.forwardRef)(
 ProductCard.displayName = "ProductCard";
 
 // src/components/ProgressBar/ProgressBar.tsx
-var import_react101 = require("react");
+var import_react102 = require("react");
 var import_jsx_runtime82 = require("react/jsx-runtime");
-var ProgressBar = (0, import_react101.forwardRef)(
+var ProgressBar = (0, import_react102.forwardRef)(
   function ProgressBar2({
     value,
     min = 0,
@@ -20795,7 +20930,7 @@ var ProgressBar = (0, import_react101.forwardRef)(
     "aria-label": ariaLabel,
     ...rest
   }, ref) {
-    const reactId = (0, import_react101.useId)();
+    const reactId = (0, import_react102.useId)();
     const baseId = providedId ?? `ods-progress-${reactId}`;
     const labelId = label ? `${baseId}-label` : void 0;
     const clamped = value === void 0 ? 0 : Math.min(max, Math.max(min, value));
@@ -20861,9 +20996,9 @@ var ProgressBar = (0, import_react101.forwardRef)(
 ProgressBar.displayName = "ProgressBar";
 
 // src/components/ProgressRing/ProgressRing.tsx
-var import_react102 = require("react");
+var import_react103 = require("react");
 var import_jsx_runtime83 = require("react/jsx-runtime");
-var ProgressRing = (0, import_react102.forwardRef)(
+var ProgressRing = (0, import_react103.forwardRef)(
   function ProgressRing2({
     value,
     max = 100,
@@ -20948,10 +21083,10 @@ var ProgressRing = (0, import_react102.forwardRef)(
 ProgressRing.displayName = "ProgressRing";
 
 // src/components/PromptInput/PromptInput.tsx
-var import_react103 = require("react");
+var import_react104 = require("react");
 var import_icons32 = require("@octaviaflow/icons");
 var import_jsx_runtime84 = require("react/jsx-runtime");
-var PromptInput = (0, import_react103.forwardRef)(
+var PromptInput = (0, import_react104.forwardRef)(
   function PromptInput2({
     value,
     defaultValue = "",
@@ -20986,28 +21121,28 @@ var PromptInput = (0, import_react103.forwardRef)(
     "aria-labelledby": ariaLabelledBy,
     ...rest
   }, ref) {
-    const reactId = (0, import_react103.useId)();
+    const reactId = (0, import_react104.useId)();
     const baseId = providedId ?? `ods-prompt-${reactId}`;
     const textareaId = `${baseId}-textarea`;
     const labelId = label ? `${baseId}-label` : void 0;
     const suggestionsId = `${baseId}-suggestions`;
     const counterId = `${baseId}-counter`;
-    const taRef = (0, import_react103.useRef)(null);
-    const [internal, setInternal] = (0, import_react103.useState)(defaultValue);
+    const taRef = (0, import_react104.useRef)(null);
+    const [internal, setInternal] = (0, import_react104.useState)(defaultValue);
     const v = value ?? internal;
     const isControlled = value !== void 0;
-    const [suggestionsOpen, setSuggestionsOpen] = (0, import_react103.useState)(false);
-    const [suggestionIndex, setSuggestionIndex] = (0, import_react103.useState)(0);
-    const [isDragOver, setIsDragOver] = (0, import_react103.useState)(false);
-    const [historyIdx, setHistoryIdx] = (0, import_react103.useState)(null);
-    const setValue = (0, import_react103.useCallback)(
+    const [suggestionsOpen, setSuggestionsOpen] = (0, import_react104.useState)(false);
+    const [suggestionIndex, setSuggestionIndex] = (0, import_react104.useState)(0);
+    const [isDragOver, setIsDragOver] = (0, import_react104.useState)(false);
+    const [historyIdx, setHistoryIdx] = (0, import_react104.useState)(null);
+    const setValue = (0, import_react104.useCallback)(
       (next) => {
         if (!isControlled) setInternal(next);
         onChange?.(next);
       },
       [isControlled, onChange]
     );
-    (0, import_react103.useImperativeHandle)(
+    (0, import_react104.useImperativeHandle)(
       ref,
       () => ({
         focus: () => taRef.current?.focus(),
@@ -21041,7 +21176,7 @@ var PromptInput = (0, import_react103.forwardRef)(
       // biome-ignore lint/correctness/useExhaustiveDependencies: handleSubmit closes over up-to-date locals each render.
       [v, setValue]
     );
-    (0, import_react103.useEffect)(() => {
+    (0, import_react104.useEffect)(() => {
       const el = taRef.current;
       if (!el) return;
       const computed = window.getComputedStyle(el);
@@ -21424,14 +21559,14 @@ var PromptInput = (0, import_react103.forwardRef)(
 PromptInput.displayName = "PromptInput";
 
 // src/components/Quote/Quote.tsx
-var import_react104 = require("react");
+var import_react105 = require("react");
 var import_jsx_runtime85 = (
   // Left-double-quotation-mark (U+201C) — the typographic open
   // mark. `aria-hidden` because screen readers should hear the
   // quote content itself, not "left double quote".
   require("react/jsx-runtime")
 );
-var Quote = (0, import_react104.forwardRef)(function Quote2({
+var Quote = (0, import_react105.forwardRef)(function Quote2({
   variant = "default",
   size = "md",
   author,
@@ -21468,22 +21603,22 @@ var Quote = (0, import_react104.forwardRef)(function Quote2({
 Quote.displayName = "Quote";
 
 // src/components/Radio/Radio.tsx
-var import_react106 = require("react");
+var import_react107 = require("react");
 var import_react_aria10 = require("react-aria");
 
 // src/components/Radio/RadioGroup.tsx
-var import_react105 = require("react");
+var import_react106 = require("react");
 var import_react_aria9 = require("react-aria");
 var import_jsx_runtime86 = require("react/jsx-runtime");
-var RadioGroupContext = (0, import_react105.createContext)(null);
+var RadioGroupContext = (0, import_react106.createContext)(null);
 function useRadioGroupContext() {
-  const context = (0, import_react105.useContext)(RadioGroupContext);
+  const context = (0, import_react106.useContext)(RadioGroupContext);
   if (!context) {
     throw new Error("Radio must be used within a RadioGroup");
   }
   return context;
 }
-var RadioGroup = (0, import_react105.forwardRef)(
+var RadioGroup = (0, import_react106.forwardRef)(
   function RadioGroup2({
     value,
     defaultValue,
@@ -21503,10 +21638,10 @@ var RadioGroup = (0, import_react105.forwardRef)(
     "aria-describedby": consumerDescribedBy,
     ...rest
   }, ref) {
-    const reactId = (0, import_react105.useId)();
+    const reactId = (0, import_react106.useId)();
     const baseId = providedId ?? `ods-radio-group-${reactId}`;
     const hintId = error || helperText ? `${baseId}-hint` : void 0;
-    const innerRef = (0, import_react105.useRef)(null);
+    const innerRef = (0, import_react106.useRef)(null);
     const describedBy = [consumerDescribedBy, hintId].filter(Boolean).join(" ") || void 0;
     const ariaProps = {
       // react-aria wants a string label for its `<label>` association,
@@ -21567,7 +21702,7 @@ RadioGroup.displayName = "RadioGroup";
 
 // src/components/Radio/Radio.tsx
 var import_jsx_runtime87 = require("react/jsx-runtime");
-var Radio = (0, import_react106.forwardRef)(function Radio2({
+var Radio = (0, import_react107.forwardRef)(function Radio2({
   value,
   label,
   description,
@@ -21577,7 +21712,7 @@ var Radio = (0, import_react106.forwardRef)(function Radio2({
   ...props
 }, forwardedRef) {
   const state = useRadioGroupContext();
-  const innerRef = (0, import_react106.useRef)(null);
+  const innerRef = (0, import_react107.useRef)(null);
   const setRef = (node) => {
     innerRef.current = node;
     if (typeof forwardedRef === "function") forwardedRef(node);
@@ -21650,9 +21785,9 @@ var Radio = (0, import_react106.forwardRef)(function Radio2({
 Radio.displayName = "Radio";
 
 // src/components/RangeSlider/RangeSlider.tsx
-var import_react107 = require("react");
+var import_react108 = require("react");
 var import_jsx_runtime88 = require("react/jsx-runtime");
-var RangeSlider = (0, import_react107.forwardRef)(
+var RangeSlider = (0, import_react108.forwardRef)(
   function RangeSlider2({
     label,
     value,
@@ -21672,7 +21807,7 @@ var RangeSlider = (0, import_react107.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react107.useId)();
+    const reactId = (0, import_react108.useId)();
     const baseId = providedId ?? `ods-range-${reactId}`;
     const labelId = label ? `${baseId}-label` : void 0;
     const hintId = error || helperText ? `${baseId}-hint` : void 0;
@@ -21784,10 +21919,10 @@ var RangeSlider = (0, import_react107.forwardRef)(
 RangeSlider.displayName = "RangeSlider";
 
 // src/components/Rating/Rating.tsx
-var import_react108 = require("react");
+var import_react109 = require("react");
 var import_icons33 = require("@octaviaflow/icons");
 var import_jsx_runtime89 = require("react/jsx-runtime");
-var Rating = (0, import_react108.forwardRef)(function Rating2({
+var Rating = (0, import_react109.forwardRef)(function Rating2({
   value,
   onChange,
   max = 5,
@@ -21803,7 +21938,7 @@ var Rating = (0, import_react108.forwardRef)(function Rating2({
   "aria-label": ariaLabel,
   ...rest
 }, ref) {
-  const [hover, setHover] = (0, import_react108.useState)(null);
+  const [hover, setHover] = (0, import_react109.useState)(null);
   const display = hover ?? value;
   const interactive = !readOnly && !disabled;
   const Empty = icon === "heart" ? import_icons33.FavoriteIcon : import_icons33.StarIcon;
@@ -21911,10 +22046,10 @@ var Rating = (0, import_react108.forwardRef)(function Rating2({
 Rating.displayName = "Rating";
 
 // src/components/Rating/BinaryRating.tsx
-var import_react109 = require("react");
+var import_react110 = require("react");
 var import_icons34 = require("@octaviaflow/icons");
 var import_jsx_runtime90 = require("react/jsx-runtime");
-var BinaryRating = (0, import_react109.forwardRef)(
+var BinaryRating = (0, import_react110.forwardRef)(
   function BinaryRating2({
     value,
     onChange,
@@ -22022,7 +22157,7 @@ function BinaryButton({
 }
 
 // src/components/Resizable/Resizable.tsx
-var import_react110 = require("react");
+var import_react111 = require("react");
 var import_jsx_runtime91 = require("react/jsx-runtime");
 function setDragOverlay(direction) {
   const ID = "ods-resizable-drag-overlay";
@@ -22039,7 +22174,7 @@ function setDragOverlay(direction) {
   }
   el.style.cursor = direction === "horizontal" ? "col-resize" : "row-resize";
 }
-var Resizable = (0, import_react110.forwardRef)(
+var Resizable = (0, import_react111.forwardRef)(
   function Resizable2({
     direction = "horizontal",
     children,
@@ -22053,17 +22188,17 @@ var Resizable = (0, import_react110.forwardRef)(
     ariaLabel = "Resize panels",
     ...rest
   }, ref) {
-    const wrapRef = (0, import_react110.useRef)(null);
-    const draggingRef = (0, import_react110.useRef)(false);
-    const [isDragging, setIsDragging] = (0, import_react110.useState)(false);
-    const [split, setSplit] = (0, import_react110.useState)(0);
-    const [total, setTotal] = (0, import_react110.useState)(0);
+    const wrapRef = (0, import_react111.useRef)(null);
+    const draggingRef = (0, import_react111.useRef)(false);
+    const [isDragging, setIsDragging] = (0, import_react111.useState)(false);
+    const [split, setSplit] = (0, import_react111.useState)(0);
+    const [total, setTotal] = (0, import_react111.useState)(0);
     const setRef = (node) => {
       wrapRef.current = node;
       if (typeof ref === "function") ref(node);
       else if (ref) ref.current = node;
     };
-    (0, import_react110.useLayoutEffect)(() => {
+    (0, import_react111.useLayoutEffect)(() => {
       const el = wrapRef.current;
       if (!el) return;
       const t = direction === "horizontal" ? el.offsetWidth : el.offsetHeight;
@@ -22087,7 +22222,7 @@ var Resizable = (0, import_react110.forwardRef)(
       }
       setSplit(defaultSplit >= 1 ? defaultSplit : t * defaultSplit);
     }, []);
-    (0, import_react110.useEffect)(() => {
+    (0, import_react111.useEffect)(() => {
       const el = wrapRef.current;
       if (!el || typeof ResizeObserver === "undefined") return;
       const ro = new ResizeObserver(() => {
@@ -22101,7 +22236,7 @@ var Resizable = (0, import_react110.forwardRef)(
       ro.observe(el);
       return () => ro.disconnect();
     }, [direction, minSecond]);
-    const persist = (0, import_react110.useCallback)(
+    const persist = (0, import_react111.useCallback)(
       (next) => {
         onSplitChange?.(next);
         if (storageKey && typeof window !== "undefined" && total > 0) {
@@ -22120,7 +22255,7 @@ var Resizable = (0, import_react110.forwardRef)(
       setIsDragging(true);
       setDragOverlay(direction);
     };
-    (0, import_react110.useEffect)(() => {
+    (0, import_react111.useEffect)(() => {
       const onMove = (e) => {
         if (!draggingRef.current) return;
         const el = wrapRef.current;
@@ -22236,7 +22371,7 @@ var Resizable = (0, import_react110.forwardRef)(
   }
 );
 Resizable.displayName = "Resizable";
-var ResizablePanel = (0, import_react110.forwardRef)(
+var ResizablePanel = (0, import_react111.forwardRef)(
   function ResizablePanel2({
     defaultSize = 240,
     minSize = 120,
@@ -22249,11 +22384,11 @@ var ResizablePanel = (0, import_react110.forwardRef)(
     ...rest
   }, ref) {
     const isVertical = side === "bottom";
-    const [internal, setInternal] = (0, import_react110.useState)(sizeProp ?? defaultSize);
+    const [internal, setInternal] = (0, import_react111.useState)(sizeProp ?? defaultSize);
     const size = sizeProp ?? internal;
-    const draggingRef = (0, import_react110.useRef)(false);
-    const [isDragging, setIsDragging] = (0, import_react110.useState)(false);
-    const startRef = (0, import_react110.useRef)({ at: 0, size });
+    const draggingRef = (0, import_react111.useRef)(false);
+    const [isDragging, setIsDragging] = (0, import_react111.useState)(false);
+    const startRef = (0, import_react111.useRef)({ at: 0, size });
     const onPointerDown = (e) => {
       e.preventDefault();
       e.currentTarget.setPointerCapture(e.pointerId);
@@ -22265,7 +22400,7 @@ var ResizablePanel = (0, import_react110.forwardRef)(
       };
       setDragOverlay(isVertical ? "vertical" : "horizontal");
     };
-    (0, import_react110.useEffect)(() => {
+    (0, import_react111.useEffect)(() => {
       const onMove = (e) => {
         if (!draggingRef.current) return;
         const delta = (isVertical ? e.clientY : e.clientX) - startRef.current.at;
@@ -22328,9 +22463,9 @@ var ResizablePanel = (0, import_react110.forwardRef)(
 ResizablePanel.displayName = "ResizablePanel";
 
 // src/components/Ribbon/Ribbon.tsx
-var import_react111 = require("react");
+var import_react112 = require("react");
 var import_jsx_runtime92 = require("react/jsx-runtime");
-var Ribbon = (0, import_react111.forwardRef)(function Ribbon2({
+var Ribbon = (0, import_react112.forwardRef)(function Ribbon2({
   variant = "primary",
   size = "md",
   icon,
@@ -22361,13 +22496,13 @@ var Ribbon = (0, import_react111.forwardRef)(function Ribbon2({
 Ribbon.displayName = "Ribbon";
 
 // src/components/ScrollArea/ScrollArea.tsx
-var import_react112 = require("react");
+var import_react113 = require("react");
 var import_jsx_runtime93 = require("react/jsx-runtime");
 function resolveDimension(value) {
   if (value === void 0) return void 0;
   return typeof value === "number" ? `${value}px` : value;
 }
-var ScrollArea = (0, import_react112.forwardRef)(
+var ScrollArea = (0, import_react113.forwardRef)(
   function ScrollArea2({
     axis = "vertical",
     behavior = "hover",
@@ -22433,7 +22568,7 @@ function SettingsRow({
 
 // src/components/Sheet/Sheet.tsx
 var import_framer_motion29 = require("framer-motion");
-var import_react113 = require("react");
+var import_react114 = require("react");
 var import_react_dom12 = require("react-dom");
 var import_jsx_runtime95 = require("react/jsx-runtime");
 var slideVariants = {
@@ -22468,7 +22603,7 @@ function Sheet({
   dragHandle = true,
   className
 }) {
-  (0, import_react113.useEffect)(() => {
+  (0, import_react114.useEffect)(() => {
     if (!open || !closeOnEsc) return;
     const onKey = (e) => {
       if (e.key === "Escape") onClose();
@@ -22537,7 +22672,7 @@ function Show({ above, below, children, ...rest }) {
 Show.displayName = "Show";
 
 // src/components/Sidebar/Sidebar.tsx
-var import_react114 = require("react");
+var import_react115 = require("react");
 var import_jsx_runtime97 = require("react/jsx-runtime");
 function Sidebar({
   variant = "expanded",
@@ -22557,8 +22692,8 @@ function Sidebar({
   className
 }) {
   const allSections = sections ?? (items ? [{ items }] : []);
-  const [internalPinned, setInternalPinned] = (0, import_react114.useState)(defaultPinned);
-  (0, import_react114.useEffect)(() => {
+  const [internalPinned, setInternalPinned] = (0, import_react115.useState)(defaultPinned);
+  (0, import_react115.useEffect)(() => {
     if (pinnedProp !== void 0) return;
     try {
       const stored = window.localStorage.getItem(pinStorageKey);
@@ -22569,7 +22704,7 @@ function Sidebar({
     }
   }, []);
   const pinned = pinnedProp ?? internalPinned;
-  const setPinned = (0, import_react114.useCallback)(
+  const setPinned = (0, import_react115.useCallback)(
     (p) => {
       if (pinnedProp === void 0) setInternalPinned(p);
       try {
@@ -22580,9 +22715,9 @@ function Sidebar({
     },
     [pinnedProp, pinStorageKey, onPinnedChange]
   );
-  const [hoverOpen, setHoverOpen] = (0, import_react114.useState)(false);
-  const openTimer = (0, import_react114.useRef)(null);
-  const closeTimer = (0, import_react114.useRef)(null);
+  const [hoverOpen, setHoverOpen] = (0, import_react115.useState)(false);
+  const openTimer = (0, import_react115.useRef)(null);
+  const closeTimer = (0, import_react115.useRef)(null);
   const clearTimers = () => {
     if (openTimer.current) {
       clearTimeout(openTimer.current);
@@ -22593,7 +22728,7 @@ function Sidebar({
       closeTimer.current = null;
     }
   };
-  (0, import_react114.useEffect)(() => () => clearTimers(), []);
+  (0, import_react115.useEffect)(() => () => clearTimers(), []);
   const handleEnter = () => {
     clearTimers();
     openTimer.current = setTimeout(() => setHoverOpen(true), hoverOpenDelay);
@@ -22605,7 +22740,7 @@ function Sidebar({
   const autoMode = variant === "auto";
   const showAsRail = autoMode ? !pinned : variant === "rail";
   const overlayOpen = autoMode && !pinned && hoverOpen;
-  (0, import_react114.useEffect)(() => {
+  (0, import_react115.useEffect)(() => {
     if (!overlayOpen) return;
     const handler = (e) => {
       if (e.key === "Escape") {
@@ -22739,8 +22874,8 @@ function RailItem({
   tooltipDelay,
   suppressTooltip
 }) {
-  const [open, setOpen] = (0, import_react114.useState)(false);
-  const timerRef = (0, import_react114.useRef)(null);
+  const [open, setOpen] = (0, import_react115.useState)(false);
+  const timerRef = (0, import_react115.useRef)(null);
   const hasChildren = !!(item.children && item.children.length > 0);
   const clear = () => {
     if (timerRef.current) {
@@ -22748,7 +22883,7 @@ function RailItem({
       timerRef.current = null;
     }
   };
-  (0, import_react114.useEffect)(() => () => clear(), []);
+  (0, import_react115.useEffect)(() => () => clear(), []);
   const show = () => {
     if (suppressTooltip) return;
     clear();
@@ -22892,7 +23027,7 @@ function SidebarToggleIcon({ collapsed }) {
 }
 function ExpandedItem({ item, level }) {
   const hasChildren = !!(item.children && item.children.length > 0);
-  const [open, setOpen] = (0, import_react114.useState)(
+  const [open, setOpen] = (0, import_react115.useState)(
     item.defaultExpanded ?? (hasChildren && hasActiveDescendant(item))
   );
   if (hasChildren) {
@@ -23015,7 +23150,7 @@ function hasActiveDescendant(item) {
 }
 
 // src/components/Skeleton/Skeleton.tsx
-var import_react115 = require("react");
+var import_react116 = require("react");
 var import_jsx_runtime98 = require("react/jsx-runtime");
 function toCss(value) {
   if (value == null) return void 0;
@@ -23026,7 +23161,7 @@ var VARIANT_TO_SHAPE = {
   circular: "circle",
   rectangular: "rect"
 };
-var Skeleton = (0, import_react115.forwardRef)(
+var Skeleton = (0, import_react116.forwardRef)(
   function Skeleton2({
     shape,
     variant,
@@ -23076,7 +23211,7 @@ var Skeleton = (0, import_react115.forwardRef)(
   }
 );
 Skeleton.displayName = "Skeleton";
-var SkeletonText = (0, import_react115.forwardRef)(
+var SkeletonText = (0, import_react116.forwardRef)(
   function SkeletonText2({
     lines = 3,
     width,
@@ -23112,7 +23247,7 @@ var SkeletonText = (0, import_react115.forwardRef)(
   }
 );
 SkeletonText.displayName = "SkeletonText";
-var SkeletonGroup = (0, import_react115.forwardRef)(
+var SkeletonGroup = (0, import_react116.forwardRef)(
   function SkeletonGroup2({
     direction = "vertical",
     gap = 8,
@@ -23148,7 +23283,7 @@ SkeletonGroup.displayName = "SkeletonGroup";
 
 // src/components/SlideoutPanel/SlideoutPanel.tsx
 var import_framer_motion30 = require("framer-motion");
-var import_react116 = require("react");
+var import_react117 = require("react");
 var import_react_aria11 = require("react-aria");
 var import_react_dom13 = require("react-dom");
 var import_jsx_runtime99 = require("react/jsx-runtime");
@@ -23174,8 +23309,8 @@ function SlideoutContent({
   footer,
   className
 }) {
-  const overlayRef = (0, import_react116.useRef)(null);
-  const panelRef = (0, import_react116.useRef)(null);
+  const overlayRef = (0, import_react117.useRef)(null);
+  const panelRef = (0, import_react117.useRef)(null);
   const { overlayProps } = (0, import_react_aria11.useOverlay)(
     {
       isOpen: open,
@@ -23249,9 +23384,9 @@ function SlideoutPanel(props) {
 }
 
 // src/components/Slider/Slider.tsx
-var import_react117 = require("react");
+var import_react118 = require("react");
 var import_jsx_runtime100 = require("react/jsx-runtime");
-var Slider = (0, import_react117.forwardRef)(function Slider2({
+var Slider = (0, import_react118.forwardRef)(function Slider2({
   label,
   value,
   onChange,
@@ -23273,7 +23408,7 @@ var Slider = (0, import_react117.forwardRef)(function Slider2({
   "aria-describedby": consumerDescribedBy,
   ...rest
 }, ref) {
-  const reactId = (0, import_react117.useId)();
+  const reactId = (0, import_react118.useId)();
   const baseId = providedId ?? `ods-slider-${reactId}`;
   const labelId = label ? `${baseId}-label` : void 0;
   const hintId = error || helperText ? `${baseId}-hint` : void 0;
@@ -23372,7 +23507,7 @@ Slider.displayName = "Slider";
 
 // src/components/SocialButton/SocialButton.tsx
 var import_icons35 = require("@octaviaflow/icons");
-var import_react118 = require("react");
+var import_react119 = require("react");
 var import_jsx_runtime101 = require("react/jsx-runtime");
 var DEFAULT_LABELS = {
   google: "Continue with Google",
@@ -23445,7 +23580,7 @@ function resolveIcon2(provider) {
       return null;
   }
 }
-var SocialButton = (0, import_react118.forwardRef)(
+var SocialButton = (0, import_react119.forwardRef)(
   function SocialButton2({
     provider,
     label,
@@ -23488,7 +23623,7 @@ var SocialButton = (0, import_react118.forwardRef)(
 SocialButton.displayName = "SocialButton";
 
 // src/components/Sortable/Sortable.tsx
-var import_react119 = require("react");
+var import_react120 = require("react");
 var import_icons36 = require("@octaviaflow/icons");
 var import_jsx_runtime102 = require("react/jsx-runtime");
 var DT_TYPE = "application/x-ods-sortable";
@@ -23503,15 +23638,15 @@ function Sortable({
   className,
   ...rest
 }) {
-  const containerRef = (0, import_react119.useRef)(null);
-  const itemRefs = (0, import_react119.useRef)(/* @__PURE__ */ new Map());
-  const originalOrderRef = (0, import_react119.useRef)(null);
-  const scrollTimerRef = (0, import_react119.useRef)(null);
-  const [draggingId, setDraggingId] = (0, import_react119.useState)(null);
-  const [dropPos, setDropPos] = (0, import_react119.useState)(null);
-  const [kbActiveId, setKbActiveId] = (0, import_react119.useState)(null);
+  const containerRef = (0, import_react120.useRef)(null);
+  const itemRefs = (0, import_react120.useRef)(/* @__PURE__ */ new Map());
+  const originalOrderRef = (0, import_react120.useRef)(null);
+  const scrollTimerRef = (0, import_react120.useRef)(null);
+  const [draggingId, setDraggingId] = (0, import_react120.useState)(null);
+  const [dropPos, setDropPos] = (0, import_react120.useState)(null);
+  const [kbActiveId, setKbActiveId] = (0, import_react120.useState)(null);
   const isVertical = direction === "vertical";
-  const onDragStart = (0, import_react119.useCallback)(
+  const onDragStart = (0, import_react120.useCallback)(
     (id) => (e) => {
       if (disabled) return;
       e.dataTransfer.effectAllowed = "move";
@@ -23522,7 +23657,7 @@ function Sortable({
     },
     [disabled, items]
   );
-  const cancelDrag = (0, import_react119.useCallback)(() => {
+  const cancelDrag = (0, import_react120.useCallback)(() => {
     setDraggingId(null);
     setDropPos(null);
     originalOrderRef.current = null;
@@ -23531,7 +23666,7 @@ function Sortable({
       scrollTimerRef.current = null;
     }
   }, []);
-  const onDragEnd = (0, import_react119.useCallback)(() => {
+  const onDragEnd = (0, import_react120.useCallback)(() => {
     cancelDrag();
   }, [cancelDrag]);
   const onItemDragOver = (id) => (e) => {
@@ -23556,7 +23691,7 @@ function Sortable({
     if (sourceId === target.id) return;
     commitMove(sourceId, target.id, target.edge);
   };
-  const commitMove = (0, import_react119.useCallback)(
+  const commitMove = (0, import_react120.useCallback)(
     (sourceId, targetId, edge) => {
       const from = items.findIndex((i) => i.id === sourceId);
       let to = items.findIndex((i) => i.id === targetId);
@@ -23570,7 +23705,7 @@ function Sortable({
     },
     [items, onChange]
   );
-  (0, import_react119.useEffect)(() => {
+  (0, import_react120.useEffect)(() => {
     if (!autoScroll || !draggingId) return;
     const container = containerRef.current;
     if (!container) return;
@@ -23620,7 +23755,7 @@ function Sortable({
       }
     };
   }, [autoScroll, autoScrollEdge, draggingId, isVertical]);
-  (0, import_react119.useEffect)(() => {
+  (0, import_react120.useEffect)(() => {
     if (!draggingId) return;
     const onKey = (e) => {
       if (e.key === "Escape") cancelDrag();
@@ -23748,7 +23883,7 @@ function Sortable({
     }
   );
 }
-var DragHandle = (0, import_react119.forwardRef)(
+var DragHandle = (0, import_react120.forwardRef)(
   function DragHandle2({
     className,
     style,
@@ -23773,7 +23908,7 @@ var DragHandle = (0, import_react119.forwardRef)(
 DragHandle.displayName = "DragHandle";
 
 // src/components/Stack/Stack.tsx
-var import_react120 = require("react");
+var import_react121 = require("react");
 var import_jsx_runtime103 = require("react/jsx-runtime");
 function resolveGap2(gap) {
   if (typeof gap === "string") return gap;
@@ -23795,7 +23930,7 @@ var JUSTIFY_MAP = {
   around: "space-around",
   evenly: "space-evenly"
 };
-var Stack = (0, import_react120.forwardRef)(function Stack2({
+var Stack = (0, import_react121.forwardRef)(function Stack2({
   direction = "column",
   gap = 2,
   align = "stretch",
@@ -23811,11 +23946,11 @@ var Stack = (0, import_react120.forwardRef)(function Stack2({
   ...rest
 }, ref) {
   const Component = as ?? "div";
-  const items = divider ? import_react120.Children.toArray(children).flatMap(
+  const items = divider ? import_react121.Children.toArray(children).flatMap(
     (child, i, arr) => i < arr.length - 1 ? [
-      /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(import_react120.Fragment, { children: child }, `item-${i}`),
-      /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(import_react120.Fragment, { children: divider }, `divider-${i}`)
-    ] : [/* @__PURE__ */ (0, import_jsx_runtime103.jsx)(import_react120.Fragment, { children: child }, `item-${i}`)]
+      /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(import_react121.Fragment, { children: child }, `item-${i}`),
+      /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(import_react121.Fragment, { children: divider }, `divider-${i}`)
+    ] : [/* @__PURE__ */ (0, import_jsx_runtime103.jsx)(import_react121.Fragment, { children: child }, `item-${i}`)]
   ) : children;
   return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
     Component,
@@ -23843,13 +23978,13 @@ var Stack = (0, import_react120.forwardRef)(function Stack2({
   );
 });
 Stack.displayName = "Stack";
-var HStack = (0, import_react120.forwardRef)(
+var HStack = (0, import_react121.forwardRef)(
   function HStack2(props, ref) {
     return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(Stack, { ref, direction: "row", ...props });
   }
 );
 HStack.displayName = "HStack";
-var VStack = (0, import_react120.forwardRef)(
+var VStack = (0, import_react121.forwardRef)(
   function VStack2(props, ref) {
     return /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(Stack, { ref, direction: "column", ...props });
   }
@@ -23858,10 +23993,10 @@ VStack.displayName = "VStack";
 
 // src/components/Spotlight/Spotlight.tsx
 var import_framer_motion31 = require("framer-motion");
-var import_react121 = require("react");
+var import_react122 = require("react");
 var import_react_dom14 = require("react-dom");
 var import_jsx_runtime104 = require("react/jsx-runtime");
-var Spotlight = (0, import_react121.forwardRef)(
+var Spotlight = (0, import_react122.forwardRef)(
   function Spotlight2({
     open,
     target,
@@ -23878,16 +24013,16 @@ var Spotlight = (0, import_react121.forwardRef)(
     ...rest
   }, ref) {
     const reducedMotion = (0, import_framer_motion31.useReducedMotion)();
-    const [rect, setRect] = (0, import_react121.useState)(null);
-    const [viewport, setViewport] = (0, import_react121.useState)(() => ({
+    const [rect, setRect] = (0, import_react122.useState)(null);
+    const [viewport, setViewport] = (0, import_react122.useState)(() => ({
       width: typeof window !== "undefined" ? window.innerWidth : 0,
       height: typeof window !== "undefined" ? window.innerHeight : 0
     }));
-    const maskId = (0, import_react121.useMemo)(
+    const maskId = (0, import_react122.useMemo)(
       () => `ods-spotlight-${Math.random().toString(36).slice(2, 9)}`,
       []
     );
-    const measure = (0, import_react121.useCallback)(() => {
+    const measure = (0, import_react122.useCallback)(() => {
       if (!open) return;
       const el = target.current;
       if (!el) return;
@@ -23897,10 +24032,10 @@ var Spotlight = (0, import_react121.forwardRef)(
         height: window.innerHeight
       });
     }, [open, target]);
-    (0, import_react121.useLayoutEffect)(() => {
+    (0, import_react122.useLayoutEffect)(() => {
       measure();
     }, [measure]);
-    (0, import_react121.useEffect)(() => {
+    (0, import_react122.useEffect)(() => {
       if (!open) return;
       const handler = () => measure();
       window.addEventListener("resize", handler);
@@ -23910,7 +24045,7 @@ var Spotlight = (0, import_react121.forwardRef)(
         window.removeEventListener("scroll", handler, true);
       };
     }, [open, measure]);
-    (0, import_react121.useEffect)(() => {
+    (0, import_react122.useEffect)(() => {
       if (!open || !onDismiss) return;
       const onKey = (e) => {
         if (e.key === "Escape") onDismiss();
@@ -24012,10 +24147,10 @@ var Spotlight = (0, import_react121.forwardRef)(
 Spotlight.displayName = "Spotlight";
 
 // src/components/Stat/Stat.tsx
-var import_react122 = require("react");
+var import_react123 = require("react");
 var import_icons37 = require("@octaviaflow/icons");
 var import_jsx_runtime105 = require("react/jsx-runtime");
-var Stat = (0, import_react122.forwardRef)(function Stat2({
+var Stat = (0, import_react123.forwardRef)(function Stat2({
   label,
   value,
   delta,
@@ -24054,7 +24189,7 @@ Stat.displayName = "Stat";
 
 // src/components/StatusTiles/StatusTiles.tsx
 var import_framer_motion32 = require("framer-motion");
-var import_react123 = require("react");
+var import_react124 = require("react");
 var import_jsx_runtime106 = require("react/jsx-runtime");
 var STATUS_COLORS = {
   success: "var(--ods-status-success)",
@@ -24072,7 +24207,7 @@ var STATUS_TEXT = {
   skipped: "Skipped",
   idle: "Idle"
 };
-var StatusTiles = (0, import_react123.forwardRef)(
+var StatusTiles = (0, import_react124.forwardRef)(
   function StatusTiles2({
     data,
     tileWidth = 10,
@@ -24089,13 +24224,13 @@ var StatusTiles = (0, import_react123.forwardRef)(
     onTileClick,
     ...rest
   }, ref) {
-    const reactId = (0, import_react123.useId)();
-    const visible = (0, import_react123.useMemo)(
+    const reactId = (0, import_react124.useId)();
+    const visible = (0, import_react124.useMemo)(
       () => max < data.length ? data.slice(data.length - max) : data,
       [data, max]
     );
-    const [hoveredIdx, setHoveredIdx] = (0, import_react123.useState)(null);
-    const fire = (0, import_react123.useCallback)(
+    const [hoveredIdx, setHoveredIdx] = (0, import_react124.useState)(null);
+    const fire = (0, import_react124.useCallback)(
       (idx) => {
         setHoveredIdx(idx);
         if (idx === null) {
@@ -24107,7 +24242,7 @@ var StatusTiles = (0, import_react123.forwardRef)(
       },
       [onTileHover, visible]
     );
-    const handleKey = (0, import_react123.useCallback)(
+    const handleKey = (0, import_react124.useCallback)(
       (e, idx) => {
         if (!onTileClick) return;
         if (e.key === "Enter" || e.key === " ") {
@@ -24117,7 +24252,7 @@ var StatusTiles = (0, import_react123.forwardRef)(
       },
       [visible, onTileClick]
     );
-    const resolvedAriaLabel = (0, import_react123.useMemo)(() => {
+    const resolvedAriaLabel = (0, import_react124.useMemo)(() => {
       if (ariaLabel) return ariaLabel;
       const t = typeof title === "string" ? title : "Status";
       const tally = {};
@@ -24191,7 +24326,7 @@ StatusTiles.displayName = "StatusTiles";
 
 // src/components/Stepper/Stepper.tsx
 var import_icons38 = require("@octaviaflow/icons");
-var import_react124 = require("react");
+var import_react125 = require("react");
 var import_jsx_runtime107 = require("react/jsx-runtime");
 function deriveStatus(step, index, active) {
   if (step.status) return step.status;
@@ -24199,7 +24334,7 @@ function deriveStatus(step, index, active) {
   if (index === active) return "active";
   return "pending";
 }
-var Stepper = (0, import_react124.forwardRef)(
+var Stepper = (0, import_react125.forwardRef)(
   function Stepper2({
     steps,
     active = 0,
@@ -24213,7 +24348,7 @@ var Stepper = (0, import_react124.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react124.useId)();
+    const reactId = (0, import_react125.useId)();
     const baseId = providedId ?? `ods-stepper-${reactId}`;
     const activeIndex = active ?? defaultActive ?? 0;
     const isInteractive = Boolean(onStepChange) && !disabled;
@@ -24365,7 +24500,7 @@ Stepper.displayName = "Stepper";
 
 // src/components/Sankey/Sankey.tsx
 var import_framer_motion33 = require("framer-motion");
-var import_react125 = require("react");
+var import_react126 = require("react");
 var import_jsx_runtime108 = require("react/jsx-runtime");
 var defaultFormat7 = (n) => {
   if (Math.abs(n) >= 1e6) return `${(n / 1e6).toFixed(1)}M`;
@@ -24405,7 +24540,7 @@ function assignColumns(nodes, links) {
   }
   return cols;
 }
-var Sankey = (0, import_react125.forwardRef)(function Sankey2({
+var Sankey = (0, import_react126.forwardRef)(function Sankey2({
   nodes,
   links,
   width = 720,
@@ -24427,13 +24562,13 @@ var Sankey = (0, import_react125.forwardRef)(function Sankey2({
   onLinkClick,
   ...rest
 }, ref) {
-  const reactId = (0, import_react125.useId)();
-  const columnMap = (0, import_react125.useMemo)(
+  const reactId = (0, import_react126.useId)();
+  const columnMap = (0, import_react126.useMemo)(
     () => assignColumns(nodes, links),
     [nodes, links]
   );
   const columnCount = Math.max(0, ...Array.from(columnMap.values())) + 1;
-  const flows = (0, import_react125.useMemo)(() => {
+  const flows = (0, import_react126.useMemo)(() => {
     const inFlow = /* @__PURE__ */ new Map();
     const outFlow = /* @__PURE__ */ new Map();
     for (const n of nodes) {
@@ -24446,7 +24581,7 @@ var Sankey = (0, import_react125.forwardRef)(function Sankey2({
     }
     return { inFlow, outFlow };
   }, [nodes, links]);
-  const columns = (0, import_react125.useMemo)(() => {
+  const columns = (0, import_react126.useMemo)(() => {
     const grouped = Array.from(
       { length: columnCount },
       () => []
@@ -24457,7 +24592,7 @@ var Sankey = (0, import_react125.forwardRef)(function Sankey2({
     }
     return grouped;
   }, [nodes, columnMap, columnCount]);
-  const columnFlows = (0, import_react125.useMemo)(
+  const columnFlows = (0, import_react126.useMemo)(
     () => columns.map(
       (col) => col.reduce((s, n) => {
         const f = Math.max(
@@ -24471,11 +24606,11 @@ var Sankey = (0, import_react125.forwardRef)(function Sankey2({
   );
   const maxColumnFlow = Math.max(1, ...columnFlows);
   const colAvail = (col) => height - Math.max(0, col.length - 1) * nodeGap;
-  const scale = (0, import_react125.useMemo)(() => {
+  const scale = (0, import_react126.useMemo)(() => {
     const avail = Math.min(...columns.map(colAvail));
     return avail / maxColumnFlow;
   }, [columns, height, nodeGap, maxColumnFlow]);
-  const layoutNodes = (0, import_react125.useMemo)(() => {
+  const layoutNodes = (0, import_react126.useMemo)(() => {
     const m = /* @__PURE__ */ new Map();
     const colX = (c) => {
       if (columnCount <= 1) return 0;
@@ -24516,7 +24651,7 @@ var Sankey = (0, import_react125.forwardRef)(function Sankey2({
     }
     return m;
   }, [columns, columnCount, width, nodeWidth, flows, scale, height, nodeGap]);
-  const layoutLinks = (0, import_react125.useMemo)(() => {
+  const layoutLinks = (0, import_react126.useMemo)(() => {
     const sourceOffset = /* @__PURE__ */ new Map();
     const targetOffset = /* @__PURE__ */ new Map();
     for (const n of nodes) {
@@ -24559,23 +24694,23 @@ var Sankey = (0, import_react125.forwardRef)(function Sankey2({
     }
     return out;
   }, [links, layoutNodes, nodeWidth, scale]);
-  const [hoveredNode, setHoveredNode] = (0, import_react125.useState)(null);
-  const [hoveredLink, setHoveredLink] = (0, import_react125.useState)(null);
-  const fireNode = (0, import_react125.useCallback)(
+  const [hoveredNode, setHoveredNode] = (0, import_react126.useState)(null);
+  const [hoveredLink, setHoveredLink] = (0, import_react126.useState)(null);
+  const fireNode = (0, import_react126.useCallback)(
     (n) => {
       setHoveredNode(n);
       onNodeHover?.(n);
     },
     [onNodeHover]
   );
-  const fireLink = (0, import_react125.useCallback)(
+  const fireLink = (0, import_react126.useCallback)(
     (l) => {
       setHoveredLink(l);
       onLinkHover?.(l);
     },
     [onLinkHover]
   );
-  const handleNodeKey = (0, import_react125.useCallback)(
+  const handleNodeKey = (0, import_react126.useCallback)(
     (e, n) => {
       if (!onNodeClick) return;
       if (e.key === "Enter" || e.key === " ") {
@@ -24585,7 +24720,7 @@ var Sankey = (0, import_react125.forwardRef)(function Sankey2({
     },
     [onNodeClick]
   );
-  const resolvedAriaLabel = (0, import_react125.useMemo)(() => {
+  const resolvedAriaLabel = (0, import_react126.useMemo)(() => {
     if (ariaLabel) return ariaLabel;
     const t = typeof title === "string" ? title : "Sankey";
     return `${t} \u2014 ${nodes.length} nodes, ${links.length} flows`;
@@ -24718,10 +24853,10 @@ var Sankey = (0, import_react125.forwardRef)(function Sankey2({
 Sankey.displayName = "Sankey";
 
 // src/components/Switch/Switch.tsx
-var import_react126 = require("react");
+var import_react127 = require("react");
 var import_react_aria12 = require("react-aria");
 var import_jsx_runtime109 = require("react/jsx-runtime");
-var Switch = (0, import_react126.forwardRef)(function Switch2({
+var Switch = (0, import_react127.forwardRef)(function Switch2({
   checked,
   defaultChecked,
   onChange,
@@ -24732,7 +24867,7 @@ var Switch = (0, import_react126.forwardRef)(function Switch2({
   className,
   ...props
 }, forwardedRef) {
-  const innerRef = (0, import_react126.useRef)(null);
+  const innerRef = (0, import_react127.useRef)(null);
   const setRef = (node) => {
     innerRef.current = node;
     if (typeof forwardedRef === "function") forwardedRef(node);
@@ -24808,7 +24943,7 @@ var Switch = (0, import_react126.forwardRef)(function Switch2({
 Switch.displayName = "Switch";
 
 // src/components/Table/Table.tsx
-var import_react127 = require("react");
+var import_react128 = require("react");
 var import_icons39 = require("@octaviaflow/icons");
 var import_jsx_runtime110 = require("react/jsx-runtime");
 function TableInner({
@@ -24828,7 +24963,7 @@ function TableInner({
   "aria-label": ariaLabel = "Data table",
   ...rest
 }, ref) {
-  const handleSort = (0, import_react127.useCallback)(
+  const handleSort = (0, import_react128.useCallback)(
     (key) => {
       if (!onSort) return;
       const col = columns.find((c) => c.key === key);
@@ -24838,7 +24973,7 @@ function TableInner({
     },
     [columns, onSort, sortKey, sortDirection]
   );
-  const handleSelectAll = (0, import_react127.useCallback)(() => {
+  const handleSelectAll = (0, import_react128.useCallback)(() => {
     if (!onSelectionChange) return;
     const allSelected = selectedRows?.size === data.length;
     if (allSelected) {
@@ -24847,7 +24982,7 @@ function TableInner({
       onSelectionChange(new Set(data.map((_, i) => i)));
     }
   }, [data, onSelectionChange, selectedRows]);
-  const handleSelectRow = (0, import_react127.useCallback)(
+  const handleSelectRow = (0, import_react128.useCallback)(
     (index) => {
       if (!onSelectionChange || !selectedRows) return;
       const next = new Set(selectedRows);
@@ -24930,7 +25065,7 @@ function TableInner({
     }
   );
 }
-var Table = (0, import_react127.forwardRef)(TableInner);
+var Table = (0, import_react128.forwardRef)(TableInner);
 function TableRow({
   row,
   rowIndex,
@@ -24943,7 +25078,7 @@ function TableRow({
   totalCols
 }) {
   const isSelected = selectedRows?.has(rowIndex) ?? false;
-  const [expanded, setExpanded] = (0, import_react127.useState)(false);
+  const [expanded, setExpanded] = (0, import_react128.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(import_jsx_runtime110.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime110.jsxs)(
       "tr",
@@ -24981,7 +25116,7 @@ function TableRow({
 
 // src/components/Tabs/Tabs.tsx
 var import_framer_motion34 = require("framer-motion");
-var import_react128 = require("react");
+var import_react129 = require("react");
 var import_react_aria13 = require("react-aria");
 var import_jsx_runtime111 = require("react/jsx-runtime");
 function TabButton({
@@ -24989,7 +25124,7 @@ function TabButton({
   state,
   indicatorLayoutId
 }) {
-  const ref = (0, import_react128.useRef)(null);
+  const ref = (0, import_react129.useRef)(null);
   const { tabProps } = (0, import_react_aria13.useTab)({ key: item.key }, state, ref);
   const isSelected = state.selectedKey === item.key;
   const isDisabled = state.disabledKeys.has(item.key);
@@ -25019,7 +25154,7 @@ function TabButton({
   );
 }
 function TabPanelContent({ state, panelContent, ...props }) {
-  const ref = (0, import_react128.useRef)(null);
+  const ref = (0, import_react129.useRef)(null);
   const { tabPanelProps } = (0, import_react_aria13.useTabPanel)(props, state, ref);
   return /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { ...tabPanelProps, ref, className: "ods-tabs__panel", children: panelContent });
 }
@@ -25033,16 +25168,16 @@ function Tabs({
   orientation = "horizontal",
   className
 }) {
-  const reactId = (0, import_react128.useId)();
+  const reactId = (0, import_react129.useId)();
   const indicatorLayoutId = `ods-tabs-indicator-${reactId}`;
-  const [internalValue, setInternalValue] = (0, import_react128.useState)(defaultValue || items[0]?.value);
+  const [internalValue, setInternalValue] = (0, import_react129.useState)(defaultValue || items[0]?.value);
   const selectedKey = value ?? internalValue;
   const handleSelectionChange = (key) => {
     const keyStr = String(key);
     if (!value) setInternalValue(keyStr);
     onChange?.(keyStr);
   };
-  const panelContentMap = (0, import_react128.useMemo)(() => {
+  const panelContentMap = (0, import_react129.useMemo)(() => {
     const map = /* @__PURE__ */ new Map();
     items.forEach((item) => {
       map.set(item.value, item.children);
@@ -25059,12 +25194,12 @@ function Tabs({
     disabledKeys: items.filter((i) => i.disabled).map((i) => i.value)
   };
   const state = $caeb030f09a278a1$export$4ba071daf4e486(stateProps);
-  const ref = (0, import_react128.useRef)(null);
+  const ref = (0, import_react129.useRef)(null);
   const { tabListProps } = (0, import_react_aria13.useTabList)({ ...stateProps, orientation }, state, ref);
-  const scrollContainerRef = (0, import_react128.useRef)(null);
-  const [canScrollLeft, setCanScrollLeft] = (0, import_react128.useState)(false);
-  const [canScrollRight, setCanScrollRight] = (0, import_react128.useState)(false);
-  const measureOverflow = (0, import_react128.useCallback)(() => {
+  const scrollContainerRef = (0, import_react129.useRef)(null);
+  const [canScrollLeft, setCanScrollLeft] = (0, import_react129.useState)(false);
+  const [canScrollRight, setCanScrollRight] = (0, import_react129.useState)(false);
+  const measureOverflow = (0, import_react129.useCallback)(() => {
     const el = scrollContainerRef.current;
     if (!el || orientation !== "horizontal") {
       setCanScrollLeft(false);
@@ -25075,7 +25210,7 @@ function Tabs({
     setCanScrollLeft(el.scrollLeft > SCROLL_EDGE_EPSILON);
     setCanScrollRight(el.scrollLeft < max - SCROLL_EDGE_EPSILON);
   }, [orientation]);
-  (0, import_react128.useEffect)(() => {
+  (0, import_react129.useEffect)(() => {
     measureOverflow();
     const el = scrollContainerRef.current;
     if (!el || typeof ResizeObserver === "undefined") return;
@@ -25155,10 +25290,10 @@ function ChevronSvg({ dir }) {
 }
 
 // src/components/TagsInput/TagsInput.tsx
-var import_react129 = require("react");
+var import_react130 = require("react");
 var import_icons40 = require("@octaviaflow/icons");
 var import_jsx_runtime112 = require("react/jsx-runtime");
-var TagsInput = (0, import_react129.forwardRef)(
+var TagsInput = (0, import_react130.forwardRef)(
   function TagsInput2({
     label,
     value,
@@ -25179,8 +25314,8 @@ var TagsInput = (0, import_react129.forwardRef)(
     "aria-describedby": consumerDescribedBy,
     ...rest
   }, ref) {
-    const [draft, setDraft] = (0, import_react129.useState)("");
-    const reactId = (0, import_react129.useId)();
+    const [draft, setDraft] = (0, import_react130.useState)("");
+    const reactId = (0, import_react130.useId)();
     const inputId = providedId ?? `ods-tags-${reactId}`;
     const labelId = label ? `${inputId}-label` : void 0;
     const hintId = error || helperText ? `${inputId}-hint` : void 0;
@@ -25280,9 +25415,9 @@ var TagsInput = (0, import_react129.forwardRef)(
 TagsInput.displayName = "TagsInput";
 
 // src/components/TemplateCard/TemplateCard.tsx
-var import_react130 = require("react");
+var import_react131 = require("react");
 var import_jsx_runtime113 = require("react/jsx-runtime");
-var TemplateCard = (0, import_react130.forwardRef)(
+var TemplateCard = (0, import_react131.forwardRef)(
   function TemplateCard2({
     name,
     nameAs = "h3",
@@ -25310,7 +25445,7 @@ var TemplateCard = (0, import_react130.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react130.useId)();
+    const reactId = (0, import_react131.useId)();
     const baseId = providedId ?? `ods-template-card-${reactId}`;
     const nameId = `${baseId}-name`;
     const descId = description ? `${baseId}-desc` : void 0;
@@ -25501,13 +25636,13 @@ TemplateCard.displayName = "TemplateCard";
 
 // src/components/TestimonialCard/TestimonialCard.tsx
 var import_icons41 = require("@octaviaflow/icons");
-var import_react131 = require("react");
+var import_react132 = require("react");
 var import_jsx_runtime114 = require("react/jsx-runtime");
 function isAuthorObject(v) {
   return typeof v === "object" && v !== null && !("type" in v) && // exclude React elements
   "name" in v;
 }
-var TestimonialCard = (0, import_react131.forwardRef)(function TestimonialCard2({
+var TestimonialCard = (0, import_react132.forwardRef)(function TestimonialCard2({
   quote,
   author,
   role: legacyRole,
@@ -25521,7 +25656,7 @@ var TestimonialCard = (0, import_react131.forwardRef)(function TestimonialCard2(
   className,
   ...rest
 }, ref) {
-  const reactId = (0, import_react131.useId)();
+  const reactId = (0, import_react132.useId)();
   const baseId = providedId ?? `ods-testimonial-${reactId}`;
   const quoteId = `${baseId}-quote`;
   const authorId = `${baseId}-author`;
@@ -25615,13 +25750,13 @@ var TestimonialCard = (0, import_react131.forwardRef)(function TestimonialCard2(
 TestimonialCard.displayName = "TestimonialCard";
 
 // src/components/Textarea/Textarea.tsx
-var import_react135 = require("react");
+var import_react136 = require("react");
 var import_react_aria14 = require("react-aria");
 var import_react_dom15 = require("react-dom");
 var import_icons43 = require("@octaviaflow/icons");
 
 // src/hooks/useTextareaCommands.ts
-var import_react132 = require("react");
+var import_react133 = require("react");
 function findOpenTrigger(value, caret, trigger) {
   let i = caret - 1;
   while (i >= 0) {
@@ -25699,15 +25834,15 @@ function useTextareaCommands({
   openOnEmptyTrigger = true,
   maxItems = 8
 }) {
-  const [isOpen, setIsOpen] = (0, import_react132.useState)(false);
-  const [query, setQuery] = (0, import_react132.useState)("");
-  const [activeIndex, setActiveIndex] = (0, import_react132.useState)(0);
-  const [triggerIndex, setTriggerIndex] = (0, import_react132.useState)(null);
-  const [caretRect, setCaretRect] = (0, import_react132.useState)(null);
-  const dismissedAtRef = (0, import_react132.useRef)(
+  const [isOpen, setIsOpen] = (0, import_react133.useState)(false);
+  const [query, setQuery] = (0, import_react133.useState)("");
+  const [activeIndex, setActiveIndex] = (0, import_react133.useState)(0);
+  const [triggerIndex, setTriggerIndex] = (0, import_react133.useState)(null);
+  const [caretRect, setCaretRect] = (0, import_react133.useState)(null);
+  const dismissedAtRef = (0, import_react133.useRef)(
     null
   );
-  const items = (0, import_react132.useMemo)(() => {
+  const items = (0, import_react133.useMemo)(() => {
     const q2 = query.trim().toLowerCase();
     if (!q2) return commands.slice(0, maxItems);
     return commands.filter((c) => {
@@ -25720,7 +25855,7 @@ function useTextareaCommands({
       return hay.includes(q2);
     }).slice(0, maxItems);
   }, [commands, query, maxItems]);
-  (0, import_react132.useEffect)(() => {
+  (0, import_react133.useEffect)(() => {
     const ta = textareaRef.current;
     if (!ta) return;
     const caret = ta.selectionStart ?? 0;
@@ -25743,7 +25878,7 @@ function useTextareaCommands({
       setCaretRect(getCaretRect(ta, caret));
     }
   }, [value, trigger, openOnEmptyTrigger, isOpen, textareaRef]);
-  const commit = (0, import_react132.useCallback)(
+  const commit = (0, import_react133.useCallback)(
     (cmd) => {
       const ta = textareaRef.current;
       if (!ta || triggerIndex == null) return;
@@ -25767,7 +25902,7 @@ function useTextareaCommands({
     },
     [textareaRef, triggerIndex, query, value, onChange]
   );
-  const dismiss = (0, import_react132.useCallback)(() => {
+  const dismiss = (0, import_react133.useCallback)(() => {
     const ta = textareaRef.current;
     dismissedAtRef.current = {
       value,
@@ -25776,7 +25911,7 @@ function useTextareaCommands({
     setIsOpen(false);
     setTriggerIndex(null);
   }, [textareaRef, value]);
-  const onKeyDown = (0, import_react132.useCallback)(
+  const onKeyDown = (0, import_react133.useCallback)(
     (e) => {
       if (!isOpen) return false;
       if (e.key === "ArrowDown") {
@@ -25819,7 +25954,7 @@ function useTextareaCommands({
 }
 
 // src/hooks/useTextareaSelection.ts
-var import_react133 = require("react");
+var import_react134 = require("react");
 function getSelectionRect(textarea, start, end) {
   if (typeof document === "undefined") return null;
   if (start === end) return null;
@@ -25881,10 +26016,10 @@ function useTextareaSelection({
   value,
   onChange
 }) {
-  const [start, setStart] = (0, import_react133.useState)(0);
-  const [end, setEnd] = (0, import_react133.useState)(0);
-  const [rect, setRect] = (0, import_react133.useState)(null);
-  (0, import_react133.useEffect)(() => {
+  const [start, setStart] = (0, import_react134.useState)(0);
+  const [end, setEnd] = (0, import_react134.useState)(0);
+  const [rect, setRect] = (0, import_react134.useState)(null);
+  (0, import_react134.useEffect)(() => {
     if (typeof document === "undefined") return;
     const handler = () => {
       const ta = textareaRef.current;
@@ -25905,7 +26040,7 @@ function useTextareaSelection({
   }, [textareaRef]);
   const active = start !== end;
   const text = active ? value.slice(start, end) : "";
-  const writeToClipboard = (0, import_react133.useCallback)(
+  const writeToClipboard = (0, import_react134.useCallback)(
     async (str) => {
       try {
         if (typeof navigator !== "undefined" && navigator.clipboard?.writeText) {
@@ -25930,11 +26065,11 @@ function useTextareaSelection({
     },
     []
   );
-  const copy = (0, import_react133.useCallback)(async () => {
+  const copy = (0, import_react134.useCallback)(async () => {
     if (!active) return false;
     return writeToClipboard(text);
   }, [active, text, writeToClipboard]);
-  const replace = (0, import_react133.useCallback)(
+  const replace = (0, import_react134.useCallback)(
     (str) => {
       const ta = textareaRef.current;
       if (!ta) return;
@@ -25948,13 +26083,13 @@ function useTextareaSelection({
     },
     [textareaRef, value, start, end, onChange]
   );
-  const cut = (0, import_react133.useCallback)(async () => {
+  const cut = (0, import_react134.useCallback)(async () => {
     if (!active) return false;
     const ok = await writeToClipboard(text);
     if (ok) replace("");
     return ok;
   }, [active, text, writeToClipboard, replace]);
-  const wrap = (0, import_react133.useCallback)(
+  const wrap = (0, import_react134.useCallback)(
     (open, close) => {
       const ta = textareaRef.current;
       if (!ta) return;
@@ -25988,7 +26123,7 @@ function useTextareaSelection({
 
 // src/hooks/useTextareaTools.tsx
 var import_icons42 = require("@octaviaflow/icons");
-var import_react134 = require("react");
+var import_react135 = require("react");
 var import_jsx_runtime115 = require("react/jsx-runtime");
 function useTextareaTools({
   textareaRef,
@@ -25996,9 +26131,9 @@ function useTextareaTools({
   onChange,
   tools
 }) {
-  const valueRef = (0, import_react134.useRef)(value);
+  const valueRef = (0, import_react135.useRef)(value);
   valueRef.current = value;
-  const helpers = (0, import_react134.useMemo)(() => {
+  const helpers = (0, import_react135.useMemo)(() => {
     const getTa = () => textareaRef.current;
     const getSelection = () => {
       const ta = getTa();
@@ -26096,11 +26231,11 @@ function useTextareaTools({
       getTextarea: getTa
     };
   }, [textareaRef, onChange]);
-  const visibleTools = (0, import_react134.useMemo)(
+  const visibleTools = (0, import_react135.useMemo)(
     () => tools.filter((t) => t.isVisible ? t.isVisible(helpers) : true),
     [tools, helpers]
   );
-  const runTool = (0, import_react134.useCallback)(
+  const runTool = (0, import_react135.useCallback)(
     async (id) => {
       const tool = tools.find((t) => t.id === id);
       if (!tool || tool.kind === "divider") return;
@@ -26206,7 +26341,7 @@ var textareaTools = {
 
 // src/components/Textarea/Textarea.tsx
 var import_jsx_runtime116 = require("react/jsx-runtime");
-var Textarea = (0, import_react135.forwardRef)(
+var Textarea = (0, import_react136.forwardRef)(
   function Textarea2({
     label,
     error = false,
@@ -26238,17 +26373,17 @@ var Textarea = (0, import_react135.forwardRef)(
     toolbarPosition = "top",
     ...props
   }, forwardedRef) {
-    const innerRef = (0, import_react135.useRef)(null);
+    const innerRef = (0, import_react136.useRef)(null);
     const setRef = (node) => {
       innerRef.current = node;
       if (typeof forwardedRef === "function") forwardedRef(node);
       else if (forwardedRef)
         forwardedRef.current = node;
     };
-    const reactId = (0, import_react135.useId)();
+    const reactId = (0, import_react136.useId)();
     const baseId = providedId ?? `ods-textarea-${reactId}`;
     const hintId = error && errorMessage || helperText ? `${baseId}-hint` : void 0;
-    const [charCount, setCharCount] = (0, import_react135.useState)(
+    const [charCount, setCharCount] = (0, import_react136.useState)(
       () => String(value ?? defaultValue ?? "").length
     );
     const ariaNameProps = resolveAccessibleName({
@@ -26278,10 +26413,10 @@ var Textarea = (0, import_react135.forwardRef)(
       setCharCount(e.target.value.length);
       onChange?.(e);
     };
-    const [liveValue, setLiveValue] = (0, import_react135.useState)(
+    const [liveValue, setLiveValue] = (0, import_react136.useState)(
       String(value ?? defaultValue ?? "")
     );
-    (0, import_react135.useEffect)(() => {
+    (0, import_react136.useEffect)(() => {
       if (value != null) setLiveValue(String(value));
     }, [value]);
     const handleChangeWithMirror = (e) => {
@@ -26324,7 +26459,7 @@ var Textarea = (0, import_react135.forwardRef)(
       }
       props.onKeyDown?.(e);
     };
-    (0, import_react135.useEffect)(() => {
+    (0, import_react136.useEffect)(() => {
       if (!autoResize) return;
       const el = innerRef.current;
       if (!el) return;
@@ -26592,9 +26727,9 @@ function TextareaToolbar({
 
 // src/components/Timeline/Timeline.tsx
 var import_framer_motion35 = require("framer-motion");
-var import_react136 = require("react");
+var import_react137 = require("react");
 var import_jsx_runtime117 = require("react/jsx-runtime");
-var Timeline = (0, import_react136.forwardRef)(
+var Timeline = (0, import_react137.forwardRef)(
   function Timeline2({
     items,
     size = "md",
@@ -26660,7 +26795,7 @@ var Timeline = (0, import_react136.forwardRef)(
 Timeline.displayName = "Timeline";
 
 // src/components/TimePicker/TimePicker.tsx
-var import_react137 = require("react");
+var import_react138 = require("react");
 var import_icons44 = require("@octaviaflow/icons");
 var import_jsx_runtime118 = require("react/jsx-runtime");
 var pad = (n) => n.toString().padStart(2, "0");
@@ -26675,7 +26810,7 @@ function clampSeg(seg, n, use24h) {
   }
   return Math.max(0, Math.min(59, n));
 }
-var TimePicker = (0, import_react137.forwardRef)(
+var TimePicker = (0, import_react138.forwardRef)(
   function TimePicker2({
     label,
     value,
@@ -26695,28 +26830,28 @@ var TimePicker = (0, import_react137.forwardRef)(
     "aria-describedby": consumerDescribedBy,
     ...rest
   }, forwardedRef) {
-    const reactId = (0, import_react137.useId)();
+    const reactId = (0, import_react138.useId)();
     const baseId = providedId ?? `ods-timepicker-${reactId}`;
     const labelId = label ? `${baseId}-label` : void 0;
     const hintId = error || helperText ? `${baseId}-hint` : void 0;
     const describedBy = [consumerDescribedBy, hintId].filter(Boolean).join(" ") || void 0;
-    const [open, setOpen] = (0, import_react137.useState)(false);
-    const [activeSeg, setActiveSeg] = (0, import_react137.useState)(null);
+    const [open, setOpen] = (0, import_react138.useState)(false);
+    const [activeSeg, setActiveSeg] = (0, import_react138.useState)(null);
     const COMMIT_TIMEOUT_MS = 1500;
-    const [draft, setDraft] = (0, import_react137.useState)(
+    const [draft, setDraft] = (0, import_react138.useState)(
       null
     );
-    const draftRef = (0, import_react137.useRef)(null);
-    const setDraftBoth = (0, import_react137.useCallback)(
+    const draftRef = (0, import_react138.useRef)(null);
+    const setDraftBoth = (0, import_react138.useCallback)(
       (next) => {
         draftRef.current = next;
         setDraft(next);
       },
       []
     );
-    const commitTimerRef = (0, import_react137.useRef)(null);
-    const wrapRef = (0, import_react137.useRef)(null);
-    const valueRef = (0, import_react137.useRef)(value);
+    const commitTimerRef = (0, import_react138.useRef)(null);
+    const wrapRef = (0, import_react138.useRef)(null);
+    const valueRef = (0, import_react138.useRef)(value);
     valueRef.current = value;
     const setWrapRef = (node) => {
       wrapRef.current = node;
@@ -26724,11 +26859,11 @@ var TimePicker = (0, import_react137.forwardRef)(
       else if (forwardedRef)
         forwardedRef.current = node;
     };
-    const hoursRef = (0, import_react137.useRef)(null);
-    const minutesRef = (0, import_react137.useRef)(null);
-    const secondsRef = (0, import_react137.useRef)(null);
+    const hoursRef = (0, import_react138.useRef)(null);
+    const minutesRef = (0, import_react138.useRef)(null);
+    const secondsRef = (0, import_react138.useRef)(null);
     const refOf = (s) => s === "hours" ? hoursRef : s === "minutes" ? minutesRef : secondsRef;
-    const commit = (0, import_react137.useCallback)(
+    const commit = (0, import_react138.useCallback)(
       (seg, n) => {
         const base = valueRef.current;
         const next = { ...base, [seg]: clampSeg(seg, n, use24h) };
@@ -26760,13 +26895,13 @@ var TimePicker = (0, import_react137.forwardRef)(
       valueRef.current = next;
       onChange?.(next);
     };
-    const clearCommitTimer = (0, import_react137.useCallback)(() => {
+    const clearCommitTimer = (0, import_react138.useCallback)(() => {
       if (commitTimerRef.current != null) {
         clearTimeout(commitTimerRef.current);
         commitTimerRef.current = null;
       }
     }, []);
-    const commitDraft = (0, import_react137.useCallback)(
+    const commitDraft = (0, import_react138.useCallback)(
       (seg, digits) => {
         clearCommitTimer();
         const n = parseInt(digits || "0", 10);
@@ -26778,11 +26913,11 @@ var TimePicker = (0, import_react137.forwardRef)(
       },
       [clearCommitTimer, commit, use24h, setDraftBoth]
     );
-    const flushDraft = (0, import_react137.useCallback)(() => {
+    const flushDraft = (0, import_react138.useCallback)(() => {
       const d = draftRef.current;
       if (d) commitDraft(d.seg, d.digits);
     }, [commitDraft]);
-    const focusSegment = (0, import_react137.useCallback)(
+    const focusSegment = (0, import_react138.useCallback)(
       (seg) => {
         const d = draftRef.current;
         if (d && d.seg !== seg) commitDraft(d.seg, d.digits);
@@ -26791,14 +26926,14 @@ var TimePicker = (0, import_react137.forwardRef)(
       },
       [commitDraft]
     );
-    (0, import_react137.useEffect)(() => {
+    (0, import_react138.useEffect)(() => {
       if (!open) {
         clearCommitTimer();
         setDraftBoth(null);
       }
       return clearCommitTimer;
     }, [open, clearCommitTimer, setDraftBoth]);
-    (0, import_react137.useEffect)(() => {
+    (0, import_react138.useEffect)(() => {
       if (!open) return;
       const onDoc = (e) => {
         if (!wrapRef.current?.contains(e.target)) {
@@ -26995,7 +27130,7 @@ var TimePicker = (0, import_react137.forwardRef)(
                     )
                   ] })
                 ] }),
-                /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "ods-timepicker__body", children: segOrder().map((seg, i, arr) => /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(import_react137.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "ods-timepicker__body", children: segOrder().map((seg, i, arr) => /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)(import_react138.Fragment, { children: [
                   /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("div", { className: "ods-timepicker__col", children: [
                     /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("span", { className: "ods-timepicker__col-lbl", children: seg === "hours" ? "HOUR" : seg === "minutes" ? "MIN" : "SEC" }),
                     /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
@@ -27044,7 +27179,7 @@ var TimePicker = (0, import_react137.forwardRef)(
 TimePicker.displayName = "TimePicker";
 
 // src/components/TimezonePicker/TimezonePicker.tsx
-var import_react138 = require("react");
+var import_react139 = require("react");
 var import_icons45 = require("@octaviaflow/icons");
 var import_jsx_runtime119 = require("react/jsx-runtime");
 var DEFAULT_TZS = [
@@ -27061,7 +27196,7 @@ var DEFAULT_TZS = [
   { iana: "Asia/Tokyo", label: "Tokyo", offset: "UTC+9" },
   { iana: "Australia/Sydney", label: "Sydney", offset: "UTC+10" }
 ];
-var TimezonePicker = (0, import_react138.forwardRef)(
+var TimezonePicker = (0, import_react139.forwardRef)(
   function TimezonePicker2({
     label,
     value,
@@ -27079,46 +27214,46 @@ var TimezonePicker = (0, import_react138.forwardRef)(
     "aria-describedby": consumerDescribedBy,
     ...rest
   }, forwardedRef) {
-    const reactId = (0, import_react138.useId)();
+    const reactId = (0, import_react139.useId)();
     const baseId = providedId ?? `ods-tzpicker-${reactId}`;
     const labelId = label ? `${baseId}-label` : void 0;
     const listboxId = `${baseId}-listbox`;
     const hintId = error || helperText ? `${baseId}-hint` : void 0;
     const describedBy = [consumerDescribedBy, hintId].filter(Boolean).join(" ") || void 0;
-    const [open, setOpen] = (0, import_react138.useState)(false);
-    const [query, setQuery] = (0, import_react138.useState)("");
-    const [activeIndex, setActiveIndex] = (0, import_react138.useState)(0);
-    const wrapRef = (0, import_react138.useRef)(null);
-    const triggerRef = (0, import_react138.useRef)(null);
-    const inputRef = (0, import_react138.useRef)(null);
-    const listRef = (0, import_react138.useRef)(null);
+    const [open, setOpen] = (0, import_react139.useState)(false);
+    const [query, setQuery] = (0, import_react139.useState)("");
+    const [activeIndex, setActiveIndex] = (0, import_react139.useState)(0);
+    const wrapRef = (0, import_react139.useRef)(null);
+    const triggerRef = (0, import_react139.useRef)(null);
+    const inputRef = (0, import_react139.useRef)(null);
+    const listRef = (0, import_react139.useRef)(null);
     const setWrapRef = (node) => {
       wrapRef.current = node;
       if (typeof forwardedRef === "function") forwardedRef(node);
       else if (forwardedRef)
         forwardedRef.current = node;
     };
-    const selected = (0, import_react138.useMemo)(
+    const selected = (0, import_react139.useMemo)(
       () => options.find((o) => o.iana === value),
       [options, value]
     );
-    const filtered = (0, import_react138.useMemo)(() => {
+    const filtered = (0, import_react139.useMemo)(() => {
       if (!query.trim()) return options;
       const q2 = query.trim().toLowerCase();
       return options.filter(
         (o) => o.iana.toLowerCase().includes(q2) || o.label.toLowerCase().includes(q2) || o.offset.toLowerCase().includes(q2) || o.region?.toLowerCase().includes(q2)
       );
     }, [options, query]);
-    (0, import_react138.useEffect)(() => {
+    (0, import_react139.useEffect)(() => {
       if (activeIndex >= filtered.length) setActiveIndex(0);
     }, [filtered.length, activeIndex]);
-    (0, import_react138.useEffect)(() => {
+    (0, import_react139.useEffect)(() => {
       if (!open) return;
       const idx = filtered.findIndex((o) => o.iana === value);
       setActiveIndex(idx >= 0 ? idx : 0);
       inputRef.current?.focus();
     }, [open]);
-    (0, import_react138.useEffect)(() => {
+    (0, import_react139.useEffect)(() => {
       if (!open) return;
       const onDoc = (e) => {
         if (!wrapRef.current?.contains(e.target)) {
@@ -27129,7 +27264,7 @@ var TimezonePicker = (0, import_react138.forwardRef)(
       document.addEventListener("mousedown", onDoc);
       return () => document.removeEventListener("mousedown", onDoc);
     }, [open]);
-    (0, import_react138.useEffect)(() => {
+    (0, import_react139.useEffect)(() => {
       if (!open) return;
       const list = listRef.current;
       if (!list) return;
@@ -27138,7 +27273,7 @@ var TimezonePicker = (0, import_react138.forwardRef)(
       );
       active?.scrollIntoView?.({ block: "nearest" });
     }, [activeIndex, open]);
-    const select = (0, import_react138.useCallback)(
+    const select = (0, import_react139.useCallback)(
       (iana) => {
         onChange?.(iana);
         setOpen(false);
@@ -27147,7 +27282,7 @@ var TimezonePicker = (0, import_react138.forwardRef)(
       },
       [onChange]
     );
-    const handlePopoverKey = (0, import_react138.useCallback)(
+    const handlePopoverKey = (0, import_react139.useCallback)(
       (e) => {
         if (e.key === "ArrowDown") {
           e.preventDefault();
@@ -27341,7 +27476,7 @@ TimezonePicker.displayName = "TimezonePicker";
 
 // src/components/Toast/Toast.tsx
 var import_framer_motion36 = require("framer-motion");
-var import_react139 = require("react");
+var import_react140 = require("react");
 var import_react_dom16 = require("react-dom");
 var import_jsx_runtime120 = require("react/jsx-runtime");
 var defaultIcons = {
@@ -27431,7 +27566,7 @@ var defaultIcons = {
     )
   ] })
 };
-var ToastContext = (0, import_react139.createContext)(null);
+var ToastContext = (0, import_react140.createContext)(null);
 function ToastBody({ item, onDismiss }) {
   const dismiss = () => onDismiss(item.id);
   if (item.render) return /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(import_jsx_runtime120.Fragment, { children: item.render({ id: item.id, dismiss }) });
@@ -27489,10 +27624,10 @@ function ToastBody({ item, onDismiss }) {
   ] });
 }
 function PositionStack({ items, position, onDismiss, maxStack }) {
-  const [hovered, setHovered] = (0, import_react139.useState)(false);
-  const [pinned, setPinned] = (0, import_react139.useState)(false);
+  const [hovered, setHovered] = (0, import_react140.useState)(false);
+  const [pinned, setPinned] = (0, import_react140.useState)(false);
   const expanded = hovered || pinned;
-  const ordered = (0, import_react139.useMemo)(() => [...items].reverse(), [items]);
+  const ordered = (0, import_react140.useMemo)(() => [...items].reverse(), [items]);
   const isBottom = position.startsWith("bottom");
   const dir = isBottom ? -1 : 1;
   if (pinned && items.length === 0) setPinned(false);
@@ -27590,10 +27725,10 @@ function ToastProvider({
   defaultPosition = "bottom-right",
   maxStack = 3
 }) {
-  const [toasts, setToasts] = (0, import_react139.useState)([]);
-  const timers = (0, import_react139.useRef)(/* @__PURE__ */ new Map());
-  const idCounter2 = (0, import_react139.useRef)(0);
-  const dismiss = (0, import_react139.useCallback)((id) => {
+  const [toasts, setToasts] = (0, import_react140.useState)([]);
+  const timers = (0, import_react140.useRef)(/* @__PURE__ */ new Map());
+  const idCounter2 = (0, import_react140.useRef)(0);
+  const dismiss = (0, import_react140.useCallback)((id) => {
     setToasts((prev) => prev.filter((t) => t.id !== id));
     const timer = timers.current.get(id);
     if (timer) {
@@ -27601,7 +27736,7 @@ function ToastProvider({
       timers.current.delete(id);
     }
   }, []);
-  const dismissAll = (0, import_react139.useCallback)((position) => {
+  const dismissAll = (0, import_react140.useCallback)((position) => {
     setToasts((prev) => {
       const remaining = position ? prev.filter((t) => t.position !== position) : [];
       for (const t of prev) {
@@ -27616,7 +27751,7 @@ function ToastProvider({
       return remaining;
     });
   }, []);
-  const toast = (0, import_react139.useCallback)(
+  const toast = (0, import_react140.useCallback)(
     (options) => {
       const id = `toast-${++idCounter2.current}`;
       const item = {
@@ -27643,7 +27778,7 @@ function ToastProvider({
     },
     [dismiss, defaultPosition]
   );
-  const groups = (0, import_react139.useMemo)(() => {
+  const groups = (0, import_react140.useMemo)(() => {
     const out = {
       "top-left": [],
       "top-center": [],
@@ -27676,7 +27811,7 @@ function ToastProvider({
   ] });
 }
 function useToast() {
-  const ctx = (0, import_react139.useContext)(ToastContext);
+  const ctx = (0, import_react140.useContext)(ToastContext);
   if (!ctx) throw new Error("useToast must be used within a ToastProvider");
   const { toast: raw, dismiss, dismissAll } = ctx;
   const toast = Object.assign((options) => raw(options), {
@@ -27690,7 +27825,7 @@ function useToast() {
 }
 
 // src/components/Toggle/Toggle.tsx
-var import_react140 = require("react");
+var import_react141 = require("react");
 var import_jsx_runtime121 = require("react/jsx-runtime");
 function Toggle({
   label,
@@ -27710,15 +27845,15 @@ function Toggle({
   ref,
   ...rest
 }) {
-  const reactId = (0, import_react140.useId)();
+  const reactId = (0, import_react141.useId)();
   const baseId = providedId ?? `ods-toggle-${reactId}`;
   const labelId = label ? `${baseId}-label` : void 0;
   const hintId = error || helperText ? `${baseId}-hint` : void 0;
   const describedBy = [consumerDescribedBy, hintId].filter(Boolean).join(" ") || void 0;
   const groupLabelledBy = ariaLabelledBy ?? labelId;
   const groupAriaLabel = !groupLabelledBy ? ariaLabel ?? "Toggle group" : void 0;
-  const buttonRefs = (0, import_react140.useRef)([]);
-  const findNextEnabled = (0, import_react140.useCallback)(
+  const buttonRefs = (0, import_react141.useRef)([]);
+  const findNextEnabled = (0, import_react141.useCallback)(
     (from, dir) => {
       if (options.length === 0) return -1;
       let i = from;
@@ -27731,11 +27866,11 @@ function Toggle({
     },
     [options, disabled]
   );
-  const focusIndex = (0, import_react140.useCallback)((i) => {
+  const focusIndex = (0, import_react141.useCallback)((i) => {
     if (i < 0) return;
     buttonRefs.current[i]?.focus();
   }, []);
-  const handleKey = (0, import_react140.useCallback)(
+  const handleKey = (0, import_react141.useCallback)(
     (e, idx) => {
       if (e.key === "ArrowRight" || e.key === "ArrowDown") {
         e.preventDefault();
@@ -27884,7 +28019,7 @@ function ToolbarSpacer() {
 }
 
 // src/components/ToolCard/ToolCard.tsx
-var import_react141 = require("react");
+var import_react142 = require("react");
 var import_icons46 = require("@octaviaflow/icons");
 var import_jsx_runtime123 = require("react/jsx-runtime");
 var CATEGORY_GLYPH = {
@@ -27897,7 +28032,7 @@ var CATEGORY_GLYPH = {
   ai: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_icons46.MagicWandIcon, { size: "xs" }),
   custom: /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(import_icons46.ExtensionsIcon, { size: "xs" })
 };
-var ToolCard = (0, import_react141.forwardRef)(
+var ToolCard = (0, import_react142.forwardRef)(
   function ToolCard2({
     name,
     description,
@@ -27918,7 +28053,7 @@ var ToolCard = (0, import_react141.forwardRef)(
     onKeyDown: consumerOnKeyDown,
     ...rest
   }, ref) {
-    const reactId = (0, import_react141.useId)();
+    const reactId = (0, import_react142.useId)();
     const baseId = providedId ?? `ods-tool-card-${reactId}`;
     const nameId = `${baseId}-name`;
     const descId = description ? `${baseId}-desc` : void 0;
@@ -28089,7 +28224,7 @@ function TopBar({
 
 // src/components/TraceStep/TraceStep.tsx
 var import_framer_motion37 = require("framer-motion");
-var import_react142 = require("react");
+var import_react143 = require("react");
 var import_icons47 = require("@octaviaflow/icons");
 var import_jsx_runtime125 = require("react/jsx-runtime");
 var DEFAULT_KIND_GLYPH = {
@@ -28100,7 +28235,7 @@ var DEFAULT_KIND_GLYPH = {
   error: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(import_icons47.WarningAltIcon, { size: "xs" })
 };
 var FALLBACK_GLYPH = DEFAULT_KIND_GLYPH.thought;
-var TraceStep = (0, import_react142.forwardRef)(
+var TraceStep = (0, import_react143.forwardRef)(
   function TraceStep2({
     index,
     kind = "thought",
@@ -28122,15 +28257,15 @@ var TraceStep = (0, import_react142.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react142.useId)();
+    const reactId = (0, import_react143.useId)();
     const baseId = providedId ?? `ods-trace-step-${reactId}`;
     const headId = `${baseId}-head`;
     const contentId = `${baseId}-content`;
-    const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react142.useState)(defaultOpen);
+    const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react143.useState)(defaultOpen);
     const isControlled = controlledOpen !== void 0;
     const open = isControlled ? controlledOpen : uncontrolledOpen;
     const canExpand = !!children;
-    const toggle = (0, import_react142.useCallback)(() => {
+    const toggle = (0, import_react143.useCallback)(() => {
       if (!canExpand) return;
       const next = !open;
       if (!isControlled) setUncontrolledOpen(next);
@@ -28270,7 +28405,7 @@ TraceStep.displayName = "TraceStep";
 // src/components/TreeView/TreeView.tsx
 var import_icons48 = require("@octaviaflow/icons");
 var import_framer_motion38 = require("framer-motion");
-var import_react143 = require("react");
+var import_react144 = require("react");
 var import_jsx_runtime126 = require("react/jsx-runtime");
 function buildVisibleList(nodes, expanded, out = [], level = 0, parentId = null) {
   for (const n of nodes) {
@@ -28281,7 +28416,7 @@ function buildVisibleList(nodes, expanded, out = [], level = 0, parentId = null)
   }
   return out;
 }
-var TreeView = (0, import_react143.forwardRef)(
+var TreeView = (0, import_react144.forwardRef)(
   function TreeView2({
     nodes,
     selectedId: controlledSelected,
@@ -28298,24 +28433,24 @@ var TreeView = (0, import_react143.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react143.useId)();
+    const reactId = (0, import_react144.useId)();
     const baseId = providedId ?? `ods-tree-${reactId}`;
     const reducedMotion = (0, import_framer_motion38.useReducedMotion)();
-    const [internalSelected, setInternalSelected] = (0, import_react143.useState)(defaultSelectedId);
+    const [internalSelected, setInternalSelected] = (0, import_react144.useState)(defaultSelectedId);
     const isSelectedControlled = controlledSelected !== void 0;
     const selectedId = isSelectedControlled ? controlledSelected : internalSelected;
-    const [internalExpanded, setInternalExpanded] = (0, import_react143.useState)(
+    const [internalExpanded, setInternalExpanded] = (0, import_react144.useState)(
       () => new Set(defaultExpandedIds ?? [])
     );
     const isExpandedControlled = controlledExpanded !== void 0;
     const expandedSet = isExpandedControlled ? controlledExpanded : internalExpanded;
-    const [loaded, setLoaded] = (0, import_react143.useState)({});
-    const [loading, setLoading] = (0, import_react143.useState)(/* @__PURE__ */ new Set());
-    const resolveChildren = (0, import_react143.useCallback)(
+    const [loaded, setLoaded] = (0, import_react144.useState)({});
+    const [loading, setLoading] = (0, import_react144.useState)(/* @__PURE__ */ new Set());
+    const resolveChildren = (0, import_react144.useCallback)(
       (node) => node.children ?? loaded[node.id],
       [loaded]
     );
-    const resolvedNodes = (0, import_react143.useMemo)(() => {
+    const resolvedNodes = (0, import_react144.useMemo)(() => {
       const walk = (ns) => ns.map((n) => {
         const kids = resolveChildren(n);
         if (kids) return { ...n, children: walk(kids) };
@@ -28323,18 +28458,18 @@ var TreeView = (0, import_react143.forwardRef)(
       });
       return walk(nodes);
     }, [nodes, resolveChildren]);
-    const visibleList = (0, import_react143.useMemo)(
+    const visibleList = (0, import_react144.useMemo)(
       () => buildVisibleList(resolvedNodes, expandedSet),
       [resolvedNodes, expandedSet]
     );
-    const setExpanded = (0, import_react143.useCallback)(
+    const setExpanded = (0, import_react144.useCallback)(
       (next) => {
         if (!isExpandedControlled) setInternalExpanded(new Set(next));
         onExpandedChange?.(new Set(next));
       },
       [isExpandedControlled, onExpandedChange]
     );
-    const toggleExpand = (0, import_react143.useCallback)(
+    const toggleExpand = (0, import_react144.useCallback)(
       async (node) => {
         const next = new Set(expandedSet);
         const isOpen = next.has(node.id);
@@ -28363,7 +28498,7 @@ var TreeView = (0, import_react143.forwardRef)(
       },
       [expandedSet, setExpanded, onLoadChildren, loaded, loading]
     );
-    const handleSelect = (0, import_react143.useCallback)(
+    const handleSelect = (0, import_react144.useCallback)(
       (node) => {
         if (node.disabled || disabled) return;
         if (!isSelectedControlled) setInternalSelected(node.id);
@@ -28538,7 +28673,7 @@ var TreeView = (0, import_react143.forwardRef)(
       );
     };
     const visibleIdxCursor = { value: 0 };
-    (0, import_react143.useEffect)(() => {
+    (0, import_react144.useEffect)(() => {
     }, [tabStopId]);
     return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
       "ul",
@@ -28563,9 +28698,9 @@ var TreeView = (0, import_react143.forwardRef)(
 TreeView.displayName = "TreeView";
 
 // src/components/UserCard/UserCard.tsx
-var import_react144 = require("react");
+var import_react145 = require("react");
 var import_jsx_runtime127 = require("react/jsx-runtime");
-var UserCard = (0, import_react144.forwardRef)(
+var UserCard = (0, import_react145.forwardRef)(
   function UserCard2({
     name,
     nameAs = "h3",
@@ -28586,7 +28721,7 @@ var UserCard = (0, import_react144.forwardRef)(
     className,
     ...rest
   }, ref) {
-    const reactId = (0, import_react144.useId)();
+    const reactId = (0, import_react145.useId)();
     const baseId = providedId ?? `ods-user-card-${reactId}`;
     const nameId = `${baseId}-name`;
     const isInteractive = Boolean(href || onClick) && !disabled;
@@ -28688,7 +28823,7 @@ UserCard.displayName = "UserCard";
 var import_react155 = require("react");
 
 // src/hooks/useWorkflow.ts
-var import_react145 = require("react");
+var import_react146 = require("react");
 
 // src/workflow/types.ts
 var types_exports = {};
@@ -29168,7 +29303,7 @@ function genId(prefix) {
   return `${prefix}_${Date.now().toString(36)}_${idCounter}`;
 }
 function useWorkflow(options = {}) {
-  const initial = (0, import_react145.useMemo)(
+  const initial = (0, import_react146.useMemo)(
     () => buildInitialWorkflow({
       metadata: options.metadata ? { ...options.metadata } : void 0,
       canvas: {
@@ -29201,12 +29336,12 @@ function useWorkflow(options = {}) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
     []
   );
-  const [workflow, dispatch] = (0, import_react145.useReducer)(reducer, initial);
-  const addNode = (0, import_react145.useCallback)(
+  const [workflow, dispatch] = (0, import_react146.useReducer)(reducer, initial);
+  const addNode = (0, import_react146.useCallback)(
     (node) => dispatch({ type: "ADD_NODE", payload: node }),
     []
   );
-  const createNode = (0, import_react145.useCallback)(
+  const createNode = (0, import_react146.useCallback)(
     (partial) => {
       const id = partial.id ?? genId("node");
       const ports = partial.ports ?? {
@@ -29255,27 +29390,27 @@ function useWorkflow(options = {}) {
     },
     []
   );
-  const updateNode = (0, import_react145.useCallback)(
+  const updateNode = (0, import_react146.useCallback)(
     (id, updates) => dispatch({ type: "UPDATE_NODE", payload: { id, updates } }),
     []
   );
-  const deleteNode = (0, import_react145.useCallback)(
+  const deleteNode = (0, import_react146.useCallback)(
     (id) => dispatch({ type: "DELETE_NODE", payload: id }),
     []
   );
-  const deleteNodes = (0, import_react145.useCallback)(
+  const deleteNodes = (0, import_react146.useCallback)(
     (ids) => dispatch({ type: "DELETE_NODES", payload: ids }),
     []
   );
-  const replaceNodes = (0, import_react145.useCallback)(
+  const replaceNodes = (0, import_react146.useCallback)(
     (nodes) => dispatch({ type: "REPLACE_NODES", payload: nodes }),
     []
   );
-  const addEdge = (0, import_react145.useCallback)(
+  const addEdge = (0, import_react146.useCallback)(
     (edge) => dispatch({ type: "ADD_EDGE", payload: edge }),
     []
   );
-  const createEdge = (0, import_react145.useCallback)(
+  const createEdge = (0, import_react146.useCallback)(
     (source, sourcePort, target, targetPort) => {
       const edge = {
         id: genId("edge"),
@@ -29293,20 +29428,20 @@ function useWorkflow(options = {}) {
     },
     []
   );
-  const deleteEdge = (0, import_react145.useCallback)(
+  const deleteEdge = (0, import_react146.useCallback)(
     (id) => dispatch({ type: "DELETE_EDGE", payload: id }),
     []
   );
-  const replaceEdges = (0, import_react145.useCallback)(
+  const replaceEdges = (0, import_react146.useCallback)(
     (edges) => dispatch({ type: "REPLACE_EDGES", payload: edges }),
     []
   );
-  const startConnecting = (0, import_react145.useCallback)(
+  const startConnecting = (0, import_react146.useCallback)(
     (nodeId, portId, portType) => dispatch({ type: "START_CONNECTING", payload: { nodeId, portId, portType } }),
     []
   );
-  const endConnecting = (0, import_react145.useCallback)(() => dispatch({ type: "END_CONNECTING" }), []);
-  const selectNode = (0, import_react145.useCallback)(
+  const endConnecting = (0, import_react146.useCallback)(() => dispatch({ type: "END_CONNECTING" }), []);
+  const selectNode = (0, import_react146.useCallback)(
     (id, multi = false) => {
       if (multi) {
         const current = workflow.canvas.selectedNodes;
@@ -29318,36 +29453,36 @@ function useWorkflow(options = {}) {
     },
     [workflow.canvas.selectedNodes]
   );
-  const selectNodes = (0, import_react145.useCallback)(
+  const selectNodes = (0, import_react146.useCallback)(
     (ids) => dispatch({ type: "SELECT_NODES", payload: ids }),
     []
   );
-  const selectEdge = (0, import_react145.useCallback)(
+  const selectEdge = (0, import_react146.useCallback)(
     (id) => dispatch({ type: "SELECT_EDGE", payload: id }),
     []
   );
-  const deselectAll = (0, import_react145.useCallback)(() => dispatch({ type: "DESELECT_ALL" }), []);
-  const zoomIn = (0, import_react145.useCallback)(() => {
+  const deselectAll = (0, import_react146.useCallback)(() => dispatch({ type: "DESELECT_ALL" }), []);
+  const zoomIn = (0, import_react146.useCallback)(() => {
     const z = Math.min(workflow.canvas.viewport.zoom * 1.2, 2);
     dispatch({ type: "UPDATE_VIEWPORT", payload: { zoom: z } });
   }, [workflow.canvas.viewport.zoom]);
-  const zoomOut = (0, import_react145.useCallback)(() => {
+  const zoomOut = (0, import_react146.useCallback)(() => {
     const z = Math.max(workflow.canvas.viewport.zoom / 1.2, 0.25);
     dispatch({ type: "UPDATE_VIEWPORT", payload: { zoom: z } });
   }, [workflow.canvas.viewport.zoom]);
-  const resetViewport = (0, import_react145.useCallback)(
+  const resetViewport = (0, import_react146.useCallback)(
     () => dispatch({ type: "UPDATE_VIEWPORT", payload: { x: 0, y: 0, zoom: 1 } }),
     []
   );
-  const setViewport = (0, import_react145.useCallback)(
+  const setViewport = (0, import_react146.useCallback)(
     (viewport) => dispatch({ type: "UPDATE_VIEWPORT", payload: viewport }),
     []
   );
-  const undo = (0, import_react145.useCallback)(() => dispatch({ type: "UNDO" }), []);
-  const redo = (0, import_react145.useCallback)(() => dispatch({ type: "REDO" }), []);
+  const undo = (0, import_react146.useCallback)(() => dispatch({ type: "UNDO" }), []);
+  const redo = (0, import_react146.useCallback)(() => dispatch({ type: "REDO" }), []);
   const canUndo = workflow.canvas.history.past.length > 0;
   const canRedo = workflow.canvas.history.future.length > 0;
-  const validate = (0, import_react145.useCallback)(() => workflow.validation, [workflow.validation]);
+  const validate = (0, import_react146.useCallback)(() => workflow.validation, [workflow.validation]);
   return {
     workflow,
     dispatch,
@@ -29594,55 +29729,11 @@ function createFlowStore({
 }
 var EMPTY_SET = /* @__PURE__ */ new Set();
 
-// src/workflow/utils/geometry.ts
-var DEFAULT_NODE_WIDTH3 = 368;
-var DEFAULT_NODE_HEIGHT3 = 96;
-var COLLAPSED_GROUP_HEIGHT = 36;
-var COLLAPSED_FOREACH_HEIGHT = 40;
-function effectiveHeight(node) {
-  const data = node.data;
-  if (data?.collapsed) {
-    if (node.type === "group") return COLLAPSED_GROUP_HEIGHT;
-    if (node.type === "forEach") return COLLAPSED_FOREACH_HEIGHT;
-  }
-  return node.height ?? DEFAULT_NODE_HEIGHT3;
-}
-function handleCentre(node, side, index, total) {
-  const w = node.width ?? DEFAULT_NODE_WIDTH3;
-  const h = effectiveHeight(node);
-  const x0 = node.position.x;
-  const y0 = node.position.y;
-  const denom = total + 1;
-  const ratio = (index + 1) / denom;
-  switch (side) {
-    case "top":
-      return { x: x0 + w * ratio, y: y0 };
-    case "bottom":
-      return { x: x0 + w * ratio, y: y0 + h };
-    case "left":
-      return { x: x0, y: y0 + h * ratio };
-    case "right":
-      return { x: x0 + w, y: y0 + h * ratio };
-  }
-}
-function screenToFlow(p, vp) {
-  return {
-    x: (p.x - vp.x) / vp.zoom,
-    y: (p.y - vp.y) / vp.zoom
-  };
-}
-function flowToScreen(p, vp) {
-  return {
-    x: p.x * vp.zoom + vp.x,
-    y: p.y * vp.zoom + vp.y
-  };
-}
-
 // src/workflow/utils/collision.ts
 function resolveNodeCollisions(node, proposed, others, opts) {
   const { gap, maxIterations = 8, exclude, scopeToSiblings = true } = opts;
   if (gap < 0 || others.length === 0) return proposed;
-  const w = node.width ?? DEFAULT_NODE_WIDTH3;
+  const w = node.width ?? DEFAULT_NODE_WIDTH2;
   const h = effectiveHeight(node);
   const parentId = node.parentId;
   const candidates = others.filter((o) => {
@@ -29666,7 +29757,7 @@ function resolveNodeCollisions(node, proposed, others, opts) {
     const aTop = cur.y - gap;
     const aBottom = cur.y + h + gap;
     for (const o of candidates) {
-      const ow = o.width ?? DEFAULT_NODE_WIDTH3;
+      const ow = o.width ?? DEFAULT_NODE_WIDTH2;
       const oh = effectiveHeight(o);
       const bLeft = o.position.x;
       const bRight = o.position.x + ow;
@@ -29732,9 +29823,9 @@ function clampToParentExtent(node, proposed, nodes) {
   if (node.extent !== "parent" || !node.parentId) return proposed;
   const parent = nodes.find((n) => n.id === node.parentId);
   if (!parent) return proposed;
-  const pw = parent.width ?? DEFAULT_NODE_WIDTH3;
+  const pw = parent.width ?? DEFAULT_NODE_WIDTH2;
   const ph = effectiveHeight(parent);
-  const w = node.width ?? DEFAULT_NODE_WIDTH3;
+  const w = node.width ?? DEFAULT_NODE_WIDTH2;
   const h = effectiveHeight(node);
   const minX = parent.position.x;
   const minY = parent.position.y;
@@ -29753,7 +29844,7 @@ function findContainingGroup(point, nodes, exclude = []) {
     if (n.data && typeof n.data === "object" && n.data.collapsed) {
       continue;
     }
-    const w = n.width ?? DEFAULT_NODE_WIDTH3;
+    const w = n.width ?? DEFAULT_NODE_WIDTH2;
     const h = effectiveHeight(n);
     if (point.x >= n.position.x && point.y >= n.position.y && point.x <= n.position.x + w && point.y <= n.position.y + h) {
       return n;
@@ -29764,52 +29855,6 @@ function findContainingGroup(point, nodes, exclude = []) {
 
 // src/workflow/components/FlowEdge/FlowEdge.tsx
 var import_react147 = require("react");
-
-// src/workflow/components/Handle/handleRegistry.ts
-var import_react146 = require("react");
-var HandleRegistryContext = (0, import_react146.createContext)(null);
-function useHandleRegistry() {
-  const r = (0, import_react146.useContext)(HandleRegistryContext);
-  if (!r) {
-    throw new Error("[@octaviaflow/core/workflow] Handle must be used inside <FlowCanvas>.");
-  }
-  return r;
-}
-function createHandleRegistry() {
-  const map = /* @__PURE__ */ new Map();
-  const key = (n, t, h) => `${n}::${t}::${h}`;
-  const listeners = /* @__PURE__ */ new Set();
-  const notify = () => {
-    for (const l of listeners) l();
-  };
-  return {
-    register(d) {
-      map.set(key(d.nodeId, d.type, d.handleId), d);
-      notify();
-      return () => {
-        const k = key(d.nodeId, d.type, d.handleId);
-        if (map.get(k) === d) {
-          map.delete(k);
-          notify();
-        }
-      };
-    },
-    resolve(nodeId, type, handleId) {
-      return map.get(key(nodeId, type, handleId));
-    },
-    all() {
-      return Array.from(map.values());
-    },
-    subscribe(listener) {
-      listeners.add(listener);
-      return () => {
-        listeners.delete(listener);
-      };
-    }
-  };
-}
-
-// src/workflow/components/FlowEdge/FlowEdge.tsx
 var import_jsx_runtime128 = require("react/jsx-runtime");
 function FlowEdgeImpl({
   edge,
@@ -29848,7 +29893,7 @@ function FlowEdgeImpl({
   const targetTotal = targetDesc?.total ?? 1;
   const rawStart = handleCentre(sourceNode, sourceSide, sourceIndex, sourceTotal);
   const rawEnd = handleCentre(targetNode, targetSide, targetIndex, targetTotal);
-  const HANDLE_GAP = 8;
+  const HANDLE_GAP = 2;
   const start = offsetAlongSide3(rawStart, sourceRoute, HANDLE_GAP);
   const end = offsetAlongSide3(rawEnd, targetRoute, HANDLE_GAP);
   const routing = edge.routing ?? "bezier";
@@ -30291,8 +30336,8 @@ function NodeResizer({
     e.preventDefault();
     e.stopPropagation();
     e.target.setPointerCapture(e.pointerId);
-    const w = node.width ?? DEFAULT_NODE_WIDTH3;
-    const h = node.height ?? DEFAULT_NODE_HEIGHT3;
+    const w = node.width ?? DEFAULT_NODE_WIDTH2;
+    const h = node.height ?? DEFAULT_NODE_HEIGHT2;
     dragRef.current = {
       pointerId: e.pointerId,
       corner,
@@ -30356,8 +30401,8 @@ function NodeResizer({
       const cur = flow.getNode(node.id);
       if (cur) {
         onResizeEnd?.({
-          width: cur.width ?? DEFAULT_NODE_WIDTH3,
-          height: cur.height ?? DEFAULT_NODE_HEIGHT3
+          width: cur.width ?? DEFAULT_NODE_WIDTH2,
+          height: cur.height ?? DEFAULT_NODE_HEIGHT2
         });
       }
       dragRef.current = null;
@@ -31535,7 +31580,7 @@ function FlowCanvas2(props) {
         let maxX = Number.NEGATIVE_INFINITY;
         let maxY = Number.NEGATIVE_INFINITY;
         for (const n of targetNodes) {
-          const w = n.width ?? DEFAULT_NODE_WIDTH3;
+          const w = n.width ?? DEFAULT_NODE_WIDTH2;
           const h = effectiveHeight(n);
           if (n.position.x < minX) minX = n.position.x;
           if (n.position.y < minY) minY = n.position.y;
@@ -31589,7 +31634,7 @@ function FlowCanvas2(props) {
         let maxX = Number.NEGATIVE_INFINITY;
         let maxY = Number.NEGATIVE_INFINITY;
         for (const n of pool) {
-          const w = n.width ?? DEFAULT_NODE_WIDTH3;
+          const w = n.width ?? DEFAULT_NODE_WIDTH2;
           const h = effectiveHeight(n);
           minX = Math.min(minX, n.position.x);
           minY = Math.min(minY, n.position.y);
@@ -31601,7 +31646,7 @@ function FlowCanvas2(props) {
       getIntersectingNodes: (area, partially = true) => {
         return nodesRef.current.filter((n) => {
           if (n.hidden) return false;
-          const w = n.width ?? DEFAULT_NODE_WIDTH3;
+          const w = n.width ?? DEFAULT_NODE_WIDTH2;
           const h = effectiveHeight(n);
           if (partially) {
             return n.position.x < area.x + area.width && n.position.x + w > area.x && n.position.y < area.y + area.height && n.position.y + h > area.y;