@abot-ai/runtime 1.0.0 → 1.2.0

package/dist/src/web-ui/app/components/long-term-memory/view-model.d.ts

@@ -0,0 +1,29 @@
+import type {
+  LongTermMemoryRecord,
+  LongTermMemorySnapshot,
+} from "../../controllers/long-term-memory/controller.js";
+
+export type LongTermMemoryManagerView = LongTermMemorySnapshot &
+  Readonly<{
+    editorRecord: LongTermMemoryRecord | null;
+    canWrite: boolean;
+    busy: boolean;
+    status: Readonly<{
+      tone: "enabled" | "disabled" | "unavailable";
+      label: "Enabled" | "Disabled" | "Unavailable";
+    }>;
+    emptyMessage: string;
+    pageLabel: string;
+    hasPreviousPage: boolean;
+    hasNextPage: boolean;
+  }>;
+
+export declare function createMemoryManagerView(
+  snapshot: LongTermMemorySnapshot,
+): LongTermMemoryManagerView;
+export declare function parseMemoryTags(value: unknown): string[];
+export declare function formatMemoryTimestamp(value: unknown): string;
+export declare function memoryOriginLabel(origin: unknown): string;
+export declare function buildMemoryDeleteConfirmation(
+  record: Pick<LongTermMemoryRecord, "content">,
+): string;

package/dist/src/web-ui/app/components/long-term-memory/view-model.js

@@ -0,0 +1,69 @@
+export function createMemoryManagerView(snapshot) {
+  const editorRecord = snapshot.editor?.recordId
+    ? snapshot.items.find((record) => record.id === snapshot.editor.recordId) ||
+      null
+    : null;
+  const canWrite = snapshot.enabled === true && snapshot.available === true;
+  return Object.freeze({
+    ...snapshot,
+    editorRecord,
+    canWrite,
+    busy: snapshot.loading || Boolean(snapshot.mutation),
+    status: memoryStatus(snapshot),
+    emptyMessage: snapshot.query
+      ? "No memories match this search."
+      : "No long-term memories have been stored yet.",
+    pageLabel: pageLabel(snapshot),
+    hasPreviousPage: snapshot.offset > 0,
+    hasNextPage: snapshot.offset + snapshot.items.length < snapshot.total,
+  });
+}
+
+export function parseMemoryTags(value) {
+  return String(value ?? "")
+    .split(/[\n,]/u)
+    .map((tag) => tag.trim())
+    .filter(Boolean);
+}
+
+export function formatMemoryTimestamp(value) {
+  const timestamp = Date.parse(String(value ?? ""));
+  if (!Number.isFinite(timestamp)) return "Unknown time";
+  return new Intl.DateTimeFormat(undefined, {
+    dateStyle: "medium",
+    timeStyle: "short",
+  }).format(new Date(timestamp));
+}
+
+export function memoryOriginLabel(origin) {
+  const labels = {
+    passive_response: "Learned from conversation",
+    web_ui: "Added in Web UI",
+    management_api: "Added through API",
+  };
+  return labels[origin] || "Stored memory";
+}
+
+export function buildMemoryDeleteConfirmation(record) {
+  return `Delete this memory?\n\n${record.content}`;
+}
+
+function memoryStatus(snapshot) {
+  if (snapshot.enabled === null) {
+    return Object.freeze({ tone: "unavailable", label: "Unavailable" });
+  }
+  if (!snapshot.enabled) {
+    return Object.freeze({ tone: "disabled", label: "Disabled" });
+  }
+  if (!snapshot.available) {
+    return Object.freeze({ tone: "unavailable", label: "Unavailable" });
+  }
+  return Object.freeze({ tone: "enabled", label: "Enabled" });
+}
+
+function pageLabel(snapshot) {
+  if (snapshot.total === 0) return "0 memories";
+  const start = snapshot.offset + 1;
+  const end = Math.min(snapshot.total, snapshot.offset + snapshot.items.length);
+  return `${start}–${end} of ${snapshot.total}`;
+}

package/dist/src/web-ui/app/components/long-term-memory-setup.js

