@synergenius/flow-weaver 0.33.1 → 0.44.0

package/dist/diagram/index.js

@@ -1,126 +1,647 @@
-import { parser } from '../parser.js';
-import { buildDiagramGraph } from './geometry.js';
-import { renderSVG } from './renderer.js';
-import { wrapSVGInHTML } from './html-viewer.js';
-import { renderASCII, renderASCIICompact, renderText } from './ascii-renderer.js';
-export { renderASCII, renderASCIICompact, renderText } from './ascii-renderer.js';
-/**
- * Render a workflow AST to an SVG string.
- */
-export function workflowToSVG(ast, options = {}) {
-    const graph = buildDiagramGraph(ast, options);
-    return renderSVG(graph, options);
-}
-/**
- * Parse TypeScript source code and render the first (or named) workflow to SVG.
- */
-export function sourceToSVG(code, options = {}) {
-    const result = parser.parseFromString(code);
-    return pickAndRender(result.workflows, options);
-}
-/**
- * Parse a workflow file (resolves imports) and render the first (or named) workflow to SVG.
- */
-export function fileToSVG(filePath, options = {}) {
-    const result = parser.parse(filePath);
-    return pickAndRender(result.workflows, options);
-}
-/**
- * Render a workflow AST to a self-contained interactive HTML page.
- */
-export function workflowToHTML(ast, options = {}) {
-    const svg = workflowToSVG(ast, options);
-    return wrapSVGInHTML(svg, { title: options.workflowName ?? ast.name, theme: options.theme, nodeSources: buildNodeSourceMap(ast) });
-}
-/**
- * Parse TypeScript source code and render the first (or named) workflow to interactive HTML.
- */
-export function sourceToHTML(code, options = {}) {
-    const result = parser.parseFromString(code);
-    const ast = pickWorkflow(result.workflows, options);
-    const svg = workflowToSVG(ast, options);
-    return wrapSVGInHTML(svg, { title: options.workflowName ?? ast.name, theme: options.theme, nodeSources: buildNodeSourceMap(ast) });
-}
-/**
- * Parse a workflow file and render the first (or named) workflow to interactive HTML.
- */
-export function fileToHTML(filePath, options = {}) {
-    const result = parser.parse(filePath);
-    const ast = pickWorkflow(result.workflows, options);
-    const svg = workflowToSVG(ast, options);
-    return wrapSVGInHTML(svg, { title: options.workflowName ?? ast.name, theme: options.theme, nodeSources: buildNodeSourceMap(ast) });
-}
-function buildNodeSourceMap(ast) {
-    const typeMap = new Map(ast.nodeTypes.map(nt => [nt.functionName, nt]));
-    const map = {};
-    for (const inst of ast.instances) {
-        const nt = typeMap.get(inst.nodeType);
-        if (!nt)
-            continue;
-        const ports = {};
-        for (const [name, def] of Object.entries(nt.inputs ?? {})) {
-            ports[name] = { type: def.dataType, tsType: def.tsType };
-        }
-        for (const [name, def] of Object.entries(nt.outputs ?? {})) {
-            ports[name] = { type: def.dataType, tsType: def.tsType };
-        }
-        map[inst.id] = { description: nt.description, source: nt.functionText, ports };
+import {
+  buildDiagramGraph,
+  renderASCII,
+  renderASCIICompact,
+  renderText
+} from "../chunks/chunk-7AAQNGRH.js";
+import {
+  NODE_ICON_PATHS
+} from "../chunks/chunk-XAV22WD7.js";
+import {
+  getTopologicalOrder
+} from "../chunks/chunk-P2CVDGHR.js";
+import {
+  parser
+} from "../chunks/chunk-ZMGN6F3S.js";
+import "../chunks/chunk-REEYC73I.js";
+import "../chunks/chunk-4EUSHAY6.js";
+import "../chunks/chunk-4KDUEOFD.js";
+import "../chunks/chunk-DUO6H5PR.js";
+import "../chunks/chunk-VP2P3BPA.js";
+import "../chunks/chunk-B6HQ6YS5.js";
+import "../chunks/chunk-E5WN7IGO.js";
+import "../chunks/chunk-KMWCCOUJ.js";
+import "../chunks/chunk-QYPORSLO.js";
+import "../chunks/chunk-R4QGNK34.js";
+import "../chunks/chunk-SEWDMQ6Q.js";
+
+// src/diagram/labels.ts
+var GENERIC_TYPES = /* @__PURE__ */ new Set(["waitForEvent", "waitForAgent", "delay", "invokeWorkflow"]);
+var humanize = (s) => s.replace(/([a-z0-9])([A-Z])/g, "$1 $2").replace(/[_-]+/g, " ").replace(/^./, (c) => c.toUpperCase());
+function stepLabel(inst, nt) {
+  if (inst.config?.label) return inst.config.label;
+  if (nt?.label) return nt.label;
+  const fn = nt?.functionName ?? inst.nodeType;
+  return humanize(GENERIC_TYPES.has(fn) ? inst.id : fn);
+}
+
+// src/diagram/process-view.ts
+var STEP_PORTS = /* @__PURE__ */ new Set(["onSuccess", "onFailure", "execute"]);
+var firstParagraph = (text) => (text ?? "").split("\n\n")[0].replace(/\s+/g, " ").trim();
+function buildProcessModel(ast) {
+  const nodeTypes = /* @__PURE__ */ new Map();
+  for (const nt of ast.nodeTypes) {
+    nodeTypes.set(nt.name, nt);
+    nodeTypes.set(nt.functionName, nt);
+  }
+  const byId = new Map(ast.instances.map((i) => [i.id, i]));
+  const isControl = (c) => STEP_PORTS.has(c.from.port) || c.to.port === "execute";
+  const control = ast.connections.filter(isControl);
+  const data = ast.connections.filter((c) => !isControl(c));
+  const order = getTopologicalOrder(ast);
+  const stage = /* @__PURE__ */ new Map();
+  for (const id of order) {
+    const ins = control.filter((c) => c.to.node === id);
+    let s = 0;
+    for (const c of ins) s = Math.max(s, c.from.node === "Start" ? 1 : (stage.get(c.from.node) ?? 0) + 1);
+    if (ins.length === 0) {
+      const dataIns = data.filter((c) => c.to.node === id && c.from.node !== "Start");
+      s = Math.max(1, ...dataIns.map((c) => (stage.get(c.from.node) ?? 0) + 1));
+    }
+    stage.set(id, s);
+  }
+  let segment = 0;
+  const segmentOf = /* @__PURE__ */ new Map();
+  for (const id of order) {
+    segmentOf.set(id, segment);
+    if (nodeTypes.get(byId.get(id)?.nodeType ?? "")?.durableGate) segment++;
+  }
+  const describe = (inst) => {
+    const nt = nodeTypes.get(inst.nodeType);
+    const outputs = Object.keys(nt?.outputs ?? {}).filter((p) => !STEP_PORTS.has(p));
+    const kind = nt?.durableGate ? "pause" : nt?.durableEffect ? "effect" : nt?.scope || (nt?.scopes?.length ?? 0) > 0 ? "loop" : "step";
+    return {
+      id: inst.id,
+      label: stepLabel(inst, nt),
+      type: nt?.functionName ?? inst.nodeType,
+      kind,
+      gate: nt?.durableGate ?? null,
+      scope: nt?.scope ?? nt?.scopes?.[0] ?? null,
+      inScope: inst.parent?.scope ?? null,
+      pure: Boolean(nt?.expression || nt?.durablePure),
+      expression: Boolean(nt?.expression),
+      stage: stage.get(inst.id) ?? 0,
+      segment: segmentOf.get(inst.id) ?? 0,
+      reads: data.filter((c) => c.to.node === inst.id).map((c) => ({ port: c.to.port, from: c.from.node, fromPort: c.from.port })),
+      exprs: (inst.config?.portConfigs ?? []).filter((p) => p.expression).map((p) => ({ port: p.portName, expr: String(p.expression) })),
+      produces: outputs.map((port) => ({
+        port,
+        to: [...new Set(data.filter((c) => c.from.node === inst.id && c.from.port === port).map((c) => c.to.node))]
+      })),
+      children: ast.instances.filter((i) => i.parent?.id === inst.id).map(describe),
+      entered: control.filter((c) => c.to.node === inst.id).map((c) => ({ from: c.from.node, arm: c.from.port === "onFailure" ? "fail" : "ok" })),
+      successTo: control.filter((c) => c.from.node === inst.id && c.from.port === "onSuccess").map((c) => c.to.node),
+      failureTo: control.filter((c) => c.from.node === inst.id && c.from.port === "onFailure").map((c) => c.to.node),
+      gateInputs: Object.keys(nt?.inputs ?? {}).filter((p) => p !== "execute"),
+      gateOutputs: outputs,
+      description: firstParagraph(nt?.description)
+    };
+  };
+  const steps = order.map((id) => byId.get(id)).filter((inst) => Boolean(inst && !inst.parent)).map(describe);
+  return {
+    name: ast.functionName,
+    description: firstParagraph(ast.description),
+    params: Object.keys(ast.startPorts ?? {}).filter((p) => !STEP_PORTS.has(p)),
+    returns: Object.keys(ast.exitPorts ?? {}).filter((p) => !STEP_PORTS.has(p)),
+    steps,
+    startTo: control.filter((c) => c.from.node === "Start").map((c) => c.to.node),
+    exitFrom: control.filter((c) => c.to.node === "Exit").map((c) => ({ from: c.from.node, arm: c.from.port === "onFailure" ? "fail" : "ok" })),
+    segments: segment + 1
+  };
+}
+
+// src/diagram/arms.ts
+function demandDriven(step) {
+  if (step.pull) return true;
+  const wired = step.entered.length > 0 || step.successTo.length > 0 || step.failureTo.length > 0;
+  return !wired && (step.reads.length > 0 || step.produces.length > 0);
+}
+function armChain(head, gate, ctx, gateOwner, gateScope) {
+  const { byId, enteredBy, claimed, pulled } = ctx;
+  const gateStep = byId.get(gate)?.step;
+  const chain = [];
+  const seen = /* @__PURE__ */ new Set([gate]);
+  let cur = head;
+  while (cur && !seen.has(cur)) {
+    seen.add(cur);
+    const row = byId.get(cur);
+    if (!row?.step) break;
+    if (claimed.has(cur) || pulled.has(cur)) break;
+    if (row.owner !== gateOwner || (row.step.inScope ?? null) !== gateScope) break;
+    const otherArm = cur !== head && !!gateStep && [...gateStep.successTo, ...gateStep.failureTo].includes(cur);
+    const from = enteredBy.get(cur) ?? /* @__PURE__ */ new Set();
+    if (otherArm || [...from].some((f) => f !== gate && !chain.includes(f))) break;
+    chain.push(cur);
+    const next = [...row.step.successTo, ...row.step.failureTo];
+    cur = next.length === 1 ? next[0] : void 0;
+  }
+  return chain;
+}
+function orderArms(flat, exitFrom = []) {
+  const byId = new Map(flat.map((r) => [r.id, r]));
+  const enteredBy = /* @__PURE__ */ new Map();
+  const enter = (to, from) => (enteredBy.get(to) ?? enteredBy.set(to, /* @__PURE__ */ new Set()).get(to)).add(from);
+  for (const r of flat) {
+    if (!r.step) continue;
+    for (const t of [...r.step.successTo, ...r.step.failureTo]) enter(t, r.id);
+  }
+  for (const e of exitFrom) enter("Exit", e.from);
+  const pulled = new Set(flat.filter((r) => r.step && demandDriven(r.step)).map((r) => r.id));
+  const claimed = /* @__PURE__ */ new Set();
+  const arms = [];
+  const ctx = { byId, enteredBy, claimed, pulled };
+  for (const gateRow of flat) {
+    const s = gateRow.step;
+    if (!s?.failureTo.length) continue;
+    if (!s.failureTo.some((t) => !s.successTo.includes(t))) continue;
+    const gateScope = s.inScope ?? null;
+    const chains = [];
+    for (const head of s.failureTo) {
+      if (s.successTo.includes(head)) continue;
+      const chain = armChain(head, s.id, ctx, gateRow.owner, gateScope);
+      if (!chain.length) continue;
+      for (const id of chain) claimed.add(id);
+      chains.push(chain);
+    }
+    if (chains.length) arms.push({ gate: s.id, ids: chains.flat() });
+  }
+  const shared = flat.filter((r) => {
+    if (!r.step || claimed.has(r.id) || pulled.has(r.id)) return false;
+    const from = [...enteredBy.get(r.id) ?? []];
+    if (from.length <= 1 || !from.every((f) => byId.get(f)?.step?.failureTo.includes(r.id))) return false;
+    if (from.every((f) => byId.get(f)?.owner === r.id)) return false;
+    return true;
+  });
+  const forks = (a) => arms.some((b) => b !== a && a.ids.includes(b.gate));
+  let out = [...flat];
+  for (const span of arms) {
+    const rows = span.ids.map((id) => out.find((r) => r.id === id)).filter((r) => !!r);
+    if (!rows.length) continue;
+    out = out.filter((r) => !span.ids.includes(r.id));
+    const at = out.findIndex((r) => r.id === span.gate);
+    if (at < 0) continue;
+    let insert = at + 1;
+    if (forks(span)) {
+      const gate = byId.get(span.gate)?.step;
+      while (insert < out.length && gate?.successTo.includes(out[insert].id)) insert++;
+    }
+    out.splice(insert, 0, ...rows);
+  }
+  for (const r of shared) {
+    const at = out.findIndex((x) => x.id === r.id);
+    const consumers = [...enteredBy.get(r.id) ?? []];
+    const last = Math.max(...consumers.map((c) => out.findIndex((x) => x.id === c)));
+    if (at < 0 || last < 0 || last < at) continue;
+    const [row] = out.splice(at, 1);
+    out.splice(last, 0, row);
+  }
+  return { flat: out, arms };
+}
+
+// src/diagram/lanes.ts
+var TILE_LANE = 26;
+var EDGE_LANE = 11;
+var GUTTER_PAD = 12;
+function demandDriven2(step) {
+  if (!step) return false;
+  if (step.pull) return true;
+  const wired = step.entered.length > 0 || step.successTo.length > 0 || step.failureTo.length > 0;
+  return !wired && (step.reads.length > 0 || step.produces.length > 0);
+}
+function buildLanes(model) {
+  const flat = [{ id: "Start", step: null, depth: 0, owner: null }];
+  const visit = (steps, depth, owner) => {
+    for (const s of steps) {
+      flat.push({ id: s.id, step: s, depth, owner });
+      visit(s.children, depth + 1, s.id);
+    }
+  };
+  visit(model.steps, 0, null);
+  flat.push({ id: "Exit", step: null, depth: 0, owner: null });
+  const ordered = orderArms(flat, model.exitFrom);
+  flat.length = 0;
+  flat.push(...ordered.flat);
+  const byId = new Map(flat.map((r) => [r.id, r]));
+  for (const r of [...flat]) {
+    if (!demandDriven2(r.step)) continue;
+    const consumers = new Set(r.step.produces.flatMap((p) => p.to));
+    const at = flat.findIndex((x2) => x2.id === r.id);
+    const target = flat.findIndex((x2, i) => i !== at && consumers.has(x2.id));
+    if (target < 0) continue;
+    flat.splice(at, 1);
+    flat.splice(target > at ? target - 1 : target, 0, r);
+  }
+  const index = {};
+  flat.forEach((r, i) => {
+    index[r.id] = i;
+  });
+  const raw = [];
+  const seen = /* @__PURE__ */ new Set();
+  const suppressed = /* @__PURE__ */ new Set();
+  const add = (from, to, kind) => {
+    if (!(to in index) || !(from in index) || index[to] <= index[from]) return;
+    const k = `${from}>${to}`;
+    if (seen.has(k)) return;
+    seen.add(k);
+    raw.push({ from, to, kind });
+  };
+  const all = [];
+  const collect = (steps) => steps.forEach((s) => {
+    all.push(s);
+    collect(s.children);
+  });
+  collect(model.steps);
+  const onDemand = (id) => demandDriven2(byId.get(id)?.step ?? null);
+  for (const to of model.startTo) if (!onDemand(to)) add("Start", to, "ok");
+  for (const s of all) {
+    if (s.children.length) {
+      const kids = s.children;
+      add(s.id, kids[0].id, "loop");
+      const kidIds = new Set(kids.map((k) => k.id));
+      for (const k of kids) {
+        for (const t of k.successTo) if (kidIds.has(t)) add(k.id, t, "ok");
+        for (const t of k.failureTo) if (kidIds.has(t)) add(k.id, t, "fail");
+      }
+      const last = kids.filter((k) => !k.successTo.some((t) => kidIds.has(t)));
+      for (const k of last) for (const t of s.successTo) add(k.id, t, "return");
+      if (last.length) for (const t of s.successTo) suppressed.add(`${s.id}>${t}`);
+    }
+    if (onDemand(s.id)) {
+      for (const r of s.reads) add(r.from, s.id, "pull");
+      for (const c of new Set(s.produces.flatMap((p) => p.to))) add(s.id, c, "pull");
+      continue;
     }
-    // Virtual Start/Exit nodes get their port types from the workflow definition
-    const startPorts = {};
-    for (const [name, def] of Object.entries(ast.startPorts ?? {})) {
-        startPorts[name] = { type: def.dataType, tsType: def.tsType };
+    for (const t of s.successTo) if (!onDemand(t)) add(s.id, t, "ok");
+    for (const t of s.failureTo) if (!onDemand(t)) add(s.id, t, "fail");
+  }
+  for (const e of model.exitFrom) add(e.from, "Exit", e.arm === "fail" ? "fail" : "ok");
+  const kept = raw.filter((e) => !(e.kind === "ok" && suppressed.has(`${e.from}>${e.to}`)));
+  raw.length = 0;
+  raw.push(...kept);
+  const held = [];
+  const free = (not, min = 0) => {
+    let i = held.findIndex((h, idx) => h === null && idx !== not && idx >= min);
+    if (i < 0) {
+      i = Math.max(held.length, min);
+      while (held.length <= i) held.push(null);
     }
-    if (Object.keys(startPorts).length) {
-        map['Start'] = { description: ast.description, ports: startPorts };
+    return i;
+  };
+  const edgeLane = /* @__PURE__ */ new Map();
+  const rowLane = {};
+  const ownerLane = /* @__PURE__ */ new Map();
+  const outgoing = /* @__PURE__ */ new Map();
+  for (const e of raw) {
+    (outgoing.get(e.from) ?? outgoing.set(e.from, []).get(e.from)).push(e);
+  }
+  for (const r of flat) {
+    const mine = held.map((h, i) => h === r.id ? i : -1).filter((i) => i >= 0);
+    for (const i of mine) held[i] = null;
+    const converges = mine.length > 1;
+    const backToTrunk = converges && held.every((h) => h === null);
+    const lane = mine.length ? backToTrunk ? 0 : Math.min(...mine) : free();
+    rowLane[r.id] = lane;
+    if (r.step?.children.length) {
+      const mark = (steps) => steps.forEach((c) => {
+        ownerLane.set(c.id, lane);
+        mark(c.children);
+      });
+      mark(r.step.children);
     }
-    const exitPorts = {};
-    for (const [name, def] of Object.entries(ast.exitPorts ?? {})) {
-        exitPorts[name] = { type: def.dataType, tsType: def.tsType };
+    const outs = (outgoing.get(r.id) ?? []).slice().sort((a, b) => index[a.to] - index[b.to]);
+    const nextRow = flat[index[r.id] + 1]?.id;
+    const trunkish = outs.filter((e) => e.kind === "ok" || e.kind === "return" || e.kind === "pull");
+    const primary = trunkish.find((e) => e.to === nextRow) ?? trunkish[0];
+    for (const e of outs) {
+      const branches = e.kind === "loop" || e.kind === "fail";
+      const owner = e.kind === "return" ? ownerLane.get(r.id) : void 0;
+      const inBody = e.kind === "fail" && byId.get(e.to)?.owner;
+      const floor = inBody ? (ownerLane.get(e.to) ?? 0) + 1 : 0;
+      const l = owner ?? (e === primary && !branches ? lane : free(branches ? lane : void 0, floor));
+      held[l] = e.to;
+      edgeLane.set(`${e.from}>${e.to}`, l);
     }
-    if (Object.keys(exitPorts).length) {
-        map['Exit'] = { ports: exitPorts };
+  }
+  const rows = flat.map((r) => ({ ...r, lane: rowLane[r.id] }));
+  const edges = raw.map((e) => ({ ...e, fromLane: rowLane[e.from], lane: edgeLane.get(`${e.from}>${e.to}`), toLane: rowLane[e.to] }));
+  const lanes = Math.max(1, ...rows.map((r) => r.lane + 1), ...edges.map((e) => e.lane + 1));
+  const holdsTile = new Array(lanes).fill(false);
+  for (const r of rows) holdsTile[r.lane] = true;
+  const laneXs = [];
+  let x = 0;
+  for (let i = 0; i < lanes; i++) {
+    const half = holdsTile[i] ? TILE_LANE / 2 : EDGE_LANE / 2;
+    x += half;
+    laneXs.push(x);
+    x += half;
+  }
+  const scopes = [];
+  for (const r of rows) {
+    if (!r.step?.children.length) continue;
+    const groups = /* @__PURE__ */ new Map();
+    const place = (steps, scope) => steps.forEach((c) => {
+      const own = c.inScope ?? scope;
+      const at = index[c.id];
+      if (at !== void 0) (groups.get(own) ?? groups.set(own, []).get(own)).push(at);
+      place(c.children, own);
+    });
+    place(r.step.children, r.step.scope ?? null);
+    for (const [scope, gidx] of groups) {
+      if (!gidx.length) continue;
+      scopes.push({ owner: r.id, scope, first: Math.min(...gidx), last: Math.max(...gidx), depth: r.depth, lane: Math.min(...gidx.map((i) => rows[i].lane)) });
     }
-    return map;
+  }
+  const arms = [];
+  for (const a of ordered.arms) {
+    const idx = a.ids.map((id) => index[id]).filter((i) => i !== void 0);
+    if (!idx.length) continue;
+    arms.push({ gate: a.gate, first: Math.min(...idx), last: Math.max(...idx), lane: Math.min(...idx.map((i) => rows[i].lane)) });
+  }
+  return { rows, edges, scopes, arms, lanes, index, laneX: laneXs, gutter: x + GUTTER_PAD };
 }
-function pickWorkflow(workflows, options) {
-    if (workflows.length === 0) {
-        throw new Error('No workflows found in source code');
+function edgePath(e, y, x) {
+  const y0 = y(e.from), y1 = y(e.to);
+  const x0 = x(e.fromLane), xl = x(e.lane), x1 = x(e.toLane);
+  const r = Math.min(16, Math.max(6, (y1 - y0) / 4));
+  let d = `M ${x0} ${y0}`;
+  if (xl !== x0) d += ` C ${x0} ${y0 + r}, ${xl} ${y0 + r}, ${xl} ${y0 + 2 * r}`;
+  const bottom = xl !== x1 ? y1 - 2 * r : y1;
+  d += ` L ${xl} ${bottom}`;
+  if (xl !== x1) d += ` C ${xl} ${y1 - r}, ${x1} ${y1 - r}, ${x1} ${y1}`;
+  return d;
+}
+
+// src/diagram/spine.ts
+var DARK = {
+  bg: "#0e1014",
+  panel: "#14171d",
+  line2: "#313847",
+  fg: "#e7e9ee",
+  dim: "#8a90a0",
+  ok: "#3ecf8e",
+  err: "#f0636a",
+  gate: "#c79bff",
+  loop: "#5fd4d9",
+  pull: "#f2c94c",
+  effect: "#ff9f5a",
+  colors: { blue: "#6ea8fe", purple: "#b48cff", cyan: "#4fd1e0", orange: "#ff9f5a", pink: "#ff7ab6", green: "#3ecf8e", red: "#f0636a", yellow: "#f2c94c", teal: "#2fc7b0" }
+};
+var LIGHT = {
+  bg: "#f6f7f9",
+  panel: "#ffffff",
+  line2: "#cfd4dc",
+  fg: "#1a1d24",
+  dim: "#667085",
+  ok: "#3ecf8e",
+  err: "#f0636a",
+  gate: "#c79bff",
+  loop: "#5fd4d9",
+  pull: "#f2c94c",
+  effect: "#ea7a1d",
+  colors: { blue: "#2f6fed", purple: "#7c4dff", cyan: "#0891b2", orange: "#ea7a1d", pink: "#db2777", green: "#15a06a", red: "#dc2626", yellow: "#b7860b", teal: "#0d9488" }
+};
+function mix(a, b, p) {
+  const ch = (h, i) => parseInt(h.slice(1 + i * 2, 3 + i * 2), 16);
+  const out = [0, 1, 2].map((i) => Math.round(ch(a, i) * p + ch(b, i) * (1 - p)));
+  return `#${out.map((v) => v.toString(16).padStart(2, "0")).join("")}`;
+}
+var SANS = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Inter, sans-serif';
+var MONO = 'ui-monospace, "SF Mono", Menlo, Consolas, monospace';
+var KIND_ICON = {
+  // The console shows `how_to_reg` and `keyboard` here; the path set has
+  // neither, so the nearest glyphs it does have stand in.
+  approval: "person",
+  input: "edit",
+  agent: "smartToy",
+  loop: "repeat",
+  effect: "bolt",
+  pull: "download"
+};
+var esc = (s) => String(s ?? "").replace(/[&<>"']/g, (c) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[c]);
+var width = (text, size, mono = false) => text.length * size * (mono ? 0.6 : 0.55);
+var snakeToCamel = (s) => s.replace(/_([a-z0-9])/g, (_, c) => c.toUpperCase());
+var TILE = 22;
+var ROW = 40;
+var PAD = 16;
+function renderSpineSVG(ast, options = {}) {
+  const p = options.theme === "dark" ? DARK : LIGHT;
+  const model = buildProcessModel(ast);
+  const types = /* @__PURE__ */ new Map();
+  for (const nt of ast.nodeTypes) {
+    types.set(nt.name, nt);
+    types.set(nt.functionName, nt);
+  }
+  const looks = /* @__PURE__ */ new Map();
+  for (const inst of ast.instances) {
+    const nt = types.get(inst.nodeType);
+    looks.set(inst.id, {
+      color: inst.config?.color ?? nt?.visuals?.color ?? null,
+      icon: inst.config?.icon ?? nt?.visuals?.icon ?? null,
+      gate: nt?.durableGate ?? null,
+      effect: !!nt?.durableEffect,
+      expression: !!nt?.expression,
+      pull: inst.config?.pullExecution !== void 0,
+      builtin: !nt?.functionText
+    });
+  }
+  const withPull = (steps) => steps.map((s) => ({ ...s, pull: !!looks.get(s.id)?.pull, children: withPull(s.children) }));
+  const graph = buildLanes({ steps: withPull(model.steps), startTo: model.startTo, exitFrom: model.exitFrom });
+  const params = Object.keys(ast.startPorts ?? {}).filter((k) => !["execute", "onSuccess", "onFailure"].includes(k));
+  const returns = Object.keys(ast.exitPorts ?? {}).filter((k) => !["execute", "onSuccess", "onFailure"].includes(k));
+  const lines = graph.rows.map((row) => {
+    if (row.id === "Start") return { label: "Start", labelDim: true, id: params.join(", "), tags: [] };
+    if (row.id === "Exit") return { label: "Exit", labelDim: true, id: returns.join(", "), tags: [] };
+    const s = row.step;
+    const look = looks.get(s.id);
+    const tags = [];
+    const onDemand = !s.pull && !s.entered.length && !s.successTo.length && !s.failureTo.length && (s.reads.length > 0 || s.produces.length > 0);
+    if (s.pull) tags.push({ text: "pulled", color: p.pull });
+    else if (onDemand) tags.push({ text: "on demand", color: p.pull });
+    if (s.kind === "loop") tags.push({ text: s.scope ? `each ${s.scope}` : "each", color: p.loop });
+    const id = look?.builtin || s.label.toLowerCase() === s.id.toLowerCase() ? s.type : s.id;
+    const right = s.kind === "pause" ? { text: s.gate ?? "gate", color: p.gate } : void 0;
+    return { label: s.label, id, tags, right };
+  });
+  const lineWidth = (l) => width(l.label, 13) + (l.id ? 8 + width(l.id, 11.5, true) : 0) + l.tags.reduce((w, t) => w + 8 + width(t.text, 11) + 14, 0) + (l.right ? 24 + width(l.right.text, 11.5) : 0);
+  const textLeft = PAD + graph.gutter;
+  const W = Math.max(360, Math.ceil(textLeft + Math.max(...lines.map(lineWidth)) + PAD));
+  const title = options.title !== false;
+  const gates = graph.rows.filter((r) => r.step?.kind === "pause").length;
+  const top = title ? 56 : 12;
+  const rowTop = (i) => top + i * ROW;
+  const y = (id) => rowTop(graph.index[id]) + 20;
+  const x = (lane) => PAD + (graph.laneX[lane] ?? 0);
+  const kinds = new Set(graph.edges.map((e) => e.kind));
+  const legend = [];
+  if (kinds.has("fail")) legend.push({ kind: "fail", text: "on failure" });
+  if (kinds.has("loop") || kinds.has("return")) legend.push({ kind: "loop", text: "repeats" });
+  if (kinds.has("pull")) legend.push({ kind: "pull", text: "read on demand" });
+  if (gates) legend.push({ kind: "pause", text: "waits for a person or an agent" });
+  const H = rowTop(graph.rows.length) + (legend.length ? 30 : 6);
+  const stroke = {
+    ok: p.line2,
+    fail: mix(p.err, p.line2, 0.45),
+    loop: mix(p.loop, p.line2, 0.55),
+    return: mix(p.loop, p.line2, 0.55),
+    pull: mix(p.pull, p.line2, 0.55)
+  };
+  const out = [];
+  out.push(`<svg xmlns="http://www.w3.org/2000/svg" width="${W}" height="${H}" viewBox="0 0 ${W} ${H}" role="img" aria-labelledby="t" font-family='${SANS}'>`);
+  out.push(`<title id="t">${esc(ast.functionName)}: ${graph.rows.length - 2} steps${gates ? `, ${gates} pause${gates === 1 ? "" : "s"}` : ""}</title>`);
+  out.push(`<rect width="${W}" height="${H}" fill="${p.bg}"/>`);
+  if (title) {
+    const facts = [options.subtitle ?? ast.sourceFile.split(/[\\/]/).pop() ?? "", `${graph.rows.length - 2} step${graph.rows.length - 2 === 1 ? "" : "s"}`, gates ? `${gates} pause${gates === 1 ? "" : "s"}` : ""].filter(Boolean).join(", ");
+    out.push(`<text x="${PAD}" y="24" font-size="15" font-weight="600" fill="${p.fg}">${esc(ast.functionName)}</text>`);
+    out.push(`<text x="${PAD}" y="42" font-size="11.5" fill="${p.dim}">${esc(facts)}</text>`);
+  }
+  for (const sc of graph.scopes) {
+    const bx = x(sc.lane) - TILE / 2 - 8;
+    const by = rowTop(sc.first) + 3;
+    const bh = rowTop(sc.last) + ROW - 3 - by;
+    out.push(`<g class="scope" data-owner="${esc(sc.owner)}"><rect x="${bx}" y="${by}" width="${W - PAD - bx}" height="${bh}" rx="8" fill="${p.loop}" fill-opacity="${(0.07 + sc.depth * 0.03).toFixed(2)}" stroke="${p.loop}" stroke-opacity=".28"/>`);
+    const name = `${sc.owner}${sc.scope ? ` ${sc.scope}` : ""}`;
+    const nw = width(name, 10.5) + 10;
+    out.push(`<rect x="${W - PAD - 10 - nw}" y="${by - 7}" width="${nw}" height="14" rx="4" fill="${p.bg}"/>`);
+    out.push(`<text x="${W - PAD - 15}" y="${by + 3.5}" font-size="10.5" text-anchor="end" fill="${p.loop}">${esc(name)}</text></g>`);
+  }
+  for (const a of graph.arms) {
+    const col = mix(p.err, p.line2, 0.7);
+    const bx = x(a.lane) - TILE / 2 - 8;
+    const by = rowTop(a.first) + 3;
+    const bh = rowTop(a.last) + ROW - 3 - by;
+    out.push(`<g class="arm" data-gate="${esc(a.gate)}"><rect x="${bx}" y="${by}" width="${W - PAD - bx}" height="${bh}" rx="8" fill="${p.err}" fill-opacity=".06" stroke="${p.err}" stroke-opacity=".26"/>`);
+    const name = `${a.gate} on failure`;
+    const nw = width(name, 10.5) + 10;
+    out.push(`<rect x="${W - PAD - 10 - nw}" y="${by - 7}" width="${nw}" height="14" rx="4" fill="${p.bg}"/>`);
+    out.push(`<text x="${W - PAD - 15}" y="${by + 3.5}" font-size="10.5" text-anchor="end" fill="${col}">${esc(name)}</text></g>`);
+  }
+  out.push('<g class="edges" fill="none" stroke-width="2" stroke-linecap="round">');
+  for (const e of graph.edges) {
+    out.push(`<path d="${edgePath(e, y, x)}" stroke="${stroke[e.kind]}"${e.kind === "pull" ? ' stroke-dasharray="3 4"' : ""} class="edge ${e.kind}" data-from="${esc(e.from)}" data-to="${esc(e.to)}"/>`);
+  }
+  out.push("</g>");
+  graph.rows.forEach((row, i) => {
+    const l = lines[i];
+    const cx = x(row.lane), cy = rowTop(i) + 20;
+    out.push(`<g class="row${row.step ? "" : " term"}" data-id="${esc(row.id)}"><rect class="hit" x="0" y="${rowTop(i)}" width="${W}" height="${ROW}" fill="transparent"/>`);
+    if (row.id === "Start" || row.id === "Exit") {
+      out.push(`<circle cx="${cx}" cy="${cy}" r="6" fill="${p.line2}"/>`);
+    } else {
+      const s = row.step;
+      const look = looks.get(s.id);
+      const kind = s.kind === "loop" ? "loop" : look?.effect ? "effect" : look?.gate ?? (s.pull ? "pull" : null);
+      const iconName = look?.icon ?? (kind ? KIND_ICON[kind] : null);
+      const path = iconName ? NODE_ICON_PATHS[iconName] ?? NODE_ICON_PATHS[snakeToCamel(iconName)] : void 0;
+      const fallback = kind === "loop" ? p.loop : look?.gate ? p.gate : look?.effect ? p.effect : s.pull ? p.pull : p.dim;
+      const tc = look?.color && p.colors[look.color] || fallback;
+      const rx = look?.gate ? 2 : kind === "loop" ? 3 : 6;
+      const rot = kind === "loop" ? ` transform="rotate(45 ${cx} ${cy})"` : "";
+      const dash = look?.expression ? ' stroke-dasharray="3 2"' : "";
+      out.push(`<rect x="${cx - TILE / 2}" y="${cy - TILE / 2}" width="${TILE}" height="${TILE}" rx="${rx}" fill="${mix(tc, p.panel, 0.14)}" stroke="${mix(tc, p.line2, 0.45)}" stroke-width="1.5"${dash}${rot}/>`);
+      if (path) out.push(`<path d="${path}" fill="${tc}" transform="translate(${cx - 7} ${cy + 7}) scale(${14 / 960})"/>`);
+      else out.push(`<circle cx="${cx}" cy="${cy}" r="3" fill="${mix(tc, p.dim, 0.7)}"/>`);
     }
-    if (options.workflowName) {
-        const found = workflows.find(w => w.name === options.workflowName);
-        if (!found) {
-            throw new Error(`Workflow "${options.workflowName}" not found. Available: ${workflows.map(w => w.name).join(', ')}`);
-        }
-        return found;
+    let tx = textLeft;
+    const ty = cy + 4.5;
+    out.push(`<text x="${tx}" y="${ty}" font-size="13" font-weight="${l.labelDim ? 400 : 500}" fill="${l.labelDim ? p.dim : p.fg}">${esc(l.label)}</text>`);
+    tx += width(l.label, 13);
+    if (l.id) {
+      tx += 8;
+      out.push(`<text x="${tx}" y="${ty}" font-size="11.5" font-family='${MONO}' fill="${p.dim}">${esc(l.id)}</text>`);
+      tx += width(l.id, 11.5, true);
     }
-    return workflows[0];
+    for (const t of l.tags) {
+      tx += 8;
+      const w = width(t.text, 11) + 14;
+      out.push(`<rect x="${tx}" y="${cy - 9}" width="${w}" height="18" rx="9" fill="none" stroke="${mix(t.color, p.line2, 0.5)}"/>`);
+      out.push(`<text x="${tx + w / 2}" y="${cy + 3.5}" font-size="11" text-anchor="middle" fill="${t.color}">${esc(t.text)}</text>`);
+      tx += w;
+    }
+    if (l.right) out.push(`<text x="${W - PAD}" y="${ty}" font-size="11.5" text-anchor="end" fill="${l.right.color}">${esc(l.right.text)}</text>`);
+    out.push("</g>");
+  });
+  if (legend.length) {
+    let lx = PAD;
+    const ly = H - 12;
+    for (const item of legend) {
+      if (item.kind === "pause") {
+        out.push(`<rect x="${lx}" y="${ly - 6}" width="12" height="12" rx="2" fill="${mix(p.gate, p.panel, 0.14)}" stroke="${mix(p.gate, p.line2, 0.45)}" stroke-width="1.5"/>`);
+      } else {
+        out.push(`<line x1="${lx}" y1="${ly}" x2="${lx + 18}" y2="${ly}" stroke="${stroke[item.kind]}" stroke-width="2" stroke-linecap="round"${item.kind === "pull" ? ' stroke-dasharray="3 4"' : ""}/>`);
+      }
+      lx += 24;
+      out.push(`<text x="${lx}" y="${ly + 3.5}" font-size="11" fill="${p.dim}">${esc(item.text)}</text>`);
+      lx += width(item.text, 11) + 18;
+    }
+  }
+  out.push("</svg>");
+  return out.join("\n");
 }
-function pickAndRender(workflows, options) {
-    return workflowToSVG(pickWorkflow(workflows, options), options);
+
+// src/diagram/index.ts
+function workflowToSVG(ast, options = {}) {
+  return renderSpineSVG(ast, { theme: options.theme, title: options.title, subtitle: options.subtitle });
 }
-// ── ASCII / Text convenience functions ───────────────────────────────────────
-function renderByFormat(graph, format) {
-    switch (format) {
-        case 'ascii': return renderASCII(graph);
-        case 'ascii-compact': return renderASCIICompact(graph);
-        case 'text': return renderText(graph);
+function sourceToSVG(code, options = {}) {
+  const result = parser.parseFromString(code);
+  return workflowToSVG(pickWorkflow(result.workflows, options), options);
+}
+function fileToSVG(filePath, options = {}) {
+  const result = parser.parse(filePath);
+  return workflowToSVG(pickWorkflow(result.workflows, options), options);
+}
+function pickWorkflow(workflows, options) {
+  if (workflows.length === 0) {
+    throw new Error("No workflows found in source code");
+  }
+  if (options.workflowName) {
+    const found = workflows.find((w) => w.name === options.workflowName);
+    if (!found) {
+      throw new Error(`Workflow "${options.workflowName}" not found. Available: ${workflows.map((w) => w.name).join(", ")}`);
     }
+    return found;
+  }
+  return workflows[0];
+}
+function renderByFormat(graph, format) {
+  switch (format) {
+    case "ascii":
+      return renderASCII(graph);
+    case "ascii-compact":
+      return renderASCIICompact(graph);
+    case "text":
+      return renderText(graph);
+  }
 }
-export function workflowToASCII(ast, options = {}) {
-    const graph = buildDiagramGraph(ast, options);
-    return renderByFormat(graph, options.format ?? 'ascii');
+function workflowToASCII(ast, options = {}) {
+  const graph = buildDiagramGraph(ast, options);
+  return renderByFormat(graph, options.format ?? "ascii");
 }
-export function sourceToASCII(code, options = {}) {
-    const result = parser.parseFromString(code);
-    const ast = pickWorkflow(result.workflows, options);
-    const graph = buildDiagramGraph(ast, options);
-    return renderByFormat(graph, options.format ?? 'ascii');
+function sourceToASCII(code, options = {}) {
+  const result = parser.parseFromString(code);
+  const ast = pickWorkflow(result.workflows, options);
+  const graph = buildDiagramGraph(ast, options);
+  return renderByFormat(graph, options.format ?? "ascii");
 }
-export function fileToASCII(filePath, options = {}) {
-    const result = parser.parse(filePath);
-    const ast = pickWorkflow(result.workflows, options);
-    const graph = buildDiagramGraph(ast, options);
-    return renderByFormat(graph, options.format ?? 'ascii');
+function fileToASCII(filePath, options = {}) {
+  const result = parser.parse(filePath);
+  const ast = pickWorkflow(result.workflows, options);
+  const graph = buildDiagramGraph(ast, options);
+  return renderByFormat(graph, options.format ?? "ascii");
 }
-//# sourceMappingURL=index.js.map
+export {
+  buildLanes,
+  buildProcessModel,
+  edgePath,
+  fileToASCII,
+  fileToSVG,
+  renderASCII,
+  renderASCIICompact,
+  renderSpineSVG,
+  renderText,
+  sourceToASCII,
+  sourceToSVG,
+  stepLabel,
+  workflowToASCII,
+  workflowToSVG
+};