@usetheo/ui 0.13.0 → 0.13.1

package/dist/chunk-GIXHBTHH.js

@@ -0,0 +1,59 @@
+import { Card } from './chunk-AXNJFBYX.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { TrendingUp, TrendingDown, Minus } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function trendColor(trend, invert) {
+  if (trend === "neutral") return "text-muted-foreground";
+  const isPositive = invert ? trend === "down" : trend === "up";
+  return isPositive ? "text-success" : "text-destructive";
+}
+function TrendIcon({ trend, className }) {
+  if (trend === "up") return /* @__PURE__ */ jsx(TrendingUp, { className: cn("size-3.5", className), "aria-hidden": true });
+  if (trend === "down") return /* @__PURE__ */ jsx(TrendingDown, { className: cn("size-3.5", className), "aria-hidden": true });
+  return /* @__PURE__ */ jsx(Minus, { className: cn("size-3.5", className), "aria-hidden": true });
+}
+var MetricCard = forwardRef(
+  ({ title, value, delta, hint, icon, invertTrend = false, className, ...rest }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      Card,
+      {
+        "data-slot": "metric-card",
+        ref,
+        className: cn("@container/metric-card flex w-full flex-col gap-2 p-4", className),
+        "data-testid": "metric-card",
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+            /* @__PURE__ */ jsx("span", { className: "font-medium text-muted-foreground text-xs uppercase tracking-wide", children: title }),
+            icon !== void 0 && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", "aria-hidden": true, children: icon })
+          ] }),
+          /* @__PURE__ */ jsx("div", { className: "font-semibold @sm/metric-card:text-3xl text-2xl text-foreground tracking-tight", children: value }),
+          (delta !== void 0 || hint !== void 0) && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs", children: [
+            delta !== void 0 && /* @__PURE__ */ jsxs(
+              "span",
+              {
+                className: cn(
+                  "inline-flex items-center gap-1 font-medium",
+                  trendColor(delta.trend, invertTrend)
+                ),
+                "data-trend": delta.trend,
+                children: [
+                  /* @__PURE__ */ jsx(TrendIcon, { trend: delta.trend }),
+                  delta.value
+                ]
+              }
+            ),
+            hint !== void 0 && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: hint })
+          ] })
+        ]
+      }
+    );
+  }
+);
+MetricCard.displayName = "MetricCard";
+
+export { MetricCard };
+//# sourceMappingURL=chunk-GIXHBTHH.js.map
+//# sourceMappingURL=chunk-GIXHBTHH.js.map

