@diagrammo/dgmo 0.87.0 → 0.88.0

package/dist/advanced.d.ts

@@ -3609,6 +3609,12 @@ interface GanttInteractiveOptions {
      * change), matching every other ControlsStrip-hosted chart type.
      */
     controlsHost?: 'app' | 'inline';
+    /**
+     * The host scales the SVG to fit the container on both axes (the app's
+     * preview pane). A chart taller than the container is laid out wider, to the
+     * container's aspect ratio, so it fills the width instead of a centred column.
+     */
+    fitToContainer?: boolean;
     /** Initial Critical Path highlight state (used when `controlsHost` is `'app'`). */
     criticalPathActive?: boolean;
     /** Initial Dependencies-arrow visibility (used when `controlsHost` is `'app'`). */

package/dist/advanced.js

@@ -1,8 +1,7 @@
 import {
-  layoutBracket,
   renderBracket,
   renderBracketForExport
-} from "./chunk-Q2U5635V.js";
+} from "./chunk-WXPBP4IT.js";
 import {
   renderRaci,
   renderRaciForExport
@@ -134,7 +133,7 @@ import {
 import {
   buildTagLaneRowList,
   renderGantt
-} from "./chunk-AGO3PFGS.js";
+} from "./chunk-MVCPO6LI.js";
 import {
   renderState,
   renderStateForExport
@@ -295,7 +294,7 @@ import {
   focusEventLine,
   renderEventLine,
   renderEventLineForExport
-} from "./chunk-FBKPSU3A.js";
+} from "./chunk-5LD7SHXO.js";
 import "./chunk-NPWVOFB3.js";
 import "./chunk-R2K5L4UA.js";
 import {
@@ -323,7 +322,10 @@ import {
   renderSlopeChart,
   renderVenn,
   renderWordCloud
-} from "./chunk-PJQZWJ5I.js";
+} from "./chunk-VW52W5F6.js";
+import {
+  layoutBracket
+} from "./chunk-ABP5BUD6.js";
 import "./chunk-D4M25W6R.js";
 import {
   CHART_TYPE_DESCRIPTIONS,
@@ -377,7 +379,7 @@ import "./chunk-2CW5ZTNH.js";
 import {
   formatDateLabel,
   renderTimeline
-} from "./chunk-LPXC4I4R.js";
+} from "./chunk-JLETTWUJ.js";
 import {
   computeTimeTicks
 } from "./chunk-YRYKTYMQ.js";

package/dist/block.js

@@ -4,7 +4,8 @@ import {
 } from "./chunk-D3K4U3ZM.js";
 import {
   render
-} from "./chunk-PJQZWJ5I.js";
+} from "./chunk-VW52W5F6.js";
+import "./chunk-ABP5BUD6.js";
 import {
   docsLink,
   renderErrorCard
@@ -23,7 +24,7 @@ import "./chunk-2CW5ZTNH.js";
 import {
   escapeAttr,
   escapeHtml
-} from "./chunk-LPXC4I4R.js";
+} from "./chunk-JLETTWUJ.js";
 import "./chunk-YRYKTYMQ.js";
 import "./chunk-24YPR5EH.js";
 import "./chunk-XCKNFFKM.js";

package/dist/{chunk-FBKPSU3A.js → chunk-5LD7SHXO.js}

