@chrok/dsh-braid 0.0.0-stage → 0.3.2

package/dist/client.js

@@ -0,0 +1,732 @@
+window.__ModuleLoader__.load({ id: "@chrok/dsh-braid", factory: (require) => { var module = { exports: {} }; var exports = module.exports;
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// integrations/dsh/client/index.tsx
+var index_exports = {};
+__export(index_exports, {
+  apply: () => apply,
+  inject: () => inject
+});
+module.exports = __toCommonJS(index_exports);
+
+// integrations/dsh/panel-contract.ts
+var PANEL_PACKAGE = "@chrok/dsh-braid";
+function parseRequest(value, method) {
+  if (!value || typeof value !== "object" || Array.isArray(value)) throw new Error("Invalid Braid panel request");
+  const r = value;
+  const id2 = (key) => typeof r[key] === "string" && r[key].length > 0 && r[key].length <= 1024;
+  if (!id2("sessionId") || r.jobId !== void 0 && !id2("jobId")) throw new Error("Invalid session or job ID");
+  if (r.createdBefore !== void 0 && (!Number.isSafeInteger(r.createdBefore) || Number(r.createdBefore) < 0)) throw new Error("Invalid call timestamp");
+  if (method !== "watch" && !id2("jobId")) throw new Error("A job ID is required");
+  if (method === "control" && (!["cancel", "resume"].includes(String(r.action)) || !Number.isSafeInteger(r.revision) || Number(r.revision) < 0 || !Array.isArray(r.executionIds) || r.executionIds.length > 1e4 || r.executionIds.some((v) => typeof v !== "string" || !v || v.length > 1024))) throw new Error("Invalid Braid control request");
+  if (method === "detail" && (!id2("executionId") || !Number.isSafeInteger(r.offset) || Number(r.offset) < 0)) throw new Error("Invalid execution or offset");
+  return value;
+}
+var panelDescriptors = ["watch", "control", "detail"].map((method) => ({
+  id: `${PANEL_PACKAGE}#braidPanel/${method}`,
+  service: "braidPanel",
+  namespace: "braidPanel",
+  method,
+  invocation: { kind: "direct" },
+  parameters: [{ name: "request", wire: "request", source: "json", codec: {
+    mode: "strict",
+    typeSymbol: `${PANEL_PACKAGE}/${method}Request`,
+    create: () => ({ parse: (value) => parseRequest(value, method) })
+  } }],
+  result: { mode: "src-json" },
+  ...method === "watch" ? { mode: "stream", cancellation: { parameter: "signal" } } : {}
+}));
+
+// integrations/dsh/client/Panel.tsx
+var import_react = require("react");
+
+// integrations/dsh/client/layout.ts
+function layoutGraph(nodes, edges) {
+  const rank = new Map(nodes.map((node) => [node.id, 0]));
+  const incoming = new Map(nodes.map((node) => [node.id, 0]));
+  const outgoing = new Map(nodes.map((node) => [node.id, []]));
+  for (const edge of edges) {
+    if (edge.feedback || !rank.has(edge.from) || !rank.has(edge.to)) continue;
+    incoming.set(edge.to, incoming.get(edge.to) + 1);
+    outgoing.get(edge.from).push(edge.to);
+  }
+  const queue = nodes.filter((node) => incoming.get(node.id) === 0).map((node) => node.id);
+  for (let i = 0; i < queue.length; i++) for (const to of outgoing.get(queue[i])) {
+    rank.set(to, Math.max(rank.get(to), rank.get(queue[i]) + 1));
+    incoming.set(to, incoming.get(to) - 1);
+    if (incoming.get(to) === 0) queue.push(to);
+  }
+  const columns = /* @__PURE__ */ new Map();
+  const positions = new Map(nodes.map((node) => {
+    const row = rank.get(node.id), column = columns.get(row) ?? 0;
+    columns.set(row, column + 1);
+    return [node.id, { x: 32 + column * 186, y: 28 + row * 124 }];
+  }));
+  return {
+    positions,
+    width: Math.max(280, ...[...columns.values()].map((count) => count * 186 + 32)),
+    height: Math.max(160, ...[...rank.values()].map((row) => (row + 1) * 124 + 28))
+  };
+}
+
+// integrations/dsh/client/Panel.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var number = (n) => n.toLocaleString();
+var message = (error) => error instanceof Error ? error.message : String(error);
+function Status({ status }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "br-status", "data-status": status, children: status });
+}
+function Graph({ job, selected, select }) {
+  const layout = (0, import_react.useMemo)(() => layoutGraph(job.nodes, job.edges), [job.nodes, job.edges]);
+  const [zoom, setZoom] = (0, import_react.useState)(1);
+  const arrow = (0, import_react.useId)().replaceAll(":", "");
+  const selectedButton = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    selectedButton.current?.scrollIntoView?.({ block: "nearest", inline: "nearest" });
+  }, [selected]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: "br-section", "aria-label": "Execution graph", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-section-head", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { children: "Execution graph" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-toolbar", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { "aria-label": "Zoom out", disabled: zoom <= 0.5, onClick: () => setZoom((v) => Math.max(0.5, v - 0.25)), children: "\u2212" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", { "aria-label": "Reset zoom", onClick: () => setZoom(1), children: [
+          Math.round(zoom * 100),
+          "%"
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { "aria-label": "Zoom in", disabled: zoom >= 1.5, onClick: () => setZoom((v) => Math.min(1.5, v + 0.25)), children: "+" })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "br-graph", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { width: layout.width * zoom, height: layout.height * zoom }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-graph-canvas", style: { width: layout.width, height: layout.height, transform: `scale(${zoom})`, transformOrigin: "top left" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { width: layout.width, height: layout.height, "aria-hidden": "true", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("marker", { id: arrow, viewBox: "0 0 10 10", refX: "9", refY: "5", markerWidth: "5", markerHeight: "5", orient: "auto-start-reverse", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M 0 0 L 10 5 L 0 10 z", style: { fill: "var(--br-muted)" } }) }) }),
+        job.edges.map((edge, i) => {
+          const a = layout.positions.get(edge.from), b = layout.positions.get(edge.to);
+          if (!a || !b) return null;
+          const x = a.x + 77, y = a.y + 72, endX = b.x + 77, endY = b.y;
+          const d = edge.feedback ? `M ${a.x} ${a.y + 36} C 6 ${a.y + 36}, 6 ${b.y + 36}, ${b.x} ${b.y + 36}` : `M ${x} ${y} C ${x} ${y + 26}, ${endX} ${endY - 26}, ${endX} ${endY}`;
+          return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d, strokeDasharray: edge.feedback ? "4 4" : void 0, markerEnd: `url(#${arrow})`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("title", { children: [
+              edge.from,
+              " \u2192 ",
+              edge.to,
+              edge.choice ? ` (${edge.choice})` : "",
+              edge.feedback ? ` \xB7 loop ${edge.feedback}` : "",
+              edge.executionId ? ` \xB7 ${edge.executionId}` : ""
+            ] }) }),
+            edge.choice && !edge.feedback && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("text", { x: (x + endX) / 2 + 5, y: (y + endY) / 2 - 4, children: edge.choice.slice(0, 22) })
+          ] }, i);
+        })
+      ] }),
+      job.nodes.map((node) => {
+        const p = layout.positions.get(node.id);
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", { ref: selected === node.id ? selectedButton : void 0, className: "br-node", style: { left: p.x, top: p.y }, "aria-pressed": selected === node.id, onClick: () => select(node.id), title: `${node.id} \xB7 ${node.type} \xB7 ${node.status}`, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("small", { children: node.type }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: node.id }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Status, { status: node.status })
+        ] }, node.id);
+      })
+    ] }) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-legend", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Solid \xB7 dependency" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Dashed \xB7 loop feedback" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Click a node to inspect" })
+    ] }),
+    job.loops.map((loop) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "br-note", children: [
+      "Loop ",
+      loop.id,
+      " \xB7 entry ",
+      loop.entry,
+      " \xB7 maximum ",
+      loop.maxIterations,
+      " iterations"
+    ] }, loop.id))
+  ] });
+}
+function ExecutionDetail({ api, sessionId, job, execution }) {
+  const [detail, setDetail] = (0, import_react.useState)();
+  const [error, setError] = (0, import_react.useState)("");
+  const [offset, setOffset] = (0, import_react.useState)(0);
+  const [retry, setRetry] = (0, import_react.useState)(0);
+  (0, import_react.useEffect)(() => {
+    let active = true;
+    setDetail(void 0);
+    setError("");
+    void api.detail({ sessionId, jobId: job.jobId, executionId: execution.executionId, offset }).then((value) => {
+      if (active) setDetail(value);
+    }, (e) => {
+      if (active) setError(message(e));
+    });
+    return () => {
+      active = false;
+    };
+  }, [api, sessionId, job.jobId, job.status, execution.executionId, execution.status, offset, retry]);
+  const p = execution.progress;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-detail-grid", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Execution" }),
+        execution.executionId
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Revision / iteration" }),
+        "r",
+        execution.revision,
+        " / ",
+        execution.iteration ?? "\u2014"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Elapsed" }),
+        execution.latencyMs === void 0 ? "\u2014" : `${(execution.latencyMs / 1e3).toFixed(1)}s`
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Worker" }),
+        p?.phase ?? execution.status
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
+          "Context (",
+          p?.contextSource ?? "unreported",
+          ")"
+        ] }),
+        p ? `${number(p.contextTokens)}${p.contextWindow ? ` / ${number(p.contextWindow)}` : ""}` : "\u2014"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Tool calls / rounds" }),
+        p ? `${p.toolCalls} / ${p.toolRounds}` : "\u2014"
+      ] })
+    ] }),
+    error && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { role: "alert", children: [
+      error,
+      " ",
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { onClick: () => setRetry((v) => v + 1), children: "Retry output" })
+    ] }),
+    !detail && !error && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "br-muted", role: "status", children: "Loading output\u2026" }),
+    detail && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+      detail.error && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { role: "alert", children: detail.error }),
+      detail.decision && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { children: [
+        "Decision: ",
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: detail.decision })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("pre", { className: "br-output", "aria-label": "Execution output", children: detail.output || (execution.status === "running" ? "Output will appear when this execution finishes." : "No output for this execution.") }),
+      detail.total > 32768 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-toolbar", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { disabled: offset === 0, onClick: () => setOffset(Math.max(0, offset - 32768)), children: "Previous output" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("small", { className: "br-muted", children: [
+          number(detail.offset),
+          "\u2013",
+          number(detail.next),
+          " / ",
+          number(detail.total),
+          " characters"
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { disabled: detail.next >= detail.total, onClick: () => setOffset(detail.next), children: "Next output" })
+      ] }),
+      detail.workspace && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("details", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("summary", { children: "Workspace and recovery refs" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("pre", { className: "br-output", children: detail.workspace })
+      ] })
+    ] })
+  ] });
+}
+function JobView({ job, api, sessionId, connected, act, busy, target }) {
+  const [selected, setSelected] = (0, import_react.useState)(() => job.executions.find((e) => e.executionId === target?.executionId)?.id ?? target?.nodeId ?? (target?.executionId ? "" : job.nodes[0]?.id ?? ""));
+  const [chosenExecution, setChosenExecution] = (0, import_react.useState)(target?.executionId ?? "");
+  const [tab, setTab] = (0, import_react.useState)("output");
+  const executions = job.executions.filter((e) => e.id === selected);
+  const execution = chosenExecution ? executions.find((e) => e.executionId === chosenExecution) : executions.at(-1);
+  const paused = execution && job.pausedExecutionIds.includes(execution.executionId);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-stats", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("strong", { children: [
+          job.executions.filter((e) => e.status === "completed").length,
+          "/",
+          job.executions.length
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Executions complete" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: number(job.usage.inputTokens) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Input tokens" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: number(job.usage.outputTokens) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Output tokens" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { children: number(job.usage.cacheReadTokens + job.usage.cacheWriteTokens) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Cache tokens" })
+      ] })
+    ] }),
+    job.error && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "br-notice", role: "alert", children: job.error }),
+    job.pausedExecutionIds.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-notice", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("strong", { children: [
+        job.pausedExecutionIds.length,
+        " execution(s) paused"
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "br-note", children: "Inspect the output, then resume outgoing scheduling. Job deadlines continue while paused." }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "br-primary", disabled: !connected || busy || job.status !== "running", onClick: () => act("resume", job.pausedExecutionIds), children: "Resume all paused" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Graph, { job, selected, select: (id2) => {
+      setSelected(id2);
+      setChosenExecution("");
+      setTab("output");
+    } }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: "br-section", "aria-label": "Execution details", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-section-head", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { children: selected || "Execution details" }),
+        execution && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Status, { status: paused ? "waiting" : execution.status })
+      ] }),
+      chosenExecution && !execution && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { role: "status", children: [
+        "The requested execution (",
+        chosenExecution,
+        ") is no longer available. Select a node to inspect its current history."
+      ] }),
+      executions.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "br-muted", children: "Execution history" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("select", { className: "br-select", "aria-label": "Execution history", value: execution?.executionId ?? "", onChange: (e) => setChosenExecution(e.target.value), children: executions.map((e) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("option", { value: e.executionId, children: [
+          e.executionId,
+          " \xB7 ",
+          e.status,
+          e.iteration === void 0 ? "" : ` \xB7 iteration ${e.iteration}`
+        ] }, e.executionId)) })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "br-muted", children: "This node has not run yet." }),
+      paused && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "br-primary", disabled: !connected || busy || job.status !== "running", onClick: () => act("resume", [execution.executionId]), children: "Resume this execution" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-tabs", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { "aria-pressed": tab === "output", onClick: () => setTab("output"), children: "Output & details" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", { "aria-pressed": tab === "events", onClick: () => setTab("events"), children: [
+          "Event log (",
+          job.events.length,
+          ")"
+        ] })
+      ] }),
+      tab === "output" && execution && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ExecutionDetail, { api, sessionId, job, execution }, execution.executionId),
+      tab === "events" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "br-note", children: "Latest 80 lifecycle events. Full results remain available through braid_status." }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("ol", { className: "br-events", children: [...job.events].reverse().map((event) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("time", { children: new Date(event.timestamp).toLocaleTimeString([], { hour12: false }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: event.message }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("small", { children: [
+              "#",
+              event.sequence,
+              event.nodeId ? ` \xB7 ${event.nodeId}` : "",
+              event.executionId ? ` \xB7 ${event.executionId}` : ""
+            ] })
+          ] })
+        ] }, event.sequence)) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "br-note", children: [
+        "Cache read ",
+        number(job.usage.cacheReadTokens),
+        " \xB7 cache write ",
+        number(job.usage.cacheWriteTokens),
+        ". Usage is reported by DSH; monetary cost is not estimated."
+      ] })
+    ] })
+  ] });
+}
+function BraidPanelView(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SessionPanel, { ...props }, props.sessionId);
+}
+function SessionPanel({ sessionId, api, target }) {
+  const [jobId, setJobId] = (0, import_react.useState)(target?.jobId);
+  const [createdBefore, setCreatedBefore] = (0, import_react.useState)(target?.createdBefore);
+  const [frame, setFrame] = (0, import_react.useState)();
+  const [connected, setConnected] = (0, import_react.useState)(false);
+  const [error, setError] = (0, import_react.useState)("");
+  const [actionError, setActionError] = (0, import_react.useState)("");
+  const [busy, setBusy] = (0, import_react.useState)(false);
+  const [retry, setRetry] = (0, import_react.useState)(0);
+  (0, import_react.useEffect)(() => {
+    const controller = new AbortController();
+    setConnected(false);
+    setFrame(void 0);
+    setError("");
+    setActionError("");
+    void (async () => {
+      for (let attempt = 0; !controller.signal.aborted; attempt++) {
+        try {
+          for await (const value of api.watch({ sessionId, ...jobId ? { jobId } : {}, ...createdBefore === void 0 ? {} : { createdBefore } }, controller.signal)) {
+            if (controller.signal.aborted) return;
+            setFrame(value);
+            setConnected(true);
+            setError("");
+            attempt = 0;
+          }
+          if (!controller.signal.aborted) throw new Error("Braid connection closed");
+        } catch (e) {
+          if (controller.signal.aborted) return;
+          setConnected(false);
+          setError(`${message(e)}${attempt < 2 ? " \xB7 reconnecting\u2026" : ""}`);
+          if (attempt >= 2) return;
+          await new Promise((resolve) => {
+            const done = () => {
+              clearTimeout(timer);
+              controller.signal.removeEventListener("abort", done);
+              resolve();
+            };
+            const timer = setTimeout(done, 1e3 * 2 ** attempt);
+            controller.signal.addEventListener("abort", done, { once: true });
+          });
+        }
+      }
+    })();
+    return () => {
+      controller.abort();
+    };
+  }, [api, sessionId, jobId, createdBefore, retry]);
+  const job = frame?.job;
+  const [actionOwner, setActionOwner] = (0, import_react.useState)("");
+  const act = async (action, executionIds) => {
+    if (!job || !connected || busy) return;
+    const owner = job.jobId;
+    setBusy(true);
+    setActionOwner(owner);
+    setActionError("");
+    try {
+      await api.control({ sessionId, jobId: owner, action, executionIds, revision: job.revision });
+    } catch (e) {
+      setActionError(message(e));
+    } finally {
+      setBusy(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "braid-panel", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("header", { className: "br-header", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "br-eyebrow", children: "Agent orchestration" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-heading", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { children: "Braid" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("small", { role: "status", children: connected ? "\u25CF Live" : error ? "\u25CB Disconnected" : "Connecting\u2026" })
+      ] }),
+      frame && frame.rows.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("select", { className: "br-select", "aria-label": "Braid job", disabled: busy, value: job?.jobId ?? "", onChange: (e) => {
+          setJobId(e.target.value);
+          setCreatedBefore(void 0);
+          setActionError("");
+        }, children: frame.rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("option", { value: row.jobId, children: [
+          row.handle,
+          " \xB7 ",
+          row.status,
+          " \xB7 ",
+          row.goal.slice(0, 70)
+        ] }, row.jobId)) }),
+        job && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "br-goal", children: job.goal }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-toolbar", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Status, { status: job.phase === "waiting" ? "waiting" : job.status }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("small", { className: "br-muted", children: [
+              "r",
+              job.revision,
+              " \xB7 ",
+              job.nodes.length,
+              " nodes"
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { className: "br-danger", style: { marginLeft: "auto" }, disabled: !connected || busy || job.status !== "running", onClick: () => void act("cancel", []), children: busy ? "Working\u2026" : "Cancel job" })
+          ] })
+        ] })
+      ] })
+    ] }),
+    error && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-notice", role: "alert", children: [
+      error,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-toolbar", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { onClick: () => setRetry((v) => v + 1), children: "Reconnect" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("button", { onClick: () => {
+          setJobId(void 0);
+          setCreatedBefore(void 0);
+          setRetry((v) => v + 1);
+        }, children: "Latest job" })
+      ] })
+    ] }),
+    actionError && actionOwner === job?.jobId && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "br-notice", role: "alert", children: actionError }),
+    connected && frame?.rows.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "br-empty", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { children: "No Braid jobs in this session" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: "Ask the agent to use Braid for a parallel or multi-step task. Its graph, execution history and results will appear here." })
+    ] }),
+    job && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      JobView,
+      {
+        job,
+        api,
+        sessionId,
+        connected,
+        act: (action, ids) => void act(action, ids),
+        busy,
+        target: target?.jobId && [job.jobId, job.handle].includes(target.jobId) ? target : void 0
+      },
+      job.jobId
+    )
+  ] });
+}
+
+// integrations/dsh/client/styles.ts
+var styles = `
+.braid-panel{--br-bg:var(--dsw-alias-bg-base,#fff);--br-fg:var(--dsw-alias-label-primary,#222b38);--br-soft:var(--dsw-alias-bg-module-platform,#f4f6f8);--br-line:var(--dsw-alias-border-l2,#dce2e8);--br-muted:var(--dsw-alias-label-secondary,#667384);--br-accent:#336dbe;--br-green:var(--dsw-alias-state-success-primary,#18794e);--br-red:var(--dsw-alias-state-error-primary,#ba3340);color:var(--br-fg);background:var(--br-bg);font:inherit;font-size:13px;line-height:1.5;box-sizing:border-box;height:100%;overflow:auto;min-width:0;container-type:inline-size}
+.braid-panel *{box-sizing:border-box}.braid-panel button,.braid-panel select{font:inherit;color:inherit}.braid-panel button,.braid-panel select{border:1px solid var(--br-line);border-radius:7px;background:var(--br-bg);padding:6px 10px}.braid-panel button{cursor:pointer}.braid-panel button:hover:not(:disabled){border-color:var(--br-accent)}.braid-panel button:focus-visible,.braid-panel select:focus-visible{outline:2px solid var(--br-accent);outline-offset:2px}.braid-panel button:disabled{opacity:.45;cursor:default}.braid-panel .br-primary{background:var(--br-accent);color:white;border-color:transparent}.braid-panel .br-danger{color:var(--br-red)}
+.br-header{padding:20px 18px 12px;border-bottom:1px solid var(--br-line)}.br-heading{display:flex;align-items:center;gap:9px}.br-heading h2{font-size:18px;letter-spacing:-.4px;margin:0}.br-heading small{margin-left:auto;color:var(--br-muted)}.br-eyebrow{text-transform:uppercase;letter-spacing:1.4px;font-size:10px;color:var(--br-muted);margin-bottom:5px}.br-select{width:100%;margin:14px 0 8px}.br-goal{margin:8px 0;overflow-wrap:anywhere}.br-muted{color:var(--br-muted)}.br-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.br-status{display:inline-flex;align-items:center;gap:5px;font-size:11px;white-space:nowrap}.br-status:before{content:'';width:6px;height:6px;border-radius:50%;background:var(--br-muted)}.br-status[data-status=running]:before,.br-status[data-status=runnable]:before{background:var(--br-accent)}.br-status[data-status=completed]:before{background:var(--br-green)}.br-status[data-status=failed]:before,.br-status[data-status=cancelled]:before{background:var(--br-red)}.br-status[data-status=waiting]:before{background:#ba861a}
+.br-stats{display:grid;grid-template-columns:repeat(4,1fr);padding:14px 18px;gap:8px;border-bottom:1px solid var(--br-line)}.br-stats strong{display:block;font-size:16px;font-variant-numeric:tabular-nums}.br-stats span{font-size:10px;color:var(--br-muted)}.br-section{padding:14px 18px;border-bottom:1px solid var(--br-line)}.br-section h3{font-size:12px;margin:0 0 10px}.br-section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.br-section-head h3{margin:0}.br-section-head button{padding:2px 8px}.br-graph{overflow:auto;background:var(--br-soft);border:1px solid var(--br-line);border-radius:9px;max-height:420px}.br-graph-canvas{position:relative}.br-graph svg{position:absolute;inset:0;overflow:visible}.br-graph path{fill:none;stroke:var(--br-muted);stroke-width:1.2}.br-graph text{font-size:10px;fill:var(--br-muted)}.br-node{position:absolute;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:154px;height:72px;text-align:left;gap:2px;box-shadow:0 2px 5px #00000006}.br-node[aria-pressed=true]{outline:2px solid var(--br-accent);outline-offset:2px}.br-node strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.br-node small{font-size:10px;color:var(--br-muted)}.br-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:10px;color:var(--br-muted);margin-top:8px}.br-note{font-size:11px;color:var(--br-muted);margin:8px 0 0;overflow-wrap:anywhere}
+.br-notice{margin:12px 18px;padding:10px 12px;border:1px solid var(--br-line);border-radius:8px;background:var(--br-soft);overflow-wrap:anywhere}.br-notice[role=alert]{color:var(--br-red)}.br-empty{padding:48px 24px;text-align:center}.br-empty h3{font-size:15px}.br-empty p{color:var(--br-muted);max-width:36em;margin:12px auto}.br-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;font-size:11px;margin:12px 0}.br-detail-grid span{color:var(--br-muted);display:block}.br-output{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--br-soft);border:1px solid var(--br-line);padding:12px;border-radius:8px;max-height:340px;overflow:auto;font:11px/1.65 ui-monospace,SFMono-Regular,monospace;margin:8px 0}.br-tabs{display:flex;gap:5px;margin:14px 0 10px}.br-tabs button[aria-pressed=true]{border-color:var(--br-accent);color:var(--br-accent)}.br-events{list-style:none;padding:0;margin:0;max-height:320px;overflow:auto}.br-events li{padding:8px 0;display:grid;grid-template-columns:64px 1fr;gap:8px;border-bottom:1px solid var(--br-line);font-size:11px}.br-events time{color:var(--br-muted);font-variant-numeric:tabular-nums}.br-events p{margin:0;overflow-wrap:anywhere}.br-events small{color:var(--br-muted)}.br-header-action{font:inherit;border:0;border-radius:6px;padding:5px 9px;background:transparent;color:inherit;cursor:pointer}.br-header-action:hover{background:#8882}
+@container (max-width:330px){.br-stats{grid-template-columns:repeat(2,1fr)}.br-header,.br-section{padding-left:12px;padding-right:12px}}
+@media(prefers-color-scheme:dark){.braid-panel{--br-bg:var(--dsw-alias-bg-base,#171b22);--br-fg:var(--dsw-alias-label-primary,#e0e6ee);--br-soft:var(--dsw-alias-bg-module-platform,#202630);--br-line:var(--dsw-alias-border-l2,#354050);--br-muted:var(--dsw-alias-label-secondary,#a0adbe);--br-accent:#80b6ff;--br-green:var(--dsw-alias-state-success-primary,#69d6a0);--br-red:var(--dsw-alias-state-error-primary,#ff919a)}.braid-panel .br-primary{color:#162336}}
+[data-theme=dark] .braid-panel,.dark .braid-panel{--br-bg:var(--dsw-alias-bg-base,#171b22);--br-fg:var(--dsw-alias-label-primary,#e0e6ee);--br-soft:var(--dsw-alias-bg-module-platform,#202630);--br-line:var(--dsw-alias-border-l2,#354050);--br-muted:var(--dsw-alias-label-secondary,#a0adbe);--br-accent:#80b6ff;--br-green:var(--dsw-alias-state-success-primary,#69d6a0);--br-red:var(--dsw-alias-state-error-primary,#ff919a)}
+`;
+var toolStyles = `
+.br-tool-call{font:inherit;font-size:12px;color:var(--dsw-alias-label-primary,inherit);border:1px solid var(--dsw-alias-border-l2,#8884);border-radius:9px;margin:8px 0;overflow:hidden}
+.br-tool-call button{font:inherit;color:inherit;cursor:pointer}.br-tool-call button:focus-visible{outline:2px solid #639be6;outline-offset:-2px}.br-tool-call button:disabled{cursor:default;opacity:.6}
+.br-tool-open{display:flex;width:100%;align-items:center;gap:10px;padding:12px;border:0;background:var(--dsw-alias-bg-module-platform,#8881);text-align:left}.br-tool-open:hover:not(:disabled){background:var(--dsw-alias-fill-l1,#8882)}.br-tool-open>span:last-child{margin-left:auto}
+.br-tool-main{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 8px;min-width:0}.br-tool-target{overflow-wrap:anywhere;color:var(--dsw-alias-label-secondary,inherit)}.br-tool-summary{flex-basis:100%;font-size:11px}.br-tool-call[data-state=failed] .br-tool-summary,.br-tool-error{color:var(--dsw-alias-state-error-primary,#c34e59)}
+.br-tool-actions{display:flex;gap:8px;padding:6px 12px}.br-tool-actions button{border:0;background:transparent;font-size:11px;text-decoration:underline;text-underline-offset:3px;padding:3px 0}.br-tool-details{padding:8px 12px;border-top:1px solid var(--dsw-alias-border-l2,#8884)}.br-tool-details pre{font:11px/1.6 ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere;max-height:220px;overflow:auto}.br-tool-error{padding:0 12px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px}
+.br-tool-note{margin:4px 12px;color:var(--dsw-alias-label-secondary,inherit);font-size:10px;opacity:.8}.br-tool-changes{display:flex;flex-wrap:wrap;gap:5px;padding:8px 12px}.br-tool-changes span{padding:3px 6px;border-radius:4px;background:var(--dsw-alias-bg-module-platform,#8881);font-size:10px;overflow-wrap:anywhere}.br-tool-jobs{list-style:none;margin:0;padding:6px 12px;max-height:230px;overflow:auto}.br-tool-jobs button{display:flex;gap:12px;width:100%;padding:6px 0;border:0;background:transparent;text-align:left}.br-tool-jobs span{margin-left:auto}
+`;
+
+// integrations/dsh/client/navigation.ts
+var braidToolNames = ["braid", "braid_status", "braid_update", "braid_resume", "braid_cancel"];
+function record(value) {
+  return value !== null && typeof value === "object" && !Array.isArray(value) ? value : {};
+}
+function json(raw) {
+  try {
+    return record(JSON.parse(raw));
+  } catch {
+    return {};
+  }
+}
+var id = (value) => typeof value === "string" && value.trim() && value.length <= 1024 ? value : void 0;
+function readNavigation(value) {
+  const source = record(value), target = {};
+  for (const key of ["jobId", "nodeId", "executionId"]) {
+    const text = id(source[key]);
+    if (text !== void 0) target[key] = text;
+  }
+  if (typeof source.createdBefore === "number" && Number.isSafeInteger(source.createdBefore) && source.createdBefore >= 0)
+    target.createdBefore = source.createdBefore;
+  return target;
+}
+function toolData(props) {
+  const args = json(props.phase === "result" ? props.block.call?.argsRaw ?? "" : props.phase === "start" ? props.block.argsRaw : "");
+  let result = {};
+  if (props.phase === "result" && !props.block.isError) for (const content of props.block.content) {
+    if (content.type !== "text") continue;
+    const value = json(content.text);
+    if (Object.keys(value).length > 0) {
+      result = value;
+      break;
+    }
+  }
+  return { args, result };
+}
+function toolNavigation(toolName, props) {
+  if (!braidToolNames.some((name) => name === toolName) || props.phase === "preparing") return null;
+  const { args, result } = toolData(props);
+  const jobId = id(result.canonicalJobId) ?? id(result.jobId) ?? id(args.jobId);
+  if (!jobId) return toolName === "braid_status" && !("jobId" in args || "nodeId" in args || "executionId" in args) ? {} : null;
+  const target = { jobId };
+  const node = record(result.node);
+  const executionId = id(args.executionId) ?? id(node.executionId) ?? (toolName === "braid_resume" && Array.isArray(args.executionIds) && args.executionIds.length === 1 ? id(args.executionIds[0]) : void 0);
+  const nodeId = id(args.nodeId) ?? id(node.id);
+  if (executionId) target.executionId = executionId;
+  if (nodeId) target.nodeId = nodeId;
+  const time = props.block.time;
+  if (Number.isSafeInteger(time) && time >= 0) target.createdBefore = time;
+  return target;
+}
+var array = (value) => Array.isArray(value) ? value : [];
+var revision = (value) => typeof value === "number" && Number.isSafeInteger(value) ? `r${value}` : "";
+var names = (values) => {
+  const ids = values.map((value) => id(value) ?? id(record(value).id)).filter(Boolean);
+  return ids.slice(0, 8).join(", ") + (ids.length > 8 ? ` \u2026 (+${ids.length - 8})` : "");
+};
+function toolPresentation(toolName, props) {
+  const { args, result } = toolData(props);
+  const label = id(result.handle) ?? id(args.jobId) ?? id(result.jobId) ?? "";
+  const model = { label, summary: "", changes: [], jobs: [] };
+  const failed = props.phase === "result" && props.block.isError;
+  const settled = props.phase === "result";
+  if (toolName === "braid_update") {
+    const revisions = [revision(args.expectedRevision), revision(result.revision)].filter(Boolean).join(" \u2192 ");
+    model.summary = `${failed ? "Update rejected \xB7 not applied" : settled ? "Graph updated" : "Updating graph"}${revisions ? ` \xB7 ${revisions}` : ""}`;
+    for (const [key, title] of [["upsertNodes", "Upsert nodes"], ["removeNodeIds", "Remove nodes"], ["resume", "Resume executions"]]) {
+      const values = array(args[key]);
+      if (values.length) model.changes.push(`${title}: ${names(values)}`);
+    }
+    for (const [key, title] of [["addEdges", "Add edges"], ["removeEdges", "Remove edges"]]) {
+      const values = array(args[key]);
+      if (values.length) model.changes.push(`${title}: ${values.length}`);
+    }
+    if ("loops" in args) model.changes.push(`Replace loops: ${array(args.loops).length}`);
+    if ("promptTemplates" in args) model.changes.push(`Prompt templates: ${Object.keys(record(args.promptTemplates)).length}`);
+  } else if (toolName === "braid_resume") {
+    model.summary = failed ? "Resume rejected" : `${settled ? "Resumed" : "Resuming"} ${array(args.executionIds).length} execution(s)`;
+    const ids = names(array(args.executionIds));
+    if (ids) model.changes.push(ids);
+    if (Array.isArray(result.pausedExecutionIds)) model.changes.push(`${result.pausedExecutionIds.length} still paused \xB7 ${revision(result.revision)}`);
+  } else if (toolName === "braid_cancel") {
+    model.summary = failed ? "Cancellation failed" : !settled ? "Requesting cancellation" : result.cancelled === false ? "Job already finished" : "Cancellation requested";
+  } else if (toolName === "braid_status" && Array.isArray(result.jobs)) {
+    model.summary = `${result.jobs.length} job(s) at this call`;
+    model.jobs = result.jobs.flatMap((value) => {
+      const row = record(value), jobId = id(row.jobId);
+      return jobId ? [{ label: id(row.handle) ?? jobId, status: id(row.status) ?? "", target: { jobId, createdBefore: props.block.time } }] : [];
+    });
+  } else if (toolName === "braid_status") {
+    const execution = record(result.execution), node = record(result.node);
+    const executions = Object.values(record(execution.executions));
+    const details = id(node.status) ? [`execution ${id(node.status)}`, id(execution.status) ? `graph ${id(execution.status)}` : void 0, revision(execution.revision)] : [id(execution.status) ?? id(result.status), revision(execution.revision)];
+    if (executions.length) details.push(`${executions.filter((value) => record(value).status === "completed").length}/${executions.length} executions complete`);
+    if (Array.isArray(execution.pausedExecutionIds) && execution.pausedExecutionIds.length) details.push(`${execution.pausedExecutionIds.length} paused`);
+    model.summary = failed ? "Status query failed" : details.filter(Boolean).join(" \xB7 ") || (settled ? "Recorded status" : "Reading status");
+  } else {
+    const graph = record(result.graph), nodes = array(graph.nodes).length || array(args.nodes).length;
+    model.summary = failed ? "Submission failed" : `${settled ? "Graph submitted" : "Starting graph"}${nodes ? ` \xB7 ${nodes} nodes` : ""}`;
+  }
+  if (result.truncated === true) model.changes.push("Large result saved to file; view fullOutputPath in tool details");
+  return model;
+}
+
+// integrations/dsh/client/ToolCall.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function BraidToolCall(props) {
+  const { toolName, phase, block, openBraid, useDisclosure, inspect } = props;
+  const { expanded, toggle } = useDisclosure();
+  const target = toolNavigation(toolName, props);
+  const model = toolPresentation(toolName, props);
+  const failed = phase === "result" && block.isError;
+  const state = failed ? "failed" : phase === "result" ? "completed" : phase === "preparing" ? "preparing" : "running";
+  const raw = phase === "result" ? block.call?.argsRaw : phase === "start" ? block.argsRaw : void 0;
+  const output = phase === "result" ? block.content.filter((c) => c.type === "text").map((c) => c.text).join("\n") : "";
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "br-tool-call", "data-state": state, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+      "button",
+      {
+        type: "button",
+        className: "br-tool-open",
+        disabled: !target,
+        onClick: () => {
+          if (target) openBraid(target);
+        },
+        "aria-label": `Open Braid view for ${toolName}`,
+        title: target ? "Open Braid graph and execution details" : "Waiting for a Braid job receipt",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { "aria-hidden": "true", children: "\u2387" }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { className: "br-tool-main", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("strong", { children: toolName }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { className: "br-tool-target", children: [
+              model.label,
+              target?.executionId ? ` / ${target.executionId}` : target?.nodeId ? ` / ${target.nodeId}` : ""
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "br-tool-summary", children: model.summary })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { "aria-hidden": "true", children: "\u2197" })
+        ]
+      }
+    ),
+    model.changes.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "br-tool-changes", "aria-label": failed ? "Changes not applied" : "Operation details", children: model.changes.map((change, i) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: change }, i)) }),
+    model.jobs.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("ul", { className: "br-tool-jobs", children: model.jobs.map((job) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("button", { type: "button", onClick: () => openBraid(job.target), "aria-label": `View ${job.label}`, children: [
+      job.label,
+      " ",
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { children: job.status }),
+      " \u2197"
+    ] }) }, job.target.jobId)) }),
+    phase === "result" && target && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "br-tool-note", children: "Recorded result \xB7 open the graph for live state" }),
+    failed && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { role: "alert", className: "br-tool-error", children: block.error?.reason ?? block.error?.code ?? (output.slice(0, 600) || "Braid tool call failed. Expand the result for details.") }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "br-tool-actions", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("button", { type: "button", "aria-expanded": expanded, onClick: toggle, children: [
+        expanded ? "Hide" : "Show",
+        " tool details"
+      ] }),
+      inspect && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("button", { type: "button", onClick: inspect, children: "Inspect call" })
+    ] }),
+    expanded && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "br-tool-details", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("strong", { children: "Arguments" }),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("pre", { children: raw ?? "Arguments are being prepared\u2026" }),
+      phase === "result" && /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("strong", { children: "Result" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("pre", { children: output || "No text result." })
+      ] })
+    ] })
+  ] });
+}
+
+// integrations/dsh/client/index.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var inject = ["remote", "slots", "sidebarRight", "sidebarRightTabs"];
+async function apply(ctx) {
+  await ctx.remote.$mount({ package: PANEL_PACKAGE, descriptors: panelDescriptors });
+  ctx.inject(["remote.braidPanel"], (ctx2) => {
+    const remote = ctx2.remote.braidPanel;
+    const sidebar = ctx2.sidebarRight;
+    const api = {
+      watch: (request, signal) => remote.watch(request, signal),
+      control: async (request) => {
+        const result = await remote.control(request);
+        if (!result.ok) throw result.error;
+        return result.value;
+      },
+      detail: async (request) => {
+        const result = await remote.detail(request);
+        if (!result.ok) throw result.error;
+        return result.value;
+      }
+    };
+    ctx2.effect(() => {
+      const style = document.createElement("style");
+      style.dataset.plugin = PANEL_PACKAGE;
+      style.textContent = styles + toolStyles;
+      document.head.append(style);
+      return () => {
+        style.remove();
+      };
+    });
+    ctx2.effect(() => ctx2.sidebarRightTabs.register({
+      id: PANEL_PACKAGE,
+      kind: "braid",
+      title: () => "Braid",
+      guide: [{ id: "braid", order: 50, title: () => "Braid", description: () => "Live agent graphs, execution details and controls" }]
+    }));
+    ctx2.effect(() => ctx2.slots.inject("sidebar.right.pane.tab", () => ctx2.slots.register({
+      name: "sidebar.right.pane.tab",
+      key: PANEL_PACKAGE,
+      inject: (sessionId) => ({ api, sessionId })
+    }, PanelSeat)));
+    ctx2.effect(() => ctx2.slots.inject("conversation.session.header.actions", () => ctx2.slots.register({
+      name: "conversation.session.header.actions",
+      id: "braid",
+      order: 25,
+      inject: () => ({ open: () => {
+        sidebar.openTab("braid");
+      } })
+    }, HeaderAction)));
+    for (const key of braidToolNames) ctx2.effect(() => ctx2.slots.inject("tool.call.toolview", () => ctx2.slots.register({
+      name: "tool.call.toolview",
+      key,
+      inject: (sessionId) => ({ openBraid: (target) => {
+        sidebar.openTabIn(sessionId, "braid", { params: target });
+      } })
+    }, BraidToolCall)));
+  });
+}
+function HeaderAction({ open }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { className: "br-header-action", onClick: open, title: "Open Braid graph and execution details", "aria-label": "Open Braid panel", children: "\u2387 Braid" });
+}
+function PanelSeat({ sessionId, api, useTabInfo }) {
+  const { tab: { navigation } } = useTabInfo();
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(BraidPanelView, { sessionId, api, target: readNavigation(navigation.params) }, navigation.revision);
+}
+return module.exports; } });
+//# sourceMappingURL=client.js.map