@diagrammo/dgmo 0.54.0 → 0.56.0

package/dist/{chunk-MEQYZZFR.js → chunk-6IVXRTXH.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-RT7ACF77.js";
 import {
   makeDgmoError
-} from "./chunk-4W2PE66Q.js";
+} from "./chunk-OLMWTJVU.js";
 
 // src/sketch/geometry.ts
 var SKETCH_PHI = (1 + Math.sqrt(5)) / 2;
@@ -72,6 +72,16 @@ function collapseSketch(parsed, collapsedLabels) {
 }
 
 // src/sketch/layout.ts
+function resolveAutoFlags(f = {}) {
+  return {
+    normalizeOrigin: f.normalizeOrigin ?? true,
+    sortRootsBySource: f.sortRootsBySource ?? true,
+    resolveOverlap: f.resolveOverlap ?? true,
+    groupCollisionAsRect: f.groupCollisionAsRect ?? true,
+    flowPlaceUnpositioned: f.flowPlaceUnpositioned ?? true,
+    avoidEdges: f.avoidEdges ?? true
+  };
+}
 function unitRect(c, r) {
   return { c, r, w: SKETCH_SEP, h: SKETCH_SEP };
 }
@@ -104,7 +114,7 @@ function nearestFree(base, occupied) {
   }
   return { c: base.c, r: base.r };
 }