package/dist/chunk-GIXHBTHH.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/metric-card/metric-card.tsx"],"names":[],"mappings":";;;;;;AAsDA,SAAS,UAAA,CAAW,OAAwB,MAAA,EAAyB;AACnE,EAAA,IAAI,KAAA,KAAU,WAAW,OAAO,uBAAA;AAChC,EAAA,MAAM,UAAA,GAAa,MAAA,GAAS,KAAA,KAAU,MAAA,GAAS,KAAA,KAAU,IAAA;AACzD,EAAA,OAAO,aAAa,cAAA,GAAiB,kBAAA;AACvC;AAEA,SAAS,SAAA,CAAU,EAAE,KAAA,EAAO,SAAA,EAAU,EAAmD;AACvF,EAAA,IAAI,KAAA,KAAU,IAAA,EAAM,uBAAO,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,EAAA,CAAG,UAAA,EAAY,SAAS,CAAA,EAAG,aAAA,EAAW,IAAA,EAAC,CAAA;AACzF,EAAA,IAAI,KAAA,KAAU,MAAA,EAAQ,uBAAO,GAAA,CAAC,YAAA,EAAA,EAAa,SAAA,EAAW,EAAA,CAAG,UAAA,EAAY,SAAS,CAAA,EAAG,aAAA,EAAW,IAAA,EAAC,CAAA;AAC7F,EAAA,uBAAO,GAAA,CAAC,SAAM,SAAA,EAAW,EAAA,CAAG,YAAY,SAAS,CAAA,EAAG,eAAW,IAAA,EAAC,CAAA;AAClE;AAEO,IAAM,UAAA,GAAa,UAAA;AAAA,EACxB,CAAC,EAAE,KAAA,EAAO,KAAA,EAAO,KAAA,EAAO,IAAA,EAAM,IAAA,EAAM,WAAA,GAAc,KAAA,EAAO,SAAA,EAAW,GAAG,IAAA,IAAQ,GAAA,KAAQ;AACrF,IAAA,uBACE,IAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,WAAA,EAAU,aAAA;AAAA,QACV,GAAA;AAAA,QAQA,SAAA,EAAW,EAAA,CAAG,uDAAA,EAAyD,SAAS,CAAA;AAAA,QAChF,aAAA,EAAY,aAAA;AAAA,QACX,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,wCAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,mEAAA,EACb,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,YACC,IAAA,KAAS,0BACR,GAAA,CAAC,MAAA,EAAA,EAAK,WAAU,uBAAA,EAAwB,aAAA,EAAW,MAChD,QAAA,EAAA,IAAA,EACH;AAAA,WAAA,EAEJ,CAAA;AAAA,0BAEA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gFAAA,EACZ,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,UAAA,CACE,UAAU,MAAA,IAAa,IAAA,KAAS,2BAChC,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,iCAAA,EACZ,QAAA,EAAA;AAAA,YAAA,KAAA,KAAU,MAAA,oBACT,IAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,SAAA,EAAW,EAAA;AAAA,kBACT,4CAAA;AAAA,kBACA,UAAA,CAAW,KAAA,CAAM,KAAA,EAAO,WAAW;AAAA,iBACrC;AAAA,gBACA,cAAY,KAAA,CAAM,KAAA;AAAA,gBAElB,QAAA,EAAA;AAAA,kCAAA,GAAA,CAAC,SAAA,EAAA,EAAU,KAAA,EAAO,KAAA,CAAM,KAAA,EAAO,CAAA;AAAA,kBAC9B,KAAA,CAAM;AAAA;AAAA;AAAA,aACT;AAAA,YAED,SAAS,MAAA,oBAAa,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yBAAyB,QAAA,EAAA,IAAA,EAAK;AAAA,WAAA,EACvE;AAAA;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AACA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-GIXHBTHH.js","sourcesContent":["import { Minus, TrendingDown, TrendingUp } from \"lucide-react\";\nimport { type HTMLAttributes, type ReactNode, forwardRef } from \"react\";\n\nimport { cn } from \"../../../lib/cn.js\";\nimport { Card } from \"../../primitives/card/index.js\";\n\n/**\n * MetricCard — dashboard metric tile (composite).\n *\n * Pattern recurrente \"Card + CardHeader + value + delta + trend icon\" promoted\n * to a first-class composite per ADR-0007 community-best-practices plan.\n *\n * Trend → token mapping (default `invertTrend=false`):\n *   up    → text-success     (positive growth)\n *   down  → text-destructive (negative growth)\n *   neutral → text-muted-foreground\n *\n * EC-17 absorbed: pass `invertTrend` for metrics where \"up is bad\" (cost,\n * churn, latency). The mapping inverts cleanly:\n *   up    → text-destructive (cost growing = bad)\n *   down  → text-success     (cost dropping = good)\n *\n * @example\n *   <MetricCard title=\"Revenue\" value=\"$12,345\" delta={{ value: \"+12%\", trend: \"up\" }} />\n *   <MetricCard title=\"Monthly Cost\" value=\"$3,200\" delta={{ value: \"+18%\", trend: \"up\" }} invertTrend />\n */\n\nexport type MetricCardTrend = \"up\" | \"down\" | \"neutral\";\n\nexport interface MetricCardDelta {\n  /** Display text (e.g., `\"+12%\"`, `\"-3.4 pp\"`, `\"unchanged\"`). */\n  value: string;\n  /** Trend direction — drives icon and color (subject to `invertTrend`). */\n  trend: MetricCardTrend;\n}\n\nexport interface MetricCardProps extends HTMLAttributes<HTMLDivElement> {\n  /** Metric label (e.g., \"Revenue\", \"Active Users\"). */\n  title: string;\n  /** Headline value (e.g., \"$12,345\", \"1,234\"). */\n  value: ReactNode;\n  /** Optional delta with trend direction. */\n  delta?: MetricCardDelta;\n  /** Optional subtle context line below the value (e.g., \"vs last month\"). */\n  hint?: ReactNode;\n  /** Optional icon rendered top-right (e.g., `<DollarSign />`). */\n  icon?: ReactNode;\n  /**\n   * EC-17: invert default trend semantics. Use for Cost / Churn / Latency\n   * metrics where \"up\" is bad. Default `false` (Revenue / Users / Conversions).\n   */\n  invertTrend?: boolean;\n}\n\nfunction trendColor(trend: MetricCardTrend, invert: boolean): string {\n  if (trend === \"neutral\") return \"text-muted-foreground\";\n  const isPositive = invert ? trend === \"down\" : trend === \"up\";\n  return isPositive ? \"text-success\" : \"text-destructive\";\n}\n\nfunction TrendIcon({ trend, className }: { trend: MetricCardTrend; className?: string }) {\n  if (trend === \"up\") return <TrendingUp className={cn(\"size-3.5\", className)} aria-hidden />;\n  if (trend === \"down\") return <TrendingDown className={cn(\"size-3.5\", className)} aria-hidden />;\n  return <Minus className={cn(\"size-3.5\", className)} aria-hidden />;\n}\n\nexport const MetricCard = forwardRef<HTMLDivElement, MetricCardProps>(\n  ({ title, value, delta, hint, icon, invertTrend = false, className, ...rest }, ref) => {\n    return (\n      <Card\n        data-slot=\"metric-card\"\n        ref={ref}\n        // T5.5: `@container/metric-card` makes the tile responsive to its PARENT\n        // width, not the viewport. Consumers can drop multiple cards into any\n        // grid and child elements scale via `@sm:`, `@md:`, `@lg:` variants.\n        // `w-full` is the right default for a tile: consumers always wrap in a\n        // grid/flex parent (grid-cols-N, flex). Without it, the flex-col card\n        // collapses to min-content (~150px) when used in isolation — a real\n        // regression observed in the docs site preview pane.\n        className={cn(\"@container/metric-card flex w-full flex-col gap-2 p-4\", className)}\n        data-testid=\"metric-card\"\n        {...rest}\n      >\n        <div className=\"flex items-start justify-between gap-3\">\n          <span className=\"font-medium text-muted-foreground text-xs uppercase tracking-wide\">\n            {title}\n          </span>\n          {icon !== undefined && (\n            <span className=\"text-muted-foreground\" aria-hidden>\n              {icon}\n            </span>\n          )}\n        </div>\n        {/* Value scales 2xl → 3xl when the card container exceeds 18rem. */}\n        <div className=\"font-semibold @sm/metric-card:text-3xl text-2xl text-foreground tracking-tight\">\n          {value}\n        </div>\n        {(delta !== undefined || hint !== undefined) && (\n          <div className=\"flex items-center gap-2 text-xs\">\n            {delta !== undefined && (\n              <span\n                className={cn(\n                  \"inline-flex items-center gap-1 font-medium\",\n                  trendColor(delta.trend, invertTrend),\n                )}\n                data-trend={delta.trend}\n              >\n                <TrendIcon trend={delta.trend} />\n                {delta.value}\n              </span>\n            )}\n            {hint !== undefined && <span className=\"text-muted-foreground\">{hint}</span>}\n          </div>\n        )}\n      </Card>\n    );\n  },\n);\nMetricCard.displayName = \"MetricCard\";\n"]}

package/dist/chunk-GLEOUWPN.js

