@theokit/ui 0.13.0

package/dist/chunk-3QKTS6F5.js

@@ -0,0 +1,88 @@
+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", { 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-3QKTS6F5.js.map
+//# sourceMappingURL=chunk-3QKTS6F5.js.map

package/dist/chunk-3QKTS6F5.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-3QKTS6F5.js","sourcesContent":["import { 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 ref={ref} className={cn(\"rounded-xl border bg-card\", className)} {...props}>\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"]}

package/dist/chunk-3TBXLYNM.js

@@ -0,0 +1,42 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { Clock, Coins, FileEdit } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var RunStats = forwardRef(
+  ({ className, duration, tokens, filesChanged, ...props }, ref) => /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref,
+      className: cn(
+        "flex flex-wrap items-center gap-3 font-mono text-code-sm text-muted-foreground",
+        className
+      ),
+      ...props,
+      children: [
+        duration ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx(Clock, { className: "size-3", "aria-hidden": "true" }),
+          " ",
+          duration
+        ] }) : null,
+        tokens ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx(Coins, { className: "size-3", "aria-hidden": "true" }),
+          " ",
+          tokens,
+          " tokens"
+        ] }) : null,
+        filesChanged !== void 0 ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx(FileEdit, { className: "size-3", "aria-hidden": "true" }),
+          " ",
+          filesChanged,
+          " files"
+        ] }) : null
+      ]
+    }
+  )
+);
+RunStats.displayName = "RunStats";
+
+export { RunStats };
+//# sourceMappingURL=chunk-3TBXLYNM.js.map
+//# sourceMappingURL=chunk-3TBXLYNM.js.map

