@flanksource/clicky-ui 0.3.10 → 0.3.11

package/dist/data/ai/PromptRunEditor/index.js

@@ -0,0 +1,242 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { useState, useId } from "react";
+import { Button } from "../../../components/button.js";
+import { JsonSchemaForm } from "../../../components/JsonSchemaForm.js";
+import { cn } from "../../../lib/utils.js";
+import { Modal } from "../../../overlay/Modal.js";
+import { Icon } from "../../Icon.js";
+import { ModelSelector, EffortSelector } from "../../chat/ModelSelector.js";
+import { effortOptionsForModel, reconcileModelCapabilities } from "../model-capabilities.js";
+import { RuntimeModePicker } from "../RuntimeModePicker.js";
+import { selectionForBackend, SPEC_RUNTIME_FAMILIES, familyById, modelsForFamily, labelForBackend } from "../runtime-mode.js";
+import { SpecRuntimeEditor } from "../SpecRuntimeEditor/index.js";
+import { SpecField, SpecInput } from "../SpecRuntimeEditor/fields.js";
+import { withRoot, withOptionalRoot, withPrompt } from "../SpecRuntimeEditor/update.js";
+import { UiGearSix } from "../../../icons/components/UiGearSix.js";
+const REASONING_EFFORTS = ["low", "medium", "high", "xhigh"];
+function PromptRunEditor({
+  value,
+  onChange,
+  models = [],
+  families = SPEC_RUNTIME_FAMILIES,
+  tools = [],
+  permissionCatalog,
+  secretSelector,
+  cliOptions,
+  reasoningEfforts = REASONING_EFFORTS,
+  runtimeControls,
+  variablesSchema,
+  variables,
+  onVariablesChange,
+  onVariablesValidityChange,
+  promptEditor,
+  promptLabel = "User prompt",
+  promptPlaceholder = "Override the rendered user prompt",
+  children,
+  header,
+  footer,
+  className,
+  editSpecLabel = "Edit spec",
+  specModalTitle = "Runtime spec",
+  specSections
+}) {
+  var _a;
+  const [specOpen, setSpecOpen] = useState(false);
+  const selection = selectionForBackend(families, value.backend);
+  const family = familyById(families, selection.family);
+  const familyModels = modelsForFamily(models, family, value.backend);
+  const selectedModel = models.find((m) => m.id === value.model);
+  const modelEfforts = effortOptionsForModel(selectedModel, reasoningEfforts);
+  const showEffort = modelEfforts.length > 0;
+  return /* @__PURE__ */ jsxs("div", { className: cn("grid gap-density-4", className), children: [
+    header,
+    /* @__PURE__ */ jsxs(Block, { title: "Runtime", children: [
+      runtimeControls ?? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          RuntimeModePicker,
+          {
+            value,
+            onChange,
+            families,
+            models
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "grid gap-density-2 sm:grid-cols-2", children: [
+          /* @__PURE__ */ jsx(SpecField, { label: "Model", children: /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-density-2", children: [
+            familyModels.length > 0 ? /* @__PURE__ */ jsx(
+              ModelSelector,
+              {
+                models: familyModels,
+                value: value.model,
+                onChange: (model) => onChange(
+                  reconcileModelCapabilities(
+                    value,
+                    models.find((item) => item.id === model),
+                    reasoningEfforts
+                  )
+                ),
+                size: "md",
+                className: "w-full"
+              }
+            ) : /* @__PURE__ */ jsx(
+              SpecInput,
+              {
+                value: value.model,
+                onChange: (model) => onChange(withRoot(value, { model })),
+                placeholder: "frontmatter/default",
+                mono: true
+              }
+            ),
+            value.model && /* @__PURE__ */ jsx(
+              Button,
+              {
+                size: "sm",
+                variant: "ghost",
+                onClick: () => onChange(withOptionalRoot(value, "model", void 0)),
+                children: "Default"
+              }
+            )
+          ] }) }),
+          showEffort && /* @__PURE__ */ jsx(SpecField, { label: "Effort", children: /* @__PURE__ */ jsx(
+            EffortSelector,
+            {
+              efforts: modelEfforts,
+              value: value.effort ?? "",
+              onChange: (effort) => onChange(withRoot(value, { effort })),
+              size: "md",
+              className: "w-full"
+            }
+          ) })
+        ] })
+      ] }),
+      children,
+      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "outline", onClick: () => setSpecOpen(true), children: [
+        /* @__PURE__ */ jsx(Icon, { icon: UiGearSix, className: "size-4" }),
+        editSpecLabel
+      ] }) })
+    ] }),
+    onVariablesChange && /* @__PURE__ */ jsx(Block, { title: "Variables", children: /* @__PURE__ */ jsx(
+      VariablesField,
+      {
+        ...variablesSchema ? { schema: variablesSchema } : {},
+        value: variables ?? {},
+        onChange: onVariablesChange,
+        ...onVariablesValidityChange ? { onValidityChange: onVariablesValidityChange } : {}
+      }
+    ) }),
+    /* @__PURE__ */ jsx(Block, { title: promptLabel, children: promptEditor ?? /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        value: ((_a = value.prompt) == null ? void 0 : _a.user) ?? "",
+        onChange: (event) => onChange(withPrompt(value, { user: event.target.value })),
+        spellCheck: false,
+        placeholder: promptPlaceholder,
+        "aria-label": promptLabel,
+        className: "min-h-[7rem] w-full resize-y rounded-md border border-border bg-background px-density-2 py-density-1 text-sm outline-none focus:ring-2 focus:ring-ring"
+      }
+    ) }),
+    footer,
+    /* @__PURE__ */ jsx(
+      Modal,
+      {
+        open: specOpen,
+        onClose: () => setSpecOpen(false),
+        title: specModalTitle,
+        size: "full",
+        closeOnEsc: true,
+        className: "h-[95vh]",
+        children: /* @__PURE__ */ jsx(
+          SpecRuntimeEditor,
+          {
+            value,
+            onChange,
+            models,
+            families,
+            tools,
+            ...permissionCatalog ? { permissionCatalog } : {},
+            ...secretSelector ? { secretSelector } : {},
+            ...cliOptions ? { cliOptions } : {},
+            ...specSections ? { sections: specSections } : {},
+            onSave: () => setSpecOpen(false),
+            onCancel: () => setSpecOpen(false),
+            saveLabel: "Done",
+            footerStatus: labelForBackend(value.backend, families)
+          }
+        )
+      }
+    )
+  ] });
+}
+function Block({ title, children }) {
+  return /* @__PURE__ */ jsxs("section", { className: "space-y-density-2", children: [
+    /* @__PURE__ */ jsx("div", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: title }),
+    children
+  ] });
+}
+function VariablesField({
+  schema,
+  value,
+  onChange,
+  onValidityChange
+}) {
+  const idPrefix = useId();
+  const [rawText, setRawText] = useState(() => stringifyVariables(value));
+  const [rawError, setRawError] = useState(null);
+  if (schema) {
+    return /* @__PURE__ */ jsx(
+      JsonSchemaForm,
+      {
+        idPrefix: `prompt-vars-${idPrefix}`,
+        schema,
+        value,
+        onChange: (next) => onChange(next),
+        size: "sm"
+      }
+    );
+  }
+  const commit = (text) => {
+    setRawText(text);
+    if (!text.trim()) {
+      setRawError(null);
+      onValidityChange == null ? void 0 : onValidityChange(true);
+      onChange({});
+      return;
+    }
+    try {
+      const parsed = JSON.parse(text);
+      if (parsed && typeof parsed === "object" && !Array.isArray(parsed)) {
+        setRawError(null);
+        onValidityChange == null ? void 0 : onValidityChange(true);
+        onChange(parsed);
+      } else {
+        setRawError("Expected a JSON object");
+        onValidityChange == null ? void 0 : onValidityChange(false);
+      }
+    } catch (error) {
+      setRawError(error instanceof Error ? error.message : "Invalid JSON");
+      onValidityChange == null ? void 0 : onValidityChange(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+    /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        value: rawText,
+        onChange: (event) => commit(event.target.value),
+        spellCheck: false,
+        placeholder: "{}",
+        "aria-label": "Variables JSON",
+        className: "h-28 w-full resize-y rounded-md border border-border bg-background px-density-2 py-density-1 font-mono text-xs outline-none focus:ring-2 focus:ring-ring"
+      }
+    ),
+    rawError && /* @__PURE__ */ jsx("div", { className: "text-xs text-destructive", children: rawError })
+  ] });
+}
+function stringifyVariables(value) {
+  if (!value || Object.keys(value).length === 0) return "{}";
+  return JSON.stringify(value, null, 2);
+}
+export {
+  PromptRunEditor
+};
+//# sourceMappingURL=index.js.map