@@ -0,0 +1,108 @@
+"use client";
+import { BadgeWithDot } from './chunk-624AATQZ.js';
+import { Button } from './chunk-25KBUQEQ.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { Clock, GitCommit, RotateCcw, ArrowDownLeft } from 'lucide-react';
+import { forwardRef, useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var RollbackUI = forwardRef(
+  ({ className, history, onRollback, ...props }, ref) => {
+    const [confirmId, setConfirmId] = useState(null);
+    const [pendingId, setPendingId] = useState(null);
+    const trigger = async (id) => {
+      setPendingId(id);
+      try {
+        await onRollback?.(id);
+      } finally {
+        setPendingId(null);
+        setConfirmId(null);
+      }
+    };
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-slot": "rollback-ui",
+        ref,
+        className: cn("rounded-xl border bg-card p-5 shadow-sm", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsx("header", { className: "mb-4 flex items-baseline justify-between gap-3", children: /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("h3", { className: "font-display text-title-md tracking-tight", children: "Rollback" }),
+            /* @__PURE__ */ jsx("p", { className: "text-body-sm text-muted-foreground", children: "Instant rollback to a previous version. Verified in under 5 seconds." })
+          ] }) }),
+          /* @__PURE__ */ jsx("ol", { className: "grid gap-2", children: history.map((target, idx) => {
+            const isCurrent = target.isCurrent ?? idx === 0;
+            const isConfirming = confirmId === target.id;
+            const isPending = pendingId === target.id;
+            return /* @__PURE__ */ jsxs(
+              "li",
+              {
+                className: cn(
+                  "grid grid-cols-[auto_1fr_auto] items-center gap-3 rounded-lg border p-3",
+                  isCurrent ? "border-primary/40 bg-primary/5" : "border-border/40 bg-card"
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(
+                    "span",
+                    {
+                      className: cn(
+                        "grid size-8 place-items-center rounded-md",
+                        isCurrent ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground"
+                      ),
+                      "aria-hidden": "true",
+                      children: isCurrent ? /* @__PURE__ */ jsx(Clock, { className: "size-4" }) : /* @__PURE__ */ jsx(GitCommit, { className: "size-4" })
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+                    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+                      /* @__PURE__ */ jsx("span", { className: "font-mono text-code-sm text-foreground", children: target.version }),
+                      isCurrent ? /* @__PURE__ */ jsx(BadgeWithDot, { variant: "success", children: "Current" }) : null,
+                      target.duration ? /* @__PURE__ */ jsxs("span", { className: "font-mono text-code-sm text-muted-foreground", children: [
+                        "\xB7 ",
+                        target.duration
+                      ] }) : null
+                    ] }),
+                    /* @__PURE__ */ jsxs("p", { className: "mt-0.5 truncate text-body-sm text-muted-foreground", children: [
+                      /* @__PURE__ */ jsx("span", { className: "font-mono", children: target.commitSha.slice(0, 7) }),
+                      " \xB7",
+                      " ",
+                      target.commitMessage,
+                      " \xB7 ",
+                      target.deployedAt
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ jsx("div", { children: isCurrent ? null : isConfirming ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+                    /* @__PURE__ */ jsx(
+                      Button,
+                      {
+                        size: "sm",
+                        variant: "ghost",
+                        onClick: () => setConfirmId(null),
+                        disabled: isPending,
+                        children: "Cancel"
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(Button, { size: "sm", onClick: () => trigger(target.id), disabled: isPending, children: [
+                      /* @__PURE__ */ jsx(RotateCcw, {}),
+                      " Confirm rollback"
+                    ] })
+                  ] }) : /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "secondary", onClick: () => setConfirmId(target.id), children: [
+                    /* @__PURE__ */ jsx(ArrowDownLeft, {}),
+                    " Roll back"
+                  ] }) })
+                ]
+              },
+              target.id
+            );
+          }) })
+        ]
+      }
+    );
+  }
+);
+RollbackUI.displayName = "RollbackUI";
+
+export { RollbackUI };
+//# sourceMappingURL=chunk-GLEOUWPN.js.map
+//# sourceMappingURL=chunk-GLEOUWPN.js.map

package/dist/chunk-GLEOUWPN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/rollback-ui/rollback-ui.tsx"],"names":[],"mappings":"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","file":"chunk-GLEOUWPN.js","sourcesContent":["\"use client\";\n\nimport { ArrowDownLeft, Clock, GitCommit, RotateCcw } from \"lucide-react\";\nimport { forwardRef, useState } from \"react\";\nimport type { HTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport { Badge } from \"../../primitives/badge/index.js\";\nimport { Button } from \"../../primitives/button/index.js\";\n\nexport interface RollbackTarget {\n  id: string;\n  version: string;\n  commitSha: string;\n  commitMessage: string;\n  deployedAt: string;\n  isCurrent?: boolean;\n  /**\n   * Optional duration of the deploy (e.g. \"24s\") for context.\n   */\n  duration?: string;\n}\n\ninterface RollbackUIProps extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * Deployment history, newest first. The current deploy should have `isCurrent: true`.\n   */\n  history: RollbackTarget[];\n  /**\n   * Fires when user confirms rollback to a specific target.\n   */\n  onRollback?: (targetId: string) => void | Promise<void>;\n}\n\n/**\n * RollbackUI — instant rollback selector showing recent versions.\n *\n * The current deploy is marked, every other version offers a \"Roll back\" button.\n * On select, the row enters confirm state (Confirm / Cancel buttons inline) before\n * firing onRollback. This protects against accidental rollbacks while still being one click.\n */\nconst RollbackUI = forwardRef<HTMLDivElement, RollbackUIProps>(\n  ({ className, history, onRollback, ...props }, ref) => {\n    const [confirmId, setConfirmId] = useState<string | null>(null);\n    const [pendingId, setPendingId] = useState<string | null>(null);\n\n    const trigger = async (id: string) => {\n      setPendingId(id);\n      try {\n        await onRollback?.(id);\n      } finally {\n        setPendingId(null);\n        setConfirmId(null);\n      }\n    };\n\n    return (\n      <div\n        data-slot=\"rollback-ui\"\n        ref={ref}\n        className={cn(\"rounded-xl border bg-card p-5 shadow-sm\", className)}\n        {...props}\n      >\n        <header className=\"mb-4 flex items-baseline justify-between gap-3\">\n          <div>\n            <h3 className=\"font-display text-title-md tracking-tight\">Rollback</h3>\n            <p className=\"text-body-sm text-muted-foreground\">\n              Instant rollback to a previous version. Verified in under 5 seconds.\n            </p>\n          </div>\n        </header>\n\n        <ol className=\"grid gap-2\">\n          {history.map((target, idx) => {\n            const isCurrent = target.isCurrent ?? idx === 0;\n            const isConfirming = confirmId === target.id;\n            const isPending = pendingId === target.id;\n            return (\n              <li\n                key={target.id}\n                className={cn(\n                  \"grid grid-cols-[auto_1fr_auto] items-center gap-3 rounded-lg border p-3\",\n                  isCurrent ? \"border-primary/40 bg-primary/5\" : \"border-border/40 bg-card\",\n                )}\n              >\n                <span\n                  className={cn(\n                    \"grid size-8 place-items-center rounded-md\",\n                    isCurrent\n                      ? \"bg-primary text-primary-foreground\"\n                      : \"bg-muted text-muted-foreground\",\n                  )}\n                  aria-hidden=\"true\"\n                >\n                  {isCurrent ? <Clock className=\"size-4\" /> : <GitCommit className=\"size-4\" />}\n                </span>\n                <div className=\"min-w-0\">\n                  <div className=\"flex flex-wrap items-center gap-2\">\n                    <span className=\"font-mono text-code-sm text-foreground\">{target.version}</span>\n                    {isCurrent ? <Badge variant=\"success\">Current</Badge> : null}\n                    {target.duration ? (\n                      <span className=\"font-mono text-code-sm text-muted-foreground\">\n                        · {target.duration}\n                      </span>\n                    ) : null}\n                  </div>\n                  <p className=\"mt-0.5 truncate text-body-sm text-muted-foreground\">\n                    <span className=\"font-mono\">{target.commitSha.slice(0, 7)}</span> ·{\" \"}\n                    {target.commitMessage} · {target.deployedAt}\n                  </p>\n                </div>\n                <div>\n                  {isCurrent ? null : isConfirming ? (\n                    <div className=\"flex items-center gap-1\">\n                      <Button\n                        size=\"sm\"\n                        variant=\"ghost\"\n                        onClick={() => setConfirmId(null)}\n                        disabled={isPending}\n                      >\n                        Cancel\n                      </Button>\n                      <Button size=\"sm\" onClick={() => trigger(target.id)} disabled={isPending}>\n                        <RotateCcw /> Confirm rollback\n                      </Button>\n                    </div>\n                  ) : (\n                    <Button size=\"sm\" variant=\"secondary\" onClick={() => setConfirmId(target.id)}>\n                      <ArrowDownLeft /> Roll back\n                    </Button>\n                  )}\n                </div>\n              </li>\n            );\n          })}\n        </ol>\n      </div>\n    );\n  },\n);\nRollbackUI.displayName = \"RollbackUI\";\n\nexport { RollbackUI };\n"]}