package/dist/chunk-3TBXLYNM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/run-stats/run-stats.tsx"],"names":[],"mappings":";;;;;AAmBA,IAAM,QAAA,GAAW,UAAA;AAAA,EACf,CAAC,EAAE,SAAA,EAAW,QAAA,EAAU,QAAQ,YAAA,EAAc,GAAG,KAAA,EAAM,EAAG,GAAA,qBACxD,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAW,EAAA;AAAA,QACT,gFAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,QAAA,mBACC,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,kCAAA,EACd,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAU,QAAA,EAAS,aAAA,EAAY,MAAA,EAAO,CAAA;AAAA,UAAE,GAAA;AAAA,UAAE;AAAA,SAAA,EACnD,CAAA,GACE,IAAA;AAAA,QACH,MAAA,mBACC,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,kCAAA,EACd,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAU,QAAA,EAAS,aAAA,EAAY,MAAA,EAAO,CAAA;AAAA,UAAE,GAAA;AAAA,UAAE,MAAA;AAAA,UAAO;AAAA,SAAA,EAC1D,CAAA,GACE,IAAA;AAAA,QACH,YAAA,KAAiB,MAAA,mBAChB,IAAA,CAAC,MAAA,EAAA,EAAK,WAAU,kCAAA,EACd,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,QAAA,EAAS,aAAA,EAAY,MAAA,EAAO,CAAA;AAAA,UAAE,GAAA;AAAA,UAAE,YAAA;AAAA,UAAa;AAAA,SAAA,EACnE,CAAA,GACE;AAAA;AAAA;AAAA;AAGV;AACA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-3TBXLYNM.js","sourcesContent":["import { Clock, Coins, FileEdit } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { HTMLAttributes } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\ninterface RunStatsProps extends HTMLAttributes<HTMLDivElement> {\n  duration?: string;\n  /** Formatted token count, e.g. \"35.7k\". */\n  tokens?: string;\n  /** Number of files changed in the run. */\n  filesChanged?: number;\n}\n\n/**\n * RunStats — inline metric row shown after an agent run.\n *\n * Visual: muted bullet-separated row with clock + tokens + files-changed icons.\n * All optional — the component skips entries that aren't provided.\n */\nconst RunStats = forwardRef<HTMLDivElement, RunStatsProps>(\n  ({ className, duration, tokens, filesChanged, ...props }, ref) => (\n    <div\n      ref={ref}\n      className={cn(\n        \"flex flex-wrap items-center gap-3 font-mono text-code-sm text-muted-foreground\",\n        className,\n      )}\n      {...props}\n    >\n      {duration ? (\n        <span className=\"inline-flex items-center gap-1.5\">\n          <Clock className=\"size-3\" aria-hidden=\"true\" /> {duration}\n        </span>\n      ) : null}\n      {tokens ? (\n        <span className=\"inline-flex items-center gap-1.5\">\n          <Coins className=\"size-3\" aria-hidden=\"true\" /> {tokens} tokens\n        </span>\n      ) : null}\n      {filesChanged !== undefined ? (\n        <span className=\"inline-flex items-center gap-1.5\">\n          <FileEdit className=\"size-3\" aria-hidden=\"true\" /> {filesChanged} files\n        </span>\n      ) : null}\n    </div>\n  ),\n);\nRunStats.displayName = \"RunStats\";\n\nexport { RunStats };\n"]}

package/dist/chunk-4AM2HSXU.js

@@ -0,0 +1,67 @@
+import { SkillCard } from './chunk-AJTJNHKK.js';
+import { cn } from './chunk-EWDN56AS.js';
+import { Search } from 'lucide-react';
+import { forwardRef, useState, useMemo } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var SkillsList = forwardRef(
+  ({ className, skills, title = "Skills", searchable = true, onToggle, ...props }, ref) => {
+    const [q, setQ] = useState("");
+    const filtered = useMemo(() => {
+      if (!q.trim()) return skills;
+      const needle = q.toLowerCase();
+      return skills.filter((s) => {
+        const hay = [
+          s.name,
+          typeof s.description === "string" ? s.description : "",
+          ...s.triggers ?? []
+        ].join(" ").toLowerCase();
+        return hay.includes(needle);
+      });
+    }, [skills, q]);
+    return /* @__PURE__ */ jsxs(
+      "section",
+      {
+        ref,
+        className: cn("grid gap-3", className),
+        "aria-label": "Available skills",
+        ...props,
+        children: [
+          title || searchable ? /* @__PURE__ */ jsxs("header", { className: "flex flex-wrap items-center justify-between gap-3", children: [
+            title ? /* @__PURE__ */ jsx("h3", { className: "font-display text-title-md tracking-tight", children: title }) : /* @__PURE__ */ jsx("span", {}),
+            searchable ? /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+              /* @__PURE__ */ jsx(
+                Search,
+                {
+                  className: "-translate-y-1/2 absolute top-1/2 left-2 size-3.5 text-muted-foreground",
+                  "aria-hidden": "true"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: "search",
+                  value: q,
+                  onChange: (e) => setQ(e.target.value),
+                  placeholder: "Filter skills\u2026",
+                  "aria-label": "Filter skills",
+                  className: "h-8 w-56 rounded-md border border-input bg-card pr-2 pl-7 font-mono text-code-sm text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                }
+              )
+            ] }) : null
+          ] }) : null,
+          filtered.length === 0 ? /* @__PURE__ */ jsxs("p", { className: "rounded-xl border border-border/60 border-dashed bg-muted/30 px-4 py-8 text-center font-sans text-body-sm text-muted-foreground", children: [
+            "No skills match ",
+            q ? `"${q}"` : "the current filter",
+            "."
+          ] }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-3 md:grid-cols-2", children: filtered.map((skill) => /* @__PURE__ */ jsx(SkillCard, { skill, ...onToggle ? { onToggle } : {} }, skill.id)) })
+        ]
+      }
+    );
+  }
+);
+SkillsList.displayName = "SkillsList";
+
+export { SkillsList };
+//# sourceMappingURL=chunk-4AM2HSXU.js.map
+//# sourceMappingURL=chunk-4AM2HSXU.js.map

package/dist/chunk-4AM2HSXU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/skills-list/skills-list.tsx"],"names":[],"mappings":";;;;;;AAkBA,IAAM,UAAA,GAAa,UAAA;AAAA,EACjB,CAAC,EAAE,SAAA,EAAW,MAAA,EAAQ,KAAA,GAAQ,QAAA,EAAU,UAAA,GAAa,IAAA,EAAM,QAAA,EAAU,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACvF,IAAA,MAAM,CAAC,CAAA,EAAG,IAAI,CAAA,GAAI,SAAS,EAAE,CAAA;AAC7B,IAAA,MAAM,QAAA,GAAW,QAAQ,MAAM;AAC7B,MAAA,IAAI,CAAC,CAAA,CAAE,IAAA,EAAK,EAAG,OAAO,MAAA;AACtB,MAAA,MAAM,MAAA,GAAS,EAAE,WAAA,EAAY;AAC7B,MAAA,OAAO,MAAA,CAAO,MAAA,CAAO,CAAC,CAAA,KAAM;AAC1B,QAAA,MAAM,GAAA,GAAM;AAAA,UACV,CAAA,CAAE,IAAA;AAAA,UACF,OAAO,CAAA,CAAE,WAAA,KAAgB,QAAA,GAAW,EAAE,WAAA,GAAc,EAAA;AAAA,UACpD,GAAI,CAAA,CAAE,QAAA,IAAY;AAAC,SACrB,CACG,IAAA,CAAK,GAAG,CAAA,CACR,WAAA,EAAY;AACf,QAAA,OAAO,GAAA,CAAI,SAAS,MAAM,CAAA;AAAA,MAC5B,CAAC,CAAA;AAAA,IACH,CAAA,EAAG,CAAC,MAAA,EAAQ,CAAC,CAAC,CAAA;AAEd,IAAA,uBACE,IAAA;AAAA,MAAC,SAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA,CAAG,YAAA,EAAc,SAAS,CAAA;AAAA,QACrC,YAAA,EAAW,kBAAA;AAAA,QACV,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,KAAA,IAAS,UAAA,mBACR,IAAA,CAAC,QAAA,EAAA,EAAO,SAAA,EAAU,mDAAA,EACf,QAAA,EAAA;AAAA,YAAA,KAAA,uBACE,IAAA,EAAA,EAAG,SAAA,EAAU,6CAA6C,QAAA,EAAA,KAAA,EAAM,CAAA,uBAEhE,MAAA,EAAA,EAAK,CAAA;AAAA,YAEP,UAAA,mBACC,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,UAAA,EACb,QAAA,EAAA;AAAA,8BAAA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,SAAA,EAAU,yEAAA;AAAA,kBACV,aAAA,EAAY;AAAA;AAAA,eACd;AAAA,8BACA,GAAA;AAAA,gBAAC,OAAA;AAAA,gBAAA;AAAA,kBACC,IAAA,EAAK,QAAA;AAAA,kBACL,KAAA,EAAO,CAAA;AAAA,kBACP,UAAU,CAAC,CAAA,KAAM,IAAA,CAAK,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,kBACpC,WAAA,EAAY,qBAAA;AAAA,kBACZ,YAAA,EAAW,eAAA;AAAA,kBACX,SAAA,EAAU;AAAA;AAAA;AACZ,aAAA,EACF,CAAA,GACE;AAAA,WAAA,EACN,CAAA,GACE,IAAA;AAAA,UACH,SAAS,MAAA,KAAW,CAAA,mBACnB,IAAA,CAAC,GAAA,EAAA,EAAE,WAAU,iIAAA,EAAkI,QAAA,EAAA;AAAA,YAAA,kBAAA;AAAA,YAC5H,CAAA,GAAI,CAAA,CAAA,EAAI,CAAC,CAAA,CAAA,CAAA,GAAM,oBAAA;AAAA,YAAqB;AAAA,WAAA,EACvD,CAAA,uBAEC,KAAA,EAAA,EAAI,SAAA,EAAU,yCACZ,QAAA,EAAA,QAAA,CAAS,GAAA,CAAI,CAAC,KAAA,qBACb,GAAA,CAAC,SAAA,EAAA,EAAyB,OAAe,GAAI,QAAA,GAAW,EAAE,QAAA,EAAS,GAAI,EAAC,EAAA,EAAxD,KAAA,CAAM,EAAsD,CAC7E,CAAA,EACH;AAAA;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AACA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-4AM2HSXU.js","sourcesContent":["import { Search } from \"lucide-react\";\nimport { forwardRef, useMemo, useState } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\nimport { type Skill, SkillCard, type SkillState } from \"../../primitives/skill-card/index.js\";\n\ninterface SkillsListProps extends Omit<HTMLAttributes<HTMLDivElement>, \"title\" | \"onToggle\"> {\n  skills: Skill[];\n  title?: ReactNode;\n  /** If true, shows a search input above the grid. */\n  searchable?: boolean;\n  onToggle?: (id: string, next: SkillState) => void;\n}\n\n/**\n * SkillsList — grid of SkillCards with optional search + source filter chips.\n * Pairs with claw-code's `claw skills` inventory but visual.\n */\nconst SkillsList = forwardRef<HTMLDivElement, SkillsListProps>(\n  ({ className, skills, title = \"Skills\", searchable = true, onToggle, ...props }, ref) => {\n    const [q, setQ] = useState(\"\");\n    const filtered = useMemo(() => {\n      if (!q.trim()) return skills;\n      const needle = q.toLowerCase();\n      return skills.filter((s) => {\n        const hay = [\n          s.name,\n          typeof s.description === \"string\" ? s.description : \"\",\n          ...(s.triggers ?? []),\n        ]\n          .join(\" \")\n          .toLowerCase();\n        return hay.includes(needle);\n      });\n    }, [skills, q]);\n\n    return (\n      <section\n        ref={ref}\n        className={cn(\"grid gap-3\", className)}\n        aria-label=\"Available skills\"\n        {...props}\n      >\n        {title || searchable ? (\n          <header className=\"flex flex-wrap items-center justify-between gap-3\">\n            {title ? (\n              <h3 className=\"font-display text-title-md tracking-tight\">{title}</h3>\n            ) : (\n              <span />\n            )}\n            {searchable ? (\n              <div className=\"relative\">\n                <Search\n                  className=\"-translate-y-1/2 absolute top-1/2 left-2 size-3.5 text-muted-foreground\"\n                  aria-hidden=\"true\"\n                />\n                <input\n                  type=\"search\"\n                  value={q}\n                  onChange={(e) => setQ(e.target.value)}\n                  placeholder=\"Filter skills…\"\n                  aria-label=\"Filter skills\"\n                  className=\"h-8 w-56 rounded-md border border-input bg-card pr-2 pl-7 font-mono text-code-sm text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n                />\n              </div>\n            ) : null}\n          </header>\n        ) : null}\n        {filtered.length === 0 ? (\n          <p className=\"rounded-xl border border-border/60 border-dashed bg-muted/30 px-4 py-8 text-center font-sans text-body-sm text-muted-foreground\">\n            No skills match {q ? `\"${q}\"` : \"the current filter\"}.\n          </p>\n        ) : (\n          <div className=\"grid grid-cols-1 gap-3 md:grid-cols-2\">\n            {filtered.map((skill) => (\n              <SkillCard key={skill.id} skill={skill} {...(onToggle ? { onToggle } : {})} />\n            ))}\n          </div>\n        )}\n      </section>\n    );\n  },\n);\nSkillsList.displayName = \"SkillsList\";\n\nexport { SkillsList };\n"]}

