@arbidocs/blocks 0.3.184 → 0.4.0

package/dist/{chunk-DBAUZD7A.cjs → chunk-FZQJ2S6P.cjs}

@@ -1,12 +1,34 @@
+"use client";
 'use strict';
 
+var chunkWJMEXTVD_cjs = require('./chunk-WJMEXTVD.cjs');
 var zustand = require('zustand');
 var middleware = require('zustand/middleware');
 var react = require('react');
 var lucideReact = require('lucide-react');
 var ui = require('@arbidocs/react/ui');
 var jsxRuntime = require('react/jsx-runtime');
-var reactDom = require('react-dom');
+var TabsPrimitive = require('@radix-ui/react-tabs');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
 
 // src/theme/tokens.ts
 var THEME_STYLE_ID = "arbi-theme-vars";
@@ -246,110 +268,6 @@ function applyStoredTheme(bundle) {
   const { colors, fonts, radius } = bundle.useStore.getState();
   applyThemeVars({ colors, fonts, radius }, { mode: bundle.mode, dark: bundle.darkColors });
 }
-
-// src/lib/format.ts
-function gbp(value, compact = false) {
-  return new Intl.NumberFormat("en-GB", {
-    style: "currency",
-    currency: "GBP",
-    maximumFractionDigits: compact && Math.abs(value) >= 1e3 ? 1 : 0,
-    notation: compact ? "compact" : "standard"
-  }).format(value);
-}
-function initials(name) {
-  const parts = name.trim().split(/\s+/);
-  if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();
-  return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
-}
-function parseIso(iso) {
-  const dateOnly = /^\d{4}-\d{2}-\d{2}$/.test(iso);
-  const d = new Date(dateOnly ? `${iso}T00:00:00` : iso);
-  if (Number.isNaN(d.getTime())) throw new Error(`Invalid ISO date: ${iso}`);
-  return d;
-}
-function fmtDate(iso) {
-  try {
-    return new Intl.DateTimeFormat("en-GB", {
-      day: "numeric",
-      month: "short",
-      year: "numeric"
-    }).format(parseIso(iso));
-  } catch {
-    return iso;
-  }
-}
-function fmtDateTime(iso) {
-  try {
-    return new Intl.DateTimeFormat("en-GB", {
-      day: "numeric",
-      month: "short",
-      year: "numeric",
-      hour: "2-digit",
-      minute: "2-digit",
-      hour12: false
-    }).format(parseIso(iso));
-  } catch {
-    return iso;
-  }
-}
-var RELATIVE_UNITS = [
-  ["year", 31536e3],
-  ["month", 2592e3],
-  ["week", 604800],
-  ["day", 86400],
-  ["hour", 3600],
-  ["minute", 60],
-  ["second", 1]
-];
-function fromNow(iso, from = /* @__PURE__ */ new Date()) {
-  try {
-    const diffSeconds = (parseIso(iso).getTime() - from.getTime()) / 1e3;
-    const abs = Math.abs(diffSeconds);
-    const rtf = new Intl.RelativeTimeFormat("en-GB", { numeric: "always" });
-    for (const [unit, secs] of RELATIVE_UNITS) {
-      if (abs >= secs || unit === "second") {
-        const value = Math.round(diffSeconds / secs);
-        return rtf.format(value, unit);
-      }
-    }
-    return rtf.format(0, "second");
-  } catch {
-    return iso;
-  }
-}
-function daysUntil(iso, from = /* @__PURE__ */ new Date()) {
-  try {
-    const target = parseIso(iso);
-    const a = Date.UTC(target.getFullYear(), target.getMonth(), target.getDate());
-    const b = Date.UTC(from.getFullYear(), from.getMonth(), from.getDate());
-    return Math.round((a - b) / 864e5);
-  } catch {
-    return 0;
-  }
-}
-function hrs(n) {
-  return `${n.toFixed(1)}h`;
-}
-function pct(n) {
-  return `${Math.round(n)}%`;
-}
-function formatPageRefs(pages) {
-  const sorted = [...new Set(pages)].sort((a, b) => a - b);
-  if (sorted.length === 0) return "";
-  const parts = [];
-  let start = sorted[0];
-  let end = sorted[0];
-  for (const page of sorted.slice(1)) {
-    if (page === end + 1) {
-      end = page;
-      continue;
-    }
-    parts.push(start === end ? `${start}` : `${start}\u2013${end}`);
-    start = end = page;
-  }
-  parts.push(start === end ? `${start}` : `${start}\u2013${end}`);
-  return `${sorted.length === 1 ? "p" : "pp"} ${parts.join(", ")}`;
-}
 function ThemeEditor({
   bundle,
   variant = "panel",
@@ -378,9 +296,14 @@ function ThemeEditor({
   const save = async () => {
     if (!onSave) return;
     setSaving(true);
-    const via = await onSave();
-    setSavedVia(typeof via === "string" ? via : "saved");
-    setSaving(false);
+    try {
+      const via = await onSave();
+      setSavedVia(typeof via === "string" ? via : "saved");
+    } catch {
+      setSavedVia(null);
+    } finally {
+      setSaving(false);
+    }
   };
   const Presets = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
     presets.map((p) => /* @__PURE__ */ jsxRuntime.jsx(
@@ -427,7 +350,7 @@ function ThemeEditor({
         {
           value: colors[k] ?? "",
           onChange: (e) => setColor(k, e.target.value),
-          className: "bg-card placeholder:text-muted-foreground/70 focus-visible:border-ring/60 focus-visible:ring-2 focus-visible:ring-ring/50 h-7 font-mono text-xs",
+          className: "bg-card placeholder:text-muted-foreground focus-visible:border-ring/60 focus-visible:ring-2 focus-visible:ring-ring h-7 font-mono text-xs",
           "data-testid": tid2(`hex-${k}`)
         }
       )
@@ -442,7 +365,7 @@ function ThemeEditor({
         {
           value: activePairing?.id ?? "",
           onChange: (e) => setFontPairing(e.target.value),
-          className: "mt-1 h-8 w-full rounded-md border border-border bg-card px-2 text-xs text-foreground focus-visible:border-ring/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/50",
+          className: "mt-1 h-8 w-full rounded-md border border-border bg-card px-2 text-xs text-foreground focus-visible:border-ring/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
           "data-testid": tid2("font-pairing"),
           children: [
             !activePairing && /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: "Custom" }),
@@ -450,7 +373,7 @@ function ThemeEditor({
           ]
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-[11px] text-muted-foreground", children: activePairing?.description ?? "Hand-edited font stacks." })
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-xs text-muted-foreground", children: activePairing?.description ?? "Hand-edited font stacks." })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block text-xs text-muted-foreground", children: "Display font stack" }),
@@ -459,7 +382,7 @@ function ThemeEditor({
         {
           value: fonts.display,
           onChange: (e) => setFont("display", e.target.value),
-          className: "bg-card placeholder:text-muted-foreground/70 focus-visible:border-ring/60 focus-visible:ring-2 focus-visible:ring-ring/50 mt-1 font-mono text-xs",
+          className: "bg-card placeholder:text-muted-foreground focus-visible:border-ring/60 focus-visible:ring-2 focus-visible:ring-ring mt-1 font-mono text-xs",
           "data-testid": tid2("font-display")
         }
       )
@@ -471,7 +394,7 @@ function ThemeEditor({
         {
           value: fonts.sans,
           onChange: (e) => setFont("sans", e.target.value),
-          className: "bg-card placeholder:text-muted-foreground/70 focus-visible:border-ring/60 focus-visible:ring-2 focus-visible:ring-ring/50 mt-1 font-mono text-xs",
+          className: "bg-card placeholder:text-muted-foreground focus-visible:border-ring/60 focus-visible:ring-2 focus-visible:ring-ring mt-1 font-mono text-xs",
           "data-testid": tid2("font-sans")
         }
       )
@@ -497,7 +420,7 @@ function ThemeEditor({
       )
     ] })
   ] });
-  const Preview = /* @__PURE__ */ jsxRuntime.jsxs(ui.Card, { variant: "elevated", className: "rounded-xl", "data-testid": tid2("preview"), children: [
+  const Preview = /* @__PURE__ */ jsxRuntime.jsxs(ui.Card, { variant: "elevated", className: "rounded-lg", "data-testid": tid2("preview"), children: [
     /* @__PURE__ */ jsxRuntime.jsx(ui.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.CardTitle, { className: "text-base", children: "Live preview" }) }),
     /* @__PURE__ */ jsxRuntime.jsxs(ui.CardContent, { className: "space-y-3", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-[var(--radius)] bg-primary p-4 text-primary-foreground", children: [
@@ -543,16 +466,16 @@ function ThemeEditor({
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col overflow-y-auto bg-card p-5", "data-testid": testIdPrefix, children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 flex items-center justify-between", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "font-display text-lg font-semibold text-foreground", children: "Theme" }) }),
       Presets,
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-5 mb-2 text-[10px] font-semibold uppercase tracking-[0.14em] text-muted-foreground", children: "Colours" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-5 mb-2 text-xs font-semibold uppercase tracking-[0.14em] text-muted-foreground", children: "Colours" }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-3", children: tokens.map((t) => colorRow(t.key, t.label)) }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-6 mb-2 text-[10px] font-semibold uppercase tracking-[0.14em] text-muted-foreground", children: "Typography & shape" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-6 mb-2 text-xs font-semibold uppercase tracking-[0.14em] text-muted-foreground", children: "Typography & shape" }),
       Typography,
       SaveBar
     ] });
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-6 lg:grid-cols-[1fr_320px]", "data-testid": testIdPrefix, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6", children: [
-      /* @__PURE__ */ jsxRuntime.jsxs(ui.Card, { variant: "elevated", className: "rounded-xl", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Card, { variant: "elevated", className: "rounded-lg", children: [
         /* @__PURE__ */ jsxRuntime.jsx(ui.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsxs(ui.CardTitle, { className: "flex items-center gap-2 text-base", children: [
           /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Palette, { className: "size-4 text-[color:var(--color-primary)]" }),
           " Presets"
@@ -563,7 +486,7 @@ function ThemeEditor({
         ui.Card,
         {
           variant: "elevated",
-          className: "rounded-xl",
+          className: "rounded-lg",
           "data-testid": tid2(`group-${group}`),
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(ui.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.CardTitle, { className: "text-base", children: groupLabels[group] ?? group }) }),
@@ -572,7 +495,7 @@ function ThemeEditor({
         },
         group
       )),
-      /* @__PURE__ */ jsxRuntime.jsxs(ui.Card, { variant: "elevated", className: "rounded-xl", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(ui.Card, { variant: "elevated", className: "rounded-lg", children: [
         /* @__PURE__ */ jsxRuntime.jsx(ui.CardHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(ui.CardTitle, { className: "text-base", children: "Typography & shape" }) }),
         /* @__PURE__ */ jsxRuntime.jsx(ui.CardContent, { children: Typography })
       ] }),
@@ -588,854 +511,6 @@ function tid(...parts) {
     (p) => String(p).trim().toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "")
   ).join("-");
 }
-
-// src/timeline/span.ts
-var MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
-var MONTH_NAMES = [
-  "January",
-  "February",
-  "March",
-  "April",
-  "May",
-  "June",
-  "July",
-  "August",
-  "September",
-  "October",
-  "November",
-  "December"
-];
-var WEEKDAY_NAMES = ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"];
-var DAY_MS = 864e5;
-function monthLabel(d) {
-  return `${MONTH_NAMES[d.getUTCMonth()]} ${d.getUTCFullYear()}`;
-}
-function utcDay(d) {
-  return new Date(Date.UTC(d.getUTCFullYear(), d.getUTCMonth(), d.getUTCDate()));
-}
-function dayKey(d) {
-  return d.toISOString().slice(0, 10);
-}
-function parseIso2(iso) {
-  if (!iso) return null;
-  const d = new Date(iso);
-  return isNaN(d.getTime()) ? null : d;
-}
-function isMidnight(d) {
-  return d.getUTCHours() === 0 && d.getUTCMinutes() === 0 && d.getUTCSeconds() === 0;
-}
-function isEndOfDay(d) {
-  return d.getUTCHours() === 23 && d.getUTCMinutes() === 59;
-}
-function lastDayOfMonth(d) {
-  return new Date(Date.UTC(d.getUTCFullYear(), d.getUTCMonth() + 1, 0)).getUTCDate();
-}
-function day(d) {
-  return `${d.getUTCDate()} ${MONTHS[d.getUTCMonth()]} ${d.getUTCFullYear()}`;
-}
-function zonedDayAndTime(d, timeZone) {
-  const parts = Object.fromEntries(
-    new Intl.DateTimeFormat("en-US", {
-      timeZone,
-      hourCycle: "h23",
-      year: "numeric",
-      month: "short",
-      day: "numeric",
-      hour: "2-digit",
-      minute: "2-digit"
-    }).formatToParts(d).map((p) => [p.type, p.value])
-  );
-  return { day: `${parts.day} ${parts.month} ${parts.year}`, hh: parts.hour, mm: parts.minute };
-}
-function formatSpan(startIso, endIso, timezone) {
-  if (!startIso) return "";
-  const start = new Date(startIso);
-  const end = endIso ? new Date(endIso) : start;
-  if (startIso === endIso) {
-    if (timezone) {
-      try {
-        const zoned = zonedDayAndTime(start, timezone);
-        return `${zoned.day}, ${zoned.hh}:${zoned.mm} ${timezone}`;
-      } catch {
-      }
-    }
-    const hh = String(start.getUTCHours()).padStart(2, "0");
-    const mm = String(start.getUTCMinutes()).padStart(2, "0");
-    return `${day(start)}, ${hh}:${mm} UTC`;
-  }
-  if (isMidnight(start) && isEndOfDay(end)) {
-    const sameDay = start.getUTCFullYear() === end.getUTCFullYear() && start.getUTCMonth() === end.getUTCMonth() && start.getUTCDate() === end.getUTCDate();
-    if (sameDay) return day(start);
-    const firstOfMonth = start.getUTCDate() === 1;
-    const endsMonth = end.getUTCDate() === lastDayOfMonth(end);
-    const sameMonth = start.getUTCFullYear() === end.getUTCFullYear() && start.getUTCMonth() === end.getUTCMonth();
-    if (firstOfMonth && endsMonth && sameMonth) {
-      return `${MONTHS[start.getUTCMonth()]} ${start.getUTCFullYear()}`;
-    }
-    const wholeYear = firstOfMonth && endsMonth && start.getUTCMonth() === 0 && end.getUTCMonth() === 11 && start.getUTCFullYear() === end.getUTCFullYear();
-    if (wholeYear) return String(start.getUTCFullYear());
-    return `${day(start)} \u2013 ${day(end)}`;
-  }
-  return `${day(start)} \u2013 ${day(end)}`;
-}
-var DEFAULT_MAX_LANES = 3;
-var MAX_WEEKS = 2600;
-function TimelineCalendar({
-  items,
-  onSelect,
-  selectedIds,
-  maxLanes = DEFAULT_MAX_LANES,
-  navigatorContainer,
-  navigatorTotal,
-  emptyState,
-  className,
-  testId = "timeline-calendar"
-}) {
-  const dated = react.useMemo(() => items.filter((i) => i.start), [items]);
-  const sortedItems = react.useMemo(
-    () => [...dated].sort((a, b) => new Date(a.start).getTime() - new Date(b.start).getTime()),
-    [dated]
-  );
-  const indexById = react.useMemo(() => new Map(sortedItems.map((it, i) => [it.id, i])), [sortedItems]);
-  const [activeIndex, setActiveIndex] = react.useState(null);
-  const scrollRef = react.useRef(null);
-  const select = react.useCallback(
-    (index) => {
-      const clamped = Math.max(0, Math.min(sortedItems.length - 1, index));
-      setActiveIndex(clamped);
-      onSelect?.(sortedItems[clamped]);
-      return clamped;
-    },
-    [onSelect, sortedItems]
-  );
-  const scrollToItem = react.useCallback(
-    (id, behavior) => {
-      scrollRef.current?.querySelector(`[data-testid="${testId}-entry-${id}"]`)?.scrollIntoView({ block: "center", behavior });
-    },
-    [testId]
-  );
-  const lastNavScrollRef = react.useRef(null);
-  const goTo = react.useCallback(
-    (index) => {
-      const target = sortedItems[select(index)];
-      if (target) {
-        lastNavScrollRef.current = target.id;
-        scrollToItem(target.id, "smooth");
-      }
-    },
-    [select, sortedItems, scrollToItem]
-  );
-  const selectedKey = (selectedIds ?? []).join("\0");
-  react.useEffect(() => {
-    const id = selectedKey ? selectedKey.split("\0")[0] : null;
-    if (!id) return;
-    if (lastNavScrollRef.current === id) {
-      lastNavScrollRef.current = null;
-      return;
-    }
-    scrollToItem(id, "auto");
-  }, [selectedKey, scrollToItem]);
-  const weeks = react.useMemo(() => {
-    if (dated.length === 0) return [];
-    const times = dated.flatMap((i) => [
-      new Date(i.start).getTime(),
-      new Date(i.end ?? i.start).getTime()
-    ]);
-    const first = utcDay(new Date(Math.min(...times)));
-    const last = utcDay(new Date(Math.max(...times)));
-    const gridStart = new Date(first);
-    gridStart.setUTCDate(first.getUTCDate() - (first.getUTCDay() + 6) % 7);
-    const out = [];
-    const cursor = new Date(gridStart);
-    while (cursor <= last && out.length < MAX_WEEKS) {
-      out.push(
-        Array.from({ length: 7 }, (_, d) => {
-          const day2 = new Date(cursor);
-          day2.setUTCDate(cursor.getUTCDate() + d);
-          return day2;
-        })
-      );
-      cursor.setUTCDate(cursor.getUTCDate() + 7);
-    }
-    return out;
-  }, [dated]);
-  const segmentsByWeek = react.useMemo(() => {
-    if (weeks.length === 0) return [];
-    const gridStartMs = weeks[0][0].getTime();
-    const WEEK_MS2 = 7 * DAY_MS;
-    const ranged = dated.map((item) => ({
-      item,
-      start: utcDay(new Date(item.start)),
-      end: utcDay(new Date(item.end ?? item.start))
-    }));
-    ranged.sort((a, b) => {
-      const lenA = b.end.getTime() - b.start.getTime();
-      const lenB = a.end.getTime() - a.start.getTime();
-      return lenA - lenB || a.start.getTime() - b.start.getTime();
-    });
-    const buckets = weeks.map(() => []);
-    for (const r of ranged) {
-      const from = Math.max(0, Math.floor((r.start.getTime() - gridStartMs) / WEEK_MS2));
-      const to = Math.min(weeks.length - 1, Math.floor((r.end.getTime() - gridStartMs) / WEEK_MS2));
-      for (let w = from; w <= to; w++) buckets[w].push(r);
-    }
-    return weeks.map((week, wi) => {
-      const weekStart = week[0];
-      const weekEnd = week[6];
-      const laneEnds = [];
-      const segments = [];
-      let overflow = 0;
-      for (const { item, start, end } of buckets[wi]) {
-        const from = start < weekStart ? weekStart : start;
-        const to = end > weekEnd ? weekEnd : end;
-        const startCol = Math.round((from.getTime() - weekStart.getTime()) / DAY_MS);
-        const endCol = Math.round((to.getTime() - weekStart.getTime()) / DAY_MS);
-        let lane = laneEnds.findIndex((last) => last < startCol);
-        if (lane === -1) lane = laneEnds.length;
-        if (lane >= maxLanes) {
-          overflow += 1;
-          continue;
-        }
-        laneEnds[lane] = endCol;
-        segments.push({
-          item,
-          startCol,
-          span: endCol - startCol + 1,
-          isStart: start >= weekStart,
-          isEnd: end <= weekEnd,
-          lane
-        });
-      }
-      return { segments, overflow };
-    });
-  }, [weeks, dated, maxLanes]);
-  if (weeks.length === 0 && emptyState) {
-    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: emptyState });
-  }
-  const selectedSet = new Set(selectedIds ?? []);
-  const selectedIndex = sortedItems.findIndex((i) => selectedSet.has(i.id));
-  const currentIndex = selectedIndex >= 0 ? selectedIndex : activeIndex;
-  const navigator = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-0.5", "data-testid": `${testId}-nav`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        "aria-label": "Previous event",
-        "data-testid": `${testId}-nav-prev`,
-        disabled: sortedItems.length === 0 || currentIndex === null || currentIndex <= 0,
-        onClick: () => goTo((currentIndex ?? 0) - 1),
-        className: "rounded p-0.5 text-muted-foreground enabled:hover:bg-accent enabled:hover:text-foreground disabled:opacity-30",
-        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" })
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "span",
-      {
-        className: "tabular-nums text-sm font-light text-muted-foreground",
-        "data-testid": `${testId}-nav-position`,
-        children: [
-          currentIndex !== null ? currentIndex + 1 : "\u2013",
-          " /",
-          " ",
-          navigatorTotal ?? (sortedItems.length > 0 ? sortedItems.length : "\u2013")
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        "aria-label": "Next event",
-        "data-testid": `${testId}-nav-next`,
-        disabled: sortedItems.length === 0 || currentIndex !== null && currentIndex >= sortedItems.length - 1,
-        onClick: () => goTo(currentIndex === null ? 0 : currentIndex + 1),
-        className: "rounded p-0.5 text-muted-foreground enabled:hover:bg-accent enabled:hover:text-foreground disabled:opacity-30",
-        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" })
-      }
-    )
-  ] });
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cn("flex flex-col h-full", className), "data-testid": testId, children: [
-    navigatorContainer === void 0 ? navigator && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex shrink-0 items-center justify-end border-b border-border px-2 py-1", children: navigator }) : navigatorContainer && navigator && reactDom.createPortal(navigator, navigatorContainer),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7 border-b border-border bg-background", children: WEEKDAY_NAMES.map((d) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-2 py-1 text-[11px] text-muted-foreground text-center", children: d }, d)) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { ref: scrollRef, className: "flex-1 overflow-auto", "data-testid": `${testId}-scroll`, children: weeks.map((week, wi) => {
-      const { segments, overflow } = segmentsByWeek[wi];
-      const monthStartDay = week.find((d) => d.getUTCDate() === 1);
-      const marker = monthStartDay ?? (wi === 0 ? week[0] : void 0);
-      return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        marker && // Sticky, so the month you are LOOKING at names itself: it
-        // pins to the top of the scroller while you are inside it and
-        // is pushed up by the next one. No scroll listener needed.
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            className: "sticky top-0 z-10 px-3 py-1 text-xs font-medium text-foreground bg-background/95 backdrop-blur border-y border-border/60",
-            "data-testid": `${testId}-month-${marker.getUTCFullYear()}-${String(
-              marker.getUTCMonth() + 1
-            ).padStart(2, "0")}`,
-            children: monthLabel(marker)
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b border-border/40", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-7 bg-background", children: week.map((day2) => /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              "data-testid": `${testId}-day-${dayKey(day2)}`,
-              className: ui.cn(
-                "px-1 pt-1 text-[11px] border-r border-border/40",
-                day2.getUTCDate() === 1 ? "text-foreground font-medium" : "text-muted-foreground/60"
-              ),
-              children: day2.getUTCDate()
-            },
-            dayKey(day2)
-          )) }),
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            "div",
-            {
-              className: "grid grid-cols-7 gap-y-0.5 px-0.5 pb-1 bg-muted/40",
-              style: { gridAutoRows: "18px", minHeight: 62 },
-              children: [
-                segments.map((seg) => /* @__PURE__ */ jsxRuntime.jsx(
-                  "button",
-                  {
-                    type: "button",
-                    onClick: () => select(indexById.get(seg.item.id) ?? 0),
-                    title: `${formatSpan(seg.item.start, seg.item.end)} \u2014 ${seg.item.label}`,
-                    "data-testid": `${testId}-entry-${seg.item.id}`,
-                    style: {
-                      gridColumn: `${seg.startCol + 1} / span ${seg.span}`,
-                      gridRow: seg.lane + 1
-                    },
-                    className: ui.cn(
-                      // One line per event (truncated), so several events stack
-                      // compactly on the same day instead of a few tall bars
-                      // pushing the rest into a "+n more". Every event is the
-                      // SAME neutral colour; the one open in the composer is
-                      // marked by the caller (a ring), not by a different fill.
-                      "block h-full w-full truncate text-left text-[10px] leading-[14px] py-[1px] px-1",
-                      "bg-muted text-muted-foreground",
-                      seg.isStart && "rounded-l",
-                      seg.isEnd && "rounded-r"
-                    ),
-                    children: seg.isStart ? seg.item.label : " "
-                  },
-                  `${seg.item.id}-${seg.startCol}`
-                )),
-                overflow > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
-                  "span",
-                  {
-                    className: "text-[10px] text-muted-foreground px-1",
-                    style: { gridColumn: "1 / span 7", gridRow: maxLanes + 1 },
-                    children: [
-                      "+",
-                      overflow,
-                      " more"
-                    ]
-                  }
-                )
-              ]
-            }
-          )
-        ] })
-      ] }, dayKey(week[0]));
-    }) })
-  ] });
-}
-var TIMELINE_ZOOM = { MIN: 1, MAX: 10, STEP: 0.25 };
-function TimelineZoomControl({
-  zoom,
-  onZoomChange,
-  className,
-  testId = "timeline-gantt"
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: ui.cn(
-        "flex items-center gap-1.5 rounded-md border border-border bg-background px-2 py-1",
-        className
-      ),
-      "data-testid": `${testId}-zoom`,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ZoomOut, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground", "aria-hidden": true }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "input",
-          {
-            type: "range",
-            "aria-label": "Timeline zoom",
-            "data-testid": `${testId}-zoom-slider`,
-            min: TIMELINE_ZOOM.MIN,
-            max: TIMELINE_ZOOM.MAX,
-            step: TIMELINE_ZOOM.STEP,
-            value: zoom,
-            onChange: (e) => onZoomChange(Number(e.target.value)),
-            className: "h-1 w-24 cursor-pointer accent-primary"
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ZoomIn, { className: "h-3.5 w-3.5 shrink-0 text-muted-foreground", "aria-hidden": true }),
-        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "w-11 shrink-0 text-right text-[11px] tabular-nums text-muted-foreground", children: [
-          Math.round(zoom * 100),
-          "%"
-        ] })
-      ]
-    }
-  );
-}
-var NEUTRAL_BAR = "#94a3b8";
-function barBackground(colors) {
-  const c = (colors ?? []).filter(Boolean).slice(0, 3);
-  if (c.length === 0) return NEUTRAL_BAR;
-  if (c.length === 1) return c[0];
-  const step = 100 / c.length;
-  const stops = c.map((col, i) => `${col} ${i * step}% ${(i + 1) * step}%`).join(", ");
-  return `linear-gradient(180deg, ${stops})`;
-}
-var WEEK_MS = 7 * 24 * 60 * 60 * 1e3;
-function formatAxisDate(d, intervalDays) {
-  if (intervalDays < 45) {
-    return d.toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
-  }
-  if (intervalDays < 365 * 2) {
-    return d.toLocaleDateString("en-US", { month: "short", year: "numeric" });
-  }
-  return d.toLocaleDateString("en-US", { year: "numeric" });
-}
-function TimelineGantt({
-  items,
-  onSelect,
-  selectedIds,
-  renderDetail,
-  labelWidth = 240,
-  onLabelWidthChange,
-  minLabelWidth = 120,
-  maxLabelWidth = 600,
-  zoom: zoomProp,
-  onZoomChange,
-  navigatorContainer,
-  navigatorTotal,
-  emptyMessage = "Nothing dated yet.",
-  className,
-  testId = "timeline-gantt"
-}) {
-  const [activeIndex, setActiveIndex] = react.useState(null);
-  const [internalZoom, setInternalZoom] = react.useState(1);
-  const zoomControlled = zoomProp != null && onZoomChange != null;
-  const zoomValue = zoomControlled ? zoomProp : internalZoom;
-  const setZoomValue = zoomControlled ? onZoomChange : setInternalZoom;
-  const dragRef = react.useRef(null);
-  const chartRef = react.useRef(null);
-  const gutterBodyRef = react.useRef(null);
-  const startResize = (e) => {
-    if (!onLabelWidthChange) return;
-    e.preventDefault();
-    dragRef.current = { startX: e.clientX, startWidth: labelWidth };
-    const onMove = (ev) => {
-      const drag = dragRef.current;
-      if (!drag) return;
-      const next = Math.min(
-        maxLabelWidth,
-        Math.max(minLabelWidth, drag.startWidth + (ev.clientX - drag.startX))
-      );
-      onLabelWidthChange(next);
-    };
-    const onUp = () => {
-      dragRef.current = null;
-      window.removeEventListener("mousemove", onMove);
-      window.removeEventListener("mouseup", onUp);
-    };
-    window.addEventListener("mousemove", onMove);
-    window.addEventListener("mouseup", onUp);
-  };
-  const rows = items.filter((i) => parseIso2(i.start) !== null).slice().sort((a, b) => parseIso2(a.start).getTime() - parseIso2(b.start).getTime());
-  const select = (index) => {
-    setActiveIndex(index);
-    onSelect?.(index === null ? null : rows[index]);
-  };
-  const selectedSet = new Set(selectedIds ?? []);
-  const selectedRowIndex = rows.findIndex((r) => selectedSet.has(r.id));
-  const currentIndex = selectedRowIndex >= 0 ? selectedRowIndex : activeIndex;
-  const goTo = (index) => select(Math.max(0, Math.min(rows.length - 1, index)));
-  const navigator = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-0.5 text-sm font-light", "data-testid": `${testId}-nav`, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        "aria-label": "Previous event",
-        "data-testid": `${testId}-nav-prev`,
-        disabled: rows.length === 0 || currentIndex === null || currentIndex <= 0,
-        onClick: () => goTo((currentIndex ?? 0) - 1),
-        className: "rounded p-0.5 text-muted-foreground enabled:hover:bg-accent enabled:hover:text-foreground disabled:opacity-30",
-        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "h-4 w-4" })
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "tabular-nums text-muted-foreground", "data-testid": `${testId}-nav-position`, children: [
-      currentIndex !== null ? currentIndex + 1 : "\u2013",
-      " /",
-      " ",
-      navigatorTotal ?? (rows.length > 0 ? rows.length : "\u2013")
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        "aria-label": "Next event",
-        "data-testid": `${testId}-nav-next`,
-        disabled: rows.length === 0 || currentIndex !== null && currentIndex >= rows.length - 1,
-        onClick: () => goTo(currentIndex === null ? 0 : currentIndex + 1),
-        className: "rounded p-0.5 text-muted-foreground enabled:hover:bg-accent enabled:hover:text-foreground disabled:opacity-30",
-        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "h-4 w-4" })
-      }
-    )
-  ] });
-  if (rows.length === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        "data-testid": `${testId}-empty-state`,
-        className: ui.cn(
-          "flex flex-col items-center justify-center py-16 text-muted-foreground",
-          className
-        ),
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Calendar, { className: "w-12 h-12 mb-3 opacity-30" }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: emptyMessage }),
-          navigatorContainer && reactDom.createPortal(navigator, navigatorContainer)
-        ]
-      }
-    );
-  }
-  const allDates = rows.flatMap((i) => {
-    const s = parseIso2(i.start);
-    return [s, parseIso2(i.end ?? null) ?? s];
-  });
-  const minTime = Math.min(...allDates.map((d) => d.getTime()));
-  const maxTime = Math.max(...allDates.map((d) => d.getTime()));
-  const pad = Math.max((maxTime - minTime) * 0.04, WEEK_MS);
-  const axisMin = new Date(minTime - pad);
-  const axisMax = new Date(maxTime + pad);
-  const axisRange = axisMax.getTime() - axisMin.getTime();
-  const toPercent = (d) => Math.min(100, Math.max(0, (d.getTime() - axisMin.getTime()) / axisRange * 100));
-  const tickCount = Math.max(2, Math.min(50, Math.round(8 * zoomValue) + 1));
-  const tickStep = axisRange / (tickCount - 1);
-  const tickIntervalDays = tickStep / DAY_MS;
-  const ticks = Array.from(
-    { length: tickCount },
-    (_, i) => new Date(axisMin.getTime() + tickStep * i)
-  );
-  const today = /* @__PURE__ */ new Date();
-  const todayPct = toPercent(today);
-  const showToday = today > axisMin && today < axisMax;
-  const activeItem = activeIndex !== null ? rows[activeIndex] : null;
-  const detail = activeItem ? renderDetail?.(activeItem) : null;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cn("flex h-full min-h-0", className), children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex min-h-0 flex-1 flex-col p-5", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          "aria-hidden": true,
-          "data-testid": `${testId}-gutter-divider`,
-          style: { left: `calc(20px + ${labelWidth}px)` },
-          className: "pointer-events-none absolute top-0 bottom-0 z-30 w-[3px] -translate-x-1/2 bg-border"
-        }
-      ),
-      onLabelWidthChange && /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          role: "separator",
-          "aria-orientation": "vertical",
-          "aria-label": "Resize event column",
-          "data-testid": `${testId}-label-resizer`,
-          onMouseDown: startResize,
-          style: { left: `calc(20px + ${labelWidth}px)` },
-          className: "absolute top-0 bottom-0 z-30 w-2 -translate-x-1/2 cursor-col-resize group",
-          children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-auto h-full w-[3px] transition-colors group-hover:bg-primary" })
-        }
-      ),
-      !zoomControlled && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute right-2 top-2 z-30 shadow-sm", children: /* @__PURE__ */ jsxRuntime.jsx(TimelineZoomControl, { zoom: zoomValue, onZoomChange: setZoomValue, testId }) }),
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1 flex min-h-0 flex-1", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { width: labelWidth, flexShrink: 0 }, className: "flex min-h-0 flex-col", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-1 flex h-6 shrink-0 items-center gap-1 border-b border-border pr-3 text-sm font-medium text-muted-foreground", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Event" }),
-            navigatorContainer === void 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto", children: navigator }) : navigatorContainer && reactDom.createPortal(navigator, navigatorContainer)
-          ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              ref: gutterBodyRef,
-              "data-testid": `${testId}-gutter`,
-              className: "min-h-0 flex-1 overflow-hidden",
-              onWheel: (e) => {
-                if (chartRef.current) chartRef.current.scrollTop += e.deltaY;
-              },
-              children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-4 pb-6", children: rows.map((item, i) => {
-                const isActive = activeIndex === i;
-                const isSelected = selectedIds?.includes(item.id) ?? false;
-                const highlighted = isActive || isSelected;
-                const zebra = i % 2 === 1;
-                return (
-                  // Fixed h-9 = the track row's h-7 bar + py-1, so the two
-                  // columns stay row-for-row aligned. Clicking the label
-                  // selects the row exactly like its bar does — the label IS
-                  // the event's title, so it should be a target too. Keep the
-                  // `break-words leading-snug` tail on THIS element — a scoped
-                  // CSS rule (.facts-gantt .break-words.leading-snug) clamps it
-                  // to one line. A selected row gets the tint plus a left
-                  // accent bar, mirroring the facts table's edited-row mark.
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    "div",
-                    {
-                      onClick: () => select(isActive ? null : i),
-                      className: ui.cn(
-                        "flex h-9 cursor-pointer items-center rounded border-l-[3px] pr-3 text-xs font-medium",
-                        isSelected ? "border-l-primary bg-primary/10" : zebra ? "border-l-transparent bg-muted" : "border-l-transparent bg-background",
-                        highlighted ? "text-foreground" : "text-muted-foreground",
-                        "break-words leading-snug"
-                      ),
-                      title: item.label,
-                      children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "min-w-0 flex-1 truncate", children: [
-                        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "mr-1 tabular-nums text-muted-foreground/60", children: [
-                          i + 1,
-                          "."
-                        ] }),
-                        item.label
-                      ] })
-                    },
-                    item.id
-                  )
-                );
-              }) })
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            ref: chartRef,
-            "data-testid": `${testId}-scroller`,
-            onScroll: (e) => {
-              if (gutterBodyRef.current) gutterBodyRef.current.scrollTop = e.currentTarget.scrollTop;
-            },
-            className: ui.cn(
-              "scrollbar-subtle relative min-h-0 min-w-0 flex-1 overflow-y-auto",
-              zoomValue > 1 ? "overflow-x-auto" : "overflow-x-hidden"
-            ),
-            children: /* @__PURE__ */ jsxRuntime.jsxs(
-              "div",
-              {
-                className: "relative min-h-full",
-                style: { width: `${zoomValue * 100}%`, minWidth: "100%" },
-                children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sticky top-0 z-20 mb-1 h-6 border-b border-border bg-background", children: ticks.map((tick, i) => {
-                    const isFirst = i === 0;
-                    const isLast = i === ticks.length - 1;
-                    const edgeShift = isFirst ? "translate-x-1" : isLast ? "-translate-x-full" : "-translate-x-1/2";
-                    return /* @__PURE__ */ jsxRuntime.jsx(
-                      "span",
-                      {
-                        style: { left: `${toPercent(tick)}%` },
-                        className: `absolute bottom-1 text-[10px] text-muted-foreground whitespace-nowrap select-none ${edgeShift}`,
-                        children: formatAxisDate(tick, tickIntervalDays)
-                      },
-                      i
-                    );
-                  }) }),
-                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative pt-4", children: [
-                    ticks.map((tick, i) => /* @__PURE__ */ jsxRuntime.jsx(
-                      "div",
-                      {
-                        "aria-hidden": true,
-                        className: "pointer-events-none absolute top-0 bottom-0 z-10 border-l-2 border-border/30",
-                        style: { left: `${toPercent(tick)}%` }
-                      },
-                      `grid-${i}`
-                    )),
-                    showToday && /* @__PURE__ */ jsxRuntime.jsxs(
-                      "div",
-                      {
-                        className: "pointer-events-none absolute top-0 bottom-0 z-10",
-                        style: { left: `${todayPct}%` },
-                        children: [
-                          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full border-l-2 border-dashed border-muted-foreground/50" }),
-                          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute top-0 -translate-x-1/2 rounded border bg-background px-1 text-[9px] text-muted-foreground", children: "today" })
-                        ]
-                      }
-                    ),
-                    rows.map((item, i) => {
-                      const startDate = parseIso2(item.start);
-                      const endDate = parseIso2(item.end ?? null) ?? startDate;
-                      const leftPct = toPercent(startDate);
-                      const dayPct = DAY_MS / axisRange * 100;
-                      const widthPct = Math.max(dayPct, toPercent(endDate) - toPercent(startDate));
-                      const isActive = activeIndex === i;
-                      const isSelected = selectedIds?.includes(item.id) ?? false;
-                      const highlighted = isActive || isSelected;
-                      const zebra = i % 2 === 1;
-                      return (
-                        // Fixed h-9 (h-7 bar + py-1) — the gutter's label rows use
-                        // the same height, which is what keeps the columns aligned.
-                        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-9 py-1", children: /* @__PURE__ */ jsxRuntime.jsx(
-                          "div",
-                          {
-                            className: ui.cn(
-                              "relative h-7 overflow-visible rounded-md border border-border",
-                              isSelected ? "bg-primary/10" : zebra ? "bg-muted" : "bg-background"
-                            ),
-                            children: /* @__PURE__ */ jsxRuntime.jsx(
-                              "button",
-                              {
-                                "data-testid": `${testId}-bar-${i}`,
-                                "aria-label": item.label,
-                                "aria-pressed": highlighted,
-                                style: {
-                                  left: `${leftPct}%`,
-                                  width: `${widthPct}%`,
-                                  // Colour-coded by the item's labels (up to three), not by
-                                  // row order — see barBackground / TimelineItem.colors.
-                                  background: barBackground(item.colors),
-                                  boxShadow: highlighted ? "0 0 0 2px white, 0 0 0 4px #6366f1" : "0 1px 3px rgba(0,0,0,.2)"
-                                },
-                                title: formatSpan(item.start, item.end) || void 0,
-                                className: "absolute top-0.5 h-6 min-w-[6px] rounded cursor-pointer transition-[filter] hover:brightness-110 focus:outline-none",
-                                onClick: () => select(isActive ? null : i)
-                              }
-                            )
-                          }
-                        ) }, item.id)
-                      );
-                    })
-                  ] })
-                ]
-              }
-            )
-          }
-        )
-      ] })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        "data-testid": `${testId}-side-panel`,
-        className: ui.cn(
-          "border-l bg-muted/20 flex flex-col shrink-0 overflow-hidden transition-all duration-300",
-          activeItem ? "w-60 open" : "w-0"
-        ),
-        children: /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            className: ui.cn(
-              "w-60 p-4 flex flex-col gap-3 transition-opacity duration-200",
-              activeItem ? "opacity-100" : "opacity-0"
-            ),
-            children: activeItem && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxRuntime.jsx(
-                "button",
-                {
-                  "data-testid": `${testId}-panel-close`,
-                  className: "w-6 h-6 rounded flex items-center justify-center text-muted-foreground hover:bg-muted",
-                  onClick: () => select(null),
-                  "aria-label": "Close panel",
-                  children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "w-3.5 h-3.5" })
-                }
-              ) }),
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-                /* @__PURE__ */ jsxRuntime.jsxs(
-                  "div",
-                  {
-                    "data-testid": `${testId}-panel-title`,
-                    className: "text-sm font-semibold text-foreground leading-snug",
-                    children: [
-                      activeIndex !== null && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "mr-1 tabular-nums text-muted-foreground", children: [
-                        activeIndex + 1,
-                        "."
-                      ] }),
-                      activeItem.label
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 mt-1 text-xs text-muted-foreground", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Calendar, { className: "w-3 h-3 shrink-0" }),
-                  /* @__PURE__ */ jsxRuntime.jsx("span", { children: formatSpan(activeItem.start, activeItem.end) || "Date unknown" })
-                ] })
-              ] }),
-              activeItem.description && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx("hr", { className: "border-border" }),
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[10px] font-semibold uppercase tracking-wider text-muted-foreground mb-1", children: "Summary" }),
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    "p",
-                    {
-                      "data-testid": `${testId}-panel-desc`,
-                      className: "text-xs text-muted-foreground leading-relaxed",
-                      children: activeItem.description
-                    }
-                  )
-                ] })
-              ] }),
-              detail && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx("hr", { className: "border-border" }),
-                detail
-              ] })
-            ] })
-          }
-        )
-      }
-    )
-  ] });
-}
-var TOGGLE = [
-  { mode: "calendar", label: "Calendar", Icon: lucideReact.CalendarDays },
-  { mode: "gantt", label: "Gantt", Icon: lucideReact.GanttChartSquare }
-];
-function Timeline({
-  items,
-  view,
-  defaultView = "calendar",
-  onSelect,
-  renderDetail,
-  emptyMessage,
-  className,
-  testId = "timeline"
-}) {
-  const [picked, setPicked] = react.useState(defaultView);
-  const mode = view ?? picked;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: ui.cn("flex flex-col h-full min-h-0", className), "data-testid": testId, children: [
-    !view && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1 p-2 border-b border-border", children: TOGGLE.map(({ mode: m, label, Icon }) => /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
-      {
-        type: "button",
-        onClick: () => setPicked(m),
-        "aria-pressed": mode === m,
-        "data-testid": `${testId}-view-${m}`,
-        className: ui.cn(
-          "flex items-center gap-1.5 rounded px-2 py-1 text-xs",
-          mode === m ? "bg-muted text-foreground" : "text-muted-foreground hover:text-foreground"
-        ),
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "w-3.5 h-3.5" }),
-          label
-        ]
-      },
-      m
-    )) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-h-0", children: mode === "calendar" ? /* @__PURE__ */ jsxRuntime.jsx(
-      TimelineCalendar,
-      {
-        items,
-        onSelect,
-        testId: `${testId}-calendar`,
-        emptyState: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-full items-center justify-center p-8 text-sm text-muted-foreground", children: emptyMessage ?? "Nothing dated yet." })
-      }
-    ) : /* @__PURE__ */ jsxRuntime.jsx(
-      TimelineGantt,
-      {
-        items,
-        onSelect: (item) => item && onSelect?.(item),
-        renderDetail,
-        emptyMessage,
-        testId: `${testId}-gantt`
-      }
-    ) })
-  ] });
-}
 function SectionHeading({
   eyebrow,
   title,
@@ -1511,7 +586,7 @@ var ASPECT = {
 var ROUNDED = {
   none: "rounded-none",
   md: "rounded-md",
-  lg: "rounded-xl",
+  lg: "rounded-lg",
   full: "rounded-full"
 };
 function BlockImage({
@@ -1573,18 +648,23 @@ var TONE_SURFACE = {
   ink: "bg-foreground text-background"
 };
 function renderTitle(title, emphasis) {
-  if (!emphasis || !title.includes(emphasis)) return title;
+  if (typeof title !== "string" || !emphasis || !title.includes(emphasis)) return title;
   const parts = title.split(emphasis);
   return parts.map((part, i) => /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
     part,
     i < parts.length - 1 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-primary", children: emphasis })
   ] }, i));
 }
+function renderLink(Link, href, children) {
+  return Link ? /* @__PURE__ */ jsxRuntime.jsx(Link, { href, children }) : /* @__PURE__ */ jsxRuntime.jsx("a", { href, children });
+}
 function Hero({
   eyebrow,
   title,
   emphasis,
   subtitle,
+  caption,
+  linkComponent: Link,
   primaryCta,
   secondaryCta,
   align = "left",
@@ -1617,10 +697,14 @@ function Hero({
           {
             className: ui.cn("mt-8 flex flex-col gap-3 sm:flex-row", centered && "sm:justify-center"),
             children: [
-              primaryCta?.label && /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { asChild: true, size: "lg", children: /* @__PURE__ */ jsxRuntime.jsxs("a", { href: primaryCta.href || "#", children: [
-                primaryCta.label,
-                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { className: "size-4" })
-              ] }) }),
+              primaryCta?.label && /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { asChild: true, size: "lg", children: renderLink(
+                Link,
+                primaryCta.href || "#",
+                /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                  primaryCta.label,
+                  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowRight, { className: "size-4" })
+                ] })
+              ) }),
               secondaryCta?.label && /* @__PURE__ */ jsxRuntime.jsx(
                 ui.Button,
                 {
@@ -1630,12 +714,13 @@ function Hero({
                   className: ui.cn(
                     onDark && "border-background/35 bg-transparent text-background hover:bg-background/10 hover:text-background"
                   ),
-                  children: /* @__PURE__ */ jsxRuntime.jsx("a", { href: secondaryCta.href || "#", children: secondaryCta.label })
+                  children: renderLink(Link, secondaryCta.href || "#", secondaryCta.label)
                 }
               )
             ]
           }
-        )
+        ),
+        caption && /* @__PURE__ */ jsxRuntime.jsx("div", { className: ui.cn("mt-4 text-sm", subtle), children: caption })
       ]
     }
   );
