@diagrammo/dgmo 0.76.0 → 0.78.0

package/dist/{chunk-YVDBBWEP.js → chunk-UCF6TKWV.js}

@@ -5,18 +5,23 @@ import {
 import {
   ScaleContext
 } from "./chunk-24YPR5EH.js";
+import {
+  EDGE_DASH,
+  GRID_DASH,
+  scaleDash
+} from "./chunk-IIEI7VK5.js";
 import {
   createTooltip,
   hideTooltip,
   renderChartTitle,
   showTooltip
-} from "./chunk-UBW53CNS.js";
+} from "./chunk-3XFOE3DQ.js";
 import {
   renderIntegratedLegend
-} from "./chunk-QT5UMFPE.js";
+} from "./chunk-67I3HFSF.js";
 import {
   FONT_FAMILY
-} from "./chunk-UTCPNJND.js";
+} from "./chunk-ICLB27PZ.js";
 import {
   LEGEND_CAPSULE_PAD,
   LEGEND_DOT_R,
@@ -29,35 +34,33 @@ import {
   legendChromeColors,
   measureLegendText,
   truncateLegendText
-} from "./chunk-YT5ICQ4R.js";
+} from "./chunk-MFK7LF66.js";
 import {
   parseTimelineDate
 } from "./chunk-UCZBRGJN.js";
 import {
   resolveTagColor,
   tagAttrKey
-} from "./chunk-76LHNLGX.js";
+} from "./chunk-R4YGH7DJ.js";
+import {
+  DEFAULT_PALETTE_ID,
+  getPalette
+} from "./chunk-IDJGV6VM.js";
 import {
+  getEraColors,
   getSeriesColors,
   mix,
   shapeFill,
   themeBaseBg
-} from "./chunk-GLREDNBA.js";
+} from "./chunk-YVLTNNME.js";
 
 // src/timeline/renderer.ts
 import * as d3Scale from "d3-scale";
 import * as d3Selection from "d3-selection";
