@flanksource/clicky-ui 0.3.21 → 0.3.23

package/dist/data/ai/SpecRuntimeEditor/SandboxSection.js

@@ -0,0 +1,247 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { Icon } from "../../Icon.js";
+import { modeForBackend, SPEC_RUNTIME_FAMILIES } from "../../runtime/runtime-mode.js";
+import { SandboxCreateWizard } from "../SandboxCreateWizard.js";
+import { sandboxKindMeta } from "../sandbox-kind-meta.js";
+import { SpecField, SpecSelect, SpecButton, Disclosure, ListField, NumberField } from "./fields.js";
+import { sandboxRef, withSandboxBackend, withSandbox, withSandboxPolicy } from "./update.js";
+import { UiBox } from "../../../icons/components/UiBox.js";
+import { UiAdd } from "../../../icons/components/UiAdd.js";
+import { UiRobotAi } from "../../../icons/components/UiRobotAi.js";
+import { UiRepeat } from "../../../icons/components/UiRepeat.js";
+import { UiWarningTriangle } from "../../../icons/components/UiWarningTriangle.js";
+function flattenCatalog(catalog, additions) {
+  var _a;
+  const shadowed = /* @__PURE__ */ new Set();
+  for (const kind of catalog.kinds ?? []) {
+    for (const backend of kind.backends ?? []) shadowed.add(backend.name);
+  }
+  for (const backend of additions) shadowed.add(backend.name);
+  const options = [];
+  for (const kind of catalog.kinds ?? []) {
+    const meta = sandboxKindMeta(kind.kind);
+    if (!shadowed.has(kind.kind)) {
+      options.push({
+        selector: kind.kind,
+        kind: kind.kind,
+        label: meta.label,
+        description: kind.description ?? "",
+        capabilities: kind.capabilities ?? [],
+        modes: kind.modes ?? [],
+        agents: []
+      });
+    }
+    for (const backend of kind.backends ?? []) {
+      options.push({
+        selector: backend.name,
+        kind: kind.kind,
+        // A configured backend is only meaningful next to the adapter it selects.
+        label: `${backend.name} (${meta.label})`,
+        description: kind.description ?? "",
+        capabilities: kind.capabilities ?? [],
+        modes: kind.modes ?? [],
+        agents: (backend.agents ?? []).filter((agent) => agent.status === "enrolled" && agent.dispatchable).map((agent) => agent.name)
+      });
+    }
+  }
+  const selectors = new Set(options.map((option) => option.selector));
+  for (const backend of additions) {
+    if (selectors.has(backend.name)) continue;
+    const kind = (_a = catalog.kinds) == null ? void 0 : _a.find((item) => item.kind === backend.kind);
+    if (!kind) continue;
+    options.push({
+      selector: backend.name,
+      kind: kind.kind,
+      label: `${backend.name} (${sandboxKindMeta(kind.kind).label})`,
+      description: kind.description ?? "",
+      capabilities: kind.capabilities ?? [],
+      modes: kind.modes ?? [],
+      agents: (backend.agents ?? []).filter((agent) => agent.status === "enrolled" && agent.dispatchable).map((agent) => agent.name)
+    });
+  }
+  return options;
+}
+function has(option, capability) {
+  return (option == null ? void 0 : option.capabilities.includes(capability)) ?? false;
+}
+function workspaceIsolates(value) {
+  var _a, _b;
+  const checkout = (_a = value.setup) == null ? void 0 : _a.checkout;
+  if (!checkout) return false;
+  const worktree = (_b = checkout.worktree) == null ? void 0 : _b.mode;
+  return checkout.mode != null && checkout.mode !== "none" || worktree != null && worktree !== "none";
+}
+function SandboxWarning({ children }) {
+  return /* @__PURE__ */ jsxs(
+    "p",
+    {
+      role: "status",
+      className: "flex items-start gap-1.5 rounded-md border border-amber-500/40 bg-amber-500/10 px-density-2 py-1.5 text-xs text-amber-700 dark:text-amber-300",
+      children: [
+        /* @__PURE__ */ jsx(Icon, { icon: UiWarningTriangle, className: "mt-0.5 size-3.5 shrink-0" }),
+        /* @__PURE__ */ jsx("span", { children })
+      ]
+    }
+  );
+}
+function SandboxSection({
+  value,
+  onChange,
+  catalog,
+  createConfig,
+  // Same fallback as ModelSection: without it a host that does not pass a
+  // catalog cannot resolve the runtime mode, and the pairing check goes silent.
+  families = SPEC_RUNTIME_FAMILIES
+}) {
+  var _a, _b, _c;
+  const [creating, setCreating] = useState(false);
+  const [createdBackends, setCreatedBackends] = useState([]);
+  const options = flattenCatalog(catalog, createdBackends);
+  const ref = sandboxRef(value);
+  const selected = options.find((option) => option.selector === ref.backend);
+  const mode = ((_a = modeForBackend(families, value.backend)) == null ? void 0 : _a.id) ?? "";
+  const modeUnsupported = selected != null && mode !== "" && selected.modes.length > 0 && !selected.modes.includes(mode);
+  const remote = has(selected, "remote-exec");
+  const isolates = has(selected, "isolate-workspace");
+  return /* @__PURE__ */ jsxs("div", { className: "grid gap-density-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-end gap-density-3", children: [
+      /* @__PURE__ */ jsx("div", { className: "min-w-56 flex-1", children: /* @__PURE__ */ jsx(
+        SpecField,
+        {
+          label: "Sandbox",
+          hint: catalog.default ? `default: ${catalog.default}` : void 0,
+          composite: true,
+          children: /* @__PURE__ */ jsx(
+            SpecSelect,
+            {
+              ariaLabel: "Sandbox",
+              value: ref.backend ?? "",
+              onChange: (backend) => onChange(withSandboxBackend(value, backend)),
+              options: [
+                {
+                  value: "",
+                  label: `Inherit (${catalog.default || "none"})`,
+                  icon: /* @__PURE__ */ jsx(UiBox, {})
+                },
+                ...options.map((option) => {
+                  const KindIcon = sandboxKindMeta(option.kind).icon;
+                  return {
+                    value: option.selector,
+                    label: option.label,
+                    ...option.description ? { description: option.description } : {},
+                    icon: /* @__PURE__ */ jsx(KindIcon, {})
+                  };
+                })
+              ]
+            }
+          )
+        }
+      ) }),
+      createConfig && /* @__PURE__ */ jsxs(
+        SpecButton,
+        {
+          ariaLabel: "Create sandbox",
+          onClick: () => setCreating(true),
+          children: [
+            /* @__PURE__ */ jsx(Icon, { icon: UiAdd, className: "size-3.5" }),
+            "Create sandbox"
+          ]
+        }
+      ),
+      remote && /* @__PURE__ */ jsx("div", { className: "min-w-48 flex-1", children: /* @__PURE__ */ jsx(
+        SpecField,
+        {
+          label: "Agent",
+          hint: (selected == null ? void 0 : selected.agents.length) ? void 0 : "none dispatchable",
+          composite: true,
+          children: /* @__PURE__ */ jsx(
+            SpecSelect,
+            {
+              ariaLabel: "Pinned agent",
+              icon: UiRobotAi,
+              value: ref.agent ?? "",
+              onChange: (agent) => onChange(withSandbox(value, { agent })),
+              options: [
+                { value: "", label: "Any dispatchable agent" },
+                ...((selected == null ? void 0 : selected.agents) ?? []).map((agent) => ({
+                  value: agent,
+                  label: agent
+                }))
+              ]
+            }
+          )
+        }
+      ) })
+    ] }),
+    (selected == null ? void 0 : selected.description) && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: selected.description }),
+    selected && selected.capabilities.length > 0 && /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-1", "aria-label": "Sandbox capabilities", children: selected.capabilities.map((capability) => /* @__PURE__ */ jsx(
+      "li",
+      {
+        className: "rounded-full border border-border bg-muted px-2 py-0.5 font-mono text-[10px] text-muted-foreground",
+        children: capability
+      },
+      capability
+    )) }),
+    modeUnsupported && /* @__PURE__ */ jsxs(SandboxWarning, { children: [
+      "Sandbox ",
+      /* @__PURE__ */ jsx("code", { children: ref.backend }),
+      " does not support runtime mode",
+      " ",
+      /* @__PURE__ */ jsx("code", { children: mode }),
+      "; it supports ",
+      selected == null ? void 0 : selected.modes.join(", "),
+      "."
+    ] }),
+    isolates && workspaceIsolates(value) && /* @__PURE__ */ jsxs(SandboxWarning, { children: [
+      /* @__PURE__ */ jsx("code", { children: ref.backend }),
+      " materializes its own working tree, so it cannot be combined with the checkout or worktree set in Workspace. Register exactly one isolator."
+    ] }),
+    selected && /* @__PURE__ */ jsx(Disclosure, { label: "Policy", hint: "paths, attempts", children: /* @__PURE__ */ jsxs("div", { className: "grid gap-density-3", children: [
+      /* @__PURE__ */ jsx(
+        ListField,
+        {
+          label: "Paths",
+          value: (_b = ref.policy) == null ? void 0 : _b.paths,
+          onChange: (paths) => onChange(withSandboxPolicy(value, { paths })),
+          placeholder: "pkg/**\n!**/*.pem"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "w-40", children: /* @__PURE__ */ jsx(
+        NumberField,
+        {
+          label: "Max attempts",
+          value: (_c = ref.policy) == null ? void 0 : _c.maxAttempts,
+          onChange: (maxAttempts) => onChange(
+            withSandboxPolicy(value, { maxAttempts: maxAttempts ?? 0 })
+          ),
+          icon: UiRepeat,
+          min: 0,
+          step: 1,
+          integer: true
+        }
+      ) })
+    ] }) }),
+    createConfig && /* @__PURE__ */ jsx(
+      SandboxCreateWizard,
+      {
+        open: creating,
+        catalog,
+        config: createConfig,
+        onClose: () => setCreating(false),
+        onCreated: (backend, input) => {
+          const created = { ...backend, kind: backend.kind ?? input.kind };
+          setCreatedBackends((current) => [
+            ...current.filter((item) => item.name !== created.name),
+            created
+          ]);
+          onChange(withSandboxBackend(value, created.name));
+        }
+      }
+    )
+  ] });
+}
+export {
+  SandboxSection
+};
+//# sourceMappingURL=SandboxSection.js.map

