@abot-ai/runtime 1.8.1 → 2.0.0

package/dist/src/web-ui/app/components/automations/timeline.js

@@ -46,7 +46,7 @@ function nodeIsRunning(node, run) {
 
 function nodeMetadata(node) {
   if (node.kind === "agent") {
-    return [node.modelProfileId || "Model not selected", displayReasoningMode(node.agentMode) || ""].filter(Boolean).join(" · ");
+    return [node.modelProfileId || "Model not selected", displayReasoningMode(node.agentMode, node.reasoningPreference) || ""].filter(Boolean).join(" · ");
   }
   return [node.operation?.toolName, node.operation?.operationId].filter(Boolean).join(" · ") || "Operation not selected";
 }
@@ -128,7 +128,7 @@ export function renderAutomationNodeDetails(node, run = null) {
   const record = nodeRunState(run, node.id);
   const operation = node.kind === "tool"
     ? `<dt>Operation</dt><dd>${escapeHtml(nodeMetadata(node))}</dd>`
-    : `<dt>Model</dt><dd>${escapeHtml(node.modelProfileId || "Not selected")}</dd><dt>Role</dt><dd>${escapeHtml(displayReasoningMode(node.agentMode) || "Not selected")}</dd>`;
+    : `<dt>Model</dt><dd>${escapeHtml(node.modelProfileId || "Not selected")}</dd><dt>Role</dt><dd>${escapeHtml(displayReasoningMode(node.agentMode, node.reasoningPreference) || "Not selected")}</dd>`;
   const prompt = node.kind === "agent" && node.prompt
     ? `<div class="automation-inspector-prompt"><strong>Prompt</strong><p dir="auto">${escapeHtml(node.prompt)}</p></div>`
     : "";

package/dist/src/web-ui/app/components/automations/workspace-navigation.js

@@ -0,0 +1,37 @@
+import { captureAutomationConfirmationScope } from "./confirmation-actions.js";
+import { focusSelectedAutomationStep } from "./run-steps-view.js";
+
+/** Clean navigation stays synchronous; an async discard approval is never truthy permission. */
+export function createAutomationWorkspaceNavigation({ actions, getCurrent, getEditRevision, prepareLeave, root }) {
+  let requestRevision = 0;
+  function leave(operation) {
+    const revision = ++requestRevision;
+    const isCurrent = captureAutomationConfirmationScope({ actions, getCurrent, getEditRevision });
+    function commit(approved) {
+      if (approved !== true && typeof approved !== "function") return false;
+      if (revision !== requestRevision) return false;
+      if (!isCurrent()) return false;
+      if (approved?.canCommit?.() === false) return false;
+      if (typeof approved === "function" && approved() === false) return false;
+      return operation();
+    }
+    const approved = prepareLeave();
+    if (typeof approved?.then === "function") return Promise.resolve(approved).then(commit);
+    return commit(approved);
+  }
+  function selectNode(element) {
+    return leave(() => {
+      const current = getCurrent();
+      const nodeId = element.dataset.selectNode || element.dataset.automationNode || "";
+      if (nodeId === current.selectedNodeId || !nodeId) { actions.selectNode(""); return; }
+      const nodeButton = element.dataset.automationNode !== undefined ? element
+        : [...root.querySelectorAll("[data-automation-node]")]
+          .find((item) => item.dataset.automationNode === nodeId);
+      if (element.dataset.selectNode !== undefined)
+        nodeButton?.scrollIntoView?.({ block: "nearest", inline: "nearest" });
+      actions.selectNode(nodeId);
+      if (current.selectedRunId) focusSelectedAutomationStep(root);
+    });
+  }
+  return { leave, selectNode };
+}

package/dist/src/web-ui/app/components/automations/workspace.js

@@ -5,13 +5,14 @@ import { createAutomationDraftRecoveryCommands } from "./draft-recovery-actions.
 import { activateAutomationLibraryTab, automationLibraryTabForKey, renderAutomationLibraryTabs } from "./library-tabs.js";
 import { readAutomationDefinitionPatch, renderAutomationEditor, renderAutomationToolResults, toolDisplayName } from "./editor.js";
 import { createAutomationStepEditorDialog } from "./step-editor-dialog.js";
-import { focusSelectedAutomationStep } from "./run-steps-view.js";
 import { renderAutomationRun } from "./run.js";
+import { createAutomationRunHistoryControls } from "./run-history-controls.js";
 import { findAutomationPosition } from "../../lib/automation-graph-position.js";
 import { canWrapAutomationSequence } from "../../lib/automation-parallel-depth.js";
 import { createAutomationTimelineCamera } from "./timeline-camera.js";
 import { createAutomationLiveView } from "./live-view.js";
-import { automationRerunConfirmation } from "./rerun-confirmation.js";
+import { createAutomationConfirmations, createAutomationDestructiveCommands } from "./confirmation-actions.js";
+import { createAutomationWorkspaceNavigation } from "./workspace-navigation.js";
 import { matchesAutomationGrant, requiresFullPlus, selectedAutomationOperations } from "./permission-selection.js";
 
 const DRAG_TYPE = "application/x-abot-automation-step";
@@ -33,6 +34,7 @@ export function paletteNode(target, catalog) {
   return {
     kind: "agent", title: agent.title || "New agent", onFailure: agent.onFailure || "stop",
     modelProfileId: agent.modelProfileId || "", agentMode: agent.agentMode || "fast",
+    ...(agent.reasoningPreference ? { reasoningPreference: { ...agent.reasoningPreference } } : {}),
     roleInstructions: agent.roleInstructions || "", prompt: agent.prompt || "",
     inputs: agent.inputs || {}, tools: agent.tools || [], result: agent.result || { kind: "text" },
     ...(Array.isArray(agent.acceptance) ? { acceptance: agent.acceptance } : {}),
@@ -52,10 +54,11 @@ function permissionDialogMarkup(selection, purpose, revision) {
 
 export function createAutomationsWorkspace({
   root, actions, documentRoot = document,
-  confirmDiscard = (message) => window.confirm(message),
+  confirmDiscard,
 }) {
   let current = actions.snapshot();
   let definitionDirty = false;
+  let editRevision = 0;
   let insertion = null;
   let permissionDialog = null;
   let paletteQuery = "";
@@ -70,6 +73,10 @@ export function createAutomationsWorkspace({
     isEditing: () => Boolean(current.selectedNodeId) || stepEditor.isOpen(),
   });
   const liveView = createAutomationLiveView(root);
+  const runHistory = createAutomationRunHistoryControls({ root, actions });
+  const confirmationScope = { actions, getCurrent: () => current, getEditRevision: () => editRevision };
+  const confirmations = createAutomationConfirmations({ ...confirmationScope, confirm: confirmDiscard });
+  const navigation = createAutomationWorkspaceNavigation({ ...confirmationScope, prepareLeave, root });
 
   function isDirty() { return definitionDirty || stepEditor.isDirty(); }
 
@@ -81,10 +88,12 @@ export function createAutomationsWorkspace({
   function prepareLeave() {
     if (!stepEditor.prepareLeave()) return false;
     if (permissionDialog?.open) permissionDialog.close();
-    if (!isDirty()) return true;
-    if (!confirmDiscard("Discard unsaved automation changes?")) return false;
-    definitionDirty = false;
-    return true;
+    if (!isDirty()) { confirmations.invalidate(); return true; }
+    return confirmations.prepare("Discard unsaved automation changes?",
+      { title: "Discard changes", confirmLabel: "Discard", tone: "danger" }, () => {
+        definitionDirty = false;
+        return true;
+      });
   }
 
   function requireSavedGraph() {
@@ -132,7 +141,9 @@ export function createAutomationsWorkspace({
     const previousNodeId = renderedNodeId;
     const viewIdentity = `${snapshot.selectedAutomationId}/${snapshot.selectedRunId || "editor"}`;
     const sameEditor = snapshot.selectedAutomationId === current.selectedAutomationId && !snapshot.selectedRunId;
-    if (!liveView.isCurrent(viewIdentity)) { paletteQuery = ""; paletteSelectedTool = ""; insertion = null; detailsCollapsed = false; camera.resetState(); }
+    const viewChanged = !liveView.isCurrent(viewIdentity);
+    const historyHadFocus = documentRoot.activeElement?.matches?.("[data-select-run]");
+    if (viewChanged) { paletteQuery = ""; paletteSelectedTool = ""; insertion = null; detailsCollapsed = false; camera.resetState(); }
     else camera.capture();
     const retainedDefinition = definitionDirty && sameEditor
       ? root.querySelector("[data-automation-definition-form]") : null;
@@ -144,6 +155,7 @@ export function createAutomationsWorkspace({
         : renderAutomationEditor(snapshot, { query: paletteQuery, selectedToolName: paletteSelectedTool });
     const changed = liveView.update(viewIdentity, renderAutomationLibraryTabs(snapshot, markup, activeLibraryTab));
     if (changed && retainedDefinition) root.querySelector("[data-automation-definition-form]")?.replaceWith(retainedDefinition);
+    runHistory.sync(snapshot, { viewChanged, focus: historyHadFocus });
     markInsertion();
     updateDetailsVisibility();
     camera.restore();
@@ -161,7 +173,7 @@ export function createAutomationsWorkspace({
   async function selectLibraryTab(name, focus = false) {
     if (name === activeLibraryTab) return;
     if (name === "templates" && current.selectedAutomationId) {
-      if (!prepareLeave() || !await actions.openRoute("", "")) return;
+      if (!await navigation.leave(() => actions.openRoute("", ""))) return;
     }
     activeLibraryTab = name;
     activateAutomationLibraryTab(root, name, { focus });
@@ -228,13 +240,6 @@ export function createAutomationsWorkspace({
     await actions.mutateDraft({ kind: "wrap_parallel", nodeIds: [current.selectedNodeId, position.next.id] });
   }
 
-  async function removeStep() {
-    if (!requireSavedGraph()) return;
-    if (!confirmDiscard("Remove this step from the draft?")) return;
-    const removed = await actions.mutateDraft({ kind: "remove_node", nodeId: current.selectedNodeId });
-    if (removed) actions.selectNode("");
-  }
-
   function openPermissionDialog(purpose) {
     if (permissionDialog?.open) return;
     const selectedAutomation = current.automations.find((item) => item.id === current.selectedAutomationId);
@@ -287,23 +292,20 @@ export function createAutomationsWorkspace({
   }
 
   const command = {
-    ...createAutomationDraftRecoveryCommands({ actions, requireSavedGraph, confirmDiscard,
+    ...createAutomationDraftRecoveryCommands({ actions, requireSavedGraph,
+      confirmDiscard: (message, options) => confirmations.run(message, options, () => true),
       onRestored: () => { definitionDirty = false; insertion = null; } }),
     ...createAutomationArchiveCommands({ actions, getCurrent: () => current, requireSavedGraph,
-      confirmDiscard, onFilterChange: (archived) => { showArchived = archived; } }),
+      confirmations, onFilterChange: (archived) => { showArchived = archived; } }),
+    ...createAutomationDestructiveCommands({ actions, getCurrent: () => current, requireSavedGraph,
+      confirmations, onDraftDeleted: () => { definitionDirty = false; insertion = null; } }),
     "show-full-step-output": () => actions.showFullStepOutput(),
     refresh: () => actions.refresh(), create: () => actions.create(),
     describe: () => actions.openAuthoringChat(current.selectedAutomationId, current.draft?.revision),
-    back: () => { if (prepareLeave()) return actions.openRoute("", ""); },
+    back: () => navigation.leave(() => actions.openRoute("", "")),
     "save-draft": saveDefinition,
     "edit-step": () => stepEditor.open(root.querySelector('[data-action="edit-step"]')),
     "toggle-details": () => { detailsCollapsed = !detailsCollapsed; updateDetailsVisibility(); },
-    "delete-draft": async () => {
-      if (!current.draft || current.publishedDefinition ||
-          current.automations.find((item) => item.id === current.selectedAutomationId)?.publishedRevision) return;
-      if (!confirmDiscard("Delete this unpublished automation draft and all its steps? This cannot be undone.")) return;
-      if (await actions.deleteDraft()) { definitionDirty = false; insertion = null; }
-    },
     "save-agent": () => { if (requireSavedGraph()) return actions.saveAgent(); },
     validate: () => { if (requireSavedGraph()) return actions.validate(); },
     publish: async () => {
@@ -314,15 +316,16 @@ export function createAutomationsWorkspace({
     run: () => { if (requireSavedGraph()) return actions.startRun(); },
     "toggle-active": () => current.automations.find((item) => item.id === current.selectedAutomationId)?.status === "active"
       ? actions.setActive(false) : openPermissionDialog("activate"),
-    "show-runs": () => { if (prepareLeave()) return current.runs[0] ? actions.openRun(current.runs[0].id) : notify("No runs yet."); },
-    editor: () => { if (prepareLeave()) return actions.openRoute(current.selectedAutomationId, ""); },
+    "show-runs": () => navigation.leave(() => {
+      const runId = current.runs[0]?.id || current.lastViewedRunId;
+      return runId ? actions.openRun(runId) : notify("No runs yet.");
+    }),
+    editor: () => navigation.leave(() => actions.openRoute(current.selectedAutomationId, "")),
     stop: () => actions.stopRun(),
-    rerun: () => current.run &&
-      confirmDiscard(automationRerunConfirmation(current.run)) && actions.rerun(),
     "open-chat-run": () => actions.showChatRun(current.selectedRunId),
     "move-up": () => moveStep(-1), "move-down": () => moveStep(1),
     "move-to-slot": moveToSlot,
-    parallel: wrapParallel, "remove-node": removeStep,
+    parallel: wrapParallel,
   };
 
   root.addEventListener("input", (event) => {
@@ -331,10 +334,10 @@ export function createAutomationsWorkspace({
       refreshToolPalette();
       return;
     }
-    if (event.target.closest("[data-automation-definition-form]")) definitionDirty = true;
+    if (event.target.closest("[data-automation-definition-form]")) { definitionDirty = true; editRevision += 1; }
   });
   root.addEventListener("change", (event) => {
-    if (event.target.closest("[data-automation-definition-form]")) definitionDirty = true;
+    if (event.target.closest("[data-automation-definition-form]")) { definitionDirty = true; editRevision += 1; }
   });
   root.addEventListener("click", (event) => {
     const element = event.target.closest("button");
@@ -353,28 +356,19 @@ export function createAutomationsWorkspace({
       return;
     }
     if (element.dataset.selectAutomation !== undefined) {
-      if (prepareLeave()) void actions.openRoute(element.dataset.selectAutomation, "");
+      void navigation.leave(() => actions.openRoute(element.dataset.selectAutomation, ""));
       return;
     }
     if (element.dataset.templateId !== undefined) {
-      if (prepareLeave()) void actions.createTemplate(element.dataset.templateId);
+      void navigation.leave(() => actions.createTemplate(element.dataset.templateId));
       return;
     }
     if (element.dataset.selectRun !== undefined) {
-      if (prepareLeave()) void actions.openRun(element.dataset.selectRun);
+      void navigation.leave(() => actions.openRun(element.dataset.selectRun));
       return;
     }
     if (element.dataset.selectNode !== undefined || element.dataset.automationNode !== undefined) {
-      if (!prepareLeave()) return;
-      const nodeId = element.dataset.selectNode || element.dataset.automationNode || "";
-      if (nodeId === current.selectedNodeId || !nodeId) { actions.selectNode(""); return; }
-      const nodeButton = element.dataset.automationNode !== undefined ? element
-        : [...root.querySelectorAll("[data-automation-node]")]
-          .find((item) => item.dataset.automationNode === nodeId);
-      if (element.dataset.selectNode !== undefined)
-        nodeButton?.scrollIntoView?.({ block: "nearest", inline: "nearest" });
-      actions.selectNode(nodeId);
-      if (current.selectedRunId) focusSelectedAutomationStep(root);
+      void navigation.selectNode(element);
       return;
     }
     if (element.dataset.insertParent !== undefined) {

package/dist/src/web-ui/app/components/config-workspace/config-model.js

@@ -1,3 +1,5 @@
+import { parseReasoningBudgetMode } from "./reasoning-budget.js";
+import { parseReasoningModeBudgets } from "./reasoning-mode-budgets.js";
 import {
   malformedConfigRaw,
   configRequiresRawRepair,
@@ -292,6 +294,10 @@ export function createConfigWorkspaceModel() {
     const type = input.dataset.valueType || "string";
     if (type === "boolean") return input.checked;
     if (type === "number") return parseNumericConfigInputValue(input);
+    if (type === "reasoning-budget-mode")
+      return parseReasoningBudgetMode(input.value, getConfigPathValue(file.config, path));
+    if (type === "reasoning-mode-budgets")
+      return parseReasoningModeBudgets(input.value, getConfigPathValue(file.config, path));
     if (type === "execution-policy") {
       return executionPolicyValueForConfig(
         input.value,

package/dist/src/web-ui/app/components/config-workspace/model-removal.js

@@ -1,3 +1,4 @@
+import { confirmDialog } from "../confirmation-dialog.js";
 function isDefinitiveModelRemovalRejection(error) {
   const status = error?.status;
   if (!Number.isInteger(status)) return false;
@@ -24,7 +25,7 @@ export function createModelRemovalController({
   refreshRuntimeConfig,
   onSaved,
   setStatus,
-  confirmRemoval = (message) => window.confirm(message),
+  confirmRemoval = (message) => confirmDialog(message, { title: "Remove model", confirmLabel: "Remove model", tone: "danger" }),
 }) {
   let pending = false;
 
@@ -78,11 +79,12 @@ export function createModelRemovalController({
     pending = true;
     try {
       if (
-        !confirmRemoval(
+        !await confirmRemoval(
           `Remove ${label || profileId} from configured models? Its model file, provider and credentials will be kept.`,
         )
       )
         return false;
+      if (environmentId !== getEnvironmentId()) return false;
       try {
         await removeModel({ profileId, expectedRevision }, environmentId);
       } catch (error) {

package/dist/src/web-ui/app/components/config-workspace/model-rendering.js

@@ -1,3 +1,5 @@
+import { isTokenBudgetModel, renderReasoningBudget, renderReasoningEffort } from "./reasoning-budget.js";
+import { renderReasoningModeBudgets } from "./reasoning-mode-budgets.js";
 import { configRequiresRawRepair } from "./raw-config-repair.js";
 import { escapeAttribute, escapeHtml, textOf } from "../../lib/text-format.js";
 import { isConfigObject } from "./config-model.js";
@@ -128,22 +130,9 @@ export function createConfigModelRendering({
               [...basePath, "generation", "topP"],
               { type: "number", step: "0.01" },
             )}</label>
-            <label><span>Reasoning</span>${renderConfigInput(
-              file,
-              [...basePath, "generation", "reasoningEffort"],
-              {
-                type: "select",
-                values: [
-                  "",
-                  "none",
-                  "minimal",
-                  "low",
-                  "medium",
-                  "high",
-                  "xhigh",
-                ],
-              },
-            )}</label>
+            ${renderReasoningBudget(file, [...basePath, "generation"], renderConfigInput, { supported: isTokenBudgetModel(file, state.configDashboard, profile), dashboard: state.configDashboard })}
+            ${renderReasoningEffort(file, [...basePath, "generation"], renderConfigInput)}
+            ${renderReasoningModeBudgets(file, [...basePath, "generation"], renderConfigInput, { supported: isTokenBudgetModel(file, state.configDashboard, profile) })}
           </div>
           <button
             class="config-icon-button config-calibration-remove"
@@ -239,6 +228,9 @@ export function createConfigModelRendering({
               ["contextWindowTokens"],
               { type: "number", min: "1", step: "1" },
             )}</label>
+            ${isTokenBudgetModel(model, state.configDashboard) ? renderReasoningEffort(model, ["generation"], renderConfigInput) : ""}
+            ${renderReasoningBudget(model, ["generation"], renderConfigInput, { supported: isTokenBudgetModel(model, state.configDashboard), dashboard: state.configDashboard })}
+            ${renderReasoningModeBudgets(model, ["generation"], renderConfigInput, { supported: isTokenBudgetModel(model, state.configDashboard) })}
           </div>
           ${renderExecutionRoute(model)}
         </div>

package/dist/src/web-ui/app/components/config-workspace/reasoning-budget-edit.js

@@ -0,0 +1,113 @@
+import {
+  effectiveReasoningBudgetEffort,
+  isTokenBudgetModel,
+  reasoningBudgetStatusText,
+} from "./reasoning-budget.js";
+
+function isReasoningGenerationPath(path) {
+  if (!Array.isArray(path)) return false;
+  if (path.length === 1) return path[0] === "generation";
+  if (path.length !== 3) return false;
+  return path[0] === "calibration" && typeof path[1] === "string" &&
+    path[2] === "generation";
+}
+
+function budgetEditGenerationPath(path) {
+  const budgetIndex = path.lastIndexOf("reasoningBudget");
+  if (budgetIndex < 0) return undefined;
+  const generation = path.slice(0, budgetIndex);
+  return isReasoningGenerationPath(generation) ? generation : undefined;
+}
+
+function reasoningStatusGenerationPath(element) {
+  try {
+    const path = JSON.parse(element.dataset.reasoningGenerationPath);
+    return isReasoningGenerationPath(path) ? path : undefined;
+  } catch {
+    return undefined;
+  }
+}
+
+function generationCalibration(file, path) {
+  if (path[0] !== "calibration") return undefined;
+  return file.config.calibration?.[path[1]];
+}
+
+function hasPositiveReasoningTokenLimit(value) {
+  if (!Number.isInteger(value)) return false;
+  if (value <= 0) return false;
+  return value <= 2147483647;
+}
+
+function budgetModeEnablesThinking(value) {
+  if (value?.mode === "server-default") return true;
+  if (value?.mode !== "tokens") return false;
+  return hasPositiveReasoningTokenLimit(value.tokens);
+}
+
+function explicitlyEnablesBudget(path, value) {
+  if (path.at(-1) === "reasoningBudget")
+    return budgetModeEnablesThinking(value);
+  if (path.at(-1) !== "tokens" || path.at(-2) !== "reasoningBudget")
+    return false;
+  return hasPositiveReasoningTokenLimit(value);
+}
+
+/** A form budget action enables only the edited generation scope. */
+export function activateEditedReasoningBudget(
+  file,
+  dashboard,
+  path,
+  value,
+  setConfigPathValue,
+) {
+  if (file.kind !== "model" || !explicitlyEnablesBudget(path, value))
+    return undefined;
+  const generationPath = budgetEditGenerationPath(path);
+  if (!generationPath) return undefined;
+  const calibration = generationCalibration(file, generationPath);
+  if (!isTokenBudgetModel(file, dashboard, calibration)) return undefined;
+  const effort = effectiveReasoningBudgetEffort(
+    file,
+    dashboard,
+    generationPath,
+  );
+  if (effort !== undefined && effort !== "none") return undefined;
+  setConfigPathValue(
+    file.config,
+    [...generationPath, "reasoningEffort"],
+    "medium",
+  );
+  return generationPath;
+}
+
+function matchesReasoningControl(element, file) {
+  return element.dataset.kind === file.kind && element.dataset.id === file.id;
+}
+
+/** Numeric input keeps focus while the coupled select and status update. */
+export function syncActivatedReasoningBudget(
+  root,
+  file,
+  dashboard,
+  generationPath,
+) {
+  const effortPath = JSON.stringify([...generationPath, "reasoningEffort"]);
+  for (const element of root.querySelectorAll(
+    'select[data-config-action="field"]',
+  )) {
+    if (!matchesReasoningControl(element, file)) continue;
+    if (element.dataset.path !== effortPath) continue;
+    element.value = "medium";
+  }
+  for (const element of root.querySelectorAll(
+    "[data-reasoning-generation-path]",
+  )) {
+    if (!matchesReasoningControl(element, file)) continue;
+    const statusPath = reasoningStatusGenerationPath(element);
+    if (!statusPath) continue;
+    const calibration = generationCalibration(file, statusPath);
+    if (!isTokenBudgetModel(file, dashboard, calibration)) continue;
+    element.textContent = reasoningBudgetStatusText(file, dashboard, statusPath);
+  }
+}

package/dist/src/web-ui/app/components/config-workspace/reasoning-budget.d.ts

@@ -0,0 +1,16 @@
+export declare function isTokenBudgetModel(file: { id?: string; config?: Record<string, unknown> }, dashboard: unknown, calibration?: { profileId?: string }): boolean;
+export declare function shouldRefreshReasoningBudgetFields(
+  file: { kind: string },
+  path: string[],
+  valueType?: string,
+): boolean;
+export declare function parseReasoningBudgetMode(value: string, previous?: { mode: string; tokens?: number }): { mode: string; tokens?: number } | undefined;
+export declare function renderReasoningBudget(
+  file: { kind: string; id: string; config: Record<string, unknown> },
+  generationPath: string[],
+  renderConfigInput: (...args: unknown[]) => string,
+  options?: { supported?: boolean; dashboard?: unknown },
+): string;
+export declare function effectiveReasoningBudgetEffort(file: { config: Record<string, any> }, dashboard: unknown, generationPath: string[]): string | undefined;
+export declare function reasoningBudgetStatusText(file: { config: Record<string, any> }, dashboard: unknown, generationPath: string[]): string;
+export declare function renderReasoningEffort(file: { config: Record<string, any> }, generationPath: string[], renderConfigInput: (...args: unknown[]) => string): string;

package/dist/src/web-ui/app/components/config-workspace/reasoning-budget.js

@@ -0,0 +1,67 @@
+import { escapeAttribute } from "../../lib/text-format.js";
+
+function reasoningBudgetTarget(file, dashboard, calibration) {
+  const targetId = calibration?.profileId;
+  return targetId && targetId !== file.id
+    ? dashboard?.files?.models?.find((model) => model.id === targetId)
+    : file;
+}
+
+export function isTokenBudgetModel(file, dashboard, calibration) {
+  const target = reasoningBudgetTarget(file, dashboard, calibration);
+  if (target?.config?.supportsThinking !== true) return false;
+  const providerId = target.config.provider;
+  return dashboard?.files?.runtime?.config?.models?.providers?.[providerId]?.type === "llamacpp";
+}
+
+export function shouldRefreshReasoningBudgetFields(file, path, valueType) {
+  if (valueType === "reasoning-budget-mode") return true;
+  if (valueType === "reasoning-mode-budgets") return true;
+  if (file.kind !== "model") return false;
+  if (path.at(-1) === "reasoningEffort") return true;
+  if (path.length !== 1) return false;
+  return path[0] === "supportsThinking" || path[0] === "provider";
+}
+
+export function parseReasoningBudgetMode(value, previous) {
+  if (value === "inherit") return undefined;
+  if (value === "server-default") return { mode: "server-default" };
+  return { mode: "tokens", tokens: previous?.mode === "tokens" ? previous.tokens : 0 };
+}
+
+export function effectiveReasoningBudgetEffort(file, dashboard, generationPath) {
+  const generation = generationPath.reduce((value, key) => value?.[key], file.config);
+  if (generation?.reasoningEffort !== undefined) return generation.reasoningEffort;
+  if (generationPath[0] !== "calibration") return undefined;
+  const calibration = file.config?.calibration?.[generationPath[1]];
+  return reasoningBudgetTarget(file, dashboard, calibration)?.config?.generation?.reasoningEffort;
+}
+
+export function reasoningBudgetStatusText(file, dashboard, generationPath) {
+  const budget = generationPath.reduce((value, key) => value?.[key], file.config)?.reasoningBudget;
+  const savedBudgetIsOff = budget !== undefined &&
+    effectiveReasoningBudgetEffort(file, dashboard, generationPath) === "none";
+  if (savedBudgetIsOff)
+    return "Inactive while reasoning is Off. Choose a positive token limit or Server default to enable thinking.";
+  return "Per reasoning segment. Zero disables thinking; a positive budget enables it. Off keeps the saved budget inactive.";
+}
+
+export function renderReasoningEffort(file, generationPath, renderConfigInput) {
+  return `<label><span>Reasoning effort</span>${renderConfigInput(file, [...generationPath, "reasoningEffort"], {
+    type: "select", values: ["", "none", "minimal", "low", "medium", "high", "xhigh"],
+  })}<small>Default inherits the profile or request mode. None disables thinking unless a mode token limit or request setting enables it.</small></label>`;
+}
+
+export function renderReasoningBudget(file, generationPath, renderConfigInput, { supported = true, dashboard } = {}) {
+  const budget = generationPath.reduce((value, key) => value?.[key], file.config)?.reasoningBudget;
+  if (!supported && budget === undefined) return "";
+  const path = [...generationPath, "reasoningBudget"];
+  const mode = budget?.mode || "inherit";
+  const attributes = `data-config-action="field" data-kind="${escapeAttribute(file.kind)}" data-id="${escapeAttribute(file.id)}" data-path="${escapeAttribute(JSON.stringify(path))}" data-value-type="reasoning-budget-mode"`;
+  return `<label><span>Thinking budget</span><select ${attributes}>
+    <option value="inherit" ${mode === "inherit" ? "selected" : ""}>Inherit (no override)</option>
+    ${supported ? `<option value="server-default" ${mode === "server-default" ? "selected" : ""}>Server default</option>
+    <option value="tokens" ${mode === "tokens" ? "selected" : ""}>Token limit</option>` : `<option value="${escapeAttribute(mode)}" selected disabled>Saved override (unsupported target)</option>`}
+  </select><small data-reasoning-generation-path="${escapeAttribute(JSON.stringify(generationPath))}" data-kind="${escapeAttribute(file.kind)}" data-id="${escapeAttribute(file.id)}">${supported ? reasoningBudgetStatusText(file, dashboard, generationPath) : "This target does not support token budgets. Choose Inherit to remove this override."}</small></label>
+  ${supported && mode === "tokens" ? `<label><span>Thinking tokens</span>${renderConfigInput(file, [...path, "tokens"], { type: "number", min: "0", step: "1" })}<small>Enter a non-negative whole number; 0 disables thinking. The answer also needs capacity within the total output limit.</small></label>` : ""}`;
+}

package/dist/src/web-ui/app/components/config-workspace/reasoning-mode-budgets.d.ts

@@ -0,0 +1,7 @@
+export declare function parseReasoningModeBudgets(value: string, previous?: Record<string, number>): Record<string, number> | undefined;
+export declare function renderReasoningModeBudgets(
+  file: { kind: string; id: string; config: Record<string, any> },
+  generationPath: string[],
+  renderConfigInput: (...args: any[]) => string,
+  options?: { supported?: boolean },
+): string;

package/dist/src/web-ui/app/components/config-workspace/reasoning-mode-budgets.js

@@ -0,0 +1,25 @@
+import { escapeAttribute } from "../../lib/text-format.js";
+
+const REASONING_MODES = [["fast", "Low"], ["reasoning", "Reasoning"], ["deep", "Deep"]];
+
+export function parseReasoningModeBudgets(value, previous) {
+  if (value === "inherit") return undefined;
+  return previous ?? {};
+}
+
+export function renderReasoningModeBudgets(file, generationPath, renderConfigInput, { supported = true } = {}) {
+  const generation = generationPath.reduce((value, key) => value?.[key], file.config);
+  const budgets = generation?.reasoningBudgetByMode;
+  if (!supported && budgets === undefined) return "";
+  const path = [...generationPath, "reasoningBudgetByMode"];
+  const custom = budgets !== undefined;
+  const attributes = `data-config-action="field" data-kind="${escapeAttribute(file.kind)}" data-id="${escapeAttribute(file.id)}" data-path="${escapeAttribute(JSON.stringify(path))}" data-value-type="reasoning-mode-budgets"`;
+  const selector = `<label><span>Mode token overrides</span><select ${attributes}>
+    <option value="inherit" ${custom ? "" : "selected"}>Inherit (no override)</option>
+    ${supported ? `<option value="custom" ${custom ? "selected" : ""}>Custom limits by mode</option>` : '<option value="custom" selected disabled>Saved override (unsupported target)</option>'}
+  </select><small>${supported
+    ? "Optional limits for main model steps. A custom map replaces inherited mode limits; blank entries use the ordinary effort and budget settings."
+    : "This target does not support token budgets. Choose Inherit to remove this override."}</small></label>`;
+  if (!supported || !custom) return selector;
+  return selector + REASONING_MODES.map(([mode, label]) => `<label><span>${label} thinking tokens</span>${renderConfigInput(file, [...path, mode], { type: "number", min: "0", step: "1" })}<small>Optional non-negative integer. Zero disables thinking; positive values enable it for this mode, including Low. Explicit request or invocation Off still wins.</small></label>`).join("");
+}

package/dist/src/web-ui/app/components/config-workspace/workspace-events.js

@@ -1,3 +1,5 @@
+import { activateEditedReasoningBudget, syncActivatedReasoningBudget } from "./reasoning-budget-edit.js";
+import { shouldRefreshReasoningBudgetFields } from "./reasoning-budget.js";
 import { rememberCalibrationDisclosure } from "./calibration-disclosure.js";
 import { textOf } from "../../lib/text-format.js";
 import { resolveModelExecutionRoute } from "./config-model.js";
@@ -72,10 +74,17 @@ export function createConfigWorkspaceEvents({
       action === "step-value"
         ? element.value
         : parseConfigInputValue(element, file, path);
-    mutateConfigFile(element.dataset.kind, element.dataset.id, (config) =>
-      applyConfigFieldValue(config, element, path, value),
-    );
+    let activatedGeneration;
+    mutateConfigFile(element.dataset.kind, element.dataset.id, (config) => {
+      applyConfigFieldValue(config, element, path, value);
+      activatedGeneration = activateEditedReasoningBudget(
+        file, state.configDashboard, path, value, setConfigPathValue,
+      );
+    });
+    if (activatedGeneration)
+      syncActivatedReasoningBudget(dom.configDashboard, file, state.configDashboard, activatedGeneration);
     syncExecutionRouteDescription(element);
+    if (shouldRefreshReasoningBudgetFields(file, path, element.dataset.valueType)) renderConfigDashboard();
   }
 
   function handleDashboardInput(event) {
@@ -90,8 +99,7 @@ export function createConfigWorkspaceEvents({
     if (dashboardIsBusy()) return;
     const element = event.target;
     if (element?.id === "configRawFileSelect") {
-      changeRawFile(element.value, element);
-      return;
+      return changeRawFile(element.value, element);
     }
     const actionElement = element?.closest?.("[data-config-action]");
     if (!actionElement) return;
@@ -273,9 +281,9 @@ export function createConfigWorkspaceEvents({
   function bind() {
     if (state.bound) return;
     state.bound = true;
-    dom.refreshConfigButton.addEventListener("click", () => {
+    dom.refreshConfigButton.addEventListener("click", async () => {
       if (dashboardIsBusy()) return;
-      if (!confirmDiscardChanges("refresh configuration")) return;
+      if (!await confirmDiscardChanges("refresh configuration")) return;
       void loadRuntimeConfig({ protectUnsaved: false });
     });
     dom.configDashboard.addEventListener("click", handleDashboardClick);