package/dist/chunk-4BCGKM65.js

@@ -0,0 +1,44 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { Folder } from 'lucide-react';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var RecentFoldersList = forwardRef(
+  ({ className, title = "Recent folders", folders, onSelect, ...props }, ref) => /* @__PURE__ */ jsxs("div", { ref, className: cn("rounded-xl border bg-card", className), ...props, children: [
+    title ? /* @__PURE__ */ jsx("p", { className: "border-border/40 border-b px-3 py-2 font-sans text-label-caps text-muted-foreground uppercase tracking-wider", children: title }) : null,
+    /* @__PURE__ */ jsx("ul", { children: folders.map((folder) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => onSelect?.(folder.id),
+        className: cn(
+          "flex w-full items-center gap-3 px-3 py-2",
+          "text-left transition-colors",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          folder.active ? "bg-primary/10 text-primary" : "hover:bg-muted"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(
+            Folder,
+            {
+              className: cn(
+                "size-4 shrink-0",
+                folder.active ? "text-primary" : "text-muted-foreground"
+              ),
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsx("p", { className: "truncate font-medium text-body-sm", children: folder.name }),
+            /* @__PURE__ */ jsx("p", { className: "truncate font-mono text-label text-muted-foreground", children: folder.path })
+          ] })
+        ]
+      }
+    ) }, folder.id)) })
+  ] })
+);
+RecentFoldersList.displayName = "RecentFoldersList";
+
+export { RecentFoldersList };
+//# sourceMappingURL=chunk-4BCGKM65.js.map
+//# sourceMappingURL=chunk-4BCGKM65.js.map