@@ -1732,7 +817,7 @@ function Testimonial({ quote, author, role, avatarUrl, testId }) {
     (author || avatarUrl) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-6 flex items-center justify-center gap-3", children: [
       (avatarUrl || author) && /* @__PURE__ */ jsxRuntime.jsxs(ui.Avatar, { children: [
         avatarUrl && /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarImage, { src: avatarUrl, alt: author ?? "" }),
-        /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarFallback, { children: initials(author || "?") })
+        /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarFallback, { children: chunkWJMEXTVD_cjs.initials(author || "?") })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-left", children: [
         author && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold", children: author }),
@@ -1766,7 +851,7 @@ function CTABanner({
     "div",
     {
       className: ui.cn(
-        "relative isolate overflow-hidden rounded-2xl px-8 py-14 text-center",
+        "relative isolate overflow-hidden rounded-lg px-8 py-14 text-center",
         onImage ? "text-white" : TONE_SURFACE2[tone] ?? TONE_SURFACE2.default
       ),
       style: bgStyle,
@@ -1816,35 +901,6 @@ function FAQ({ items, testId }) {
 function RichTextBlock({ content, testId }) {
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mx-auto max-w-3xl", "data-testid": testId, children: /* @__PURE__ */ jsxRuntime.jsx(ui.AiMarkdown, { children: content ?? "" }) });
 }
-var STYLES = {
-  info: { wrap: "border-primary/30 bg-primary/5", icon: "text-primary", Icon: lucideReact.Info },
-  success: { wrap: "border-success/30 bg-success/10", icon: "text-success", Icon: lucideReact.CheckCircle2 },
-  warning: { wrap: "border-warning/40 bg-warning/10", icon: "text-warning", Icon: lucideReact.AlertTriangle },
-  danger: {
-    wrap: "border-destructive/30 bg-destructive/10",
-    icon: "text-destructive",
-    Icon: lucideReact.XCircle
-  }
-};
-function Callout({ variant = "info", title, body, testId }) {
-  const style = STYLES[variant] ?? STYLES.info;
-  const Icon = style.Icon;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: ui.cn("flex gap-3 rounded-lg border p-4 text-foreground", style.wrap),
-      "data-testid": testId,
-      role: "note",
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: ui.cn("mt-0.5 size-5 shrink-0", style.icon), "aria-hidden": true }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
-          title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold", children: title }),
-          body && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm leading-relaxed text-muted-foreground", children: body })
-        ] })
-      ]
-    }
-  );
-}
 var SIZE = {
   sm: "size-8 text-xs",
   md: "size-10 text-sm",
@@ -1854,39 +910,90 @@ var SIZE = {
 function AvatarBlock({ src, name = "", size = "md", testId }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(ui.Avatar, { className: ui.cn(SIZE[size] ?? SIZE.md), "data-testid": testId, children: [
     src && /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarImage, { src, alt: name }),
-    /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarFallback, { className: "font-semibold", children: initials(name || "?") })
+    /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarFallback, { className: "font-semibold", children: chunkWJMEXTVD_cjs.initials(name || "?") })
   ] });
 }