package/dist/chunk-GLRUM43F.js

@@ -0,0 +1,121 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { Globe, Pencil, Trash2 } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var SCOPE_LABEL = {
+  global: "Global",
+  project: "Project"
+};
+var SCOPE_CLASS = {
+  global: "bg-primary/15 text-primary",
+  project: "bg-accent/15 text-accent"
+};
+var RuleCard = forwardRef(
+  ({ className, rule, onSelect, onEdit, onDelete, onToggle, ...props }, ref) => {
+    const handleEdit = (e) => {
+      e.stopPropagation();
+      (onEdit ?? onSelect)?.(rule.id);
+    };
+    const handleDelete = (e) => {
+      e.stopPropagation();
+      onDelete?.(rule.id);
+    };
+    const handleToggle = (e) => {
+      e.stopPropagation();
+      onToggle?.(rule.id, rule.state === "enabled" ? "disabled" : "enabled");
+    };
+    return /* @__PURE__ */ jsxs(
+      "article",
+      {
+        "data-slot": "rule-card",
+        ref,
+        className: cn(
+          "grid gap-2 rounded-lg border border-border/40 bg-card/40 p-3",
+          "transition-colors duration-base ease-out-soft",
+          onSelect && "cursor-pointer hover:border-border hover:bg-card/70",
+          rule.state === "disabled" && "opacity-60",
+          className
+        ),
+        onClick: onSelect ? () => onSelect(rule.id) : void 0,
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("header", { className: "flex items-start gap-2", children: [
+            /* @__PURE__ */ jsx("h4", { className: "flex-1 truncate font-display text-foreground text-title-md tracking-tight", children: rule.title }),
+            /* @__PURE__ */ jsxs(
+              "span",
+              {
+                className: cn(
+                  "inline-flex h-5 shrink-0 items-center gap-1 rounded-md px-2 font-medium font-mono text-label tracking-tight",
+                  SCOPE_CLASS[rule.scope]
+                ),
+                children: [
+                  /* @__PURE__ */ jsx(Globe, { className: "size-3", "aria-hidden": "true" }),
+                  " ",
+                  SCOPE_LABEL[rule.scope]
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx("p", { className: "line-clamp-2 text-body-sm text-muted-foreground", children: rule.body }),
+          /* @__PURE__ */ jsxs("footer", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-1", children: [
+              rule.tags?.map((t) => /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: "inline-flex h-4 items-center rounded bg-muted px-1.5 font-mono text-label-caps text-muted-foreground uppercase tracking-wider",
+                  children: t
+                },
+                t
+              )),
+              rule.updatedAt ? /* @__PURE__ */ jsxs("span", { className: "font-mono text-label text-muted-foreground tabular-nums", children: [
+                "\xB7 ",
+                rule.updatedAt
+              ] }) : null
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+              onToggle ? /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: handleToggle,
+                  "aria-label": rule.state === "enabled" ? "Disable rule" : "Enable rule",
+                  className: cn(
+                    "inline-flex h-6 items-center rounded-full px-2 font-mono text-label",
+                    rule.state === "enabled" ? "bg-success/15 text-success" : "bg-muted text-muted-foreground"
+                  ),
+                  children: rule.state === "enabled" ? "Enabled" : "Disabled"
+                }
+              ) : null,
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: handleEdit,
+                  "aria-label": "Edit rule",
+                  className: "grid size-6 place-items-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground",
+                  children: /* @__PURE__ */ jsx(Pencil, { className: "size-3.5" })
+                }
+              ),
+              onDelete ? /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: handleDelete,
+                  "aria-label": "Delete rule",
+                  className: "grid size-6 place-items-center rounded-md text-muted-foreground hover:bg-destructive/10 hover:text-destructive",
+                  children: /* @__PURE__ */ jsx(Trash2, { className: "size-3.5" })
+                }
+              ) : null
+            ] })
+          ] })
+        ]
+      }
+    );
+  }
+);
+RuleCard.displayName = "RuleCard";
+
+export { RuleCard };
+//# sourceMappingURL=chunk-GLRUM43F.js.map
+//# sourceMappingURL=chunk-GLRUM43F.js.map

