@nac3/forge-cli 1.2.11 → 1.3.1

package/dist/chat/board_artifacts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"board_artifacts.d.ts","sourceRoot":"","sources":["../../src/chat/board_artifacts.ts"],"names":[],"mappings":"AAyBA,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CASpE;AAQD,wEAAwE;AACxE,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAIlD;AAgCD;;;GAGG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CA4G5D;AAmBD,MAAM,WAAW,aAAa;IAAG,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,KAAK,GAAG,MAAM,CAAA;CAAE;AAErE;;;;;;GAMG;AACH,wBAAsB,oBAAoB,CACxC,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAChE,OAAO,CAAC,MAAM,EAAE,CAAC,CAqCnB"}
+{"version":3,"file":"board_artifacts.d.ts","sourceRoot":"","sources":["../../src/chat/board_artifacts.ts"],"names":[],"mappings":"AAwBA,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,MAAM,CASpE;AAQD,wEAAwE;AACxE,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAIlD;AAsGD;;;GAGG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAE5D;AAqND,MAAM,WAAW,aAAa;IAAG,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,KAAK,GAAG,MAAM,CAAA;CAAE;AAErE;;;;;;GAMG;AACH,wBAAsB,oBAAoB,CACxC,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAChE,OAAO,CAAC,MAAM,EAAE,CAAC,CAqCnB"}

package/dist/chat/board_artifacts.js

@@ -19,7 +19,6 @@
  */
 import { mkdir, writeFile } from 'node:fs/promises';
 import { join, dirname } from 'node:path';
