@diagrammo/dgmo 0.49.0 → 0.50.1

package/dist/{chunk-6SA7FJE4.js → chunk-7QKLIMRZ.js}

@@ -1,9 +1,12 @@
-import {
-  renderNodeCard
-} from "./chunk-AHGF2YYA.js";
 import {
   renderInlineText
 } from "./chunk-3HDBAXF5.js";
+import {
+  wrapDescriptionLines
+} from "./chunk-BMR4CIEO.js";
+import {
+  renderNodeCard
+} from "./chunk-AHGF2YYA.js";
 import {
   CARD_RADIUS,
   HEADER_HEIGHT,
@@ -11,15 +14,12 @@ import {
   NODE_STROKE_WIDTH,
   SEPARATOR_GAP
 } from "./chunk-3CIOJ5YJ.js";
-import {
-  wrapDescriptionLines
-} from "./chunk-BMR4CIEO.js";
 import {
   formatDateLabel
-} from "./chunk-ZREZOIGS.js";
+} from "./chunk-66RUL3XF.js";
 import {
   renderIntegratedLegend
-} from "./chunk-4UDKKGHH.js";
+} from "./chunk-HEVYAHLW.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
@@ -41,7 +41,7 @@ import {
 import {
   resolveActiveTagGroup,
   resolveTagColor
-} from "./chunk-HBVD67XG.js";
+} from "./chunk-FJUNPCYI.js";
 import {
   resolveColor
 } from "./chunk-TLVIHFRO.js";
@@ -987,4 +987,4 @@ export {
   focusEventLine,
   renderEventLineForExport
 };
-//# sourceMappingURL=chunk-6SA7FJE4.js.map
+//# sourceMappingURL=chunk-7QKLIMRZ.js.map

package/dist/{chunk-YTN572Q2.js → chunk-7TV5Y53Y.js}

@@ -11,7 +11,7 @@ import {
 import {
   injectDefaultTagMetadata,
   resolveTagColor
-} from "./chunk-HBVD67XG.js";
+} from "./chunk-FJUNPCYI.js";
 
 // src/mindmap/text-wrap.ts
 var H_PAD = 16;
@@ -547,4 +547,4 @@ export {
   computeNodeText,
   layoutMindmap
 };
-//# sourceMappingURL=chunk-YTN572Q2.js.map
+//# sourceMappingURL=chunk-7TV5Y53Y.js.map

package/dist/{chunk-6CLKNXVP.js → chunk-BBGDM4NQ.js}

@@ -8,7 +8,7 @@ import {
 } from "./chunk-3CIOJ5YJ.js";
 import {
   renderIntegratedLegend
-} from "./chunk-4UDKKGHH.js";
+} from "./chunk-HEVYAHLW.js";
 import {
   getMaxLegendReservedHeight
 } from "./chunk-7UEMZREK.js";
@@ -28,7 +28,7 @@ import {
   resolveActiveTagGroup,
   resolveTagColor,
   tagAttrKey
-} from "./chunk-HBVD67XG.js";
+} from "./chunk-FJUNPCYI.js";
 
 // src/sketch/renderer.ts
 import * as d3 from "d3-selection";
@@ -338,7 +338,35 @@ function renderSketch(container, parsed, layout, palette, isDark, options = {})
   const showTitle = !!parsed.title;
   const titleOffset = showTitle ? 40 : 0;
   const legendGroups = parsed.options.noLegend ? [] : tagGroups;
