@diagrammo/dgmo 0.92.0 → 0.93.0

package/dist/{chunk-YRYKTYMQ.js → chunk-VSOZZYLK.js}

@@ -1,4 +1,10 @@
+import {
+  measureText,
+  truncateText
+} from "./chunk-KAO7JL4I.js";
+
 // src/utils/time-ticks.ts
+var TICK_LABEL_GAP = 8;
 var MONTH_ABBR = [
   "Jan",
   "Feb",
@@ -35,11 +41,12 @@ function dateToFractionalYear(d) {
 function formatYearTick(y) {
   return y < 0 ? `${-y} BCE` : String(y);
 }
-function computeTimeTicks(domainMin, domainMax, scale, boundaryStart, boundaryEnd, boundaryStartLabel, boundaryEndLabel) {
+function computeTimeTicks(domainMin, domainMax, scale, boundaryStart, boundaryEnd, boundaryStartLabel, boundaryEndLabel, labelFit = { fontSize: 10 }) {
   const minYear = Math.floor(domainMin);
   const maxYear = Math.floor(domainMax);
   const span = domainMax - domainMin;
   let ticks = [];
+  let strides = [];
   const firstYear = Math.ceil(domainMin);
   const lastYear = Math.floor(domainMax);
   if (lastYear >= firstYear + 1) {
@@ -52,9 +59,12 @@ function computeTimeTicks(domainMin, domainMax, scale, boundaryStart, boundaryEn
     else if (yearSpan > 40) step = 10;
     else if (yearSpan > 20) step = 5;
     else if (yearSpan > 10) step = 2;
+    strides = [1, 2, 5, 10, 20, 50, 100, 200, 500, 1e3, 2e3, 5e3].filter(
+      (c) => c % step === 0
+    );
     const alignedFirst = Math.ceil(firstYear / step) * step;
     for (let y = alignedFirst; y <= lastYear; y += step) {
-      ticks.push({ pos: scale(y), label: formatYearTick(y) });
+      ticks.push({ pos: scale(y), label: formatYearTick(y), slot: y });
     }
   } else if (span > 0.25) {
     const crossesYear = maxYear > minYear;
@@ -66,7 +76,9 @@ function computeTimeTicks(domainMin, domainMax, scale, boundaryStart, boundaryEn
           const abbr = MONTH_ABBR[m - 1];
           ticks.push({
             pos: scale(val),
-            label: crossesYear ? `${abbr} '${String(y).slice(-2)}` : abbr
+            label: crossesYear ? `${abbr} '${String(y).slice(-2)}` : abbr,
+            // Month index, so a stride of 3 lands on Jan, Apr, Jul, Oct.
+            slot: y * 12 + (m - 1)
           });
         }
       }
@@ -89,7 +101,11 @@ function computeTimeTicks(domainMin, domainMax, scale, boundaryStart, boundaryEn
         const hh = String(startDate.getHours()).padStart(2, "0");
         const mm = String(startDate.getMinutes()).padStart(2, "0");
         const ss = String(startDate.getSeconds()).padStart(2, "0");
-        ticks.push({ pos: scale(val), label: `${hh}:${mm}:${ss}` });
+        ticks.push({
+          pos: scale(val),
+          label: `${hh}:${mm}:${ss}`,
+          slot: ticks.length
+        });
       }
       startDate.setSeconds(startDate.getSeconds() + stepSec);
     }
@@ -111,7 +127,11 @@ function computeTimeTicks(domainMin, domainMax, scale, boundaryStart, boundaryEn
       if (val >= domainMin) {
         const hh = String(startDate.getHours()).padStart(2, "0");
         const mm = String(startDate.getMinutes()).padStart(2, "0");
-        ticks.push({ pos: scale(val), label: `${hh}:${mm}` });
+        ticks.push({
+          pos: scale(val),
+          label: `${hh}:${mm}`,
+          slot: ticks.length
+        });
       }
       startDate.setMinutes(startDate.getMinutes() + stepMin);
     }
@@ -136,11 +156,19 @@ function computeTimeTicks(domainMin, domainMax, scale, boundaryStart, boundaryEn
         const hh = String(startDate.getHours()).padStart(2, "0");
         const mm = String(startDate.getMinutes()).padStart(2, "0");
         if (singleDay) {
-          ticks.push({ pos: scale(val), label: `${hh}:${mm}` });
+          ticks.push({
+            pos: scale(val),
+            label: `${hh}:${mm}`,
+            slot: ticks.length
+          });
         } else {
           const mon = MONTH_ABBR[startDate.getMonth()];
           const d = startDate.getDate();
-          ticks.push({ pos: scale(val), label: `${mon} ${d} ${hh}:${mm}` });
+          ticks.push({
+            pos: scale(val),
+            label: `${mon} ${d} ${hh}:${mm}`,
+            slot: ticks.length
+          });
         }
       }
       startDate.setHours(startDate.getHours() + stepHour);
@@ -154,32 +182,98 @@ function computeTimeTicks(domainMin, domainMax, scale, boundaryStart, boundaryEn
           if (val >= domainMin) {
             ticks.push({
               pos: scale(val),
-              label: `${MONTH_ABBR[m - 1]} ${d}`
+              label: `${MONTH_ABBR[m - 1]} ${d}`,
+              slot: ticks.length
             });
           }
         }
       }
     }
   }
+  if (strides.length === 0) strides = [1, 2, 3, 4, 6, 8, 12, 16, 24, 32, 48];
   const collisionThreshold = 40;
+  let startBoundary = null;
+  let endBoundary = null;
   if (boundaryStart !== void 0 && boundaryStartLabel) {
     const boundaryPos = scale(boundaryStart);
     ticks = ticks.filter(
       (t) => Math.abs(t.pos - boundaryPos) >= collisionThreshold
     );
-    ticks.unshift({ pos: boundaryPos, label: boundaryStartLabel });
+    startBoundary = { pos: boundaryPos, label: boundaryStartLabel };
   }
   if (boundaryEnd !== void 0 && boundaryEndLabel) {
     const boundaryPos = scale(boundaryEnd);
     ticks = ticks.filter(
       (t) => Math.abs(t.pos - boundaryPos) >= collisionThreshold
     );
-    ticks.push({ pos: boundaryPos, label: boundaryEndLabel });
+    endBoundary = { pos: boundaryPos, label: boundaryEndLabel };
   }
-  return ticks;
+  return fitTickLabels(ticks, startBoundary, endBoundary, strides, labelFit);
+}
+function fitTickLabels(standard, startBoundary, endBoundary, strides, fit) {
+  const extent = (label) => fit.vertical ? fit.fontSize * 1.2 : measureText(label, fit.fontSize);
+  const span = (t) => {
+    const half = extent(t.label) / 2;
+    return { pos: t.pos, label: t.label, lo: t.pos - half, hi: t.pos + half };
+  };
+  const apart = (a, b) => a.hi + TICK_LABEL_GAP <= b.lo || b.hi + TICK_LABEL_GAP <= a.lo;
+  const fitsInOrder = (spans) => {
+    const sorted = [...spans].sort((a, b) => a.lo - b.lo);
+    for (let i = 1; i < sorted.length; i++) {
+      if (!apart(sorted[i - 1], sorted[i])) return false;
+    }
+    return true;
+  };
+  const start = startBoundary ? span(startBoundary) : null;
+  let end = endBoundary ? span(endBoundary) : null;
+  if (start && end && !apart(start, end)) end = null;
+  const pinned = [start, end].filter((p) => p !== null);
+  const withPinned = (kept) => [
+    ...start ? [start] : [],
+    ...kept,
+    ...end ? [end] : []
+  ];
+  const strip = (s) => ({
+    pos: s.pos,
+    label: s.label
+  });
+  for (const stride of strides) {
+    const kept = standard.filter((t) => t.slot % stride === 0).map(span).filter((s) => pinned.every((p) => apart(p, s)));
+    if (kept.length === 0 && pinned.length === 0) continue;
+    if (fitsInOrder(kept)) {
+      return withPinned(kept).map(strip);
+    }
+  }
+  return withPinned([]).map(strip);
+}
+
+// src/utils/label-column.ts
+var LABEL_COLUMN_MAX_SHARE = 1 / 3;
+var LABEL_COLUMN_END_PAD = 12;
+function capLabelColumn(natural, chartWidth, floor) {
+  const cap = Math.max(floor, Math.floor(chartWidth * LABEL_COLUMN_MAX_SHARE));
+  const width = Math.min(natural, cap);
+  const capped = natural > cap;
+  return {
+    width,
+    fit: (text, labelX, fontSize, bold = false) => capped ? truncateText(
+      text,
+      fontSize,
+      Math.max(0, width - labelX - LABEL_COLUMN_END_PAD),
+      { bold }
+    ) : text
+  };
+}
+function showFullOnHover(hoverEl, labelEl, drawEl, full, shown, prefix = "") {
+  drawEl.text(prefix + shown);
+  if (shown === full) return;
+  labelEl.attr("data-full-label", full);
+  hoverEl.on("mouseenter.reveal", () => drawEl.text(prefix + full)).on("mouseleave.reveal", () => drawEl.text(prefix + shown));
 }
 
 export {
   MONTH_ABBR,
-  computeTimeTicks
+  computeTimeTicks,
+  capLabelColumn,
+  showFullOnHover
 };