-function Navbar({ brand, links, cta, testId }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("header", { className: "border-b border-border bg-background", "data-testid": testId, children: /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "mx-auto flex max-w-7xl items-center justify-between gap-6 px-5 py-4 lg:px-8", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-lg font-semibold tracking-tight", children: brand }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden items-center gap-6 md:flex", children: (links ?? []).map((link, i) => /* @__PURE__ */ jsxRuntime.jsx(
-      "a",
+var DEFAULT_LABELS = { openMenu: "Open menu", closeMenu: "Close menu" };
+function Navbar({
+  brand,
+  brandHref,
+  links,
+  cta,
+  ctaSlot,
+  linkComponent: Link,
+  mobileMenu,
+  labels,
+  testId,
+  testIds
+}) {
+  const [isOpen, setIsOpen] = react.useState(false);
+  const l = { ...DEFAULT_LABELS, ...labels };
+  const items = links ?? [];
+  const linkId = (i) => testIds?.link?.(i) ?? (testId ? `${testId}-link-${i}` : void 0);
+  const ctaId = testIds?.cta ?? (testId ? `${testId}-cta` : void 0);
+  const menuId = testIds?.menu ?? (testId ? `${testId}-menu` : void 0);
+  const menuButtonId = testIds?.menuButton ?? (testId ? `${testId}-menu-button` : void 0);
+  const anchor = (href, className, children, id) => Link ? /* @__PURE__ */ jsxRuntime.jsx(Link, { href, className, "data-testid": id, children }) : /* @__PURE__ */ jsxRuntime.jsx("a", { href, className, "data-testid": id, children });
+  const linkClass = "text-sm font-medium text-muted-foreground transition-colors hover:text-foreground";
+  const brandNode = /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-lg font-semibold tracking-tight", children: brand });
+  const ctaNode = ctaSlot ?? (cta?.label && /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { asChild: true, size: "sm", children: anchor(cta.href || "#", void 0, cta.label, ctaId) }));
+  return /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "border-b border-border bg-background", "data-testid": testId, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "mx-auto flex max-w-7xl items-center justify-between gap-6 px-5 py-4 lg:px-8", children: [
+      brandHref ? anchor(brandHref, void 0, brandNode) : brandNode,
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden items-center gap-6 md:flex", children: items.map((link, i) => /* @__PURE__ */ jsxRuntime.jsx("span", { children: anchor(link.href || "#", linkClass, link.label, linkId(i)) }, i)) }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden md:block", children: ctaNode }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            className: "rounded-md p-2 text-foreground hover:bg-muted md:hidden",
+            "aria-expanded": isOpen,
+            "aria-label": isOpen ? l.closeMenu : l.openMenu,
+            onClick: () => setIsOpen((open) => !open),
+            "data-testid": menuButtonId,
+            children: isOpen ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "size-5" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Menu, { className: "size-5" })
+          }
+        )
+      ] })
+    ] }),
+    isOpen && /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
       {
-        href: link.href || "#",
-        className: "text-sm font-medium text-muted-foreground transition-colors hover:text-foreground",
-        "data-testid": testId && `${testId}-link-${i}`,
-        children: link.label
-      },
-      i
-    )) }),
-    cta?.label && /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { asChild: true, size: "sm", children: /* @__PURE__ */ jsxRuntime.jsx("a", { href: cta.href || "#", children: cta.label }) })
-  ] }) });
+        className: "border-t border-border px-5 py-4 md:hidden",
+        "data-slot": "navbar-mobile-menu",
+        "data-testid": menuId,
+        children: mobileMenu ?? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
+          items.map((link, i) => /* @__PURE__ */ jsxRuntime.jsx("span", { children: anchor(link.href || "#", linkClass, link.label) }, i)),
+          ctaNode
+        ] })
+      }
+    )
+  ] });
 }