-function layoutChildren(box, nodesById, warn) {
+function layoutChildren(box, nodesById, warn, flags) {
   const occupied = [];
   const children = [];
   const pending = [];
@@ -116,13 +126,17 @@ function layoutChildren(box, nodesById, warn) {
       continue;
     }
     const target = unitRect(node.at.c, node.at.r);
-    const spot = nearestFree(target, occupied);
+    const spot = flags.resolveOverlap ? nearestFree(target, occupied) : { c: node.at.c, r: node.at.r };
     if (spot.c !== node.at.c || spot.r !== node.at.r) {
       warn(node.lineNumber, node.label);
     }
     occupied.push(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 flowCol = 0;
   const wrapAt = Math.max(
@@ -169,6 +183,7 @@ function layoutSketch(parsed, options = {}) {
       )
     );
   };
+  const flags = resolveAutoFlags(options.autoLayout);
   const collapsed = collapseSketch(parsed, options.collapsedBoxes);
   const nodesById = new Map(collapsed.nodes.map((n) => [n.id, n]));
   const padHsX = SKETCH_GEOMETRY.boxPadPx / SKETCH_HALF_SLOT_X;
@@ -177,10 +192,39 @@ function layoutSketch(parsed, options = {}) {
   const boxLocal = /* @__PURE__ */ new Map();
   const inExpandedBox = /* @__PURE__ */ new Set();
   for (const box of collapsed.boxes) {
-    const local = layoutChildren(box, nodesById, overlapWarn);
+    const local = layoutChildren(box, nodesById, overlapWarn, flags);
     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 = () => {
+  };
+  const virtualLocal = /* @__PURE__ */ new Map();
+  for (const box of collapsed.virtualBoxes) {
+    virtualLocal.set(box.id, layoutChildren(box, allNodesById, noWarn, flags));
+  }
+  const footWs = SKETCH_FOOT_W / SKETCH_HALF_SLOT_X;
+  const footHs = SKETCH_FOOT_H / SKETCH_HALF_SLOT_Y;
+  const virtualCardSpot = (boxId, spot) => {
+    const local = virtualLocal.get(boxId);
+    if (local.children.length === 0) return { c: spot.c, r: spot.r };
+    let minC = Infinity;
+    let minR = Infinity;
+    let maxC = -Infinity;
+    let maxR = -Infinity;
+    for (const ch of local.children) {
+      minC = Math.min(minC, ch.c);
+      minR = Math.min(minR, ch.r);
+      maxC = Math.max(maxC, ch.c + footWs);
+      maxR = Math.max(maxR, ch.r + footHs);
+    }
+    const cx = spot.c + (minC + maxC) / 2;
+    const cy = spot.r + (minR + maxR) / 2 + (padHsY - bandHs) / 2;
+    return {
+      c: Math.round(cx - footWs / 2),
+      r: Math.round(cy - footHs / 2)
+    };
+  };
   const rootUnits = [];
   for (const node of collapsed.nodes) {
     if (!inExpandedBox.has(node.id)) rootUnits.push({ kind: "shape", node });
@@ -191,14 +235,27 @@ function layoutSketch(parsed, options = {}) {
   for (const box of collapsed.boxes) {
     rootUnits.push({ kind: "box", box });
   }
-  rootUnits.sort((a, b) => {
-    const la = a.kind === "shape" ? a.node.lineNumber : a.box.lineNumber;
-    const lb = b.kind === "shape" ? b.node.lineNumber : b.box.lineNumber;
-    return la - lb;
-  });
+  const lineOf = (u) => u.kind === "shape" ? u.node.lineNumber : u.box.lineNumber;
+  const atOf = (u) => u.kind === "shape" ? u.node.at : u.box.at;
+  if (flags.sortRootsBySource) {
+    rootUnits.sort((a, b) => lineOf(a) - lineOf(b));
+  } else {
+    rootUnits.sort((a, b) => {
+      const aa = atOf(a);
+      const ba = atOf(b);
+      if (aa && ba) {
+        return aa.r - ba.r || aa.c - ba.c || lineOf(a) - lineOf(b);
+      }
+      if (aa) return -1;
+      if (ba) return 1;
+      return lineOf(a) - lineOf(b);
+    });
+  }
   const rectFor = (unit, c, r) => {
-    if (unit.kind === "box") {
-      const local = boxLocal.get(unit.box.id);
+    if (unit.kind !== "shape" && flags.groupCollisionAsRect) {
+      const local = (unit.kind === "box" ? boxLocal : virtualLocal).get(
+        unit.box.id
+      );
       return {
         c: c + local.extent.c - padHsX,
         r: r + local.extent.r - bandHs,
@@ -212,26 +269,31 @@ function layoutSketch(parsed, options = {}) {
   const placedAt = /* @__PURE__ */ new Map();
   const pending = [];
   for (const unit of rootUnits) {
-    const at = unit.kind === "shape" ? unit.node.at : unit.box.at;
+    const at = atOf(unit);
     if (at === null) {
       pending.push(unit);
       continue;
     }
     const base = rectFor(unit, at.c, at.r);
     let spot = { c: at.c, r: at.r };
-    if (collidesAny(base, occupied)) {
+    if (flags.resolveOverlap && unit.kind === "shape" && collidesAny(base, occupied)) {
       const freed = nearestFree(base, occupied);
       spot = {
         c: at.c + (freed.c - base.c),
         r: at.r + (freed.r - base.r)
       };
-      const line = unit.kind === "shape" ? unit.node.lineNumber : unit.box.lineNumber;
-      const label = unit.kind === "shape" ? unit.node.label : unit.box.label;
-      overlapWarn(line, label);
+      overlapWarn(unit.node.lineNumber, unit.node.label);
     }
     occupied.push(rectFor(unit, spot.c, spot.r));
     placedAt.set(unit, spot);
   }
+  if (!flags.flowPlaceUnpositioned) {
+    for (const unit of pending) {
+      occupied.push(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 flowCol = 0;
   const wrapAt = Math.max(
@@ -258,8 +320,10 @@ function layoutSketch(parsed, options = {}) {
     const spot = placedAt.get(u);
     return rectFor(u, spot.c, spot.r);
   });
-  const cMin = allRects.length > 0 ? Math.min(...allRects.map((r) => r.c)) : 0;
-  const rMin = allRects.length > 0 ? Math.min(...allRects.map((r) => r.r)) : 0;
+  const liveCMin = allRects.length > 0 ? Math.min(...allRects.map((r) => r.c)) : 0;
+  const liveRMin = allRects.length > 0 ? Math.min(...allRects.map((r) => r.r)) : 0;
+  const cMin = flags.normalizeOrigin ? liveCMin : Math.min(options.frozenOrigin?.c ?? liveCMin, liveCMin);
+  const rMin = flags.normalizeOrigin ? liveRMin : Math.min(options.frozenOrigin?.r ?? liveRMin, liveRMin);
   const toPx = (c, r) => ({
     x: (c - cMin) * SKETCH_HALF_SLOT_X,
     y: (r - rMin) * SKETCH_HALF_SLOT_Y
@@ -284,14 +348,15 @@ function layoutSketch(parsed, options = {}) {
         h: SKETCH_FOOT_H
       });
     } else if (unit.kind === "virtual") {
-      const { x, y } = toPx(spot.c, spot.r);
+      const cardSpot = virtualCardSpot(unit.box.id, spot);
+      const { x, y } = toPx(cardSpot.c, cardSpot.r);
       nodes.push({
         id: unit.box.id,
         label: unit.box.label,
         shape: "rectangle",
         metadata: unit.box.metadata,
         lineNumber: unit.box.lineNumber,
-        slot: spot,
+        slot: cardSpot,
         x,
         y,
         w: SKETCH_FOOT_W,
@@ -348,7 +413,13 @@ function layoutSketch(parsed, options = {}) {
       });
     }
   }
-  {
+  if (flags.avoidEdges) {
+    const authored = /* @__PURE__ */ new Set();
+    for (const unit of rootUnits) {
+      if (atOf(unit) !== null) {
+        authored.add(unit.kind === "shape" ? unit.node.id : unit.box.id);
+      }
+    }
     const centerOf = (id) => {
       const n = nodes.find((nd) => nd.id === id);
       if (n) return { x: n.x + n.w / 2, y: n.y + n.h / 2 };
@@ -382,6 +453,7 @@ function layoutSketch(parsed, options = {}) {
       let moved = false;
       for (const n of nodes) {
         if (n.boxLabel) continue;
+        if (authored.has(n.id)) continue;
         for (const e of collapsed.edges) {
           if (e.sourceId === n.id || e.targetId === n.id) continue;
           const a = centerOf(e.sourceId);
@@ -432,7 +504,8 @@ function layoutSketch(parsed, options = {}) {
     edges: collapsed.edges,
     width,
     height,
-    diagnostics
+    diagnostics,
+    origin: { c: cMin, r: rMin }
   };
 }
 
@@ -449,4 +522,4 @@ export {
   collapseSketch,
   layoutSketch
 };
-//# sourceMappingURL=chunk-MEQYZZFR.js.map
+//# sourceMappingURL=chunk-6IVXRTXH.js.map

package/dist/chunk-6VJCURWU.js

@@ -0,0 +1,87 @@
+import {
+  TITLE_FONT_SIZE,
+  TITLE_Y
+} from "./chunk-A4GOY3PE.js";
+import {
+  LEGEND_HEIGHT
+} from "./chunk-SCJ7CAJF.js";
+import {
+  measureText
+} from "./chunk-4ASYQ347.js";
+
+// src/utils/inline-header.ts
+var LEGEND_INLINE_SUPPORTED = /* @__PURE__ */ new Set([
+  // data charts
+  "bar",
+  "line",
+  "radar",
+  "scatter",
+  "function",
+  // structured
+  "state",
+  "treemap",
+  "block",
+  "event-line",
+  "boxes-and-lines",
+  "er",
+  "class",
+  "family",
+  "infra",
+  "sequence",
+  "sketch",
+  "bracket",
+  "gantt",
+  "pert",
+  "sitemap",
+  "mindmap",
+  "kanban",
+  "journey-map"
+]);
+function legendInlineSupported(type) {
+  return LEGEND_INLINE_SUPPORTED.has(type.toLowerCase());
+}
+var INLINE_HEADER_PAD = 8;
+var INLINE_HEADER_GAP = 16;
+var BOLD_WIDTH_FACTOR = 1.06;
+var MIN_INLINE_LEGEND_W = 48;
+function measureTitleWidth(title, fontSize = TITLE_FONT_SIZE) {
+  return measureText(title, fontSize) * BOLD_WIDTH_FACTOR;
+}
+function layoutInlineHeader(input) {
+  const pad = input.pad ?? INLINE_HEADER_PAD;
+  const gap = input.gap ?? INLINE_HEADER_GAP;
+  const fontSize = input.titleFontSize ?? TITLE_FONT_SIZE;
+  const baselineY = input.titleBaselineY ?? TITLE_Y;
+  const stacked = {
+    inline: false,
+    titleX: input.containerWidth / 2,
+    titleAnchor: "middle",
+    legendX: 0,
+    legendY: input.titleBandHeight,
+    headerHeight: input.titleBandHeight + (input.hasLegend ? input.legendReserve : 0)
+  };
+  if (!input.requested || !input.hasLegend) return stacked;
+  const titleW = measureTitleWidth(input.title, fontSize);
+  const titleRight = pad + titleW + gap;
+  const avail = input.containerWidth - titleRight - pad;
+  const fits = avail >= MIN_INLINE_LEGEND_W && input.legendHeight <= LEGEND_HEIGHT + 1 && input.legendWidth <= avail + 0.5;
+  if (!fits) return stacked;
+  return {
+    inline: true,
+    titleX: pad,
+    titleAnchor: "start",
+    // Flush to the right edge; the fit test guarantees this clears the title.
+    legendX: input.containerWidth - pad - input.legendWidth,
+    // Center the legend row on the title's visual middle (cap-center ≈ baseline
+    // − 0.36·fontSize).
+    legendY: baselineY - fontSize * 0.36 - input.legendHeight / 2,
+    headerHeight: input.titleBandHeight
+  };
+}
+
+export {
+  legendInlineSupported,
+  INLINE_HEADER_PAD,
+  layoutInlineHeader
+};
+//# sourceMappingURL=chunk-6VJCURWU.js.map

package/dist/{chunk-QZAW5SFH.js → chunk-7NK42OIB.js}

@@ -4,7 +4,7 @@ import {
 import {
   makeDgmoError,
   suggest
-} from "./chunk-4W2PE66Q.js";
+} from "./chunk-OLMWTJVU.js";
 
 // src/utils/notes/resolve.ts
 function resolveNotes(notes, targets, diagnostics) {
@@ -65,4 +65,4 @@ function resolveNotes(notes, targets, diagnostics) {
 export {
   resolveNotes
 };
-//# sourceMappingURL=chunk-QZAW5SFH.js.map
+//# sourceMappingURL=chunk-7NK42OIB.js.map

package/dist/{chunk-EQOMY4PY.js → chunk-7SXTD7L6.js}

@@ -4,10 +4,10 @@ import {
 import {
   isTagBlockHeading,
   matchTagBlockHeading
-} from "./chunk-AHTTKERF.js";
+} from "./chunk-D5FANMSG.js";
 import {
   makeDgmoError
-} from "./chunk-4W2PE66Q.js";
+} from "./chunk-OLMWTJVU.js";
 
 // src/pert/share-normalize.ts
 var START_DATE_NOW_RE = /^(\s*start-date\s+)now(\s*)$/i;
@@ -401,4 +401,4 @@ export {
   normalizePertSourceForShare,
   resolveOrgImports
 };
-//# sourceMappingURL=chunk-EQOMY4PY.js.map
+//# sourceMappingURL=chunk-7SXTD7L6.js.map

package/dist/{chunk-APKUAJ2L.js → chunk-A2RUBBVT.js}

@@ -128,6 +128,18 @@ function formatTime(h, m, s, hours12) {
   }
   return { main: `${pad2(h)}:${pad2(m)}`, sec, ap: "" };
 }
+function fixedTimeCells(s, x0, fs) {
+  const digit = fs * 0.6;
+  const colon = fs * 0.32;
+  const cells = [];
+  let x = x0;
+  for (const ch of s) {
+    const cw = ch === ":" ? colon : digit;
+    cells.push({ ch, x: x + cw / 2 });
+    x += cw;
+  }
+  return { cells, width: x - x0 };
+}
 function fmtDelta(ms) {
   const m = Math.max(0, Math.round(ms / 6e4));
   if (m < 90) return `${m}m`;
@@ -213,8 +225,9 @@ export {
   formatOffsetLabel,
   fixedParts,
   formatTime,
+  fixedTimeCells,
   workStatus,
   sunLine,
   handAngles
 };
-//# sourceMappingURL=chunk-APKUAJ2L.js.map
+//# sourceMappingURL=chunk-A2RUBBVT.js.map

package/dist/{chunk-S7FOIURR.js → chunk-A4DAZO3U.js}

@@ -7,12 +7,15 @@ import {
 import {
   ScaleContext
 } from "./chunk-YYVTBZZC.js";
+import {
+  serializeSvg
+} from "./chunk-NZ5QVASG.js";
 import {
   renderIntegratedLegend
-} from "./chunk-2NZOHEP4.js";
+} from "./chunk-QDOYT6UW.js";
 import {
   getMaxLegendReservedHeight
-} from "./chunk-J7HQPVYH.js";
+} from "./chunk-ES66QH6J.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT
@@ -22,11 +25,11 @@ import {
 } from "./chunk-6KFWC4CO.js";
 import {
   parseKanban
-} from "./chunk-GK32ZFZY.js";
+} from "./chunk-X32RDWT5.js";
 import {
   LEGEND_HEIGHT,
   measureLegendText
-} from "./chunk-Q5IHQ4NW.js";
+} from "./chunk-SCJ7CAJF.js";
 import {
   measureText
 } from "./chunk-4ASYQ347.js";
@@ -35,14 +38,14 @@ import {
   mix,
   shapeFill,
   themeBaseBg
-} from "./chunk-JYDMBWRP.js";
+} from "./chunk-42IT4BG2.js";
 import {
   tagAttrKey
-} from "./chunk-AHTTKERF.js";
+} from "./chunk-D5FANMSG.js";
 import {
   fillModeFromOptions,
   legendSuppressed
-} from "./chunk-3FRO35WW.js";
+} from "./chunk-3KOPPSUQ.js";
 
 // src/kanban/renderer.ts
 import * as d3Selection from "d3-selection";
@@ -552,7 +555,7 @@ function renderKanbanForExport(content, theme, palette) {
     exportMode: true
   });
   const svgEl = container.querySelector("svg");
-  return svgEl?.outerHTML ?? "";
+  return svgEl ? serializeSvg(svgEl) : "";
 }
 var LANE_HEADER_WIDTH = 140;
 var LANE_GAP = 14;
@@ -893,4 +896,4 @@ export {
   renderKanban,
   renderKanbanForExport
 };
-//# sourceMappingURL=chunk-S7FOIURR.js.map
+//# sourceMappingURL=chunk-A4DAZO3U.js.map

package/dist/{chunk-AJFHNS67.js → chunk-AIH6M5J6.js}

@@ -1,15 +1,15 @@
 import {
   buildSwatches
-} from "./chunk-B4XS2AF2.js";
+} from "./chunk-FWVKPEG3.js";
 import {
   layoutMap,
   mapLegendConfig,
   mapLegendGroups,
   parsePathRings
-} from "./chunk-KBVOVDYP.js";
+} from "./chunk-U7ZQTUZT.js";
 import {
   renderIntegratedLegend
-} from "./chunk-2NZOHEP4.js";
+} from "./chunk-QDOYT6UW.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
@@ -20,21 +20,21 @@ import {
 } from "./chunk-6KFWC4CO.js";
 import {
   parseClock
-} from "./chunk-KV4HLIJE.js";
+} from "./chunk-YNAHUNMA.js";
 import {
   fixedParts,
   formatTime,
   sunLine,
   workStatus,
   zoneParts
-} from "./chunk-APKUAJ2L.js";
+} from "./chunk-A2RUBBVT.js";
 import {
   measureText
 } from "./chunk-4ASYQ347.js";
 import {
   mix,
   themeBaseBg
-} from "./chunk-JYDMBWRP.js";
+} from "./chunk-42IT4BG2.js";
 
 // src/map/renderer.ts
 import * as d3Selection from "d3-selection";
@@ -781,4 +781,4 @@ export {
   renderMap,
   renderMapForExport
 };
-//# sourceMappingURL=chunk-AJFHNS67.js.map
+//# sourceMappingURL=chunk-AIH6M5J6.js.map

package/dist/{chunk-KS5ZSM5T.js → chunk-AMC2OGXF.js}

@@ -16,12 +16,16 @@ import {
 import {
   ScaleContext
 } from "./chunk-YYVTBZZC.js";
+import {
+  layoutInlineHeader
+} from "./chunk-6VJCURWU.js";
 import {
   renderIntegratedLegend
-} from "./chunk-2NZOHEP4.js";
+} from "./chunk-QDOYT6UW.js";
 import {
+  getLegendExtent,
   getMaxLegendReservedHeight
-} from "./chunk-J7HQPVYH.js";
+} from "./chunk-ES66QH6J.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
@@ -33,7 +37,7 @@ import {
 } from "./chunk-6KFWC4CO.js";
 import {
   parseInfra
-} from "./chunk-S7YFT3PO.js";
+} from "./chunk-FXVPSTDT.js";
 import {
   preprocessDescriptionLine
 } from "./chunk-IYULMRBE.js";
@@ -47,7 +51,7 @@ import {
   LEGEND_PILL_FONT_SIZE,
   LEGEND_PILL_PAD,
   measureLegendText
-} from "./chunk-Q5IHQ4NW.js";
+} from "./chunk-SCJ7CAJF.js";
 import {
   CHAR_WIDTH_RATIO,
   measureText,
@@ -57,16 +61,17 @@ import {
   contrastText,
   mix,
   shapeFill
-} from "./chunk-JYDMBWRP.js";
+} from "./chunk-42IT4BG2.js";
 import {
   tagAttrKey
-} from "./chunk-AHTTKERF.js";
+} from "./chunk-D5FANMSG.js";
 import {
+  legendInlineRequested,
   legendSuppressed
-} from "./chunk-3FRO35WW.js";
+} from "./chunk-3KOPPSUQ.js";
 import {
   resolveColor
-} from "./chunk-ZKPPI6BF.js";
+} from "./chunk-EXNKNJ65.js";
 
 // src/infra/renderer.ts
 import * as d3Selection from "d3-selection";
@@ -1293,10 +1298,10 @@ function computeInfraLegendGroups(nodes, tagGroups, palette, edges) {
   }
   return groups;
 }