@@ -9,7 +9,7 @@ import {
 } from "./chunk-S7W75MIM.js";
 import {
   formatDateLabel
-} from "./chunk-LPXC4I4R.js";
+} from "./chunk-JLETTWUJ.js";
 import {
   CARD_RADIUS,
   HAIRLINE_DASH,

package/dist/{chunk-Q2U5635V.js → chunk-ABP5BUD6.js}

@@ -1,51 +1,10 @@
-import {
-  renderInlineText
-} from "./chunk-S7W75MIM.js";
-import {
-  layoutInlineHeader
-} from "./chunk-3DOQOXXI.js";
-import {
-  TITLE_FONT_SIZE,
-  TITLE_FONT_WEIGHT,
-  TITLE_Y
-} from "./chunk-VLC6WNRD.js";
-import {
-  renderIntegratedLegend
-} from "./chunk-LHL6HDUL.js";
-import {
-  getLegendExtent,
-  getMaxLegendReservedHeight
-} from "./chunk-FM3WAVB6.js";
-import {
-  FONT_FAMILY
-} from "./chunk-ICLB27PZ.js";
-import {
-  LEGEND_GROUP_GAP
-} from "./chunk-RH2PROYG.js";
 import {
   measureText
 } from "./chunk-KAO7JL4I.js";
-import {
-  resolveTagColor,
-  tagAttrKey
-} from "./chunk-L5AFONQU.js";
-import {
-  contrastText,
-  getSeriesColors,
-  mix,
-  shapeFill,
-  themeBaseBg
-} from "./chunk-7HWY4QAJ.js";
-import {
-  resolveColor
-} from "./chunk-2M4IGSCY.js";
 import {
   makeDgmoError
 } from "./chunk-BYU54C3S.js";
 
-// src/bracket/renderer.ts
-import * as d3Selection from "d3-selection";
-
 // src/bracket/layout.ts
 var BOX_W = 176;
 var BOX_H = 30;
@@ -390,8 +349,8 @@ function layoutBracket(parsed) {
       (g) => g.built.nodes.map((n) => commentaryLineCount(n.commentary))
     )
   );
-  const COMMENT_LH2 = 15;
-  const rowScale = maxComment > 0 ? Math.max(ROW, 2 * BOX_H + PAIR_GAP + maxComment * COMMENT_LH2 + 16) : ROW;
+  const COMMENT_LH = 15;
+  const rowScale = maxComment > 0 ? Math.max(ROW, 2 * BOX_H + PAIR_GAP + maxComment * COMMENT_LH + 16) : ROW;
   for (const g of groups) positionSide(g.built, rowScale);
   const champResults = parsed.matches.filter(
     (m) => m.side === null && parsed.sides.length >= 1
@@ -560,7 +519,7 @@ function layoutBracket(parsed) {
       const wl = commentaryLineCount(m.commentary);
       maxY = Math.max(
         maxY,
-        m.y + half + BOX_H / 2 + 13 + (wl - 1) * COMMENT_LH2 + 4
+        m.y + half + BOX_H / 2 + 13 + (wl - 1) * COMMENT_LH + 4
       );
     }
   }
@@ -613,391 +572,11 @@ function layoutBracket(parsed) {
   };
 }
 