-function Footer({ columns, copyright, testId }) {
+function Footer({
+  columns,
+  copyright,
+  brand,
+  blurb,
+  legal,
+  linkComponent: Link,
+  testId
+}) {
+  const linkClass = "text-sm text-muted-foreground transition-colors hover:text-foreground";
   return /* @__PURE__ */ jsxRuntime.jsx("footer", { className: "border-t border-border bg-muted text-foreground", "data-testid": testId, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-7xl px-5 py-14 lg:px-8", children: [
+    (brand || blurb) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-10 max-w-md", "data-slot": "footer-brand", children: [
+      brand && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg font-semibold tracking-tight", children: brand }),
+      blurb && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: blurb })
+    ] }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-8 sm:grid-cols-2 lg:grid-cols-4", children: (columns ?? []).map((col, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": testId && `${testId}-col-${i}`, children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-sm font-semibold tracking-tight", children: col.heading }),
-      /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "mt-4 space-y-2", children: (col.links ?? []).map((link, j) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-        "a",
-        {
-          href: link.href || "#",
-          className: "text-sm text-muted-foreground transition-colors hover:text-foreground",
-          children: link.label
-        }
-      ) }, j)) })
+      /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "mt-4 space-y-2", children: (col.links ?? []).map((link, j) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: Link ? /* @__PURE__ */ jsxRuntime.jsx(Link, { href: link.href || "#", className: linkClass, children: link.label }) : /* @__PURE__ */ jsxRuntime.jsx("a", { href: link.href || "#", className: linkClass, children: link.label }) }, j)) })
     ] }, i)) }),