package/dist/data/ai/PromptRunEditor/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../src/data/ai/PromptRunEditor/index.tsx"],"sourcesContent":["import { useId, useState, type ReactNode } from \"react\";\nimport { Button } from \"../../../components/button\";\nimport { JsonSchemaForm } from \"../../../components/JsonSchemaForm\";\nimport type { JsonSchemaObject } from \"../../../components/json-schema-form-types\";\nimport { UiGearSix } from \"../../../icons\";\nimport { cn } from \"../../../lib/utils\";\nimport { Modal } from \"../../../overlay/Modal\";\nimport { Icon } from \"../../Icon\";\nimport { EffortSelector, ModelSelector } from \"../../chat/ModelSelector\";\nimport type { ChatModel, ToolMeta } from \"../../chat/types\";\nimport {\n  effortOptionsForModel,\n  reconcileModelCapabilities,\n} from \"../model-capabilities\";\nimport { RuntimeModePicker } from \"../RuntimeModePicker\";\nimport {\n  SPEC_RUNTIME_FAMILIES,\n  type SpecRuntimeFamily,\n  familyById,\n  labelForBackend,\n  modelsForFamily,\n  selectionForBackend,\n} from \"../runtime-mode\";\nimport { SpecRuntimeEditor } from \"../SpecRuntimeEditor\";\nimport type { SpecRuntimeCLIOptions } from \"../SpecRuntimeEditor/CLIArgsSection\";\nimport { SpecField, SpecInput } from \"../SpecRuntimeEditor/fields\";\nimport type {\n  SpecRuntimeSecretSelectorConfig,\n  SpecSectionId,\n} from \"../SpecRuntimeEditor/types\";\nimport {\n  withOptionalRoot,\n  withPrompt,\n  withRoot,\n} from \"../SpecRuntimeEditor/update\";\nimport type {\n  AISpecRuntimePermissionCatalog,\n  AISpecRuntimeValue,\n} from \"../SpecRuntimeEditor.model\";\n\nconst REASONING_EFFORTS = [\"low\", \"medium\", \"high\", \"xhigh\"];\n\nexport type PromptRunEditorProps = {\n  value: AISpecRuntimeValue;\n  onChange: (value: AISpecRuntimeValue) => void;\n  models?: ChatModel[] | undefined;\n  families?: SpecRuntimeFamily[] | undefined;\n  tools?: ToolMeta[] | undefined;\n  permissionCatalog?: AISpecRuntimePermissionCatalog | undefined;\n  secretSelector?: SpecRuntimeSecretSelectorConfig | undefined;\n  cliOptions?: SpecRuntimeCLIOptions | undefined;\n  reasoningEfforts?: string[] | undefined;\n  /** Host-provided replacement for the inline Runtime controls. */\n  runtimeControls?: ReactNode | undefined;\n\n  /** Schema-driven variables form; omit to render a raw-JSON editor. */\n  variablesSchema?: JsonSchemaObject | undefined;\n  variables?: Record<string, unknown> | undefined;\n  /** The variables block only renders when this is supplied. */\n  onVariablesChange?: ((next: Record<string, unknown>) => void) | undefined;\n  /** Fires false while raw-JSON variables fail to parse; always true with a schema. */\n  onVariablesValidityChange?: ((valid: boolean) => void) | undefined;\n\n  /** Host-supplied editor for the `prompt.user` override; defaults to a textarea. */\n  promptEditor?: ReactNode | undefined;\n  promptLabel?: string | undefined;\n  promptPlaceholder?: string | undefined;\n\n  /** Extra fields injected inside the Runtime block, below Model/Effort. */\n  children?: ReactNode | undefined;\n  header?: ReactNode | undefined;\n  footer?: ReactNode | undefined;\n  className?: string | undefined;\n\n  editSpecLabel?: string | undefined;\n  specModalTitle?: string | undefined;\n  /** Restrict which SpecRuntimeEditor sections the \"Edit spec\" modal shows. */\n  specSections?: readonly SpecSectionId[] | undefined;\n};\n\n// The inline \"prompt + variables + runtime\" composer shared by captain's prompt\n// workbench and gavel's todo run dialog. It edits one AISpecRuntimeValue live\n// (runtime knobs + the prompt.user override) and takes variables as separate\n// props; the \"Edit spec\" button expands the same value into the full editor.\n// Hosts should mount it with a `key` per prompt/todo so internal draft state\n// (raw-JSON text, modal open) resets on selection change.\nexport function PromptRunEditor({\n  value,\n  onChange,\n  models = [],\n  families = SPEC_RUNTIME_FAMILIES,\n  tools = [],\n  permissionCatalog,\n  secretSelector,\n  cliOptions,\n  reasoningEfforts = REASONING_EFFORTS,\n  runtimeControls,\n  variablesSchema,\n  variables,\n  onVariablesChange,\n  onVariablesValidityChange,\n  promptEditor,\n  promptLabel = \"User prompt\",\n  promptPlaceholder = \"Override the rendered user prompt\",\n  children,\n  header,\n  footer,\n  className,\n  editSpecLabel = \"Edit spec\",\n  specModalTitle = \"Runtime spec\",\n  specSections,\n}: PromptRunEditorProps) {\n  const [specOpen, setSpecOpen] = useState(false);\n  const selection = selectionForBackend(families, value.backend);\n  const family = familyById(families, selection.family);\n  const familyModels = modelsForFamily(models, family, value.backend);\n  const selectedModel = models.find((m) => m.id === value.model);\n  // Hide effort for a model that does not reason; default to showing it when the\n  // selection is unknown (a family alias or a not-yet-loaded catalog).\n  const modelEfforts = effortOptionsForModel(selectedModel, reasoningEfforts);\n  const showEffort = modelEfforts.length > 0;\n\n  return (\n    <div className={cn(\"grid gap-density-4\", className)}>\n      {header}\n\n      <Block title=\"Runtime\">\n        {runtimeControls ?? (\n          <>\n            <RuntimeModePicker\n              value={value}\n              onChange={onChange}\n              families={families}\n              models={models}\n            />\n            <div className=\"grid gap-density-2 sm:grid-cols-2\">\n              <SpecField label=\"Model\">\n                <div className=\"flex min-w-0 items-center gap-density-2\">\n                  {familyModels.length > 0 ? (\n                    <ModelSelector\n                      models={familyModels}\n                      value={value.model}\n                      onChange={(model) =>\n                        onChange(\n                          reconcileModelCapabilities(\n                            value,\n                            models.find((item) => item.id === model),\n                            reasoningEfforts,\n                          ),\n                        )\n                      }\n                      size=\"md\"\n                      className=\"w-full\"\n                    />\n                  ) : (\n                    <SpecInput\n                      value={value.model}\n                      onChange={(model) => onChange(withRoot(value, { model }))}\n                      placeholder=\"frontmatter/default\"\n                      mono\n                    />\n                  )}\n                  {value.model && (\n                    <Button\n                      size=\"sm\"\n                      variant=\"ghost\"\n                      onClick={() =>\n                        onChange(withOptionalRoot(value, \"model\", undefined))\n                      }\n                    >\n                      Default\n                    </Button>\n                  )}\n                </div>\n              </SpecField>\n              {showEffort && (\n                <SpecField label=\"Effort\">\n                  <EffortSelector\n                    efforts={modelEfforts}\n                    value={value.effort ?? \"\"}\n                    onChange={(effort) => onChange(withRoot(value, { effort }))}\n                    size=\"md\"\n                    className=\"w-full\"\n                  />\n                </SpecField>\n              )}\n            </div>\n          </>\n        )}\n        {children}\n        <div>\n          <Button size=\"sm\" variant=\"outline\" onClick={() => setSpecOpen(true)}>\n            <Icon icon={UiGearSix} className=\"size-4\" />\n            {editSpecLabel}\n          </Button>\n        </div>\n      </Block>\n\n      {onVariablesChange && (\n        <Block title=\"Variables\">\n          <VariablesField\n            {...(variablesSchema ? { schema: variablesSchema } : {})}\n            value={variables ?? {}}\n            onChange={onVariablesChange}\n            {...(onVariablesValidityChange\n              ? { onValidityChange: onVariablesValidityChange }\n              : {})}\n          />\n        </Block>\n      )}\n\n      <Block title={promptLabel}>\n        {promptEditor ?? (\n          <textarea\n            value={value.prompt?.user ?? \"\"}\n            onChange={(event) =>\n              onChange(withPrompt(value, { user: event.target.value }))\n            }\n            spellCheck={false}\n            placeholder={promptPlaceholder}\n            aria-label={promptLabel}\n            className=\"min-h-[7rem] w-full resize-y rounded-md border border-border bg-background px-density-2 py-density-1 text-sm outline-none focus:ring-2 focus:ring-ring\"\n          />\n        )}\n      </Block>\n\n      {footer}\n\n      <Modal\n        open={specOpen}\n        onClose={() => setSpecOpen(false)}\n        title={specModalTitle}\n        size=\"full\"\n        closeOnEsc\n        className=\"h-[95vh]\"\n      >\n        <SpecRuntimeEditor\n          value={value}\n          onChange={onChange}\n          models={models}\n          families={families}\n          tools={tools}\n          {...(permissionCatalog ? { permissionCatalog } : {})}\n          {...(secretSelector ? { secretSelector } : {})}\n          {...(cliOptions ? { cliOptions } : {})}\n          {...(specSections ? { sections: specSections } : {})}\n          onSave={() => setSpecOpen(false)}\n          onCancel={() => setSpecOpen(false)}\n          saveLabel=\"Done\"\n          footerStatus={labelForBackend(value.backend, families)}\n        />\n      </Modal>\n    </div>\n  );\n}\n\nfunction Block({ title, children }: { title: string; children: ReactNode }) {\n  return (\n    <section className=\"space-y-density-2\">\n      <div className=\"text-xs font-semibold uppercase tracking-wide text-muted-foreground\">\n        {title}\n      </div>\n      {children}\n    </section>\n  );\n}\n\n// Variables are edited via the prompt's declared schema when present, otherwise\n// as a raw JSON object; the raw text is held locally and only committed to the\n// host when it parses to an object.\nfunction VariablesField({\n  schema,\n  value,\n  onChange,\n  onValidityChange,\n}: {\n  schema?: JsonSchemaObject | undefined;\n  value: Record<string, unknown>;\n  onChange: (next: Record<string, unknown>) => void;\n  onValidityChange?: ((valid: boolean) => void) | undefined;\n}) {\n  const idPrefix = useId();\n  const [rawText, setRawText] = useState(() => stringifyVariables(value));\n  const [rawError, setRawError] = useState<string | null>(null);\n\n  if (schema) {\n    return (\n      <JsonSchemaForm\n        idPrefix={`prompt-vars-${idPrefix}`}\n        schema={schema}\n        value={value}\n        onChange={(next) => onChange(next as Record<string, unknown>)}\n        size=\"sm\"\n      />\n    );\n  }\n\n  const commit = (text: string) => {\n    setRawText(text);\n    if (!text.trim()) {\n      setRawError(null);\n      onValidityChange?.(true);\n      onChange({});\n      return;\n    }\n    try {\n      const parsed = JSON.parse(text);\n      if (parsed && typeof parsed === \"object\" && !Array.isArray(parsed)) {\n        setRawError(null);\n        onValidityChange?.(true);\n        onChange(parsed as Record<string, unknown>);\n      } else {\n        setRawError(\"Expected a JSON object\");\n        onValidityChange?.(false);\n      }\n    } catch (error) {\n      setRawError(error instanceof Error ? error.message : \"Invalid JSON\");\n      onValidityChange?.(false);\n    }\n  };\n\n  return (\n    <div className=\"space-y-1\">\n      <textarea\n        value={rawText}\n        onChange={(event) => commit(event.target.value)}\n        spellCheck={false}\n        placeholder=\"{}\"\n        aria-label=\"Variables JSON\"\n        className=\"h-28 w-full resize-y rounded-md border border-border bg-background px-density-2 py-density-1 font-mono text-xs outline-none focus:ring-2 focus:ring-ring\"\n      />\n      {rawError && <div className=\"text-xs text-destructive\">{rawError}</div>}\n    </div>\n  );\n}\n\nfunction stringifyVariables(value: Record<string, unknown>) {\n  if (!value || Object.keys(value).length === 0) return \"{}\";\n  return JSON.stringify(value, null, 2);\n}\n"],"names":[],"mappings":"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"}