-function getEraColors(palette) {
-  return [
-    palette.colors.blue,
-    palette.colors.green,
-    palette.colors.yellow,
-    palette.colors.orange,
-    palette.colors.purple
-  ];
-}
 function renderEras(g, eras, scale, isVertical, innerWidth, innerHeight, onEnter, onLeave, hasScale = false, _tooltip = null, palette, reservedLabelY, fillMode, outlineBg) {
-  const eraColors = palette ? getEraColors(palette) : ["#3b6ea5", "#5b9357", "#c9a227", "#cc7a33", "#7d5ba6"];
+  const eraColors = getEraColors(
+    palette ?? getPalette(DEFAULT_PALETTE_ID).light
+  );
   eras.forEach((era, i) => {
     const startVal = parseTimelineDate(era.startDate);
     const endVal = parseTimelineDate(era.endDate);
@@ -84,7 +87,7 @@ function renderEras(g, eras, scale, isVertical, innerWidth, innerHeight, onEnter
       applyEraFill(
         eraG.append("rect").attr("x", 0).attr("y", y).attr("width", innerWidth).attr("height", h)
       );
-      labelEl = eraG.append("text").attr("x", 6).attr("y", y + 18).attr("text-anchor", "start").attr("fill", color).attr("font-size", "13px").attr("font-weight", "600").attr("opacity", 0.8).text(displayLabel);
+      labelEl = eraG.append("text").attr("x", 6).attr("y", y + 18).attr("text-anchor", "start").attr("fill", color).attr("font-size", 13).attr("font-weight", "bold").attr("opacity", 0.8).text(displayLabel);
     } else {
       const x = Math.min(start, end);
       const w = Math.abs(end - start);
@@ -99,7 +102,7 @@ function renderEras(g, eras, scale, isVertical, innerWidth, innerHeight, onEnter
         displayLabel = truncateLegendText(era.label, 13, maxW, { bold: true });
         truncated = displayLabel !== era.label;
       }
-      labelEl = eraG.append("text").attr("x", x + w / 2).attr("y", labelY).attr("text-anchor", "middle").attr("fill", color).attr("font-size", "13px").attr("font-weight", "600").attr("opacity", 0.8).text(displayLabel);
+      labelEl = eraG.append("text").attr("x", x + w / 2).attr("y", labelY).attr("text-anchor", "middle").attr("fill", color).attr("font-size", 13).attr("font-weight", "bold").attr("opacity", 0.8).text(displayLabel);
     }
     eraG.on("mouseenter", function() {
       onEnter(startVal, endVal);
@@ -135,8 +138,8 @@ function renderMarkers(g, markers, scale, isVertical, innerWidth, innerHeight, o
     };
     const markerG = g.append("g").attr("class", "tl-marker").attr("data-marker-date", String(dateVal)).attr("data-line-number", String(marker.lineNumber)).style("cursor", "pointer");
     if (isVertical) {
-      markerG.append("line").attr("x1", 0).attr("y1", pos).attr("x2", innerWidth).attr("y2", pos).attr("stroke", color).attr("stroke-width", 1.5).attr("stroke-dasharray", "6 4").attr("opacity", lineOpacity);
-      markerG.append("text").attr("x", -diamondSize - 8).attr("y", pos - diamondSize - 4).attr("text-anchor", "middle").attr("fill", color).attr("font-size", "11px").attr("font-weight", "600").text(marker.label);
+      markerG.append("line").attr("x1", 0).attr("y1", pos).attr("x2", innerWidth).attr("y2", pos).attr("stroke", color).attr("stroke-width", 1.5).attr("stroke-dasharray", EDGE_DASH).attr("opacity", lineOpacity);
+      markerG.append("text").attr("x", -diamondSize - 8).attr("y", pos - diamondSize - 4).attr("text-anchor", "middle").attr("fill", color).attr("font-size", 11).attr("font-weight", "bold").text(marker.label);
       applyDiamondFill(
         markerG.append("path").attr(
           "d",
@@ -169,14 +172,14 @@ function renderMarkers(g, markers, scale, isVertical, innerWidth, innerHeight, o
         });
         truncated = displayLabel !== marker.label;
       }
-      const labelEl = markerG.append("text").attr("x", pos).attr("y", labelY).attr("text-anchor", "middle").attr("fill", color).attr("font-size", "11px").attr("font-weight", "600").text(displayLabel);
+      const labelEl = markerG.append("text").attr("x", pos).attr("y", labelY).attr("text-anchor", "middle").attr("fill", color).attr("font-size", 11).attr("font-weight", "bold").text(displayLabel);
       applyDiamondFill(
         markerG.append("path").attr(
           "d",
           `M${pos},${diamondY - diamondSize} l${diamondSize},${diamondSize} l-${diamondSize},${diamondSize} l-${diamondSize},-${diamondSize} Z`
         )
       );
-      markerG.append("line").attr("x1", pos).attr("y1", lineTop).attr("x2", pos).attr("y2", innerHeight).attr("stroke", color).attr("stroke-width", 1.5).attr("stroke-dasharray", "6 4").attr("opacity", lineOpacity);
+      markerG.append("line").attr("x1", pos).attr("y1", lineTop).attr("x2", pos).attr("y2", innerHeight).attr("stroke", color).attr("stroke-width", 1.5).attr("stroke-dasharray", EDGE_DASH).attr("opacity", lineOpacity);
       markerG.on("mouseenter", function() {
         onEnter(dateVal);
         if (truncated) labelEl.text(marker.label);
@@ -238,17 +241,17 @@ function renderTimeScale(g, scale, isVertical, innerWidth, innerHeight, textColo
   const guideOpacity = 0.15;
   for (const tick of ticks) {
     if (isVertical) {
-      g.append("line").attr("x1", 0).attr("y1", tick.pos).attr("x2", innerWidth).attr("y2", tick.pos).attr("stroke", textColor).attr("stroke-width", 1).attr("stroke-dasharray", "4 4").attr("opacity", guideOpacity);
+      g.append("line").attr("x1", 0).attr("y1", tick.pos).attr("x2", innerWidth).attr("y2", tick.pos).attr("stroke", textColor).attr("stroke-width", 1).attr("stroke-dasharray", GRID_DASH).attr("opacity", guideOpacity);
       g.append("line").attr("x1", -tickLen).attr("y1", tick.pos).attr("x2", 0).attr("y2", tick.pos).attr("stroke", textColor).attr("stroke-width", 1).attr("opacity", opacity);
-      g.append("text").attr("x", -tickLen - 3).attr("y", tick.pos).attr("dy", "0.35em").attr("text-anchor", "end").attr("fill", textColor).attr("font-size", "10px").attr("opacity", opacity).text(tick.label);
+      g.append("text").attr("x", -tickLen - 3).attr("y", tick.pos).attr("dy", "0.35em").attr("text-anchor", "end").attr("fill", textColor).attr("font-size", 10).attr("opacity", opacity).text(tick.label);
       g.append("line").attr("x1", innerWidth).attr("y1", tick.pos).attr("x2", innerWidth + tickLen).attr("y2", tick.pos).attr("stroke", textColor).attr("stroke-width", 1).attr("opacity", opacity);
-      g.append("text").attr("x", innerWidth + tickLen + 3).attr("y", tick.pos).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", "10px").attr("opacity", opacity).text(tick.label);
+      g.append("text").attr("x", innerWidth + tickLen + 3).attr("y", tick.pos).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", 10).attr("opacity", opacity).text(tick.label);
     } else {
-      g.append("line").attr("class", "tl-scale-tick").attr("x1", tick.pos).attr("y1", 0).attr("x2", tick.pos).attr("y2", innerHeight).attr("stroke", textColor).attr("stroke-width", 1).attr("stroke-dasharray", "4 4").attr("opacity", guideOpacity);
+      g.append("line").attr("class", "tl-scale-tick").attr("x1", tick.pos).attr("y1", 0).attr("x2", tick.pos).attr("y2", innerHeight).attr("stroke", textColor).attr("stroke-width", 1).attr("stroke-dasharray", GRID_DASH).attr("opacity", guideOpacity);
       g.append("line").attr("class", "tl-scale-tick").attr("x1", tick.pos).attr("y1", innerHeight).attr("x2", tick.pos).attr("y2", innerHeight + tickLen).attr("stroke", textColor).attr("stroke-width", 1).attr("opacity", opacity);
-      g.append("text").attr("class", "tl-scale-tick").attr("x", tick.pos).attr("y", innerHeight + tickLen + 12).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", "10px").attr("opacity", opacity).text(tick.label);
+      g.append("text").attr("class", "tl-scale-tick").attr("x", tick.pos).attr("y", innerHeight + tickLen + 12).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", 10).attr("opacity", opacity).text(tick.label);
       g.append("line").attr("class", "tl-scale-tick").attr("x1", tick.pos).attr("y1", -tickLen).attr("x2", tick.pos).attr("y2", 0).attr("stroke", textColor).attr("stroke-width", 1).attr("opacity", opacity);
-      g.append("text").attr("class", "tl-scale-tick").attr("x", tick.pos).attr("y", -tickLen - 4).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", "10px").attr("opacity", opacity).text(tick.label);
+      g.append("text").attr("class", "tl-scale-tick").attr("x", tick.pos).attr("y", -tickLen - 4).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", 10).attr("opacity", opacity).text(tick.label);
     }
   }
 }
@@ -257,15 +260,15 @@ function showEventDatesOnScale(g, scale, startDate, endDate, innerHeight, accent
   const tickLen = 6;
   const startPos = scale(parseTimelineDate(startDate));
   const startLabel = formatDateLabel(startDate);
-  g.append("line").attr("class", "tl-event-date").attr("x1", startPos).attr("y1", -tickLen).attr("x2", startPos).attr("y2", innerHeight).attr("stroke", accentColor).attr("stroke-width", 1.5).attr("stroke-dasharray", "4 4").attr("opacity", 0.6);
-  g.append("text").attr("class", "tl-event-date").attr("x", startPos).attr("y", -tickLen - 4).attr("text-anchor", "middle").attr("fill", accentColor).attr("font-size", "10px").attr("font-weight", "600").text(startLabel);
-  g.append("text").attr("class", "tl-event-date").attr("x", startPos).attr("y", innerHeight + tickLen + 12).attr("text-anchor", "middle").attr("fill", accentColor).attr("font-size", "10px").attr("font-weight", "600").text(startLabel);
+  g.append("line").attr("class", "tl-event-date").attr("x1", startPos).attr("y1", -tickLen).attr("x2", startPos).attr("y2", innerHeight).attr("stroke", accentColor).attr("stroke-width", 1.5).attr("stroke-dasharray", GRID_DASH).attr("opacity", 0.6);
+  g.append("text").attr("class", "tl-event-date").attr("x", startPos).attr("y", -tickLen - 4).attr("text-anchor", "middle").attr("fill", accentColor).attr("font-size", 10).attr("font-weight", "bold").text(startLabel);
+  g.append("text").attr("class", "tl-event-date").attr("x", startPos).attr("y", innerHeight + tickLen + 12).attr("text-anchor", "middle").attr("fill", accentColor).attr("font-size", 10).attr("font-weight", "bold").text(startLabel);
   if (endDate) {
     const endPos = scale(parseTimelineDate(endDate));
     const endLabel = formatDateLabel(endDate);
-    g.append("line").attr("class", "tl-event-date").attr("x1", endPos).attr("y1", -tickLen).attr("x2", endPos).attr("y2", innerHeight).attr("stroke", accentColor).attr("stroke-width", 1.5).attr("stroke-dasharray", "4 4").attr("opacity", 0.6);
-    g.append("text").attr("class", "tl-event-date").attr("x", endPos).attr("y", -tickLen - 4).attr("text-anchor", "middle").attr("fill", accentColor).attr("font-size", "10px").attr("font-weight", "600").text(endLabel);
-    g.append("text").attr("class", "tl-event-date").attr("x", endPos).attr("y", innerHeight + tickLen + 12).attr("text-anchor", "middle").attr("fill", accentColor).attr("font-size", "10px").attr("font-weight", "600").text(endLabel);
+    g.append("line").attr("class", "tl-event-date").attr("x1", endPos).attr("y1", -tickLen).attr("x2", endPos).attr("y2", innerHeight).attr("stroke", accentColor).attr("stroke-width", 1.5).attr("stroke-dasharray", GRID_DASH).attr("opacity", 0.6);
+    g.append("text").attr("class", "tl-event-date").attr("x", endPos).attr("y", -tickLen - 4).attr("text-anchor", "middle").attr("fill", accentColor).attr("font-size", 10).attr("font-weight", "bold").text(endLabel);
+    g.append("text").attr("class", "tl-event-date").attr("x", endPos).attr("y", innerHeight + tickLen + 12).attr("text-anchor", "middle").attr("fill", accentColor).attr("font-size", 10).attr("font-weight", "bold").text(endLabel);
   }
 }
 function hideEventDatesOnScale(g) {
@@ -296,7 +299,7 @@ function renderTimelineGroupLegend(g, groups, groupColorMap, textColor, palette,
     const itemG = g.append("g").attr("class", "tl-legend-item").attr("data-group", grp.name).style("cursor", "pointer").on("mouseenter", () => onHover(grp.name)).on("mouseleave", () => onLeave());
     itemG.append("rect").attr("x", legendX).attr("y", legendY - PILL_H / 2).attr("width", pillW).attr("height", PILL_H).attr("rx", PILL_H / 2).attr("fill", pillBg);
     itemG.append("circle").attr("cx", legendX + PAD_X + DOT_R).attr("cy", legendY).attr("r", DOT_R).attr("fill", color);
-    itemG.append("text").attr("x", legendX + PAD_X + DOT_R * 2 + DOT_GAP).attr("y", legendY).attr("dy", "0.35em").attr("fill", textColor).attr("font-size", `${FONT_SIZE}px`).attr("font-family", FONT_FAMILY).text(grp.name);
+    itemG.append("text").attr("x", legendX + PAD_X + DOT_R * 2 + DOT_GAP).attr("y", legendY).attr("dy", "0.35em").attr("fill", textColor).attr("font-size", FONT_SIZE).attr("font-family", FONT_FAMILY).text(grp.name);
     legendX += pillW + GAP;
   }
 }
@@ -933,13 +936,13 @@ function renderTimelineHorizontalTimeSort(container, parsed, palette, isDark, se
       }
       evG.append("rect").attr("x", x).attr("y", y - sBarH / 2).attr("width", rectW).attr("height", sBarH).attr("rx", sBarRx).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", sBarStroke);
       if (labelFitsInside) {
-        evG.append("text").attr("x", x + ctx.aesthetic(8)).attr("y", y).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", `${sEventFont}px`).text(ev.label);
+        evG.append("text").attr("x", x + ctx.aesthetic(8)).attr("y", y).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", textColor).attr("font-size", sEventFont).text(ev.label);
       } else {
         const sLabelGap = ctx.aesthetic(6);
         const wouldFlipLeft = x + rectW > innerWidth * 0.6;
         const labelFitsLeft = x - sLabelGap - estLabelWidth > 0;
         const flipLeft = wouldFlipLeft && labelFitsLeft;
-        evG.append("text").attr("x", flipLeft ? x - sLabelGap : x + rectW + sLabelGap).attr("y", y).attr("dy", "0.35em").attr("text-anchor", flipLeft ? "end" : "start").attr("fill", textColor).attr("font-size", `${sEventFont}px`).text(ev.label);
+        evG.append("text").attr("x", flipLeft ? x - sLabelGap : x + rectW + sLabelGap).attr("y", y).attr("dy", "0.35em").attr("text-anchor", flipLeft ? "end" : "start").attr("fill", textColor).attr("font-size", sEventFont).text(ev.label);
       }
     } else {
       const estLabelWidth = ev.label.length * sCharW;
@@ -948,7 +951,7 @@ function renderTimelineHorizontalTimeSort(container, parsed, palette, isDark, se
       const labelFitsLeft = x - sPointGap - estLabelWidth > 0;
       const flipLeft = wouldFlipLeft && labelFitsLeft;
       evG.append("circle").attr("cx", x).attr("cy", y).attr("r", sPointR).attr("fill", shapeFill(palette, color, isDark, { mode: fillMode })).attr("stroke", color).attr("stroke-width", sPointStroke);
-      evG.append("text").attr("x", flipLeft ? x - sPointGap : x + sPointGap).attr("y", y).attr("dy", "0.35em").attr("text-anchor", flipLeft ? "end" : "start").attr("fill", textColor).attr("font-size", `${sEventFontSm}px`).text(ev.label);
+      evG.append("text").attr("x", flipLeft ? x - sPointGap : x + sPointGap).attr("y", y).attr("dy", "0.35em").attr("text-anchor", flipLeft ? "end" : "start").attr("fill", textColor).attr("font-size", sEventFontSm).text(ev.label);
     }
   });
 }
@@ -1118,7 +1121,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}px`).attr("font-weight", "600").text(`${toggleIcon} ${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}`);
     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));
@@ -1172,7 +1175,7 @@ function renderTimelineHorizontalGrouped(container, parsed, palette, isDark, set
       const evColor = eventColor(ev);
       const isPoint = !ev.endDate;
       const icon = isPoint ? "\u25C6" : "\u25CF";
-      const labelEl = evG.append("text").attr("class", "tl-event-label").attr("x", -margin.left + ctx.aesthetic(20)).attr("y", y).attr("dy", "0.35em").attr("text-anchor", "start").attr("font-size", `${sEventFont}px`).attr("fill", textColor);
+      const labelEl = evG.append("text").attr("class", "tl-event-label").attr("x", -margin.left + ctx.aesthetic(20)).attr("y", y).attr("dy", "0.35em").attr("text-anchor", "start").attr("font-size", sEventFont).attr("fill", textColor);
       labelEl.append("tspan").attr("fill", evColor).text(icon);
       labelEl.append("tspan").attr("fill", textColor).text(" " + ev.label);
       if (ev.endDate) {
@@ -1252,7 +1255,7 @@ function renderTimelineVertical(container, parsed, palette, isDark, setup, hover
   const sEventFontSm = ctx.text(11);
   const sDateFont = ctx.text(10);
   const sLaneHeaderFont = ctx.text(12);
-  const sDash = `${ctx.structural(4)},${ctx.structural(4)}`;
+  const sDash = scaleDash(GRID_DASH, (n) => ctx.structural(n));
   const useGroupedVertical = tagLanes != null || timelineSort === "group" && timelineGroups.length > 0;
   if (useGroupedVertical) {
     let laneNames;
@@ -1356,7 +1359,7 @@ function renderTimelineVertical(container, parsed, palette, isDark, setup, hover
       const laneColor = groupColorMap.get(laneName) ?? textColor;
       const laneCenter = laneX + laneWidth / 2;
       const headerG = g.append("g").attr("class", "tl-lane-header").attr("data-group", laneName).style("cursor", "pointer").on("mouseenter", () => fadeToGroup(g, laneName)).on("mouseleave", () => fadeReset(g));
-      headerG.append("text").attr("x", laneCenter).attr("y", -ctx.structural(15)).attr("text-anchor", "middle").attr("fill", laneColor).attr("font-size", `${sLaneHeaderFont}px`).attr("font-weight", "600").text(laneName);
+      headerG.append("text").attr("x", laneCenter).attr("y", -ctx.structural(15)).attr("text-anchor", "middle").attr("fill", laneColor).attr("font-size", sLaneHeaderFont).attr("font-weight", "bold").text(laneName);
       g.append("line").attr("x1", laneCenter).attr("y1", 0).attr("x2", laneCenter).attr("y2", innerHeight).attr("stroke", mutedColor).attr("stroke-width", 1).attr("stroke-dasharray", sDash);
       const laneEvents = laneEventsByName.get(laneName) ?? [];
       for (const ev of laneEvents) {
@@ -1406,13 +1409,13 @@ function renderTimelineVertical(container, parsed, palette, isDark, setup, hover
             stroke = `url(#${strokeGradientId})`;
           }
           evG.append("rect").attr("x", laneCenter - sBarW / 2).attr("y", y).attr("width", sBarW).attr("height", rectH).attr("rx", sBarRx).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", sBarStroke);
-          evG.append("text").attr("x", laneCenter + sBarW + ctx.aesthetic(2)).attr("y", y + rectH / 2).attr("dy", "0.35em").attr("fill", textColor).attr("font-size", `${sEventFont}px`).text(ev.label);
+          evG.append("text").attr("x", laneCenter + sBarW + ctx.aesthetic(2)).attr("y", y + rectH / 2).attr("dy", "0.35em").attr("fill", textColor).attr("font-size", sEventFont).text(ev.label);
         } else {
           evG.append("circle").attr("cx", laneCenter).attr("cy", y).attr("r", sPointR).attr(
             "fill",
             shapeFill(palette, evColor, isDark, { mode: fillMode })
           ).attr("stroke", evColor).attr("stroke-width", sPointStroke);
-          evG.append("text").attr("x", laneCenter + ctx.aesthetic(10)).attr("y", y).attr("dy", "0.35em").attr("fill", textColor).attr("font-size", `${sEventFont}px`).text(ev.label);
+          evG.append("text").attr("x", laneCenter + ctx.aesthetic(10)).attr("y", y).attr("dy", "0.35em").attr("fill", textColor).attr("font-size", sEventFont).text(ev.label);
         }
       }
     });