-    copyright && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-12 border-t border-border pt-6 text-sm text-muted-foreground", children: copyright })
+    (copyright || legal) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-12 flex flex-col gap-3 border-t border-border pt-6 text-sm text-muted-foreground sm:flex-row sm:items-center sm:justify-between", children: [
+      copyright && /* @__PURE__ */ jsxRuntime.jsx("p", { children: copyright }),
+      legal && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "footer-legal", children: legal })
+    ] })
   ] }) });
 }
 function ListBlock({ ordered = false, items, testId }) {
@@ -1988,38 +1095,33 @@ function PricingTable({ plans, testId }) {
   );
 }
 function Tabs({ items, testId }) {
-  const [active, setActive] = react.useState(0);
   const list = items ?? [];
-  const current = list[Math.min(active, Math.max(list.length - 1, 0))];
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": testId, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-1 border-b border-border", role: "tablist", children: list.map((t, i) => {
-      const selected = i === active;
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        "button",
-        {
-          type: "button",
-          role: "tab",
-          "aria-selected": selected,
-          onClick: () => setActive(i),
-          className: ui.cn(
-            "-mb-px border-b-2 px-4 py-2 text-sm font-medium transition-colors",
-            selected ? "border-primary text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"
-          ),
-          "data-testid": testId && `${testId}-tab-${i}`,
-          children: t.label
-        },
-        i
-      );
-    }) }),
-    current && /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
+  const [active, setActive] = react.useState("0");
+  const activeIndex = Math.min(Number(active), Math.max(list.length - 1, 0));
+  return /* @__PURE__ */ jsxRuntime.jsxs(TabsPrimitive__namespace.Root, { value: String(activeIndex), onValueChange: setActive, "data-testid": testId, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(TabsPrimitive__namespace.List, { className: "flex flex-wrap gap-1 border-b border-border", children: list.map((t, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      TabsPrimitive__namespace.Trigger,
       {
-        role: "tabpanel",
-        className: "pt-5 text-sm leading-relaxed text-muted-foreground",
-        "data-testid": testId && `${testId}-panel`,
-        children: current.content
-      }
-    )
+        value: String(i),
+        className: ui.cn(
+          "-mb-px border-b-2 px-4 py-2 text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring pointer-coarse:min-h-11",
+          i === activeIndex ? "border-primary text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"
+        ),
+        "data-testid": testId && `${testId}-tab-${i}`,
+        children: t.label
+      },
+      i
+    )) }),
+    list.map((t, i) => /* @__PURE__ */ jsxRuntime.jsx(
+      TabsPrimitive__namespace.Content,
+      {
+        value: String(i),
+        className: "pt-5 text-sm leading-relaxed text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        "data-testid": i === activeIndex ? testId && `${testId}-panel` : void 0,
+        children: t.content
+      },
+      i
+    ))
   ] });
 }
 function Accordion({ items, allowMultiple = false, testId }) {
@@ -2126,28 +1228,52 @@ function VideoEmbed({
     }
   ) : url ? /* @__PURE__ */ jsxRuntime.jsx("video", { src: url, controls: true, className: "size-full", "data-testid": testId && `${testId}-video` }) : null });
 }