package/dist/data/ai/RuntimeModePicker.cjs

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const SegmentedControl = require("../../components/SegmentedControl.cjs");
+const providerIcons = require("../chat/provider-icons.cjs");
+const fields = require("./SpecRuntimeEditor/fields.cjs");
+const update = require("./SpecRuntimeEditor/update.cjs");
+const runtimeMode = require("./runtime-mode.cjs");
+function RuntimeModePicker({
+  value,
+  onChange,
+  families = runtimeMode.SPEC_RUNTIME_FAMILIES,
+  models = []
+}) {
+  const selection = runtimeMode.selectionForBackend(families, value.backend);
+  const family = runtimeMode.familyById(families, selection.family);
+  const applyBackend = (familyId, modeId) => {
+    const backend = runtimeMode.backendForFamilyMode(families, familyId, modeId);
+    if (backend === (value.backend ?? "")) return;
+    const nextFamily = runtimeMode.familyById(families, familyId);
+    let next = update.withOptionalRoot(update.withRoot(value, { backend }), "cliArgs", void 0);
+    if (!runtimeMode.modelBelongsToFamily(value.model, models, nextFamily, backend)) {
+      next = update.withOptionalRoot(next, "model", void 0);
+    }
+    onChange(next);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-density-2", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(fields.SpecField, { label: "Family", children: /* @__PURE__ */ jsxRuntime.jsx(
+      SegmentedControl.SegmentedControl,
+      {
+        "aria-label": "Provider family",
+        size: "sm",
+        wrap: true,
+        value: family.id,
+        options: families.map((entry) => {
+          const icon = providerIcons.providerIcon(entry.id);
+          return { id: entry.id, label: entry.label, ...icon ? { icon } : {} };
+        }),
+        onChange: (familyId) => applyBackend(familyId, runtimeMode.firstMode(runtimeMode.familyById(families, familyId)).id)
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(fields.SpecField, { label: "Mode", hint: "runtime", children: /* @__PURE__ */ jsxRuntime.jsx(
+      SegmentedControl.SegmentedControl,
+      {
+        "aria-label": "Runtime mode",
+        size: "sm",
+        wrap: true,
+        value: selection.mode,
+        options: family.modes.map((mode) => ({
+          id: mode.id,
+          label: mode.label,
+          ...mode.icon ? { icon: mode.icon } : {},
+          ...mode.title ? { title: mode.title } : {}
+        })),
+        onChange: (modeId) => applyBackend(family.id, modeId)
+      }
+    ) })
+  ] });
+}
+exports.RuntimeModePicker = RuntimeModePicker;
+//# sourceMappingURL=RuntimeModePicker.cjs.map