package/dist/chunk-GLRUM43F.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/rule-card/rule-card.tsx"],"names":[],"mappings":"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","file":"chunk-GLRUM43F.js","sourcesContent":["import { Globe, Pencil, Trash2 } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { HTMLAttributes, MouseEvent } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport type { Rule, RuleScope, RuleState } from \"../../../types/rule.js\";\n\n/**\n * RuleCard — single Rule row in the Rules list. Renders title, scope/state\n * badges, optional tag chips, a truncated body preview, and edit/toggle/delete\n * actions in the corner.\n */\n\nconst SCOPE_LABEL: Record<RuleScope, string> = {\n  global: \"Global\",\n  project: \"Project\",\n};\n\nconst SCOPE_CLASS: Record<RuleScope, string> = {\n  global: \"bg-primary/15 text-primary\",\n  project: \"bg-accent/15 text-accent\",\n};\n\ninterface RuleCardProps\n  extends Omit<HTMLAttributes<HTMLElement>, \"title\" | \"onSelect\" | \"onToggle\"> {\n  rule: Rule;\n  /** Click on the card body — typically opens detail/edit view. */\n  onSelect?: (id: string) => void;\n  /** Click on the edit pencil. Defaults to onSelect if omitted. */\n  onEdit?: (id: string) => void;\n  /** Click on the trash icon. Renders the icon only when provided. */\n  onDelete?: (id: string) => void;\n  /** Toggle enabled/disabled. Renders the switch-like dot only when provided. */\n  onToggle?: (id: string, next: RuleState) => void;\n}\n\nconst RuleCard = forwardRef<HTMLElement, RuleCardProps>(\n  ({ className, rule, onSelect, onEdit, onDelete, onToggle, ...props }, ref) => {\n    const handleEdit = (e: MouseEvent) => {\n      e.stopPropagation();\n      (onEdit ?? onSelect)?.(rule.id);\n    };\n    const handleDelete = (e: MouseEvent) => {\n      e.stopPropagation();\n      onDelete?.(rule.id);\n    };\n    const handleToggle = (e: MouseEvent) => {\n      e.stopPropagation();\n      onToggle?.(rule.id, rule.state === \"enabled\" ? \"disabled\" : \"enabled\");\n    };\n    return (\n      <article\n        data-slot=\"rule-card\"\n        ref={ref}\n        className={cn(\n          \"grid gap-2 rounded-lg border border-border/40 bg-card/40 p-3\",\n          \"transition-colors duration-base ease-out-soft\",\n          onSelect && \"cursor-pointer hover:border-border hover:bg-card/70\",\n          rule.state === \"disabled\" && \"opacity-60\",\n          className,\n        )}\n        onClick={onSelect ? () => onSelect(rule.id) : undefined}\n        {...props}\n      >\n        <header className=\"flex items-start gap-2\">\n          <h4 className=\"flex-1 truncate font-display text-foreground text-title-md tracking-tight\">\n            {rule.title}\n          </h4>\n          <span\n            className={cn(\n              \"inline-flex h-5 shrink-0 items-center gap-1 rounded-md px-2 font-medium font-mono text-label tracking-tight\",\n              SCOPE_CLASS[rule.scope],\n            )}\n          >\n            <Globe className=\"size-3\" aria-hidden=\"true\" /> {SCOPE_LABEL[rule.scope]}\n          </span>\n        </header>\n        <p className=\"line-clamp-2 text-body-sm text-muted-foreground\">{rule.body}</p>\n        <footer className=\"flex items-center justify-between gap-2\">\n          <div className=\"flex flex-wrap items-center gap-1\">\n            {rule.tags?.map((t) => (\n              <span\n                key={t}\n                className=\"inline-flex h-4 items-center rounded bg-muted px-1.5 font-mono text-label-caps text-muted-foreground uppercase tracking-wider\"\n              >\n                {t}\n              </span>\n            ))}\n            {rule.updatedAt ? (\n              <span className=\"font-mono text-label text-muted-foreground tabular-nums\">\n                · {rule.updatedAt}\n              </span>\n            ) : null}\n          </div>\n          <div className=\"flex items-center gap-1\">\n            {onToggle ? (\n              <button\n                type=\"button\"\n                onClick={handleToggle}\n                aria-label={rule.state === \"enabled\" ? \"Disable rule\" : \"Enable rule\"}\n                className={cn(\n                  \"inline-flex h-6 items-center rounded-full px-2 font-mono text-label\",\n                  rule.state === \"enabled\"\n                    ? \"bg-success/15 text-success\"\n                    : \"bg-muted text-muted-foreground\",\n                )}\n              >\n                {rule.state === \"enabled\" ? \"Enabled\" : \"Disabled\"}\n              </button>\n            ) : null}\n            <button\n              type=\"button\"\n              onClick={handleEdit}\n              aria-label=\"Edit rule\"\n              className=\"grid size-6 place-items-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground\"\n            >\n              <Pencil className=\"size-3.5\" />\n            </button>\n            {onDelete ? (\n              <button\n                type=\"button\"\n                onClick={handleDelete}\n                aria-label=\"Delete rule\"\n                className=\"grid size-6 place-items-center rounded-md text-muted-foreground hover:bg-destructive/10 hover:text-destructive\"\n              >\n                <Trash2 className=\"size-3.5\" />\n              </button>\n            ) : null}\n          </div>\n        </footer>\n      </article>\n    );\n  },\n);\nRuleCard.displayName = \"RuleCard\";\n\nexport { RuleCard };\n"]}

package/dist/chunk-H3L7WZDZ.js

@@ -0,0 +1,74 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { PauseCircle, XCircle, AlertCircle, CheckCircle2, Loader2, Clock } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var STATUS_META = {
+  queued: {
+    icon: Clock,
+    label: "Queued",
+    className: "border-border bg-muted text-muted-foreground"
+  },
+  in_progress: {
+    icon: Loader2,
+    label: "In progress",
+    className: "border-primary/40 bg-primary/10 text-primary",
+    spin: true
+  },
+  finished: {
+    icon: CheckCircle2,
+    label: "Done",
+    className: "border-success/40 bg-success/10 text-success"
+  },
+  error: {
+    icon: AlertCircle,
+    label: "Error",
+    className: "border-destructive/40 bg-destructive/10 text-destructive"
+  },
+  cancelled: {
+    icon: XCircle,
+    label: "Cancelled",
+    className: "border-border bg-muted text-muted-foreground"
+  },
+  interrupted: {
+    icon: PauseCircle,
+    label: "Interrupted",
+    className: "border-warning/40 bg-warning/10 text-warning"
+  }
+};
+var RunStatusPill = forwardRef(
+  ({ status, detail, className, "data-testid": dataTestId, ...rest }, ref) => {
+    const meta = STATUS_META[status];
+    const Icon = meta.icon;
+    return /* @__PURE__ */ jsxs(
+      "span",
+      {
+        "data-slot": "run-status-pill",
+        ref,
+        role: "status",
+        "aria-live": "polite",
+        className: cn(
+          "inline-flex items-center gap-1.5 rounded-full border px-2 py-0.5 font-medium text-xs",
+          meta.className,
+          className
+        ),
+        "data-testid": dataTestId ?? "run-status-pill",
+        "data-status": status,
+        ...rest,
+        children: [
+          /* @__PURE__ */ jsx(Icon, { className: cn("size-3", meta.spin && "animate-spin"), "aria-hidden": true }),
+          /* @__PURE__ */ jsx("span", { children: meta.label }),
+          detail !== void 0 && detail.length > 0 && /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground", "data-testid": "run-status-detail", children: [
+            " \xB7 ",
+            detail
+          ] })
+        ]
+      }
+    );
+  }
+);
+RunStatusPill.displayName = "RunStatusPill";
+
+export { RunStatusPill };
+//# sourceMappingURL=chunk-H3L7WZDZ.js.map
+//# sourceMappingURL=chunk-H3L7WZDZ.js.map