+var INPUT_CLASS = "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground outline-none focus:border-primary";
 function ContactForm({
   fields,
   submitLabel = "Send",
   action,
+  onSubmit,
   successMessage = "Thanks \u2014 we\u2019ll be in touch shortly.",
-  testId
+  renderSuccess,
+  testId,
+  testIds
 }) {
-  const [sent, setSent] = react.useState(false);
+  const [sentValues, setSentValues] = react.useState(null);
+  const [isSending, setIsSending] = react.useState(false);
   const list = fields ?? [];
-  const onSubmit = (e) => {
-    if (!action) {
-      e.preventDefault();
-      setSent(true);
+  const ids = {
+    form: testIds?.form ?? testId,
+    success: testIds?.success ?? (testId ? `${testId}-success` : void 0),
+    submit: testIds?.submit ?? (testId ? `${testId}-submit` : void 0),
+    field: (name) => testIds?.field?.(name) ?? (testId ? `${testId}-field-${name}` : void 0)
+  };
+  const handleSubmit = async (e) => {
+    if (action && !onSubmit) return;
+    e.preventDefault();
+    const values = {};
+    new FormData(e.currentTarget).forEach((v, k) => {
+      if (typeof v === "string") values[k] = v;
+    });
+    if (onSubmit) {
+      setIsSending(true);
+      try {
+        await onSubmit(values);
+      } catch {
+        return;
+      } finally {
+        setIsSending(false);
+      }
     }
+    setSentValues(values);
   };
-  if (sent) {
-    return /* @__PURE__ */ jsxRuntime.jsx(
+  if (sentValues) {
+    return renderSuccess ? /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": ids.success, children: renderSuccess(sentValues) }) : /* @__PURE__ */ jsxRuntime.jsx(
       "p",
       {
         className: "rounded-lg border border-border bg-muted p-6 text-center text-sm text-foreground",
         role: "status",
-        "data-testid": testId && `${testId}-success`,
+        "data-testid": ids.success,
         children: successMessage
       }
     );
@@ -2156,42 +1282,57 @@ function ContactForm({
     "form",
     {
       action,
-      method: action ? "post" : void 0,
-      onSubmit,
+      method: action && !onSubmit ? "post" : void 0,
+      onSubmit: handleSubmit,
       className: "mx-auto flex max-w-xl flex-col gap-4",
-      "data-testid": testId,
+      "data-testid": ids.form,
       children: [
-        list.map((f, i) => {
-          const inputClass = "w-full rounded-md border border-border bg-card px-3 py-2 text-sm text-foreground outline-none focus:border-primary";
-          return /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex flex-col gap-1.5 text-left", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: f.label }),
-            f.type === "textarea" ? /* @__PURE__ */ jsxRuntime.jsx(
-              "textarea",
-              {
-                name: f.name,
-                required: f.required,
-                rows: 4,
-                className: inputClass,
-                "data-testid": testId && `${testId}-field-${f.name}`
-              }
-            ) : /* @__PURE__ */ jsxRuntime.jsx(
-              "input",
-              {
-                name: f.name,
-                type: f.type || "text",
-                required: f.required,
-                className: inputClass,
-                "data-testid": testId && `${testId}-field-${f.name}`
-              }
-            )
-          ] }, i);
-        }),
+        list.map((f, i) => /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex flex-col gap-1.5 text-left", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: f.label }),
+          f.type === "textarea" ? /* @__PURE__ */ jsxRuntime.jsx(
+            "textarea",
+            {
+              name: f.name,
+              required: f.required,
+              rows: 4,
+              defaultValue: f.defaultValue,
+              placeholder: f.placeholder,
+              className: INPUT_CLASS,
+              "data-testid": ids.field(f.name)
+            }
+          ) : f.type === "select" ? /* @__PURE__ */ jsxRuntime.jsxs(
+            "select",
+            {
+              name: f.name,
+              required: f.required,
+              defaultValue: f.defaultValue ?? "",
+              className: INPUT_CLASS,
+              "data-testid": ids.field(f.name),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", disabled: f.required, children: f.placeholder ?? "" }),
+                (f.options ?? []).map((o) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: o.value, children: o.label }, o.value))
+              ]
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              name: f.name,
+              type: f.type || "text",
+              required: f.required,
+              defaultValue: f.defaultValue,
+              placeholder: f.placeholder,
+              className: INPUT_CLASS,
+              "data-testid": ids.field(f.name)
+            }
+          )
+        ] }, i)),
         /* @__PURE__ */ jsxRuntime.jsx(
           ui.Button,
           {
             type: "submit",
             className: ui.cn("mt-1 self-start"),
-            "data-testid": testId && `${testId}-submit`,
+            disabled: isSending,
+            "data-testid": ids.submit,
             children: submitLabel
           }
         )
