@wenathlan/extension 1.1.56 → 1.1.58

package/extension/dist/sidepanel.js

@@ -393,6 +393,11 @@ var workflowsroot = document.querySelector("#workflows");
 var workfloweditorroot = document.querySelector("#workfloweditor");
 var triggersroot = document.querySelector("#triggers");
 var agentprotocolroot = document.querySelector("#agentprotocol");
+var modelsroot = document.querySelector("#models");
+var agentsroot = document.querySelector("#agents");
+var commandinput = document.querySelector("#command");
+var commandbutton = document.querySelector("#commandsend");
+var intentbadge = document.querySelector("#intentbadge");
 var triggerview = { manual: void 0, history: void 0 };
 var sessionsview = { term: "", window: "all", diffselection: [], restorereview: void 0, importreview: void 0 };
 var workflowview = { review: void 0, selected: "" };
@@ -2876,6 +2881,8 @@ async function refresh() {
   renderworkfloweditor(context);
   rendertriggers(context);
   renderagentprotocol(context);
+  rendermodels(context);
+  renderagents(context);
   renderconsolediff();
   renderaudit(context.audit);
   rendercapabilities(context.capabilities);
@@ -2889,6 +2896,13 @@ async function create(kind) {
 localbutton?.addEventListener("click", () => create("proposelocal").catch((error) => status(error instanceof Error ? error.message : String(error), true)));
 remotebutton?.addEventListener("click", () => create("proposeremote").catch((error) => status(error instanceof Error ? error.message : String(error), true)));
 diagnosticbutton?.addEventListener("click", () => request({ kind: "diagnostic" }).then(() => refresh()).catch((error) => status(error instanceof Error ? error.message : String(error), true)));
+commandbutton?.addEventListener("click", () => request({ kind: "llmcommand", text: commandinput?.value ?? "" }).then(() => {
+  status("The model parsed the command; the intent badge shows the classification.");
+  return refresh();
+}).catch((error) => status(error instanceof Error ? error.message : String(error), true)));
+commandinput?.addEventListener("keydown", (event) => {
+  if (event.key === "Enter") commandbutton?.click();
+});
 refresh().catch((error) => status(error instanceof Error ? error.message : String(error), true));
 function renderprofiling(context) {
   if (!profilingroot) return;
@@ -5165,4 +5179,703 @@ function renderagentprotocol(context) {
   }
   agentprotocolroot.append(callsbox);
 }
+function rendermodels(context) {
+  if (!modelsroot) return;
+  modelsroot.replaceChildren();
+  const llm = context.llm;
+  if (!llm) {
+    const empty = document.createElement("p");
+    empty.textContent = "The models state is unknown.";
+    modelsroot.append(empty);
+    return;
+  }
+  const head = document.createElement("p");
+  head.textContent = `${llm.providers.length} provider${llm.providers.length === 1 ? "" : "s"} \xB7 ${llm.routes.length} route${llm.routes.length === 1 ? "" : "s"} \xB7 ${llm.usage.calls} model call${llm.usage.calls === 1 ? "" : "s"} with ${llm.usage.totaltokens} tokens${llm.budget !== void 0 ? ` against the ceiling` : " and no ceiling"}.`;
+  modelsroot.append(head);
+  const providersbox = document.createElement("details");
+  providersbox.className = "sessiongroup";
+  providersbox.open = true;
+  const providersummary = document.createElement("summary");
+  providersummary.textContent = `Providers (${llm.providers.length})`;
+  providersbox.append(providersummary);
+  for (const provider of llm.providers) {
+    const row = document.createElement("div");
+    row.className = "sessionrow";
+    const info = document.createElement("p");
+    info.textContent = `${provider.name} \xB7 ${provider.style} \xB7 ${provider.status}${provider.lastcheckedat !== void 0 ? ` (checked ${new Date(provider.lastcheckedat).toLocaleTimeString()})` : ""}${provider.authref !== void 0 ? ` \xB7 key ${provider.authref.name}` : " \xB7 no key"}${provider.costpermilliontokens !== void 0 ? ` \xB7 ${provider.costpermilliontokens} per million tokens` : ""}.`;
+    row.append(info);
+    const actions = document.createElement("div");
+    actions.className = "actions";
+    const nameinput = document.createElement("input");
+    nameinput.value = provider.name;
+    nameinput.placeholder = "name";
+    const endpointinput = document.createElement("input");
+    endpointinput.value = provider.endpoint;
+    endpointinput.placeholder = "endpoint url";
+    const styleselect = document.createElement("select");
+    for (const style of ["chatcompletions", "responses", "messages", "gemini"]) {
+      const option = document.createElement("option");
+      option.value = style;
+      option.textContent = style;
+      option.selected = provider.style === style;
+      styleselect.append(option);
+    }
+    const modelsinput = document.createElement("input");
+    modelsinput.value = provider.models.join(", ");
+    modelsinput.placeholder = "models, comma separated";
+    const keyinput = document.createElement("input");
+    keyinput.placeholder = "stored key name";
+    actions.append(nameinput, " ", endpointinput, " ", styleselect, " ", modelsinput, " ", keyinput, " ", button("Save", async () => {
+      await request({ kind: "llmproviders", id: provider.id, name: nameinput.value, endpoint: endpointinput.value, style: styleselect.value, models: modelsinput.value.split(",").map((model) => model.trim()).filter((model) => model !== ""), ...keyinput.value.trim() !== "" ? { authrefname: keyinput.value.trim() } : {} });
+      status(`Saved the provider ${nameinput.value}.`);
+      await refresh();
+    }), " ", button("Test call", async () => {
+      await request({ kind: "llmtestprovider", id: provider.id });
+      status(`The test call of ${provider.name} answered.`);
+      await refresh();
+    }), " ", button("Remove", async () => {
+      await request({ kind: "llmproviders", id: provider.id, remove: true });
+      status(`Removed the provider ${provider.name}.`);
+      await refresh();
+    }));
+    row.append(actions);
+    providersbox.append(row);
+  }
+  const addrow = document.createElement("div");
+  addrow.className = "actions";
+  const addname = document.createElement("input");
+  addname.placeholder = "new provider name";
+  const addendpoint = document.createElement("input");
+  addendpoint.placeholder = "endpoint url";
+  const addstyle = document.createElement("select");
+  for (const style of ["chatcompletions", "responses", "messages", "gemini"]) {
+    const option = document.createElement("option");
+    option.value = style;
+    option.textContent = style;
+    addstyle.append(option);
+  }
+  const addmodels = document.createElement("input");
+  addmodels.placeholder = "models, comma separated";
+  const addkey = document.createElement("input");
+  addkey.placeholder = "stored key name";
+  addrow.append(addname, " ", addendpoint, " ", addstyle, " ", addmodels, " ", addkey, " ", button("Add provider", async () => {
+    await request({ kind: "llmproviders", name: addname.value, endpoint: addendpoint.value, style: addstyle.value, models: addmodels.value.split(",").map((model) => model.trim()).filter((model) => model !== ""), ...addkey.value.trim() !== "" ? { authrefname: addkey.value.trim() } : {} });
+    status(`Added the provider ${addname.value}; nothing is hardcoded so any gateway works.`);
+    await refresh();
+  }));
+  providersbox.append(addrow);
+  modelsroot.append(providersbox);
+  const localbox = document.createElement("details");
+  localbox.className = "sessiongroup";
+  localbox.open = true;
+  const localsummary = document.createElement("summary");
+  localsummary.textContent = "Local model endpoint";
+  localbox.append(localsummary);
+  const localinfo = document.createElement("p");
+  localinfo.textContent = llm.local !== void 0 ? `${llm.local.endpoint} with ${llm.local.model} (${llm.local.style})${llm.local.health !== void 0 ? ` \xB7 health ${llm.local.health.ok ? "ok" : `failing: ${llm.local.health.detail ?? "unknown"}`}` : " \xB7 no health check yet"}.` : "No local endpoint configured; local inference keeps sensitive extractions on the machine.";
+  localbox.append(localinfo);
+  const localactions = document.createElement("div");
+  localactions.className = "actions";
+  const localendpoint = document.createElement("input");
+  localendpoint.placeholder = "local endpoint url";
+  localendpoint.value = llm.local?.endpoint ?? "";
+  const localmodel = document.createElement("input");
+  localmodel.placeholder = "model name";
+  localmodel.value = llm.local?.model ?? "";
+  const localstyle = document.createElement("select");
+  for (const style of ["chatcompletions", "responses", "messages", "gemini"]) {
+    const option = document.createElement("option");
+    option.value = style;
+    option.textContent = style;
+    option.selected = llm.local?.style === style;
+    localstyle.append(option);
+  }
+  localactions.append(localendpoint, " ", localmodel, " ", localstyle, " ", button("Save local", async () => {
+    await request({ kind: "llmlocal", endpoint: localendpoint.value, model: localmodel.value, style: localstyle.value });
+    status("Saved the local model endpoint; the calls never leave the machine.");
+    await refresh();
+  }), " ", button("Health check", async () => {
+    await request({ kind: "llmlocal", check: true });
+    status("The local health check ran; the result rides the endpoint line.");
+    await refresh();
+  }));
+  localbox.append(localactions);
+  modelsroot.append(localbox);
+  const routesbox = document.createElement("details");
+  routesbox.className = "sessiongroup";
+  routesbox.open = true;
+  const routesummary = document.createElement("summary");
+  routesummary.textContent = `Model routes (${llm.routes.length})`;
+  routesbox.append(routesummary);
+  for (const task of llm.tasks) {
+    const row = document.createElement("div");
+    row.className = "sessionrow";
+    const info = document.createElement("p");
+    info.textContent = `${task.kind}: ${task.provider !== void 0 ? `${task.provider} with ${task.model}` : "unrouted; the user picks the pair"}.`;
+    row.append(info);
+    const actions = document.createElement("div");
+    actions.className = "actions";
+    const providerselect = document.createElement("select");
+    for (const provider of llm.providers) {
+      const option = document.createElement("option");
+      option.value = provider.id;
+      option.textContent = provider.name;
+      providerselect.append(option);
+    }
+    const modelinput = document.createElement("input");
+    modelinput.placeholder = "model";
+    const fallbackselect = document.createElement("select");
+    const noneoption = document.createElement("option");
+    noneoption.value = "";
+    noneoption.textContent = "no fallback";
+    fallbackselect.append(noneoption);
+    for (const provider of llm.providers) {
+      const option = document.createElement("option");
+      option.value = provider.id;
+      option.textContent = provider.name;
+      fallbackselect.append(option);
+    }
+    const fallbackmodel = document.createElement("input");
+    fallbackmodel.placeholder = "fallback model";
+    actions.append(providerselect, " ", modelinput, " ", fallbackselect, " ", fallbackmodel, " ", button("Route", async () => {
+      await request({ kind: "llmroutes", taskkind: task.kind, providerid: providerselect.value, model: modelinput.value, ...fallbackselect.value !== "" ? { fallbackproviderid: fallbackselect.value, fallbackmodel: fallbackmodel.value } : {} });
+      status(`Routed the ${task.kind} task kind.`);
+      await refresh();
+    }), " ", button("Unroute", async () => {
+      await request({ kind: "llmroutes", taskkind: task.kind, remove: true });
+      status(`Removed the route of the ${task.kind} task kind.`);
+      await refresh();
+    }));
+    row.append(actions);
+    routesbox.append(row);
+  }
+  if (llm.routehistory.length > 0) {
+    const history = document.createElement("p");
+    history.textContent = `Route revisions: ${llm.routehistory.slice(0, 5).map((entry) => `${entry.kind} r${entry.revision} ${entry.providerid}/${entry.model}`).join(" \xB7 ")}.`;
+    routesbox.append(history);
+  }
+  modelsroot.append(routesbox);
+  if (llm.parse !== void 0) {
+    const badge = document.createElement("p");
+    badge.textContent = `Last command: ${llm.parse.intent} at confidence ${Math.round(llm.parse.confidence * 100)}%${llm.parse.entities.length > 0 ? ` with ${llm.parse.entities.map((entity) => `${entity.name}=${entity.value}`).join(", ")}` : ""}${llm.parse.model !== void 0 ? ` parsed by ${llm.parse.model}` : " parsed locally"}.`;
+    modelsroot.append(badge);
+    if (intentbadge) intentbadge.textContent = `${llm.parse.intent} ${Math.round(llm.parse.confidence * 100)}%`;
+  } else if (intentbadge) intentbadge.textContent = "";
+  const draftsbox = document.createElement("details");
+  draftsbox.className = "sessiongroup";
+  draftsbox.open = true;
+  const draftsummary = document.createElement("summary");
+  draftsummary.textContent = `Model drafted plans (${llm.drafts.length})`;
+  draftsbox.append(draftsummary);
+  for (const draft of llm.drafts.slice(0, 5)) {
+    const card = document.createElement("div");
+    card.className = "sessionrow";
+    const info = document.createElement("p");
+    info.textContent = `${draft.goal} \xB7 ${draft.steps.length} steps \xB7 ${draft.state}${draft.lintfindings.length > 0 ? ` \xB7 ${draft.lintfindings.length} grammar finding${draft.lintfindings.length === 1 ? "" : "s"}` : " \xB7 clean grammar"} \xB7 by ${draft.model}.`;
+    card.append(info);
+    const edits = [];
+    for (const step of draft.steps) {
+      const steprow = document.createElement("div");
+      steprow.className = "actions";
+      const kindinput = document.createElement("input");
+      kindinput.value = step.kind;
+      kindinput.placeholder = "kind";
+      const targetinput = document.createElement("input");
+      targetinput.value = step.target ?? "";
+      targetinput.placeholder = "target";
+      const valueinput = document.createElement("input");
+      valueinput.value = step.value ?? "";
+      valueinput.placeholder = "value";
+      const summaryinput = document.createElement("input");
+      summaryinput.value = step.summary;
+      summaryinput.placeholder = "summary";
+      steprow.append(kindinput, " ", targetinput, " ", valueinput, " ", summaryinput);
+      card.append(steprow);
+      edits.push({ id: step.id, kind: kindinput, target: targetinput, value: valueinput, summary: summaryinput });
+    }
+    if (draft.openquestions.length > 0) {
+      const questions = document.createElement("p");
+      questions.textContent = `Open questions: ${draft.openquestions.join(" | ")}`;
+      card.append(questions);
+    }
+    if (draft.lintfindings.length > 0) {
+      const findings = document.createElement("p");
+      findings.textContent = `Grammar findings: ${draft.lintfindings.join(" ")}`;
+      card.append(findings);
+    }
+    const actions = document.createElement("div");
+    actions.className = "actions";
+    actions.append(button("Approve draft", async () => {
+      await request({ kind: "llmdraftdecision", draftid: draft.id, approve: true, steps: edits.map((edit) => ({ id: edit.id, kind: edit.kind.value, ...edit.target.value.trim() !== "" ? { target: edit.target.value } : {}, ...edit.value.value.trim() !== "" ? { value: edit.value.value } : {}, summary: edit.summary.value })) });
+      status("The approved draft became a pending plan that still passes the same plan review.");
+      await refresh();
+    }), " ", button("Reject draft", async () => {
+      await request({ kind: "llmdraftdecision", draftid: draft.id });
+      status("The draft is rejected and stays for the audit trail.");
+      await refresh();
+    }), " ", button("Replan failed tail", async () => {
+      await request({ kind: "llmreplan", draftid: draft.id, failedstepids: edits.slice(-1).map((edit) => edit.id), reason: "The last step failed and the model replans the tail." });
+      status("The model replanned the failed tail; the fresh review waits.");
+      await refresh();
+    }));
+    card.append(actions);
+    draftsbox.append(card);
+  }
+  modelsroot.append(draftsbox);
+  const replansbox = document.createElement("details");
+  replansbox.className = "sessiongroup";
+  replansbox.open = true;
+  const replansummary = document.createElement("summary");
+  replansummary.textContent = `Replans (${llm.replans.length})`;
+  replansbox.append(replansummary);
+  for (const replan of llm.replans.slice(0, 5)) {
+    const card = document.createElement("div");
+    card.className = "sessionrow";
+    const info = document.createElement("p");
+    info.textContent = `${replan.reason} \xB7 keeps ${replan.completedstepids.length} completed step${replan.completedstepids.length === 1 ? "" : "s"} \xB7 ${replan.state}.`;
+    card.append(info);
+    for (const step of replan.tail) {
+      const tail = document.createElement("p");
+      tail.textContent = `\u21BB ${step.id} ${step.kind}: ${step.summary} \u2014 fresh review required`;
+      card.append(tail);
+    }
+    const actions = document.createElement("div");
+    actions.className = "actions";
+    actions.append(button("Approve fresh review", async () => {
+      await request({ kind: "llmreplandecision", replanid: replan.id, approve: true });
+      status("The approved replan became a pending plan with the changed tail under the same plan review.");
+      await refresh();
+    }), " ", button("Reject replan", async () => {
+      await request({ kind: "llmreplandecision", replanid: replan.id });
+      status("The replan is rejected and stays for the audit trail.");
+      await refresh();
+    }));
+    card.append(actions);
+    replansbox.append(card);
+  }
+  modelsroot.append(replansbox);
+  const notesbox = document.createElement("details");
+  notesbox.className = "sessiongroup";
+  const notesummary = document.createElement("summary");
+  notesummary.textContent = `Reflection notes (${llm.notes.length})`;
+  notesbox.append(notesummary);
+  for (const note of llm.notes.slice(0, 5)) {
+    const row = document.createElement("p");
+    row.textContent = `Step ${note.stepid} (${note.runid}): ${note.outcome} \u2014 lesson ${note.lesson} \u2014 next ${note.advice} \xB7 by ${note.model}.`;
+    notesbox.append(row);
+  }
+  modelsroot.append(notesbox);
+  const budgetbox = document.createElement("details");
+  budgetbox.className = "sessiongroup";
+  budgetbox.open = true;
+  const budgetsummary = document.createElement("summary");
+  budgetsummary.textContent = "Cost budget";
+  budgetbox.append(budgetsummary);
+  const meter = document.createElement("progress");
+  meter.max = llm.budget?.maxtokens ?? (llm.usage.totaltokens || 1);
+  meter.value = Math.min(llm.usage.totaltokens, Number(meter.max));
+  budgetbox.append(meter);
+  const budgetinfo = document.createElement("p");
+  budgetinfo.textContent = `${llm.usage.totaltokens} tokens (${llm.usage.prompttokens} prompt and ${llm.usage.completiontokens} completion) and ${llm.usage.cost.toFixed(4)} cost over ${llm.usage.calls} call${llm.usage.calls === 1 ? "" : "s"}${llm.budget?.maxtokens !== void 0 ? ` against the ${llm.budget.maxtokens} token ceiling` : " with no token ceiling"}${llm.budget?.maxcost !== void 0 ? ` and the ${llm.budget.maxcost} ${llm.budget.currency ?? ""} cost ceiling` : ""}; a reached ceiling halts and asks.`;
+  budgetbox.append(budgetinfo);
+  const budgetactions = document.createElement("div");
+  budgetactions.className = "actions";
+  const tokensinput = document.createElement("input");
+  tokensinput.placeholder = "token ceiling";
+  const costinput = document.createElement("input");
+  costinput.placeholder = "cost ceiling";
+  const currencyinput = document.createElement("input");
+  currencyinput.placeholder = "currency";
+  budgetactions.append(tokensinput, " ", costinput, " ", currencyinput, " ", button("Set budget", async () => {
+    await request({ kind: "llmbudget", ...tokensinput.value.trim() !== "" ? { maxtokens: Number(tokensinput.value) } : {}, ...costinput.value.trim() !== "" ? { maxcost: Number(costinput.value) } : {}, ...currencyinput.value.trim() !== "" ? { currency: currencyinput.value } : {} });
+    status("Saved the cost budget; every ceiling stays the user choice.");
+    await refresh();
+  }), " ", button("Remove budget", async () => {
+    await request({ kind: "llmbudget", remove: true });
+    status("The cost budget is gone; the runs stay unbounded.");
+    await refresh();
+  }));
+  budgetbox.append(budgetactions);
+  modelsroot.append(budgetbox);
+  const templatesbox = document.createElement("details");
+  templatesbox.className = "sessiongroup";
+  const templatesummary = document.createElement("summary");
+  templatesummary.textContent = `Prompt library (${llm.templates.length})`;
+  templatesbox.append(templatesummary);
+  for (const template of llm.templates.slice(0, 8)) {
+    const row = document.createElement("p");
+    row.textContent = `${template.name} v${template.version} \xB7 variables ${template.variables.join(", ") || "none"}${template.notes !== void 0 ? ` \xB7 ${template.notes}` : ""}: ${template.body.slice(0, 120)}${template.body.length > 120 ? "\u2026" : ""}`;
+    templatesbox.append(row);
+  }
+  const templateactions = document.createElement("div");
+  templateactions.className = "actions";
+  const templatename = document.createElement("input");
+  templatename.placeholder = "template name";
+  const templatebody = document.createElement("input");
+  templatebody.placeholder = "body with {{variables}}";
+  const templatenotes = document.createElement("input");
+  templatenotes.placeholder = "change notes";
+  templateactions.append(templatename, " ", templatebody, " ", templatenotes, " ", button("Save template", async () => {
+    await request({ kind: "llmtemplate", name: templatename.value, body: templatebody.value, ...templatenotes.value.trim() !== "" ? { notes: templatenotes.value } : {} });
+    status("Saved the template version with its change notes.");
+    await refresh();
+  }), " ", button("Remove template", async () => {
+    await request({ kind: "llmtemplate", name: templatename.value, remove: true });
+    status("Removed every version of the template.");
+    await refresh();
+  }));
+  templatesbox.append(templateactions);
+  modelsroot.append(templatesbox);
+  const guardbox = document.createElement("details");
+  guardbox.className = "sessiongroup";
+  const guardsummary = document.createElement("summary");
+  guardsummary.textContent = `Guard refusals (${llm.guardnotices.length})`;
+  guardbox.append(guardsummary);
+  for (const notice of llm.guardnotices.slice(0, 5)) {
+    const row = document.createElement("p");
+    row.textContent = `${notice.verdict} after ${notice.attempts} attempt${notice.attempts === 1 ? "" : "s"}: ${notice.reason ?? "the output failed its guard"}.`;
+    guardbox.append(row);
+  }
+  if (llm.guardnotices.length === 0) {
+    const row = document.createElement("p");
+    row.textContent = "No guard refusal yet; invalid model output never executes.";
+    guardbox.append(row);
+  }
+  modelsroot.append(guardbox);
+}
+function renderagents(context) {
+  if (!agentsroot) return;
+  agentsroot.replaceChildren();
+  const swarm = context.swarm;
+  if (!swarm) {
+    const empty = document.createElement("p");
+    empty.textContent = "The swarm state is unknown.";
+    agentsroot.append(empty);
+    return;
+  }
+  const head = document.createElement("p");
+  head.textContent = `${swarm.overview.agents} agent${swarm.overview.agents === 1 ? "" : "s"} (${swarm.overview.active} active, ${swarm.overview.paused} paused, ${swarm.overview.stopped} stopped) \xB7 ${swarm.overview.tasks} task${swarm.overview.tasks === 1 ? "" : "s"} (${swarm.overview.claimed} claimed, ${swarm.overview.queued} queued, ${swarm.overview.done} done) \xB7 ${swarm.overview.messages} message${swarm.overview.messages === 1 ? "" : "s"} with ${swarm.overview.unread} unread \xB7 queue policy ${swarm.queue.completionpolicy}${swarm.queue.complete ? " \xB7 queue complete" : ""}.`;
+  agentsroot.append(head);
+  const switchbox = document.createElement("div");
+  switchbox.className = "actions";
+  if (swarm.killswitch.engaged) {
+    const state = document.createElement("span");
+    state.className = "muted";
+    state.textContent = `Killswitch engaged${swarm.killswitch.reason !== void 0 ? `: ${swarm.killswitch.reason}` : ""}; every agent halted.`;
+    switchbox.append(state, " ", button("Disarm killswitch", async () => {
+      await request({ kind: "swarmagent", disarm: true });
+      status("The killswitch disarmed; the stopped agents stay stopped until resumed.");
+      await refresh();
+    }));
+  } else {
+    switchbox.append(button("Halt every agent (killswitch)", async () => {
+      if (window.confirm("Halt every agent of the swarm at once?")) {
+        await request({ kind: "swarmagent", killall: true, reason: "The user halted the swarm from the panel." });
+        status("The killswitch engaged: every agent halted at once and the claims returned to the queue.");
+        await refresh();
+      }
+    }));
+  }
+  agentsroot.append(switchbox);
+  const agentsbox = document.createElement("details");
+  agentsbox.className = "sessiongroup";
+  agentsbox.open = true;
+  const agentsummary = document.createElement("summary");
+  agentsummary.textContent = `Agent cards (${swarm.agents.length})`;
+  agentsbox.append(agentsummary);
+  for (const agent of swarm.agents) {
+    const row = document.createElement("div");
+    row.className = "sessionrow";
+    const info = document.createElement("p");
+    const budgettext = agent.budget === void 0 ? "no ceiling" : [agent.budget.maxtokens !== void 0 ? `${agent.usage?.tokens ?? 0}/${agent.budget.maxtokens} tokens` : "", agent.budget.maxcost !== void 0 ? `${agent.usage?.cost ?? 0}/${agent.budget.maxcost} ${agent.budget.currency ?? ""}` : "", agent.budget.maxsteps !== void 0 ? `${agent.usage?.steps ?? 0}/${agent.budget.maxsteps} steps` : ""].filter((part) => part !== "").join(", ") || "no ceiling set";
+    info.textContent = `${agent.name} \xB7 ${agent.role} \xB7 ${agent.state}${agent.tabid !== void 0 ? ` \xB7 tab ${agent.tabid}` : ""}${agent.parentid !== void 0 ? ` \xB7 sub of ${agent.parentid} at depth ${agent.depth}` : ""}${agent.currenttask !== void 0 ? ` \xB7 working: ${agent.currenttask}` : " \xB7 idle"} \xB7 budget ${budgettext}${agent.heartbeatat !== void 0 ? ` \xB7 heartbeat ${new Date(agent.heartbeatat).toLocaleTimeString()}` : ""}${agent.unread > 0 ? ` \xB7 ${agent.unread} unread` : ""}.`;
+    row.append(info);
+    const actions = document.createElement("div");
+    actions.className = "actions";
+    actions.append(button("Pause", async () => {
+      await request({ kind: "swarmagent", agentid: agent.id, action: "pause" });
+      status(`Paused the agent ${agent.name}; the others keep running.`);
+      await refresh();
+    }), " ", button("Resume", async () => {
+      await request({ kind: "swarmagent", agentid: agent.id, action: "resume" });
+      status(`Resumed the agent ${agent.name}.`);
+      await refresh();
+    }), " ", button("Stop", async () => {
+      await request({ kind: "swarmagent", agentid: agent.id, action: "stop" });
+      status(`Stopped the agent ${agent.name}.`);
+      await refresh();
+    }), " ", button("Claim task", async () => {
+      await request({ kind: "swarmqueue", agentid: agent.id, claim: true });
+      status(`The agent ${agent.name} claimed the highest priority task; the proposal still passes the plan review.`);
+      await refresh();
+    }), " ", button("Heartbeat", async () => {
+      await request({ kind: "swarmagent", agentid: agent.id, heartbeat: true });
+      status(`The agent ${agent.name} refreshed its heartbeat.`);
+      await refresh();
+    }));
+    const budgetrow = document.createElement("div");
+    budgetrow.className = "actions";
+    const tokensinput = document.createElement("input");
+    tokensinput.placeholder = "token ceiling";
+    const costinput = document.createElement("input");
+    costinput.placeholder = "cost ceiling";
+    const stepsinput = document.createElement("input");
+    stepsinput.placeholder = "step ceiling";
+    const currencyinput = document.createElement("input");
+    currencyinput.placeholder = "currency";
+    budgetrow.append(tokensinput, " ", costinput, " ", currencyinput, " ", stepsinput, " ", button("Set budget", async () => {
+      await request({ kind: "swarmagent", agentid: agent.id, budget: { ...tokensinput.value.trim() !== "" ? { maxtokens: Number(tokensinput.value) } : {}, ...costinput.value.trim() !== "" ? { maxcost: Number(costinput.value) } : {}, ...stepsinput.value.trim() !== "" ? { maxsteps: Number(stepsinput.value) } : {}, ...currencyinput.value.trim() !== "" ? { currency: currencyinput.value.trim() } : {} } });
+      status(`Saved the budget of the agent ${agent.name}.`);
+      await refresh();
+    }));
+    row.append(actions, budgetrow);
+    agentsbox.append(row);
+  }
+  const addrow = document.createElement("div");
+  addrow.className = "actions";
+  const nameinput = document.createElement("input");
+  nameinput.placeholder = "new agent name";
+  const roleselect = document.createElement("select");
+  for (const role of ["worker", "planner", "observer"]) {
+    const option = document.createElement("option");
+    option.value = role;
+    option.textContent = role;
+    roleselect.append(option);
+  }
+  const customrole = document.createElement("input");
+  customrole.placeholder = "custom role";
+  const tabinput = document.createElement("input");
+  tabinput.placeholder = "tab id";
+  addrow.append(nameinput, " ", roleselect, " ", customrole, " ", tabinput, " ", button("Register agent", async () => {
+    await request({ kind: "swarmagent", register: { name: nameinput.value, role: customrole.value.trim() !== "" ? customrole.value.trim() : roleselect.value, ...tabinput.value.trim() !== "" ? { tabid: Number(tabinput.value) } : {} } });
+    status(`Registered the agent ${nameinput.value}; one tab holds at most one agent.`);
+    await refresh();
+  }));
+  agentsbox.append(addrow);
+  const spawnrow = document.createElement("div");
+  spawnrow.className = "actions";
+  const parentselect = document.createElement("select");
+  for (const agent of swarm.agents) {
+    const option = document.createElement("option");
+    option.value = agent.id;
+    option.textContent = agent.name;
+    parentselect.append(option);
+  }
+  const spawnrole = document.createElement("select");
+  for (const role of ["worker", "planner", "observer"]) {
+    const option = document.createElement("option");
+    option.value = role;
+    option.textContent = role;
+    spawnrole.append(option);
+  }
+  const spawntask = document.createElement("input");
+  spawntask.placeholder = "sub agent task";
+  const spawndepth = document.createElement("input");
+  spawndepth.placeholder = "depth";
+  spawndepth.value = "1";
+  const spawnname = document.createElement("input");
+  spawnname.placeholder = "sub agent name";
+  spawnrow.append(parentselect, " ", spawnrole, " ", spawntask, " ", spawndepth, " ", spawnname, " ", button("Spawn sub agent", async () => {
+    await request({ kind: "swarmagent", spawn: { parentid: parentselect.value, role: spawnrole.value, task: spawntask.value, depth: Number(spawndepth.value || "1"), ...spawnname.value.trim() !== "" ? { name: spawnname.value } : {} } });
+    status("Spawned the sub agent; the depth history records the recursion.");
+    await refresh();
+  }));
+  agentsbox.append(spawnrow);
+  if (swarm.spawns.length > 0) {
+    const history = document.createElement("p");
+    history.textContent = `Spawn history: ${swarm.spawns.slice(0, 5).map((record) => `${record.parentid} \u2192 ${record.childid} (${record.role}, depth ${record.depth})`).join("; ")}.`;
+    agentsbox.append(history);
+  }
+  agentsroot.append(agentsbox);
+  const queuebox = document.createElement("details");
+  queuebox.className = "sessiongroup";
+  queuebox.open = true;
+  const queuesummary = document.createElement("summary");
+  queuesummary.textContent = `Task queue (${swarm.queue.items.length})`;
+  queuebox.append(queuesummary);
+  for (const lane of swarm.queue.lanesreport) {
+    const row = document.createElement("p");
+    const claims = swarm.queue.claims.filter((claim) => swarm.queue.items.some((item) => item.id === claim.taskid && item.lane === lane.lane && item.state === "claimed"));
+    row.textContent = `Lane ${lane.lane}: ${lane.queued} queued \xB7 ${lane.claimed} claimed \xB7 ${lane.done} done \xB7 ${lane.cancelled} cancelled${claims.length > 0 ? ` \xB7 held by ${claims.map((claim) => claim.agentid).join(", ")}` : ""}.`;
+    queuebox.append(row);
+  }
+  const list = document.createElement("ol");
+  list.className = "audit";
+  for (const item of swarm.queue.items.slice(0, 12)) {
+    const entry = document.createElement("li");
+    entry.textContent = `${item.payload} \u2014 lane ${item.lane}, priority ${item.priority}, ${item.state}.`;
+    const actions = document.createElement("div");
+    actions.className = "actions";
+    actions.append(button("Complete", async () => {
+      await request({ kind: "swarmqueue", taskid: item.id, complete: true });
+      status("The task completed and released its claim.");
+      await refresh();
+    }), " ", button("Cancel", async () => {
+      await request({ kind: "swarmqueue", taskid: item.id, cancel: true });
+      status("The task left the queue.");
+      await refresh();
+    }));
+    entry.append(actions);
+    list.append(entry);
+  }
+  queuebox.append(list);
+  const enqueuerow = document.createElement("div");
+  enqueuerow.className = "actions";
+  const laneinput = document.createElement("input");
+  laneinput.placeholder = "lane";
+  const priorityinput = document.createElement("input");
+  priorityinput.placeholder = "priority";
+  const payloadinput = document.createElement("input");
+  payloadinput.placeholder = "task in plain language";
+  const lanesinput = document.createElement("input");
+  lanesinput.placeholder = "configured lanes, comma separated";
+  lanesinput.value = swarm.queue.lanes.join(", ");
+  enqueuerow.append(laneinput, " ", priorityinput, " ", payloadinput, " ", button("Enqueue", async () => {
+    await request({ kind: "swarmqueue", enqueue: { lane: laneinput.value, priority: Number(priorityinput.value || "0"), payload: payloadinput.value } });
+    status("The task entered the lane; nothing runs before the plan review.");
+    await refresh();
+  }), " ", button("Requeue orphans", async () => {
+    await request({ kind: "swarmqueue", requeue: true });
+    status("The requeue pass returned the orphaned tasks to their lanes.");
+    await refresh();
+  }), " ", button("Save lanes", async () => {
+    await request({ kind: "swarmqueue", lanes: lanesinput.value.split(",").map((lane) => lane.trim()).filter((lane) => lane !== "") });
+    status("Saved the configured lanes.");
+    await refresh();
+  }));
+  queuebox.append(enqueuerow);
+  agentsroot.append(queuebox);
+  const mailboxbox = document.createElement("details");
+  mailboxbox.className = "sessiongroup";
+  const mailboxsummary = document.createElement("summary");
+  mailboxsummary.textContent = `Mailboxes (${swarm.mailboxes.length})`;
+  mailboxbox.append(mailboxsummary);
+  for (const mailbox of swarm.mailboxes) {
+    if (mailbox.inbox.length === 0 && mailbox.outbox.length === 0) continue;
+    const row = document.createElement("div");
+    row.className = "sessionrow";
+    const info = document.createElement("p");
+    info.textContent = `Agent ${mailbox.agentid}: ${mailbox.inbox.length} in, ${mailbox.outbox.length} out, ${mailbox.unread} unread.`;
+    row.append(info);
+    const feed = document.createElement("ul");
+    feed.className = "audit";
+    for (const message of [...mailbox.inbox, ...mailbox.outbox].slice(0, 6)) {
+      const entry = document.createElement("li");
+      entry.textContent = `${message.senderid} \u2192 ${message.recipient} (${message.routing}): ${message.payload}`;
+      feed.append(entry);
+    }
+    row.append(feed, button("Receive", async () => {
+      await request({ kind: "swarmmailbox", agentid: mailbox.agentid, receive: true });
+      status(`The agent ${mailbox.agentid} drained its inbox.`);
+      await refresh();
+    }));
+    mailboxbox.append(row);
+  }
+  const composerow = document.createElement("div");
+  composerow.className = "actions";
+  const recipientselect = document.createElement("select");
+  const broadcastoption = document.createElement("option");
+  broadcastoption.value = "*";
+  broadcastoption.textContent = "broadcast (every agent)";
+  recipientselect.append(broadcastoption);
+  for (const agent of swarm.agents) {
+    const option = document.createElement("option");
+    option.value = agent.id;
+    option.textContent = `${agent.name} (${agent.id})`;
+    recipientselect.append(option);
+  }
+  const routingselect = document.createElement("select");
+  for (const routing of ["direct", "broadcast", "role"]) {
+    const option = document.createElement("option");
+    option.value = routing;
+    option.textContent = routing;
+    routingselect.append(option);
+  }
+  const messageinput = document.createElement("input");
+  messageinput.placeholder = "message to the agents";
+  composerow.append(recipientselect, " ", routingselect, " ", messageinput, " ", button("Send user message", async () => {
+    await request({ kind: "swarmmailbox", send: { senderid: "user", recipient: recipientselect.value, routing: routingselect.value, payload: messageinput.value } });
+    status("The user message was delivered to the swarm.");
+    await refresh();
+  }));
+  mailboxbox.append(composerow);
+  agentsroot.append(mailboxbox);
+  const boardbox = document.createElement("details");
+  boardbox.className = "sessiongroup";
+  const boardsummary = document.createElement("summary");
+  boardsummary.textContent = "Blackboard";
+  boardbox.append(boardsummary);
+  for (const section of swarm.blackboard.sections) {
+    const row = document.createElement("p");
+    row.textContent = `Section ${section.section}: ${section.entries} live entr${section.entries === 1 ? "y" : "ies"}${section.authors.length > 0 ? ` by ${section.authors.join(", ")}` : ""}${section.freshestat !== void 0 ? ` \xB7 freshest ${new Date(section.freshestat).toLocaleTimeString()}` : ""}.`;
+    boardbox.append(row);
+  }
+  const entries = document.createElement("ol");
+  entries.className = "audit";
+  for (const entry of swarm.blackboard.entries.slice(0, 12)) {
+    const item = document.createElement("li");
+    item.textContent = `[${entry.section}] ${entry.key} = ${entry.value} \u2014 ${entry.author}, ${entry.consentclass}, posted ${new Date(entry.postedat).toLocaleTimeString()}.`;
+    const actions = document.createElement("div");
+    actions.className = "actions";
+    actions.append(button("Retire", async () => {
+      await request({ kind: "swarmblackboard", retire: entry.id });
+      status(`Retired the entry ${entry.key}.`);
+      await refresh();
+    }));
+    item.append(actions);
+    entries.append(item);
+  }
+  boardbox.append(entries);
+  const postrow = document.createElement("div");
+  postrow.className = "actions";
+  const keyinput = document.createElement("input");
+  keyinput.placeholder = "key";
+  const valueinput = document.createElement("input");
+  valueinput.placeholder = "value";
+  const sectionselect = document.createElement("select");
+  for (const section of ["goals", "facts", "findings", "scratch"]) {
+    const option = document.createElement("option");
+    option.value = section;
+    option.textContent = section;
+    sectionselect.append(option);
+  }
+  const authorselect = document.createElement("select");
+  const useroption = document.createElement("option");
+  useroption.value = "user";
+  useroption.textContent = "user";
+  authorselect.append(useroption);
+  for (const agent of swarm.agents) {
+    const option = document.createElement("option");
+    option.value = agent.id;
+    option.textContent = agent.name;
+    authorselect.append(option);
+  }
+  postrow.append(keyinput, " ", valueinput, " ", sectionselect, " ", authorselect, " ", button("Post entry", async () => {
+    await request({ kind: "swarmblackboard", post: { key: keyinput.value, value: valueinput.value, section: sectionselect.value, author: authorselect.value } });
+    status("The entry landed on the shared board; every agent reads it.");
+    await refresh();
+  }), " ", button("Retirement sweep", async () => {
+    await request({ kind: "swarmblackboard", sweep: true });
+    status("The retirement pass expired the stale entries.");
+    await refresh();
+  }));
+  boardbox.append(postrow);
+  agentsroot.append(boardbox);
+  if (swarm.events.length > 0) {
+    const eventbox = document.createElement("details");
+    eventbox.className = "sessiongroup";
+    const eventsummary = document.createElement("summary");
+    eventsummary.textContent = `Lifecycle events (${swarm.events.length})`;
+    eventbox.append(eventsummary);
+    const feed = document.createElement("ul");
+    feed.className = "audit";
+    for (const event of swarm.events.slice(0, 10)) {
+      const entry = document.createElement("li");
+      entry.textContent = `${event.kind}: ${event.summary}`;
+      feed.append(entry);
+    }
+    eventbox.append(feed);
+    agentsroot.append(eventbox);
+  }
+}
 //# sourceMappingURL=sidepanel.js.map