-function renderLegend(rootSvg, legendGroups, totalWidth, legendY, palette, isDark, activeGroup, playback, exportMode = false, controlsHost) {
+function renderLegend(rootSvg, legendGroups, totalWidth, legendY, palette, isDark, activeGroup, playback, exportMode = false, controlsHost, legendX = 0, inlineHeader = false) {
   if (legendGroups.length === 0 && !playback) return;
   const appHostedPlayback = controlsHost === "app" && !!playback;
-  const legendG = rootSvg.append("g").attr("transform", `translate(0, ${legendY})`);
+  const legendG = rootSvg.append("g").attr("transform", `translate(${legendX}, ${legendY})`);
   if (activeGroup) {
     legendG.attr("data-legend-active", tagAttrKey(activeGroup));
   }
@@ -1312,6 +1317,12 @@ function renderLegend(rootSvg, legendGroups, totalWidth, legendY, palette, isDar
     activeGroup,
     mode: exportMode ? "export" : "preview",
     showEmptyGroups: true,
+    ...inlineHeader && {
+      position: {
+        placement: "top-center",
+        titleRelation: "inline-with-title"
+      }
+    },
     ...appHostedPlayback && {
       controlsHost: "app",
       controlsGroup: {
@@ -1395,7 +1406,39 @@ function renderInfra(container, layout, palette, isDark, title, titleLineNumber,
   const legendOffset = hasLegend && !fixedLegend ? legendDynamicH : 0;
   const titleOffset = title ? TITLE_OFFSET : 0;
   const totalWidth = layout.width;
-  const totalHeight = layout.height + titleOffset + legendOffset;
+  const inlineRequested = legendInlineRequested(layout.options) && !fixedLegend;
+  const legendExtent = inlineRequested && hasLegend ? getLegendExtent(
+    {
+      groups: legendGroups.map((g) => ({
+        name: g.name,
+        entries: g.entries.map((e) => ({
+          value: e.value,
+          color: e.color
+        }))
+      })),
+      position: {
+        placement: "top-center",
+        titleRelation: "inline-with-title"
+      },
+      mode: exportMode ? "export" : "preview",
+      showEmptyGroups: true
+    },
+    { activeGroup: activeGroup ?? null },
+    totalWidth
+  ) : { width: 0, height: 0 };
+  const header = layoutInlineHeader({
+    requested: inlineRequested,
+    title: title ?? "",
+    hasLegend,
+    legendWidth: legendExtent.width,
+    legendHeight: legendExtent.height,
+    containerWidth: totalWidth,
+    titleBandHeight: titleOffset,
+    legendReserve: legendOffset,
+    titleBaselineY: sc.sTitleY,
+    titleFontSize: sc.sTitleFontSize
+  });
+  const totalHeight = layout.height + titleOffset + (header.inline ? 0 : legendOffset);
   const shouldAnimate = animate !== false;
   const fixedTitleH = fixedLegend && title ? TITLE_OFFSET : 0;
   const diagramViewHeight = fixedLegend ? layout.height + (title && !fixedTitleH ? titleOffset : 0) + legendOffset : totalHeight;
@@ -1455,9 +1498,12 @@ function renderInfra(container, layout, palette, isDark, title, titleLineNumber,
     `);
   }
   const contentTitleOffset = fixedTitleH ? 0 : titleOffset;
-  const svg = rootSvg.append("g").attr("transform", `translate(0, ${contentTitleOffset + legendOffset})`);
+  const svg = rootSvg.append("g").attr(
+    "transform",
+    `translate(0, ${contentTitleOffset + (header.inline ? 0 : legendOffset)})`
+  );
   if (title && !fixedTitleH) {
-    rootSvg.append("text").attr("class", "chart-title").attr("x", totalWidth / 2).attr("y", sc.sTitleY).attr("text-anchor", "middle").attr("font-family", FONT_FAMILY).attr("font-size", sc.sTitleFontSize).attr("font-weight", TITLE_FONT_WEIGHT).attr("fill", palette.text).attr("data-line-number", titleLineNumber != null ? titleLineNumber : "").text(title);
+    rootSvg.append("text").attr("class", "chart-title").attr("x", header.titleX).attr("y", sc.sTitleY).attr("text-anchor", header.titleAnchor).attr("font-family", FONT_FAMILY).attr("font-size", sc.sTitleFontSize).attr("font-weight", TITLE_FONT_WEIGHT).attr("fill", palette.text).attr("data-line-number", titleLineNumber != null ? titleLineNumber : "").text(title);
   }
   renderGroups(svg, layout.groups, palette, isDark, sc);
   const speedMultiplier = playback?.speed ?? 1;
@@ -1534,13 +1580,15 @@ function renderInfra(container, layout, palette, isDark, title, titleLineNumber,
         rootSvg,
         legendGroups,
         totalWidth,
-        titleOffset,
+        header.inline ? header.legendY : titleOffset,
         palette,
         isDark,
         activeGroup ?? null,
         playback ?? void 0,
         exportMode,
-        controlsHost
+        controlsHost,
+        header.inline ? header.legendX : 0,
+        header.inline
       );
     }
   }
@@ -1560,4 +1608,4 @@ export {
   renderInfra,
   parseAndLayoutInfra
 };
-//# sourceMappingURL=chunk-KS5ZSM5T.js.map
+//# sourceMappingURL=chunk-AMC2OGXF.js.map

package/dist/{chunk-SSHS42QG.js → chunk-AN465MXC.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-6EK55ART.js";
 import {
   resolveNotes
-} from "./chunk-QZAW5SFH.js";
+} from "./chunk-7NK42OIB.js";
 import {
   measureText
 } from "./chunk-4ASYQ347.js";
@@ -326,4 +326,4 @@ function layoutERDiagram(parsed, options) {
 export {
   layoutERDiagram
 };
-//# sourceMappingURL=chunk-SSHS42QG.js.map
+//# sourceMappingURL=chunk-AN465MXC.js.map