@@ -2279,7 +1420,7 @@ function TeamGrid({ members, columns = "3", linkComponent, testId }) {
           children: [
             /* @__PURE__ */ jsxRuntime.jsxs(ui.Avatar, { className: "size-20", children: [
               m.avatarUrl && /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarImage, { src: m.avatarUrl, alt: m.name }),
-              /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarFallback, { children: initials(m.name || "?") })
+              /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarFallback, { children: chunkWJMEXTVD_cjs.initials(m.name || "?") })
             ] }),
             /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mt-4 text-base font-semibold tracking-tight", children: m.name }),
             m.role && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-primary", children: m.role }),
@@ -2330,7 +1471,7 @@ function TestimonialGrid({ items, columns = "3", testId }) {
         (t.author || t.avatarUrl) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-5 flex items-center gap-3", children: [
           /* @__PURE__ */ jsxRuntime.jsxs(ui.Avatar, { className: "size-9", children: [
             t.avatarUrl && /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarImage, { src: t.avatarUrl, alt: t.author ?? "" }),
-            /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarFallback, { children: initials(t.author || "?") })
+            /* @__PURE__ */ jsxRuntime.jsx(ui.AvatarFallback, { children: chunkWJMEXTVD_cjs.initials(t.author || "?") })
           ] }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             t.author && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold", children: t.author }),