package/dist/data/ai/RuntimeModePicker.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuntimeModePicker.cjs","sources":["../../../src/data/ai/RuntimeModePicker.tsx"],"sourcesContent":["import { SegmentedControl } from \"../../components/SegmentedControl\";\nimport { providerIcon } from \"../chat/provider-icons\";\nimport type { ChatModel } from \"../chat/types\";\nimport type { AISpecRuntimeValue } from \"./SpecRuntimeEditor.model\";\nimport { SpecField } from \"./SpecRuntimeEditor/fields\";\nimport { withOptionalRoot, withRoot } from \"./SpecRuntimeEditor/update\";\nimport {\n  SPEC_RUNTIME_FAMILIES,\n  type SpecRuntimeFamily,\n  backendForFamilyMode,\n  familyById,\n  firstMode,\n  modelBelongsToFamily,\n  selectionForBackend,\n} from \"./runtime-mode\";\n\nexport type RuntimeModePickerProps = {\n  value: AISpecRuntimeValue;\n  onChange: (value: AISpecRuntimeValue) => void;\n  families?: SpecRuntimeFamily[] | undefined;\n  /** Model catalog used to decide whether the current model survives a family switch. */\n  models?: ChatModel[] | undefined;\n};\n\n// The two-axis Family → Mode picker. Both segmented controls drive the single\n// `value.backend`; switching family drops a model that no longer belongs to the\n// new provider so the model picker never shows a stale cross-provider choice.\nexport function RuntimeModePicker({\n  value,\n  onChange,\n  families = SPEC_RUNTIME_FAMILIES,\n  models = [],\n}: RuntimeModePickerProps) {\n  const selection = selectionForBackend(families, value.backend);\n  const family = familyById(families, selection.family);\n\n  const applyBackend = (familyId: string, modeId: string) => {\n    const backend = backendForFamilyMode(families, familyId, modeId);\n    if (backend === (value.backend ?? \"\")) return;\n    const nextFamily = familyById(families, familyId);\n    // A backend switch invalidates the previous backend's cmux CLI-arg values.\n    let next = withOptionalRoot(withRoot(value, { backend }), \"cliArgs\", undefined);\n    if (!modelBelongsToFamily(value.model, models, nextFamily, backend)) {\n      next = withOptionalRoot(next, \"model\", undefined);\n    }\n    onChange(next);\n  };\n\n  return (\n    <div className=\"grid gap-density-2\">\n      <SpecField label=\"Family\">\n        <SegmentedControl\n          aria-label=\"Provider family\"\n          size=\"sm\"\n          wrap\n          value={family.id}\n          options={families.map((entry) => {\n            const icon = providerIcon(entry.id);\n            return { id: entry.id, label: entry.label, ...(icon ? { icon } : {}) };\n          })}\n          onChange={(familyId) => applyBackend(familyId, firstMode(familyById(families, familyId)).id)}\n        />\n      </SpecField>\n      <SpecField label=\"Mode\" hint=\"runtime\">\n        <SegmentedControl\n          aria-label=\"Runtime mode\"\n          size=\"sm\"\n          wrap\n          value={selection.mode}\n          options={family.modes.map((mode) => ({\n            id: mode.id,\n            label: mode.label,\n            ...(mode.icon ? { icon: mode.icon } : {}),\n            ...(mode.title ? { title: mode.title } : {}),\n          }))}\n          onChange={(modeId) => applyBackend(family.id, modeId)}\n        />\n      </SpecField>\n    </div>\n  );\n}\n"],"names":["SPEC_RUNTIME_FAMILIES","selectionForBackend","familyById","backendForFamilyMode","withOptionalRoot","withRoot","modelBelongsToFamily","jsxs","jsx","SpecField","SegmentedControl","providerIcon","firstMode"],"mappings":";;;;;;;;AA2BO,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AAAA,EACA,WAAWA,YAAAA;AAAAA,EACX,SAAS,CAAA;AACX,GAA2B;AACzB,QAAM,YAAYC,YAAAA,oBAAoB,UAAU,MAAM,OAAO;AAC7D,QAAM,SAASC,YAAAA,WAAW,UAAU,UAAU,MAAM;AAEpD,QAAM,eAAe,CAAC,UAAkB,WAAmB;AACzD,UAAM,UAAUC,YAAAA,qBAAqB,UAAU,UAAU,MAAM;AAC/D,QAAI,aAAa,MAAM,WAAW,IAAK;AACvC,UAAM,aAAaD,YAAAA,WAAW,UAAU,QAAQ;AAEhD,QAAI,OAAOE,OAAAA,iBAAiBC,gBAAS,OAAO,EAAE,QAAA,CAAS,GAAG,WAAW,MAAS;AAC9E,QAAI,CAACC,YAAAA,qBAAqB,MAAM,OAAO,QAAQ,YAAY,OAAO,GAAG;AACnE,aAAOF,OAAAA,iBAAiB,MAAM,SAAS,MAAS;AAAA,IAClD;AACA,aAAS,IAAI;AAAA,EACf;AAEA,SACEG,2BAAAA,KAAC,OAAA,EAAI,WAAU,sBACb,UAAA;AAAA,IAAAC,2BAAAA,IAACC,OAAAA,WAAA,EAAU,OAAM,UACf,UAAAD,2BAAAA;AAAAA,MAACE,iBAAAA;AAAAA,MAAA;AAAA,QACC,cAAW;AAAA,QACX,MAAK;AAAA,QACL,MAAI;AAAA,QACJ,OAAO,OAAO;AAAA,QACd,SAAS,SAAS,IAAI,CAAC,UAAU;AAC/B,gBAAM,OAAOC,cAAAA,aAAa,MAAM,EAAE;AAClC,iBAAO,EAAE,IAAI,MAAM,IAAI,OAAO,MAAM,OAAO,GAAI,OAAO,EAAE,KAAA,IAAS,CAAA,EAAC;AAAA,QACpE,CAAC;AAAA,QACD,UAAU,CAAC,aAAa,aAAa,UAAUC,sBAAUV,YAAAA,WAAW,UAAU,QAAQ,CAAC,EAAE,EAAE;AAAA,MAAA;AAAA,IAAA,GAE/F;AAAA,IACAM,2BAAAA,IAACC,OAAAA,WAAA,EAAU,OAAM,QAAO,MAAK,WAC3B,UAAAD,2BAAAA;AAAAA,MAACE,iBAAAA;AAAAA,MAAA;AAAA,QACC,cAAW;AAAA,QACX,MAAK;AAAA,QACL,MAAI;AAAA,QACJ,OAAO,UAAU;AAAA,QACjB,SAAS,OAAO,MAAM,IAAI,CAAC,UAAU;AAAA,UACnC,IAAI,KAAK;AAAA,UACT,OAAO,KAAK;AAAA,UACZ,GAAI,KAAK,OAAO,EAAE,MAAM,KAAK,KAAA,IAAS,CAAA;AAAA,UACtC,GAAI,KAAK,QAAQ,EAAE,OAAO,KAAK,MAAA,IAAU,CAAA;AAAA,QAAC,EAC1C;AAAA,QACF,UAAU,CAAC,WAAW,aAAa,OAAO,IAAI,MAAM;AAAA,MAAA;AAAA,IAAA,EACtD,CACF;AAAA,EAAA,GACF;AAEJ;;"}