@@ -1547,10 +1550,10 @@ function renderTimelineVertical(container, parsed, palette, isDark, setup, hover
           stroke = `url(#${strokeGradientId})`;
         }
         evG.append("rect").attr("x", axisX - sBarW / 2).attr("y", y).attr("width", sBarW).attr("height", rectH).attr("rx", sBarRx).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", sBarStroke);
-        evG.append("text").attr("x", axisX + sBarW + ctx.aesthetic(4)).attr("y", y + rectH / 2).attr("dy", "0.35em").attr("fill", textColor).attr("font-size", `${sEventFontSm}px`).text(ev.label);
+        evG.append("text").attr("x", axisX + sBarW + ctx.aesthetic(4)).attr("y", y + rectH / 2).attr("dy", "0.35em").attr("fill", textColor).attr("font-size", sEventFontSm).text(ev.label);
       } else {
         evG.append("circle").attr("cx", axisX).attr("cy", y).attr("r", sPointR).attr("fill", shapeFill(palette, color, isDark, { mode: fillMode })).attr("stroke", color).attr("stroke-width", sPointStroke);
-        evG.append("text").attr("x", axisX + sBarW + ctx.aesthetic(4)).attr("y", y).attr("dy", "0.35em").attr("fill", textColor).attr("font-size", `${sEventFontSm}px`).text(ev.label);
+        evG.append("text").attr("x", axisX + sBarW + ctx.aesthetic(4)).attr("y", y).attr("dy", "0.35em").attr("fill", textColor).attr("font-size", sEventFontSm).text(ev.label);
       }
       evG.append("text").attr("x", axisX - ctx.aesthetic(14)).attr(
         "y",
@@ -1558,7 +1561,7 @@ function renderTimelineVertical(container, parsed, palette, isDark, setup, hover
           yScale(parseTimelineDate(ev.endDate)) - yScale(parseTimelineDate(ev.date)),
           4
         ) / 2 : y
-      ).attr("dy", "0.35em").attr("text-anchor", "end").attr("fill", mutedColor).attr("font-size", `${sDateFont}px`).text(ev.date + (ev.endDate ? `\u2192${ev.endDate}` : ""));
+      ).attr("dy", "0.35em").attr("text-anchor", "end").attr("fill", mutedColor).attr("font-size", sDateFont).text(ev.date + (ev.endDate ? `\u2192${ev.endDate}` : ""));
     }
   }
 }