package/dist/chunk-H3L7WZDZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/run-status-pill/run-status-pill.tsx"],"names":[],"mappings":";;;;;AAwCA,IAAM,WAAA,GAA6C;AAAA,EACjD,MAAA,EAAQ;AAAA,IACN,IAAA,EAAM,KAAA;AAAA,IACN,KAAA,EAAO,QAAA;AAAA,IACP,SAAA,EAAW;AAAA,GACb;AAAA,EACA,WAAA,EAAa;AAAA,IACX,IAAA,EAAM,OAAA;AAAA,IACN,KAAA,EAAO,aAAA;AAAA,IACP,SAAA,EAAW,8CAAA;AAAA,IACX,IAAA,EAAM;AAAA,GACR;AAAA,EACA,QAAA,EAAU;AAAA,IACR,IAAA,EAAM,YAAA;AAAA,IACN,KAAA,EAAO,MAAA;AAAA,IACP,SAAA,EAAW;AAAA,GACb;AAAA,EACA,KAAA,EAAO;AAAA,IACL,IAAA,EAAM,WAAA;AAAA,IACN,KAAA,EAAO,OAAA;AAAA,IACP,SAAA,EAAW;AAAA,GACb;AAAA,EACA,SAAA,EAAW;AAAA,IACT,IAAA,EAAM,OAAA;AAAA,IACN,KAAA,EAAO,WAAA;AAAA,IACP,SAAA,EAAW;AAAA,GACb;AAAA,EACA,WAAA,EAAa;AAAA,IACX,IAAA,EAAM,WAAA;AAAA,IACN,KAAA,EAAO,aAAA;AAAA,IACP,SAAA,EAAW;AAAA;AAEf,CAAA;AAEO,IAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,CAAC,EAAE,MAAA,EAAQ,MAAA,EAAQ,SAAA,EAAW,eAAe,UAAA,EAAY,GAAG,IAAA,EAAK,EAAG,GAAA,KAAQ;AAC1E,IAAA,MAAM,IAAA,GAAO,YAAY,MAAM,CAAA;AAC/B,IAAA,MAAM,OAAO,IAAA,CAAK,IAAA;AAClB,IAAA,uBACE,IAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,WAAA,EAAU,iBAAA;AAAA,QACV,GAAA;AAAA,QAEA,IAAA,EAAK,QAAA;AAAA,QACL,WAAA,EAAU,QAAA;AAAA,QACV,SAAA,EAAW,EAAA;AAAA,UACT,sFAAA;AAAA,UACA,IAAA,CAAK,SAAA;AAAA,UACL;AAAA,SACF;AAAA,QACA,eAAa,UAAA,IAAc,iBAAA;AAAA,QAC3B,aAAA,EAAa,MAAA;AAAA,QACZ,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,WAAW,EAAA,CAAG,QAAA,EAAU,KAAK,IAAA,IAAQ,cAAc,CAAA,EAAG,aAAA,EAAW,IAAA,EAAC,CAAA;AAAA,0BACxE,GAAA,CAAC,MAAA,EAAA,EAAM,QAAA,EAAA,IAAA,CAAK,KAAA,EAAM,CAAA;AAAA,UACjB,MAAA,KAAW,MAAA,IAAa,MAAA,CAAO,MAAA,GAAS,CAAA,yBACtC,MAAA,EAAA,EAAK,SAAA,EAAU,uBAAA,EAAwB,aAAA,EAAY,mBAAA,EACjD,QAAA,EAAA;AAAA,YAAA,QAAA;AAAA,YACA;AAAA,WAAA,EACH;AAAA;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AACA,aAAA,CAAc,WAAA,GAAc,eAAA","file":"chunk-H3L7WZDZ.js","sourcesContent":["import {\n  AlertCircle,\n  CheckCircle2,\n  Clock,\n  Loader2,\n  type LucideIcon,\n  PauseCircle,\n  XCircle,\n} from \"lucide-react\";\nimport { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * RunStatusPill — compact status indicator for Run/Task lifecycle states.\n * Mirrors OpenClaw's `Run status: In progress | Done | Interrupted` pill.\n * Closed enum mirrors SDK `Task` state (D362).\n */\n\nexport type RunStatus =\n  | \"queued\"\n  | \"in_progress\"\n  | \"finished\"\n  | \"error\"\n  | \"cancelled\"\n  | \"interrupted\";\n\nexport interface RunStatusPillProps extends Omit<HTMLAttributes<HTMLSpanElement>, \"title\"> {\n  status: RunStatus;\n  detail?: string;\n  \"data-testid\"?: string;\n}\n\ninterface StatusMeta {\n  icon: LucideIcon;\n  label: string;\n  className: string;\n  spin?: boolean;\n}\n\nconst STATUS_META: Record<RunStatus, StatusMeta> = {\n  queued: {\n    icon: Clock,\n    label: \"Queued\",\n    className: \"border-border bg-muted text-muted-foreground\",\n  },\n  in_progress: {\n    icon: Loader2,\n    label: \"In progress\",\n    className: \"border-primary/40 bg-primary/10 text-primary\",\n    spin: true,\n  },\n  finished: {\n    icon: CheckCircle2,\n    label: \"Done\",\n    className: \"border-success/40 bg-success/10 text-success\",\n  },\n  error: {\n    icon: AlertCircle,\n    label: \"Error\",\n    className: \"border-destructive/40 bg-destructive/10 text-destructive\",\n  },\n  cancelled: {\n    icon: XCircle,\n    label: \"Cancelled\",\n    className: \"border-border bg-muted text-muted-foreground\",\n  },\n  interrupted: {\n    icon: PauseCircle,\n    label: \"Interrupted\",\n    className: \"border-warning/40 bg-warning/10 text-warning\",\n  },\n};\n\nexport const RunStatusPill = forwardRef<HTMLSpanElement, RunStatusPillProps>(\n  ({ status, detail, className, \"data-testid\": dataTestId, ...rest }, ref) => {\n    const meta = STATUS_META[status];\n    const Icon = meta.icon;\n    return (\n      <span\n        data-slot=\"run-status-pill\"\n        ref={ref}\n        // biome-ignore lint/a11y/useSemanticElements: inline status badge — <span role=\"status\"> keeps it phrasing-content compatible inside chat headers and table cells, where the implicit <output> placement would break layout\n        role=\"status\"\n        aria-live=\"polite\"\n        className={cn(\n          \"inline-flex items-center gap-1.5 rounded-full border px-2 py-0.5 font-medium text-xs\",\n          meta.className,\n          className,\n        )}\n        data-testid={dataTestId ?? \"run-status-pill\"}\n        data-status={status}\n        {...rest}\n      >\n        <Icon className={cn(\"size-3\", meta.spin && \"animate-spin\")} aria-hidden />\n        <span>{meta.label}</span>\n        {detail !== undefined && detail.length > 0 && (\n          <span className=\"text-muted-foreground\" data-testid=\"run-status-detail\">\n            {\" · \"}\n            {detail}\n          </span>\n        )}\n      </span>\n    );\n  },\n);\nRunStatusPill.displayName = \"RunStatusPill\";\n"]}