package/dist/chunk-4BCGKM65.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/recent-folders-list/recent-folders-list.tsx"],"names":[],"mappings":";;;;;AA0BA,IAAM,iBAAA,GAAoB,UAAA;AAAA,EACxB,CAAC,EAAE,SAAA,EAAW,KAAA,GAAQ,kBAAkB,OAAA,EAAS,QAAA,EAAU,GAAG,KAAA,EAAM,EAAG,wBACrE,IAAA,CAAC,KAAA,EAAA,EAAI,KAAU,SAAA,EAAW,EAAA,CAAG,6BAA6B,SAAS,CAAA,EAAI,GAAG,KAAA,EACvE,QAAA,EAAA;AAAA,IAAA,KAAA,mBACC,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,8GAAA,EACV,iBACH,CAAA,GACE,IAAA;AAAA,wBACH,IAAA,EAAA,EACE,QAAA,EAAA,OAAA,CAAQ,IAAI,CAAC,MAAA,yBACX,IAAA,EAAA,EACC,QAAA,kBAAA,IAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,OAAA,EAAS,MAAM,QAAA,GAAW,MAAA,CAAO,EAAE,CAAA;AAAA,QACnC,SAAA,EAAW,EAAA;AAAA,UACT,0CAAA;AAAA,UACA,6BAAA;AAAA,UACA,yEAAA;AAAA,UACA,MAAA,CAAO,SAAS,4BAAA,GAA+B;AAAA,SACjD;AAAA,QAEA,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,iBAAA;AAAA,gBACA,MAAA,CAAO,SAAS,cAAA,GAAiB;AAAA,eACnC;AAAA,cACA,aAAA,EAAY;AAAA;AAAA,WACd;AAAA,0BACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gBAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,mCAAA,EAAqC,QAAA,EAAA,MAAA,CAAO,IAAA,EAAK,CAAA;AAAA,4BAC9D,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,qDAAA,EAAuD,iBAAO,IAAA,EAAK;AAAA,WAAA,EAClF;AAAA;AAAA;AAAA,KACF,EAAA,EAtBO,MAAA,CAAO,EAuBhB,CACD,CAAA,EACH;AAAA,GAAA,EACF;AAEJ;AACA,iBAAA,CAAkB,WAAA,GAAc,mBAAA","file":"chunk-4BCGKM65.js","sourcesContent":["import { Folder } from \"lucide-react\";\nimport { forwardRef } from \"react\";\nimport type { HTMLAttributes, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\nexport interface RecentFolder {\n  id: string;\n  name: ReactNode;\n  path: string;\n  /** When true, the row is highlighted as selected. */\n  active?: boolean;\n}\n\ninterface RecentFoldersListProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"title\" | \"onSelect\"> {\n  title?: ReactNode;\n  folders: RecentFolder[];\n  onSelect?: (id: string) => void;\n}\n\n/**\n * RecentFoldersList — recently-used folders for the Files picker.\n *\n * Visual: a stack of rows with folder icon + name + path (smaller, muted),\n * active row highlighted with violet bg.\n */\nconst RecentFoldersList = forwardRef<HTMLDivElement, RecentFoldersListProps>(\n  ({ className, title = \"Recent folders\", folders, onSelect, ...props }, ref) => (\n    <div ref={ref} className={cn(\"rounded-xl border bg-card\", className)} {...props}>\n      {title ? (\n        <p className=\"border-border/40 border-b px-3 py-2 font-sans text-label-caps text-muted-foreground uppercase tracking-wider\">\n          {title}\n        </p>\n      ) : null}\n      <ul>\n        {folders.map((folder) => (\n          <li key={folder.id}>\n            <button\n              type=\"button\"\n              onClick={() => onSelect?.(folder.id)}\n              className={cn(\n                \"flex w-full items-center gap-3 px-3 py-2\",\n                \"text-left transition-colors\",\n                \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n                folder.active ? \"bg-primary/10 text-primary\" : \"hover:bg-muted\",\n              )}\n            >\n              <Folder\n                className={cn(\n                  \"size-4 shrink-0\",\n                  folder.active ? \"text-primary\" : \"text-muted-foreground\",\n                )}\n                aria-hidden=\"true\"\n              />\n              <div className=\"min-w-0 flex-1\">\n                <p className=\"truncate font-medium text-body-sm\">{folder.name}</p>\n                <p className=\"truncate font-mono text-label text-muted-foreground\">{folder.path}</p>\n              </div>\n            </button>\n          </li>\n        ))}\n      </ul>\n    </div>\n  ),\n);\nRecentFoldersList.displayName = \"RecentFoldersList\";\n\nexport { RecentFoldersList };\n"]}

package/dist/chunk-4D3JILQX.js