-  const contentWidth = layout.width + 2 * DIAGRAM_PADDING;
+  const edgeGeom = sketchEdgeGeometry(layout);
+  let minX = 0;
+  let minY = 0;
+  let maxX = layout.width;
+  let maxY = layout.height;
+  for (let i = 0; i < edgeGeom.length; i++) {
+    const g = edgeGeom[i];
+    if (!g) continue;
+    const nums = (g.d.match(/-?[\d.]+/g) ?? []).map(Number);
+    for (let k = 0; k + 1 < nums.length; k += 2) {
+      minX = Math.min(minX, nums[k]);
+      maxX = Math.max(maxX, nums[k]);
+      minY = Math.min(minY, nums[k + 1]);
+      maxY = Math.max(maxY, nums[k + 1]);
+    }
+    const label = layout.edges[i]?.label;
+    if (label) {
+      const hw = measureText(label, EDGE_LABEL_FONT_SIZE) / 2 + 6;
+      const hh = EDGE_LABEL_FONT_SIZE / 2 + 4;
+      minX = Math.min(minX, g.mid.x - hw);
+      maxX = Math.max(maxX, g.mid.x + hw);
+      minY = Math.min(minY, g.mid.y - hh);
+      maxY = Math.max(maxY, g.mid.y + hh);
+    }
+  }
+  const extraLeft = Math.max(0, -minX);
+  const extraTop = Math.max(0, -minY);
+  const boundW = maxX + extraLeft;
+  const contentWidth = boundW + 2 * DIAGRAM_PADDING;
   const width = Math.max(contentWidth, options.exportDims?.width ?? 0);
   const legendHeight = legendGroups.length > 0 ? getMaxLegendReservedHeight(
     {
@@ -348,9 +376,9 @@ function renderSketch(container, parsed, layout, palette, isDark, options = {})
     },
     width
   ) : 0;
-  const contentTop = titleOffset + legendHeight + DIAGRAM_PADDING;
+  const contentTop = titleOffset + legendHeight + DIAGRAM_PADDING + extraTop;
   const height = Math.max(
-    contentTop + layout.height + DIAGRAM_PADDING,
+    contentTop + maxY + DIAGRAM_PADDING,
     options.exportDims?.height ?? 0
   );
   d3.select(container).selectAll("*").remove();
@@ -389,44 +417,23 @@ function renderSketch(container, parsed, layout, palette, isDark, options = {})
     });
     legendG.selectAll("[data-legend-group]").classed("sk-legend-group", true);
   }
-  const contentX = DIAGRAM_PADDING + Math.max(0, (width - contentWidth) / 2);
+  const contentX = DIAGRAM_PADDING + extraLeft + Math.max(0, (width - contentWidth) / 2);
   const root = svg.append("g").attr("class", "sk-root").attr("transform", `translate(${contentX},${contentTop})`);
-  const rectById = /* @__PURE__ */ new Map();
-  for (const node of layout.nodes) {
-    rectById.set(node.id, { x: node.x, y: node.y, w: node.w, h: node.h });
-  }
-  for (const box of layout.boxes) {
-    rectById.set(box.id, { x: box.x, y: box.y, w: box.w, h: box.h });
-  }
-  const portsById = /* @__PURE__ */ new Map();
-  for (const box of layout.boxes) {
-    const kids = layout.nodes.filter((n) => n.boxLabel === box.label);
-    const ys = kids.map((k) => k.y + k.h / 2);
-    const xs = kids.map((k) => k.x + k.w / 2);
-    ys.push(box.y + box.h / 2);
-    xs.push(box.x + box.w / 2);
-    portsById.set(box.id, { ys, xs });
-  }
   const boxLayer = root.append("g").attr("class", "sk-boxes");
   for (const box of layout.boxes) {
     drawBoxFrame(boxLayer, box, colorsFor(box.metadata, true), palette);
   }
   const edgeLayer = root.append("g").attr("class", "sk-edges");
   const labelLayerData = [];
-  for (const edge of layout.edges) {
-    const source = rectById.get(edge.sourceId);
-    const target = rectById.get(edge.targetId);
-    if (!source || !target) continue;
+  for (let ei = 0; ei < layout.edges.length; ei++) {
+    const edge = layout.edges[ei];
+    const geo = edgeGeom[ei];
+    if (!geo) continue;
     const color = flowColor(edge);
     const hex = color.replace("#", "");
-    const { d, mid } = edgePath(
-      source,
-      target,
-      portsById.get(edge.sourceId),
-      portsById.get(edge.targetId)
-    );
+    const { d, mid } = geo;
     const g = edgeLayer.append("g").attr("class", "sk-edge-group").attr("data-from", edge.sourceId).attr("data-to", edge.targetId).attr("data-line-number", edge.lineNumber);
-    const path = g.append("path").attr("d", d).attr("fill", "none").attr("stroke", color).attr("stroke-width", EDGE_STROKE_WIDTH);
+    const path = g.append("path").attr("d", geo.dRender ?? d).attr("fill", "none").attr("stroke", color).attr("stroke-width", EDGE_STROKE_WIDTH);
     if (edge.dashed) path.attr("stroke-dasharray", DASH);
     if (edge.heads === "one" || edge.heads === "both") {
       path.attr("marker-end", `url(#sk-arrow-${hex})`);
@@ -442,10 +449,78 @@ function renderSketch(container, parsed, layout, palette, isDark, options = {})
         text: edge.label,
         color,
         from: edge.sourceId,
-        to: edge.targetId
+        to: edge.targetId,
+        ei,
+        cp: (d.match(/-?[\d.]+/g) ?? []).map(Number)
       });
     }
   }