@@ -0,0 +1,334 @@
+import { escapeAttribute, escapeHtml, textOf } from "../lib/text-format.js";
+
+export function createLongTermMemorySetup({
+  getEnvironmentId = () => "",
+  loadStatus,
+  discoverModels,
+  enableMemory,
+  disableMemory,
+  recordControlEvent,
+  beginRuntimeMutation = () => true,
+  refreshRuntimeConfig = async () => true,
+  endRuntimeMutation = () => {},
+}) {
+  const state = {
+    root: null,
+    status: null,
+    models: [],
+    discoverySupported: false,
+    busy: "",
+    message: "",
+    error: "",
+    loadRevision: 0,
+    actionRevision: 0,
+    environmentId: "",
+  };
+
+  function mount(root) {
+    state.root = root;
+    render();
+  }
+
+  async function load() {
+    const revision = ++state.loadRevision;
+    state.actionRevision += 1;
+    const environmentId = getEnvironmentId();
+    const environmentChanged = state.environmentId !== environmentId;
+    if (environmentChanged) {
+      state.environmentId = environmentId;
+      state.status = null;
+      state.models = [];
+      state.discoverySupported = false;
+    }
+    state.busy = "status";
+    clearFeedback();
+    render({ preserveInputs: !environmentChanged });
+    try {
+      const payload = await loadStatus(environmentId);
+      if (
+        revision !== state.loadRevision ||
+        environmentId !== getEnvironmentId()
+      ) {
+        return false;
+      }
+      state.status = payload.status || null;
+      return true;
+    } catch (error) {
+      if (
+        revision !== state.loadRevision ||
+        environmentId !== getEnvironmentId()
+      ) {
+        return false;
+      }
+      state.error = errorMessage(error);
+      return false;
+    } finally {
+      if (
+        revision === state.loadRevision &&
+        environmentId === getEnvironmentId()
+      ) {
+        state.busy = "";
+        render();
+      }
+    }
+  }
+
+  async function discover() {
+    const providerId = selectedProviderId();
+    if (!providerId) {
+      showError("Choose a configured provider first.");
+      return;
+    }
+    await runAction(
+      "discover",
+      (environmentId) => discoverModels(providerId, environmentId),
+      (payload) => {
+        state.models = Array.isArray(payload.catalog?.models)
+          ? payload.catalog.models
+          : [];
+        state.discoverySupported = payload.catalog?.supported === true;
+        state.message = discoveryMessage();
+      },
+    );
+  }
+
+  async function enable() {
+    const providerId = selectedProviderId();
+    const model = textOf(
+      state.root?.querySelector("[data-memory-model]")?.value,
+    ).trim();
+    if (!providerId || !model) {
+      showError("Choose a provider and enter an embedding model ID.");
+      return;
+    }
+    const emitClientEvents =
+      state.root?.querySelector("[data-memory-events]")?.checked === true;
+    await runRuntimeMutation(
+      "enable",
+      (environmentId) =>
+        enableMemory(
+          {
+            providerId,
+            model,
+            emitClientEvents,
+          },
+          environmentId,
+        ),
+      (payload) => {
+        state.status = payload.status || null;
+        state.message =
+          "Embedding probe passed. Memory is enabled; restart ABot to apply it.";
+        recordResult("Long-term memory enabled", payload);
+      },
+    );
+  }
+
+  async function disable() {
+    await runRuntimeMutation(
+      "disable",
+      (environmentId) => disableMemory(environmentId),
+      (payload) => {
+        state.status = payload.status || null;
+        state.message = "Memory is disabled; restart ABot to apply it.";
+        recordResult("Long-term memory disabled", payload);
+      },
+    );
+  }
+
+  async function runRuntimeMutation(name, request, applyResult) {
+    if (!beginRuntimeMutation()) {
+      showError(
+        "Save or reset configuration changes before changing memory settings.",
+      );
+      return false;
+    }
+    try {
+      return await runAction(name, request, async (payload) => {
+        applyResult(payload);
+        await refreshRuntimeConfig();
+      });
+    } finally {
+      endRuntimeMutation();
+    }
+  }
+
+  async function runAction(name, request, applyResult) {
+    const revision = ++state.actionRevision;
+    const environmentId = getEnvironmentId();
+    state.loadRevision += 1;
+    state.busy = name;
+    clearFeedback();
+    render();
+    try {
+      const payload = await request(environmentId);
+      if (
+        revision !== state.actionRevision ||
+        environmentId !== getEnvironmentId()
+      ) {
+        return false;
+      }
+      await applyResult(payload);
+      return true;
+    } catch (error) {
+      if (
+        revision !== state.actionRevision ||
+        environmentId !== getEnvironmentId()
+      ) {
+        return false;
+      }
+      state.error = errorMessage(error);
+      recordControlEvent({
+        type: "control",
+        name: "Long-term memory setup failed",
+        tone: "failed",
+        summary: state.error,
+      });
+      return false;
+    } finally {
+      if (
+        revision === state.actionRevision &&
+        environmentId === getEnvironmentId()
+      ) {
+        state.busy = "";
+        render();
+      }
+    }
+  }
+
+  function render(options = {}) {
+    if (!state.root) return;
+    const status = state.status || {};
+    const providers = Array.isArray(status.providers) ? status.providers : [];
+    const preserveInputs = options.preserveInputs !== false;
+    const selectedProvider =
+      (preserveInputs ? selectedProviderId() : "") ||
+      status.providerId ||
+      providers[0]?.id ||
+      "";
+    const selectedModel =
+      (preserveInputs ? currentModelValue() : "") || status.model || "";
+    const enabled = status.enabled === true;
+    state.root.innerHTML = `
+      <section class="memory-setup-card" aria-busy="${state.busy ? "true" : "false"}">
+        <div class="memory-setup-heading">
+          <div>
+            <p class="eyebrow">passive memory</p>
+            <h4>Long-term memory</h4>
+            <p>Retrieve relevant memories across sessions while keeping storage and policy in the Runtime core.</p>
+          </div>
+          <span class="memory-status ${enabled ? "enabled" : "disabled"}">${enabled ? "Enabled" : "Disabled"}</span>
+        </div>
+        <div class="memory-setup-fields">
+          <label>
+            <span>Embedding provider</span>
+            <select data-memory-provider ${state.busy ? "disabled" : ""}>
+              ${providerOptions(providers, selectedProvider)}
+            </select>
+          </label>
+          <label>
+            <span>Embedding model</span>
+            <input data-memory-model list="memoryEmbeddingModels" value="${escapeAttribute(selectedModel)}" placeholder="Enter a provider model ID" ${state.busy ? "disabled" : ""} />
+            <datalist id="memoryEmbeddingModels">${state.models
+              .map(
+                (model) =>
+                  `<option value="${escapeAttribute(textOf(model))}"></option>`,
+              )
+              .join("")}</datalist>
+          </label>
+          <label class="memory-events-toggle">
+            <input data-memory-events type="checkbox" ${status.emitClientEvents === true ? "checked" : ""} ${state.busy ? "disabled" : ""} />
+            <span>Show bounded memory lifecycle events to clients</span>
+          </label>
+        </div>
+        <div class="memory-setup-actions">
+          <button type="button" data-memory-action="discover" ${state.busy ? "disabled" : ""}>Discover models</button>
+          <button type="button" data-memory-action="enable" ${state.busy ? "disabled" : ""}>Probe and enable</button>
+          <button type="button" data-memory-action="disable" ${!enabled || state.busy ? "disabled" : ""}>Disable</button>
+        </div>
+        ${feedbackMarkup()}
+        <p class="memory-setup-note">ABot never chooses or installs an embedding model. Configuration is written only after a real probe succeeds.</p>
+      </section>
+    `;
+    bindActions();
+  }
+
+  function bindActions() {
+    state.root.querySelectorAll("[data-memory-action]").forEach((button) => {
+      button.addEventListener("click", () => {
+        const action = button.dataset.memoryAction;
+        if (action === "discover") void discover();
+        else if (action === "enable") void enable();
+        else if (action === "disable") void disable();
+      });
+    });
+  }
+
+  function selectedProviderId() {
+    return textOf(
+      state.root?.querySelector("[data-memory-provider]")?.value,
+    ).trim();
+  }
+
+  function currentModelValue() {
+    return textOf(
+      state.root?.querySelector("[data-memory-model]")?.value,
+    ).trim();
+  }
+
+  function clearFeedback() {
+    state.message = "";
+    state.error = "";
+  }
+
+  function showError(message) {
+    state.error = message;
+    render();
+  }
+
+  function discoveryMessage() {
+    if (!state.discoverySupported) {
+      return "This provider does not expose model discovery. Enter its embedding model ID manually.";
+    }
+    return state.models.length
+      ? `Found ${state.models.length} installed model${state.models.length === 1 ? "" : "s"}.`
+      : "The provider returned no installed models.";
+  }
+
+  function feedbackMarkup() {
+    if (state.error) {
+      return `<p class="memory-setup-feedback error-text" role="alert">${escapeHtml(state.error)}</p>`;
+    }
+    return state.message
+      ? `<p class="memory-setup-feedback" role="status">${escapeHtml(state.message)}</p>`
+      : "";
+  }
+
+  function recordResult(name, payload) {
+    recordControlEvent({
+      type: "control",
+      name,
+      tone: "done",
+      summary: payload.backupPath
+        ? `backup: ${payload.backupPath}`
+        : "restart required",
+    });
+  }
+
+  return { load, mount };
+}
+
+function providerOptions(providers, selectedProvider) {
+  if (providers.length === 0) {
+    return '<option value="">No configured providers</option>';
+  }
+  return providers
+    .map((provider) => {
+      const selected = provider.id === selectedProvider ? "selected" : "";
+      return `<option value="${escapeAttribute(provider.id)}" ${selected}>${escapeHtml(provider.id)} · ${escapeHtml(provider.type)}</option>`;
+    })
+    .join("");
+}
+
+function errorMessage(error) {
+  return error instanceof Error ? error.message : String(error);
+}

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