@@ -0,0 +1,145 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { ChevronRight } from 'lucide-react';
+import { forwardRef, Fragment } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var Root = forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "header",
+    {
+      ref,
+      className: cn(
+        "flex h-16 items-center justify-between gap-4 border-border/40 border-b bg-card px-6",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Root.displayName = "TopNav";
+var Left = forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("flex flex-1 items-center gap-3", className), ...props })
+);
+Left.displayName = "TopNav.Left";
+var Center = forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("hidden flex-1 justify-center md:flex", className), ...props })
+);
+Center.displayName = "TopNav.Center";
+var Right = forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: cn("flex flex-1 items-center justify-end gap-2", className),
+      ...props
+    }
+  )
+);
+Right.displayName = "TopNav.Right";
+var Breadcrumbs = forwardRef(
+  ({ className, items, ...props }, ref) => /* @__PURE__ */ jsx(
+    "nav",
+    {
+      ref,
+      "aria-label": "Breadcrumb",
+      className: cn("flex items-center gap-1.5 text-body-sm", className),
+      ...props,
+      children: items.map((item, idx) => {
+        const isLast = idx === items.length - 1;
+        const key = typeof item.label === "string" ? item.label : idx;
+        return /* @__PURE__ */ jsxs(Fragment, { children: [
+          item.href && !isLast ? /* @__PURE__ */ jsx(
+            "a",
+            {
+              href: item.href,
+              className: "font-sans text-muted-foreground transition-colors hover:text-foreground",
+              children: item.label
+            }
+          ) : /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                "font-sans",
+                isLast ? "font-medium text-foreground" : "text-muted-foreground"
+              ),
+              "aria-current": isLast ? "page" : void 0,
+              children: item.label
+            }
+          ),
+          !isLast ? /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 text-muted-foreground", "aria-hidden": "true" }) : null
+        ] }, key);
+      })
+    }
+  )
+);
+Breadcrumbs.displayName = "TopNav.Breadcrumbs";
+var ModeSwitcher = forwardRef(
+  ({ className, value, options, onChange, ariaLabel = "Mode", ...props }, ref) => {
+    const handleKeyDown = (e) => {
+      if (!onChange || options.length === 0) return;
+      const idx = options.findIndex((o) => o.value === value);
+      const current = idx >= 0 ? idx : 0;
+      let nextIdx = null;
+      if (e.key === "ArrowRight" || e.key === "ArrowDown") {
+        nextIdx = (current + 1) % options.length;
+      } else if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
+        nextIdx = (current - 1 + options.length) % options.length;
+      } else if (e.key === "Home") {
+        nextIdx = 0;
+      } else if (e.key === "End") {
+        nextIdx = options.length - 1;
+      }
+      if (nextIdx === null) return;
+      e.preventDefault();
+      const target = options[nextIdx];
+      if (target) onChange(target.value);
+    };
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: "radiogroup",
+        "aria-label": ariaLabel,
+        onKeyDown: handleKeyDown,
+        className: cn(
+          "inline-flex items-center rounded-lg border border-border/60 bg-muted p-1",
+          className
+        ),
+        ...props,
+        children: options.map((opt) => {
+          const isActive = opt.value === value;
+          return /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              role: "radio",
+              "aria-checked": isActive,
+              tabIndex: isActive ? 0 : -1,
+              onClick: () => onChange?.(opt.value),
+              className: cn(
+                "rounded-md px-3 py-1.5 font-medium font-sans text-body-sm",
+                "transition-all duration-base ease-out-soft",
+                "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                isActive ? "bg-card text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"
+              ),
+              children: opt.label
+            },
+            opt.value
+          );
+        })
+      }
+    );
+  }
+);
+ModeSwitcher.displayName = "TopNav.ModeSwitcher";
+var TopNav = /* @__PURE__ */ Object.assign(Root, {
+  Left,
+  Center,
+  Right,
+  Breadcrumbs,
+  ModeSwitcher
+});
+
+export { TopNav };
+//# sourceMappingURL=chunk-4D3JILQX.js.map
+//# sourceMappingURL=chunk-4D3JILQX.js.map

