@diagrammo/dgmo 0.92.1 → 0.94.0

package/dist/{chunk-KTGZDMDX.js → chunk-XKCRKD2B.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-UIEKW4SG.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-7WEYXYLC.js";
+import {
+  renderInlineText
+} from "./chunk-QKPOIJBT.js";
+import {
+  FONT_FAMILY
+} from "./chunk-ICLB27PZ.js";
 import {
   resolveActiveTagGroup,
   tagAttrKey
@@ -64,7 +64,17 @@ import {
 import * as d3Selection from "d3-selection";
 
 // src/sequence/collapse.ts
-function applyCollapseProjection(parsed, collapsedGroups) {
+function isCollapsibleGroup(group) {
+  return group.participantIds.length > 1;
+}
+function collapsedGroupId(group, groups) {
+  const shared = groups.some((g) => g !== group && g.name === group.name);
+  return shared ? `${group.name}@${group.lineNumber}` : group.name;
+}
+function applyCollapseProjection(parsed, requestedGroups) {
+  const collapsedGroups = new Set(
+    parsed.groups.filter((g) => requestedGroups.has(g.lineNumber) && isCollapsibleGroup(g)).map((g) => g.lineNumber)
+  );
   if (collapsedGroups.size === 0) {
     return {
       participants: parsed.participants,
@@ -88,37 +98,37 @@ function applyCollapseProjection(parsed, collapsedGroups) {
     return false;
   };
   const memberToGroup = /* @__PURE__ */ new Map();
-  const collapsedGroupNames = /* @__PURE__ */ new Set();
+  const virtualIds = /* @__PURE__ */ new Set();
+  const groupById = /* @__PURE__ */ new Map();
   const byDepth = [...parsed.groups].sort((a, b) => a.depth - b.depth);
   for (const group of byDepth) {
     if (!collapsedGroups.has(group.lineNumber)) continue;
     if (insideCollapsed(group)) continue;
-    collapsedGroupNames.add(group.name);
+    const id = collapsedGroupId(group, parsed.groups);
+    virtualIds.add(id);
+    groupById.set(id, group);
     for (const memberId of group.participantIds) {
       if (!memberToGroup.has(memberId)) {
-        memberToGroup.set(memberId, group.name);
+        memberToGroup.set(memberId, id);
       }
     }
   }
   const participants = [];
   const insertedGroups = /* @__PURE__ */ new Set();
   for (const p of parsed.participants) {
-    const groupName = memberToGroup.get(p.id);
-    if (groupName) {
-      if (!insertedGroups.has(groupName)) {
-        insertedGroups.add(groupName);
-        const group = parsed.groups.find(
-          (g) => g.name === groupName && collapsedGroups.has(g.lineNumber)
-        );
+    const groupId = memberToGroup.get(p.id);
+    if (groupId) {
+      if (!insertedGroups.has(groupId)) {
+        insertedGroups.add(groupId);
+        const group = groupById.get(groupId);
         participants.push({
-          id: groupName,
-          // already ParticipantId from memberToGroup value type
-          label: groupName,
+          id: groupId,
+          label: group.name,
           type: "default",
           lineNumber: group.lineNumber
         });
       }
-    } else if (collapsedGroupNames.has(p.id)) {
+    } else if (virtualIds.has(p.id)) {
     } else {
       participants.push(p);
     }
@@ -301,10 +311,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 +328,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;
@@ -615,6 +627,22 @@ function applyPositionOverrides(participants) {
   }
   return result;
 }
+function foldCollapsedParticipants(parsed, view) {
+  const expanded = applyPositionOverrides(
+    applyGroupOrdering(parsed.participants, parsed.groups, parsed.messages)
+  );
+  const byId = new Map(view.participants.map((p) => [p.id, p]));
+  const result = [];
+  const placed = /* @__PURE__ */ new Set();
+  for (const p of expanded) {
+    const id = view.collapsedGroupIds.get(p.id) ?? p.id;
+    const target = byId.get(id);
+    if (!target || placed.has(id)) continue;
+    placed.add(id);
+    result.push(target);
+  }
+  return result;
+}
 function applyGroupOrdering(participants, groups, messages = []) {
   const idToGroup = /* @__PURE__ */ new Map();
   for (const group of groups) {
@@ -686,10 +714,49 @@ 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(
+  const requestedCollapsedGroups = options?.collapsedGroups ? new Set(options.collapsedGroups) : new Set(
     parsed.groups.filter((g) => g.collapsed).map((g) => g.lineNumber)
   );
+  const collapsibleGroupLines = new Set(
+    parsed.groups.filter(isCollapsibleGroup).map((g) => g.lineNumber)
+  );
+  const effectiveCollapsedGroups = new Set(
+    parsed.groups.map((g) => g.lineNumber).filter(
+      (line) => requestedCollapsedGroups.has(line) && collapsibleGroupLines.has(line)
+    )
+  );
   const collapsed = effectiveCollapsedGroups.size > 0 ? applyCollapseProjection(parsed, effectiveCollapsedGroups) : null;
   const messages = collapsed ? collapsed.messages : parsed.messages;
   const elements = collapsed ? collapsed.elements : parsed.elements;
@@ -709,9 +776,8 @@ function layoutSequence(parsed, containerWidth, options) {
     if (number === void 0) return step.label;
     return step.label ? `${number}. ${step.label}` : String(number);
   };
-  const sourceParticipants = collapsed ? collapsed.participants : parsed.participants;
-  const participants = applyPositionOverrides(
-    applyGroupOrdering(sourceParticipants, groups, messages)
+  const participants = collapsed ? foldCollapsedParticipants(parsed, collapsed) : applyPositionOverrides(
+    applyGroupOrdering(parsed.participants, parsed.groups, parsed.messages)
   );
   if (participants.length === 0) return null;
   const groupBoundaryIds = /* @__PURE__ */ new Set();
@@ -752,10 +818,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 +842,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 +1477,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 +1509,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;
@@ -1448,7 +1529,8 @@ function layoutSequence(parsed, containerWidth, options) {
     const padBottom = hasExpandedGroup ? groupBottomPad(group.depth, maxGroupDepth) : 0;
     const height = sBoxH + padTop + padBottom;
     const barHeight = ctx.structural(COLLAPSE_BAR_HEIGHT);
-    collapsedGroupBoxes.set(group.name, {
+    collapsedGroupBoxes.set(collapsedGroupId(group, parsed.groups), {
+      name: group.name,
       lineNumber: group.lineNumber,
       depth: group.depth,
       participantIds: group.participantIds,
@@ -1992,7 +2074,14 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
     const groupTagColor = getTagColor(groupTagValue);
     const fillColor = groupTagColor ? mix(groupTagColor, themeBaseBg(palette, isDark), isDark ? 15 : 20) : isDark ? palette.surface : palette.bg;
     const strokeColor = groupTagColor ?? palette.textMuted;
-    const groupG = svg.append("g").attr("class", "group-box-wrapper").attr("data-group-toggle", "").attr("data-group-line", String(group.lineNumber)).attr("tabindex", "0").attr("role", "button").attr("aria-expanded", "true").attr("aria-label", groupToggleName(group.name, group.participantIds)).attr("cursor", "pointer");
+    const source = parsed.groups.find((g) => g.lineNumber === group.lineNumber);
+    const collapsible = source !== void 0 && isCollapsibleGroup(source);
+    const groupG = svg.append("g").attr("class", "group-box-wrapper");
+    if (collapsible) groupG.attr("data-group-toggle", "");
+    groupG.attr("data-group-line", String(group.lineNumber));
+    if (collapsible) {
+      groupG.attr("tabindex", "0").attr("role", "button").attr("aria-expanded", "true").attr("aria-label", groupToggleName(group.name, group.participantIds)).attr("cursor", "pointer");
+    }
     groupG.append("rect").attr("x", frame.x).attr("y", frame.y).attr("width", frame.width).attr("height", frame.height).attr("rx", 6).attr("fill", fillColor).attr("stroke", strokeColor).attr("stroke-width", 1).attr("stroke-opacity", 0.5).attr("pointer-events", "none").attr("class", "group-box");
     groupG.append("rect").attr("x", frame.x).attr("y", frame.y).attr("width", frame.width).attr("height", frame.headerHeight).attr("fill", "transparent").attr("class", "group-label-hit");
     groupG.append("text").attr("x", frame.labelX).attr("y", frame.labelY).attr("text-anchor", "middle").attr("fill", strokeColor).attr("font-size", sGroupLabelSize).attr("font-weight", GROUP_LABEL_WEIGHT).attr("opacity", 0.7).attr("pointer-events", "none").attr("class", "group-label").text(group.name);
@@ -2029,10 +2118,7 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
       const participantG = svg.select(
         `.participant[data-participant-id="${participant.id}"]`
       );
-      participantG.attr("data-group-toggle", "").attr("data-group-line", String(meta.lineNumber)).attr("tabindex", "0").attr("role", "button").attr("aria-expanded", "false").attr(
-        "aria-label",
-        groupToggleName(participant.id, meta.participantIds)
-      ).attr("cursor", "pointer");
+      participantG.attr("data-group-toggle", "").attr("data-group-line", String(meta.lineNumber)).attr("tabindex", "0").attr("role", "button").attr("aria-expanded", "false").attr("aria-label", groupToggleName(meta.name, meta.participantIds)).attr("cursor", "pointer");
       const pFill = effectiveTagColor ? mix(effectiveTagColor, themeBaseBg(palette, isDark), isDark ? 30 : 40) : isDark ? mix(palette.overlay, palette.surface, 50) : mix(palette.bg, palette.surface, 50);
       const pStroke = effectiveTagColor ?? palette.border;
       participantG.append("rect").attr("x", -boxW / 2).attr("y", -padTop).attr("width", boxW).attr("height", fullH).attr("rx", 6).attr("fill", pFill).attr("stroke", pStroke).attr("stroke-width", 1.5);
@@ -2376,6 +2462,7 @@ export {
   buildRenderSequence,
   computeActivations,
   applyPositionOverrides,
+  foldCollapsedParticipants,
   applyGroupOrdering,
   layoutSequence,
   renderSequenceDiagram,

package/dist/{chunk-LRP5FXST.js → chunk-YQMIKX54.js}

@@ -1,3 +1,9 @@
+import {
+  getExtendedChartLegendGroups,
+  getSimpleChartLegendGroups,
+  parseChart,
+  parseExtendedChart
+} from "./chunk-H6BT45SN.js";
 import {
   computeQuadrantPointLabels,
   rectCircleOverlap,
@@ -6,17 +12,6 @@ import {
 import {
   MIN_CANVAS_WIDTH
 } from "./chunk-EPDBWATV.js";
-import {
-  getExtendedChartLegendGroups,
-  getSimpleChartLegendGroups,
-  parseChart,
-  parseExtendedChart
-} from "./chunk-H6BT45SN.js";
-import {
-  EMPHASIS_DIM_OPACITY,
-  EMPHASIS_DIM_TEXT_OPACITY,
-  resolveEmphasis
-} from "./chunk-2CW5ZTNH.js";
 import {
   EXPORT_HEIGHT,
   EXPORT_WIDTH,
@@ -25,19 +20,24 @@ import {
   initD3Chart,
   renderChartTitle,
   resolveExportPalette
-} from "./chunk-Q6W2K33N.js";
+} from "./chunk-6XLMTAEX.js";
 import {
-  layoutInlineHeader
-} from "./chunk-42UJ23H3.js";
+  EMPHASIS_DIM_OPACITY,
+  EMPHASIS_DIM_TEXT_OPACITY,
+  resolveEmphasis
+} from "./chunk-2CW5ZTNH.js";
 import {
-  computeLegendLayout
-} from "./chunk-JILEYZ2V.js";
+  layoutInlineHeader
+} from "./chunk-UIEKW4SG.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
   TITLE_OFFSET,
   TITLE_Y
 } from "./chunk-VLC6WNRD.js";
+import {
+  computeLegendLayout
+} from "./chunk-JILEYZ2V.js";
 import {
   FONT_FAMILY
 } from "./chunk-ICLB27PZ.js";
@@ -373,6 +373,7 @@ function drawValueLabel(svg, text, x, y, color, anchor = "middle") {
   svg.append("text").attr("x", x).attr("y", y).attr("text-anchor", anchor).attr("fill", color).attr("font-size", VALUE_FONT).attr("font-family", FONT_FAMILY).text(text);
 }
 var LABEL_ROTATE_DEG = 40;
+var NEVER_THIN_MAX = 12;
 var LABEL_GAP = 8;
 var LABEL_LINE_HEIGHT = 1.25;
 function spreadIndices(total, count) {
@@ -406,12 +407,12 @@ function planCategoryLabels(labels, slot, font = TICK_FONT) {
     };
   }
   const flatStride = Math.ceil(flatNeeds / slot);
-  if (flatStride <= 2) {
+  if (flatStride <= 2 && n > NEVER_THIN_MAX) {
     return { rotate: false, stride: 2, height: flatHeight, keep: all(2) };
   }
   const rad = LABEL_ROTATE_DEG * Math.PI / 180;
   const rotNeeds = font * LABEL_LINE_HEIGHT / Math.sin(rad);
-  const stride = Math.max(1, Math.ceil(rotNeeds / slot));
+  const stride = n <= NEVER_THIN_MAX ? 1 : Math.max(1, Math.ceil(rotNeeds / slot));
   return {
     rotate: true,
     stride,
@@ -1218,6 +1219,13 @@ function renderFunnel(svg, chart, width, height, colors, palette, isDark, topIns
 }
 
 // src/charts-d3/heatmap.ts
+var ROW_LABEL_SHARE = 0.35;
+var COL_LABEL_MAX_W = 140;
+var COL_BAND_SHARE = 0.3;
+var COL_ANGLE = 40 * Math.PI / 180;
+var ROW_FONT = 13;
+var COL_FONT = 12;
+var EDGE_GAP = 4;
 function renderHeatmap(svg, chart, width, height, palette, isDark, textColor, bgColor, topInset) {
   const rows = chart.heatmapRows ?? [];
   if (rows.length === 0) return;
@@ -1256,11 +1264,39 @@ function renderHeatmap(svg, chart, width, height, palette, isDark, textColor, bg
     const targetL = isDark ? 72 : 30;
     return hslToHex(h, targetS, targetL);
   };
-  const rowLabelW = Math.max(0, ...rows.map((r) => measureText(r.label, 13))) + 16;
+  const rowLabelMax = width * ROW_LABEL_SHARE;
+  const rowShown = rows.map(
+    (r) => truncateText(r.label, ROW_FONT, rowLabelMax)
+  );
+  const rowLabelW = Math.max(0, ...rowShown.map((t) => measureText(t, ROW_FONT))) + 16;
   const left = 20 + rowLabelW;
-  const top = topInset + 28;
-  const right = 24;
   const bottom = 24;
+  const cw0 = (width - left - 24) / ncols;
+  const rotate = cols.some((c) => measureText(c, COL_FONT) > cw0 * 0.85);
+  const colShown = rotate ? cols.map(
+    (c) => truncateText(
+      c,
+      COL_FONT,
+      Math.min(
+        COL_LABEL_MAX_W,
+        height * COL_BAND_SHARE / Math.sin(COL_ANGLE)
+      )
+    )
+  ) : cols;
+  const colW = colShown.map((c) => measureText(c, COL_FONT));
+  const sin = Math.sin(COL_ANGLE);
+  const cos = Math.cos(COL_ANGLE);
+  const band = rotate ? Math.max(28, 8 + Math.max(0, ...colW) * sin + COL_FONT * cos + EDGE_GAP) : 28;
+  const top = topInset + band;
+  let right = 24;
+  if (rotate) {
+    const P = width - left;
+    colW.forEach((w, i) => {
+      const reach = w * cos + COL_FONT * 0.25 * sin;
+      const need = P - ncols * (P - EDGE_GAP - reach) / (i + 0.5);
+      right = Math.max(right, need);
+    });
+  }
   const plotW = width - left - right;
   const plotH = height - top - bottom;
   const cw = plotW / ncols;
@@ -1276,10 +1312,10 @@ function renderHeatmap(svg, chart, width, height, palette, isDark, textColor, bg
     11,
     Math.min(ch * 0.55, cw * 0.7 * REF / maxValueW)
   );
-  const rotate = cols.some((c) => measureText(c, 12) > cw * 0.85);
   cols.forEach((c, ci) => {
     const x = left + ci * cw + cw / 2;
-    const t = svg.append("text").attr("class", "dgmo-axis-label").attr("data-filter-attr", "data-col-key").attr("data-filter-value", c).attr("fill", textColor).attr("font-size", 12).attr("font-family", FONT_FAMILY).text(c);
+    const t = svg.append("text").attr("class", "dgmo-axis-label").attr("data-filter-attr", "data-col-key").attr("data-filter-value", c).attr("fill", textColor).attr("font-size", COL_FONT).attr("font-family", FONT_FAMILY).text(colShown[ci]);
+    if (colShown[ci] !== c) t.append("title").text(c);
     if (rotate) {
       t.attr("transform", `translate(${x},${top - 8}) rotate(-40)`).attr(
         "text-anchor",
@@ -1290,7 +1326,8 @@ function renderHeatmap(svg, chart, width, height, palette, isDark, textColor, bg
     }
   });
   rows.forEach((row, ri) => {
-    svg.append("text").attr("class", "dgmo-axis-label").attr("data-filter-attr", "data-row-key").attr("data-filter-value", row.label).attr("x", left - 10).attr("y", top + ri * ch + ch / 2 + 4).attr("text-anchor", "end").attr("fill", textColor).attr("font-size", 13).attr("font-family", FONT_FAMILY).text(row.label);
+    const rowLabel = svg.append("text").attr("class", "dgmo-axis-label").attr("data-filter-attr", "data-row-key").attr("data-filter-value", row.label).attr("x", left - 10).attr("y", top + ri * ch + ch / 2 + 4).attr("text-anchor", "end").attr("fill", textColor).attr("font-size", ROW_FONT).attr("font-family", FONT_FAMILY).text(rowShown[ri]);
+    if (rowShown[ri] !== row.label) rowLabel.append("title").text(row.label);
     row.values.forEach((v, ci) => {
       const t = maxValue === minValue ? 0.5 : (v - minValue) / (maxValue - minValue);
       const ramp = gradientAt(t);

package/dist/{chunk-H5UEVW6Q.js → chunk-ZD3QCNB7.js}

@@ -25,7 +25,7 @@ import {
 
 // src/body/renderer.ts
 import * as d3Selection from "d3-selection";
-var esc = (s) => s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+var esc = (s) => s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
 function partAttrs(line, emph, tagAttr) {
   const tag = tagAttr && emph ? ` ${tagAttr}="${esc(emph)}"` : "";
   return ` class="dgmo-body-part" data-line-number="${line}" data-emph-key="${esc(emph)}"${tag}`;

package/dist/clock.js

@@ -196,6 +196,174 @@ function handAngles(h, m, s) {
   };
 }
 
+// src/colors.ts
+var nord = {
+  // Polar Night (dark)
+  nord0: "#2e3440",
+  nord1: "#3b4252",
+  nord2: "#434c5e",
+  nord3: "#4c566a",
+  // Snow Storm (light)
+  nord4: "#d8dee9",
+  nord5: "#e5e9f0",
+  nord6: "#eceff4",
+  // Frost (accent blues)
+  nord7: "#8fbcbb",
+  nord8: "#88c0d0",
+  nord9: "#81a1c1",
+  nord10: "#5e81ac",
+  // Aurora (colors)
+  nord11: "#bf616a",
+  // red
+  nord12: "#d08770",
+  // orange
+  nord13: "#ebcb8b",
+  // yellow
+  nord14: "#a3be8c",
+  // green
+  nord15: "#b48ead"
+  // purple
+};
+var colorNames = {
+  red: nord.nord11,
+  orange: nord.nord12,
+  yellow: nord.nord13,
+  green: nord.nord14,
+  blue: nord.nord10,
+  purple: nord.nord15,
+  teal: nord.nord7,
+  cyan: nord.nord8,
+  gray: nord.nord3,
+  black: nord.nord0,
+  white: nord.nord6
+};
+var RECOGNIZED_COLOR_NAMES = Object.freeze([
+  "red",
+  "orange",
+  "yellow",
+  "green",
+  "blue",
+  "purple",
+  "teal",
+  "cyan",
+  "gray",
+  "black",
+  "white"
+]);
+var CATEGORICAL_COLOR_ORDER = Object.freeze([
+  "red",
+  "green",
+  "blue",
+  "yellow",
+  "teal",
+  "purple",
+  "orange",
+  "cyan"
+]);
+var INVALID_CSS_COLOR_HEX = Object.freeze({
+  pink: "#ffc0cb",
+  hotpink: "#ff69b4",
+  deeppink: "#ff1493",
+  lightpink: "#ffb6c1",
+  palevioletred: "#db7093",
+  crimson: "#dc143c",
+  scarlet: "#ff2400",
+  firebrick: "#b22222",
+  darkred: "#8b0000",
+  maroon: "#800000",
+  salmon: "#fa8072",
+  lightsalmon: "#ffa07a",
+  darksalmon: "#e9967a",
+  coral: "#ff7f50",
+  lightcoral: "#f08080",
+  tomato: "#ff6347",
+  orangered: "#ff4500",
+  darkorange: "#ff8c00",
+  gold: "#ffd700",
+  goldenrod: "#daa520",
+  darkgoldenrod: "#b8860b",
+  khaki: "#f0e68c",
+  darkkhaki: "#bdb76b",
+  amber: "#ffbf00",
+  lavender: "#e6e6fa",
+  violet: "#ee82ee",
+  magenta: "#ff00ff",
+  fuchsia: "#ff00ff",
+  orchid: "#da70d6",
+  plum: "#dda0dd",
+  indigo: "#4b0082",
+  navy: "#000080",
+  midnightblue: "#191970",
+  darkblue: "#00008b",
+  mediumblue: "#0000cd",
+  royalblue: "#4169e1",
+  cornflowerblue: "#6495ed",
+  dodgerblue: "#1e90ff",
+  deepskyblue: "#00bfff",
+  skyblue: "#87ceeb",
+  lightskyblue: "#87cefa",
+  lightblue: "#add8e6",
+  powderblue: "#b0e0e6",
+  steelblue: "#4682b4",
+  slateblue: "#6a5acd",
+  cadetblue: "#5f9ea0",
+  turquoise: "#40e0d0",
+  aqua: "#00ffff",
+  aquamarine: "#7fffd4",
+  lime: "#00ff00",
+  limegreen: "#32cd32",
+  lightgreen: "#90ee90",
+  palegreen: "#98fb98",
+  seagreen: "#2e8b57",
+  mediumseagreen: "#3cb371",
+  forestgreen: "#228b22",
+  darkgreen: "#006400",
+  olive: "#808000",
+  olivedrab: "#6b8e23",
+  darkolivegreen: "#556b2f",
+  chartreuse: "#7fff00",
+  lawngreen: "#7cfc00",
+  springgreen: "#00ff7f",
+  greenyellow: "#adff2f",
+  brown: "#a52a2a",
+  sienna: "#a0522d",
+  chocolate: "#d2691e",
+  peru: "#cd853f",
+  tan: "#d2b48c",
+  beige: "#f5f5dc",
+  wheat: "#f5deb3",
+  ivory: "#fffff0",
+  silver: "#c0c0c0",
+  lightgray: "#d3d3d3",
+  lightgrey: "#d3d3d3",
+  darkgray: "#a9a9a9",
+  darkgrey: "#a9a9a9",
+  dimgray: "#696969",
+  dimgrey: "#696969",
+  slategray: "#708090",
+  slategrey: "#708090",
+  gainsboro: "#dcdcdc",
+  grey: "#808080"
+});
+var seriesColors = [
+  nord.nord10,
+  // blue
+  nord.nord14,
+  // green
+  nord.nord13,
+  // yellow
+  nord.nord12,
+  // orange
+  nord.nord15,
+  // purple
+  nord.nord11,
+  // red
+  nord.nord7,
+  // teal
+  nord.nord8
+  // light blue
+];
+
 // src/palettes/color-utils.ts
 var MIX_CACHE = /* @__PURE__ */ new Map();
 var MIX_CACHE_MAX = 5e3;