package/dist/{chunk-5SSTVFPX.js → chunk-WK5QEYFA.js}

@@ -1,16 +1,14 @@
 import {
   searchPlacement
-} from "./chunk-HXULJZA2.js";
+} from "./chunk-LDDDKWL6.js";
 import {
   noteCanvasShift,
-  placeNotes
-} from "./chunk-FTUMRSGT.js";
+  placeNotes,
+  resolveNotes
+} from "./chunk-NJJCTEBM.js";
 import {
   noteBoxSize
-} from "./chunk-RJNZHFNG.js";
-import {
-  resolveNotes
-} from "./chunk-O753JUEZ.js";
+} from "./chunk-D6PVMUCX.js";
 
 // src/graph/layout.ts
 import dagre from "@dagrejs/dagre";

package/dist/{chunk-KTGZDMDX.js → chunk-XUTR7GNT.js}

@@ -1,15 +1,14 @@
-import {
-  wrapDescriptionLines
-} from "./chunk-NPWVOFB3.js";
-import {
-  renderInlineText
-} from "./chunk-S7W75MIM.js";
 import {
   ScaleContext
 } from "./chunk-24YPR5EH.js";
 import {
-  renderIntegratedLegend
-} from "./chunk-NMS5XSLX.js";
+  layoutInlineHeader
+} from "./chunk-42UJ23H3.js";
+import {
+  TITLE_FONT_SIZE,
+  TITLE_FONT_WEIGHT,
+  TITLE_Y
+} from "./chunk-VLC6WNRD.js";
 import {
   ARROWHEAD_HEIGHT,
   ARROWHEAD_WIDTH,
@@ -18,25 +17,26 @@ import {
   HAIRLINE_DASH
 } from "./chunk-XCKNFFKM.js";
 import {
-  layoutInlineHeader
-} from "./chunk-42UJ23H3.js";
+  renderIntegratedLegend
+} from "./chunk-NMS5XSLX.js";
 import {
   getLegendExtent,
   getMaxLegendReservedHeight
 } from "./chunk-JILEYZ2V.js";