package/dist/chunk-4D3JILQX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/topnav/topnav.tsx"],"names":[],"mappings":"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","file":"chunk-4D3JILQX.js","sourcesContent":["import { ChevronRight } from \"lucide-react\";\nimport { Fragment, forwardRef } from \"react\";\nimport type { HTMLAttributes, KeyboardEvent, ReactNode } from \"react\";\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * TopNav — horizontal app bar (64px).\n *\n * Composition:\n *   <TopNav>\n *     <TopNav.Left>\n *       <TopNav.Breadcrumbs items={[{label: \"acme\"}, {label: \"api\"}]} />\n *     </TopNav.Left>\n *     <TopNav.Center>…segmented switcher…</TopNav.Center>\n *     <TopNav.Right>…actions…</TopNav.Right>\n *   </TopNav>\n *\n * Variant — hairline bottom border. No glass/blur (anti-glass guideline).\n */\n\nconst Root = forwardRef<HTMLElement, HTMLAttributes<HTMLElement>>(\n  ({ className, ...props }, ref) => (\n    <header\n      ref={ref}\n      className={cn(\n        \"flex h-16 items-center justify-between gap-4 border-border/40 border-b bg-card px-6\",\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nRoot.displayName = \"TopNav\";\n\nconst Left = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn(\"flex flex-1 items-center gap-3\", className)} {...props} />\n  ),\n);\nLeft.displayName = \"TopNav.Left\";\n\nconst Center = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} className={cn(\"hidden flex-1 justify-center md:flex\", className)} {...props} />\n  ),\n);\nCenter.displayName = \"TopNav.Center\";\n\nconst Right = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => (\n    <div\n      ref={ref}\n      className={cn(\"flex flex-1 items-center justify-end gap-2\", className)}\n      {...props}\n    />\n  ),\n);\nRight.displayName = \"TopNav.Right\";\n\ninterface BreadcrumbItem {\n  label: ReactNode;\n  href?: string;\n}\n\ninterface BreadcrumbsProps extends HTMLAttributes<HTMLElement> {\n  items: BreadcrumbItem[];\n}\n\nconst Breadcrumbs = forwardRef<HTMLElement, BreadcrumbsProps>(\n  ({ className, items, ...props }, ref) => (\n    <nav\n      ref={ref}\n      aria-label=\"Breadcrumb\"\n      className={cn(\"flex items-center gap-1.5 text-body-sm\", className)}\n      {...props}\n    >\n      {items.map((item, idx) => {\n        const isLast = idx === items.length - 1;\n        const key = typeof item.label === \"string\" ? item.label : idx;\n        return (\n          <Fragment key={key}>\n            {item.href && !isLast ? (\n              <a\n                href={item.href}\n                className=\"font-sans text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                {item.label}\n              </a>\n            ) : (\n              <span\n                className={cn(\n                  \"font-sans\",\n                  isLast ? \"font-medium text-foreground\" : \"text-muted-foreground\",\n                )}\n                aria-current={isLast ? \"page\" : undefined}\n              >\n                {item.label}\n              </span>\n            )}\n            {!isLast ? (\n              <ChevronRight className=\"size-3.5 text-muted-foreground\" aria-hidden=\"true\" />\n            ) : null}\n          </Fragment>\n        );\n      })}\n    </nav>\n  ),\n);\nBreadcrumbs.displayName = \"TopNav.Breadcrumbs\";\n\ninterface ModeSwitcherOption {\n  value: string;\n  label: ReactNode;\n}\n\ninterface ModeSwitcherProps extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  value: string;\n  options: ModeSwitcherOption[];\n  onChange?: (value: string) => void;\n  /**\n   * Accessible label for the radiogroup. Defaults to \"Mode\".\n   */\n  ariaLabel?: string;\n}\n\n/**\n * TopNav.ModeSwitcher — segmented control (Chat / Code / Infra).\n *\n * ARIA semantics: `role=\"radiogroup\"` + `role=\"radio\"` per option, with roving\n * tabindex and full keyboard navigation (Arrow keys + Home/End). Per WAI-ARIA\n * radiogroup pattern, exactly one option has `tabIndex=0` (the active one) and\n * the rest have `tabIndex=-1`, so Tab moves in and Tab moves out.\n *\n * Stateless: pass `value` + `onChange`.\n */\nconst ModeSwitcher = forwardRef<HTMLDivElement, ModeSwitcherProps>(\n  ({ className, value, options, onChange, ariaLabel = \"Mode\", ...props }, ref) => {\n    const handleKeyDown = (e: KeyboardEvent<HTMLDivElement>) => {\n      if (!onChange || options.length === 0) return;\n      const idx = options.findIndex((o) => o.value === value);\n      const current = idx >= 0 ? idx : 0;\n      let nextIdx: number | null = null;\n      if (e.key === \"ArrowRight\" || e.key === \"ArrowDown\") {\n        nextIdx = (current + 1) % options.length;\n      } else if (e.key === \"ArrowLeft\" || e.key === \"ArrowUp\") {\n        nextIdx = (current - 1 + options.length) % options.length;\n      } else if (e.key === \"Home\") {\n        nextIdx = 0;\n      } else if (e.key === \"End\") {\n        nextIdx = options.length - 1;\n      }\n      if (nextIdx === null) return;\n      e.preventDefault();\n      const target = options[nextIdx];\n      if (target) onChange(target.value);\n    };\n\n    return (\n      <div\n        ref={ref}\n        role=\"radiogroup\"\n        aria-label={ariaLabel}\n        onKeyDown={handleKeyDown}\n        className={cn(\n          \"inline-flex items-center rounded-lg border border-border/60 bg-muted p-1\",\n          className,\n        )}\n        {...props}\n      >\n        {options.map((opt) => {\n          const isActive = opt.value === value;\n          return (\n            <button\n              key={opt.value}\n              type=\"button\"\n              // biome-ignore lint/a11y/useSemanticElements: WAI-ARIA radiogroup pattern requires role=\"radio\" on buttons for segmented controls\n              role=\"radio\"\n              aria-checked={isActive}\n              tabIndex={isActive ? 0 : -1}\n              onClick={() => onChange?.(opt.value)}\n              className={cn(\n                \"rounded-md px-3 py-1.5 font-medium font-sans text-body-sm\",\n                \"transition-all duration-base ease-out-soft\",\n                \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n                isActive\n                  ? \"bg-card text-foreground shadow-sm\"\n                  : \"text-muted-foreground hover:text-foreground\",\n              )}\n            >\n              {opt.label}\n            </button>\n          );\n        })}\n      </div>\n    );\n  },\n);\nModeSwitcher.displayName = \"TopNav.ModeSwitcher\";\n\nconst TopNav = /*#__PURE__*/ Object.assign(Root, {\n  Left,\n  Center,\n  Right,\n  Breadcrumbs,\n  ModeSwitcher,\n});\n\nexport { TopNav };\n"]}

package/dist/chunk-4EJU2GBG.js

@@ -0,0 +1,48 @@
+import { cn } from './chunk-EWDN56AS.js';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var OVERRIDE_OPTIONS = ["off", "minimal", "low", "medium", "high", "xhigh"];
+function inheritedLabel(inheritedValue) {
+  if (inheritedValue === void 0) return "Inherited";
+  return `Inherited: ${inheritedValue}`;
+}
+function overrideLabel(level) {
+  if (level === "off") return "Off";
+  return `Override: ${level}`;
+}
+var ThinkingLevelSelector = forwardRef(
+  ({ value, inheritedValue, onChange, disabled = false, className, "data-testid": dataTestId }, ref) => {
+    if (process.env.NODE_ENV !== "production" && value === "inherited" && inheritedValue === void 0) {
+      console.warn(
+        '[ThinkingLevelSelector] value="inherited" but no inheritedValue prop \u2014 rendering as "Inherited: ?".'
+      );
+    }
+    return /* @__PURE__ */ jsxs(
+      "select",
+      {
+        ref,
+        "aria-label": "Thinking level",
+        className: cn(
+          "rounded-md border border-border bg-background px-2 py-1 text-sm",
+          "focus:outline-none focus:ring-2 focus:ring-primary",
+          disabled && "cursor-not-allowed opacity-50",
+          className
+        ),
+        disabled,
+        value,
+        onChange: (e) => onChange(e.target.value),
+        "data-testid": dataTestId ?? "thinking-level-selector",
+        children: [
+          /* @__PURE__ */ jsx("option", { value: "inherited", children: inheritedLabel(inheritedValue) }),
+          OVERRIDE_OPTIONS.map((level) => /* @__PURE__ */ jsx("option", { value: level, children: overrideLabel(level) }, level))
+        ]
+      }
+    );
+  }
+);
+ThinkingLevelSelector.displayName = "ThinkingLevelSelector";
+
+export { ThinkingLevelSelector };
+//# sourceMappingURL=chunk-4EJU2GBG.js.map
+//# sourceMappingURL=chunk-4EJU2GBG.js.map