+  {
+    const labelW = (t) => t.length * EDGE_LABEL_FONT_SIZE * 0.56;
+    const halfH = EDGE_LABEL_FONT_SIZE / 2 + 3;
+    const GAP = 4;
+    const shapeRects = [
+      ...layout.nodes.map((n) => ({ x: n.x, y: n.y, w: n.w, h: n.h })),
+      ...layout.boxes.map((b) => ({ x: b.x, y: b.y, w: b.w, h: b.h }))
+    ];
+    const cubicPt = (cp, t) => {
+      const u = 1 - t;
+      const a = u * u * u;
+      const b = 3 * u * u * t;
+      const c = 3 * u * t * t;
+      const dd = t * t * t;
+      return {
+        x: a * cp[0] + b * cp[2] + c * cp[4] + dd * cp[6],
+        y: a * cp[1] + b * cp[3] + c * cp[5] + dd * cp[7]
+      };
+    };
+    const allPolys = edgeGeom.map((g) => {
+      if (!g) return null;
+      const cp = (g.d.match(/-?[\d.]+/g) ?? []).map(Number);
+      if (cp.length < 8) return null;
+      const pts = [];
+      for (let s = 0; s <= 32; s++) pts.push(cubicPt(cp, s / 32));
+      return pts;
+    });
+    const covers = (cx, cy, hw, ox, oy, ohw, ohh) => Math.abs(cx - ox) < hw + ohw + GAP && Math.abs(cy - oy) < halfH + ohh + GAP;
+    const placed = [];
+    const TS = [0.5, 0.4, 0.6, 0.32, 0.68, 0.25, 0.75, 0.18, 0.82];
+    for (const l of labelLayerData) {
+      const hw = labelW(l.text) / 2 + 3;
+      let bestT = 0.5;
+      let bestScore = Infinity;
+      for (const t of TS) {
+        const p2 = cubicPt(l.cp, t);
+        let labelHits = 0;
+        for (const q of placed)
+          if (covers(p2.x, p2.y, hw, q.x, q.y, q.hw, halfH)) labelHits++;
+        let shapeHits = 0;
+        for (const r of shapeRects)
+          if (covers(p2.x, p2.y, hw, r.x + r.w / 2, r.y + r.h / 2, r.w / 2, r.h / 2))
+            shapeHits++;
+        let lineHits = 0;
+        for (let k = 0; k < allPolys.length; k++) {
+          if (k === l.ei) continue;
+          const poly = allPolys[k];
+          if (poly?.some((pt) => covers(p2.x, p2.y, hw, pt.x, pt.y, 0, 0)))
+            lineHits++;
+        }
+        if (labelHits === 0 && shapeHits === 0 && lineHits === 0) {
+          bestT = t;
+          break;
+        }
+        const score = labelHits * 10 + shapeHits * 6 + lineHits * 4 + Math.abs(t - 0.5);
+        if (score < bestScore) {
+          bestScore = score;
+          bestT = t;
+        }
+      }
+      const p = cubicPt(l.cp, bestT);
+      l.x = p.x;
+      l.y = p.y;
+      placed.push({ x: p.x, y: p.y, hw });
+    }
+  }
   const nodeLayer = root.append("g").attr("class", "sk-nodes");
   for (const node of layout.nodes) {
     let n = node;
@@ -465,9 +540,7 @@ function renderSketch(container, parsed, layout, palette, isDark, options = {})
   const labelLayer = root.append("g").attr("class", "sk-edge-labels");
   for (const l of labelLayerData) {
     const g = labelLayer.append("g").attr("class", "sk-edge-label").attr("data-from", l.from).attr("data-to", l.to);
-    const textWidth = l.text.length * EDGE_LABEL_FONT_SIZE * 0.56;
-    g.append("rect").attr("x", l.x - textWidth / 2 - 3).attr("y", l.y - EDGE_LABEL_FONT_SIZE / 2 - 3).attr("width", textWidth + 6).attr("height", EDGE_LABEL_FONT_SIZE + 6).attr("rx", 3).attr("fill", palette.bg);
-    g.append("text").attr("x", l.x).attr("y", l.y).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("font-size", EDGE_LABEL_FONT_SIZE).attr("fill", l.color).text(l.text);
+    g.append("text").attr("x", l.x).attr("y", l.y).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("font-size", EDGE_LABEL_FONT_SIZE).attr("fill", l.color).attr("stroke", palette.bg).attr("stroke-width", 3).attr("stroke-linejoin", "round").attr("paint-order", "stroke").text(l.text);
   }
   if (options.onClickItem) {
     const handler = options.onClickItem;
@@ -600,55 +673,360 @@ function drawNode(layer, node, colors, palette, isDark, tagGroups) {
     });
   }
 }