@@ -1672,4 +1675,4 @@ export {
   formatDateLabel,
   renderTimeline
 };
-//# sourceMappingURL=chunk-YVDBBWEP.js.map
+//# sourceMappingURL=chunk-UCF6TKWV.js.map

package/dist/{chunk-UWYZIGCB.js → chunk-UDYJVX6Y.js}

@@ -1,9 +1,9 @@
 import {
   wrapDescriptionLines
-} from "./chunk-NCT22MOD.js";
+} from "./chunk-WMIKC5XO.js";
 import {
   renderInlineText
-} from "./chunk-WGC42WJU.js";
+} from "./chunk-FWNJDD4U.js";
 import {
   ScaleContext
 } from "./chunk-24YPR5EH.js";
@@ -11,10 +11,10 @@ import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
   TITLE_Y
-} from "./chunk-DEW62ON3.js";
+} from "./chunk-VSPNH7LC.js";
 import {
   FONT_FAMILY
-} from "./chunk-UTCPNJND.js";
+} from "./chunk-ICLB27PZ.js";
 import {
   CHAR_WIDTH_RATIO,
   measureText
@@ -26,7 +26,7 @@ import {
   contrastText,
   getSeriesColors,
   shapeFill
-} from "./chunk-GLREDNBA.js";
+} from "./chunk-YVLTNNME.js";
 import {
   resolveColor
 } from "./chunk-XOGQY4EC.js";