@@ -2351,7 +1492,6 @@ exports.Banner = Banner;
 exports.BlockImage = BlockImage;
 exports.BlockLink = BlockLink;
 exports.CTABanner = CTABanner;
-exports.Callout = Callout;
 exports.Columns = Columns;
 exports.ContactForm = ContactForm;
 exports.Container = Container;
@@ -2371,16 +1511,11 @@ exports.SectionHeading = SectionHeading;
 exports.Spacer = Spacer;
 exports.Steps = Steps;
 exports.THEME_STYLE_ID = THEME_STYLE_ID;
-exports.TIMELINE_ZOOM = TIMELINE_ZOOM;
 exports.Tabs = Tabs;
 exports.TeamGrid = TeamGrid;
 exports.Testimonial = Testimonial;
 exports.TestimonialGrid = TestimonialGrid;
 exports.ThemeEditor = ThemeEditor;
-exports.Timeline = Timeline;
-exports.TimelineCalendar = TimelineCalendar;
-exports.TimelineGantt = TimelineGantt;
-exports.TimelineZoomControl = TimelineZoomControl;
 exports.VideoEmbed = VideoEmbed;
 exports.applyFontVars = applyFontVars;
 exports.applyStoredTheme = applyStoredTheme;
@@ -2390,28 +1525,14 @@ exports.assetRefId = assetRefId;
 exports.clearFontVars = clearFontVars;
 exports.clearThemeVars = clearThemeVars;
 exports.createThemeStore = createThemeStore;
-exports.dayKey = dayKey;
-exports.daysUntil = daysUntil;
-exports.fmtDate = fmtDate;
-exports.fmtDateTime = fmtDateTime;
 exports.fontPackages = fontPackages;
-exports.formatPageRefs = formatPageRefs;
-exports.formatSpan = formatSpan;
-exports.fromNow = fromNow;
-exports.gbp = gbp;
 exports.getFontPairing = getFontPairing;
-exports.hrs = hrs;
-exports.initials = initials;
 exports.isAssetRef = isAssetRef;
 exports.matchFontPairing = matchFontPairing;
-exports.monthLabel = monthLabel;
-exports.parseIso = parseIso2;
-exports.pct = pct;
 exports.tid = tid;
 exports.toEmbedUrl = toEmbedUrl;
 exports.toHslTriplet = toHslTriplet;
 exports.useAssetRenderer = useAssetRenderer;
 exports.useAssetResolverActive = useAssetResolverActive;
-exports.utcDay = utcDay;
-//# sourceMappingURL=chunk-DBAUZD7A.cjs.map
-//# sourceMappingURL=chunk-DBAUZD7A.cjs.map
+//# sourceMappingURL=chunk-FZQJ2S6P.cjs.map
+//# sourceMappingURL=chunk-FZQJ2S6P.cjs.map