package/dist/chunk-4EJU2GBG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/thinking-level-selector/thinking-level-selector.tsx"],"names":[],"mappings":";;;;AA+BA,IAAM,mBAAoC,CAAC,KAAA,EAAO,WAAW,KAAA,EAAO,QAAA,EAAU,QAAQ,OAAO,CAAA;AAE7F,SAAS,eAAe,cAAA,EAAmD;AACzE,EAAA,IAAI,cAAA,KAAmB,QAAW,OAAO,WAAA;AACzC,EAAA,OAAO,cAAc,cAAc,CAAA,CAAA;AACrC;AAEA,SAAS,cAAc,KAAA,EAA8B;AACnD,EAAA,IAAI,KAAA,KAAU,OAAO,OAAO,KAAA;AAC5B,EAAA,OAAO,aAAa,KAAK,CAAA,CAAA;AAC3B;AAEO,IAAM,qBAAA,GAAwB,UAAA;AAAA,EACnC,CACE,EAAE,KAAA,EAAO,cAAA,EAAgB,QAAA,EAAU,QAAA,GAAW,KAAA,EAAO,SAAA,EAAW,aAAA,EAAe,UAAA,EAAW,EAC1F,GAAA,KACG;AACH,IAAA,IACE,QAAQ,GAAA,CAAI,QAAA,KAAa,gBACzB,KAAA,KAAU,WAAA,IACV,mBAAmB,MAAA,EACnB;AAEA,MAAA,OAAA,CAAQ,IAAA;AAAA,QACN;AAAA,OACF;AAAA,IACF;AACA,IAAA,uBACE,IAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,YAAA,EAAW,gBAAA;AAAA,QACX,SAAA,EAAW,EAAA;AAAA,UACT,iEAAA;AAAA,UACA,oDAAA;AAAA,UACA,QAAA,IAAY,+BAAA;AAAA,UACZ;AAAA,SACF;AAAA,QACA,QAAA;AAAA,QACA,KAAA;AAAA,QACA,UAAU,CAAC,CAAA,KAAM,QAAA,CAAS,CAAA,CAAE,OAAO,KAAiC,CAAA;AAAA,QACpE,eAAa,UAAA,IAAc,yBAAA;AAAA,QAE3B,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,QAAA,EAAA,EAAO,KAAA,EAAM,WAAA,EAAa,QAAA,EAAA,cAAA,CAAe,cAAc,CAAA,EAAE,CAAA;AAAA,UACzD,gBAAA,CAAiB,GAAA,CAAI,CAAC,KAAA,qBACrB,GAAA,CAAC,QAAA,EAAA,EAAmB,KAAA,EAAO,KAAA,EACxB,QAAA,EAAA,aAAA,CAAc,KAAK,CAAA,EAAA,EADT,KAEb,CACD;AAAA;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AACA,qBAAA,CAAsB,WAAA,GAAc,uBAAA","file":"chunk-4EJU2GBG.js","sourcesContent":["import { forwardRef } from \"react\";\n\nimport { cn } from \"../../../lib/cn.js\";\n\n/**\n * ThinkingLevelSelector — multi-state combobox for LLM reasoning budget.\n *\n * Mirrors the OpenClaw Control UI thinking selector. Values follow the SDK's\n * `Agent.thinking` parameter (\"minimal\" | \"low\" | \"medium\" | \"high\" | \"xhigh\")\n * plus a sentinel \"off\" and the special \"inherited\" mode that means \"use the\n * value resolved by the parent agent/session\".\n *\n * Pure UI primitive. No backend dependency. Consumer wires `value` from agent\n * state and persists `onChange` selections wherever it pleases.\n *\n * Phase 1 of `theokit-ui-parity-plan.md` (T1.1).\n */\n\nexport type ThinkingLevel = \"off\" | \"minimal\" | \"low\" | \"medium\" | \"high\" | \"xhigh\";\n\nexport type ThinkingLevelOrInherited = ThinkingLevel | \"inherited\";\n\nexport interface ThinkingLevelSelectorProps {\n  value: ThinkingLevelOrInherited;\n  inheritedValue?: ThinkingLevel;\n  onChange: (value: ThinkingLevelOrInherited) => void;\n  disabled?: boolean;\n  className?: string;\n  \"data-testid\"?: string;\n}\n\nconst OVERRIDE_OPTIONS: ThinkingLevel[] = [\"off\", \"minimal\", \"low\", \"medium\", \"high\", \"xhigh\"];\n\nfunction inheritedLabel(inheritedValue: ThinkingLevel | undefined): string {\n  if (inheritedValue === undefined) return \"Inherited\";\n  return `Inherited: ${inheritedValue}`;\n}\n\nfunction overrideLabel(level: ThinkingLevel): string {\n  if (level === \"off\") return \"Off\";\n  return `Override: ${level}`;\n}\n\nexport const ThinkingLevelSelector = forwardRef<HTMLSelectElement, ThinkingLevelSelectorProps>(\n  (\n    { value, inheritedValue, onChange, disabled = false, className, \"data-testid\": dataTestId },\n    ref,\n  ) => {\n    if (\n      process.env.NODE_ENV !== \"production\" &&\n      value === \"inherited\" &&\n      inheritedValue === undefined\n    ) {\n      // biome-ignore lint/suspicious/noConsole: dev-only warning when caller passes value=\"inherited\" without inheritedValue\n      console.warn(\n        '[ThinkingLevelSelector] value=\"inherited\" but no inheritedValue prop — rendering as \"Inherited: ?\".',\n      );\n    }\n    return (\n      <select\n        ref={ref}\n        aria-label=\"Thinking level\"\n        className={cn(\n          \"rounded-md border border-border bg-background px-2 py-1 text-sm\",\n          \"focus:outline-none focus:ring-2 focus:ring-primary\",\n          disabled && \"cursor-not-allowed opacity-50\",\n          className,\n        )}\n        disabled={disabled}\n        value={value}\n        onChange={(e) => onChange(e.target.value as ThinkingLevelOrInherited)}\n        data-testid={dataTestId ?? \"thinking-level-selector\"}\n      >\n        <option value=\"inherited\">{inheritedLabel(inheritedValue)}</option>\n        {OVERRIDE_OPTIONS.map((level) => (\n          <option key={level} value={level}>\n            {overrideLabel(level)}\n          </option>\n        ))}\n      </select>\n    );\n  },\n);\nThinkingLevelSelector.displayName = \"ThinkingLevelSelector\";\n"]}