package/dist/data/ai/SpecRuntimeEditor/SandboxSection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SandboxSection.js","sources":["../../../../src/data/ai/SpecRuntimeEditor/SandboxSection.tsx"],"sourcesContent":["import { useState, type ReactNode } from \"react\";\n\nimport {\n  UiAdd,\n  UiBox,\n  UiRepeat,\n  UiRobotAi,\n  UiWarningTriangle,\n} from \"../../../icons\";\nimport { Icon } from \"../../Icon\";\nimport {\n  SPEC_RUNTIME_FAMILIES,\n  modeForBackend,\n  type SpecRuntimeFamily,\n} from \"../../runtime/runtime-mode\";\nimport type {\n  AISpecRuntimeValue,\n  SpecSandboxCapability,\n} from \"../SpecRuntimeEditor.model\";\nimport { SandboxCreateWizard } from \"../SandboxCreateWizard\";\nimport type { SpecRuntimeSandboxCreateConfig } from \"../SandboxCreateWizard.model\";\nimport { sandboxKindMeta } from \"../sandbox-kind-meta\";\nimport {\n  Disclosure,\n  ListField,\n  NumberField,\n  SpecButton,\n  SpecField,\n  SpecSelect,\n} from \"./fields\";\nimport type {\n  SpecRuntimeSandboxBackend,\n  SpecRuntimeSandboxCatalog,\n} from \"./types\";\nimport {\n  sandboxRef,\n  withSandbox,\n  withSandboxBackend,\n  withSandboxPolicy,\n} from \"./update\";\n\n/** One selectable entry, flattened from the catalog's kinds + their backends. */\ntype SandboxOption = {\n  selector: string;\n  kind: string;\n  label: string;\n  description: string;\n  capabilities: SpecSandboxCapability[];\n  modes: string[];\n  agents: string[];\n};\n\nfunction flattenCatalog(\n  catalog: SpecRuntimeSandboxCatalog,\n  additions: SpecRuntimeSandboxBackend[],\n): SandboxOption[] {\n  // A configured backend shadows a bare kind of the same name, because captain's\n  // SandboxDefaults.Resolve looks in Backends before adapter kinds. Both entries\n  // would write the identical selector, so emitting the kind too offers one\n  // choice twice — and the roster-less kind entry wins the `selected` lookup\n  // below, hiding the backend's enrolled agents.\n  const shadowed = new Set<string>();\n  for (const kind of catalog.kinds ?? []) {\n    for (const backend of kind.backends ?? []) shadowed.add(backend.name);\n  }\n  for (const backend of additions) shadowed.add(backend.name);\n\n  const options: SandboxOption[] = [];\n  for (const kind of catalog.kinds ?? []) {\n    const meta = sandboxKindMeta(kind.kind);\n    if (!shadowed.has(kind.kind)) {\n      options.push({\n        selector: kind.kind,\n        kind: kind.kind,\n        label: meta.label,\n        description: kind.description ?? \"\",\n        capabilities: kind.capabilities ?? [],\n        modes: kind.modes ?? [],\n        agents: [],\n      });\n    }\n    for (const backend of kind.backends ?? []) {\n      options.push({\n        selector: backend.name,\n        kind: kind.kind,\n        // A configured backend is only meaningful next to the adapter it selects.\n        label: `${backend.name} (${meta.label})`,\n        description: kind.description ?? \"\",\n        capabilities: kind.capabilities ?? [],\n        modes: kind.modes ?? [],\n        agents: (backend.agents ?? [])\n          .filter((agent) => agent.status === \"enrolled\" && agent.dispatchable)\n          .map((agent) => agent.name),\n      });\n    }\n  }\n  const selectors = new Set(options.map((option) => option.selector));\n  for (const backend of additions) {\n    if (selectors.has(backend.name)) continue;\n    const kind = catalog.kinds?.find((item) => item.kind === backend.kind);\n    if (!kind) continue;\n    options.push({\n      selector: backend.name,\n      kind: kind.kind,\n      label: `${backend.name} (${sandboxKindMeta(kind.kind).label})`,\n      description: kind.description ?? \"\",\n      capabilities: kind.capabilities ?? [],\n      modes: kind.modes ?? [],\n      agents: (backend.agents ?? [])\n        .filter((agent) => agent.status === \"enrolled\" && agent.dispatchable)\n        .map((agent) => agent.name),\n    });\n  }\n  return options;\n}\n\nfunction has(\n  option: SandboxOption | undefined,\n  capability: SpecSandboxCapability,\n) {\n  return option?.capabilities.includes(capability) ?? false;\n}\n\n/**\n * True when the Workspace section already establishes a working tree. A sandbox\n * declaring `isolate-workspace` materializes its own, and captain refuses to\n * register two isolators for one run.\n */\nfunction workspaceIsolates(value: AISpecRuntimeValue) {\n  const checkout = value.setup?.checkout;\n  if (!checkout) return false;\n  const worktree = checkout.worktree?.mode;\n  return (\n    (checkout.mode != null && checkout.mode !== \"none\") ||\n    (worktree != null && worktree !== \"none\")\n  );\n}\n\nfunction SandboxWarning({ children }: { children: ReactNode }) {\n  return (\n    <p\n      role=\"status\"\n      className=\"flex items-start gap-1.5 rounded-md border border-amber-500/40 bg-amber-500/10 px-density-2 py-1.5 text-xs text-amber-700 dark:text-amber-300\"\n    >\n      <Icon icon={UiWarningTriangle} className=\"mt-0.5 size-3.5 shrink-0\" />\n      <span>{children}</span>\n    </p>\n  );\n}\n\nexport function SandboxSection({\n  value,\n  onChange,\n  catalog,\n  createConfig,\n  // Same fallback as ModelSection: without it a host that does not pass a\n  // catalog cannot resolve the runtime mode, and the pairing check goes silent.\n  families = SPEC_RUNTIME_FAMILIES,\n}: {\n  value: AISpecRuntimeValue;\n  onChange: (value: AISpecRuntimeValue) => void;\n  catalog: SpecRuntimeSandboxCatalog;\n  createConfig?: SpecRuntimeSandboxCreateConfig | undefined;\n  families?: SpecRuntimeFamily[] | undefined;\n}) {\n  const [creating, setCreating] = useState(false);\n  const [createdBackends, setCreatedBackends] = useState<\n    SpecRuntimeSandboxBackend[]\n  >([]);\n  const options = flattenCatalog(catalog, createdBackends);\n  const ref = sandboxRef(value);\n  const selected = options.find((option) => option.selector === ref.backend);\n  // The spec carries no runtime mode of its own — the Model section's two-axis\n  // picker writes a concrete `backend`, and the mode is the axis it came from.\n  const mode = modeForBackend(families, value.backend)?.id ?? \"\";\n\n  // The descriptor table declares which runtime modes an adapter can serve, and\n  // captain rejects a pairing outside it before the run starts. Surfacing it\n  // here turns a dispatch-time failure into a visible one.\n  const modeUnsupported =\n    selected != null &&\n    mode !== \"\" &&\n    selected.modes.length > 0 &&\n    !selected.modes.includes(mode);\n\n  const remote = has(selected, \"remote-exec\");\n  const isolates = has(selected, \"isolate-workspace\");\n\n  return (\n    <div className=\"grid gap-density-3\">\n      <div className=\"flex flex-wrap items-end gap-density-3\">\n        <div className=\"min-w-56 flex-1\">\n          <SpecField\n            label=\"Sandbox\"\n            hint={catalog.default ? `default: ${catalog.default}` : undefined}\n            composite\n          >\n            <SpecSelect\n              ariaLabel=\"Sandbox\"\n              value={ref.backend ?? \"\"}\n              onChange={(backend) =>\n                onChange(withSandboxBackend(value, backend))\n              }\n              options={[\n                {\n                  value: \"\",\n                  label: `Inherit (${catalog.default || \"none\"})`,\n                  icon: <UiBox />,\n                },\n                ...options.map((option) => {\n                  const KindIcon = sandboxKindMeta(option.kind).icon;\n                  return {\n                    value: option.selector,\n                    label: option.label,\n                    ...(option.description\n                      ? { description: option.description }\n                      : {}),\n                    icon: <KindIcon />,\n                  };\n                }),\n              ]}\n            />\n          </SpecField>\n        </div>\n        {createConfig && (\n          <SpecButton\n            ariaLabel=\"Create sandbox\"\n            onClick={() => setCreating(true)}\n          >\n            <Icon icon={UiAdd} className=\"size-3.5\" />\n            Create sandbox\n          </SpecButton>\n        )}\n        {remote && (\n          <div className=\"min-w-48 flex-1\">\n            <SpecField\n              label=\"Agent\"\n              hint={selected?.agents.length ? undefined : \"none dispatchable\"}\n              composite\n            >\n              <SpecSelect\n                ariaLabel=\"Pinned agent\"\n                icon={UiRobotAi}\n                value={ref.agent ?? \"\"}\n                onChange={(agent) => onChange(withSandbox(value, { agent }))}\n                options={[\n                  { value: \"\", label: \"Any dispatchable agent\" },\n                  ...(selected?.agents ?? []).map((agent) => ({\n                    value: agent,\n                    label: agent,\n                  })),\n                ]}\n              />\n            </SpecField>\n          </div>\n        )}\n      </div>\n\n      {selected?.description && (\n        <p className=\"text-xs text-muted-foreground\">{selected.description}</p>\n      )}\n\n      {selected && selected.capabilities.length > 0 && (\n        <ul className=\"flex flex-wrap gap-1\" aria-label=\"Sandbox capabilities\">\n          {selected.capabilities.map((capability) => (\n            <li\n              key={capability}\n              className=\"rounded-full border border-border bg-muted px-2 py-0.5 font-mono text-[10px] text-muted-foreground\"\n            >\n              {capability}\n            </li>\n          ))}\n        </ul>\n      )}\n\n      {modeUnsupported && (\n        <SandboxWarning>\n          Sandbox <code>{ref.backend}</code> does not support runtime mode{\" \"}\n          <code>{mode}</code>; it supports {selected?.modes.join(\", \")}.\n        </SandboxWarning>\n      )}\n\n      {isolates && workspaceIsolates(value) && (\n        <SandboxWarning>\n          <code>{ref.backend}</code> materializes its own working tree, so it\n          cannot be combined with the checkout or worktree set in Workspace.\n          Register exactly one isolator.\n        </SandboxWarning>\n      )}\n\n      {selected && (\n        <Disclosure label=\"Policy\" hint=\"paths, attempts\">\n          <div className=\"grid gap-density-3\">\n            <ListField\n              label=\"Paths\"\n              value={ref.policy?.paths}\n              onChange={(paths) =>\n                onChange(withSandboxPolicy(value, { paths }))\n              }\n              placeholder={\"pkg/**\\n!**/*.pem\"}\n            />\n            <div className=\"w-40\">\n              <NumberField\n                label=\"Max attempts\"\n                value={ref.policy?.maxAttempts}\n                onChange={(maxAttempts) =>\n                  onChange(\n                    withSandboxPolicy(value, { maxAttempts: maxAttempts ?? 0 }),\n                  )\n                }\n                icon={UiRepeat}\n                min={0}\n                step={1}\n                integer\n              />\n            </div>\n          </div>\n        </Disclosure>\n      )}\n      {createConfig && (\n        <SandboxCreateWizard\n          open={creating}\n          catalog={catalog}\n          config={createConfig}\n          onClose={() => setCreating(false)}\n          onCreated={(backend, input) => {\n            const created = { ...backend, kind: backend.kind ?? input.kind };\n            setCreatedBackends((current) => [\n              ...current.filter((item) => item.name !== created.name),\n              created,\n            ]);\n            onChange(withSandboxBackend(value, created.name));\n          }}\n        />\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;AAoDA,SAAS,eACP,SACA,WACiB;;AAMjB,QAAM,+BAAe,IAAA;AACrB,aAAW,QAAQ,QAAQ,SAAS,CAAA,GAAI;AACtC,eAAW,WAAW,KAAK,YAAY,CAAA,EAAI,UAAS,IAAI,QAAQ,IAAI;AAAA,EACtE;AACA,aAAW,WAAW,UAAW,UAAS,IAAI,QAAQ,IAAI;AAE1D,QAAM,UAA2B,CAAA;AACjC,aAAW,QAAQ,QAAQ,SAAS,CAAA,GAAI;AACtC,UAAM,OAAO,gBAAgB,KAAK,IAAI;AACtC,QAAI,CAAC,SAAS,IAAI,KAAK,IAAI,GAAG;AAC5B,cAAQ,KAAK;AAAA,QACX,UAAU,KAAK;AAAA,QACf,MAAM,KAAK;AAAA,QACX,OAAO,KAAK;AAAA,QACZ,aAAa,KAAK,eAAe;AAAA,QACjC,cAAc,KAAK,gBAAgB,CAAA;AAAA,QACnC,OAAO,KAAK,SAAS,CAAA;AAAA,QACrB,QAAQ,CAAA;AAAA,MAAC,CACV;AAAA,IACH;AACA,eAAW,WAAW,KAAK,YAAY,CAAA,GAAI;AACzC,cAAQ,KAAK;AAAA,QACX,UAAU,QAAQ;AAAA,QAClB,MAAM,KAAK;AAAA;AAAA,QAEX,OAAO,GAAG,QAAQ,IAAI,KAAK,KAAK,KAAK;AAAA,QACrC,aAAa,KAAK,eAAe;AAAA,QACjC,cAAc,KAAK,gBAAgB,CAAA;AAAA,QACnC,OAAO,KAAK,SAAS,CAAA;AAAA,QACrB,SAAS,QAAQ,UAAU,CAAA,GACxB,OAAO,CAAC,UAAU,MAAM,WAAW,cAAc,MAAM,YAAY,EACnE,IAAI,CAAC,UAAU,MAAM,IAAI;AAAA,MAAA,CAC7B;AAAA,IACH;AAAA,EACF;AACA,QAAM,YAAY,IAAI,IAAI,QAAQ,IAAI,CAAC,WAAW,OAAO,QAAQ,CAAC;AAClE,aAAW,WAAW,WAAW;AAC/B,QAAI,UAAU,IAAI,QAAQ,IAAI,EAAG;AACjC,UAAM,QAAO,aAAQ,UAAR,mBAAe,KAAK,CAAC,SAAS,KAAK,SAAS,QAAQ;AACjE,QAAI,CAAC,KAAM;AACX,YAAQ,KAAK;AAAA,MACX,UAAU,QAAQ;AAAA,MAClB,MAAM,KAAK;AAAA,MACX,OAAO,GAAG,QAAQ,IAAI,KAAK,gBAAgB,KAAK,IAAI,EAAE,KAAK;AAAA,MAC3D,aAAa,KAAK,eAAe;AAAA,MACjC,cAAc,KAAK,gBAAgB,CAAA;AAAA,MACnC,OAAO,KAAK,SAAS,CAAA;AAAA,MACrB,SAAS,QAAQ,UAAU,CAAA,GACxB,OAAO,CAAC,UAAU,MAAM,WAAW,cAAc,MAAM,YAAY,EACnE,IAAI,CAAC,UAAU,MAAM,IAAI;AAAA,IAAA,CAC7B;AAAA,EACH;AACA,SAAO;AACT;AAEA,SAAS,IACP,QACA,YACA;AACA,UAAO,iCAAQ,aAAa,SAAS,gBAAe;AACtD;AAOA,SAAS,kBAAkB,OAA2B;;AACpD,QAAM,YAAW,WAAM,UAAN,mBAAa;AAC9B,MAAI,CAAC,SAAU,QAAO;AACtB,QAAM,YAAW,cAAS,aAAT,mBAAmB;AACpC,SACG,SAAS,QAAQ,QAAQ,SAAS,SAAS,UAC3C,YAAY,QAAQ,aAAa;AAEtC;AAEA,SAAS,eAAe,EAAE,YAAqC;AAC7D,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAU;AAAA,MAEV,UAAA;AAAA,QAAA,oBAAC,MAAA,EAAK,MAAM,mBAAmB,WAAU,4BAA2B;AAAA,QACpE,oBAAC,UAAM,SAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGtB;AAEO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAAA;AAAA,EAGA,WAAW;AACb,GAMG;;AACD,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAE5C,CAAA,CAAE;AACJ,QAAM,UAAU,eAAe,SAAS,eAAe;AACvD,QAAM,MAAM,WAAW,KAAK;AAC5B,QAAM,WAAW,QAAQ,KAAK,CAAC,WAAW,OAAO,aAAa,IAAI,OAAO;AAGzE,QAAM,SAAO,oBAAe,UAAU,MAAM,OAAO,MAAtC,mBAAyC,OAAM;AAK5D,QAAM,kBACJ,YAAY,QACZ,SAAS,MACT,SAAS,MAAM,SAAS,KACxB,CAAC,SAAS,MAAM,SAAS,IAAI;AAE/B,QAAM,SAAS,IAAI,UAAU,aAAa;AAC1C,QAAM,WAAW,IAAI,UAAU,mBAAmB;AAElD,SACE,qBAAC,OAAA,EAAI,WAAU,sBACb,UAAA;AAAA,IAAA,qBAAC,OAAA,EAAI,WAAU,0CACb,UAAA;AAAA,MAAA,oBAAC,OAAA,EAAI,WAAU,mBACb,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,MAAM,QAAQ,UAAU,YAAY,QAAQ,OAAO,KAAK;AAAA,UACxD,WAAS;AAAA,UAET,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO,IAAI,WAAW;AAAA,cACtB,UAAU,CAAC,YACT,SAAS,mBAAmB,OAAO,OAAO,CAAC;AAAA,cAE7C,SAAS;AAAA,gBACP;AAAA,kBACE,OAAO;AAAA,kBACP,OAAO,YAAY,QAAQ,WAAW,MAAM;AAAA,kBAC5C,0BAAO,OAAA,CAAA,CAAM;AAAA,gBAAA;AAAA,gBAEf,GAAG,QAAQ,IAAI,CAAC,WAAW;AACzB,wBAAM,WAAW,gBAAgB,OAAO,IAAI,EAAE;AAC9C,yBAAO;AAAA,oBACL,OAAO,OAAO;AAAA,oBACd,OAAO,OAAO;AAAA,oBACd,GAAI,OAAO,cACP,EAAE,aAAa,OAAO,YAAA,IACtB,CAAA;AAAA,oBACJ,0BAAO,UAAA,CAAA,CAAS;AAAA,kBAAA;AAAA,gBAEpB,CAAC;AAAA,cAAA;AAAA,YACH;AAAA,UAAA;AAAA,QACF;AAAA,MAAA,GAEJ;AAAA,MACC,gBACC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,SAAS,MAAM,YAAY,IAAI;AAAA,UAE/B,UAAA;AAAA,YAAA,oBAAC,MAAA,EAAK,MAAM,OAAO,WAAU,YAAW;AAAA,YAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAI7C,UACC,oBAAC,OAAA,EAAI,WAAU,mBACb,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,OAAM,qCAAU,OAAO,UAAS,SAAY;AAAA,UAC5C,WAAS;AAAA,UAET,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,MAAM;AAAA,cACN,OAAO,IAAI,SAAS;AAAA,cACpB,UAAU,CAAC,UAAU,SAAS,YAAY,OAAO,EAAE,MAAA,CAAO,CAAC;AAAA,cAC3D,SAAS;AAAA,gBACP,EAAE,OAAO,IAAI,OAAO,yBAAA;AAAA,gBACpB,KAAI,qCAAU,WAAU,CAAA,GAAI,IAAI,CAAC,WAAW;AAAA,kBAC1C,OAAO;AAAA,kBACP,OAAO;AAAA,gBAAA,EACP;AAAA,cAAA;AAAA,YACJ;AAAA,UAAA;AAAA,QACF;AAAA,MAAA,EACF,CACF;AAAA,IAAA,GAEJ;AAAA,KAEC,qCAAU,gBACT,oBAAC,OAAE,WAAU,iCAAiC,mBAAS,aAAY;AAAA,IAGpE,YAAY,SAAS,aAAa,SAAS,KAC1C,oBAAC,MAAA,EAAG,WAAU,wBAAuB,cAAW,wBAC7C,UAAA,SAAS,aAAa,IAAI,CAAC,eAC1B;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAU;AAAA,QAET,UAAA;AAAA,MAAA;AAAA,MAHI;AAAA,IAAA,CAKR,GACH;AAAA,IAGD,wCACE,gBAAA,EAAe,UAAA;AAAA,MAAA;AAAA,MACN,oBAAC,QAAA,EAAM,UAAA,IAAI,QAAA,CAAQ;AAAA,MAAO;AAAA,MAA+B;AAAA,MACjE,oBAAC,UAAM,UAAA,KAAA,CAAK;AAAA,MAAO;AAAA,MAAe,qCAAU,MAAM,KAAK;AAAA,MAAM;AAAA,IAAA,GAC/D;AAAA,IAGD,YAAY,kBAAkB,KAAK,0BACjC,gBAAA,EACC,UAAA;AAAA,MAAA,oBAAC,QAAA,EAAM,cAAI,QAAA,CAAQ;AAAA,MAAO;AAAA,IAAA,GAG5B;AAAA,IAGD,YACC,oBAAC,YAAA,EAAW,OAAM,UAAS,MAAK,mBAC9B,UAAA,qBAAC,OAAA,EAAI,WAAU,sBACb,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,QAAO,SAAI,WAAJ,mBAAY;AAAA,UACnB,UAAU,CAAC,UACT,SAAS,kBAAkB,OAAO,EAAE,MAAA,CAAO,CAAC;AAAA,UAE9C,aAAa;AAAA,QAAA;AAAA,MAAA;AAAA,MAEf,oBAAC,OAAA,EAAI,WAAU,QACb,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,QAAO,SAAI,WAAJ,mBAAY;AAAA,UACnB,UAAU,CAAC,gBACT;AAAA,YACE,kBAAkB,OAAO,EAAE,aAAa,eAAe,GAAG;AAAA,UAAA;AAAA,UAG9D,MAAM;AAAA,UACN,KAAK;AAAA,UACL,MAAM;AAAA,UACN,SAAO;AAAA,QAAA;AAAA,MAAA,EACT,CACF;AAAA,IAAA,EAAA,CACF,EAAA,CACF;AAAA,IAED,gBACC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAM;AAAA,QACN;AAAA,QACA,QAAQ;AAAA,QACR,SAAS,MAAM,YAAY,KAAK;AAAA,QAChC,WAAW,CAAC,SAAS,UAAU;AAC7B,gBAAM,UAAU,EAAE,GAAG,SAAS,MAAM,QAAQ,QAAQ,MAAM,KAAA;AAC1D,6BAAmB,CAAC,YAAY;AAAA,YAC9B,GAAG,QAAQ,OAAO,CAAC,SAAS,KAAK,SAAS,QAAQ,IAAI;AAAA,YACtD;AAAA,UAAA,CACD;AACD,mBAAS,mBAAmB,OAAO,QAAQ,IAAI,CAAC;AAAA,QAClD;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GAEJ;AAEJ;"}