@@ -144,7 +144,7 @@ function renderPyramid(container, parsed, palette, isDark, onClickItem, exportDi
     );
     const labelFitsInside = Math.min(topHalf, botHalf) * 2 > measureText(layer.label, layout.labelFont, { bold: true });
     const haloColor = textColor === palette.textOnFillLight ? palette.textOnFillDark : palette.textOnFillLight;
-    const labelText = layerG.append("text").attr("x", layout.pyramidCx).attr("y", midY).attr("dy", "0.35em").attr("text-anchor", "middle").attr("fill", textColor).attr("font-family", FONT_FAMILY).attr("font-size", layout.labelFont).attr("font-weight", 600);
+    const labelText = layerG.append("text").attr("x", layout.pyramidCx).attr("y", midY).attr("dy", "0.35em").attr("text-anchor", "middle").attr("fill", textColor).attr("font-family", FONT_FAMILY).attr("font-size", layout.labelFont).attr("font-weight", "bold");
     if (!labelFitsInside) {
       labelText.attr("paint-order", "stroke fill").attr("stroke", haloColor).attr("stroke-width", 3).attr("stroke-linejoin", "round").attr("stroke-opacity", 0.6);
     }
@@ -406,9 +406,9 @@ function renderDescriptionVariant(args) {
     const y = startY + j * descLineHeight;
     const isBullet = line.kind === "bullet-first" || line.kind === "bullet-cont";
     if (line.kind === "bullet-first") {
-      descG.append("text").attr("x", bulletColLeftX).attr("y", y).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", palette.text).attr("font-family", FONT_FAMILY).attr("font-size", descFont).attr("font-weight", j === 0 ? 500 : 400).text("\u2022");
+      descG.append("text").attr("x", bulletColLeftX).attr("y", y).attr("dy", "0.35em").attr("text-anchor", "start").attr("fill", palette.text).attr("font-family", FONT_FAMILY).attr("font-size", descFont).attr("font-weight", "normal").text("\u2022");
     }
-    const t = descG.append("text").attr("x", isBullet ? bulletColLeftX + BULLET_BODY_INDENT : textX).attr("y", y).attr("dy", "0.35em").attr("text-anchor", isBullet ? "start" : textAnchor).attr("fill", palette.text).attr("font-family", FONT_FAMILY).attr("font-size", descFont).attr("font-weight", j === 0 ? 500 : 400);
+    const t = descG.append("text").attr("x", isBullet ? bulletColLeftX + BULLET_BODY_INDENT : textX).attr("y", y).attr("dy", "0.35em").attr("text-anchor", isBullet ? "start" : textAnchor).attr("fill", palette.text).attr("font-family", FONT_FAMILY).attr("font-size", descFont).attr("font-weight", "normal");
     renderInlineText(t, line.text, palette);
   }
 }
