@abot-ai/runtime 1.6.0 → 1.8.0

package/dist/src/web-ui/app/components/runtime-setup/connection-form.js

@@ -25,6 +25,7 @@ export function renderConnectionField({
   value = "",
   placeholder = "",
   help = "",
+  error = "",
   required = true,
   readonly = false,
   min = "",
@@ -32,8 +33,9 @@ export function renderConnectionField({
   idPrefix = "runtimeSetup",
 }) {
   return `<label class="runtime-setup-field"><span>${label}</span>
-    <input type="${type}" data-runtime-setup-field="${field}" value="${escapeAttribute(value)}" placeholder="${escapeAttribute(placeholder)}" autocomplete="${type === "password" ? "new-password" : "off"}" spellcheck="false" ${min ? `min="${escapeAttribute(min)}"` : ""} ${step ? `step="${escapeAttribute(step)}"` : ""} ${required ? "required" : ""} ${readonly ? "readonly" : ""} aria-describedby="${idPrefix}Help-${field}" />
+    <input type="${type}" data-runtime-setup-field="${field}" value="${escapeAttribute(value)}" placeholder="${escapeAttribute(placeholder)}" autocomplete="${type === "password" ? "new-password" : "off"}" spellcheck="false" ${min ? `min="${escapeAttribute(min)}"` : ""} ${step ? `step="${escapeAttribute(step)}"` : ""} ${required ? "required" : ""} ${readonly ? "readonly" : ""} ${error ? 'aria-invalid="true"' : ""} aria-describedby="${idPrefix}Help-${field}${error ? ` ${idPrefix}Error-${field}` : ""}" />
     <small id="${idPrefix}Help-${field}">${help}</small>
+    ${error ? `<small id="${idPrefix}Error-${field}" class="runtime-setup-feedback error" role="alert">${escapeHtml(error)}</small>` : ""}
   </label>`;
 }
 
@@ -60,7 +62,8 @@ export function renderConnectionFields(state) {
       label: "Context window (tokens)",
       type: "number",
       value: state.contextWindowTokens,
-      min: "1",
+      min: state.contextWindowFeedback?.minimumTokens || "1",
+      error: state.contextWindowFeedback?.message,
       step: "1",
       readonly: !canEditSetupConnection(state),
       help: "Use a value supported by your model. Larger windows need more memory with Ollama. You can change this later in Models.",

package/dist/src/web-ui/app/components/runtime-setup/connection-state.js

@@ -1,5 +1,6 @@
 import { textOf } from "../../lib/text-format.js";
 import { normalizeProvider } from "./validation.js";
+import { readSetupContextWindowFeedback } from "./context-window-feedback.js";
 
 export function selectSetupProvider(state, value) {
   const provider = normalizeProvider(value);
@@ -36,7 +37,14 @@ export function setupConnectionSubmitLabel(state, apiKey = "") {
     : "Save connection";
 }
 
-export function setupConnectionSaveError(error) {
+export function receiveSetupConnectionSaveError(state, error) {
+  state.contextWindowFeedback = readSetupContextWindowFeedback(error);
+  state.error = "";
+  if (state.contextWindowFeedback) return;
+  state.error = setupConnectionSaveError(error);
+}
+
+function setupConnectionSaveError(error) {
   if (error?.payload?.error === "setup_configuration_changed")
     return "Your connection changed in another window. Refresh this page before editing it again.";
   return "Could not save your connection. Check the model and connection details, then try again.";

package/dist/src/web-ui/app/components/runtime-setup/context-window-feedback.js

@@ -0,0 +1,71 @@
+function hasPositiveContextTokenCount(value) {
+  if (!Number.isSafeInteger(value)) return false;
+  return value > 0;
+}
+
+function hasSupportedContextConstraint(details) {
+  if (details?.field !== "contextWindowTokens") return false;
+  for (const field of ["declaredTokens", "effectiveTokens", "minimumTokens"]) {
+    if (!hasPositiveContextTokenCount(details[field])) return false;
+  }
+  if (!Number.isSafeInteger(details.reservedTokens)) return false;
+  if (details.reservedTokens < 0) return false;
+  if (details.effectiveTokens > details.reservedTokens) return false;
+  if (details.effectiveTokens > details.declaredTokens) return false;
+  if (details.minimumTokens <= details.reservedTokens) return false;
+  if (details.allocationTokens === undefined) return true;
+  if (!hasPositiveContextTokenCount(details.allocationTokens)) return false;
+  return details.effectiveTokens <= details.allocationTokens;
+}
+
+function hasInsufficientContextAllocation(details) {
+  if (details.allocationTokens === undefined) return false;
+  return details.allocationTokens < details.minimumTokens;
+}
+
+function formatContextConstraintMessage(details) {
+  const tokens = (value) => value.toLocaleString("en-US");
+  const capacity = `The effective context window is ${tokens(details.effectiveTokens)} tokens, but the current configuration reserves ${tokens(details.reservedTokens)} tokens.`;
+  const minimum = `Use a context window of at least ${tokens(details.minimumTokens)} tokens supported by your model, or adjust the configured reserves.`;
+  if (!hasInsufficientContextAllocation(details))
+    return `${capacity} ${minimum}`;
+  return `${capacity} ${minimum} The configured Ollama allocation (num_ctx) is ${tokens(details.allocationTokens)} tokens. It must also reach that minimum; increasing this field alone is insufficient.`;
+}
+
+/** Only numeric details from this known contract become user-visible feedback. */
+export function readSetupContextWindowFeedback(error) {
+  if (error?.status !== 400) return null;
+  const payload = error.payload;
+  if (payload?.ok !== false) return null;
+  if (payload.error !== "context_window_too_small") return null;
+  if (!hasSupportedContextConstraint(payload.contextWindow)) return null;
+  return {
+    minimumTokens: payload.contextWindow.minimumTokens,
+    message: formatContextConstraintMessage(payload.contextWindow),
+  };
+}
+
+/** A server constraint belongs to the rejected candidate, never later edits. */
+export function clearSetupContextWindowFeedback(state, container) {
+  if (!state.contextWindowFeedback) return;
+  state.contextWindowFeedback = null;
+  const field = container.querySelector(
+    '[data-runtime-setup-field="context-window"]',
+  );
+  field?.removeAttribute?.("aria-invalid");
+  field?.setAttribute?.("aria-describedby", "runtimeSetupHelp-context-window");
+  field?.setAttribute?.("min", "1");
+  container.querySelector("#runtimeSetupError-context-window")?.remove?.();
+}
+
+export function focusSetupContextWindowFeedback(
+  container,
+  feedback,
+  restoreFocus,
+) {
+  if (!feedback) return;
+  if (!restoreFocus) return;
+  container
+    .querySelector('[data-runtime-setup-field="context-window"]')
+    ?.focus?.();
+}

package/dist/src/web-ui/app/components/runtime-setup/optional-steps.js

@@ -2,6 +2,7 @@ import { createEmbeddingSetupStep } from "./embedding.js";
 import { createSetupPluginStep } from "./plugins.js";
 import { createSystemHostConnectionManager } from "../system-host/manager.js";
 import { hostSetupIsReady } from "../system-host/rendering.js";
+import { isNativeWindowsLocalAccess } from "../system-host/native-windows-access.js";
 
 /** Optional setup steps retain their owning services and never apply the Runtime. */
 export function createSetupOptionalSteps({
@@ -16,6 +17,7 @@ export function createSetupOptionalSteps({
   loadHostConnection,
   connectLocalHost,
   createHostPairing,
+  requestHostStoreConnection,
   requestHostPermissions,
   downloadHostSetup,
   revokeHostConnection,
@@ -48,6 +50,7 @@ export function createSetupOptionalSteps({
         loadConnection: loadHostConnection,
         connectLocal: connectLocalHost,
         createPairing: createHostPairing,
+        requestStoreConnection: requestHostStoreConnection,
         requestPermissions: requestHostPermissions,
         downloadSetup: downloadHostSetup,
         revokeConnection: revokeHostConnection,
@@ -55,9 +58,10 @@ export function createSetupOptionalSteps({
       })
     : null;
   const readyStep = computer ? 5 : 4;
-  function hasFreshComputerReadiness() {
+  function hasFreshComputerSetup() {
     if (!computer) return false;
     if (computer.state.busy || computer.state.statusUnavailable) return false;
+    if (isNativeWindowsLocalAccess(computer.state.snapshot)) return true;
     return hostSetupIsReady(computer.state.snapshot);
   }
   function projection(step) {
@@ -69,7 +73,8 @@ export function createSetupOptionalSteps({
       plugins: plugins.state.snapshot,
       hasComputerStep: Boolean(computer),
       readyStep,
-      computer: hasFreshComputerReadiness() ? computer.state.snapshot : null,
+      computer: hasFreshComputerSetup() ? computer.state.snapshot : null,
+      nativeWindowsAccess: hasFreshComputerSetup() && isNativeWindowsLocalAccess(computer.state.snapshot),
     };
     if (step === 2)
       return {
@@ -88,7 +93,7 @@ export function createSetupOptionalSteps({
       return {
         ...common,
         content: `<div data-onboarding-computer>${computer.markup()}</div>`,
-        canContinue: hasFreshComputerReadiness(),
+        canContinue: hasFreshComputerSetup(),
       };
     return common;
   }
@@ -109,7 +114,7 @@ export function createSetupOptionalSteps({
   }
   function canContinueComputer(step) {
     if (step !== 4) return false;
-    return hasFreshComputerReadiness();
+    return hasFreshComputerSetup();
   }
   return {
     embedding,

package/dist/src/web-ui/app/components/runtime-setup/plugins.js

@@ -1,3 +1,4 @@
+import { renderPluginPlatformNotice } from "../plugins/compatibility.js";
 import { escapeAttribute, escapeHtml } from "../../lib/text-format.js";
 
 function blockReason(plugin, capability) {
@@ -33,6 +34,7 @@ function renderPluginCard(plugin, busy) {
   return `<li class="runtime-plugin-card">
     ${checkbox(plugin, null, busy)}
     <p class="runtime-plugin-summary" title="${escapeAttribute(plugin.description || "")}">${escapeHtml(plugin.description || "Installed Runtime plugin.")}</p>
+    ${renderPluginPlatformNotice(plugin.compatibility)}
     <div class="runtime-plugin-tools-heading"><span>Tools</span><span>${plugin.selectedCapabilityCount} of ${capabilities.length} selected</span></div>
     <ul class="runtime-plugin-capabilities" aria-label="${escapeAttribute(`Tools in ${plugin.id}`)}">${capabilities.map((capability) => `<li>${checkbox(plugin, capability, busy)}</li>`).join("")}</ul>
   </li>`;
@@ -144,7 +146,7 @@ export function createSetupPluginStep({
       state.snapshot?.selection?.enabled === false ||
       state.snapshot?.selection?.deny?.includes("*");
     return `<div class="runtime-setup-plugins">
-      <p class="runtime-setup-feedback">All installed plugins start enabled in a new setup. Turn off anything you do not need.</p>
+      <p class="runtime-setup-feedback">All installed plugins start selected in a new setup. Host compatibility determines which plugins can load. Turn off anything you do not need.</p>
       ${globalBlocked ? '<p class="runtime-setup-feedback">An existing global policy blocks plugins. Your saved policy is preserved.</p>' : ""}
       ${state.error ? `<p class="runtime-setup-feedback error" role="alert">${escapeHtml(state.error)}</p><button type="button" class="runtime-setup-inline-action" data-runtime-setup-action="plugins-reload">Reload selection</button>` : state.message ? `<p class="runtime-setup-feedback" role="status">${escapeHtml(state.message)}</p>` : ""}
       ${state.busy ? '<p class="runtime-setup-feedback" role="status">Saving or loading plugin selection…</p>' : ""}

package/dist/src/web-ui/app/components/runtime-setup/rendering.js

@@ -28,7 +28,7 @@ function readyMarkup(state, optional) {
     <div><dt>Model</dt><dd>${escapeHtml(state.modelId)}</dd></div>
     <div><dt>Context window</dt><dd>${escapeHtml(formatContextWindowTokens(state.contextWindowTokens))}</dd></div>
     <div><dt>Embedding</dt><dd>${escapeHtml(optional.memory?.enabled ? optional.memory.model || "Configured" : "Set up later")}</dd></div>
-    <div><dt>Plugins</dt><dd>${selectedPlugins} enabled</dd></div>
+    <div><dt>Plugins</dt><dd>${selectedPlugins} selected</dd></div>
   </dl></div>`;
 }
 
@@ -79,7 +79,7 @@ function footerMarkup(state, availability, optional) {
   if (state.step === 3)
     return `<button type="button" class="runtime-setup-secondary" data-runtime-setup-action="back" ${disabled}>Back</button><button type="submit" class="runtime-setup-action" ${busy || !optional.canContinue ? "disabled" : ""}>Continue</button>`;
   if (state.step === 4 && optional.hasComputerStep)
-    return `<button type="button" class="runtime-setup-secondary" data-runtime-setup-action="back">Back</button><div class="runtime-setup-footer-actions"><button type="button" class="runtime-setup-secondary" data-runtime-setup-action="skip-computer">Skip for now</button><button type="submit" class="runtime-setup-action" ${!optional.canContinue ? "disabled" : ""}>Continue</button></div>`;
+    return `<button type="button" class="runtime-setup-secondary" data-runtime-setup-action="back">Back</button><div class="runtime-setup-footer-actions">${optional.nativeWindowsAccess ? "" : '<button type="button" class="runtime-setup-secondary" data-runtime-setup-action="skip-computer">Skip for now</button>'}<button type="submit" class="runtime-setup-action" ${!optional.canContinue ? "disabled" : ""}>Continue</button></div>`;
   const secondary =
     state.step === 1 && canEditSetupConnection(state)
       ? `<button type="button" class="runtime-setup-secondary" data-runtime-setup-action="back" ${disabled}>Back</button>`
@@ -112,11 +112,13 @@ export function renderRuntimeSetup(state, availability, optional = {}) {
   const steps = [...STEP_LABELS];
   if (optional.hasComputerStep) {
     steps.splice(4, 0, "Computer");
-    titles.splice(4, 0, "Set up computer access");
+    titles.splice(4, 0, optional.nativeWindowsAccess ? "Your Windows computer" : "Set up computer access");
     descriptions.splice(
       4,
       0,
-      "Optional. Use applications on your computer, or set up access later in Settings.",
+      optional.nativeWindowsAccess
+        ? ""
+        : "Optional. Use applications on your computer, or set up access later in Settings.",
     );
   }
   const content =

package/dist/src/web-ui/app/components/runtime-setup-guide.d.ts

@@ -73,6 +73,7 @@ export interface RuntimeSetupGuideDependencies {
   readonly loadHostConnection?: () => Promise<Record<string, unknown>>;
   readonly connectLocalHost?: () => Promise<Record<string, unknown>>;
   readonly createHostPairing?: () => Promise<Record<string, unknown>>;
+  readonly requestHostStoreConnection?: () => Promise<Record<string, unknown>>;
   readonly requestHostPermissions?: (input: Record<string, unknown>) => Promise<Record<string, unknown>>;
   readonly downloadHostSetup?: (
     platform: "windows" | "macos" | "linux",

package/dist/src/web-ui/app/components/runtime-setup-guide.js

@@ -13,7 +13,7 @@ import {
   hasSetupConnectionChanges,
   receiveSetupConnection,
   selectSetupProvider,
-  setupConnectionSaveError,
+  receiveSetupConnectionSaveError,
   setupConnectionSubmitLabel,
   updateSetupConnectionField,
 } from "./runtime-setup/connection-state.js";
@@ -23,6 +23,10 @@ import {
   validateConnectionFields,
   showConnectionFieldError,
 } from "./runtime-setup/connection-form.js";
+import {
+  clearSetupContextWindowFeedback,
+  focusSetupContextWindowFeedback,
+} from "./runtime-setup/context-window-feedback.js";
 import {
   DEFAULT_OLLAMA_BASE_URL,
   normalizeProvider,
@@ -48,6 +52,7 @@ export function createRuntimeSetupGuide({
   loadHostConnection,
   connectLocalHost,
   createHostPairing,
+  requestHostStoreConnection,
   requestHostPermissions,
   downloadHostSetup,
   revokeHostConnection,
@@ -82,12 +87,13 @@ export function createRuntimeSetupGuide({
   const optionalSteps = createSetupOptionalSteps({
     container, getEnvironmentId, getPreferredProvider: () => state.provider,
     loadEmbeddingStatus, discoverEmbeddingModels, saveEmbedding, loadPlugins,
-    setPlugin, loadHostConnection, connectLocalHost, createHostPairing, requestHostPermissions, downloadHostSetup, revokeHostConnection,
+    setPlugin, loadHostConnection, connectLocalHost, createHostPairing, requestHostStoreConnection, requestHostPermissions, downloadHostSetup, revokeHostConnection,
     onChange: paint, goToStep,
   });
   const { embedding, plugins, readyStep } = optionalSteps;
 
   function goToStep(step) {
+    clearSetupContextWindowFeedback(state, container);
     state.step = step;
     state.error = "";
     paint({ focus: true });
@@ -100,6 +106,7 @@ export function createRuntimeSetupGuide({
   }
 
   function reset() {
+    clearSetupContextWindowFeedback(state, container);
     revision += 1;
     optionalSteps.reset();
     viewState.reset();
@@ -153,6 +160,7 @@ export function createRuntimeSetupGuide({
 
   async function loadOptions() {
     if (state.loading) return;
+    clearSetupContextWindowFeedback(state, container);
     const operationRevision = ++revision;
     const operationEnvironment = getEnvironmentId();
     state.loading = true;
@@ -217,6 +225,7 @@ export function createRuntimeSetupGuide({
   async function submitConnection() {
     const input = connectionInput();
     if (!input) return;
+    clearSetupContextWindowFeedback(state, container);
     const connectionChanged = hasSetupConnectionChanges(state);
     const operationRevision = ++revision;
     const operationEnvironment = getEnvironmentId();
@@ -247,12 +256,13 @@ export function createRuntimeSetupGuide({
       state.step = 2;
     } catch (error) {
       if (!operationIsCurrent(operationRevision, operationEnvironment)) return;
-      state.error = setupConnectionSaveError(error);
+      receiveSetupConnectionSaveError(state, error);
     } finally {
       delete input.apiKey;
       if (operationIsCurrent(operationRevision, operationEnvironment)) {
         state.saving = false;
         paint({ focus: true });
+        focusSetupContextWindowFeedback(container, state.contextWindowFeedback, viewState.canRestoreFocus());
         if (state.step === 2) void embedding.load();
       }
     }
@@ -392,6 +402,7 @@ export function createRuntimeSetupGuide({
       embedding.input(field.dataset.runtimeSetupField, textOf(field.value));
       return;
     }
+    clearSetupContextWindowFeedback(state, container);
     field.removeAttribute?.("aria-invalid");
     updateSetupConnectionField(
       state,
@@ -420,6 +431,7 @@ export function createRuntimeSetupGuide({
       field?.dataset.runtimeSetupField !== "provider"
     )
       return;
+    clearSetupContextWindowFeedback(state, container);
     selectSetupProvider(state, field.value);
     state.error = "";
     paint();

package/dist/src/web-ui/app/components/schedules/form.js

@@ -1,3 +1,4 @@
+import { renderReasoningModeField, syncReasoningModeField, retainedReasoningMode } from "../../lib/reasoning-controls.js";
 import { escapeHtml } from "../../lib/text-format.js";
 import { SCHEDULE_WEEKDAYS } from "../../lib/schedule-presentation.js";
 import { scheduleErrorMessage } from "../../lib/schedule-errors.js";
@@ -88,12 +89,7 @@ export function createScheduleForm({
     <label>Task prompt<textarea name="prompt" rows="5" required dir="auto" placeholder="What should ABot do when this schedule runs?">${escapeHtml(values.prompt || "")}</textarea></label>
     <div class="schedule-form-grid">${scheduleFields(values)}</div>
     <div class="schedule-form-grid"><label>Model<select name="modelProfileId" required><option value="">Choose a model</option>${options(modelOptions, values.modelProfileId)}</select></label>
-    <label>Mode<select name="agentMode">${options(
-      modes
-        .filter((mode) => mode !== "auto")
-        .map((mode) => ({ value: mode, label: mode })),
-      values.agentMode || "reasoning",
-    )}</select></label></div>
+    ${renderReasoningModeField(values.agentMode || "reasoning", models.find((model) => model.id === values.modelProfileId), modes.filter((mode) => mode !== "auto"))}</div>
     <label>Tool access<select name="toolPermissionMode">${options(
       [
         { value: "full_access", label: "Full" },
@@ -116,6 +112,12 @@ export function createScheduleForm({
     }
   }
 
+  const readInput = () => {
+    const data = new FormData(form);
+    data.set("agentMode", retainedReasoningMode(form, values.agentMode || "reasoning"));
+    return scheduleFormInput(data, job?.schedule);
+  };
+  fields.namedItem("modelProfileId").addEventListener("change", () => syncReasoningModeField(form, models, modes.filter((mode) => mode !== "auto")));
   let initialInput;
   form.querySelector("[data-cancel]").addEventListener("click", onCancel);
   fields.namedItem("kind").addEventListener("change", syncKind);
@@ -125,7 +127,7 @@ export function createScheduleForm({
     submit.disabled = true;
     feedback.hidden = true;
     try {
-      const currentInput = scheduleFormInput(new FormData(form), job?.schedule);
+      const currentInput = readInput();
       const input = job
         ? scheduleUpdateInput(currentInput, initialInput)
         : currentInput;
@@ -137,7 +139,7 @@ export function createScheduleForm({
     }
   });
   syncKind();
-  if (job) initialInput = scheduleFormInput(new FormData(form), job.schedule);
+  if (job) initialInput = readInput();
   const initialFields = JSON.stringify([...new FormData(form)]);
   function trackScheduleDraft() {
     form.dataset.dirty = String(

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

@@ -48,12 +48,31 @@ export function createSchedulesWorkspace({
   });
 
   function prepareLeave() {
-    if (!actions.snapshot().editor) return true;
-    if (!canDiscardScheduleDraft()) return false;
-    actions.cancelEdit();
+    const prepared = prepareEnvironmentChange();
+    if (!prepared) return false;
+    prepared();
     return true;
   }
 
+  function prepareEnvironmentChange() {
+    const editor = actions.snapshot().editor;
+    if (editor && !canDiscardScheduleDraft()) return null;
+    const form = details.querySelector(".schedule-editor");
+    const fingerprint = scheduleDraftFingerprint(form);
+    const commit = () => { if (editor) actions.cancelEdit(); };
+    commit.canCommit = () => {
+      if (actions.snapshot().mutation) return false;
+      if (actions.snapshot().editor !== editor) return false;
+      if (details.querySelector(".schedule-editor") !== form) return false;
+      return scheduleDraftFingerprint(form) === fingerprint;
+    };
+    return commit;
+  }
+
+  function scheduleDraftFingerprint(form) {
+    return form ? JSON.stringify([...new FormData(form)]) : "";
+  }
+
   function canDiscardScheduleDraft() {
     const form = details.querySelector(".schedule-editor");
     if (form?.dataset.dirty !== "true") return true;
@@ -156,5 +175,5 @@ export function createSchedulesWorkspace({
     editorIdentity = null;
     renderScheduleDetails({ root: details, snapshot, actions });
   }
-  return { render, prepareLeave };
+  return { render, prepareLeave, prepareEnvironmentChange };
 }

package/dist/src/web-ui/app/components/session-sidebar-sections.js

@@ -7,7 +7,7 @@ export function renderSessionSidebarSections({
   if (showingArchived) {
     const notice = document.createElement("p");
     notice.className = "session-archive-notice";
-    notice.textContent = "Archived in this browser and environment. Restore a conversation from its menu.";
+    notice.textContent = "Archived in this ABot installation and environment. Restore a conversation from its menu.";
     root.appendChild(notice);
   }
   const pinned = sessions.filter((session) => isPinned(session.id));
@@ -35,7 +35,7 @@ export function renderSessionSidebarSections({
   const toggle = document.createElement("button");
   toggle.type = "button";
   toggle.className = "session-archive-toggle";
-  toggle.title = "Conversations archived in this browser and environment";
+  toggle.title = "Conversations archived in this ABot installation and environment";
   toggle.textContent = showingArchived ? "Back to conversations" : `Archived (${archivedCount})`;
   toggle.setAttribute("aria-pressed", String(showingArchived));
   toggle.addEventListener("click", onToggleArchived);

package/dist/src/web-ui/app/components/spark-chat/empty-state.js

@@ -35,6 +35,7 @@ export function createSparkChatEmptyState({ getConfiguration, onOpenModelSetting
       if (model.needsModel) {
         const action = documentRoot.createElement("button");
         action.setAttribute("type", "button");
+        action.className = "spark-setup-button";
         action.textContent = "Choose model";
         action.addEventListener("click", onOpenModelSettings);
         empty.append(action);

package/dist/src/web-ui/app/components/spark-chat/handoff-actions.js

@@ -12,7 +12,7 @@ function sameSourceMessage(current, source) {
 
 export function createSparkHandoffActions({
   getScope, getMessages, client, captureNavigation, onOpened, onChange = () => {},
-  notify, documentRoot = document,
+  notify, documentRoot = document, canOpen = () => true,
 }) {
   const pending = new Set();
   function createNode(message) {
@@ -25,7 +25,12 @@ export function createSparkHandoffActions({
     button.type = "button";
     button.className = "spark-handoff-button";
     button.textContent = "Open a session about this";
-    button.disabled = !message.sparkHandoffAvailable || pending.has(identity);
+    function canStartHandoff() {
+      if (!canOpen()) return false;
+      if (!message.sparkHandoffAvailable) return false;
+      return !pending.has(identity);
+    }
+    button.disabled = !canStartHandoff();
     row.appendChild(button);
     if (!message.sparkHandoffAvailable) {
       const explanation = documentRoot.createElement("p");
@@ -39,7 +44,8 @@ export function createSparkHandoffActions({
       return getMessages().some((candidate) => sameSourceMessage(candidate, message));
     }
     async function open() {
-      if (button.disabled || pending.has(identity) || !sourceIsCurrent()) return;
+      if (!canStartHandoff()) return;
+      if (!sourceIsCurrent()) return;
       const navigate = captureNavigation();
       pending.add(identity); button.disabled = true;
       try {

package/dist/src/web-ui/app/components/spark-chat/panel.js

@@ -48,6 +48,7 @@ export function createSparkChatPanel({ documentRoot = document, launcherAnchor }
   dom.launcherButton.insertAdjacentHTML("beforeend", '<span class="spark-launcher-label">SPARK</span>');
   const panel = root.querySelector(".spark-chat-panel");
   const notice = root.querySelector(".spark-message-notice");
+  dom.launcherButton.hidden = true;
   const placement = createSparkChatPlacement({ root, launcher: dom.launcherButton, panel, notice, dockAnchor: launcherSlot });
   dom.launcherButton.title = "Open SPARK · Drag to move · Alt + arrows to move · Alt + Home to return to sidebar";
   let timer;

package/dist/src/web-ui/app/components/spark-chat/placement.js

@@ -1,14 +1,11 @@
 import { createSparkPlacementMotion } from "./motion.js";
+import { workspaceStorage } from "../../services/workspace-state.js";
 
 const storageKey = "abot.spark.launcher.position.v1";
 const margin = 12;
 const dragThreshold = 5;
 const positionGrid = 16;
 
-function readBrowserStorage(windowRoot) {
-  try { return windowRoot.localStorage; } catch { return null; }
-}
-
 function readPosition(storage) {
   try {
     const value = JSON.parse(storage?.getItem(storageKey) ?? "null");
@@ -31,9 +28,9 @@ function hasMovedPastDragThreshold(pointer, event) {
   return Math.hypot(event.clientX - pointer.x, event.clientY - pointer.y) >= dragThreshold;
 }
 
-/** Browser-only launcher placement; conversation and environment state stay untouched. */
+/** Installation-owned launcher placement, clamped to the current screen. */
 export function createSparkChatPlacement({ root, launcher, panel, notice, dockAnchor, storage, windowRoot = window }) {
-  const positionStorage = storage === undefined ? readBrowserStorage(windowRoot) : storage;
+  const positionStorage = storage === undefined ? workspaceStorage() : storage;
   let position = readPosition(positionStorage);
   let pointer = null;
   let suppressClick = false;
@@ -45,7 +42,7 @@ export function createSparkChatPlacement({ root, launcher, panel, notice, dockAn
     try {
       if (position) positionStorage?.setItem(storageKey, JSON.stringify(position));
       else positionStorage?.removeItem(storageKey);
-    } catch { /* Placement remains usable when browser storage is unavailable. */ }
+    } catch { /* The shared storage owner reports persistence failures. */ }
   }
 
   function placePopup(node, anchor) {

package/dist/src/web-ui/app/components/spark-chat/settings.js

@@ -1,3 +1,4 @@
+import { canChooseReasoning, reasoningModeOptions } from "../../lib/reasoning-controls.js";
 import { supportsFullPlus } from "../../lib/tool-permission-mode.js";
 
 export function createSparkChatSettings({ root, onSave, onClear, onOpen, onResetPosition, onOpenModelSettings, getAgentMode, onAgentModeChange, getWebConfig, documentRoot = document }) {
@@ -29,11 +30,12 @@ export function createSparkChatSettings({ root, onSave, onClear, onOpen, onReset
   const feedback = card.querySelector("[data-spark-settings-feedback]");
   let saved = "ask";
   let ready = false;
+  let reasoningEnabled = false;
   let busy = false;
   let environmentId;
   function controls() {
     select.disabled = busy || !ready;
-    agentModeSelect.disabled = !ready;
+    agentModeSelect.disabled = !ready || !reasoningEnabled;
     save.disabled = busy || !ready || select.value === saved;
     clear.disabled = busy || !ready;
   }
@@ -52,7 +54,7 @@ export function createSparkChatSettings({ root, onSave, onClear, onOpen, onReset
     finally { if (environment === environmentId) { busy = false; controls(); } }
   }
   select.addEventListener("change", controls);
-  agentModeSelect.addEventListener("change", () => onAgentModeChange(agentModeSelect.value));
+  agentModeSelect.addEventListener("change", () => { if (reasoningEnabled) onAgentModeChange(agentModeSelect.value); });
   card.querySelector("form").addEventListener("submit", (event) => {
     event.preventDefault();
     if (save.disabled) return;
@@ -73,7 +75,9 @@ export function createSparkChatSettings({ root, onSave, onClear, onOpen, onReset
         environmentId = nextEnvironmentId; busy = false; ready = false; feedback.textContent = "";
         select.value = configuration?.toolPermissionMode || "ask";
       }
-      agentModeSelect.value = getAgentMode();
+      reasoningEnabled = canChooseReasoning(configuration);
+      agentModeSelect.innerHTML = reasoningModeOptions(getAgentMode(), reasoningEnabled);
+      agentModeSelect.title = reasoningEnabled ? "Reasoning depth" : "Enable reasoning controls for this model in Models.";
       const next = configuration?.toolPermissionMode || "ask";
       if (!ready || select.value === saved || busy) select.value = next;
       saved = next; ready = Boolean(configuration?.sessionId);

package/dist/src/web-ui/app/components/system-host/connection-card.js

@@ -0,0 +1,35 @@
+import { escapeHtml } from "../../lib/text-format.js";
+
+export function renderComputerMetadata(snapshot, disabled = false) {
+  const identity = snapshot?.identity || {};
+  const os = { windows: "Windows", macos: "macOS", linux: "Linux" }[identity.os] || identity.os;
+  const summary = [identity.name, os, identity.user]
+    .filter((value) => typeof value === "string" && value.length > 0).join(" · ");
+  if (!summary && !snapshot?.paired) return "";
+  return `<div class="system-host-card-computer"><span>${escapeHtml(summary)}</span>${snapshot?.paired ? `<button type="button" data-system-host-revoke title="Disconnect this computer. Saved insights are kept." ${disabled ? "disabled" : ""}>Remove this computer</button>` : ""}</div>`;
+}
+
+function renderConnectionStatus(status, ready, compact = false) {
+  return `<span class="system-host-card-status" role="status" ${compact ? `aria-label="${escapeHtml(status)}"` : ""} data-tone="${ready ? "ready" : "unavailable"}"><i aria-hidden="true"></i>${compact ? "" : escapeHtml(status)}</span>`;
+}
+
+/** Platform actions are supplied by their existing owners; this module renders the shared layout. */
+export function renderConnectionCard({
+  title, status, ready, disabled = false, compact = false, description = "",
+  actions = "", help = "", metadata = "", error = "", message = "", details = "", attributes = "",
+}) {
+  if (compact) return `<section class="system-host-panel system-host-card system-host-card-ready" aria-label="Computer access" ${attributes}>
+    <h2 class="system-host-card-ready-title">${renderConnectionStatus(status, ready, true)}${escapeHtml(title)}</h2>
+    ${metadata}
+    ${details}
+  </section>`;
+  return `<section class="system-host-panel system-host-card" aria-label="Computer access" aria-busy="${disabled ? "true" : "false"}" ${attributes}>
+    <div class="system-host-card-heading"><h2>${escapeHtml(title)}</h2>${renderConnectionStatus(status, ready)}</div>
+    ${description ? `<p class="system-host-card-description">${escapeHtml(description)}</p>` : ""}
+    ${actions ? `<div class="system-host-card-action">${actions}</div>` : ""}
+    ${help ? `<p class="system-host-card-hint">${escapeHtml(help)}</p>` : ""}
+    ${error || message ? `<p class="${error ? "error-text" : "system-host-card-message"}" role="${error ? "alert" : "status"}" aria-live="polite">${escapeHtml(error || message)}</p>` : ""}
+    ${metadata}
+    ${details}
+  </section>`;
+}

package/dist/src/web-ui/app/components/system-host/macos-permissions.js

@@ -6,6 +6,7 @@ function hasManagedMacPermissionRuntime(version) {
 }
 
 export function macCompanionPermissionPath(snapshot) {
+  if (snapshot?.collectionSource?.mode === "native") return "";
   if (!snapshot?.paired) return "";
   if (snapshot.identity?.os !== "macos") return "";
   if (!hasManagedMacPermissionRuntime(snapshot.companion?.installedVersion))
@@ -20,6 +21,7 @@ export function macCompanionPermissionPath(snapshot) {
 
 /** The managed companion keeps its macOS permission subject at one private path. */
 export function renderMacPermissionGuide(snapshot) {
+  if (snapshot?.collectionSource?.mode === "native") return "";
   if (!snapshot?.paired) return "";
   if (snapshot.identity?.os !== "macos") return "";
   const version = snapshot.companion?.installedVersion;