package/dist/data/ai/SpecRuntimeEditor/fields.cjs

@@ -2,19 +2,21 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const react = require("react");
+const Combobox = require("../../../components/Combobox.cjs");
 const InputField = require("../../../components/InputField.cjs");
 const Switch = require("../../../components/Switch.cjs");
 const Icon = require("../../Icon.cjs");
 const utils = require("../../../lib/utils.cjs");
 const UiChevronDown = require("../../../icons/components/UiChevronDown.cjs");
 const UiChevronRight = require("../../../icons/components/UiChevronRight.cjs");
-const controlClassName = "h-control-h w-full rounded-md border border-border bg-background px-density-2 text-sm outline-none focus:ring-2 focus:ring-ring";
+const EMPTY_SELECT_VALUE = "__clicky_spec_select_empty__";
 function SpecField({
   label,
   hint,
-  children
+  children,
+  composite = false
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "block min-w-0 space-y-1 text-xs text-muted-foreground", children: [
+  const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
       label,
       hint && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground/70", children: [
@@ -25,6 +27,10 @@ function SpecField({
     ] }),
     children
   ] });
+  if (composite) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "block min-w-0 space-y-1 text-xs text-muted-foreground", children: content });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("label", { className: "block min-w-0 space-y-1 text-xs text-muted-foreground", children: content });
 }
 function SpecInput({
   value,
@@ -52,29 +58,32 @@ function SpecSelect({
   onChange,
   ariaLabel,
   icon,
-  children
+  options
 }) {
-  const select = /* @__PURE__ */ jsxRuntime.jsx(
-    "select",
+  if (options.some((option) => option.value === EMPTY_SELECT_VALUE)) {
+    throw new Error(
+      `SpecSelect option value ${JSON.stringify(EMPTY_SELECT_VALUE)} is reserved`
+    );
+  }
+  const hasEmptyOption = options.some((option) => option.value === "");
+  const comboboxOptions = options.map(
+    (option) => option.value === "" ? { ...option, value: EMPTY_SELECT_VALUE } : option
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Combobox.Combobox,
     {
-      "aria-label": ariaLabel,
-      value,
-      onChange: (event) => onChange(event.target.value),
-      className: utils.cn(controlClassName, icon && "pl-8"),
-      children
+      ariaLabel,
+      value: value === "" && hasEmptyOption ? EMPTY_SELECT_VALUE : value,
+      options: comboboxOptions,
+      onChange: (next) => onChange(next === EMPTY_SELECT_VALUE && hasEmptyOption ? "" : next),
+      allowCustomValue: false,
+      required: true,
+      className: "bg-background",
+      ...icon ? {
+        prefix: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon, className: "size-4 text-muted-foreground/70" })
+      } : {}
     }
   );
-  if (!icon) return select;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      Icon.Icon,
-      {
-        icon,
-        className: "pointer-events-none absolute left-2 top-1/2 size-4 -translate-y-1/2 text-muted-foreground/70"
-      }
-    ),
-    select
-  ] });
 }
 function SpecButton({
   onClick,

package/dist/data/ai/SpecRuntimeEditor/fields.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"fields.cjs","sources":["../../../../src/data/ai/SpecRuntimeEditor/fields.tsx"],"sourcesContent":["import { useState, type ReactNode } from \"react\";\nimport { InputField } from \"../../../components/InputField\";\nimport { Switch } from \"../../../components/Switch\";\nimport { Icon, type StaticIconComponent } from \"../../Icon\";\nimport { UiChevronDown, UiChevronRight } from \"../../../icons\";\nimport { cn } from \"../../../lib/utils\";\n\nconst controlClassName =\n  \"h-control-h w-full rounded-md border border-border bg-background px-density-2 text-sm outline-none focus:ring-2 focus:ring-ring\";\n\nexport function SpecField({\n  label,\n  hint,\n  children,\n}: {\n  label: string;\n  hint?: string | undefined;\n  children: ReactNode;\n}) {\n  return (\n    <label className=\"block min-w-0 space-y-1 text-xs text-muted-foreground\">\n      <span>\n        {label}\n        {hint && <span className=\"text-muted-foreground/70\"> ({hint})</span>}\n      </span>\n      {children}\n    </label>\n  );\n}\n\nexport function SpecInput({\n  value,\n  onChange,\n  placeholder,\n  ariaLabel,\n  icon,\n  mono = false,\n}: {\n  value?: string | undefined;\n  onChange: (value: string) => void;\n  placeholder?: string | undefined;\n  ariaLabel?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n  mono?: boolean | undefined;\n}) {\n  return (\n    <InputField\n      aria-label={ariaLabel}\n      value={value ?? \"\"}\n      onChange={onChange}\n      placeholder={placeholder}\n      prefix={\n        icon ? (\n          <Icon icon={icon} className=\"size-4 text-muted-foreground/70\" />\n        ) : undefined\n      }\n      inputClassName={cn(mono && \"font-mono text-xs\")}\n      className=\"bg-background\"\n    />\n  );\n}\n\nexport function SpecSelect({\n  value,\n  onChange,\n  ariaLabel,\n  icon,\n  children,\n}: {\n  value: string;\n  onChange: (value: string) => void;\n  ariaLabel?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n  children: ReactNode;\n}) {\n  const select = (\n    <select\n      aria-label={ariaLabel}\n      value={value}\n      onChange={(event) => onChange(event.target.value)}\n      className={cn(controlClassName, icon && \"pl-8\")}\n    >\n      {children}\n    </select>\n  );\n  if (!icon) return select;\n  return (\n    <div className=\"relative\">\n      <Icon\n        icon={icon}\n        className=\"pointer-events-none absolute left-2 top-1/2 size-4 -translate-y-1/2 text-muted-foreground/70\"\n      />\n      {select}\n    </div>\n  );\n}\n\nexport function SpecButton({\n  onClick,\n  children,\n  ariaLabel,\n}: {\n  onClick: () => void;\n  children: ReactNode;\n  ariaLabel?: string | undefined;\n}) {\n  return (\n    <button\n      type=\"button\"\n      aria-label={ariaLabel}\n      onClick={onClick}\n      className=\"inline-flex  items-center gap-1 rounded-md border border-border bg-background px-density-2 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground\"\n    >\n      {children}\n    </button>\n  );\n}\n\nexport function NumberField({\n  label,\n  value,\n  onChange,\n  min,\n  max,\n  step,\n  icon,\n  integer = false,\n}: {\n  label: string;\n  value?: number | undefined;\n  onChange: (value: number | undefined) => void;\n  min?: number | undefined;\n  max?: number | undefined;\n  step?: number | undefined;\n  icon?: StaticIconComponent | undefined;\n  integer?: boolean | undefined;\n}) {\n  return (\n    <SpecField label={label}>\n      <InputField\n        type=\"number\"\n        aria-label={label}\n        value={value == null ? \"\" : String(value)}\n        min={min}\n        max={max}\n        step={step}\n        onChange={(next) => onChange(parseOptionalNumber(next, integer))}\n        prefix={\n          icon ? (\n            <Icon icon={icon} className=\"size-4 text-muted-foreground/70\" />\n          ) : undefined\n        }\n        className=\"bg-background\"\n      />\n    </SpecField>\n  );\n}\n\nexport function TextareaField({\n  label,\n  value,\n  onChange,\n  minHeight = 76,\n  placeholder,\n  icon,\n}: {\n  label: string;\n  value?: string | undefined;\n  onChange: (value: string) => void;\n  minHeight?: number | undefined;\n  placeholder?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n}) {\n  return (\n    <SpecField label={label}>\n      <InputField\n        as=\"textarea\"\n        aria-label={label}\n        value={value ?? \"\"}\n        onChange={onChange}\n        placeholder={placeholder}\n        spellCheck={false}\n        style={{ minHeight }}\n        prefix={\n          icon ? (\n            <Icon\n              icon={icon}\n              className=\"mt-1 size-4 text-muted-foreground/70\"\n            />\n          ) : undefined\n        }\n        inputClassName=\"font-mono text-xs\"\n        className=\"bg-background\"\n      />\n    </SpecField>\n  );\n}\n\n// Single-line field that expands into a textarea while focused (design\n// .expand-field): collapsed it clips to one row, expanded it grows for\n// comfortable multi-line editing.\nexport function ExpandField({\n  label,\n  value,\n  onChange,\n  placeholder,\n  icon,\n}: {\n  label: string;\n  value?: string | undefined;\n  onChange: (value: string) => void;\n  placeholder?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n}) {\n  const [expanded, setExpanded] = useState(false);\n  return (\n    <SpecField label={label}>\n      <InputField\n        as=\"textarea\"\n        aria-label={label}\n        rows={1}\n        value={value ?? \"\"}\n        onChange={onChange}\n        onFocus={() => setExpanded(true)}\n        onBlur={() => setExpanded(false)}\n        placeholder={placeholder}\n        spellCheck={false}\n        prefix={\n          icon ? (\n            <Icon\n              icon={icon}\n              className={cn(\n                \"size-4 text-muted-foreground/70\",\n                expanded ? \"mt-1\" : undefined,\n              )}\n            />\n          ) : undefined\n        }\n        inputClassName={cn(\n          \"font-mono text-xs transition-[height]\",\n          expanded\n            ? \"h-24 resize-y overflow-auto whitespace-pre-wrap\"\n            : \"h-5 resize-none overflow-hidden whitespace-nowrap leading-5\",\n        )}\n        className={cn(\n          \"bg-background\",\n          expanded ? undefined : \" items-center py-0\",\n        )}\n      />\n    </SpecField>\n  );\n}\n\nexport function ListField({\n  label,\n  value,\n  onChange,\n  placeholder,\n  icon,\n}: {\n  label: string;\n  value?: string[] | undefined;\n  onChange: (value: string[]) => void;\n  placeholder?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n}) {\n  return (\n    <TextareaField\n      label={label}\n      value={value?.join(\"\\n\") ?? \"\"}\n      onChange={(next) =>\n        onChange(\n          next\n            .split(/\\r?\\n/)\n            .map((item) => item.trim())\n            .filter(Boolean),\n        )\n      }\n      minHeight={64}\n      placeholder={placeholder}\n      icon={icon}\n    />\n  );\n}\n\nexport function KeyValueField({\n  label,\n  value,\n  onChange,\n  placeholder = \"key=value\",\n  icon,\n}: {\n  label: string;\n  value?: Record<string, string> | undefined;\n  onChange: (value: Record<string, string>) => void;\n  placeholder?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n}) {\n  return (\n    <TextareaField\n      label={label}\n      value={recordToText(value)}\n      onChange={(next) => onChange(textToRecord(next))}\n      minHeight={72}\n      placeholder={placeholder}\n      icon={icon}\n    />\n  );\n}\n\n// Borderless on/off toggle (design .chk-card superseded): a Switch with an\n// inline label; the label carries its own icon so it reads at a glance.\nexport function CheckboxField({\n  label,\n  checked,\n  onChange,\n  icon,\n}: {\n  label: string;\n  checked?: boolean | undefined;\n  onChange: (checked: boolean) => void;\n  icon?: StaticIconComponent | undefined;\n}) {\n  return (\n    <Switch\n      checked={Boolean(checked)}\n      onChange={onChange}\n      className=\" py-density-1\"\n      label={\n        <span className=\"inline-flex min-w-0 items-center gap-2 text-xs text-muted-foreground\">\n          {icon && (\n            <Icon\n              icon={icon}\n              className=\"size-3.5 shrink-0 text-muted-foreground/70\"\n            />\n          )}\n          <span className=\"min-w-0 truncate\">{label}</span>\n        </span>\n      }\n    />\n  );\n}\n\n// \"Advanced\" disclosure under a dashed rule (design details.adv).\nexport function Disclosure({\n  label = \"Advanced\",\n  hint,\n  children,\n  defaultOpen = false,\n}: {\n  label?: string | undefined;\n  hint?: string | undefined;\n  children: ReactNode;\n  defaultOpen?: boolean | undefined;\n}) {\n  const [open, setOpen] = useState(defaultOpen);\n  return (\n    <div className=\"mt-density-3 border-t border-dashed border-border pt-density-2\">\n      <button\n        type=\"button\"\n        aria-expanded={open}\n        onClick={() => setOpen((current) => !current)}\n        className=\"inline-flex items-center gap-1.5 text-xs font-semibold text-muted-foreground hover:text-foreground\"\n      >\n        <Icon\n          icon={open ? UiChevronDown : UiChevronRight}\n          className=\"size-3.5\"\n        />\n        <span>{label}</span>\n        {hint && (\n          <span className=\"font-normal text-muted-foreground/70\">· {hint}</span>\n        )}\n      </button>\n      {open && <div className=\"pt-density-2\">{children}</div>}\n    </div>\n  );\n}\n\nfunction recordToText(value: Record<string, string> | undefined) {\n  if (!value) return \"\";\n  return Object.entries(value)\n    .map(([key, val]) => `${key}=${val}`)\n    .join(\"\\n\");\n}\n\nfunction textToRecord(value: string) {\n  const out: Record<string, string> = {};\n  for (const line of value.split(/\\r?\\n/)) {\n    const trimmed = line.trim();\n    if (!trimmed) continue;\n    const index = trimmed.indexOf(\"=\");\n    const key = (index < 0 ? trimmed : trimmed.slice(0, index)).trim();\n    const val = index < 0 ? \"\" : trimmed.slice(index + 1);\n    if (key) out[key] = val;\n  }\n  return out;\n}\n\nfunction parseOptionalNumber(value: string, integer: boolean) {\n  if (value.trim() === \"\") return undefined;\n  const parsed = Number(value);\n  if (!Number.isFinite(parsed)) return undefined;\n  return integer ? Math.max(0, Math.trunc(parsed)) : parsed;\n}\n"],"names":["jsxs","jsx","InputField","Icon","cn","useState","Switch","UiChevronDown","UiChevronRight"],"mappings":"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"}
+{"version":3,"file":"fields.cjs","sources":["../../../../src/data/ai/SpecRuntimeEditor/fields.tsx"],"sourcesContent":["import { useState, type ReactNode } from \"react\";\nimport { Combobox, type ComboboxOption } from \"../../../components/Combobox\";\nimport { InputField } from \"../../../components/InputField\";\nimport { Switch } from \"../../../components/Switch\";\nimport { Icon, type StaticIconComponent } from \"../../Icon\";\nimport { UiChevronDown, UiChevronRight } from \"../../../icons\";\nimport { cn } from \"../../../lib/utils\";\n\nconst EMPTY_SELECT_VALUE = \"__clicky_spec_select_empty__\";\n\nexport function SpecField({\n  label,\n  hint,\n  children,\n  composite = false,\n}: {\n  label: string;\n  hint?: string | undefined;\n  children: ReactNode;\n  composite?: boolean | undefined;\n}) {\n  const content = (\n    <>\n      <span>\n        {label}\n        {hint && <span className=\"text-muted-foreground/70\"> ({hint})</span>}\n      </span>\n      {children}\n    </>\n  );\n  if (composite) {\n    return (\n      <div className=\"block min-w-0 space-y-1 text-xs text-muted-foreground\">\n        {content}\n      </div>\n    );\n  }\n  return (\n    <label className=\"block min-w-0 space-y-1 text-xs text-muted-foreground\">\n      {content}\n    </label>\n  );\n}\n\nexport function SpecInput({\n  value,\n  onChange,\n  placeholder,\n  ariaLabel,\n  icon,\n  mono = false,\n}: {\n  value?: string | undefined;\n  onChange: (value: string) => void;\n  placeholder?: string | undefined;\n  ariaLabel?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n  mono?: boolean | undefined;\n}) {\n  return (\n    <InputField\n      aria-label={ariaLabel}\n      value={value ?? \"\"}\n      onChange={onChange}\n      placeholder={placeholder}\n      prefix={\n        icon ? (\n          <Icon icon={icon} className=\"size-4 text-muted-foreground/70\" />\n        ) : undefined\n      }\n      inputClassName={cn(mono && \"font-mono text-xs\")}\n      className=\"bg-background\"\n    />\n  );\n}\n\nexport function SpecSelect({\n  value,\n  onChange,\n  ariaLabel,\n  icon,\n  options,\n}: {\n  value: string;\n  onChange: (value: string) => void;\n  ariaLabel: string;\n  icon?: StaticIconComponent | undefined;\n  options: ComboboxOption[];\n}) {\n  if (options.some((option) => option.value === EMPTY_SELECT_VALUE)) {\n    throw new Error(\n      `SpecSelect option value ${JSON.stringify(EMPTY_SELECT_VALUE)} is reserved`,\n    );\n  }\n  const hasEmptyOption = options.some((option) => option.value === \"\");\n  const comboboxOptions = options.map((option) =>\n    option.value === \"\" ? { ...option, value: EMPTY_SELECT_VALUE } : option,\n  );\n  return (\n    <Combobox\n      ariaLabel={ariaLabel}\n      value={value === \"\" && hasEmptyOption ? EMPTY_SELECT_VALUE : value}\n      options={comboboxOptions}\n      onChange={(next) =>\n        onChange(next === EMPTY_SELECT_VALUE && hasEmptyOption ? \"\" : next)\n      }\n      allowCustomValue={false}\n      required\n      className=\"bg-background\"\n      {...(icon\n        ? {\n            prefix: (\n              <Icon icon={icon} className=\"size-4 text-muted-foreground/70\" />\n            ),\n          }\n        : {})}\n    />\n  );\n}\n\nexport function SpecButton({\n  onClick,\n  children,\n  ariaLabel,\n}: {\n  onClick: () => void;\n  children: ReactNode;\n  ariaLabel?: string | undefined;\n}) {\n  return (\n    <button\n      type=\"button\"\n      aria-label={ariaLabel}\n      onClick={onClick}\n      className=\"inline-flex  items-center gap-1 rounded-md border border-border bg-background px-density-2 text-xs font-medium text-muted-foreground hover:bg-muted hover:text-foreground\"\n    >\n      {children}\n    </button>\n  );\n}\n\nexport function NumberField({\n  label,\n  value,\n  onChange,\n  min,\n  max,\n  step,\n  icon,\n  integer = false,\n}: {\n  label: string;\n  value?: number | undefined;\n  onChange: (value: number | undefined) => void;\n  min?: number | undefined;\n  max?: number | undefined;\n  step?: number | undefined;\n  icon?: StaticIconComponent | undefined;\n  integer?: boolean | undefined;\n}) {\n  return (\n    <SpecField label={label}>\n      <InputField\n        type=\"number\"\n        aria-label={label}\n        value={value == null ? \"\" : String(value)}\n        min={min}\n        max={max}\n        step={step}\n        onChange={(next) => onChange(parseOptionalNumber(next, integer))}\n        prefix={\n          icon ? (\n            <Icon icon={icon} className=\"size-4 text-muted-foreground/70\" />\n          ) : undefined\n        }\n        className=\"bg-background\"\n      />\n    </SpecField>\n  );\n}\n\nexport function TextareaField({\n  label,\n  value,\n  onChange,\n  minHeight = 76,\n  placeholder,\n  icon,\n}: {\n  label: string;\n  value?: string | undefined;\n  onChange: (value: string) => void;\n  minHeight?: number | undefined;\n  placeholder?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n}) {\n  return (\n    <SpecField label={label}>\n      <InputField\n        as=\"textarea\"\n        aria-label={label}\n        value={value ?? \"\"}\n        onChange={onChange}\n        placeholder={placeholder}\n        spellCheck={false}\n        style={{ minHeight }}\n        prefix={\n          icon ? (\n            <Icon\n              icon={icon}\n              className=\"mt-1 size-4 text-muted-foreground/70\"\n            />\n          ) : undefined\n        }\n        inputClassName=\"font-mono text-xs\"\n        className=\"bg-background\"\n      />\n    </SpecField>\n  );\n}\n\n// Single-line field that expands into a textarea while focused (design\n// .expand-field): collapsed it clips to one row, expanded it grows for\n// comfortable multi-line editing.\nexport function ExpandField({\n  label,\n  value,\n  onChange,\n  placeholder,\n  icon,\n}: {\n  label: string;\n  value?: string | undefined;\n  onChange: (value: string) => void;\n  placeholder?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n}) {\n  const [expanded, setExpanded] = useState(false);\n  return (\n    <SpecField label={label}>\n      <InputField\n        as=\"textarea\"\n        aria-label={label}\n        rows={1}\n        value={value ?? \"\"}\n        onChange={onChange}\n        onFocus={() => setExpanded(true)}\n        onBlur={() => setExpanded(false)}\n        placeholder={placeholder}\n        spellCheck={false}\n        prefix={\n          icon ? (\n            <Icon\n              icon={icon}\n              className={cn(\n                \"size-4 text-muted-foreground/70\",\n                expanded ? \"mt-1\" : undefined,\n              )}\n            />\n          ) : undefined\n        }\n        inputClassName={cn(\n          \"font-mono text-xs transition-[height]\",\n          expanded\n            ? \"h-24 resize-y overflow-auto whitespace-pre-wrap\"\n            : \"h-5 resize-none overflow-hidden whitespace-nowrap leading-5\",\n        )}\n        className={cn(\n          \"bg-background\",\n          expanded ? undefined : \" items-center py-0\",\n        )}\n      />\n    </SpecField>\n  );\n}\n\nexport function ListField({\n  label,\n  value,\n  onChange,\n  placeholder,\n  icon,\n}: {\n  label: string;\n  value?: string[] | undefined;\n  onChange: (value: string[]) => void;\n  placeholder?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n}) {\n  return (\n    <TextareaField\n      label={label}\n      value={value?.join(\"\\n\") ?? \"\"}\n      onChange={(next) =>\n        onChange(\n          next\n            .split(/\\r?\\n/)\n            .map((item) => item.trim())\n            .filter(Boolean),\n        )\n      }\n      minHeight={64}\n      placeholder={placeholder}\n      icon={icon}\n    />\n  );\n}\n\nexport function KeyValueField({\n  label,\n  value,\n  onChange,\n  placeholder = \"key=value\",\n  icon,\n}: {\n  label: string;\n  value?: Record<string, string> | undefined;\n  onChange: (value: Record<string, string>) => void;\n  placeholder?: string | undefined;\n  icon?: StaticIconComponent | undefined;\n}) {\n  return (\n    <TextareaField\n      label={label}\n      value={recordToText(value)}\n      onChange={(next) => onChange(textToRecord(next))}\n      minHeight={72}\n      placeholder={placeholder}\n      icon={icon}\n    />\n  );\n}\n\n// Borderless on/off toggle (design .chk-card superseded): a Switch with an\n// inline label; the label carries its own icon so it reads at a glance.\nexport function CheckboxField({\n  label,\n  checked,\n  onChange,\n  icon,\n}: {\n  label: string;\n  checked?: boolean | undefined;\n  onChange: (checked: boolean) => void;\n  icon?: StaticIconComponent | undefined;\n}) {\n  return (\n    <Switch\n      checked={Boolean(checked)}\n      onChange={onChange}\n      className=\" py-density-1\"\n      label={\n        <span className=\"inline-flex min-w-0 items-center gap-2 text-xs text-muted-foreground\">\n          {icon && (\n            <Icon\n              icon={icon}\n              className=\"size-3.5 shrink-0 text-muted-foreground/70\"\n            />\n          )}\n          <span className=\"min-w-0 truncate\">{label}</span>\n        </span>\n      }\n    />\n  );\n}\n\n// \"Advanced\" disclosure under a dashed rule (design details.adv).\nexport function Disclosure({\n  label = \"Advanced\",\n  hint,\n  children,\n  defaultOpen = false,\n}: {\n  label?: string | undefined;\n  hint?: string | undefined;\n  children: ReactNode;\n  defaultOpen?: boolean | undefined;\n}) {\n  const [open, setOpen] = useState(defaultOpen);\n  return (\n    <div className=\"mt-density-3 border-t border-dashed border-border pt-density-2\">\n      <button\n        type=\"button\"\n        aria-expanded={open}\n        onClick={() => setOpen((current) => !current)}\n        className=\"inline-flex items-center gap-1.5 text-xs font-semibold text-muted-foreground hover:text-foreground\"\n      >\n        <Icon\n          icon={open ? UiChevronDown : UiChevronRight}\n          className=\"size-3.5\"\n        />\n        <span>{label}</span>\n        {hint && (\n          <span className=\"font-normal text-muted-foreground/70\">· {hint}</span>\n        )}\n      </button>\n      {open && <div className=\"pt-density-2\">{children}</div>}\n    </div>\n  );\n}\n\nfunction recordToText(value: Record<string, string> | undefined) {\n  if (!value) return \"\";\n  return Object.entries(value)\n    .map(([key, val]) => `${key}=${val}`)\n    .join(\"\\n\");\n}\n\nfunction textToRecord(value: string) {\n  const out: Record<string, string> = {};\n  for (const line of value.split(/\\r?\\n/)) {\n    const trimmed = line.trim();\n    if (!trimmed) continue;\n    const index = trimmed.indexOf(\"=\");\n    const key = (index < 0 ? trimmed : trimmed.slice(0, index)).trim();\n    const val = index < 0 ? \"\" : trimmed.slice(index + 1);\n    if (key) out[key] = val;\n  }\n  return out;\n}\n\nfunction parseOptionalNumber(value: string, integer: boolean) {\n  if (value.trim() === \"\") return undefined;\n  const parsed = Number(value);\n  if (!Number.isFinite(parsed)) return undefined;\n  return integer ? Math.max(0, Math.trunc(parsed)) : parsed;\n}\n"],"names":["jsxs","Fragment","jsx","InputField","Icon","cn","Combobox","useState","Switch","UiChevronDown","UiChevronRight"],"mappings":"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"}

package/dist/data/ai/SpecRuntimeEditor/fields.d.ts

@@ -1,9 +1,11 @@
 import { ReactNode } from 'react';
+import { ComboboxOption } from '../../../components/Combobox';
 import { StaticIconComponent } from '../../Icon';
-export declare function SpecField({ label, hint, children, }: {
+export declare function SpecField({ label, hint, children, composite, }: {
     label: string;
     hint?: string | undefined;
     children: ReactNode;
+    composite?: boolean | undefined;
 }): import("react/jsx-runtime").JSX.Element;
 export declare function SpecInput({ value, onChange, placeholder, ariaLabel, icon, mono, }: {
     value?: string | undefined;
@@ -13,12 +15,12 @@ export declare function SpecInput({ value, onChange, placeholder, ariaLabel, ico
     icon?: StaticIconComponent | undefined;
     mono?: boolean | undefined;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function SpecSelect({ value, onChange, ariaLabel, icon, children, }: {
+export declare function SpecSelect({ value, onChange, ariaLabel, icon, options, }: {
     value: string;
     onChange: (value: string) => void;
-    ariaLabel?: string | undefined;
+    ariaLabel: string;
     icon?: StaticIconComponent | undefined;
-    children: ReactNode;
+    options: ComboboxOption[];
 }): import("react/jsx-runtime").JSX.Element;
 export declare function SpecButton({ onClick, children, ariaLabel, }: {
     onClick: () => void;

package/dist/data/ai/SpecRuntimeEditor/fields.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"fields.d.ts","sourceRoot":"","sources":["../../../../src/data/ai/SpecRuntimeEditor/fields.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"fields.d.ts","sourceRoot":"","sources":["../../../../src/data/ai/SpecRuntimeEditor/fields.tsx"],"names":[],"mappings":"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"}

package/dist/data/ai/SpecRuntimeEditor/fields.js

@@ -1,18 +1,20 @@
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import { useState } from "react";
+import { Combobox } from "../../../components/Combobox.js";
 import { InputField } from "../../../components/InputField.js";
 import { Switch } from "../../../components/Switch.js";
 import { Icon } from "../../Icon.js";
 import { cn } from "../../../lib/utils.js";
 import { UiChevronDown } from "../../../icons/components/UiChevronDown.js";
 import { UiChevronRight } from "../../../icons/components/UiChevronRight.js";
-const controlClassName = "h-control-h w-full rounded-md border border-border bg-background px-density-2 text-sm outline-none focus:ring-2 focus:ring-ring";
+const EMPTY_SELECT_VALUE = "__clicky_spec_select_empty__";
 function SpecField({
   label,
   hint,
-  children
+  children,
+  composite = false
 }) {
-  return /* @__PURE__ */ jsxs("label", { className: "block min-w-0 space-y-1 text-xs text-muted-foreground", children: [
+  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs("span", { children: [
       label,
       hint && /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground/70", children: [
@@ -23,6 +25,10 @@ function SpecField({
     ] }),
     children
   ] });
+  if (composite) {
+    return /* @__PURE__ */ jsx("div", { className: "block min-w-0 space-y-1 text-xs text-muted-foreground", children: content });
+  }
+  return /* @__PURE__ */ jsx("label", { className: "block min-w-0 space-y-1 text-xs text-muted-foreground", children: content });
 }
 function SpecInput({
   value,
@@ -50,29 +56,32 @@ function SpecSelect({
   onChange,
   ariaLabel,
   icon,
-  children
+  options
 }) {
-  const select = /* @__PURE__ */ jsx(
-    "select",
+  if (options.some((option) => option.value === EMPTY_SELECT_VALUE)) {
+    throw new Error(
+      `SpecSelect option value ${JSON.stringify(EMPTY_SELECT_VALUE)} is reserved`
+    );
+  }
+  const hasEmptyOption = options.some((option) => option.value === "");
+  const comboboxOptions = options.map(
+    (option) => option.value === "" ? { ...option, value: EMPTY_SELECT_VALUE } : option
+  );
+  return /* @__PURE__ */ jsx(
+    Combobox,
     {
-      "aria-label": ariaLabel,
-      value,
-      onChange: (event) => onChange(event.target.value),
-      className: cn(controlClassName, icon && "pl-8"),
-      children
+      ariaLabel,
+      value: value === "" && hasEmptyOption ? EMPTY_SELECT_VALUE : value,
+      options: comboboxOptions,
+      onChange: (next) => onChange(next === EMPTY_SELECT_VALUE && hasEmptyOption ? "" : next),
+      allowCustomValue: false,
+      required: true,
+      className: "bg-background",
+      ...icon ? {
+        prefix: /* @__PURE__ */ jsx(Icon, { icon, className: "size-4 text-muted-foreground/70" })
+      } : {}
     }
   );
-  if (!icon) return select;
-  return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-    /* @__PURE__ */ jsx(
-      Icon,
-      {
-        icon,
-        className: "pointer-events-none absolute left-2 top-1/2 size-4 -translate-y-1/2 text-muted-foreground/70"
-      }
-    ),
-    select
-  ] });
 }
 function SpecButton({
   onClick,