@@ -428,4 +428,4 @@ export {
   renderPyramid,
   renderPyramidForExport
 };
-//# sourceMappingURL=chunk-UWYZIGCB.js.map
+//# sourceMappingURL=chunk-UDYJVX6Y.js.map

package/dist/{chunk-OBYZU23V.js → chunk-UQY2VLUK.js}

@@ -1,39 +1,43 @@
 import {
-  edgeSplinePath,
-  fitDiagramToCanvas
-} from "./chunk-7IATMZSA.js";
+  edgeSplinePath
+} from "./chunk-26EVL454.js";
 import {
   layoutGraph
-} from "./chunk-N6MZSBOL.js";
-import {
-  appendArrowheadMarkers
-} from "./chunk-LP7EC4MI.js";
+} from "./chunk-AN7T6VP7.js";
 import {
   NOTE_BADGE_RADIUS,
   noteConnectorPoints,
   renderNoteBadge,
   renderNoteBox,
   renderNoteConnector
-} from "./chunk-Q74GP3GK.js";
+} from "./chunk-KO6DGOOB.js";
 import {
-  EDGE_LABEL_KNOCKOUT_OPACITY,
-  EDGE_STROKE_WIDTH,
-  NODE_STROKE_WIDTH
-} from "./chunk-FJ57274M.js";
+  appendArrowheadMarkers
+} from "./chunk-XBJJP2HN.js";
+import {
+  fitDiagramToCanvas
+} from "./chunk-EPDBWATV.js";
 import {
   ScaleContext
 } from "./chunk-24YPR5EH.js";