package/dist/data/ai/RuntimeModePicker.d.ts

@@ -0,0 +1,12 @@
+import { ChatModel } from '../chat/types';
+import { AISpecRuntimeValue } from './SpecRuntimeEditor.model';
+import { SpecRuntimeFamily } from './runtime-mode';
+export type RuntimeModePickerProps = {
+    value: AISpecRuntimeValue;
+    onChange: (value: AISpecRuntimeValue) => void;
+    families?: SpecRuntimeFamily[] | undefined;
+    /** Model catalog used to decide whether the current model survives a family switch. */
+    models?: ChatModel[] | undefined;
+};
+export declare function RuntimeModePicker({ value, onChange, families, models, }: RuntimeModePickerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=RuntimeModePicker.d.ts.map

package/dist/data/ai/RuntimeModePicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuntimeModePicker.d.ts","sourceRoot":"","sources":["../../../src/data/ai/RuntimeModePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAGpE,OAAO,EAEL,KAAK,iBAAiB,EAMvB,MAAM,gBAAgB,CAAC;AAExB,MAAM,MAAM,sBAAsB,GAAG;IACnC,KAAK,EAAE,kBAAkB,CAAC;IAC1B,QAAQ,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC9C,QAAQ,CAAC,EAAE,iBAAiB,EAAE,GAAG,SAAS,CAAC;IAC3C,uFAAuF;IACvF,MAAM,CAAC,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC;CAClC,CAAC;AAKF,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,QAAgC,EAChC,MAAW,GACZ,EAAE,sBAAsB,2CAgDxB"}

package/dist/data/ai/RuntimeModePicker.js

@@ -0,0 +1,61 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { SegmentedControl } from "../../components/SegmentedControl.js";
+import { providerIcon } from "../chat/provider-icons.js";
+import { SpecField } from "./SpecRuntimeEditor/fields.js";
+import { withOptionalRoot, withRoot } from "./SpecRuntimeEditor/update.js";
+import { selectionForBackend, SPEC_RUNTIME_FAMILIES, familyById, firstMode, backendForFamilyMode, modelBelongsToFamily } from "./runtime-mode.js";
+function RuntimeModePicker({
+  value,
+  onChange,
+  families = SPEC_RUNTIME_FAMILIES,
+  models = []
+}) {
+  const selection = selectionForBackend(families, value.backend);
+  const family = familyById(families, selection.family);
+  const applyBackend = (familyId, modeId) => {
+    const backend = backendForFamilyMode(families, familyId, modeId);
+    if (backend === (value.backend ?? "")) return;
+    const nextFamily = familyById(families, familyId);
+    let next = withOptionalRoot(withRoot(value, { backend }), "cliArgs", void 0);
+    if (!modelBelongsToFamily(value.model, models, nextFamily, backend)) {
+      next = withOptionalRoot(next, "model", void 0);
+    }
+    onChange(next);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "grid gap-density-2", children: [
+    /* @__PURE__ */ jsx(SpecField, { label: "Family", children: /* @__PURE__ */ jsx(
+      SegmentedControl,
+      {
+        "aria-label": "Provider family",
+        size: "sm",
+        wrap: true,
+        value: family.id,
+        options: families.map((entry) => {
+          const icon = providerIcon(entry.id);
+          return { id: entry.id, label: entry.label, ...icon ? { icon } : {} };
+        }),
+        onChange: (familyId) => applyBackend(familyId, firstMode(familyById(families, familyId)).id)
+      }
+    ) }),
+    /* @__PURE__ */ jsx(SpecField, { label: "Mode", hint: "runtime", children: /* @__PURE__ */ jsx(
+      SegmentedControl,
+      {
+        "aria-label": "Runtime mode",
+        size: "sm",
+        wrap: true,
+        value: selection.mode,
+        options: family.modes.map((mode) => ({
+          id: mode.id,
+          label: mode.label,
+          ...mode.icon ? { icon: mode.icon } : {},
+          ...mode.title ? { title: mode.title } : {}
+        })),
+        onChange: (modeId) => applyBackend(family.id, modeId)
+      }
+    ) })
+  ] });
+}
+export {
+  RuntimeModePicker
+};
+//# sourceMappingURL=RuntimeModePicker.js.map