package/dist/chunk-4WKO3G5C.js

@@ -0,0 +1,110 @@
+import { Input } from './chunk-B3VAJSZ2.js';
+import { Dialog } from './chunk-JRBGZ6NI.js';
+import { Button } from './chunk-5VOSCJKQ.js';
+import { Loader2 } from 'lucide-react';
+import { forwardRef, useState, useRef, useEffect } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var ConfirmDialog = forwardRef(
+  ({
+    open,
+    onOpenChange,
+    title,
+    description,
+    confirmLabel = "Confirm",
+    cancelLabel = "Cancel",
+    intent = "default",
+    confirmationPhrase,
+    onConfirm,
+    loading: externalLoading
+  }, ref) => {
+    const [phraseInput, setPhraseInput] = useState("");
+    const [internalLoading, setInternalLoading] = useState(false);
+    const cancelRef = useRef(null);
+    const phraseRequired = !!confirmationPhrase;
+    const phraseMatched = phraseRequired ? phraseInput === confirmationPhrase : true;
+    const showLoading = externalLoading === true || internalLoading;
+    const canConfirm = phraseMatched && !showLoading;
+    useEffect(() => {
+      if (!open) setPhraseInput("");
+    }, [open]);
+    useEffect(() => {
+      if (open) {
+        const id = window.setTimeout(() => cancelRef.current?.focus(), 0);
+        return () => window.clearTimeout(id);
+      }
+    }, [open]);
+    async function handleConfirm() {
+      if (!canConfirm) return;
+      setInternalLoading(true);
+      try {
+        await onConfirm();
+        onOpenChange(false);
+      } catch {
+      } finally {
+        setInternalLoading(false);
+      }
+    }
+    function handleInputKeyDown(e) {
+      if (e.key === "Enter" && canConfirm) {
+        e.preventDefault();
+        void handleConfirm();
+      }
+    }
+    return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(Dialog.Content, { ref, children: [
+      /* @__PURE__ */ jsxs(Dialog.Header, { children: [
+        /* @__PURE__ */ jsx(Dialog.Title, { children: title }),
+        /* @__PURE__ */ jsx(Dialog.Description, { children: description })
+      ] }),
+      phraseRequired ? /* @__PURE__ */ jsxs(Dialog.Body, { children: [
+        /* @__PURE__ */ jsxs("p", { className: "mb-2 text-body-sm text-muted-foreground", children: [
+          "Type",
+          " ",
+          /* @__PURE__ */ jsx("code", { className: "rounded bg-muted px-1 py-0.5 font-mono text-foreground", children: confirmationPhrase }),
+          " ",
+          "to confirm"
+        ] }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            value: phraseInput,
+            onChange: (e) => setPhraseInput(e.target.value),
+            onKeyDown: handleInputKeyDown,
+            autoComplete: "off",
+            "aria-label": "Confirmation phrase"
+          }
+        )
+      ] }) : null,
+      /* @__PURE__ */ jsxs(Dialog.Footer, { children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            ref: cancelRef,
+            variant: "secondary",
+            onClick: () => onOpenChange(false),
+            disabled: showLoading,
+            children: cancelLabel
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: intent === "destructive" ? "destructive" : "primary",
+            onClick: () => void handleConfirm(),
+            disabled: !canConfirm,
+            "data-confirm": true,
+            children: [
+              showLoading ? /* @__PURE__ */ jsx(Loader2, { "aria-hidden": "true", className: "size-4 animate-spin" }) : null,
+              confirmLabel
+            ]
+          }
+        )
+      ] })
+    ] }) });
+  }
+);
+ConfirmDialog.displayName = "ConfirmDialog";
+
+export { ConfirmDialog };
+//# sourceMappingURL=chunk-4WKO3G5C.js.map
+//# sourceMappingURL=chunk-4WKO3G5C.js.map