+import {
+  ARROWHEAD_HEIGHT,
+  ARROWHEAD_WIDTH,
+  EDGE_LABEL_KNOCKOUT_OPACITY,
+  EDGE_STROKE_WIDTH,
+  NODE_STROKE_WIDTH
+} from "./chunk-IIEI7VK5.js";
 import {
   serializeSvg
-} from "./chunk-RU2HHHYA.js";
+} from "./chunk-LD2JSKU3.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT,
   TITLE_Y
-} from "./chunk-DEW62ON3.js";
+} from "./chunk-VSPNH7LC.js";
 import {
   FONT_FAMILY
-} from "./chunk-UTCPNJND.js";
+} from "./chunk-ICLB27PZ.js";
 import {
   measureText
 } from "./chunk-MTGGOCND.js";
@@ -46,7 +50,7 @@ import {
 import {
   contrastText,
   shapeFill
-} from "./chunk-GLREDNBA.js";
+} from "./chunk-YVLTNNME.js";
 
 // src/graph/flowchart-renderer.ts
 import * as d3Selection from "d3-selection";
@@ -54,8 +58,6 @@ var DIAGRAM_PADDING = 20;
 var MAX_SCALE = 3;
 var NODE_FONT_SIZE = 13;
 var EDGE_LABEL_FONT_SIZE = 11;