-// src/bracket/renderer.ts
-var PADDING = 16;
-var TITLE_BAND = 40;
-var HALF_SPAN2 = (BOX_H + PAIR_GAP) / 2;
-var COMMENT_LH = 15;
-var LEGEND_POSITION = {
-  placement: "top-center",
-  titleRelation: "below-title"
-};
-function clip(s, maxW, fs, bold) {
-  if (measureText(s, fs, { bold }) <= maxW) return s;
-  let lo = 0;
-  let hi = s.length;
-  while (lo < hi) {
-    const mid = Math.ceil((lo + hi) / 2);
-    if (measureText(s.slice(0, mid) + "\u2026", fs, { bold }) <= maxW) lo = mid;
-    else hi = mid - 1;
-  }
-  return lo <= 0 ? "" : s.slice(0, lo) + "\u2026";
-}
-function paintForAccent(palette, isDark, accent, fillMode) {
-  const base = themeBaseBg(palette, isDark);
-  return {
-    accent,
-    ink: palette.text,
-    muted: mix(palette.text, base, 52),
-    // Loser / TBD outlines + connectors are ink-based (not the pale border) so
-    // they stay legible on top of a colored, shaded column band.
-    hair: mix(palette.text, base, 34),
-    wire: mix(palette.text, base, 30),
-    track: mix(palette.border, base, 55),
-    // §1.9 fill family rides through shapeFill: solid ⇒ raw accent,
-    // outline ⇒ theme base bg (accent stays on the stroke), absent ⇒ 25% tint.
-    tint: shapeFill(palette, accent, isDark, { mode: fillMode })
-  };
-}
-function paintFor(palette, isDark, sideColor, fillMode) {
-  const accent = sideColor && resolveColor(sideColor, palette) || sideColor || getSeriesColors(palette)[0];
-  return paintForAccent(palette, isDark, accent, fillMode);
-}
-function resolveBracketLegend(parsed, palette) {
-  const activeTag = parsed.activeTag;
-  const activeGroup = activeTag ? parsed.tagGroups.find((g) => tagAttrKey(g.name) === tagAttrKey(activeTag)) : void 0;
-  const legendGroups = activeGroup && !parsed.noLegend ? [
-    {
-      name: activeGroup.name,
-      entries: activeGroup.entries.map((e) => ({
-        value: e.value,
-        color: resolveColor(e.color, palette) ?? e.color
-      }))
-    }
-  ] : [];
-  return { activeGroup, legendGroups };
-}
-function bracketExportDimensions(parsed, palette) {
-  const layout = layoutBracket(parsed);
-  const width = layout.width + PADDING * 2;
-  const titleH = parsed.title ? TITLE_BAND : 0;
-  const { legendGroups } = resolveBracketLegend(parsed, palette);
-  const legendReserve = legendGroups.length > 0 ? getMaxLegendReservedHeight(
-    { groups: legendGroups, position: LEGEND_POSITION, mode: "export" },
-    width
-  ) + LEGEND_GROUP_GAP : 0;
-  const height = titleH + legendReserve + PADDING + layout.height + PADDING;
-  return { width, height };
-}
-function renderBracket(container, parsed, palette, isDark, exportDims) {
-  d3Selection.select(container).selectAll(":not([data-d3-tooltip])").remove();
-  if (parsed.error) return;
-  const layout = layoutBracket(parsed);
-  const width = exportDims?.width ?? container.clientWidth;
-  const height = exportDims?.height ?? container.clientHeight;
-  if (width <= 0 || height <= 0) return;
-  const showTitle = !!parsed.title;
-  const titleH = showTitle ? TITLE_BAND : 0;
-  const exportMode = exportDims !== void 0;
-  const seedByName = /* @__PURE__ */ new Map();
-  for (const s of parsed.seeds)
-    if (!seedByName.has(s.name)) seedByName.set(s.name, s.seed);
-  const activeTag = parsed.activeTag;
-  const activeKey = activeTag ? tagAttrKey(activeTag) : null;
-  const tagValueOf = (name) => {
-    if (!name || !activeKey) return null;
-    const meta = parsed.competitorMeta.get(name);
-    return meta?.[activeKey] ?? null;
-  };
-  const tagColorOf = (name) => {
-    if (!name || !activeTag) return null;
-    const meta = parsed.competitorMeta.get(name);
-    if (!meta || !activeKey || !meta[activeKey]) return null;
-    const c = resolveTagColor(meta, [...parsed.tagGroups], activeTag);
-    return c ? resolveColor(c, palette) ?? c : null;
-  };
-  const { activeGroup, legendGroups } = resolveBracketLegend(parsed, palette);
-  const legendReserve = legendGroups.length > 0 ? getMaxLegendReservedHeight(
-    { groups: legendGroups, position: LEGEND_POSITION, mode: "preview" },
-    width
-  ) + LEGEND_GROUP_GAP : 0;
-  const inlineRequested = parsed.legendInline === true;
-  const legendExtent = inlineRequested && legendGroups.length > 0 ? getLegendExtent(
-    {
-      groups: legendGroups,
-      position: {
-        placement: "top-center",
-        titleRelation: "inline-with-title"
-      },
-      mode: exportMode ? "export" : "preview"
-    },
-    { activeGroup: activeGroup?.name ?? null },
-    width
-  ) : { width: 0, height: 0 };
-  const header = layoutInlineHeader({
-    requested: inlineRequested,
-    title: parsed.title ?? "",
-    hasLegend: legendGroups.length > 0,
-    legendWidth: legendExtent.width,
-    legendHeight: legendExtent.height,
-    containerWidth: width,
-    titleBandHeight: titleH,
-    legendReserve,
-    titleBaselineY: TITLE_Y,
-    titleFontSize: TITLE_FONT_SIZE
-  });
-  const svg = d3Selection.select(container).append("svg").attr("width", width).attr("height", height).attr("viewBox", `0 0 ${width} ${height}`).attr("preserveAspectRatio", "xMidYMin meet").attr("xmlns", "http://www.w3.org/2000/svg").attr("class", "dgmo-bracket").attr("role", "img").attr(
-    "aria-label",
-    `Tournament bracket${parsed.title ? ` \u2014 ${parsed.title}` : ""}${layout.champion ? `, champion ${layout.champion}` : ""}`
-  ).style("font-family", FONT_FAMILY);
-  if (showTitle) {
-    const t = svg.append("text").attr("class", "chart-title").attr("x", header.titleX).attr("y", TITLE_Y).attr("text-anchor", header.titleAnchor).attr("fill", palette.text).attr("font-family", FONT_FAMILY).attr("font-size", TITLE_FONT_SIZE).attr("font-weight", TITLE_FONT_WEIGHT).text(parsed.title);
-    if (parsed.titleLineNumber !== null)
-      t.attr("data-line-number", parsed.titleLineNumber);
-  }
-  const areaY = (header.inline ? titleH : titleH + legendReserve) + PADDING;
-  const areaX = PADDING;
-  const areaW = Math.max(1, width - PADDING * 2);
-  const areaH = Math.max(1, height - areaY - PADDING);
-  const scale = Math.min(1, areaW / layout.width, areaH / layout.height);
-  const offsetX = areaX + (areaW - layout.width * scale) / 2;
-  const offsetY = areaY;
-  const root = svg.append("g").attr("class", "dgmo-bracket-body").attr("transform", `translate(${offsetX},${offsetY}) scale(${scale})`);
-  if (legendGroups.length > 0) {
-    const legendG = svg.append("g").attr("class", "dgmo-bracket-legend").attr(
-      "transform",
-      header.inline ? `translate(${header.legendX}, ${header.legendY})` : `translate(0, ${titleH})`
-    );
-    renderIntegratedLegend(legendG, {
-      groups: legendGroups,
-      palette: {
-        bg: palette.bg,
-        surface: palette.surface,
-        text: palette.text,
-        textMuted: palette.textMuted,
-        primary: palette.primary
-      },
-      isDark,
-      width,
-      mode: exportMode ? "export" : "preview",
-      position: {
-        placement: "top-center",
-        titleRelation: header.inline ? "inline-with-title" : "below-title"
-      },
-      activeGroup: activeGroup?.name ?? null
-    });
-  }
-  const baseAccent = parsed.accentColor ?? resolveColor("blue", palette) ?? getSeriesColors(palette)[0];
-  const fillMode = parsed.fillMode;
-  const basePaint = paintForAccent(palette, isDark, baseAccent, fillMode);
-  const sideColorByLabel = /* @__PURE__ */ new Map();
-  for (const s of parsed.sides) sideColorByLabel.set(s.label, s.color);
-  const sideBarH = layout.sideLabels.length ? 30 : 0;
-  const bandTop = sideBarH + 2;
-  const roundY = sideBarH + 24;
-  for (const col of layout.columns) {
-    if (!col.color) continue;
-    const covered = layout.sideLabels.some(
-      (s) => col.x >= s.x0 && col.x <= s.x1
-    );
-    const top = covered ? bandTop : 2;
-    const c = resolveColor(col.color, palette) ?? col.color;
-    root.append("rect").attr("x", col.x - BOX_W / 2 - 10).attr("y", top).attr("width", BOX_W + 20).attr("height", Math.max(0, layout.height - top)).attr("rx", 10).attr(
-      "fill",
-      fillMode === "outline" ? themeBaseBg(palette, isDark) : mix(c, palette.bg, isDark ? 12 : 8)
-    ).call((sel) => {
-      if (fillMode === "outline")
-        sel.attr("stroke", mix(c, palette.bg, 35)).attr("stroke-width", 1);
-    });
-  }
-  for (const s of layout.sideLabels) {
-    const c = s.color ? resolveColor(s.color, palette) ?? s.color : basePaint.accent;
-    root.append("rect").attr("x", s.x0 - 8).attr("y", 2).attr("width", s.x1 - s.x0 + 16).attr("height", 24).attr("rx", 8).attr(
-      "fill",
-      fillMode === "outline" ? themeBaseBg(palette, isDark) : mix(c, palette.bg, isDark ? 20 : 14)
-    ).attr("stroke", fillMode === "outline" ? c : mix(c, palette.bg, 55)).attr("stroke-width", 1);
-    root.append("text").attr("x", (s.x0 + s.x1) / 2).attr("y", 18).attr("text-anchor", "middle").attr("font-size", 13).attr("font-weight", "bold").attr("letter-spacing", 0.3).attr("fill", c).text(clip(s.label, s.x1 - s.x0, 13, true));
-  }
-  for (const col of layout.columns) {
-    const c = col.color ? resolveColor(col.color, palette) ?? col.color : basePaint.muted;
-    const covered = layout.sideLabels.some(
-      (s) => col.x >= s.x0 && col.x <= s.x1
-    );
-    root.append("text").attr("x", col.x).attr("y", covered ? roundY : 22).attr("text-anchor", "middle").attr("font-size", covered ? 14 : 15).attr("font-weight", "bold").attr("fill", c).attr("letter-spacing", 0.4).text(clip(col.label, BOX_W + 20, covered ? 14 : 15, true));
-  }
-  for (const m of layout.matches) {
-    drawConnector(root, m, m.topFrom, m.y - HALF_SPAN2, basePaint);
-    drawConnector(root, m, m.botFrom, m.y + HALF_SPAN2, basePaint);
-  }
-  for (const m of layout.matches) {
-    const sidePaint = m.side && sideColorByLabel.get(m.side) ? paintFor(palette, isDark, sideColorByLabel.get(m.side), fillMode) : basePaint;
-    const topSeed = seedByName.get(m.top ?? "") ?? null;
-    const botSeed = seedByName.get(m.bot ?? "") ?? null;
-    let homeName = m.home;
-    if (!homeName && topSeed !== null && botSeed !== null) {
-      homeName = topSeed <= botSeed ? m.top : m.bot;
-    }
-    const [wSeed, lSeed] = m.winner === "top" ? [topSeed, botSeed] : m.winner === "bot" ? [botSeed, topSeed] : [null, null];
-    const isUpset = wSeed !== null && lSeed !== null && wSeed > lSeed && !m.isChampionship;
-    const scoreParts = m.score ? m.score.split(/[-–]/).map((p) => p.trim()) : null;
-    const winScore = scoreParts?.length === 2 ? scoreParts[0] : "";
-    const loseScore = scoreParts?.length === 2 ? scoreParts[1] : "";
-    const champWinner = m.isChampionship ? layout.champion : null;
-    const mkInfo = (side, name) => {
-      const isWinner = m.winner === side;
-      const isLoser = m.winner !== null && m.winner !== side;
-      return {
-        isWinner,
-        isLoser,
-        pending: m.pending,
-        isChampion: champWinner !== null && isWinner,
-        score: isWinner ? winScore : isLoser ? loseScore : "",
-        seed: seedByName.get(name ?? "") ?? null,
-        tagColor: tagColorOf(name),
-        tagValue: tagValueOf(name),
-        isHome: homeName !== null && homeName === name
-      };
-    };
-    drawBox(
-      root,
-      m.x,
-      m.y - HALF_SPAN2,
-      m.top,
-      mkInfo("top", m.top),
-      sidePaint,
-      palette,
-      isDark,
-      m,
-      activeKey,
-      fillMode
-    );
-    drawBox(
-      root,
-      m.x,
-      m.y + HALF_SPAN2,
-      m.bot,
-      mkInfo("bot", m.bot),
-      sidePaint,
-      palette,
-      isDark,
-      m,
-      activeKey,
-      fillMode
-    );
-    if (isUpset) drawUpset(root, m, sidePaint);
-    if (m.commentary.length) drawCommentary(root, m, palette);
-  }
-}
-function drawConnector(g, m, from, toCy, paint) {
-  if (!from) return;
-  const parentLeft = m.x - BOX_W / 2;
-  const parentRight = m.x + BOX_W / 2;
-  const childIsLeft = from.x < m.x;
-  const childEdge = childIsLeft ? from.x + BOX_W / 2 : from.x - BOX_W / 2;
-  const parentEdge = childIsLeft ? parentLeft : parentRight;
-  const midX = (childEdge + parentEdge) / 2;
-  const vLo = Math.min(from.yA, from.yB, toCy);
-  const vHi = Math.max(from.yA, from.yB, toCy);
-  const d = from.yA !== from.yB ? `M ${childEdge} ${from.yA} H ${midX} M ${childEdge} ${from.yB} H ${midX} M ${midX} ${vLo} V ${vHi} M ${midX} ${toCy} H ${parentEdge}` : `M ${childEdge} ${from.y} H ${midX} V ${toCy} H ${parentEdge}`;
-  g.append("path").attr("d", d).attr("fill", "none").attr("stroke", paint.wire).attr("stroke-width", 1.5);
-}
-function drawBox(g, cx, cy, name, info, sidePaint, palette, isDark, m, activeKey, fillMode) {
-  const x = cx - BOX_W / 2;
-  const y = cy - BOX_H / 2;
-  const paint = info.tagColor ? paintForAccent(palette, isDark, info.tagColor, fillMode) : sidePaint;
-  const cell = g.append("g").attr("class", "dgmo-bracket-box");
-  if (m.lineNumber !== null) cell.attr("data-line-number", m.lineNumber);
-  if (activeKey && info.tagValue)
-    cell.attr(`data-tag-${activeKey}`, info.tagValue.toLowerCase());
-  const isTBD = name === null;
-  let fill = "none";
-  let stroke = paint.hair;
-  let sw = 1.25;
-  let dash = null;
-  let textColor = paint.ink;
-  let weight = "bold";
-  if (info.isChampion) {
-    fill = paint.tint;
-    stroke = paint.accent;
-    sw = 3;
-    weight = "bold";
-  } else if (isTBD) {
-    fill = paint.track;
-    dash = "4 4";
-    textColor = paint.muted;
-    weight = "normal";
-  } else if (info.isWinner) {
-    fill = paint.tint;
-    stroke = paint.accent;
-    sw = 2;
-    weight = "bold";
-  } else if (info.isLoser) {
-    stroke = paint.hair;
-    textColor = paint.muted;
-    weight = "normal";
-  } else if (info.pending) {
-    stroke = mix(paint.accent, paint.hair, 50);
-  }
-  const onSolid = fillMode === "solid" && (info.isChampion || info.isWinner) ? contrastText(
-    paint.tint,
-    palette.textOnFillLight,
-    palette.textOnFillDark
-  ) : null;
-  if (onSolid) textColor = onSolid;
-  const gutterColor = onSolid ?? paint.muted;
-  const rect = cell.append("rect").attr("x", x).attr("y", y).attr("width", BOX_W).attr("height", BOX_H).attr("rx", 6).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", sw);
-  if (dash) rect.attr("stroke-dasharray", dash);
-  let leftPad = 11;
-  if (info.seed !== null) {
-    cell.append("text").attr("x", x + 9).attr("y", cy + 4).attr("text-anchor", "start").attr("font-size", 10).attr("font-weight", "bold").attr("fill", gutterColor).text(info.seed);
-    leftPad = 9 + Math.max(12, measureText(String(info.seed), 10, { bold: true })) + 6;
-  }
-  let rightPad = 11;
-  if (info.score) rightPad += 20;
-  if (info.isHome) {
-    drawHome(cell, x + BOX_W - rightPad - 6, cy, gutterColor);
-    rightPad += 16;
-  }
-  cell.append("text").attr("x", x + leftPad).attr("y", cy + 4).attr("text-anchor", "start").attr("font-size", 12.5).attr("font-weight", weight).attr("fill", textColor).text(
-    clip(
-      isTBD ? "TBD" : name,
-      BOX_W - leftPad - rightPad,
-      12.5,
-      weight === "bold"
-    )
-  );
-  if (info.score) {
-    cell.append("text").attr("x", x + BOX_W - 11).attr("y", cy + 4).attr("text-anchor", "end").attr("font-size", 12).attr("font-weight", info.isWinner ? "bold" : "normal").attr("fill", info.isWinner ? textColor : gutterColor).text(info.score);
-  }
-}
-function drawHome(cell, hx, cy, color) {
-  const s = 5;
-  const yTop = cy - s - 1;
-  const d = `M ${hx - s} ${cy - 1} L ${hx} ${yTop} L ${hx + s} ${cy - 1} L ${hx + s} ${cy + s} L ${hx - s} ${cy + s} Z`;
-  cell.append("path").attr("d", d).attr("fill", "none").attr("stroke", color).attr("stroke-width", 1.2).attr("stroke-linejoin", "round");
-}
-function drawUpset(g, m, paint) {
-  g.append("text").attr("x", m.x + BOX_W / 2).attr("y", m.y - HALF_SPAN2 - BOX_H / 2 - 4).attr("text-anchor", "end").attr("font-size", 9).attr("font-weight", "bold").attr("letter-spacing", 0.6).attr("fill", paint.accent).text("UPSET");
-}
-function drawCommentary(g, m, palette) {
-  const x = m.x - BOX_W / 2 + 2;
-  let y = m.y + HALF_SPAN2 + BOX_H / 2 + 13;
-  const muted = mix(palette.text, palette.bg, 45);
-  const bulletW = measureText("\u2022 ", 11);
-  const emit = (line, lx) => {
-    const t = g.append("text").attr("x", lx).attr("y", y).attr("text-anchor", "start").attr("font-size", 11).attr("font-style", "italic").attr("fill", muted);
-    renderInlineText(t, line, palette, 11);
-    y += COMMENT_LH;
-  };
-  for (const raw of m.commentary) {
-    const isBullet = raw.startsWith("\u2022 ");
-    if (isBullet) {
-      const body = raw.slice(2);
-      wrapText(body, COMMENT_W - bulletW, 11).forEach(
-        (line, i) => i === 0 ? emit(`\u2022 ${line}`, x) : emit(line, x + bulletW)
-      );
-    } else {
-      for (const line of wrapText(raw, COMMENT_W, 11)) emit(line, x);
-    }
-  }
-}
-function renderBracketForExport(container, parsed, palette, isDark, exportDims) {
-  renderBracket(container, parsed, palette, isDark, exportDims);
-}
-
 export {
-  layoutBracket,
-  bracketExportDimensions,
-  renderBracket,
-  renderBracketForExport
+  BOX_W,
+  BOX_H,
+  PAIR_GAP,
+  COMMENT_W,
+  wrapText,
+  layoutBracket
 };