-import { layoutFlowModel, wrapLabel, FL } from './flow_layout.js';
 /* ---------- helpers ---------- */
 export function slugifyTitle(title, fallback) {
     const base = String(title || '')
@@ -42,46 +41,109 @@ export function looksLikeHtml(src) {
     return /^\s*<(?:!doctype|html|head|body|section|article|main|div|h[1-6]|p|ul|ol|table|header|figure|blockquote)\b/i.test(s)
         || /<\/(?:h[1-6]|section|article|main|div|p|ul|ol|li|table|thead|tbody|tr|td|th|header|figure|blockquote)\s*>/i.test(s);
 }
-function bpmnWrap(s, maxChars, maxLines) {
-    const words = String(s == null ? '' : s).split(/\s+/);
+const FLP = {
+    bg: '#f5f0e6', laneStroke: '#b8ad95', laneLabel: '#4f5b87', laneAlt: 'rgba(0,0,0,0.025)',
+    edge: '#1a1a1a', loop: '#8a6d3b', taskFill: '#ece6d8', taskStroke: '#4f5b87',
+    startStroke: '#6f8b5e', endStroke: '#c8472e', gwStroke: '#c8a04d', text: '#1a1a1a',
+};
+const FC = {
+    NODE_W: 150, NODE_MIN_H: 56, LINE_H: 14, FONT_SIZE: 11.5, CHARS_PER_LINE: 20, MAX_LINES: 5,
+    EVENT_R: 20, GW_HALF: 25, COL_GAP: 210, ROW_GAP: 28, LEFT_MARGIN: 26, LANE_LABEL_W: 40,
+    RIGHT_MARGIN: 40, TOP_MARGIN: 10, BOTTOM_MARGIN: 14, LOOP_EXTRA: 50,
+};
+const FICONS = { serviceTask: '⚙', userTask: '☺', sendTask: '➤', receiveTask: '✉', scriptTask: '≡' };
+function flowWrapLabel(label, maxChars = FC.CHARS_PER_LINE, maxLines = FC.MAX_LINES) {
+    const words = String(label == null ? '' : label).split(/\s+/).filter(Boolean);
     const lines = [];
     let cur = '';
     for (const w of words) {
-        if (!cur) {
+        const test = cur ? cur + ' ' + w : w;
+        if (test.length > maxChars && cur) {
+            lines.push(cur);
             cur = w;
         }
-        else if ((cur + ' ' + w).length <= maxChars) {
-            cur += ' ' + w;
-        }
         else {
-            lines.push(cur);
-            cur = w;
-            if (lines.length === maxLines - 1)
-                break;
+            cur = test;
         }
     }
-    if (cur && lines.length < maxLines)
+    if (cur)
         lines.push(cur);
-    if (lines.length === maxLines && (cur || words.length > 0)) {
-        const last = lines[maxLines - 1];
-        if (last && last.length > maxChars)
-            lines[maxLines - 1] = last.slice(0, maxChars - 1) + '…';
+    if (lines.length > maxLines) {
+        const kept = lines.slice(0, maxLines - 1);
+        const rest = lines.slice(maxLines - 1).join(' ');
+        kept.push(rest.length > maxChars ? rest.slice(0, maxChars - 1) + '.' : rest);
+        return kept;
+    }
+    return lines.length ? lines : [''];
+}
+/** DFS: edges pointing back to a node still on the recursion stack are loop-backs
+ *  (rework). They are kept out of the column/longest-path calc and routed apart. */
+function flowFindBackEdges(nodeIds, adj) {
+    const state = new Map(nodeIds.map((id) => [id, 0])); // 0 unvisited 1 in-stack 2 done
+    const back = new Set();
+    const dfs = (u) => {
+        state.set(u, 1);
+        for (const v of adj.get(u) || []) {
+            if (!state.has(v))
+                continue;
+            if (state.get(v) === 1)
+                back.add(u + '->' + v);
+            else if (state.get(v) === 0)
+                dfs(v);
+        }
+        state.set(u, 2);
+    };
+    for (const id of nodeIds)
+        if (state.get(id) === 0)
+            dfs(id);
+    return back;
+}
+/** Longest-path columns via Kahn over the forward-only DAG (col = max(pred)+1). */
+function flowLayerize(nodeIds, fwdAdj, fwdIndeg) {
+    const col = new Map(nodeIds.map((id) => [id, 0]));
+    const indeg = new Map(fwdIndeg);
+    const queue = nodeIds.filter((id) => (indeg.get(id) || 0) === 0);
+    const seen = new Set(queue);
+    let head = 0;
+    while (head < queue.length) {
+        const u = queue[head++];
+        for (const v of fwdAdj.get(u) || []) {
+            col.set(v, Math.max(col.get(v) || 0, (col.get(u) || 0) + 1));
+            indeg.set(v, (indeg.get(v) || 0) - 1);
+            if ((indeg.get(v) || 0) === 0 && !seen.has(v)) {
+                seen.add(v);
+                queue.push(v);
+            }
+        }
     }
-    return lines;
+    /* any node never dequeued (part of a pure cycle with no forward entry) keeps
+     * col 0 -- harmless; it still gets a position. */
+    return col;
 }
-function bpmnHalf(n) {
-    const type = String(n.type || 'task');
-    if (/start|^event$|end|intermediate/.test(type))
-        return 18;
-    if (/gateway|decision|fork|join|merge/.test(type))
-        return 23;
-    return 59;
+function flowNodeGeom(node) {
+    const lines = flowWrapLabel(node.label ?? node.id);
+    const t = String(node.type || 'task');
+    if (/^start/.test(t) || /^end/.test(t) || /^intermediate/.test(t) || t === 'event') {
+        const shape = /^end/.test(t) ? 'endEvent' : 'startEvent';
+        return { shape, hasIcon: false, connHalfW: FC.EVENT_R, topExtent: FC.EVENT_R + 6, bottomExtent: FC.EVENT_R + 10 + lines.length * FC.LINE_H, lines };
+    }
+    if (/^(gateway|decision|fork|join|merge)/.test(t)) {
+        return { shape: 'gateway', hasIcon: false, connHalfW: FC.GW_HALF, topExtent: FC.GW_HALF + 6, bottomExtent: FC.GW_HALF + 10 + lines.length * FC.LINE_H, lines };
+    }
+    const hasIcon = Boolean(FICONS[t]);
+    const halfH = Math.max(FC.NODE_MIN_H, lines.length * FC.LINE_H + (hasIcon ? 26 : 18)) / 2;
+    return { shape: 'task', hasIcon, connHalfW: FC.NODE_W / 2, topExtent: halfH, bottomExtent: halfH, lines };
 }
 /**
  * Render a flow model to a STANDALONE svg string (with xml prolog + intrinsic
  * width/height). Returns null when the content is not a parseable flow.
  */
 export function renderFlowSvg(content) {
+    return renderFlowSvgPorted(content);
+}
+/* Legacy simple renderer kept for reference/rollback under a flag-less name is
+ * intentionally removed; the ported layout below is the sole path. */
+function renderFlowSvgPorted(content) {
     let m;
     try {
         m = JSON.parse(content);
@@ -91,135 +153,300 @@ export function renderFlowSvg(content) {
     }
     if (!m || !Array.isArray(m.nodes) || m.nodes.length === 0)
         return null;
-    const nodes = m.nodes.filter((n) => n && n.id);
-    const flows = Array.isArray(m.flows) ? m.flows.filter((f) => f && f.from && f.to) : [];
-    const lanes = Array.isArray(m.lanes) ? m.lanes.filter((l) => l && l.id) : [];
-    if (nodes.length === 0)
+    const allNodes = m.nodes.filter((n) => n && n.id);
+    if (!allNodes.length)
         return null;
-    /* Positions + geometry come from the shared layered layout: crossing-reduced
-     * column ordering and collision-free, auto-sized lane bands (flow_layout.ts).
-     * The old inline "fixed-height bands + naive stacking" overlapped nodes when a
-     * (lane, column) cell held more than one. */
-    const { W, H, laneBands } = layoutFlowModel(nodes, flows, lanes);
-    const hasLanes = laneBands.length > 0;
-    const byId = {};
-    nodes.forEach((n) => { byId[n.id] = n; });
-    const P = { ink: '#1a1a1a', indigo: '#4f5b87', amber: '#c8a04d', tea: '#6f8b5e', vermilion: '#c8472e', line: '#b8ad95', washi: '#f5f0e6', bg2: '#ece6d8' };
-    let svg = '<?xml version="1.0" encoding="UTF-8"?>\n'
-        + '<svg viewBox="0 0 ' + Math.round(W) + ' ' + Math.round(H) + '" width="' + Math.round(W) + '" height="' + Math.round(H) + '"'
-        + ' preserveAspectRatio="xMinYMin meet" xmlns="http://www.w3.org/2000/svg">';
-    svg += '<rect x="0" y="0" width="' + Math.round(W) + '" height="' + Math.round(H) + '" fill="' + P.washi + '"/>';
-    svg += '<defs><marker id="bpmn-arrow" markerWidth="9" markerHeight="9" refX="7" refY="3" orient="auto" markerUnits="strokeWidth">'
-        + '<path d="M0,0 L7,3 L0,6 z" fill="' + P.ink + '"/></marker></defs>';
-    if (hasLanes) {
-        for (let li2 = 0; li2 < laneBands.length; li2++) {
-            const band = laneBands[li2];
-            if (!band)
-                continue;
-            const ly = band.y;
-            svg += '<rect x="' + FL.PAD + '" y="' + ly + '" width="' + (W - 2 * FL.PAD) + '" height="' + band.h + '" fill="' + (li2 % 2 ? 'rgba(0,0,0,0.025)' : 'transparent') + '" stroke="' + P.line + '" stroke-width="1"/>';
-            svg += '<text x="' + (FL.PAD + 14) + '" y="' + (ly + band.h / 2) + '" transform="rotate(-90 ' + (FL.PAD + 14) + ' ' + (ly + band.h / 2) + ')" text-anchor="middle" font-size="11" fill="' + P.indigo + '" font-weight="600">' + escXml(String(band.label)) + '</text>';
+    const flows0 = Array.isArray(m.flows) ? m.flows.filter((f) => f && f.from && f.to) : [];
+    /* prune declared-but-empty lanes; synthesize a single lane when none. */
+    const usedLaneIds = new Set();
+    for (const n of allNodes)
+        if (n.lane != null && String(n.lane))
+            usedLaneIds.add(String(n.lane));
+    let lanesArr = (Array.isArray(m.lanes) ? m.lanes.filter((l) => l && l.id) : []).filter((l) => usedLaneIds.has(l.id));
+    const hasLanes = lanesArr.length > 0;
+    if (!hasLanes)
+        lanesArr = [{ id: '__main', label: '' }];
+    const laneOrder = lanesArr.map((l) => l.id);
+    const laneSet = new Set(laneOrder);
+    const laneLabel = new Map(lanesArr.map((l) => [l.id, String(l.label ?? l.id)]));
+    const LANE_LBL_W = hasLanes ? FC.LANE_LABEL_W : 0;
+    /* every node gets a valid lane (unknown/absent -> first lane). */
+    const nodeById = new Map();
+    for (const n of allNodes) {
+        const lane = (n.lane != null && laneSet.has(String(n.lane))) ? String(n.lane) : laneOrder[0];
+        nodeById.set(n.id, { ...n, lane });
+    }
+    const nodeIds = allNodes.map((n) => n.id);
+    const flows = flows0.filter((f) => nodeById.has(f.from) && nodeById.has(f.to));
+    const adj = new Map(nodeIds.map((id) => [id, []]));
+    for (const f of flows)
+        adj.get(f.from).push(f.to);
+    const backEdges = flowFindBackEdges(nodeIds, adj);
+    const fwdAdj = new Map(nodeIds.map((id) => [id, []]));
+    const fwdIndeg = new Map(nodeIds.map((id) => [id, 0]));
+    const forwardFlows = [];
+    const loopFlows = [];
+    for (const f of flows) {
+        if (backEdges.has(f.from + '->' + f.to)) {
+            loopFlows.push(f);
+        }
+        else {
+            forwardFlows.push(f);
+            fwdAdj.get(f.from).push(f.to);
+            fwdIndeg.set(f.to, (fwdIndeg.get(f.to) || 0) + 1);
+        }
+    }
+    const col = flowLayerize(nodeIds, fwdAdj, fwdIndeg);
+    const geom = new Map(nodeIds.map((id) => [id, flowNodeGeom(nodeById.get(id))]));
+    /* bucket nodes per (lane, column). */
+    const laneBuckets = new Map(laneOrder.map((l) => [l, new Map()]));
+    for (const id of nodeIds) {
+        const n = nodeById.get(id);
+        const c = col.get(id) || 0;
+        const buckets = laneBuckets.get(n.lane);
+        if (!buckets.has(c))
+            buckets.set(c, []);
+        buckets.get(c).push(id);
+    }
+    const bucketHeight = (ids) => {
+        let h = 0;
+        ids.forEach((id, i) => { const g = geom.get(id); h += g.topExtent + g.bottomExtent; if (i < ids.length - 1)
+            h += FC.ROW_GAP; });
+        return h;
+    };
+    const laneHeight = new Map();
+    for (const lane of laneOrder) {
+        let mx = 0;
+        for (const ids of laneBuckets.get(lane).values())
+            mx = Math.max(mx, bucketHeight(ids));
+        laneHeight.set(lane, Math.max(mx, FC.NODE_MIN_H) + 2 * FC.ROW_GAP);
+    }
+    const laneTop = new Map();
+    let cursorY = FC.TOP_MARGIN;
+    for (const lane of laneOrder) {
+        laneTop.set(lane, cursorY);
+        cursorY += laneHeight.get(lane);
+    }
+    const pos = new Map();
+    for (const lane of laneOrder) {
+        const buckets = laneBuckets.get(lane);
+        const top = laneTop.get(lane);
+        const total = laneHeight.get(lane) - 2 * FC.ROW_GAP;
+        for (const [c, ids] of buckets.entries()) {
+            const bh = bucketHeight(ids);
+            const offset = (total - bh) / 2;
+            let y = top + FC.ROW_GAP + offset;
+            const cx = FC.LEFT_MARGIN + LANE_LBL_W + FC.NODE_W / 2 + c * FC.COL_GAP;
+            for (const id of ids) {
+                const g = geom.get(id);
+                pos.set(id, { cx, cy: y + g.topExtent, col: c });
+                y += g.topExtent + g.bottomExtent + FC.ROW_GAP;
+            }
         }
     }
-    /* Branch separation (Pablo 2026-09-08): several sequence flows leaving a
-     * decision gateway (or converging on a merge) shared the same elbow x, so the
-     * vertical segments and their Si/No labels overlapped. Give each sibling that
-     * shares a source (fan-out) or a target (merge) a distinct elbow x, spread
-     * around the midpoint by its index. Forward edges only (back-edges route
-     * below). */
-    const fOutN = {}, fInN = {};
-    const outSeen = {}, inSeen = {};
-    const outIdx = [], inIdx = [];
-    const isFwd = (f) => { const a = byId[f.from], b = byId[f.to]; return !!a && !!b && (b._x || 0) >= (a._x || 0); };
-    flows.forEach((f) => { if (!isFwd(f))
-        return; fOutN[f.from] = (fOutN[f.from] || 0) + 1; fInN[f.to] = (fInN[f.to] || 0) + 1; });
-    flows.forEach((f, i) => { if (!isFwd(f)) {
-        outIdx[i] = 0;
-        inIdx[i] = 0;
-        return;
-    } outIdx[i] = (outSeen[f.from] = (outSeen[f.from] ?? -1) + 1); inIdx[i] = (inSeen[f.to] = (inSeen[f.to] ?? -1) + 1); });
-    const SEPX = 16, SEPY = 11;
-    flows.forEach((f, i) => {
-        const a = byId[f.from], b = byId[f.to];
-        if (!a || !b)
-            return;
-        const ar = bpmnHalf(a), br = bpmnHalf(b);
-        const ax = a._x || 0, ay = a._y || 0, bx = b._x || 0, by = b._y || 0;
-        const forward = (bx >= ax);
-        /* Sibling separation: branches that share a source (gateway fan-out) or a
-         * target (merge) leave/arrive at DISTINCT y and turn at DISTINCT x, so they
-         * read as separate lines and only meet at the node -- no overlapping "double
-         * line" (Pablo 2026-09-08). */
-        const oN = fOutN[f.from] || 1, iN = fInN[f.to] || 1;
-        const outO = oN > 1 ? ((outIdx[i] ?? 0) - (oN - 1) / 2) : 0;
-        const inO = iN > 1 ? ((inIdx[i] ?? 0) - (iN - 1) / 2) : 0;
-        const sx = ax + (forward ? ar : -ar), tx = bx - (forward ? br : -br);
-        const sy = ay + outO * SEPY, ty = by + inO * SEPY;
-        const midx = Math.max(sx + 10, Math.min(tx - 10, (sx + tx) / 2 + outO * SEPX + inO * (SEPX * 0.6)));
-        let d;
-        if (Math.abs(sy - ty) < 2) {
-            d = 'M' + sx + ',' + sy + ' L' + tx + ',' + ty;
+    const maxCol = Math.max(0, ...nodeIds.map((id) => col.get(id) || 0));
+    const width = FC.LEFT_MARGIN + LANE_LBL_W + FC.NODE_W / 2 + maxCol * FC.COL_GAP + FC.NODE_W / 2 + FC.RIGHT_MARGIN;
+    const height = cursorY - FC.ROW_GAP + FC.BOTTOM_MARGIN + (loopFlows.length ? FC.LOOP_EXTRA : 0);
+    /* validation (non-throwing in the live path): a broken layout is logged, not
+     * hidden, but we still return the SVG (persistBoardArtifact is best-effort). */
+    const problems = [];
+    for (const id of nodeIds) {
+        const n = nodeById.get(id);
+        const p = pos.get(id);
+        const g = geom.get(id);
+        const top = laneTop.get(n.lane);
+        const laneH = laneHeight.get(n.lane);
+        if (p.cy - g.topExtent < top - 0.01 || p.cy + g.bottomExtent > top + laneH + 0.01)
+            problems.push('node ' + id + ' escapes lane ' + n.lane);
+    }
+    const nodeBox = (id) => {
+        const p = pos.get(id);
+        const g = geom.get(id);
+        const halfW = g.shape === 'task' ? FC.NODE_W / 2 : g.connHalfW;
+        return { x0: p.cx - halfW, x1: p.cx + halfW, y0: p.cy - g.topExtent, y1: p.cy + g.bottomExtent };
+    };
+    const EPS = 0.5;
+    const segmentHits = (points, exclude) => {
+        const hits = [];
+        for (let i = 0; i < points.length - 1; i++) {
+            const [x1, y1] = points[i];
+            const [x2, y2] = points[i + 1];
+            const horizontal = Math.abs(y1 - y2) < EPS;
+            for (const id of nodeIds) {
+                if (exclude.has(id))
+                    continue;
+                const box = nodeBox(id);
+                if (horizontal) {
+                    const y = y1;
+                    const xLo = Math.min(x1, x2) + EPS;
+                    const xHi = Math.max(x1, x2) - EPS;
+                    if (y > box.y0 + EPS && y < box.y1 - EPS && xHi > box.x0 && xLo < box.x1)
+                        hits.push({ segIndex: i, id, box, horizontal: true });
+                }
+                else {
+                    const x = x1;
+                    const yLo = Math.min(y1, y2) + EPS;
+                    const yHi = Math.max(y1, y2) - EPS;
+                    if (x > box.x0 + EPS && x < box.x1 - EPS && yHi > box.y0 && yLo < box.y1)
+                        hits.push({ segIndex: i, id, box, horizontal: false });
+                }
+            }
+        }
+        return hits;
+    };
+    const bumpSegment = (points, hit) => {
+        const i = hit.segIndex;
+        const [x1, y1] = points[i];
+        const [x2, y2] = points[i + 1];
+        const GAP = 14;
+        if (hit.horizontal) {
+            const above = hit.box.y0 - GAP;
+            const below = hit.box.y1 + GAP;
+            const newY = Math.abs(above - y1) <= Math.abs(below - y1) ? above : below;
+            const dir = x2 >= x1 ? 1 : -1;
+            const enterX = dir === 1 ? Math.max(x1, hit.box.x0 - GAP) : Math.min(x1, hit.box.x1 + GAP);
+            const exitX = dir === 1 ? Math.min(x2, hit.box.x1 + GAP) : Math.max(x2, hit.box.x0 - GAP);
+            return [...points.slice(0, i + 1), [enterX, y1], [enterX, newY], [exitX, newY], [exitX, y2], ...points.slice(i + 1)];
         }
-        else if (forward) {
-            d = 'M' + sx + ',' + sy + ' L' + midx + ',' + sy + ' L' + midx + ',' + ty + ' L' + tx + ',' + ty;
+        const left = hit.box.x0 - GAP;
+        const right = hit.box.x1 + GAP;
+        const newX = Math.abs(left - x1) <= Math.abs(right - x1) ? left : right;
+        const dir = y2 >= y1 ? 1 : -1;
+        const enterY = dir === 1 ? Math.max(y1, hit.box.y0 - GAP) : Math.min(y1, hit.box.y1 + GAP);
+        const exitY = dir === 1 ? Math.min(y2, hit.box.y1 + GAP) : Math.max(y2, hit.box.y0 - GAP);
+        return [...points.slice(0, i + 1), [x1, enterY], [newX, enterY], [newX, exitY], [x2, exitY], ...points.slice(i + 1)];
+    };
+    const routeAvoiding = (initial, exclude) => {
+        let points = initial;
+        for (let iter = 0; iter < 8; iter++) {
+            const hits = segmentHits(points, exclude);
+            if (!hits.length)
+                return points;
+            points = bumpSegment(points, hits[0]);
+        }
+        return points;
+    };
+    const pathFromPoints = (points) => points.map((p, i) => (i === 0 ? 'M' : 'L') + p[0].toFixed(1) + ',' + p[1].toFixed(1)).join(' ');
+    const connPoint = (id, side) => { const p = pos.get(id); const g = geom.get(id); return { x: side === 'out' ? p.cx + g.connHalfW : p.cx - g.connHalfW, y: p.cy }; };
+    const parts = [];
+    parts.push('<?xml version="1.0" encoding="UTF-8"?>');
+    parts.push('<svg viewBox="0 0 ' + width.toFixed(0) + ' ' + height.toFixed(0) + '" width="' + width.toFixed(0) + '" height="' + height.toFixed(0) + '" preserveAspectRatio="xMinYMin meet" xmlns="http://www.w3.org/2000/svg">');
+    parts.push('<rect x="0" y="0" width="' + width.toFixed(0) + '" height="' + height.toFixed(0) + '" fill="' + FLP.bg + '"/>');
+    parts.push('<defs><marker id="bpmn-arrow" markerWidth="9" markerHeight="9" refX="7" refY="3" orient="auto" markerUnits="strokeWidth"><path d="M0,0 L7,3 L0,6 z" fill="' + FLP.edge + '"/></marker>'
+        + '<marker id="bpmn-arrow-loop" markerWidth="9" markerHeight="9" refX="7" refY="3" orient="auto" markerUnits="strokeWidth"><path d="M0,0 L7,3 L0,6 z" fill="' + FLP.loop + '"/></marker></defs>');
+    if (hasLanes) {
+        laneOrder.forEach((lane, i) => {
+            const top = laneTop.get(lane);
+            const h = laneHeight.get(lane);
+            const fill = i % 2 === 1 ? FLP.laneAlt : 'transparent';
+            parts.push('<rect x="' + FC.LEFT_MARGIN + '" y="' + top.toFixed(1) + '" width="' + (width - FC.LEFT_MARGIN - FC.RIGHT_MARGIN).toFixed(1) + '" height="' + h.toFixed(1) + '" fill="' + fill + '" stroke="' + FLP.laneStroke + '" stroke-width="1"/>');
+            const midY = top + h / 2;
+            parts.push('<text x="' + (FC.LEFT_MARGIN + 14).toFixed(1) + '" y="' + midY.toFixed(1) + '" transform="rotate(-90 ' + (FC.LEFT_MARGIN + 14).toFixed(1) + ' ' + midY.toFixed(1) + ')" text-anchor="middle" font-size="11" fill="' + FLP.laneLabel + '" font-weight="600">' + escXml(laneLabel.get(lane) || lane) + '</text>');
+        });
+    }
+    const edgeChecks = [];
+    for (const f of forwardFlows) {
+        const a = connPoint(f.from, 'out');
+        const b = connPoint(f.to, 'in');
+        let points;
+        if (Math.abs(a.y - b.y) < 0.5) {
+            points = [[a.x, a.y], [b.x, b.y]];
         }
         else {
-            const down = Math.max(ay, by) + 46;
-            d = 'M' + ax + ',' + (ay + ar) + ' L' + ax + ',' + down + ' L' + bx + ',' + down + ' L' + bx + ',' + (by + br);
+            const srcColX = FC.LEFT_MARGIN + LANE_LBL_W + FC.NODE_W / 2 + (pos.get(f.from).col) * FC.COL_GAP;
+            const midX = srcColX + FC.COL_GAP / 2;
+            points = [[a.x, a.y], [midX, a.y], [midX, b.y], [b.x, b.y]];
         }
-        svg += '<path d="' + d + '" fill="none" stroke="' + P.ink + '" stroke-width="1.4" marker-end="url(#bpmn-arrow)" opacity="0.8"/>';
+        points = routeAvoiding(points, new Set([f.from, f.to]));
+        edgeChecks.push({ points, from: f.from, to: f.to });
+        parts.push('<path d="' + pathFromPoints(points) + '" fill="none" stroke="' + FLP.edge + '" stroke-width="1.4" marker-end="url(#bpmn-arrow)" opacity="0.85"/>');
         if (f.label) {
-            /* place the label on the branch's own vertical segment (distinct per
-             * sibling now) so Si/No never stack on top of each other. */
-            const lx = forward ? midx : ((ax + bx) / 2), lyy = forward ? (sy + ty) / 2 - 4 : (Math.max(ay, by) + 42);
-            svg += '<rect x="' + (lx - String(f.label).length * 3.1 - 3) + '" y="' + (lyy - 9) + '" width="' + (String(f.label).length * 6.2 + 6) + '" height="13" fill="' + P.washi + '" opacity="0.9"/>';
-            svg += '<text x="' + lx + '" y="' + (lyy + 1) + '" text-anchor="middle" font-size="10" fill="' + P.ink + '">' + escXml(String(f.label)) + '</text>';
+            const lx = (a.x + b.x) / 2;
+            const ly = Math.abs(a.y - b.y) < 0.5 ? a.y - 6 : (a.y + b.y) / 2;
+            const lw = String(f.label).length * 6.2 + 6;
+            parts.push('<rect x="' + (lx - lw / 2).toFixed(1) + '" y="' + (ly - 9.5).toFixed(1) + '" width="' + lw.toFixed(1) + '" height="13" fill="' + FLP.bg + '" opacity="0.9"/>');
+            parts.push('<text x="' + lx.toFixed(1) + '" y="' + (ly + 0.5).toFixed(1) + '" text-anchor="middle" font-size="10" fill="' + FLP.text + '">' + escXml(String(f.label)) + '</text>');
+        }
+    }
+    const laneBottom = cursorY - FC.ROW_GAP;
+    loopFlows.forEach((f, i) => {
+        const a = pos.get(f.from);
+        const ag = geom.get(f.from);
+        const b = pos.get(f.to);
+        const bg = geom.get(f.to);
+        const loopY = laneBottom + 22 + i * 14;
+        const offset = 8;
+        const goesLeft = b.col <= a.col;
+        const srcGutterX = goesLeft ? Math.max(FC.LEFT_MARGIN + LANE_LBL_W + 12, a.cx - FC.COL_GAP / 2) : a.cx + FC.COL_GAP / 2;
+        const dstGutterX = goesLeft ? b.cx + FC.COL_GAP / 2 : Math.max(FC.LEFT_MARGIN + LANE_LBL_W + 12, b.cx - FC.COL_GAP / 2);
+        const srcSideX = goesLeft ? a.cx - ag.connHalfW : a.cx + ag.connHalfW;
+        const dstSideX = goesLeft ? b.cx + bg.connHalfW : b.cx - bg.connHalfW;
+        const srcY = a.cy + offset;
+        const dstY = b.cy + offset;
+        let points = [[srcSideX, srcY], [srcGutterX, srcY], [srcGutterX, loopY], [dstGutterX, loopY], [dstGutterX, dstY], [dstSideX, dstY]];
+        points = routeAvoiding(points, new Set([f.from, f.to]));
+        edgeChecks.push({ points, from: f.from, to: f.to });
+        parts.push('<path d="' + pathFromPoints(points) + '" fill="none" stroke="' + FLP.loop + '" stroke-width="1.4" stroke-dasharray="5 3" marker-end="url(#bpmn-arrow-loop)" opacity="0.9"/>');
+        if (f.label) {
+            const lx = (srcGutterX + dstGutterX) / 2;
+            const lw = String(f.label).length * 6.2 + 6;
+            parts.push('<rect x="' + (lx - lw / 2).toFixed(1) + '" y="' + (loopY - 9.5).toFixed(1) + '" width="' + lw.toFixed(1) + '" height="13" fill="' + FLP.bg + '" opacity="0.9"/>');
+            parts.push('<text x="' + lx.toFixed(1) + '" y="' + (loopY + 0.5).toFixed(1) + '" text-anchor="middle" font-size="10" fill="' + FLP.loop + '">' + escXml(String(f.label)) + '</text>');
         }
     });
-    nodes.forEach((n) => {
-        const x = n._x || 0, y = n._y || 0, type = String(n.type || 'task');
-        /* Event shapes match by PREFIX so "sendTask" is not mis-detected as an end
-         * event (the old /end/ substring matched "sEND"Task -> red circle). */
-        const isEnd = /^end/.test(type), isStart = /^start/.test(type);
-        if (isStart || isEnd || /^intermediate/.test(type) || type === 'event') {
-            const r = 18, sw = isEnd ? 3.4 : 1.6;
-            const stroke = isStart ? P.tea : (isEnd ? P.vermilion : P.indigo);
-            svg += '<circle cx="' + x + '" cy="' + y + '" r="' + r + '" fill="' + P.washi + '" stroke="' + stroke + '" stroke-width="' + sw + '"/>';
-            if (type.indexOf('intermediate') >= 0)
-                svg += '<circle cx="' + x + '" cy="' + y + '" r="' + (r - 3.5) + '" fill="none" stroke="' + stroke + '" stroke-width="1.2"/>';
-            /* label WRAPS below the circle (no more 22-char truncation). */
-            if (n.label) {
-                const els = wrapLabel(String(n.label), FL.LABEL_WRAP_CHARS, FL.LABEL_WRAP_LINES);
-                for (let li5 = 0; li5 < els.length; li5++)
-                    svg += '<text x="' + x + '" y="' + (y + r + FL.LABEL_GAP + li5 * FL.LABEL_LH) + '" text-anchor="middle" font-size="10.5" fill="' + P.ink + '">' + escXml(els[li5] || '') + '</text>';
+    for (const id of nodeIds) {
+        const n = nodeById.get(id);
+        const p = pos.get(id);
+        const g = geom.get(id);
+        if (g.shape === 'startEvent' || g.shape === 'endEvent') {
+            const stroke = g.shape === 'startEvent' ? FLP.startStroke : FLP.endStroke;
+            const sw = g.shape === 'startEvent' ? 1.6 : 3.4;
+            parts.push('<circle cx="' + p.cx.toFixed(1) + '" cy="' + p.cy.toFixed(1) + '" r="' + FC.EVENT_R + '" fill="' + FLP.bg + '" stroke="' + stroke + '" stroke-width="' + sw + '"/>');
+            let ly = p.cy + FC.EVENT_R + 12;
+            for (const line of g.lines) {
+                parts.push('<text x="' + p.cx.toFixed(1) + '" y="' + ly.toFixed(1) + '" text-anchor="middle" font-size="10.5" fill="' + FLP.text + '">' + escXml(line) + '</text>');
+                ly += FC.LINE_H;
             }
         }
-        else if (/gateway|decision|fork|join|merge/.test(type)) {
-            const g = 23, gk = String(n.gateway || (/parallel|fork|join/.test(type) ? 'parallel' : 'exclusive'));
-            svg += '<path d="M' + x + ',' + (y - g) + ' L' + (x + g) + ',' + y + ' L' + x + ',' + (y + g) + ' L' + (x - g) + ',' + y + ' z" fill="' + P.washi + '" stroke="' + P.amber + '" stroke-width="1.8"/>';
-            const sym = gk.charAt(0) === 'p' ? '+' : (gk.charAt(0) === 'i' ? 'O' : '×');
-            svg += '<text x="' + x + '" y="' + (y + 5) + '" text-anchor="middle" font-size="16" fill="' + P.amber + '" font-weight="700">' + sym + '</text>';
-            /* label WRAPS below the diamond. */
-            if (n.label) {
-                const gls = wrapLabel(String(n.label), FL.LABEL_WRAP_CHARS, FL.LABEL_WRAP_LINES);
-                for (let li6 = 0; li6 < gls.length; li6++)
-                    svg += '<text x="' + x + '" y="' + (y + g + FL.LABEL_GAP + li6 * FL.LABEL_LH) + '" text-anchor="middle" font-size="10.5" fill="' + P.ink + '">' + escXml(gls[li6] || '') + '</text>';
+        else if (g.shape === 'gateway') {
+            const x0 = p.cx - FC.GW_HALF, x1 = p.cx + FC.GW_HALF, y0 = p.cy - FC.GW_HALF, y1 = p.cy + FC.GW_HALF;
+            parts.push('<path d="M' + p.cx.toFixed(1) + ',' + y0.toFixed(1) + ' L' + x1.toFixed(1) + ',' + p.cy.toFixed(1) + ' L' + p.cx.toFixed(1) + ',' + y1.toFixed(1) + ' L' + x0.toFixed(1) + ',' + p.cy.toFixed(1) + ' z" fill="' + FLP.bg + '" stroke="' + FLP.gwStroke + '" stroke-width="1.8"/>');
+            const mark = n.gateway === 'parallel' ? '+' : n.gateway === 'inclusive' ? 'O' : '×';
+            parts.push('<text x="' + p.cx.toFixed(1) + '" y="' + (p.cy + 5).toFixed(1) + '" text-anchor="middle" font-size="16" fill="' + FLP.gwStroke + '" font-weight="700">' + mark + '</text>');
+            let ly = p.cy + FC.GW_HALF + 15;
+            for (const line of g.lines) {
+                parts.push('<text x="' + p.cx.toFixed(1) + '" y="' + ly.toFixed(1) + '" text-anchor="middle" font-size="10.5" fill="' + FLP.text + '">' + escXml(line) + '</text>');
+                ly += FC.LINE_H;
             }
         }
         else {
-            const tw = 118, th = 54;
-            svg += '<rect x="' + (x - tw / 2) + '" y="' + (y - th / 2) + '" width="' + tw + '" height="' + th + '" rx="9" fill="' + P.bg2 + '" stroke="' + P.indigo + '" stroke-width="1.4"/>';
-            const ic = { userTask: '☺', serviceTask: '⚙', scriptTask: '▸', manualTask: '✋', sendTask: '✉', receiveTask: '✉' }[type];
-            if (ic)
-                svg += '<text x="' + (x - tw / 2 + 9) + '" y="' + (y - th / 2 + 14) + '" font-size="11" fill="' + P.indigo + '">' + ic + '</text>';
-            const ls = bpmnWrap(n.label || n.id, 17, 3);
-            const ty0 = y - (ls.length - 1) * 7;
-            for (let li3 = 0; li3 < ls.length; li3++)
-                svg += '<text x="' + x + '" y="' + (ty0 + li3 * 14 + 4) + '" text-anchor="middle" font-size="11.5" fill="' + P.ink + '">' + escXml(ls[li3] || '') + '</text>';
+            const w = FC.NODE_W;
+            const h = g.topExtent + g.bottomExtent;
+            const x = p.cx - w / 2;
+            const y = p.cy - h / 2;
+            parts.push('<rect x="' + x.toFixed(1) + '" y="' + y.toFixed(1) + '" width="' + w + '" height="' + h.toFixed(1) + '" rx="9" fill="' + FLP.taskFill + '" stroke="' + FLP.taskStroke + '" stroke-width="1.4"/>');
+            const icon = FICONS[String(n.type || '')];
+            if (icon)
+                parts.push('<text x="' + (x + 9).toFixed(1) + '" y="' + (y + 15).toFixed(1) + '" font-size="11" fill="' + FLP.taskStroke + '">' + icon + '</text>');
+            let ty = y + (icon ? 26 : 16);
+            for (const line of g.lines) {
+                parts.push('<text x="' + p.cx.toFixed(1) + '" y="' + ty.toFixed(1) + '" text-anchor="middle" font-size="' + FC.FONT_SIZE + '" fill="' + FLP.text + '">' + escXml(line) + '</text>');
+                ty += FC.LINE_H;
+            }
         }
-    });
-    svg += '</svg>\n';
-    return svg;
+    }
+    for (const { points, from, to } of edgeChecks) {
+        for (const h of segmentHits(points, new Set([from, to])))
+            problems.push('edge ' + from + '->' + to + ' crosses node ' + h.id);
+    }
+    if (problems.length) {
+        try {
+            console.warn('[flow-svg] layout issues: ' + problems.join('; '));
+        }
+        catch { /* */ }
+    }
+    parts.push('</svg>');
+    return parts.join('');
 }
 /* ---------- doc HTML wrapper ---------- */
 function htmlDocPage(title, bodyHtml) {