@orellabs/ui 0.1.2

package/dist/index.js

@@ -0,0 +1,1882 @@
+import z, { useState as C, useRef as j, useEffect as T, useCallback as L } from "react";
+import { jsxs as f, jsx as n, Fragment as B } from "react/jsx-runtime";
+const e = {
+  // Brand
+  black: "#1A1A1A",
+  blackHover: "#2A2A2A",
+  red: "#D42B2B",
+  white: "#FFFFFF",
+  // Page & surface
+  pageBg: "#F1F1F1",
+  cardBg: "#FFFFFF",
+  bgSubtle: "#FAFAFA",
+  // Text
+  textPrimary: "#1A1A1A",
+  textSecondary: "#6B7280",
+  textTertiary: "#9CA3AF",
+  textDark: "#374151",
+  textDisabled: "#D1D5DB",
+  textInverse: "#FFFFFF",
+  // Borders
+  border: "#E5E5E5",
+  borderLight: "#D1D5DB",
+  borderSubtle: "#F3F4F6",
+  borderFocus: "#1A1A1A",
+  // Semantic — status
+  success: "#22C55E",
+  successBg: "#F0FDF4",
+  successBorder: "#BBF7D0",
+  warning: "#F59E0B",
+  warningBg: "#FFFBEB",
+  warningBorder: "#FDE68A",
+  error: "#EF4444",
+  errorHover: "#DC2626",
+  errorBg: "#FEF2F2",
+  errorBorder: "#FECACA",
+  info: "#2563EB",
+  infoBg: "#EFF6FF",
+  infoBorder: "#BFDBFE",
+  // Pro badge / neutral chip
+  neutralBg: "#F3F4F6",
+  neutralText: "#6B7280",
+  // Skeleton
+  skeletonBase: "#E5E5E5",
+  skeletonPulse: "#F1F2F4"
+}, a = {
+  0: "0px",
+  1: "4px",
+  2: "8px",
+  3: "12px",
+  4: "16px",
+  5: "20px",
+  6: "24px",
+  8: "32px",
+  10: "40px",
+  12: "48px",
+  16: "64px",
+  20: "80px"
+}, t = {
+  fontFamily: {
+    base: "-apple-system, 'Helvetica Neue', sans-serif",
+    mono: "'Menlo', 'Monaco', 'Courier New', monospace"
+  },
+  size: {
+    xs: "10px",
+    sm: "11px",
+    base: "13px",
+    md: "14px",
+    lg: "16px",
+    xl: "20px",
+    "2xl": "24px",
+    "3xl": "32px"
+  },
+  weight: {
+    normal: 400,
+    medium: 500,
+    semibold: 600,
+    bold: 700,
+    extrabold: 800
+  },
+  lineHeight: {
+    tight: 1.2,
+    snug: 1.4,
+    normal: 1.5,
+    relaxed: 1.55,
+    loose: 1.75
+  },
+  letterSpacing: {
+    tight: "-0.02em",
+    snug: "-0.01em",
+    normal: "0em",
+    wide: "0.02em"
+  }
+}, m = {
+  none: "0px",
+  xs: "4px",
+  sm: "6px",
+  md: "8px",
+  lg: "10px",
+  xl: "12px",
+  "2xl": "16px",
+  full: "9999px"
+}, I = {
+  none: "none",
+  sm: "0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04)",
+  md: "0 4px 12px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04)",
+  lg: "0 20px 60px rgba(0,0,0,0.18)",
+  focus: "0 0 0 3px rgba(26, 26, 26, 0.12)"
+}, V = {
+  sm: {
+    padding: `${a[1]} ${a[3]}`,
+    fontSize: t.size.base,
+    height: "32px",
+    gap: a[1]
+  },
+  md: {
+    padding: `${a[2]} ${a[4]}`,
+    fontSize: t.size.md,
+    height: "40px",
+    gap: a[2]
+  },
+  lg: {
+    padding: `${a[3]} ${a[6]}`,
+    fontSize: t.size.md,
+    height: "48px",
+    gap: a[2]
+  }
+}, O = {
+  primary: {
+    background: e.black,
+    color: e.textInverse,
+    border: "none",
+    hoverBg: e.blackHover
+  },
+  ghost: {
+    background: "transparent",
+    color: e.textPrimary,
+    border: `1px solid ${e.border}`,
+    hoverBg: e.bgSubtle
+  },
+  danger: {
+    background: e.error,
+    color: e.textInverse,
+    border: "none",
+    hoverBg: e.errorHover
+  },
+  text: {
+    background: "transparent",
+    color: e.textSecondary,
+    border: "none",
+    hoverBg: e.bgSubtle
+  }
+};
+function N({
+  variant: r,
+  size: i,
+  loading: o = !1,
+  disabled: l = !1,
+  fullWidth: s = !1,
+  leftIcon: d,
+  children: g,
+  onClick: u
+}) {
+  const p = V[i], c = O[r], y = l || o, h = {
+    display: "inline-flex",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: p.gap,
+    padding: p.padding,
+    fontSize: p.fontSize,
+    height: p.height,
+    fontFamily: t.fontFamily.base,
+    fontWeight: t.weight.semibold,
+    lineHeight: t.lineHeight.tight,
+    letterSpacing: t.letterSpacing.snug,
+    borderRadius: m.md,
+    background: c.background,
+    color: c.color,
+    border: c.border,
+    cursor: y ? "not-allowed" : "pointer",
+    opacity: y ? 0.5 : 1,
+    transition: "background 150ms ease, opacity 150ms ease, box-shadow 150ms ease",
+    width: s ? "100%" : void 0,
+    boxSizing: "border-box",
+    outline: "none"
+  };
+  return /* @__PURE__ */ f(
+    "button",
+    {
+      style: h,
+      onClick: u,
+      disabled: y,
+      onMouseEnter: (x) => {
+        y || (x.currentTarget.style.background = c.hoverBg);
+      },
+      onMouseLeave: (x) => {
+        y || (x.currentTarget.style.background = c.background);
+      },
+      onFocus: (x) => {
+        x.currentTarget.style.boxShadow = I.focus;
+      },
+      onBlur: (x) => {
+        x.currentTarget.style.boxShadow = "none";
+      },
+      children: [
+        o ? /* @__PURE__ */ n(K, {}) : d,
+        g
+      ]
+    }
+  );
+}
+let D = !1;
+function U() {
+  if (D || typeof document > "u") return;
+  const r = document.createElement("style");
+  r.textContent = "@keyframes ol-spin { to { transform: rotate(360deg) } }", document.head.appendChild(r), D = !0;
+}
+function K() {
+  return U(), /* @__PURE__ */ n(
+    "svg",
+    {
+      width: "16",
+      height: "16",
+      viewBox: "0 0 16 16",
+      fill: "none",
+      style: {
+        animation: "ol-spin 0.6s linear infinite"
+      },
+      children: /* @__PURE__ */ n(
+        "circle",
+        {
+          cx: "8",
+          cy: "8",
+          r: "6",
+          stroke: "currentColor",
+          strokeWidth: "2",
+          strokeLinecap: "round",
+          strokeDasharray: "28",
+          strokeDashoffset: "20",
+          opacity: "0.8"
+        }
+      )
+    }
+  );
+}
+const X = {
+  none: "0px",
+  sm: a[3],
+  md: a[6],
+  lg: a[8]
+};
+function ge({
+  padding: r = "md",
+  noBorder: i = !1,
+  shadow: o = !1,
+  children: l
+}) {
+  const s = {
+    background: e.cardBg,
+    borderRadius: m.xl,
+    padding: X[r],
+    border: i ? "none" : `1px solid ${e.border}`,
+    boxShadow: o ? I.sm : I.none,
+    boxSizing: "border-box"
+  };
+  return /* @__PURE__ */ n("div", { style: s, children: l });
+}
+const G = {
+  success: { bg: e.successBg, color: e.success, dot: e.success },
+  warning: { bg: e.warningBg, color: e.warning, dot: e.warning },
+  error: { bg: e.errorBg, color: e.error, dot: e.error },
+  info: { bg: e.infoBg, color: e.info, dot: e.info },
+  neutral: { bg: e.neutralBg, color: e.neutralText, dot: e.textTertiary }
+}, Y = z.memo(function({ tone: i, dot: o = !1, children: l }) {
+  const s = G[i], d = {
+    display: "inline-flex",
+    alignItems: "center",
+    gap: a[1],
+    padding: `2px ${a[2]}`,
+    fontSize: t.size.xs,
+    fontWeight: t.weight.semibold,
+    fontFamily: t.fontFamily.base,
+    lineHeight: t.lineHeight.tight,
+    borderRadius: m.xs,
+    background: s.bg,
+    color: s.color,
+    whiteSpace: "nowrap"
+  }, g = {
+    width: "5px",
+    height: "5px",
+    borderRadius: m.full,
+    background: s.dot,
+    flexShrink: 0
+  };
+  return /* @__PURE__ */ f("span", { style: d, children: [
+    o && /* @__PURE__ */ n("span", { style: g }),
+    l
+  ] });
+});
+function ue({ stats: r, cols: i = 4 }) {
+  const o = {
+    display: "flex",
+    border: `1px solid ${e.border}`,
+    borderRadius: m.lg,
+    overflow: "hidden"
+  };
+  return /* @__PURE__ */ n("div", { style: o, children: r.map((l, s) => /* @__PURE__ */ n(q, { stat: l, isLast: s === r.length - 1 }, s)) });
+}
+function q({ stat: r, isLast: i }) {
+  const o = r.highlight, l = {
+    flex: 1,
+    padding: `${a[3]} ${a[4]}`,
+    textAlign: "center",
+    borderRight: i ? void 0 : `1px solid ${e.border}`,
+    background: o ? e.black : "transparent"
+  }, s = {
+    fontSize: t.size.xl,
+    fontWeight: t.weight.bold,
+    fontFamily: t.fontFamily.base,
+    lineHeight: t.lineHeight.tight,
+    color: r.color || (o ? e.textInverse : e.textPrimary),
+    display: "flex",
+    alignItems: "baseline",
+    justifyContent: "center",
+    gap: a[1],
+    margin: 0
+  }, d = {
+    fontSize: t.size.sm,
+    fontWeight: t.weight.medium,
+    color: e.textTertiary
+  }, g = {
+    fontSize: t.size.sm,
+    fontFamily: t.fontFamily.base,
+    color: e.textTertiary,
+    marginTop: "2px"
+  }, u = {
+    fontSize: t.size.xs,
+    color: e.textTertiary,
+    fontFamily: t.fontFamily.base,
+    marginTop: "4px"
+  };
+  return /* @__PURE__ */ f("div", { style: l, children: [
+    /* @__PURE__ */ f("p", { style: s, children: [
+      r.value,
+      r.unit && /* @__PURE__ */ n("span", { style: d, children: r.unit })
+    ] }),
+    /* @__PURE__ */ n("div", { style: g, children: r.label }),
+    r.sub && /* @__PURE__ */ n("div", { style: u, children: r.sub })
+  ] });
+}
+const fe = z.memo(function({ children: i, action: o }) {
+  const l = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    marginBottom: a[2]
+  }, s = {
+    fontSize: t.size.sm,
+    fontWeight: t.weight.medium,
+    fontFamily: t.fontFamily.base,
+    color: e.textSecondary,
+    margin: 0
+  };
+  return /* @__PURE__ */ f("div", { style: l, children: [
+    /* @__PURE__ */ n("p", { style: s, children: i }),
+    o && /* @__PURE__ */ n("div", { children: o })
+  ] });
+});
+function pe({ tabs: r, active: i, onChange: o, size: l = "md" }) {
+  const s = {
+    display: "inline-flex",
+    alignItems: "center",
+    gap: a[1],
+    fontFamily: t.fontFamily.base
+  }, d = l === "sm" ? t.size.base : t.size.md, g = l === "sm" ? a[1] : a[2], u = l === "sm" ? a[3] : a[4];
+  return /* @__PURE__ */ n("div", { style: s, role: "tablist", children: r.map((p) => {
+    const c = p.id === i, y = {
+      padding: `${g} ${u}`,
+      fontSize: d,
+      fontWeight: c ? t.weight.semibold : t.weight.normal,
+      fontFamily: t.fontFamily.base,
+      color: c ? e.textInverse : e.textSecondary,
+      background: c ? e.black : "transparent",
+      border: "none",
+      borderRadius: m.full,
+      cursor: "pointer",
+      display: "flex",
+      alignItems: "center",
+      gap: a[2],
+      transition: "background 150ms ease, color 150ms ease",
+      whiteSpace: "nowrap"
+    }, h = {
+      fontSize: t.size.xs,
+      fontWeight: t.weight.semibold,
+      background: c ? "rgba(255,255,255,0.2)" : e.neutralBg,
+      color: c ? e.textInverse : e.textSecondary,
+      borderRadius: m.full,
+      padding: `0 ${a[2]}`,
+      minWidth: "20px",
+      textAlign: "center",
+      lineHeight: "20px"
+    };
+    return /* @__PURE__ */ f(
+      "button",
+      {
+        style: y,
+        role: "tab",
+        "aria-selected": c,
+        onClick: () => !c && o(p.id),
+        onMouseEnter: (x) => {
+          c || (x.currentTarget.style.background = e.neutralBg, x.currentTarget.style.color = e.textPrimary);
+        },
+        onMouseLeave: (x) => {
+          c || (x.currentTarget.style.background = "transparent", x.currentTarget.style.color = e.textSecondary);
+        },
+        children: [
+          p.label,
+          p.badge !== void 0 && /* @__PURE__ */ n("span", { style: h, children: p.badge })
+        ]
+      },
+      p.id
+    );
+  }) });
+}
+function ye({
+  columns: r,
+  rows: i,
+  loading: o = !1,
+  emptyState: l,
+  onRowClick: s
+}) {
+  const d = {
+    width: "100%",
+    borderCollapse: "collapse",
+    fontFamily: t.fontFamily.base,
+    fontSize: t.size.base
+  }, g = (c) => ({
+    textAlign: c.align || "left",
+    padding: `${a[3]} ${a[4]}`,
+    fontSize: t.size.sm,
+    fontWeight: t.weight.medium,
+    color: e.textTertiary,
+    borderBottom: `1px solid ${e.border}`,
+    width: c.width,
+    whiteSpace: "nowrap"
+  }), u = (c) => ({
+    textAlign: c.align || "left",
+    padding: `${a[3]} ${a[4]}`,
+    fontSize: t.size.base,
+    color: e.textPrimary,
+    borderBottom: `1px solid ${e.borderSubtle}`,
+    verticalAlign: "middle",
+    lineHeight: t.lineHeight.snug
+  }), p = {
+    cursor: s ? "pointer" : "default",
+    transition: "background 100ms ease"
+  };
+  return o ? /* @__PURE__ */ n("div", { style: { padding: a[8], textAlign: "center" }, children: /* @__PURE__ */ n("p", { style: { color: e.textTertiary, fontSize: t.size.base }, children: "Loading..." }) }) : i.length === 0 ? l ? /* @__PURE__ */ n(B, { children: l }) : /* @__PURE__ */ n("div", { style: { padding: a[8], textAlign: "center" }, children: /* @__PURE__ */ n("p", { style: { color: e.textTertiary, fontSize: t.size.base }, children: "No data" }) }) : /* @__PURE__ */ n("div", { style: { overflowX: "auto", borderRadius: m.md }, children: /* @__PURE__ */ f("table", { style: d, children: [
+    /* @__PURE__ */ n("thead", { children: /* @__PURE__ */ n("tr", { children: r.map((c) => /* @__PURE__ */ n("th", { style: g(c), children: c.header }, String(c.key))) }) }),
+    /* @__PURE__ */ n("tbody", { children: i.map((c, y) => /* @__PURE__ */ n(
+      "tr",
+      {
+        style: p,
+        onClick: () => s == null ? void 0 : s(c),
+        onMouseEnter: (h) => {
+          h.currentTarget.style.background = e.bgSubtle;
+        },
+        onMouseLeave: (h) => {
+          h.currentTarget.style.background = "transparent";
+        },
+        children: r.map((h) => /* @__PURE__ */ n("td", { style: u(h), children: h.render ? h.render(c) : String(c[h.key] ?? "") }, String(h.key)))
+      },
+      y
+    )) })
+  ] }) });
+}
+function he({
+  label: r,
+  hint: i,
+  error: o,
+  prefix: l,
+  suffix: s,
+  type: d = "text",
+  placeholder: g,
+  disabled: u = !1,
+  value: p,
+  onChange: c
+}) {
+  const y = !!o, h = {
+    display: "flex",
+    flexDirection: "column",
+    gap: a[1],
+    fontFamily: t.fontFamily.base
+  }, x = {
+    fontSize: t.size.base,
+    fontWeight: t.weight.medium,
+    color: e.textPrimary,
+    margin: 0
+  }, w = {
+    display: "flex",
+    alignItems: "center",
+    gap: a[2],
+    padding: `${a[2]} ${a[3]}`,
+    background: u ? e.bgSubtle : e.cardBg,
+    border: `1px solid ${y ? e.error : e.border}`,
+    borderRadius: m.md,
+    transition: "border-color 150ms ease, box-shadow 150ms ease",
+    cursor: u ? "not-allowed" : "text"
+  }, b = {
+    flex: 1,
+    border: "none",
+    outline: "none",
+    background: "transparent",
+    fontSize: t.size.md,
+    fontFamily: t.fontFamily.base,
+    color: u ? e.textDisabled : e.textPrimary,
+    cursor: u ? "not-allowed" : "text",
+    padding: 0,
+    width: "100%"
+  }, S = {
+    fontSize: t.size.sm,
+    color: y ? e.error : e.textTertiary,
+    margin: 0
+  }, k = {
+    fontSize: t.size.base,
+    color: e.textTertiary,
+    flexShrink: 0
+  };
+  return /* @__PURE__ */ f("div", { style: h, children: [
+    r && /* @__PURE__ */ n("p", { style: x, children: r }),
+    /* @__PURE__ */ f(
+      "div",
+      {
+        style: w,
+        onFocusCapture: (F) => {
+          const M = F.currentTarget;
+          M.style.borderColor = y ? e.error : e.borderFocus, M.style.boxShadow = I.focus;
+        },
+        onBlurCapture: (F) => {
+          const M = F.currentTarget;
+          M.style.borderColor = y ? e.error : e.border, M.style.boxShadow = "none";
+        },
+        children: [
+          l && /* @__PURE__ */ n("span", { style: k, children: l }),
+          /* @__PURE__ */ n(
+            "input",
+            {
+              type: d,
+              value: p,
+              onChange: (F) => c(F.target.value),
+              placeholder: g,
+              disabled: u,
+              "aria-invalid": y,
+              style: b
+            }
+          ),
+          s && /* @__PURE__ */ n("span", { style: k, children: s })
+        ]
+      }
+    ),
+    (o || i) && /* @__PURE__ */ n("p", { style: S, children: o || i })
+  ] });
+}
+function J(r) {
+  return r >= 75 ? e.success : r >= 50 ? e.warning : e.error;
+}
+function _(r) {
+  return r >= 75 ? e.successBg : r >= 50 ? e.warningBg : e.errorBg;
+}
+const me = z.memo(function({
+  score: i,
+  max: o = 100,
+  width: l = "100%",
+  showLabel: s = !0,
+  size: d = "md"
+}) {
+  const g = Math.min(Math.max(i / o * 100, 0), 100), u = J(g), p = _(g), c = d === "sm" ? "6px" : "8px", y = {
+    display: "flex",
+    alignItems: "center",
+    gap: a[3],
+    width: l,
+    fontFamily: t.fontFamily.base
+  }, h = {
+    flex: 1,
+    height: c,
+    background: p,
+    borderRadius: m.full,
+    overflow: "hidden"
+  }, x = {
+    height: "100%",
+    width: `${g}%`,
+    background: u,
+    borderRadius: m.full,
+    transition: "width 400ms ease"
+  }, w = {
+    fontSize: d === "sm" ? t.size.xs : t.size.sm,
+    fontWeight: t.weight.semibold,
+    color: u,
+    minWidth: "36px",
+    textAlign: "right"
+  };
+  return /* @__PURE__ */ f("div", { style: y, children: [
+    /* @__PURE__ */ n("div", { style: h, children: /* @__PURE__ */ n("div", { style: x }) }),
+    s && /* @__PURE__ */ f("span", { style: w, children: [
+      Math.round(g),
+      "%"
+    ] })
+  ] });
+}), W = 'a[href], button:not([disabled]), textarea:not([disabled]), input:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])';
+function xe({
+  open: r,
+  onClose: i,
+  children: o,
+  maxWidth: l = 400,
+  title: s
+}) {
+  const [d, g] = C(!1), u = j(null), p = z.useId();
+  if (T(() => {
+    if (!r) {
+      g(!1);
+      return;
+    }
+    const y = requestAnimationFrame(() => g(!0));
+    return () => cancelAnimationFrame(y);
+  }, [r]), T(() => {
+    if (!r) return;
+    const y = (h) => {
+      h.key === "Escape" && i();
+    };
+    return document.addEventListener("keydown", y), () => document.removeEventListener("keydown", y);
+  }, [r, i]), T(() => {
+    if (!r || !u.current) return;
+    const y = u.current, h = document.activeElement, x = y.querySelector(W);
+    x ? x.focus() : y.focus();
+    const w = (b) => {
+      if (b.key !== "Tab") return;
+      const S = y.querySelectorAll(W);
+      if (S.length === 0) return;
+      const k = S[0], F = S[S.length - 1];
+      b.shiftKey ? document.activeElement === k && (b.preventDefault(), F.focus()) : document.activeElement === F && (b.preventDefault(), k.focus());
+    };
+    return document.addEventListener("keydown", w), () => {
+      document.removeEventListener("keydown", w), h == null || h.focus();
+    };
+  }, [r]), !r) return null;
+  const c = /* @__PURE__ */ n(
+    "button",
+    {
+      onClick: i,
+      onMouseEnter: (y) => {
+        y.currentTarget.style.background = e.pageBg;
+      },
+      onMouseLeave: (y) => {
+        y.currentTarget.style.background = "transparent";
+      },
+      style: {
+        width: "28px",
+        height: "28px",
+        borderRadius: m.sm,
+        border: "none",
+        background: "transparent",
+        color: e.textTertiary,
+        cursor: "pointer",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        flexShrink: 0
+      },
+      "aria-label": "Close",
+      children: /* @__PURE__ */ n("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ n(
+        "path",
+        {
+          d: "M1 1l10 10M11 1L1 11",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round"
+        }
+      ) })
+    }
+  );
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      role: "presentation",
+      onClick: i,
+      style: {
+        position: "fixed",
+        inset: 0,
+        background: "rgba(0,0,0,0.32)",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        zIndex: 100,
+        padding: a[4]
+      },
+      children: /* @__PURE__ */ n(
+        "div",
+        {
+          ref: u,
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-labelledby": s ? p : void 0,
+          tabIndex: -1,
+          onClick: (y) => y.stopPropagation(),
+          onKeyDown: (y) => y.stopPropagation(),
+          style: {
+            background: e.cardBg,
+            borderRadius: m["2xl"],
+            width: "100%",
+            maxWidth: l,
+            boxShadow: I.lg,
+            opacity: d ? 1 : 0,
+            transform: d ? "none" : "translateY(10px) scale(0.97)",
+            transition: "opacity 0.18s ease, transform 0.18s ease",
+            outline: "none",
+            ...s ? {
+              display: "flex",
+              flexDirection: "column",
+              maxHeight: "calc(100vh - 32px)",
+              overflow: "hidden"
+            } : {
+              padding: "28px 24px 24px",
+              position: "relative"
+            }
+          },
+          children: s ? /* @__PURE__ */ f(B, { children: [
+            /* @__PURE__ */ f(
+              "div",
+              {
+                style: {
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "space-between",
+                  padding: `${a[4]} ${a[5]}`,
+                  borderBottom: `1px solid ${e.border}`,
+                  flexShrink: 0
+                },
+                children: [
+                  /* @__PURE__ */ n(
+                    "span",
+                    {
+                      id: p,
+                      style: {
+                        fontWeight: t.weight.bold,
+                        fontSize: t.size.base,
+                        fontFamily: t.fontFamily.base,
+                        color: e.textPrimary
+                      },
+                      children: s
+                    }
+                  ),
+                  c
+                ]
+              }
+            ),
+            /* @__PURE__ */ n("div", { style: { overflowY: "auto", flex: 1 }, children: o })
+          ] }) : /* @__PURE__ */ f(B, { children: [
+            /* @__PURE__ */ n("div", { style: { position: "absolute", top: "14px", right: "14px" }, children: c }),
+            o
+          ] })
+        }
+      )
+    }
+  );
+}
+function be({
+  options: r,
+  value: i,
+  onChange: o,
+  fullWidth: l = !1
+}) {
+  const s = {
+    display: "inline-flex",
+    border: `1px solid ${e.border}`,
+    borderRadius: m.md,
+    overflow: "hidden",
+    fontFamily: t.fontFamily.base,
+    width: l ? "100%" : void 0
+  };
+  return /* @__PURE__ */ n("div", { style: s, role: "radiogroup", children: r.map((d, g) => {
+    const u = d.value === i, p = {
+      flex: l ? 1 : void 0,
+      padding: `${a[2]} ${a[4]}`,
+      fontSize: t.size.md,
+      fontWeight: u ? t.weight.semibold : t.weight.normal,
+      fontFamily: t.fontFamily.base,
+      color: u ? e.textInverse : e.textPrimary,
+      background: u ? e.black : e.cardBg,
+      border: "none",
+      borderRight: g < r.length - 1 ? `1px solid ${e.border}` : "none",
+      cursor: "pointer",
+      transition: "background 150ms ease, color 150ms ease",
+      textAlign: "center",
+      whiteSpace: "nowrap"
+    };
+    return /* @__PURE__ */ n(
+      "button",
+      {
+        style: p,
+        role: "radio",
+        "aria-checked": u,
+        onClick: () => o(d.value),
+        onMouseEnter: (c) => {
+          u || (c.currentTarget.style.background = e.bgSubtle);
+        },
+        onMouseLeave: (c) => {
+          u || (c.currentTarget.style.background = e.cardBg);
+        },
+        children: d.label
+      },
+      d.value
+    );
+  }) });
+}
+function v(r, i = "0 0 24 24") {
+  return function({ size: l = 20, filled: s, className: d, style: g, ...u }) {
+    return /* @__PURE__ */ n(
+      "svg",
+      {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: l,
+        height: l,
+        viewBox: i,
+        fill: s ? "currentColor" : "none",
+        stroke: "currentColor",
+        strokeWidth: "1.5",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        className: d,
+        style: { flexShrink: 0, ...g },
+        ...u,
+        children: typeof r == "string" ? /* @__PURE__ */ n("path", { d: r }) : r
+      }
+    );
+  };
+}
+const Q = v(
+  /* @__PURE__ */ f(B, { children: [
+    /* @__PURE__ */ n("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2", ry: "2" }),
+    /* @__PURE__ */ n("path", { d: "M7 11V7a5 5 0 0110 0v4" })
+  ] })
+), Se = v(
+  /* @__PURE__ */ f(B, { children: [
+    /* @__PURE__ */ n("circle", { cx: "11", cy: "11", r: "8" }),
+    /* @__PURE__ */ n("path", { d: "M21 21l-4.35-4.35" })
+  ] })
+), Z = v("M20 6L9 17l-5-5"), ee = v("M18 6L6 18M6 6l12 12"), we = v("M3 12h18M3 6h18M3 18h18"), A = v(
+  /* @__PURE__ */ f(B, { children: [
+    /* @__PURE__ */ n("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ n("path", { d: "M12 16v-4M12 8h.01" })
+  ] })
+), te = v(
+  /* @__PURE__ */ f(B, { children: [
+    /* @__PURE__ */ n("path", { d: "M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z" }),
+    /* @__PURE__ */ n("path", { d: "M12 9v4M12 17h.01" })
+  ] })
+), ve = v("M5 3l14 9-14 9V3z"), ke = v(
+  "M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"
+), Fe = v(
+  /* @__PURE__ */ f(B, { children: [
+    /* @__PURE__ */ n("circle", { cx: "12", cy: "12", r: "3" }),
+    /* @__PURE__ */ n("path", { d: "M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 010 2.83 2 2 0 01-2.83 0l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-2 2 2 2 0 01-2-2v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83 0 2 2 0 010-2.83l.06-.06a1.65 1.65 0 00.33-1.82 1.65 1.65 0 00-1.51-1H3a2 2 0 01-2-2 2 2 0 012-2h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 010-2.83 2 2 0 012.83 0l.06.06a1.65 1.65 0 001.82.33H9a1.65 1.65 0 001-1.51V3a2 2 0 012-2 2 2 0 012 2v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 0 2 2 0 010 2.83l-.06.06a1.65 1.65 0 00-.33 1.82V9a1.65 1.65 0 001.51 1H21a2 2 0 012 2 2 2 0 01-2 2h-.09a1.65 1.65 0 00-1.51 1z" })
+  ] })
+), ze = v("M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4M17 8l-5-5-5 5M12 3v12"), Ce = v("M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4M7 10l5 5 5-5M12 15V3"), Ie = v("M5 12h14M12 5l7 7-7 7"), Be = v("M19 12H5M12 19l-7-7 7-7"), Me = v("M12 19V5M5 12l7-7 7 7"), Te = v("M12 5v14M19 12l-7 7-7-7"), $e = v("M9 18l6-6-6-6"), Le = v("M15 18l-6-6 6-6"), De = v("M18 15l-6-6-6 6"), We = v("M6 9l6 6 6-6");
+function Ae({
+  checked: r,
+  onChange: i,
+  label: o,
+  sublabel: l,
+  disabled: s = !1,
+  locked: d = !1,
+  badge: g,
+  right: u
+}) {
+  const p = !s && !d, c = {
+    display: "flex",
+    alignItems: "center",
+    gap: a[3],
+    padding: `${a[3]} ${a[4]}`,
+    background: r ? e.black : e.cardBg,
+    border: `1px solid ${r ? e.black : e.border}`,
+    borderRadius: m.lg,
+    cursor: p ? "pointer" : "default",
+    opacity: s ? 0.5 : 1,
+    transition: "background 150ms ease, border-color 150ms ease",
+    fontFamily: t.fontFamily.base
+  }, y = {
+    width: "8px",
+    height: "8px",
+    borderRadius: m.full,
+    background: r ? e.error : e.textTertiary,
+    flexShrink: 0
+  }, h = {
+    flex: 1,
+    display: "flex",
+    flexDirection: "column",
+    gap: "2px"
+  }, x = {
+    fontSize: t.size.md,
+    fontWeight: t.weight.semibold,
+    color: r ? e.textInverse : e.textPrimary,
+    lineHeight: t.lineHeight.tight
+  }, w = {
+    fontSize: t.size.sm,
+    color: r ? e.textTertiary : e.textSecondary,
+    lineHeight: t.lineHeight.tight
+  }, b = {
+    width: "20px",
+    height: "20px",
+    borderRadius: m.xs,
+    border: r ? "none" : `1.5px solid ${e.borderLight}`,
+    background: r ? e.error : "transparent",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    flexShrink: 0,
+    transition: "background 150ms ease, border-color 150ms ease"
+  };
+  return /* @__PURE__ */ f(
+    "div",
+    {
+      style: c,
+      role: "checkbox",
+      "aria-checked": r,
+      tabIndex: p ? 0 : -1,
+      onClick: () => p && i(!r),
+      onKeyDown: (S) => {
+        (S.key === " " || S.key === "Enter") && (S.preventDefault(), p && i(!r));
+      },
+      onMouseEnter: (S) => {
+        p && !r && (S.currentTarget.style.borderColor = e.borderLight);
+      },
+      onMouseLeave: (S) => {
+        p && !r && (S.currentTarget.style.borderColor = e.border);
+      },
+      children: [
+        /* @__PURE__ */ n("span", { style: y }),
+        /* @__PURE__ */ f("div", { style: h, children: [
+          /* @__PURE__ */ n("span", { style: x, children: o }),
+          l && /* @__PURE__ */ n("span", { style: w, children: l })
+        ] }),
+        g && /* @__PURE__ */ n("div", { children: g }),
+        u && /* @__PURE__ */ n("div", { children: u }),
+        d ? /* @__PURE__ */ n(Q, { size: 16, style: { color: e.textTertiary } }) : /* @__PURE__ */ n("div", { style: b, children: r && /* @__PURE__ */ n("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ n(
+          "path",
+          {
+            d: "M2.5 6l2.5 2.5 4.5-4.5",
+            stroke: e.textInverse,
+            strokeWidth: "1.5",
+            strokeLinecap: "round",
+            strokeLinejoin: "round"
+          }
+        ) }) })
+      ]
+    }
+  );
+}
+const ne = {
+  success: e.success,
+  warning: e.warning,
+  error: e.error,
+  info: e.info,
+  neutral: e.textTertiary
+};
+let R = !1;
+function re() {
+  if (R || typeof document > "u") return;
+  const r = document.createElement("style");
+  r.textContent = "@keyframes ol-pulse { 0%, 100% { opacity: 1 } 50% { opacity: 0.4 } }", document.head.appendChild(r), R = !0;
+}
+const Re = z.memo(function({ tone: i, size: o = "md", pulse: l = !1 }) {
+  l && re();
+  const s = o === "sm" ? "6px" : "8px", d = {
+    width: s,
+    height: s,
+    borderRadius: m.full,
+    backgroundColor: ne[i],
+    display: "inline-block",
+    flexShrink: 0,
+    animation: l ? "ol-pulse 1.5s ease-in-out infinite" : void 0
+  };
+  return /* @__PURE__ */ n("span", { style: d });
+});
+function Ee({ title: r, sub: i, action: o }) {
+  const l = {
+    display: "flex",
+    alignItems: "flex-start",
+    justifyContent: "space-between",
+    gap: a[4],
+    marginBottom: a[5],
+    fontFamily: t.fontFamily.base
+  }, s = {
+    display: "flex",
+    flexDirection: "column",
+    gap: "2px"
+  }, d = {
+    fontSize: t.size.xl,
+    fontWeight: t.weight.bold,
+    color: e.textPrimary,
+    letterSpacing: t.letterSpacing.tight,
+    lineHeight: t.lineHeight.tight,
+    margin: 0
+  }, g = {
+    fontSize: t.size.base,
+    color: e.textSecondary,
+    margin: 0
+  };
+  return /* @__PURE__ */ f("div", { style: l, children: [
+    /* @__PURE__ */ f("div", { style: s, children: [
+      /* @__PURE__ */ n("h2", { style: d, children: r }),
+      i && /* @__PURE__ */ n("p", { style: g, children: i })
+    ] }),
+    o && /* @__PURE__ */ n("div", { style: { flexShrink: 0 }, children: o })
+  ] });
+}
+const oe = {
+  error: e.error,
+  warning: e.warning,
+  info: e.info,
+  neutral: e.textTertiary
+};
+function He({ items: r }) {
+  const i = {
+    display: "flex",
+    flexDirection: "column",
+    gap: a[3],
+    fontFamily: t.fontFamily.base
+  };
+  return /* @__PURE__ */ n("div", { style: i, children: r.map((o, l) => {
+    const s = oe[o.tone || "neutral"];
+    return /* @__PURE__ */ f(
+      "div",
+      {
+        style: {
+          display: "flex",
+          alignItems: "flex-start",
+          gap: a[3]
+        },
+        children: [
+          /* @__PURE__ */ n(
+            "span",
+            {
+              style: {
+                width: "8px",
+                height: "8px",
+                borderRadius: "50%",
+                background: s,
+                flexShrink: 0,
+                marginTop: "5px"
+              }
+            }
+          ),
+          /* @__PURE__ */ n(
+            "span",
+            {
+              style: {
+                fontSize: t.size.base,
+                color: e.textPrimary,
+                lineHeight: t.lineHeight.relaxed
+              },
+              children: o.text
+            }
+          )
+        ]
+      },
+      l
+    );
+  }) });
+}
+const ie = {
+  success: { IconComponent: Z, bg: e.cardBg, accent: e.success },
+  error: { IconComponent: ee, bg: e.cardBg, accent: e.error },
+  warning: { IconComponent: te, bg: e.cardBg, accent: e.warning },
+  info: { IconComponent: A, bg: e.cardBg, accent: e.info },
+  neutral: { IconComponent: A, bg: e.cardBg, accent: e.textTertiary }
+};
+function Pe({
+  open: r,
+  onClose: i,
+  message: o,
+  tone: l = "neutral",
+  duration: s = 4e3,
+  action: d
+}) {
+  const [g, u] = C(!1);
+  if (T(() => {
+    if (!r) {
+      u(!1);
+      return;
+    }
+    const k = requestAnimationFrame(() => u(!0));
+    return () => cancelAnimationFrame(k);
+  }, [r]), T(() => {
+    if (!r || s <= 0) return;
+    const k = setTimeout(i, s);
+    return () => clearTimeout(k);
+  }, [r, s, i]), !r) return null;
+  const p = ie[l], c = {
+    position: "fixed",
+    bottom: "20px",
+    left: "50%",
+    transform: g ? "translateX(-50%) translateY(0)" : "translateX(-50%) translateY(16px)",
+    opacity: g ? 1 : 0,
+    transition: "opacity 0.18s ease, transform 0.18s ease",
+    zIndex: 200,
+    pointerEvents: "auto"
+  }, y = {
+    display: "flex",
+    alignItems: "center",
+    gap: a[3],
+    padding: `${a[3]} ${a[4]}`,
+    background: p.bg,
+    borderRadius: m.lg,
+    boxShadow: I.lg,
+    border: `1px solid ${e.border}`,
+    fontFamily: t.fontFamily.base,
+    maxWidth: "480px",
+    minWidth: "280px"
+  }, h = {
+    width: "22px",
+    height: "22px",
+    borderRadius: m.full,
+    background: p.accent,
+    color: e.textInverse,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    fontSize: "12px",
+    fontWeight: t.weight.bold,
+    flexShrink: 0,
+    lineHeight: 1
+  }, x = {
+    flex: 1,
+    fontSize: t.size.base,
+    color: e.textPrimary,
+    lineHeight: t.lineHeight.snug
+  }, w = {
+    fontSize: t.size.base,
+    fontWeight: t.weight.semibold,
+    color: p.accent,
+    background: "none",
+    border: "none",
+    cursor: "pointer",
+    padding: 0,
+    whiteSpace: "nowrap",
+    textDecoration: "underline",
+    textUnderlineOffset: "2px",
+    fontFamily: t.fontFamily.base
+  }, b = {
+    width: "24px",
+    height: "24px",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    background: "transparent",
+    border: "none",
+    borderRadius: m.xs,
+    cursor: "pointer",
+    color: e.textTertiary,
+    flexShrink: 0
+  }, S = p.IconComponent;
+  return /* @__PURE__ */ n("div", { style: c, children: /* @__PURE__ */ f("div", { style: y, children: [
+    /* @__PURE__ */ n("span", { style: h, children: /* @__PURE__ */ n(S, { size: 14 }) }),
+    /* @__PURE__ */ n("span", { style: x, children: o }),
+    d && /* @__PURE__ */ n("button", { style: w, onClick: d.onClick, children: d.label }),
+    /* @__PURE__ */ n(
+      "button",
+      {
+        style: b,
+        onClick: i,
+        "aria-label": "Dismiss",
+        onMouseEnter: (k) => {
+          k.currentTarget.style.background = e.pageBg;
+        },
+        onMouseLeave: (k) => {
+          k.currentTarget.style.background = "transparent";
+        },
+        children: /* @__PURE__ */ n("svg", { width: "10", height: "10", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ n("path", { d: "M1 1l10 10M11 1L1 11", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) })
+      }
+    )
+  ] }) });
+}
+const E = z.memo(function({ children: i }) {
+  const o = {
+    fontFamily: t.fontFamily.mono,
+    fontSize: t.size.sm,
+    backgroundColor: e.bgSubtle,
+    color: e.textDark,
+    padding: `2px ${a[2]}`,
+    borderRadius: m.md,
+    border: `1px solid ${e.border}`,
+    display: "inline-flex",
+    alignItems: "center"
+  };
+  return /* @__PURE__ */ n("span", { style: o, children: i });
+}), $ = {
+  added: e.success,
+  modified: e.warning,
+  destructive: e.error,
+  safe: e.textTertiary
+}, le = {
+  added: e.successBg,
+  modified: e.warningBg,
+  destructive: e.errorBg,
+  safe: e.bgSubtle
+  // slightly grey for unchanged/safe
+};
+function je({ title: r, handle: i, field: o, csvVal: l, storeVal: s, type: d, note: g }) {
+  const u = {
+    display: "grid",
+    gridTemplateColumns: "2fr 1fr 1.5fr 1.5fr 1fr",
+    gap: a[4],
+    padding: a[4],
+    backgroundColor: le[d],
+    borderLeft: `4px solid ${$[d]}`,
+    borderBottom: `1px solid ${e.border}`,
+    fontFamily: t.fontFamily.base,
+    alignItems: "start"
+  }, p = {
+    fontSize: t.size.md,
+    color: e.textPrimary,
+    margin: 0
+  }, c = {
+    fontSize: t.size.sm,
+    color: e.textSecondary,
+    fontFamily: t.fontFamily.mono,
+    marginTop: a[1],
+    marginBottom: 0
+  };
+  return /* @__PURE__ */ f("div", { style: u, children: [
+    /* @__PURE__ */ f("div", { children: [
+      /* @__PURE__ */ n("p", { style: { ...p, fontWeight: t.weight.bold }, children: r }),
+      /* @__PURE__ */ n("p", { style: c, children: i })
+    ] }),
+    /* @__PURE__ */ n("div", { children: /* @__PURE__ */ n(E, { children: o }) }),
+    /* @__PURE__ */ n("div", { children: /* @__PURE__ */ n("p", { style: { ...p, color: l ? e.textPrimary : e.error }, children: l || "(blank)" }) }),
+    /* @__PURE__ */ n("div", { children: /* @__PURE__ */ n("p", { style: { ...p, color: e.textTertiary }, children: s || "—" }) }),
+    /* @__PURE__ */ f("div", { children: [
+      /* @__PURE__ */ f("div", { style: { display: "flex", alignItems: "center", gap: a[2] }, children: [
+        /* @__PURE__ */ n("span", { style: { width: 8, height: 8, borderRadius: "50%", backgroundColor: $[d] } }),
+        /* @__PURE__ */ n("span", { style: { fontSize: t.size.sm, fontWeight: t.weight.semibold, color: $[d] }, children: d === "added" ? "New" : d === "safe" ? "Unchanged" : d.charAt(0).toUpperCase() + d.slice(1) })
+      ] }),
+      g && /* @__PURE__ */ f("p", { style: { fontSize: t.size.xs, color: $[d], marginTop: a[1], marginBottom: 0 }, children: [
+        "⚠ ",
+        g
+      ] })
+    ] })
+  ] });
+}
+function se({ severity: r, field: i, rowCount: o, message: l, fixable: s, onFix: d }) {
+  const [g, u] = C(!1), c = {
+    error: { tone: "error", outline: e.error },
+    warning: { tone: "warning", outline: e.warning },
+    info: { tone: "info", outline: e.info }
+  }[r], y = {
+    padding: a[4],
+    borderBottom: `1px solid ${e.borderSubtle}`,
+    fontFamily: t.fontFamily.base,
+    display: "flex",
+    flexDirection: "column",
+    gap: a[3],
+    backgroundColor: e.white
+  }, h = {
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between"
+  }, x = {
+    display: "flex",
+    alignItems: "center",
+    gap: a[3],
+    flexWrap: "wrap"
+  }, w = {
+    border: `1px solid ${c.outline}`,
+    color: c.outline,
+    padding: `2px ${a[2]}`,
+    borderRadius: m.full,
+    fontSize: t.size.xs,
+    fontWeight: t.weight.medium,
+    backgroundColor: "transparent"
+  };
+  return /* @__PURE__ */ f("div", { style: y, children: [
+    /* @__PURE__ */ f("div", { style: h, children: [
+      /* @__PURE__ */ f("div", { style: x, children: [
+        /* @__PURE__ */ n(Y, { tone: c.tone, dot: !0, children: r.charAt(0).toUpperCase() + r.slice(1) }),
+        /* @__PURE__ */ n(E, { children: i }),
+        /* @__PURE__ */ f("span", { style: w, children: [
+          o.toLocaleString(),
+          " rows affected"
+        ] })
+      ] }),
+      /* @__PURE__ */ n("div", { children: s ? /* @__PURE__ */ n(N, { variant: "primary", size: "sm", onClick: d, children: "Auto-Fix" }) : /* @__PURE__ */ n("span", { style: { fontSize: t.size.sm, color: e.textTertiary }, children: "Manual fix" }) })
+    ] }),
+    /* @__PURE__ */ n("p", { style: { margin: 0, fontSize: t.size.md, color: e.textDark }, children: l }),
+    /* @__PURE__ */ n("div", { children: /* @__PURE__ */ n(
+      "button",
+      {
+        onClick: () => u(!g),
+        style: {
+          background: "none",
+          border: "none",
+          padding: 0,
+          color: e.textSecondary,
+          fontSize: t.size.sm,
+          cursor: "pointer",
+          textDecoration: "underline",
+          fontFamily: t.fontFamily.base
+        },
+        children: g ? "Hide sample rows ▲" : "View sample rows ▼"
+      }
+    ) }),
+    g && /* @__PURE__ */ f("div", { style: { display: "flex", gap: a[2], marginTop: a[1], flexWrap: "wrap" }, children: [
+      [1, 2, 3].map((b) => /* @__PURE__ */ f("span", { style: {
+        fontSize: t.size.xs,
+        border: `1px solid ${e.border}`,
+        padding: `2px ${a[2]}`,
+        borderRadius: m.full,
+        color: e.textSecondary
+      }, children: [
+        "row ",
+        b
+      ] }, b)),
+      o > 3 && /* @__PURE__ */ f("span", { style: { fontSize: t.size.xs, color: e.textTertiary, alignSelf: "center" }, children: [
+        "+ ",
+        o - 3,
+        " more"
+      ] })
+    ] })
+  ] });
+}
+function Ve({ category: r, issues: i, defaultOpen: o = !0 }) {
+  const [l, s] = C(o), d = i.some((b) => b.severity === "error"), g = i.some((b) => b.severity === "warning"), u = d ? e.error : g ? e.warning : e.info, p = i.reduce((b, S) => b + S.rowCount, 0), c = {
+    backgroundColor: e.cardBg,
+    borderRadius: m.lg,
+    border: `1px solid ${e.border}`,
+    marginBottom: a[4],
+    overflow: "hidden",
+    fontFamily: t.fontFamily.base
+  }, y = {
+    padding: a[4],
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    cursor: "pointer",
+    backgroundColor: e.cardBg,
+    borderBottom: l ? `1px solid ${e.border}` : "none",
+    userSelect: "none"
+  }, h = {
+    display: "flex",
+    alignItems: "center",
+    gap: a[3]
+  }, x = {
+    width: 8,
+    height: 8,
+    borderRadius: "50%",
+    backgroundColor: u,
+    flexShrink: 0
+  }, w = {
+    backgroundColor: e.bgSubtle,
+    border: `1px solid ${e.border}`,
+    borderRadius: m.full,
+    padding: `2px ${a[3]}`,
+    fontSize: t.size.sm,
+    color: e.textSecondary,
+    fontWeight: t.weight.medium
+  };
+  return /* @__PURE__ */ f("div", { style: c, children: [
+    /* @__PURE__ */ f("div", { style: y, onClick: () => s(!l), children: [
+      /* @__PURE__ */ f("div", { style: h, children: [
+        /* @__PURE__ */ n("span", { style: x }),
+        /* @__PURE__ */ n("span", { style: { fontSize: t.size.lg, fontWeight: t.weight.bold, color: e.textPrimary }, children: r })
+      ] }),
+      /* @__PURE__ */ f("div", { style: { display: "flex", alignItems: "center", gap: a[3] }, children: [
+        /* @__PURE__ */ f("span", { style: w, children: [
+          p.toLocaleString(),
+          " rows"
+        ] }),
+        /* @__PURE__ */ n("span", { style: {
+          color: e.textTertiary,
+          transform: l ? "rotate(180deg)" : "none",
+          transition: "transform 200ms ease",
+          fontSize: "12px"
+        }, children: "▼" })
+      ] })
+    ] }),
+    l && /* @__PURE__ */ n("div", { style: { display: "flex", flexDirection: "column" }, children: i.map((b, S) => /* @__PURE__ */ n("div", { style: {
+      borderBottom: S === i.length - 1 ? "none" : `1px solid ${e.borderSubtle}`
+    }, children: /* @__PURE__ */ n(se, { ...b }) }, S)) })
+  ] });
+}
+const Oe = z.memo(function({ value: i, label: o, tone: l = "neutral" }) {
+  const d = {
+    success: { border: e.successBorder, color: e.success },
+    error: { border: e.errorBorder, color: e.error },
+    info: { border: e.infoBorder, color: e.info },
+    neutral: { border: e.border, color: e.textPrimary }
+  }[l], g = {
+    display: "flex",
+    flexDirection: "column",
+    gap: a[1],
+    padding: a[4],
+    borderRadius: m.lg,
+    border: `1px solid ${d.border}`,
+    backgroundColor: e.white,
+    fontFamily: t.fontFamily.base,
+    minWidth: "120px",
+    flex: 1
+  }, u = {
+    fontSize: t.size["2xl"],
+    fontWeight: t.weight.bold,
+    color: d.color,
+    margin: 0,
+    lineHeight: 1
+  }, p = {
+    fontSize: t.size.sm,
+    color: l === "neutral" ? e.textSecondary : d.color,
+    margin: 0,
+    marginTop: a[1]
+  };
+  return /* @__PURE__ */ f("div", { style: g, children: [
+    /* @__PURE__ */ n("div", { style: u, children: i }),
+    /* @__PURE__ */ n("div", { style: p, children: o })
+  ] });
+}), Ne = z.memo(function({ name: i }) {
+  const o = {
+    display: "inline-flex",
+    alignItems: "center",
+    padding: `2px ${a[3]}`,
+    backgroundColor: e.neutralBg,
+    color: e.textDark,
+    fontSize: t.size.xs,
+    fontFamily: t.fontFamily.base,
+    fontWeight: t.weight.medium,
+    borderRadius: m.full,
+    whiteSpace: "nowrap"
+  };
+  return /* @__PURE__ */ n("span", { style: o, children: i });
+}), Ue = z.memo(function({ percent: i, height: o = 8 }) {
+  const l = {
+    width: "100%",
+    backgroundColor: e.borderSubtle,
+    borderRadius: m.full,
+    height: `${o}px`,
+    overflow: "hidden"
+  }, s = {
+    width: `${Math.max(0, Math.min(100, i))}%`,
+    backgroundColor: e.black,
+    height: "100%",
+    transition: "width 300ms ease"
+  };
+  return /* @__PURE__ */ n("div", { style: l, role: "progressbar", "aria-valuenow": i, "aria-valuemin": 0, "aria-valuemax": 100, children: /* @__PURE__ */ n("div", { style: s }) });
+});
+function Ke({ steps: r }) {
+  const i = {
+    display: "flex",
+    flexDirection: "column",
+    gap: a[4],
+    fontFamily: t.fontFamily.base
+  };
+  return /* @__PURE__ */ n("div", { style: i, children: r.map((o) => {
+    const l = o.status === "pending", s = o.status === "running", d = o.status === "done", g = {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between",
+      opacity: l ? 0.4 : 1
+    }, u = {
+      display: "flex",
+      alignItems: "center",
+      gap: a[3]
+    }, p = {
+      width: "20px",
+      height: "20px",
+      borderRadius: m.full,
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      backgroundColor: d ? e.success : s ? e.black : e.borderLight,
+      color: e.white,
+      flexShrink: 0
+    };
+    return /* @__PURE__ */ f("div", { style: g, children: [
+      /* @__PURE__ */ f("div", { style: u, children: [
+        /* @__PURE__ */ f("div", { style: p, children: [
+          d && /* @__PURE__ */ n("svg", { width: "12", height: "12", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ n("path", { d: "M2.5 7.5L5.5 10.5L11.5 3.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }),
+          s && /* @__PURE__ */ n("div", { style: { width: 6, height: 6, backgroundColor: e.white, borderRadius: "50%" } })
+        ] }),
+        /* @__PURE__ */ n("span", { style: {
+          fontSize: t.size.md,
+          color: e.textPrimary,
+          fontWeight: s ? t.weight.semibold : t.weight.normal
+        }, children: o.label })
+      ] }),
+      o.value && /* @__PURE__ */ n("span", { style: {
+        fontSize: t.size.sm,
+        color: d ? e.success : e.textTertiary
+      }, children: o.value })
+    ] }, o.id);
+  }) });
+}
+function Xe({
+  checked: r,
+  onChange: i,
+  value: o,
+  name: l,
+  disabled: s = !1,
+  label: d,
+  description: g,
+  id: u
+}) {
+  const [p, c] = C(!1), [y, h] = C(!1), x = z.useId(), w = u || x, b = {
+    display: "flex",
+    alignItems: "flex-start",
+    gap: a[3],
+    opacity: s ? 0.5 : 1,
+    cursor: s ? "not-allowed" : "pointer",
+    fontFamily: t.fontFamily.base
+  }, S = {
+    position: "relative",
+    width: "18px",
+    height: "18px",
+    borderRadius: m.full,
+    border: `1px solid ${r ? e.black : y && !s ? e.textTertiary : e.borderLight}`,
+    backgroundColor: e.white,
+    transition: "border-color 150ms ease, box-shadow 150ms ease",
+    flexShrink: 0,
+    boxShadow: p ? I.focus : "none",
+    outline: "none",
+    marginTop: "1px"
+    // Optical alignment
+  }, k = {
+    position: "absolute",
+    top: "50%",
+    left: "50%",
+    transform: `translate(-50%, -50%) scale(${r ? 1 : 0})`,
+    width: "10px",
+    height: "10px",
+    borderRadius: m.full,
+    backgroundColor: e.black,
+    transition: "transform 150ms ease"
+  }, F = {
+    display: "flex",
+    flexDirection: "column",
+    gap: a[1]
+  }, M = {
+    fontSize: t.size.md,
+    fontWeight: t.weight.medium,
+    color: e.textPrimary,
+    margin: 0,
+    cursor: s ? "not-allowed" : "pointer"
+  }, H = {
+    fontSize: t.size.sm,
+    color: e.textSecondary,
+    margin: 0
+  };
+  return /* @__PURE__ */ f(
+    "label",
+    {
+      style: b,
+      htmlFor: w,
+      onMouseEnter: () => h(!0),
+      onMouseLeave: () => h(!1),
+      children: [
+        /* @__PURE__ */ f("div", { style: { position: "relative" }, children: [
+          /* @__PURE__ */ n(
+            "input",
+            {
+              id: w,
+              type: "radio",
+              name: l,
+              value: o,
+              checked: r,
+              disabled: s,
+              onChange: (P) => {
+                s || i(P.target.checked);
+              },
+              onFocus: () => c(!0),
+              onBlur: () => c(!1),
+              style: {
+                position: "absolute",
+                opacity: 0,
+                width: 0,
+                height: 0,
+                margin: 0
+              }
+            }
+          ),
+          /* @__PURE__ */ n("div", { style: S, "aria-hidden": "true", children: /* @__PURE__ */ n("div", { style: k }) })
+        ] }),
+        (d || g) && /* @__PURE__ */ f("div", { style: F, children: [
+          d && /* @__PURE__ */ n("span", { style: M, children: d }),
+          g && /* @__PURE__ */ n("span", { style: H, children: g })
+        ] })
+      ]
+    }
+  );
+}
+function Ge({ steps: r, current: i }) {
+  const o = {
+    display: "flex",
+    justifyContent: "space-between",
+    width: "100%",
+    fontFamily: t.fontFamily.base,
+    position: "relative"
+  }, l = 32, s = {
+    position: "absolute",
+    top: l / 2 - 1,
+    // center vertically with circles
+    left: l / 2,
+    right: l / 2,
+    height: 2,
+    backgroundColor: e.border,
+    zIndex: 1
+  }, d = {
+    height: "100%",
+    width: `${(Math.min(i, r.length) - 1) / (r.length - 1) * 100}%`,
+    backgroundColor: e.black,
+    transition: "width 300ms ease"
+  };
+  return /* @__PURE__ */ f("div", { style: o, children: [
+    /* @__PURE__ */ n("div", { style: s, children: /* @__PURE__ */ n("div", { style: d }) }),
+    r.map((g, u) => {
+      const p = u + 1, c = p < i, y = p === i, h = {
+        width: l,
+        height: l,
+        borderRadius: "50%",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        fontSize: t.size.md,
+        fontWeight: t.weight.semibold,
+        backgroundColor: c || y ? e.black : e.white,
+        color: c || y ? e.white : e.textTertiary,
+        border: c || y ? `2px solid ${e.black}` : `2px solid ${e.border}`,
+        zIndex: 2,
+        position: "relative",
+        transition: "all 300ms ease"
+      }, x = {
+        position: "absolute",
+        top: l + 8,
+        left: "50%",
+        transform: "translateX(-50%)",
+        fontSize: t.size.sm,
+        color: y || c ? e.textPrimary : e.textTertiary,
+        fontWeight: y ? t.weight.semibold : t.weight.normal,
+        whiteSpace: "nowrap"
+      };
+      return /* @__PURE__ */ f("div", { style: {
+        position: "relative",
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center"
+      }, children: [
+        /* @__PURE__ */ n("div", { style: h, children: c ? /* @__PURE__ */ n("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", children: /* @__PURE__ */ n("path", { d: "M2.5 7.5L5.5 10.5L11.5 3.5", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) : p }),
+        /* @__PURE__ */ n("span", { style: x, children: g })
+      ] }, g);
+    })
+  ] });
+}
+const Ye = z.memo(function({ label: i, value: o, highlight: l = !1, color: s }) {
+  const d = {
+    backgroundColor: l ? e.black : e.white,
+    border: l ? "none" : `1px solid ${e.border}`,
+    borderRadius: m.lg,
+    padding: a[5],
+    display: "flex",
+    flexDirection: "column",
+    gap: a[2],
+    fontFamily: t.fontFamily.base,
+    flex: 1,
+    minWidth: 0
+    // prevents overflow in flex contexts
+  }, g = {
+    fontSize: t.size.sm,
+    color: l ? e.textDisabled : e.textSecondary,
+    fontWeight: t.weight.semibold,
+    textTransform: "uppercase",
+    letterSpacing: "0.05em",
+    margin: 0
+  }, u = {
+    fontSize: t.size["3xl"],
+    fontWeight: t.weight.bold,
+    color: l ? e.white : s || e.textPrimary,
+    margin: 0,
+    lineHeight: 1
+  };
+  return /* @__PURE__ */ f("div", { style: d, children: [
+    /* @__PURE__ */ n("p", { style: g, children: i }),
+    /* @__PURE__ */ n("p", { style: u, children: o })
+  ] });
+});
+function qe({ checked: r, onChange: i, disabled: o = !1, label: l, description: s, id: d }) {
+  const [g, u] = C(!1), p = z.useId(), c = d || p, y = {
+    display: "flex",
+    alignItems: "flex-start",
+    gap: a[3],
+    opacity: o ? 0.5 : 1,
+    cursor: o ? "not-allowed" : "pointer",
+    fontFamily: t.fontFamily.base
+  }, h = {
+    position: "relative",
+    width: "36px",
+    height: "20px",
+    backgroundColor: r ? e.black : e.borderLight,
+    borderRadius: m.full,
+    transition: "background-color 200ms ease",
+    flexShrink: 0,
+    boxShadow: g ? I.focus : "none",
+    outline: "none"
+  }, x = {
+    position: "absolute",
+    top: "2px",
+    left: r ? "calc(100% - 18px)" : "2px",
+    width: "16px",
+    height: "16px",
+    backgroundColor: e.white,
+    borderRadius: m.full,
+    transition: "left 200ms ease, transform 200ms ease",
+    boxShadow: I.sm
+  }, w = {
+    display: "flex",
+    flexDirection: "column",
+    gap: a[1],
+    marginTop: "1px"
+    // Optical alignment with switch thumb
+  }, b = {
+    fontSize: t.size.md,
+    fontWeight: t.weight.medium,
+    color: e.textPrimary,
+    margin: 0,
+    cursor: o ? "not-allowed" : "pointer"
+  }, S = {
+    fontSize: t.size.sm,
+    color: e.textSecondary,
+    margin: 0
+  };
+  return /* @__PURE__ */ f(
+    "label",
+    {
+      style: y,
+      htmlFor: c,
+      onMouseEnter: () => {
+      },
+      children: [
+        /* @__PURE__ */ n(
+          "div",
+          {
+            id: c,
+            role: "switch",
+            "aria-checked": r,
+            "aria-disabled": o,
+            tabIndex: o ? -1 : 0,
+            onKeyDown: (F) => {
+              (F.key === " " || F.key === "Enter") && (F.preventDefault(), o || i(!r));
+            },
+            onFocus: () => u(!0),
+            onBlur: () => u(!1),
+            onClick: (F) => {
+              F.preventDefault(), o || i(!r);
+            },
+            style: h,
+            children: /* @__PURE__ */ n("div", { style: x })
+          }
+        ),
+        (l || s) && /* @__PURE__ */ f("div", { style: w, children: [
+          l && /* @__PURE__ */ n("span", { style: b, children: l }),
+          s && /* @__PURE__ */ n("span", { style: S, children: s })
+        ] })
+      ]
+    }
+  );
+}
+const Je = z.memo(function({ value: i, label: o, suffix: l, inverse: s = !1 }) {
+  const d = i > 0, g = i === 0;
+  let u = e.textTertiary;
+  g || (d ? u = s ? e.error : e.success : u = s ? e.success : e.error);
+  const p = d ? "↑" : g ? "—" : "↓", c = g ? "" : `${d ? "+" : ""}${i}${l ?? ""}`, y = {
+    display: "inline-flex",
+    alignItems: "center",
+    gap: a[1],
+    color: u,
+    fontSize: t.size.sm,
+    fontWeight: t.weight.medium,
+    fontFamily: t.fontFamily.base
+  };
+  return /* @__PURE__ */ f("span", { style: y, children: [
+    /* @__PURE__ */ f("span", { children: [
+      p,
+      " ",
+      c
+    ] }),
+    o && /* @__PURE__ */ n("span", { style: { color: e.textSecondary, fontWeight: t.weight.normal, marginLeft: a[1] }, children: o })
+  ] });
+});
+function _e(r = !1) {
+  const [i, o] = C(r), l = L(() => o(!0), []), s = L(() => o(!1), []), d = L(() => o((g) => !g), []);
+  return { isOpen: i, open: l, close: s, toggle: d };
+}
+function Qe(r, i) {
+  const [o, l] = C(() => {
+    if (typeof window > "u") return i;
+    try {
+      const d = window.localStorage.getItem(r);
+      return d ? JSON.parse(d) : i;
+    } catch {
+      return i;
+    }
+  }), s = L(
+    (d) => {
+      l((g) => {
+        const u = d instanceof Function ? d(g) : d;
+        try {
+          window.localStorage.setItem(r, JSON.stringify(u));
+        } catch {
+        }
+        return u;
+      });
+    },
+    [r]
+  );
+  return [o, s];
+}
+function Ze(...r) {
+  return r.filter(Boolean).join(" ");
+}
+export {
+  He as ActionList,
+  te as AlertIcon,
+  Te as ArrowDownIcon,
+  Be as ArrowLeftIcon,
+  Ie as ArrowRightIcon,
+  Me as ArrowUpIcon,
+  Y as Badge,
+  N as Button,
+  ge as Card,
+  Z as CheckIcon,
+  Ae as CheckRow,
+  We as ChevronDownIcon,
+  Le as ChevronLeftIcon,
+  $e as ChevronRightIcon,
+  De as ChevronUpIcon,
+  E as CodeChip,
+  ye as DataTable,
+  je as DiffRow,
+  Ce as DownloadIcon,
+  A as InfoIcon,
+  he as Input,
+  se as IssueCard,
+  Ve as IssueGroup,
+  Q as LockIcon,
+  we as MenuIcon,
+  Oe as MiniStat,
+  xe as Modal,
+  Ne as ModelTag,
+  Ee as PageHeader,
+  ve as PlayIcon,
+  Ue as ProgressBar,
+  Ke as ProgressList,
+  Xe as Radio,
+  me as ScoreBar,
+  Se as SearchIcon,
+  fe as SectionLabel,
+  Fe as SettingsIcon,
+  ke as StarIcon,
+  ue as StatGrid,
+  Re as StatusDot,
+  Ge as StepBar,
+  Ye as SummaryCard,
+  qe as Switch,
+  pe as TabBar,
+  Pe as Toast,
+  be as ToggleGroup,
+  Je as Trend,
+  ze as UploadIcon,
+  ee as XIcon,
+  e as colors,
+  Ze as cx,
+  m as radii,
+  I as shadows,
+  a as spacing,
+  t as typography,
+  Qe as useLocalStorage,
+  _e as useModal
+};
+//# sourceMappingURL=index.js.map