package/dist/{chunk-LPXC4I4R.js → chunk-JLETTWUJ.js}

@@ -72,6 +72,8 @@ function escapeAttr(s) {
 // src/timeline/renderer.ts
 import * as d3Scale from "d3-scale";
 import * as d3Selection from "d3-selection";
+var MIN_TOP_SCALE_BAND = 26;
+var MIN_BOTTOM_BAND = 30;
 function renderEras(g, eras, scale, isVertical, innerWidth, innerHeight, onEnter, onLeave, hasScale = false, _tooltip = null, palette, reservedLabelY, fillMode, outlineBg) {
   const eraColors = getEraColors(
     palette ?? getPalette(DEFAULT_PALETTE_ID).light
@@ -799,11 +801,12 @@ function renderTimelineHorizontalTimeSort(container, parsed, palette, isDark, se
   const MARKER_ROW_H = ctx.structural(22);
   const eraReserve = timelineEras.length > 0 ? ERA_ROW_H : 0;
   const markerReserve = timelineMarkers.length > 0 ? MARKER_ROW_H : 0;
-  const topScaleH = timelineScale ? ctx.structural(40) : 0;
+  const topScaleH = timelineScale ? Math.max(ctx.structural(40), MIN_TOP_SCALE_BAND) : 0;
+  const hasGroupLegend = timelineGroups.length > 0 && !parsed.noLegend;
   const margin = {
-    top: ctx.aesthetic(104) + topScaleH + eraReserve + markerReserve + tagLegendReserve,
+    top: 50 + (hasGroupLegend ? 54 : ctx.aesthetic(54)) + topScaleH + eraReserve + markerReserve + tagLegendReserve,
     right: ctx.aesthetic(40),
-    bottom: ctx.aesthetic(40) + scaleMargin,
+    bottom: Math.max(ctx.aesthetic(40), MIN_BOTTOM_BAND) + scaleMargin,
     left: ctx.aesthetic(60)
   };
   const markerLabelY = markerReserve ? -(topScaleH + MARKER_ROW_H / 2) : 0;
@@ -874,8 +877,8 @@ function renderTimelineHorizontalTimeSort(container, parsed, palette, isDark, se
       formatBoundaryLabel(latestEndDateStr, earliestStartDateStr)
     );
   }
-  if (timelineGroups.length > 0 && !parsed.noLegend) {
-    const legendY = timelineScale ? -ctx.aesthetic(75) : -ctx.aesthetic(55);
+  if (hasGroupLegend) {
+    const legendY = timelineScale ? -(topScaleH + 35) : -55;
     renderTimelineGroupLegend(
       g,
       timelineGroups,
@@ -1033,7 +1036,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
   const MARKER_ROW_H = ctx.structural(22);
   const eraReserve = timelineEras.length > 0 ? ERA_ROW_H : 0;
   const markerReserve = timelineMarkers.length > 0 ? MARKER_ROW_H : 0;
-  const topScaleH = timelineScale ? ctx.structural(40) : 0;
+  const topScaleH = timelineScale ? Math.max(ctx.structural(40), MIN_TOP_SCALE_BAND) : 0;
   const maxGroupNameLen = Math.max(...lanes.map((l) => l.name.length)) + 2;
   const maxEventLabelLen = Math.max(
     0,
@@ -1044,11 +1047,11 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
     ctx.aesthetic(140),
     maxLeftLabelLen * sCharW + ctx.aesthetic(30)
   );
-  const baseTopMargin = title ? ctx.aesthetic(50) : ctx.aesthetic(20);
+  const baseTopMargin = title ? 50 : ctx.aesthetic(20);
   const margin = {
     top: baseTopMargin + topScaleH + eraReserve + markerReserve + tagLegendReserve,
     right: ctx.aesthetic(40),
-    bottom: ctx.aesthetic(40) + scaleMargin,
+    bottom: Math.max(ctx.aesthetic(40), MIN_BOTTOM_BAND) + scaleMargin,
     left: dynamicLeftMargin
   };
   const markerLabelY = markerReserve ? -(topScaleH + MARKER_ROW_H / 2) : 0;
@@ -1136,7 +1139,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
     g.append("rect").attr("class", "tl-group-header-bg").attr("data-group", lane.name).attr("x", bandX).attr("y", bandY).attr("width", bandW).attr("height", bandH).attr("rx", sBandRx).attr("fill", shapeFill(palette, laneColor, isDark, { mode: fillMode })).style("pointer-events", "none");
     g.append("rect").attr("class", "tl-group-header-accent").attr("data-group", lane.name).attr("x", bandX).attr("y", bandY).attr("width", sBandAccentW).attr("height", bandH).attr("fill", laneColor).attr("clip-path", `url(#${clipId})`).style("pointer-events", "none");
     const headerG = g.append("g").attr("class", "tl-group-header").attr("data-group", lane.name).style("cursor", "pointer").on("mouseenter", () => fadeToGroup(g, lane.name)).on("mouseleave", () => fadeReset(g)).on("click", () => toggleGroup(lane.name));
-    headerG.append("text").attr("x", -margin.left + ctx.aesthetic(10)).attr("y", curY + sBarH / 2).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", sLaneHeaderFont).attr("font-weight", "bold").text(`${toggleIcon} ${lane.name}`);
+    headerG.append("text").attr("x", bandX + 5).attr("y", curY + sBarH / 2).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", sLaneHeaderFont).attr("font-weight", "bold").text(`${toggleIcon} ${lane.name}`);
     if (lane.events.length > 0) {
       const evDates = lane.events.map((ev) => parseTimelineDate(ev.date));
       const evEndDates = lane.events.filter((ev) => ev.endDate).map((ev) => parseTimelineDate(ev.endDate));