package/dist/data/ai/RuntimeModePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RuntimeModePicker.js","sources":["../../../src/data/ai/RuntimeModePicker.tsx"],"sourcesContent":["import { SegmentedControl } from \"../../components/SegmentedControl\";\nimport { providerIcon } from \"../chat/provider-icons\";\nimport type { ChatModel } from \"../chat/types\";\nimport type { AISpecRuntimeValue } from \"./SpecRuntimeEditor.model\";\nimport { SpecField } from \"./SpecRuntimeEditor/fields\";\nimport { withOptionalRoot, withRoot } from \"./SpecRuntimeEditor/update\";\nimport {\n  SPEC_RUNTIME_FAMILIES,\n  type SpecRuntimeFamily,\n  backendForFamilyMode,\n  familyById,\n  firstMode,\n  modelBelongsToFamily,\n  selectionForBackend,\n} from \"./runtime-mode\";\n\nexport type RuntimeModePickerProps = {\n  value: AISpecRuntimeValue;\n  onChange: (value: AISpecRuntimeValue) => void;\n  families?: SpecRuntimeFamily[] | undefined;\n  /** Model catalog used to decide whether the current model survives a family switch. */\n  models?: ChatModel[] | undefined;\n};\n\n// The two-axis Family → Mode picker. Both segmented controls drive the single\n// `value.backend`; switching family drops a model that no longer belongs to the\n// new provider so the model picker never shows a stale cross-provider choice.\nexport function RuntimeModePicker({\n  value,\n  onChange,\n  families = SPEC_RUNTIME_FAMILIES,\n  models = [],\n}: RuntimeModePickerProps) {\n  const selection = selectionForBackend(families, value.backend);\n  const family = familyById(families, selection.family);\n\n  const applyBackend = (familyId: string, modeId: string) => {\n    const backend = backendForFamilyMode(families, familyId, modeId);\n    if (backend === (value.backend ?? \"\")) return;\n    const nextFamily = familyById(families, familyId);\n    // A backend switch invalidates the previous backend's cmux CLI-arg values.\n    let next = withOptionalRoot(withRoot(value, { backend }), \"cliArgs\", undefined);\n    if (!modelBelongsToFamily(value.model, models, nextFamily, backend)) {\n      next = withOptionalRoot(next, \"model\", undefined);\n    }\n    onChange(next);\n  };\n\n  return (\n    <div className=\"grid gap-density-2\">\n      <SpecField label=\"Family\">\n        <SegmentedControl\n          aria-label=\"Provider family\"\n          size=\"sm\"\n          wrap\n          value={family.id}\n          options={families.map((entry) => {\n            const icon = providerIcon(entry.id);\n            return { id: entry.id, label: entry.label, ...(icon ? { icon } : {}) };\n          })}\n          onChange={(familyId) => applyBackend(familyId, firstMode(familyById(families, familyId)).id)}\n        />\n      </SpecField>\n      <SpecField label=\"Mode\" hint=\"runtime\">\n        <SegmentedControl\n          aria-label=\"Runtime mode\"\n          size=\"sm\"\n          wrap\n          value={selection.mode}\n          options={family.modes.map((mode) => ({\n            id: mode.id,\n            label: mode.label,\n            ...(mode.icon ? { icon: mode.icon } : {}),\n            ...(mode.title ? { title: mode.title } : {}),\n          }))}\n          onChange={(modeId) => applyBackend(family.id, modeId)}\n        />\n      </SpecField>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;AA2BO,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,SAAS,CAAA;AACX,GAA2B;AACzB,QAAM,YAAY,oBAAoB,UAAU,MAAM,OAAO;AAC7D,QAAM,SAAS,WAAW,UAAU,UAAU,MAAM;AAEpD,QAAM,eAAe,CAAC,UAAkB,WAAmB;AACzD,UAAM,UAAU,qBAAqB,UAAU,UAAU,MAAM;AAC/D,QAAI,aAAa,MAAM,WAAW,IAAK;AACvC,UAAM,aAAa,WAAW,UAAU,QAAQ;AAEhD,QAAI,OAAO,iBAAiB,SAAS,OAAO,EAAE,QAAA,CAAS,GAAG,WAAW,MAAS;AAC9E,QAAI,CAAC,qBAAqB,MAAM,OAAO,QAAQ,YAAY,OAAO,GAAG;AACnE,aAAO,iBAAiB,MAAM,SAAS,MAAS;AAAA,IAClD;AACA,aAAS,IAAI;AAAA,EACf;AAEA,SACE,qBAAC,OAAA,EAAI,WAAU,sBACb,UAAA;AAAA,IAAA,oBAAC,WAAA,EAAU,OAAM,UACf,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,cAAW;AAAA,QACX,MAAK;AAAA,QACL,MAAI;AAAA,QACJ,OAAO,OAAO;AAAA,QACd,SAAS,SAAS,IAAI,CAAC,UAAU;AAC/B,gBAAM,OAAO,aAAa,MAAM,EAAE;AAClC,iBAAO,EAAE,IAAI,MAAM,IAAI,OAAO,MAAM,OAAO,GAAI,OAAO,EAAE,KAAA,IAAS,CAAA,EAAC;AAAA,QACpE,CAAC;AAAA,QACD,UAAU,CAAC,aAAa,aAAa,UAAU,UAAU,WAAW,UAAU,QAAQ,CAAC,EAAE,EAAE;AAAA,MAAA;AAAA,IAAA,GAE/F;AAAA,IACA,oBAAC,WAAA,EAAU,OAAM,QAAO,MAAK,WAC3B,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,cAAW;AAAA,QACX,MAAK;AAAA,QACL,MAAI;AAAA,QACJ,OAAO,UAAU;AAAA,QACjB,SAAS,OAAO,MAAM,IAAI,CAAC,UAAU;AAAA,UACnC,IAAI,KAAK;AAAA,UACT,OAAO,KAAK;AAAA,UACZ,GAAI,KAAK,OAAO,EAAE,MAAM,KAAK,KAAA,IAAS,CAAA;AAAA,UACtC,GAAI,KAAK,QAAQ,EAAE,OAAO,KAAK,MAAA,IAAU,CAAA;AAAA,QAAC,EAC1C;AAAA,QACF,UAAU,CAAC,WAAW,aAAa,OAAO,IAAI,MAAM;AAAA,MAAA;AAAA,IAAA,EACtD,CACF;AAAA,EAAA,GACF;AAEJ;"}