package/dist/chunk-H55WXDME.js

@@ -0,0 +1,45 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var LoginSplit = forwardRef(
+  ({ className, left, right, footer, reverse, ...props }, ref) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-slot": "login-split",
+      ref,
+      className: cn("flex min-h-screen flex-col bg-background", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "grid flex-1 grid-cols-1 lg:grid-cols-2",
+              reverse && "lg:[&>*:first-child]:order-2"
+            ),
+            children: [
+              /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center px-6 py-12 lg:px-12", children: /* @__PURE__ */ jsx("div", { className: "w-full max-w-md", children: left }) }),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "relative flex items-center justify-center px-6 py-12 lg:px-12",
+                    "bg-dotted-violet bg-muted/60"
+                  ),
+                  children: /* @__PURE__ */ jsx("div", { className: "w-full max-w-lg", children: right })
+                }
+              )
+            ]
+          }
+        ),
+        footer ? /* @__PURE__ */ jsx("footer", { className: "border-border/40 border-t px-6 py-3 text-center text-body-sm text-muted-foreground", children: footer }) : null
+      ]
+    }
+  )
+);
+LoginSplit.displayName = "LoginSplit";
+
+export { LoginSplit };
+//# sourceMappingURL=chunk-H55WXDME.js.map
+//# sourceMappingURL=chunk-H55WXDME.js.map

package/dist/chunk-H55WXDME.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/login-split/login-split.tsx"],"names":[],"mappings":";;;;AA0BA,IAAM,UAAA,GAAa,UAAA;AAAA,EACjB,CAAC,EAAE,SAAA,EAAW,IAAA,EAAM,KAAA,EAAO,QAAQ,OAAA,EAAS,GAAG,KAAA,EAAM,EAAG,GAAA,qBACtD,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,aAAA;AAAA,MACV,GAAA;AAAA,MACA,SAAA,EAAW,EAAA,CAAG,0CAAA,EAA4C,SAAS,CAAA;AAAA,MAClE,GAAG,KAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,IAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,EAAA;AAAA,cACT,wCAAA;AAAA,cACA,OAAA,IAAW;AAAA,aACb;AAAA,YAEA,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,KAAA,EAAA,EAAI,WAAU,sDAAA,EACb,QAAA,kBAAA,GAAA,CAAC,SAAI,SAAA,EAAU,iBAAA,EAAmB,gBAAK,CAAA,EACzC,CAAA;AAAA,8BACA,GAAA;AAAA,gBAAC,KAAA;AAAA,gBAAA;AAAA,kBACC,SAAA,EAAW,EAAA;AAAA,oBACT,+DAAA;AAAA,oBACA;AAAA,mBACF;AAAA,kBAEA,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iBAAA,EAAmB,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAC1C;AAAA;AAAA,SACF;AAAA,QACC,yBACC,GAAA,CAAC,QAAA,EAAA,EAAO,SAAA,EAAU,oFAAA,EACf,kBACH,CAAA,GACE;AAAA;AAAA;AAAA;AAGV;AACA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-H55WXDME.js","sourcesContent":["import { forwardRef } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\ninterface LoginSplitProps extends HTMLAttributes<HTMLDivElement> {\n  /** Left pane content — form, brand, etc. */\n  left: ReactNode;\n  /** Right pane content — illustration, marketing, social proof. */\n  right: ReactNode;\n  /**\n   * Optional footer rendered below both panes.\n   */\n  footer?: ReactNode;\n  /**\n   * Reverse the split (form on the right). Default = form left.\n   */\n  reverse?: boolean;\n}\n\n/**\n * LoginSplit — 50/50 split layout shell.\n *\n * Used for the auth flow. Two slots (`left`, `right`); the right pane has a\n * subtle violet wash so the illustration sits inside Theo identity. Mobile\n * collapses to single column.\n */\nconst LoginSplit = forwardRef<HTMLDivElement, LoginSplitProps>(\n  ({ className, left, right, footer, reverse, ...props }, ref) => (\n    <div\n      data-slot=\"login-split\"\n      ref={ref}\n      className={cn(\"flex min-h-screen flex-col bg-background\", className)}\n      {...props}\n    >\n      <div\n        className={cn(\n          \"grid flex-1 grid-cols-1 lg:grid-cols-2\",\n          reverse && \"lg:[&>*:first-child]:order-2\",\n        )}\n      >\n        <div className=\"flex items-center justify-center px-6 py-12 lg:px-12\">\n          <div className=\"w-full max-w-md\">{left}</div>\n        </div>\n        <div\n          className={cn(\n            \"relative flex items-center justify-center px-6 py-12 lg:px-12\",\n            \"bg-dotted-violet bg-muted/60\",\n          )}\n        >\n          <div className=\"w-full max-w-lg\">{right}</div>\n        </div>\n      </div>\n      {footer ? (\n        <footer className=\"border-border/40 border-t px-6 py-3 text-center text-body-sm text-muted-foreground\">\n          {footer}\n        </footer>\n      ) : null}\n    </div>\n  ),\n);\nLoginSplit.displayName = \"LoginSplit\";\n\nexport { LoginSplit };\n"]}

package/dist/chunk-H5QPJNVD.js