-function edgePath(source, target, sourcePorts, targetPorts) {
+function assignEdgeSides(edges, rectById) {
+  const cx = (r) => r.x + r.w / 2;
+  const cy = (r) => r.y + r.h / 2;
+  const facing = (dx, dy) => Math.abs(dx) >= Math.abs(dy) ? dx >= 0 ? "R" : "L" : dy >= 0 ? "B" : "T";
+  return edges.map((e) => {
+    const s = rectById.get(e.sourceId);
+    const t = rectById.get(e.targetId);
+    if (!s || !t) return null;
+    const dx = cx(t) - cx(s);
+    const dy = cy(t) - cy(s);
+    const xOverlap = Math.min(s.x + s.w, t.x + t.w) - Math.max(s.x, t.x);
+    const yOverlap = Math.min(s.y + s.h, t.y + t.h) - Math.max(s.y, t.y);
+    if (xOverlap >= 0 && xOverlap >= yOverlap) {
+      const below = dy >= 0;
+      return { s: below ? "B" : "T", t: below ? "T" : "B" };
+    }
+    if (yOverlap >= 0 && yOverlap >= xOverlap) {
+      const right = dx >= 0;
+      return { s: right ? "R" : "L", t: right ? "L" : "R" };
+    }
+    return { s: facing(dx, dy), t: facing(-dx, -dy) };
+  });
+}
+function edgePath(source, target, sSide, tSide, sourcePorts, targetPorts) {
   const acx = source.x + source.w / 2;
   const acy = source.y + source.h / 2;
   const bcx = target.x + target.w / 2;
   const bcy = target.y + target.h / 2;
-  const horiz = Math.abs(bcx - acx) >= Math.abs(bcy - acy);
-  let p0;
-  let p1;
-  let h0;
-  let h1;
   const clamp = (v, lo, hi) => Math.max(lo, Math.min(hi, v));
-  const CORNER_FRAC = 0.25;
-  const midClamp = (v, lo, hi) => {
-    const m = (hi - lo) * CORNER_FRAC;
-    return clamp(v, lo + m, hi - m);
-  };
   const nearest = (arr, v) => arr.reduce((a, b) => Math.abs(b - v) < Math.abs(a - v) ? b : a, arr[0]);
-  if (horiz) {
-    const sign = bcx >= acx ? 1 : -1;
-    const y0 = sourcePorts ? midClamp(nearest(sourcePorts.ys, bcy), source.y, source.y + source.h) : acy;
-    const y1 = targetPorts ? midClamp(nearest(targetPorts.ys, acy), target.y, target.y + target.h) : bcy;
-    p0 = { x: sign > 0 ? source.x + source.w : source.x, y: y0 };
-    p1 = { x: sign > 0 ? target.x : target.x + target.w, y: y1 };
-    const k = Math.max(
-      CURVE_HANDLE_MIN,
-      Math.min(CURVE_HANDLE_MAX, Math.abs(p1.x - p0.x) / 2)
-    );
-    h0 = { x: p0.x + sign * k, y: p0.y };
-    h1 = { x: p1.x - sign * k, y: p1.y };
-  } else {
-    const sign = bcy >= acy ? 1 : -1;
-    const x0 = sourcePorts ? midClamp(nearest(sourcePorts.xs, bcx), source.x, source.x + source.w) : acx;
-    const x1 = targetPorts ? midClamp(nearest(targetPorts.xs, acx), target.x, target.x + target.w) : bcx;
-    p0 = { x: x0, y: sign > 0 ? source.y + source.h : source.y };
-    p1 = { x: x1, y: sign > 0 ? target.y : target.y + target.h };
-    const k = Math.max(
-      CURVE_HANDLE_MIN,
-      Math.min(CURVE_HANDLE_MAX, Math.abs(p1.y - p0.y) / 2)
-    );
-    h0 = { x: p0.x, y: p0.y + sign * k };
-    h1 = { x: p1.x, y: p1.y - sign * k };
-  }
+  const attach = (side, rect, ports, toward) => {
+    if (side === "L" || side === "R") {
+      const x2 = side === "L" ? rect.x : rect.x + rect.w;
+      const y2 = ports ? clamp(nearest(ports.ys, toward.y), rect.y, rect.y + rect.h) : rect.y + rect.h / 2;
+      return { x: x2, y: y2 };
+    }
+    const y = side === "T" ? rect.y : rect.y + rect.h;
+    const x = ports ? clamp(nearest(ports.xs, toward.x), rect.x, rect.x + rect.w) : rect.x + rect.w / 2;
+    return { x, y };
+  };
+  const normal = (side) => side === "L" ? { x: -1, y: 0 } : side === "R" ? { x: 1, y: 0 } : side === "T" ? { x: 0, y: -1 } : { x: 0, y: 1 };
+  const p0 = attach(sSide, source, sourcePorts, { x: bcx, y: bcy });
+  const p1 = attach(tSide, target, targetPorts, { x: acx, y: acy });
+  const n0 = normal(sSide);
+  const n1 = normal(tSide);
+  const k = Math.max(
+    CURVE_HANDLE_MIN,
+    Math.min(CURVE_HANDLE_MAX, Math.hypot(p1.x - p0.x, p1.y - p0.y) / 2)
+  );
+  const h0 = { x: p0.x + n0.x * k, y: p0.y + n0.y * k };
+  const h1 = { x: p1.x + n1.x * k, y: p1.y + n1.y * k };
   return {
     d: `M ${p0.x} ${p0.y} C ${h0.x} ${h0.y}, ${h1.x} ${h1.y}, ${p1.x} ${p1.y}`,
-    // Centered ON the line (no vertical offset): the opaque label halo masks
-    // the segment behind it cleanly, so the label reads as sitting on the line
-    // rather than floating awkwardly just above it.
-    mid: { x: (p0.x + p1.x) / 2, y: (p0.y + p1.y) / 2 }
+    // Centered ON the line at its ARC midpoint (t=0.5 on the cubic), not the
+    // endpoint average: for a straight edge the two coincide, but for a curve
+    // that bulges out to route around a shape the arc midpoint sits at the
+    // bulge apex — in open space — while the endpoint average would land on the
+    // very shape the edge detoured past. The opaque halo masks the line behind.
+    mid: {
+      x: 0.125 * p0.x + 0.375 * h0.x + 0.375 * h1.x + 0.125 * p1.x,
+      y: 0.125 * p0.y + 0.375 * h0.y + 0.375 * h1.y + 0.125 * p1.y
+    },
+    p0,
+    h0,
+    h1,
+    p1
+  };
+}
+var SIDES = ["T", "B", "L", "R"];
+function cubicAt(g, t) {
+  const u = 1 - t;
+  const a = u * u * u;
+  const b = 3 * u * u * t;
+  const c = 3 * u * t * t;
+  const dd = t * t * t;
+  return {
+    x: a * g.p0.x + b * g.h0.x + c * g.h1.x + dd * g.p1.x,
+    y: a * g.p0.y + b * g.h0.y + c * g.h1.y + dd * g.p1.y
+  };
+}
+var EDGE_OBSTACLE_INSET = 6;
+var EDGE_SAMPLES = 24;
+var POLY_SAMPLES = 19;
+function polyline(g) {
+  const pts = [];
+  for (let i = 0; i <= POLY_SAMPLES; i++)
+    pts.push(cubicAt(g, i / POLY_SAMPLES));
+  return pts;
+}
+function segmentsCross(p, p2, q, q2) {
+  const o = (a, b, c) => (b.x - a.x) * (c.y - a.y) - (b.y - a.y) * (c.x - a.x);
+  const d1 = o(p, p2, q);
+  const d2 = o(p, p2, q2);
+  const d32 = o(q, q2, p);
+  const d4 = o(q, q2, p2);
+  return (d1 > 0 && d2 < 0 || d1 < 0 && d2 > 0) && (d32 > 0 && d4 < 0 || d32 < 0 && d4 > 0);
+}
+function polyCrossings(a, b) {
+  let n = 0;
+  for (let i = 0; i + 1 < a.length; i++)
+    for (let j = 0; j + 1 < b.length; j++)
+      if (segmentsCross(a[i], a[i + 1], b[j], b[j + 1])) n++;
+  return n;
+}
+function polyIntersection(a, b) {
+  for (let i = 0; i + 1 < a.length; i++) {
+    const p = a[i];
+    const p2 = a[i + 1];
+    for (let j = 0; j + 1 < b.length; j++) {
+      const q = b[j];
+      const q2 = b[j + 1];
+      if (!segmentsCross(p, p2, q, q2)) continue;
+      const rx = p2.x - p.x;
+      const ry = p2.y - p.y;
+      const sx = q2.x - q.x;
+      const sy = q2.y - q.y;
+      const denom = rx * sy - ry * sx;
+      if (denom === 0) continue;
+      const t = ((q.x - p.x) * sy - (q.y - p.y) * sx) / denom;
+      return { x: p.x + t * rx, y: p.y + t * ry };
+    }
+  }
+  return null;
+}
+var HOP_R = 7;
+function hoppedPath(g, hops) {
+  if (hops.length === 0) return null;
+  const N = 49;
+  const pts = [];
+  for (let s = 0; s <= N; s++) pts.push(cubicAt(g, s / N));
+  const onSeg = /* @__PURE__ */ new Map();
+  for (const hp of hops) {
+    let bestSeg = -1;
+    let bestD = Infinity;
+    let bestPt = null;
+    for (let k = 1; k <= N; k++) {
+      const a = pts[k - 1];
+      const b = pts[k];
+      const dx = b.x - a.x;
+      const dy = b.y - a.y;
+      const len2 = dx * dx + dy * dy || 1;
+      let f = ((hp.x - a.x) * dx + (hp.y - a.y) * dy) / len2;
+      f = Math.max(0, Math.min(1, f));
+      const px = a.x + f * dx;
+      const py = a.y + f * dy;
+      const d2 = Math.hypot(hp.x - px, hp.y - py);
+      if (d2 < bestD) {
+        bestD = d2;
+        bestSeg = k;
+        bestPt = { x: px, y: py };
+      }
+    }
+    if (bestSeg >= 3 && bestSeg <= N - 3 && bestPt && !onSeg.has(bestSeg))
+      onSeg.set(bestSeg, bestPt);
+  }
+  if (onSeg.size === 0) return null;
+  let d = `M ${pts[0].x} ${pts[0].y}`;
+  for (let k = 1; k <= N; k++) {
+    const a = pts[k - 1];
+    const b = pts[k];
+    const hp = onSeg.get(k);
+    if (hp) {
+      const segLen = Math.hypot(b.x - a.x, b.y - a.y) || 1;
+      const dir = { x: (b.x - a.x) / segLen, y: (b.y - a.y) / segLen };
+      let perp = { x: dir.y, y: -dir.x };
+      if (perp.y > 0) perp = { x: -perp.x, y: -perp.y };
+      const A = { x: hp.x - dir.x * HOP_R, y: hp.y - dir.y * HOP_R };
+      const B = { x: hp.x + dir.x * HOP_R, y: hp.y + dir.y * HOP_R };
+      const k1 = {
+        x: A.x + perp.x * HOP_R * 1.33,
+        y: A.y + perp.y * HOP_R * 1.33
+      };
+      const k2 = {
+        x: B.x + perp.x * HOP_R * 1.33,
+        y: B.y + perp.y * HOP_R * 1.33
+      };
+      d += ` L ${A.x} ${A.y} C ${k1.x} ${k1.y}, ${k2.x} ${k2.y}, ${B.x} ${B.y} L ${b.x} ${b.y}`;
+    } else {
+      d += ` L ${b.x} ${b.y}`;
+    }
+  }
+  return d;
+}
+function pathCrossings(g, obstacles) {
+  if (obstacles.length === 0) return 0;
+  let hits = 0;
+  for (let i = 1; i < EDGE_SAMPLES; i++) {
+    const p = cubicAt(g, i / EDGE_SAMPLES);
+    for (const r of obstacles) {
+      const x0 = r.x + EDGE_OBSTACLE_INSET;
+      const y0 = r.y + EDGE_OBSTACLE_INSET;
+      const x1 = r.x + r.w - EDGE_OBSTACLE_INSET;
+      const y1 = r.y + r.h - EDGE_OBSTACLE_INSET;
+      if (p.x >= x0 && p.x <= x1 && p.y >= y0 && p.y <= y1) {
+        hits++;
+        break;
+      }
+    }
+  }
+  return hits;
+}
+function sketchEdgeGeometry(layout, offsets) {
+  const off = (id) => offsets?.get(id) ?? { dx: 0, dy: 0 };
+  const rectById = /* @__PURE__ */ new Map();
+  for (const n of layout.nodes) {
+    const o = off(n.id);
+    rectById.set(n.id, { x: n.x + o.dx, y: n.y + o.dy, w: n.w, h: n.h });
+  }
+  for (const b of layout.boxes) {
+    const o = off(b.id);
+    rectById.set(b.id, { x: b.x + o.dx, y: b.y + o.dy, w: b.w, h: b.h });
+  }
+  const portsById = /* @__PURE__ */ new Map();
+  for (const box of layout.boxes) {
+    const o = off(box.id);
+    const kids = layout.nodes.filter((n) => n.boxLabel === box.label);
+    const ys = kids.map((k) => k.y + off(k.id).dy + k.h / 2);
+    const xs = kids.map((k) => k.x + off(k.id).dx + k.w / 2);
+    ys.push(box.y + o.dy + box.h / 2);
+    xs.push(box.x + o.dx + box.w / 2);
+    portsById.set(box.id, { ys, xs });
+  }
+  const sides = assignEdgeSides(layout.edges, rectById);
+  const boxIdByLabel = /* @__PURE__ */ new Map();
+  for (const b of layout.boxes) boxIdByLabel.set(b.label, b.id);
+  const boxOf = (id) => {
+    const n = layout.nodes.find((m) => m.id === id);
+    return n?.boxLabel ? boxIdByLabel.get(n.boxLabel) : void 0;
+  };
+  const obstacles = [];
+  for (const [id, rect] of rectById) obstacles.push({ id, rect });
+  const normalOf = (s) => s === "L" ? { x: -1, y: 0 } : s === "R" ? { x: 1, y: 0 } : s === "T" ? { x: 0, y: -1 } : { x: 0, y: 1 };
+  const facingCost = (from, to, side) => {
+    const dx = to.x + to.w / 2 - (from.x + from.w / 2);
+    const dy = to.y + to.h / 2 - (from.y + from.h / 2);
+    const len = Math.hypot(dx, dy) || 1;
+    const n = normalOf(side);
+    return 1 - (n.x * dx + n.y * dy) / len;
   };
+  const ctx = layout.edges.map((edge) => {
+    const source = rectById.get(edge.sourceId);
+    const target = rectById.get(edge.targetId);
+    if (!source || !target) return null;
+    const exclude = new Set(
+      [
+        edge.sourceId,
+        edge.targetId,
+        boxOf(edge.sourceId),
+        boxOf(edge.targetId)
+      ].filter((x) => x !== void 0)
+    );
+    return {
+      source,
+      target,
+      sPorts: portsById.get(edge.sourceId),
+      tPorts: portsById.get(edge.targetId),
+      obstacleRects: obstacles.filter((o) => !exclude.has(o.id)).map((o) => o.rect),
+      adjacent: /* @__PURE__ */ new Set()
+    };
+  });
+  for (let a = 0; a < layout.edges.length; a++) {
+    for (let b = a + 1; b < layout.edges.length; b++) {
+      const ea = layout.edges[a];
+      const eb = layout.edges[b];
+      if (ea.sourceId === eb.sourceId || ea.sourceId === eb.targetId || ea.targetId === eb.sourceId || ea.targetId === eb.targetId) {
+        ctx[a]?.adjacent.add(b);
+        ctx[b]?.adjacent.add(a);
+      }
+    }
+  }
+  const W_NODE = 100;
+  const W_EDGE = 8;
+  const scoreOf = (c, g, poly, self, polys2, s, t) => {
+    let edgeCross = 0;
+    for (let j = 0; j < polys2.length; j++) {
+      if (j === self || c.adjacent.has(j)) continue;
+      const pj = polys2[j];
+      if (pj) edgeCross += polyCrossings(poly, pj);
+    }
+    return pathCrossings(g, c.obstacleRects) * W_NODE + edgeCross * W_EDGE + facingCost(c.source, c.target, s) + facingCost(c.target, c.source, t);
+  };
+  const chosen = layout.edges.map(
+    (_, i) => sides[i] ?? { s: "R", t: "L" }
+  );
+  const geoms = ctx.map(
+    (c, i) => c ? edgePath(
+      c.source,
+      c.target,
+      chosen[i].s,
+      chosen[i].t,
+      c.sPorts,
+      c.tPorts
+    ) : null
+  );
+  const polys = geoms.map((g) => g ? polyline(g) : null);
+  for (let pass = 0; pass < 3; pass++) {
+    let changed = false;
+    for (let i = 0; i < ctx.length; i++) {
+      const c = ctx[i];
+      const g = geoms[i];
+      const p = polys[i];
+      if (!c || !g || !p) continue;
+      const cur = chosen[i];
+      const curScore = scoreOf(c, g, p, i, polys, cur.s, cur.t);
+      if (curScore < W_EDGE) continue;
+      let bestScore = curScore;
+      let bestG = g;
+      let bestP = p;
+      let bestSide = cur;
+      for (const s of SIDES) {
+        for (const t of SIDES) {
+          const cg = edgePath(c.source, c.target, s, t, c.sPorts, c.tPorts);
+          const cp = polyline(cg);
+          const sc = scoreOf(c, cg, cp, i, polys, s, t);
+          if (sc < bestScore) {
+            bestScore = sc;
+            bestG = cg;
+            bestP = cp;
+            bestSide = { s, t };
+          }
+        }
+      }
+      if (bestSide !== cur) {
+        chosen[i] = bestSide;
+        geoms[i] = bestG;
+        polys[i] = bestP;
+        changed = true;
+      }
+    }
+    if (!changed) break;
+  }
+  const hopsFor = layout.edges.map(() => []);
+  for (let i = 0; i < polys.length; i++) {
+    for (let j = i + 1; j < polys.length; j++) {
+      if (ctx[i]?.adjacent.has(j)) continue;
+      const a = polys[i];
+      const b = polys[j];
+      if (!a || !b) continue;
+      const pt = polyIntersection(a, b);
+      if (pt) hopsFor[j].push(pt);
+    }
+  }
+  return layout.edges.map((edge, i) => {
+    const g = geoms[i];
+    if (!g) return null;
+    const dRender = hoppedPath(g, hopsFor[i]);
+    return {
+      sourceId: edge.sourceId,
+      targetId: edge.targetId,
+      d: g.d,
+      mid: g.mid,
+      ...dRender && { dRender }
+    };
+  });
 }
 function renderSketchForExport(container, parsed, layout, palette, isDark, options = {}) {
   renderSketch(container, parsed, layout, palette, isDark, {
@@ -659,6 +1037,7 @@ function renderSketchForExport(container, parsed, layout, palette, isDark, optio
 
 export {
   renderSketch,
+  sketchEdgeGeometry,
   renderSketchForExport
 };
-//# sourceMappingURL=chunk-6CLKNXVP.js.map
+//# sourceMappingURL=chunk-BBGDM4NQ.js.map