-var ARROWHEAD_W = 10;
-var ARROWHEAD_H = 7;
 var IO_SKEW = 15;
 var SUBROUTINE_INSET = 8;
 var DOC_WAVE_HEIGHT = 10;
@@ -318,8 +320,8 @@ function renderFlowchart(container, graph, layout, palette, isDark, onClickItem,
   const sEdgeLabelFontSize = ctx.text(EDGE_LABEL_FONT_SIZE);
   const sEdgeStrokeWidth = ctx.structural(EDGE_STROKE_WIDTH);
   const sNodeStrokeWidth = ctx.structural(NODE_STROKE_WIDTH);
-  const sArrowheadW = ctx.structural(ARROWHEAD_W);
-  const sArrowheadH = ctx.structural(ARROWHEAD_H);
+  const sArrowheadW = ctx.structural(ARROWHEAD_WIDTH);
+  const sArrowheadH = ctx.structural(ARROWHEAD_HEIGHT);
   const sIoSkew = ctx.structural(IO_SKEW);
   const sSubroutineInset = ctx.structural(SUBROUTINE_INSET);
   const sDocWaveHeight = ctx.structural(DOC_WAVE_HEIGHT);
@@ -327,7 +329,7 @@ function renderFlowchart(container, graph, layout, palette, isDark, onClickItem,
   const titleHeight = showTitle ? 40 : 0;
   const diagramW = layout.width;
   const diagramH = layout.height;
-  const { scale, offsetX, offsetY, canvasHeight } = fitDiagramToCanvas({
+  const { scale, offsetX, offsetY, canvasHeight, canvasWidth } = fitDiagramToCanvas({
     width,
     height,
     diagramW,
@@ -337,7 +339,7 @@ function renderFlowchart(container, graph, layout, palette, isDark, onClickItem,
     maxScale: MAX_SCALE,
     exportMode: !!exportDims
   });
-  const svg = d3Selection.select(container).append("svg").attr("width", width).attr("height", canvasHeight).attr("viewBox", `0 0 ${width} ${canvasHeight}`).attr("preserveAspectRatio", "xMidYMin meet").style("font-family", FONT_FAMILY);
+  const svg = d3Selection.select(container).append("svg").attr("width", canvasWidth).attr("height", canvasHeight).attr("viewBox", `0 0 ${canvasWidth} ${canvasHeight}`).attr("preserveAspectRatio", "xMidYMin meet").style("font-family", FONT_FAMILY);
   if (ctx.isBelowFloor) {
     svg.attr("width", "100%");
   }
@@ -586,4 +588,4 @@ export {
   renderFlowchart,
   renderFlowchartForExport
 };
-//# sourceMappingURL=chunk-OBYZU23V.js.map
+//# sourceMappingURL=chunk-UQY2VLUK.js.map