@@ -0,0 +1,98 @@
+"use client";
+import { cn } from './chunk-EWDN56AS.js';
+import { Sparkles, RotateCcw } from 'lucide-react';
+import { forwardRef, useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var SystemPromptEditor = forwardRef(
+  ({
+    className,
+    defaultPrompt,
+    override,
+    onOverrideChange,
+    tokenEstimate,
+    title = "System prompt",
+    ...props
+  }, ref) => {
+    const usingOverride = override.length > 0;
+    const [showDefault, setShowDefault] = useState(false);
+    return /* @__PURE__ */ jsxs(
+      "section",
+      {
+        "data-slot": "system-prompt-editor",
+        ref,
+        className: cn("rounded-xl border bg-card", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("header", { className: "flex items-center justify-between gap-3 border-border/40 border-b px-4 py-3", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx(Sparkles, { className: "size-4 text-primary", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsx("h3", { className: "font-display text-title-md tracking-tight", children: title }),
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: cn(
+                    "inline-flex items-center rounded-full border px-2 py-0.5 font-mono text-label uppercase tracking-wider",
+                    usingOverride ? "border-primary/40 bg-primary/10 text-primary" : "border-border/40 bg-muted text-muted-foreground"
+                  ),
+                  children: usingOverride ? "Override active" : "Vendor default"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              tokenEstimate !== void 0 ? /* @__PURE__ */ jsxs("span", { className: "font-mono text-label text-muted-foreground tabular-nums", children: [
+                "~",
+                tokenEstimate.toLocaleString(),
+                " tokens"
+              ] }) : null,
+              /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => setShowDefault((v) => !v),
+                  className: "rounded-md px-2 py-1 font-mono text-label text-muted-foreground hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                  children: [
+                    showDefault ? "Hide" : "Show",
+                    " default"
+                  ]
+                }
+              ),
+              usingOverride ? /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => onOverrideChange(""),
+                  className: "inline-flex items-center gap-1 rounded-md px-2 py-1 font-mono text-label text-muted-foreground hover:bg-muted hover:text-destructive focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                  children: [
+                    /* @__PURE__ */ jsx(RotateCcw, { className: "size-3" }),
+                    " Reset"
+                  ]
+                }
+              ) : null
+            ] })
+          ] }),
+          showDefault ? /* @__PURE__ */ jsx("pre", { className: "max-h-48 overflow-auto border-border/40 border-b bg-muted/40 px-4 py-3 font-mono text-code-sm text-muted-foreground", children: defaultPrompt }) : null,
+          /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              value: override,
+              onChange: (e) => onOverrideChange(e.target.value),
+              placeholder: usingOverride ? "" : "Leave empty to use the vendor default. Type here to override.",
+              rows: 8,
+              className: cn(
+                "w-full resize-y bg-transparent px-4 py-3 font-mono text-code-md text-foreground",
+                "placeholder:text-muted-foreground",
+                "focus:outline-none"
+              )
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+SystemPromptEditor.displayName = "SystemPromptEditor";
+
+export { SystemPromptEditor };
+//# sourceMappingURL=chunk-H5QPJNVD.js.map
+//# sourceMappingURL=chunk-H5QPJNVD.js.map

package/dist/chunk-H5QPJNVD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/system-prompt-editor/system-prompt-editor.tsx"],"names":[],"mappings":"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","file":"chunk-H5QPJNVD.js","sourcesContent":["\"use client\";\n\nimport { RotateCcw, Sparkles } from \"lucide-react\";\nimport { forwardRef, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\ninterface SystemPromptEditorProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\"> {\n  /** Vendor / default system prompt (read-only). */\n  defaultPrompt: string;\n  /** Current override; pass empty string for \"use default\". */\n  override: string;\n  onOverrideChange: (next: string) => void;\n  /** Approximate token count for the active prompt. */\n  tokenEstimate?: number;\n  title?: ReactNode;\n}\n\n/**\n * SystemPromptEditor — surface the agent's system prompt with a clear\n * \"vendor default\" vs \"user override\" toggle.\n *\n * Behavior:\n *   - When override is empty, the textarea shows the default (greyed out,\n *     editable starts blank).\n *   - When user types, override takes effect.\n *   - \"Reset to default\" wipes the override.\n *\n * Critical for transparency: a user must be able to see and edit the prompt.\n */\nconst SystemPromptEditor = forwardRef<HTMLDivElement, SystemPromptEditorProps>(\n  (\n    {\n      className,\n      defaultPrompt,\n      override,\n      onOverrideChange,\n      tokenEstimate,\n      title = \"System prompt\",\n      ...props\n    },\n    ref,\n  ) => {\n    const usingOverride = override.length > 0;\n    const [showDefault, setShowDefault] = useState(false);\n\n    return (\n      <section\n        data-slot=\"system-prompt-editor\"\n        ref={ref}\n        className={cn(\"rounded-xl border bg-card\", className)}\n        {...props}\n      >\n        <header className=\"flex items-center justify-between gap-3 border-border/40 border-b px-4 py-3\">\n          <div className=\"flex items-center gap-2\">\n            <Sparkles className=\"size-4 text-primary\" aria-hidden=\"true\" />\n            <h3 className=\"font-display text-title-md tracking-tight\">{title}</h3>\n            <span\n              className={cn(\n                \"inline-flex items-center rounded-full border px-2 py-0.5 font-mono text-label uppercase tracking-wider\",\n                usingOverride\n                  ? \"border-primary/40 bg-primary/10 text-primary\"\n                  : \"border-border/40 bg-muted text-muted-foreground\",\n              )}\n            >\n              {usingOverride ? \"Override active\" : \"Vendor default\"}\n            </span>\n          </div>\n          <div className=\"flex items-center gap-2\">\n            {tokenEstimate !== undefined ? (\n              <span className=\"font-mono text-label text-muted-foreground tabular-nums\">\n                ~{tokenEstimate.toLocaleString()} tokens\n              </span>\n            ) : null}\n            <button\n              type=\"button\"\n              onClick={() => setShowDefault((v) => !v)}\n              className=\"rounded-md px-2 py-1 font-mono text-label text-muted-foreground hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n            >\n              {showDefault ? \"Hide\" : \"Show\"} default\n            </button>\n            {usingOverride ? (\n              <button\n                type=\"button\"\n                onClick={() => onOverrideChange(\"\")}\n                className=\"inline-flex items-center gap-1 rounded-md px-2 py-1 font-mono text-label text-muted-foreground hover:bg-muted hover:text-destructive focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n              >\n                <RotateCcw className=\"size-3\" /> Reset\n              </button>\n            ) : null}\n          </div>\n        </header>\n\n        {showDefault ? (\n          <pre className=\"max-h-48 overflow-auto border-border/40 border-b bg-muted/40 px-4 py-3 font-mono text-code-sm text-muted-foreground\">\n            {defaultPrompt}\n          </pre>\n        ) : null}\n\n        <textarea\n          value={override}\n          onChange={(e) => onOverrideChange(e.target.value)}\n          placeholder={\n            usingOverride ? \"\" : \"Leave empty to use the vendor default. Type here to override.\"\n          }\n          rows={8}\n          className={cn(\n            \"w-full resize-y bg-transparent px-4 py-3 font-mono text-code-md text-foreground\",\n            \"placeholder:text-muted-foreground\",\n            \"focus:outline-none\",\n          )}\n        />\n      </section>\n    );\n  },\n);\nSystemPromptEditor.displayName = \"SystemPromptEditor\";\n\nexport { SystemPromptEditor };\n"]}