-import {
-  TITLE_FONT_SIZE,
-  TITLE_FONT_WEIGHT,
-  TITLE_Y
-} from "./chunk-VLC6WNRD.js";
-import {
-  FONT_FAMILY
-} from "./chunk-ICLB27PZ.js";
 import {
   isSequenceBlock,
   isSequenceNote,
   isSequenceSection
-} from "./chunk-B5PEKSRH.js";
+} from "./chunk-VSAKEMDD.js";
+import {
+  wrapDescriptionLines
+} from "./chunk-MB2SQF7N.js";
+import {
+  renderInlineText
+} from "./chunk-65GPEV5V.js";
+import {
+  FONT_FAMILY
+} from "./chunk-ICLB27PZ.js";
 import {
   resolveActiveTagGroup,
   tagAttrKey
@@ -301,10 +301,12 @@ function wrapTextLines(text, maxWidth, fontSize) {
   );
 }
 var labelTextWidth = (boxW) => boxW - 10;
+var PARTICIPANT_LABEL_PAD_V = 2;
+var participantLabelHeight = (lines, fontSize) => lines * (fontSize + 2) + PARTICIPANT_LABEL_PAD_V * 2;
 function splitParticipantLabel(label, maxWidth, fontSize) {
   if (measureText(label, fontSize) <= maxWidth) return [label];
   if (label.includes(" ")) {
-    return wrapLabelWords(label.split(" "), maxWidth, fontSize);
+    return wrapLabelWords(label.split(" "), maxWidth, fontSize, " ");
   }
   if (/[-_:/]/.test(label)) {
     const parts = label.split(/[-_:/]+/);
@@ -316,11 +318,11 @@ function splitParticipantLabel(label, maxWidth, fontSize) {
   }
   return [label];
 }
-function wrapLabelWords(words, maxWidth, fontSize) {
+function wrapLabelWords(words, maxWidth, fontSize, sep = "") {
   const lines = [];
   let current = "";
   for (const word of words) {
-    const test = current ? current + word : word;
+    const test = current ? current + sep + word : word;
     if (measureText(test, fontSize) > maxWidth && current) {
       lines.push(current);
       current = word;
@@ -686,6 +688,37 @@ function isSectionCollapsed(sec, collapsedSections) {
   return collapsedSections?.has(sec.lineNumber) ?? false;
 }
 function layoutSequence(parsed, containerWidth, options) {
+  let layout = layoutSequencePass(parsed, containerWidth, options);
+  if (options?.exportWidth) return layout;
+  const target = containerWidth - 1;
+  let prev = null;
+  for (let i = 0; i < 4 && layout && !layout.ctx.isBelowFloor; i++) {
+    if (layout.svgWidth <= containerWidth) return layout;
+    let factor = layout.ctx.factor * target / layout.svgWidth;
+    if (prev && prev.ctx.factor !== layout.ctx.factor) {
+      const slope = (prev.svgWidth - layout.svgWidth) / (prev.ctx.factor - layout.ctx.factor);
+      if (slope > 0)
+        factor = layout.ctx.factor - (layout.svgWidth - target) / slope;
+    }
+    prev = layout;
+    layout = layoutSequencePass(
+      parsed,
+      containerWidth,
+      options,
+      ScaleContext.fromFactor(factor)
+    );
+  }
+  if (layout && !layout.ctx.isBelowFloor && layout.svgWidth > containerWidth) {
+    layout = layoutSequencePass(
+      parsed,
+      containerWidth,
+      options,
+      ScaleContext.fromFactor(0)
+    );
+  }
+  return layout;
+}
+function layoutSequencePass(parsed, containerWidth, options, fit) {
   const { title, options: parsedOptions } = parsed;
   const effectiveCollapsedGroups = options?.collapsedGroups ? new Set(options.collapsedGroups) : new Set(
     parsed.groups.filter((g) => g.collapsed).map((g) => g.lineNumber)
@@ -752,10 +785,9 @@ function layoutSequence(parsed, containerWidth, options) {
     participants.length * effectiveGap,
     uniformBoxWidth + 40
   );
-  const ctx = options?.exportWidth ? ScaleContext.identity() : ScaleContext.from(containerWidth, idealWidth);
+  const ctx = fit ?? (options?.exportWidth ? ScaleContext.identity() : ScaleContext.from(containerWidth, idealWidth));
   const sGap = ctx.structural(effectiveGap);
   const sBoxW = ctx.structural(uniformBoxWidth);
-  const sBoxH = ctx.structural(PARTICIPANT_BOX_HEIGHT);
   const sTopMargin = ctx.aesthetic(TOP_MARGIN);
   const sTitleHeight = ctx.aesthetic(TITLE_HEIGHT);
   const sParticipantYOffset = ctx.aesthetic(PARTICIPANT_Y_OFFSET);
@@ -777,6 +809,20 @@ function layoutSequence(parsed, containerWidth, options) {
   const sNoteLaneMax = sGap - sActivationWidth - sNoteGap;
   const sLabelFontSize = ctx.text(LABEL_FONT_SIZE);
   const sLabelTextWidth = labelTextWidth(sBoxW);
+  let maxInBoxLines = 1;
+  for (const p of participants) {
+    if (p.type === "actor") continue;
+    const n = splitParticipantLabel(
+      p.label,
+      sLabelTextWidth,
+      sLabelFontSize
+    ).length;
+    maxInBoxLines = Math.max(maxInBoxLines, n);
+  }
+  const sBoxH = Math.max(
+    ctx.structural(PARTICIPANT_BOX_HEIGHT),
+    participantLabelHeight(maxInBoxLines, sLabelFontSize)
+  );
   const participantIndexMap = /* @__PURE__ */ new Map();
   participants.forEach((p, i) => participantIndexMap.set(p.id, i));
   const effectiveNotePosition = (note) => {
@@ -1398,8 +1444,10 @@ function layoutSequence(parsed, containerWidth, options) {
     }
   };
   for (let pass = 0; pass < 4; pass++) {
-    let contentLeft = 0;
-    let contentRight = svgWidth;
+    const extentLeft = offsetX - leftMargin;
+    const extentRight = extentLeft + totalWidth;
+    let contentLeft = extentLeft;
+    let contentRight = extentRight;
     for (const step of renderSteps) {
       const displayLabel = displayMessageLabel(step);
       if (!displayLabel) continue;
@@ -1428,8 +1476,8 @@ function layoutSequence(parsed, containerWidth, options) {
       scanNotes(elements, acc);
       contentRight = acc.right;
     }
-    const neededLeftPad = Math.max(0, -contentLeft);
-    const neededRightPad = Math.max(0, contentRight - svgWidth);
+    const neededLeftPad = Math.max(0, extentLeft - contentLeft);
+    const neededRightPad = Math.max(0, contentRight - extentRight);
     if (neededLeftPad <= 0.5 && neededRightPad <= 0.5) break;
     leftMargin += neededLeftPad;
     rightMargin += neededRightPad;