@diagrammo/dgmo 0.75.0 → 0.76.0

package/dist/{chunk-2NRIGEHZ.js → chunk-46KVXDUJ.js}

@@ -942,6 +942,7 @@ function stripNodeDecorations(name) {
 }
 function extractSymbols(docText) {
   const entities = [];
+  const seen = /* @__PURE__ */ new Set();
   let inMetadata = true;
   let inTagGroup = false;
   for (const rawLine of docText.split("\n")) {
@@ -976,7 +977,10 @@ function extractSymbols(docText) {
       const m = COMPONENT_RE.exec(line);
       if (m) {
         const name = stripNodeDecorations((m[1] ?? m[2] ?? "").trim());
-        if (name && !entities.includes(name)) entities.push(name);
+        if (name && !seen.has(name)) {
+          seen.add(name);
+          entities.push(name);
+        }
       }
     } else {
       if (inTagGroup) continue;
@@ -991,7 +995,10 @@ function extractSymbols(docText) {
       const m = COMPONENT_RE.exec(line);
       if (m) {
         const name = stripNodeDecorations((m[1] ?? m[2] ?? "").trim());
-        if (name && !entities.includes(name)) entities.push(name);
+        if (name && !seen.has(name)) {
+          seen.add(name);
+          entities.push(name);
+        }
       }
     }
   }
@@ -1004,4 +1011,4 @@ export {
   parseInfra,
   extractSymbols
 };
-//# sourceMappingURL=chunk-2NRIGEHZ.js.map
+//# sourceMappingURL=chunk-46KVXDUJ.js.map

package/dist/{chunk-M3IVOGZE.js → chunk-4CRLM3IT.js}

@@ -45,7 +45,7 @@ import {
   parseVenn,
   parseVisualization,
   parseWordcloud
-} from "./chunk-R5JPMW2F.js";
+} from "./chunk-FTTB64OJ.js";
 import {
   resolveActiveTagGroup,
   tagAttrKey
@@ -1947,7 +1947,7 @@ function resolveArcChordOverride(content, detectedType, palette) {
 }
 async function renderForExport(content, theme, palette, viewState, options) {
   const exportMode = options?.exportMode ?? false;
-  const { parseDgmoChartType } = await import("./dgmo-router-KYNLRE7S.js");
+  const { parseDgmoChartType } = await import("./dgmo-router-A3LIHT6H.js");
   const detectedTypeRaw = parseDgmoChartType(content);
   const override = resolveArcChordOverride(content, detectedTypeRaw, palette);
   const renderContent = override?.content ?? content;
@@ -2187,9 +2187,9 @@ async function exportKanban(ctx) {
 }
 async function exportClass(ctx) {
   const { content, theme, palette, exportMode } = ctx;
-  const { parseClassDiagram } = await import("./parser-JYIZEKAS.js");
+  const { parseClassDiagram } = await import("./parser-ZYAFHXKQ.js");
   const { layoutClassDiagram } = await import("./layout-ROORJQ4X.js");
-  const { renderClassDiagram } = await import("./renderer-A2YWSBPY.js");
+  const { renderClassDiagram } = await import("./renderer-F6WSR7UM.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const classParsed = parseClassDiagram(content, effectivePalette);
   if (classParsed.error || classParsed.classes.length === 0) return "";
@@ -2248,13 +2248,13 @@ async function exportEr(ctx) {
 }
 async function exportSketch(ctx) {
   const { content, theme, viewState, exportMode } = ctx;
-  const { parseSketch } = await import("./parser-LUOINP6H.js");
+  const { parseSketch } = await import("./parser-QYAIFXLP.js");
   const effectivePalette = await resolveExportPalette(theme, ctx.palette);
   const parsed = parseSketch(content, effectivePalette);
   if (parsed.error || parsed.nodes.length === 0 && parsed.boxes.length === 0) {
     return "";
   }
-  const { layoutSketch } = await import("./layout-DAYQ46PS.js");
+  const { layoutSketch } = await import("./layout-LAS67TK3.js");
   const { renderSketchForExport } = await import("./renderer-DKW273R7.js");
   const collapsedBoxes = viewState?.cg ? new Set(viewState.cg) : void 0;
   const skLayout = layoutSketch(parsed, {
@@ -2506,9 +2506,9 @@ async function exportC4(ctx) {
 }
 async function exportFlowchart(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseFlowchart } = await import("./flowchart-parser-LY5GGQL2.js");
-  const { layoutGraph } = await import("./layout-UJ62RQQ3.js");
-  const { renderFlowchart } = await import("./flowchart-renderer-RIJ5FZKO.js");
+  const { parseFlowchart } = await import("./flowchart-parser-NVBP3C5D.js");
+  const { layoutGraph } = await import("./layout-2OJ25STS.js");
+  const { renderFlowchart } = await import("./flowchart-renderer-QYGQ64BM.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const fcParsed = parseFlowchart(content, effectivePalette);
   if (fcParsed.error || fcParsed.nodes.length === 0) return "";
@@ -2527,10 +2527,10 @@ async function exportFlowchart(ctx) {
 }
 async function exportInfra(ctx) {
   const { content, theme, palette, viewState } = ctx;
-  const { parseInfra } = await import("./parser-L7RXUKYN.js");
+  const { parseInfra } = await import("./parser-WVE6SKB7.js");
   const { computeInfra } = await import("./compute-JAP5E2E4.js");
   const { layoutInfra } = await import("./layout-4LNMXLVK.js");
-  const { renderInfra, computeInfraLegendGroups } = await import("./renderer-WDSBFDQ2.js");
+  const { renderInfra, computeInfraLegendGroups } = await import("./renderer-E6NHTVN6.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const infraParsed = parseInfra(content);
   if (infraParsed.error || infraParsed.nodes.length === 0) return "";
@@ -2667,8 +2667,8 @@ async function exportGantt(ctx) {
 async function exportState(ctx) {
   const { content, theme, palette, viewState } = ctx;
   const { parseState } = await import("./state-parser-TPA67IXM.js");
-  const { layoutGraph } = await import("./layout-UJ62RQQ3.js");
-  const { renderState } = await import("./state-renderer-454ADT7E.js");
+  const { layoutGraph } = await import("./layout-2OJ25STS.js");
+  const { renderState } = await import("./state-renderer-UIE3AQM6.js");
   const { collapseStateGroups } = await import("./state-collapse-HCGD6IVJ.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const stateParsed = parseState(content, effectivePalette);
@@ -2769,8 +2769,8 @@ async function exportMap(ctx) {
   const { content, theme, palette, options } = ctx;
   const { parseMap } = await import("./parser-GCVSRQPY.js");
   const { resolveMap } = await import("./resolver-H5E6V7LJ.js");
-  const { renderMapForExport } = await import("./renderer-73QHYZ2Q.js");
-  const { mapExportDimensions } = await import("./dimensions-NLQ64ED5.js");
+  const { renderMapForExport } = await import("./renderer-LE3ZKHNS.js");
+  const { mapExportDimensions } = await import("./dimensions-7NYBSZRJ.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const mapParsed = parseMap(content, effectivePalette);
   const { data: mapData, reason } = await resolveMapDataSource(
@@ -2864,7 +2864,7 @@ async function exportTreemap(ctx) {
 async function exportLiveLink(ctx) {
   const { content, theme, palette } = ctx;
   const { parseLiveLink } = await import("./parser-WQNT7T2P.js");
-  const { renderLiveLinkCard } = await import("./renderer-UYYBJ7OB.js");
+  const { renderLiveLinkCard } = await import("./renderer-IH45QV6Z.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   return renderLiveLinkCard(parseLiveLink(content), effectivePalette, theme);
 }
@@ -3340,7 +3340,9 @@ var HOVER_SPECS = {
     hoverAttr: "data-activity-id",
     edgeSelector: ".pert-edge",
     fromAttr: "data-source",
-    toAttr: "data-target"
+    toAttr: "data-target",
+    legend: true,
+    emphasis: "dim"
   },
   // ── CROSS-FREE tag-group charts — active group discovered at scan time ──
   // The mark carries `data-tag-<slug>` for the ONE active tag group; the
@@ -3389,7 +3391,9 @@ var HOVER_SPECS = {
     hoverAttr: "data-node-id",
     edgeSelector: ".st-edge-group",
     fromAttr: "data-source",
-    toAttr: "data-target"
+    toAttr: "data-target",
+    legend: true,
+    emphasis: "dim"
   },
   "boxes-and-lines": {
     markSelector: ".bl-node",
@@ -3451,7 +3455,9 @@ var HOVER_SPECS = {
     hoverAttr: "data-node-id",
     edgeSelector: ".er-edge-group",
     fromAttr: "data-source",
-    toAttr: "data-target"
+    toAttr: "data-target",
+    legend: true,
+    emphasis: "dim"
   },
   org: {
     markSelector: ".org-node",
@@ -3806,4 +3812,4 @@ export {
   renderForExport,
   render
 };
-//# sourceMappingURL=chunk-M3IVOGZE.js.map
+//# sourceMappingURL=chunk-4CRLM3IT.js.map

package/dist/chunk-7IATMZSA.js

@@ -0,0 +1,72 @@
+// src/utils/fit-canvas.ts
+function fitDiagramToCanvas(p) {
+  const scaleX = (p.width - p.padding * 2) / p.diagramW;
+  let scale;
+  let canvasHeight;
+  if (p.exportMode) {
+    scale = Math.min(p.maxScale, scaleX);
+    canvasHeight = p.titleHeight + p.diagramH * scale + p.padding * 2;
+  } else {
+    const availH = p.height - p.titleHeight;
+    const scaleY = (availH - p.padding * 2) / p.diagramH;
+    scale = Math.min(p.maxScale, scaleX, scaleY);
+    canvasHeight = p.height;
+  }
+  const scaledW = p.diagramW * scale;
+  return {
+    scale,
+    offsetX: (p.width - scaledW) / 2,
+    offsetY: p.titleHeight + p.padding,
+    canvasHeight
+  };
+}
+
+// src/graph/edge-spline.ts
+import * as d3Shape from "d3-shape";
+var lineGenerator = d3Shape.line().x((d) => d.x).y((d) => d.y).curve(d3Shape.curveBasis);
+function edgeSplinePath(points) {
+  return lineGenerator(points);
+}
+function selfLoopArcPath(points) {
+  if (points.length < 3) return null;
+  const p0 = points[0];
+  const p3 = points[points.length - 1];
+  const chordX = p3.x - p0.x;
+  const chordY = p3.y - p0.y;
+  const chordLen = Math.hypot(chordX, chordY);
+  if (chordLen === 0) return null;
+  let apex = points[Math.floor(points.length / 2)];
+  let farthest = -1;
+  for (let i = 1; i < points.length - 1; i++) {
+    const pt = points[i];
+    const away = Math.abs((pt.x - p0.x) * chordY - (pt.y - p0.y) * chordX) / chordLen;
+    if (away > farthest) {
+      farthest = away;
+      apex = pt;
+    }
+  }
+  let ux = apex.x - (p0.x + p3.x) / 2;
+  let uy = apex.y - (p0.y + p3.y) / 2;
+  const uLen = Math.hypot(ux, uy);
+  if (uLen === 0) return null;
+  ux /= uLen;
+  uy /= uLen;
+  const a1 = points[1];
+  const a2 = points[points.length - 2];
+  const needX = (8 * apex.x - p0.x - p3.x) / 3;
+  const needY = (8 * apex.y - p0.y - p3.y) / 3;
+  const t = Math.abs(ux) >= Math.abs(uy) ? (needX - (a1.x + a2.x)) / (2 * ux) : (needY - (a1.y + a2.y)) / (2 * uy);
+  if (!Number.isFinite(t)) return null;
+  const c1x = a1.x + ux * t;
+  const c1y = a1.y + uy * t;
+  const c2x = a2.x + ux * t;
+  const c2y = a2.y + uy * t;
+  return `M${p0.x},${p0.y}C${c1x},${c1y},${c2x},${c2y},${p3.x},${p3.y}`;
+}
+
+export {
+  fitDiagramToCanvas,
+  edgeSplinePath,
+  selfLoopArcPath
+};
+//# sourceMappingURL=chunk-7IATMZSA.js.map

package/dist/{chunk-6DYZ2JM6.js → chunk-BZQCAZZZ.js}

@@ -1,6 +1,6 @@
 import {
   SKETCH_DIAGNOSTIC_CODES
-} from "./chunk-RT7ACF77.js";
+} from "./chunk-EGY3TS62.js";
 import {
   makeDgmoError
 } from "./chunk-5SI6T5A5.js";
@@ -94,15 +94,85 @@ function resolveAutoFlags(f = {}) {
 function unitRect(c, r) {
   return { c, r, w: SKETCH_SEP, h: SKETCH_SEP };
 }
+var childBoxAt = /* @__PURE__ */ new Map();
+function nearestFreeRect(base, occupied) {
+  if (!occupied.hits(base)) return { c: base.c, r: base.r };
+  for (let d = 1; d <= 200; d++) {
+    const candidates = [];
+    for (let dc = -d; dc <= d; dc++) {
+      const dr = d - Math.abs(dc);
+      candidates.push({ c: base.c + dc, r: base.r + dr });
+      if (dr !== 0) candidates.push({ c: base.c + dc, r: base.r - dr });
+    }
+    candidates.sort((a, b) => {
+      const costA = (a.r < base.r ? 2 : 0) + (a.c < base.c ? 1 : 0);
+      const costB = (b.r < base.r ? 2 : 0) + (b.c < base.c ? 1 : 0);
+      return costA - costB || a.r - b.r || a.c - b.c;
+    });
+    for (const cand of candidates) {
+      if (!occupied.hits({ ...base, c: cand.c, r: cand.r })) return cand;
+    }
+  }
+  return { c: base.c, r: base.r };
+}
 function rectsOverlap(a, b) {
   return a.c < b.c + b.w && b.c < a.c + a.w && a.r < b.r + b.h && b.r < a.r + a.h;
 }
-function collidesAny(rect, occupied) {
-  for (const o of occupied) if (rectsOverlap(rect, o)) return true;
-  return false;
+var CELL = SKETCH_SEP;
+var OVERSIZED_CELLS = 64;
+function cellRange(rect) {
+  return [
+    Math.floor(rect.c / CELL),
+    Math.floor(rect.r / CELL),
+    Math.floor((rect.c + rect.w) / CELL),
+    Math.floor((rect.r + rect.h) / CELL)
+  ];
+}
+function cellSpan(range) {
+  return (range[2] - range[0] + 1) * (range[3] - range[1] + 1);
 }
+var Occupancy = class {
+  grid = /* @__PURE__ */ new Map();
+  oversized = [];
+  /** Every rect, in insertion order — the extent and flow-origin maths want it. */
+  rects = [];
+  add(rect) {
+    this.rects.push(rect);
+    const range = cellRange(rect);
+    if (cellSpan(range) > OVERSIZED_CELLS) {
+      this.oversized.push(rect);
+      return;
+    }
+    const [c0, r0, c1, r1] = range;
+    for (let c = c0; c <= c1; c++) {
+      for (let r = r0; r <= r1; r++) {
+        const key = `${c},${r}`;
+        const bucket = this.grid.get(key);
+        if (bucket) bucket.push(rect);
+        else this.grid.set(key, [rect]);
+      }
+    }
+  }
+  hits(rect) {
+    for (const o of this.oversized) if (rectsOverlap(rect, o)) return true;
+    const range = cellRange(rect);
+    if (cellSpan(range) > OVERSIZED_CELLS) {
+      for (const o of this.rects) if (rectsOverlap(rect, o)) return true;
+      return false;
+    }
+    const [c0, r0, c1, r1] = range;
+    for (let c = c0; c <= c1; c++) {
+      for (let r = r0; r <= r1; r++) {
+        const bucket = this.grid.get(`${c},${r}`);
+        if (!bucket) continue;
+        for (const o of bucket) if (rectsOverlap(rect, o)) return true;
+      }
+    }
+    return false;
+  }
+};
 function nearestFree(base, occupied) {
-  if (!collidesAny(base, occupied)) return { c: base.c, r: base.r };
+  if (!occupied.hits(base)) return { c: base.c, r: base.r };
   for (let d = 1; d <= 200; d++) {
     const candidates = [];
     for (let dc = -d; dc <= d; dc++) {
@@ -116,17 +186,28 @@ function nearestFree(base, occupied) {
       return costA - costB || a.r - b.r || a.c - b.c;
     });
     for (const cand of candidates) {
-      if (!collidesAny({ ...base, c: cand.c, r: cand.r }, occupied)) {
+      if (!occupied.hits({ ...base, c: cand.c, r: cand.r })) {
         return cand;
       }
     }
   }
   return { c: base.c, r: base.r };
 }
-function layoutChildren(box, nodesById, warn, flags) {
-  const occupied = [];
+function layoutChildren(box, nodesById, warn, flags, childBoxRects = /* @__PURE__ */ new Map()) {
+  const occupied = new Occupancy();
   const children = [];
+  const localBoxes = [];
   const pending = [];
+  for (const boxId of box.childBoxes) {
+    const rect = childBoxRects.get(boxId);
+    if (!rect) continue;
+    const at = childBoxAt.get(boxId) ?? null;
+    const base = at ?? { c: 0, r: 0 };
+    const want = { ...rect, c: base.c, r: base.r };
+    const spot = flags.resolveOverlap ? nearestFreeRect(want, occupied) : { c: want.c, r: want.r };
+    occupied.add({ ...rect, c: spot.c, r: spot.r });
+    localBoxes.push({ boxId, c: spot.c, r: spot.r, rect });
+  }
   for (const id of box.children) {
     const node = nodesById.get(id);
     if (!node) continue;
@@ -139,25 +220,25 @@ function layoutChildren(box, nodesById, warn, flags) {
     if (spot.c !== node.at.c || spot.r !== node.at.r) {
       warn(node.lineNumber, node.label);
     }
-    occupied.push(unitRect(spot.c, spot.r));
+    occupied.add(unitRect(spot.c, spot.r));
     children.push({ node, c: spot.c, r: spot.r });
   }
   if (!flags.flowPlaceUnpositioned) {
     for (const node of pending) children.push({ node, c: 0, r: 0 });
     pending.length = 0;
   }
-  let flowRow = occupied.length > 0 ? Math.max(...occupied.map((o) => o.r)) + SKETCH_SEP : 0;
+  let flowRow = occupied.rects.length > 0 ? Math.max(...occupied.rects.map((o) => o.r)) + SKETCH_SEP : 0;
   let flowCol = 0;
   const wrapAt = Math.max(
     SKETCH_SEP * 3,
-    occupied.length > 0 ? Math.max(...occupied.map((o) => o.c)) + SKETCH_SEP : SKETCH_SEP * 3
+    occupied.rects.length > 0 ? Math.max(...occupied.rects.map((o) => o.c)) + SKETCH_SEP : SKETCH_SEP * 3
   );
   for (const node of pending) {
     let placed = false;
     while (!placed) {
       const rect = unitRect(flowCol, flowRow);
-      if (!collidesAny(rect, occupied)) {
-        occupied.push(rect);
+      if (!occupied.hits(rect)) {
+        occupied.add(rect);
         children.push({ node, c: flowCol, r: flowRow });
         placed = true;
       }
@@ -169,16 +250,16 @@ function layoutChildren(box, nodesById, warn, flags) {
     }
   }
   let extent;
-  if (occupied.length === 0) {
+  if (occupied.rects.length === 0) {
     extent = { c: 0, r: 0, w: SKETCH_SEP, h: SKETCH_SEP };
   } else {
-    const cMin = Math.min(...occupied.map((o) => o.c));
-    const rMin = Math.min(...occupied.map((o) => o.r));
-    const cMax = Math.max(...occupied.map((o) => o.c + o.w));
-    const rMax = Math.max(...occupied.map((o) => o.r + o.h));
+    const cMin = Math.min(...occupied.rects.map((o) => o.c));
+    const rMin = Math.min(...occupied.rects.map((o) => o.r));
+    const cMax = Math.max(...occupied.rects.map((o) => o.c + o.w));
+    const rMax = Math.max(...occupied.rects.map((o) => o.r + o.h));
     extent = { c: cMin, r: rMin, w: cMax - cMin, h: rMax - rMin };
   }
-  return { children, extent };
+  return { children, boxes: localBoxes, extent };
 }
 function layoutSketch(parsed, options = {}) {
   const diagnostics = [];
@@ -200,11 +281,41 @@ function layoutSketch(parsed, options = {}) {
   const bandHs = SKETCH_GEOMETRY.bandPx / SKETCH_HALF_SLOT_Y;
   const boxLocal = /* @__PURE__ */ new Map();
   const inExpandedBox = /* @__PURE__ */ new Set();
+  const boxById = new Map(collapsed.boxes.map((b) => [b.id, b]));
+  const nestedBoxIds = new Set(
+    collapsed.boxes.filter((b) => b.parentBoxId !== null).map((b) => b.id)
+  );
+  childBoxAt.clear();
   for (const box of collapsed.boxes) {
+    if (!nestedBoxIds.has(box.id)) continue;
+    childBoxAt.set(box.id, box.at);
     const local = layoutChildren(box, nodesById, overlapWarn, flags);
     boxLocal.set(box.id, local);
     for (const child of local.children) inExpandedBox.add(child.node.id);
   }
+  const childBoxRects = /* @__PURE__ */ new Map();
+  for (const box of collapsed.boxes) {
+    if (!nestedBoxIds.has(box.id)) continue;
+    const local = boxLocal.get(box.id);
+    childBoxRects.set(box.id, {
+      c: 0,
+      r: 0,
+      w: local.extent.w + 2 * padHsX,
+      h: local.extent.h + bandHs + padHsY
+    });
+  }
+  for (const box of collapsed.boxes) {
+    if (nestedBoxIds.has(box.id)) continue;
+    const local = layoutChildren(
+      box,
+      nodesById,
+      overlapWarn,
+      flags,
+      childBoxRects
+    );
+    boxLocal.set(box.id, local);
+    for (const child of local.children) inExpandedBox.add(child.node.id);
+  }
   const allNodesById = new Map(parsed.nodes.map((n) => [n.id, n]));
   const noWarn = () => {
   };
@@ -242,6 +353,7 @@ function layoutSketch(parsed, options = {}) {
     rootUnits.push({ kind: "virtual", box });
   }
   for (const box of collapsed.boxes) {
+    if (nestedBoxIds.has(box.id)) continue;
     rootUnits.push({ kind: "box", box });
   }
   const lineOf = (u) => u.kind === "shape" ? u.node.lineNumber : u.box.lineNumber;
@@ -274,7 +386,7 @@ function layoutSketch(parsed, options = {}) {
     }
     return unitRect(c, r);
   };
-  const occupied = [];
+  const occupied = new Occupancy();
   const placedAt = /* @__PURE__ */ new Map();
   const pending = [];
   for (const unit of rootUnits) {
@@ -285,7 +397,7 @@ function layoutSketch(parsed, options = {}) {
     }
     const base = rectFor(unit, at.c, at.r);
     let spot = { c: at.c, r: at.r };
-    if (flags.resolveOverlap && unit.kind === "shape" && collidesAny(base, occupied)) {
+    if (flags.resolveOverlap && unit.kind === "shape" && occupied.hits(base)) {
       const freed = nearestFree(base, occupied);
       spot = {
         c: at.c + (freed.c - base.c),
@@ -293,28 +405,28 @@ function layoutSketch(parsed, options = {}) {
       };
       overlapWarn(unit.node.lineNumber, unit.node.label);
     }
-    occupied.push(rectFor(unit, spot.c, spot.r));
+    occupied.add(rectFor(unit, spot.c, spot.r));
     placedAt.set(unit, spot);
   }
   if (!flags.flowPlaceUnpositioned) {
     for (const unit of pending) {
-      occupied.push(rectFor(unit, 0, 0));
+      occupied.add(rectFor(unit, 0, 0));
       placedAt.set(unit, { c: 0, r: 0 });
     }
     pending.length = 0;
   }
-  let flowRow = occupied.length > 0 ? Math.ceil(Math.max(...occupied.map((o) => o.r + o.h))) : 0;
+  let flowRow = occupied.rects.length > 0 ? Math.ceil(Math.max(...occupied.rects.map((o) => o.r + o.h))) : 0;
   let flowCol = 0;
   const wrapAt = Math.max(
     SKETCH_SEP * 4,
-    occupied.length > 0 ? Math.ceil(Math.max(...occupied.map((o) => o.c + o.w))) : SKETCH_SEP * 4
+    occupied.rects.length > 0 ? Math.ceil(Math.max(...occupied.rects.map((o) => o.c + o.w))) : SKETCH_SEP * 4
   );
   for (const unit of pending) {
     let placed = false;
     while (!placed) {
       const rect = rectFor(unit, flowCol, flowRow);
-      if (!collidesAny(rect, occupied)) {
-        occupied.push(rect);
+      if (!occupied.hits(rect)) {
+        occupied.add(rect);
         placedAt.set(unit, { c: flowCol, r: flowRow });
         placed = true;
       }
@@ -409,6 +521,64 @@ function layoutSketch(parsed, options = {}) {
         maxX = origin.x + SKETCH_FOOT_W;
         maxY = minY;
       }
+      for (const inner of local.boxes) {
+        const innerBox = boxById.get(inner.boxId);
+        const innerLocal = boxLocal.get(inner.boxId);
+        if (!innerBox || !innerLocal) continue;
+        const innerRectOrigin = toPx(spot.c + inner.c, spot.r + inner.r);
+        const innerContentX = innerRectOrigin.x + SKETCH_GEOMETRY.boxPadPx - innerLocal.extent.c * SKETCH_HALF_SLOT_X;
+        const innerContentY = innerRectOrigin.y + SKETCH_GEOMETRY.bandPx - innerLocal.extent.r * SKETCH_HALF_SLOT_Y;
+        let iMinX = Infinity;
+        let iMinY = Infinity;
+        let iMaxX = -Infinity;
+        let iMaxY = -Infinity;
+        for (const gc of innerLocal.children) {
+          const gx = innerContentX + gc.c * SKETCH_HALF_SLOT_X;
+          const gy = innerContentY + gc.r * SKETCH_HALF_SLOT_Y;
+          nodes.push({
+            id: gc.node.id,
+            label: gc.node.label,
+            shape: gc.node.shape,
+            metadata: gc.node.metadata,
+            ...gc.node.description && { description: gc.node.description },
+            boxLabel: innerBox.label,
+            lineNumber: gc.node.lineNumber,
+            slot: { c: spot.c + inner.c, r: spot.r + inner.r },
+            x: gx,
+            y: gy,
+            w: SKETCH_FOOT_W,
+            h: SKETCH_FOOT_H
+          });
+          iMinX = Math.min(iMinX, gx);
+          iMinY = Math.min(iMinY, gy);
+          iMaxX = Math.max(iMaxX, gx + SKETCH_FOOT_W);
+          iMaxY = Math.max(iMaxY, gy + SKETCH_FOOT_H);
+        }
+        if (iMinX === Infinity) {
+          iMinX = innerContentX;
+          iMinY = innerContentY + SKETCH_GEOMETRY.bandPx;
+          iMaxX = innerContentX + SKETCH_FOOT_W;
+          iMaxY = iMinY;
+        }
+        const iFrame = {
+          x: iMinX - SKETCH_GEOMETRY.boxPadPx,
+          y: iMinY - SKETCH_GEOMETRY.bandPx,
+          w: iMaxX - iMinX + 2 * SKETCH_GEOMETRY.boxPadPx,
+          h: iMaxY - iMinY + SKETCH_GEOMETRY.bandPx + SKETCH_GEOMETRY.boxPadPx
+        };
+        boxes.push({
+          id: innerBox.id,
+          label: innerBox.label,
+          metadata: innerBox.metadata,
+          lineNumber: innerBox.lineNumber,
+          ...iFrame,
+          bandH: SKETCH_GEOMETRY.bandPx
+        });
+        minX = Math.min(minX, iFrame.x);
+        minY = Math.min(minY, iFrame.y);
+        maxX = Math.max(maxX, iFrame.x + iFrame.w);
+        maxY = Math.max(maxY, iFrame.y + iFrame.h);
+      }
       boxes.push({
         id: unit.box.id,
         label: unit.box.label,
@@ -507,9 +677,13 @@ function layoutSketch(parsed, options = {}) {
     width = Math.max(width, b.x + b.w);
     height = Math.max(height, b.y + b.h);
   }
+  const orderedBoxes = [
+    ...boxes.filter((b) => !nestedBoxIds.has(b.id)),
+    ...boxes.filter((b) => nestedBoxIds.has(b.id))
+  ];
   return {
     nodes,
-    boxes,
+    boxes: orderedBoxes,
     edges: collapsed.edges,
     width,
     height,
@@ -532,4 +706,4 @@ export {
   SKETCH_AUTO_LAYOUT_DEFAULTS,
   layoutSketch
 };
-//# sourceMappingURL=chunk-6DYZ2JM6.js.map
+//# sourceMappingURL=chunk-BZQCAZZZ.js.map

package/dist/{chunk-ZMKCG3FT.js → chunk-C576CU77.js}

@@ -44,7 +44,7 @@ import {
 } from "./chunk-MTGGOCND.js";
 import {
   parseClassDiagram
-} from "./chunk-SUA56ZSB.js";
+} from "./chunk-LTTZX6RD.js";
 import {
   fillModeFromOptions,
   legendInlineRequested,
@@ -448,4 +448,4 @@ export {
   renderClassDiagram,
   renderClassDiagramForExport
 };
-//# sourceMappingURL=chunk-ZMKCG3FT.js.map
+//# sourceMappingURL=chunk-C576CU77.js.map

package/dist/{chunk-DSH7NJ2G.js → chunk-EGXJWRO6.js}

@@ -6,7 +6,7 @@ import {
   mapLegendConfig,
   mapLegendGroups,
   parsePathRings
-} from "./chunk-BFTRW24X.js";
+} from "./chunk-FMZEU7MF.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
@@ -781,4 +781,4 @@ export {
   renderMap,
   renderMapForExport
 };
-//# sourceMappingURL=chunk-DSH7NJ2G.js.map
+//# sourceMappingURL=chunk-EGXJWRO6.js.map

package/dist/{chunk-RT7ACF77.js → chunk-EGY3TS62.js}

@@ -1,6 +1,6 @@
 // src/sketch/diagnostics.ts
 var SKETCH_DIAGNOSTIC_CODES = {
-  NESTED_BOX: "E_SKETCH_NESTED_BOX",
+  BOX_DEPTH: "E_SKETCH_BOX_DEPTH",
   AMBIGUOUS_TARGET: "E_SKETCH_AMBIGUOUS_TARGET",
   UNKNOWN_SHAPE: "W_SKETCH_UNKNOWN_SHAPE",
   OVERLAP_RESOLVED: "W_SKETCH_OVERLAP_RESOLVED",
@@ -8,12 +8,12 @@ var SKETCH_DIAGNOSTIC_CODES = {
 };
 var SKETCH_DIAGNOSTICS = [
   {
-    code: SKETCH_DIAGNOSTIC_CODES.NESTED_BOX,
+    code: SKETCH_DIAGNOSTIC_CODES.BOX_DEPTH,
     severity: "error",
     chartType: "sketch",
-    title: "Nested box",
-    message: (p) => `Box "${String(p.label ?? "?")}" is nested inside another box \u2014 sketch boxes are one level only; its shapes join the outer box`,
-    hint: "Move the inner [Box] to the top level.",
+    title: "Box nested too deep",
+    message: (p) => `Box "${String(p.label ?? "?")}" is nested ${String(p.depth ?? "?")} levels deep \u2014 sketch boxes nest to depth ${String(p.max ?? "?")} (decision #58); its shapes join the box above it`,
+    hint: "Move the inner [Box] up a level \u2014 two levels of bracket is the bound.",
     example: "sketch\n[Outer]\n  [Inner]\n    Shape"
   },
   {
@@ -58,4 +58,4 @@ export {
   SKETCH_DIAGNOSTIC_CODES,
   SKETCH_DIAGNOSTICS
 };
-//# sourceMappingURL=chunk-RT7ACF77.js.map
+//# sourceMappingURL=chunk-EGY3TS62.js.map