@@ -50,7 +50,10 @@ export function createModelSelector({
     button.disabled = select.disabled || options.length === 0;
     button.setAttribute("aria-expanded", open ? "true" : "false");
     button.classList.toggle("open", open);
-    valueLabel.textContent = selected?.label || "No models configured";
+    const label = selected?.label || "No models configured";
+    valueLabel.textContent = label;
+    button.title = `Model: ${label}`;
+    button.setAttribute("aria-label", `Model: ${label}`);
     menu.hidden = !open;
     menu.classList.toggle("open", open);
     menu.setAttribute("role", "menu");

package/dist/src/web-ui/app/components/operations-section.js

@@ -0,0 +1,46 @@
+import { wrappedIndex } from "../ui-behavior.js";
+import { textOf } from "../lib/text-format.js";
+
+export function createOperationsSection({ buttons, pages }) {
+  const availableTabs = new Set(
+    buttons.map((button) => textOf(button.dataset.tab)),
+  );
+
+  function activateTab(tabName) {
+    const normalized = textOf(tabName, "runtime") || "runtime";
+    const nextTab = availableTabs.has(normalized) ? normalized : "runtime";
+    for (const button of buttons) {
+      const active = button.dataset.tab === nextTab;
+      button.classList.toggle("active", active);
+      button.setAttribute("aria-selected", active ? "true" : "false");
+      button.tabIndex = active ? 0 : -1;
+    }
+    for (const page of pages) {
+      const active = page.id === `${nextTab}Tab`;
+      page.classList.toggle("active", active);
+      page.hidden = !active;
+      page.inert = !active;
+    }
+  }
+
+  function navigateTab(event, button) {
+    const isArrowNavigation =
+      event.key === "ArrowLeft" || event.key === "ArrowRight";
+    if (!isArrowNavigation) return;
+    event.preventDefault();
+    const delta = event.key === "ArrowRight" ? 1 : -1;
+    const next =
+      buttons[wrappedIndex(buttons.indexOf(button), delta, buttons.length)];
+    next?.focus();
+    activateTab(next?.dataset.tab);
+  }
+
+  function bind() {
+    for (const button of buttons) {
+      button.addEventListener("click", () => activateTab(button.dataset.tab));
+      button.addEventListener("keydown", (event) => navigateTab(event, button));
+    }
+  }
+
+  return { activateTab, bind };
+}

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

@@ -0,0 +1,39 @@
+export type RuntimeSetupValidation = Readonly<{
+  valid: boolean;
+  value: string;
+  message: string;
+}>;
+
+export type RuntimeSetupCommands = Readonly<{
+  "ollama-pull": string;
+  setup: string;
+  "model-gateway": string;
+  "web-ui": string;
+}>;
+
+export interface RuntimeSetupGuideDependencies {
+  readonly container: HTMLElement;
+  readonly conversationRegion: HTMLElement;
+  readonly copyText?: (value: string) => void | Promise<void>;
+  readonly getSetupCommandMode?: () => "source" | "package" | undefined;
+}
+
+export declare function validateRuntimeSetupModelId(
+  value: unknown,
+): RuntimeSetupValidation;
+export declare function validateRuntimeSetupBaseUrl(
+  value: unknown,
+): RuntimeSetupValidation;
+export declare function buildRuntimeSetupCommands(
+  provider: unknown,
+  modelId: unknown,
+  ollamaBaseUrl?: unknown,
+  setupCommandMode?: "source" | "package",
+): RuntimeSetupCommands;
+export declare function createRuntimeSetupGuide(
+  options: RuntimeSetupGuideDependencies,
+): {
+  bind(options?: { onCheckAgain?: () => void | Promise<void> }): void;
+  focusAction(): void;
+  render(setup: Record<string, unknown>): void;
+};

package/dist/src/web-ui/app/components/tool-approval-card.d.ts

@@ -0,0 +1,18 @@
+export type ToolApprovalEvent = Record<string, unknown> & {
+  approvalId?: string;
+  eventName?: string;
+  name?: string;
+  tool?: string;
+  summary?: string;
+};
+
+export interface ToolApprovalCardOptions {
+  event?: ToolApprovalEvent;
+  submitted?: boolean;
+  onDecision: (approvalId: string, approved: boolean) => void;
+  documentRoot?: Document;
+}
+
+export declare function createToolApprovalCard(
+  options: ToolApprovalCardOptions,
+): HTMLElement;