@diagrammo/dgmo 0.77.0 → 0.79.0

package/dist/{chunk-HDLRRY3N.js → chunk-3KFGPXHD.js}

@@ -3,16 +3,20 @@ import {
 } from "./chunk-EOYPX6SF.js";
 import {
   renderDataChartD3
-} from "./chunk-UH5YTZN7.js";
+} from "./chunk-QDTFFVLT.js";
 import {
   computeQuadrantPointLabels
-} from "./chunk-L65WI4HO.js";
+} from "./chunk-EDU2OCIQ.js";
 import {
   renderTimeline
-} from "./chunk-QXMHBIQG.js";
+} from "./chunk-QGXH64FT.js";
 import {
   ScaleContext
 } from "./chunk-24YPR5EH.js";
+import {
+  GRID_DASH,
+  scaleDash
+} from "./chunk-IIEI7VK5.js";
 import {
   EXPORT_HEIGHT,
   EXPORT_WIDTH,
@@ -24,17 +28,17 @@ import {
   renderChartTitle,
   resolveExportPalette,
   showTooltip
-} from "./chunk-3E4YB6TY.js";
+} from "./chunk-4YSWUQKZ.js";
 import {
   legendInlineSupported
-} from "./chunk-MG3DE3VO.js";
+} from "./chunk-2F7AG7LA.js";
 import {
   FONT_FAMILY
-} from "./chunk-53SEVJQM.js";
+} from "./chunk-ICLB27PZ.js";
 import {
   measureText,
   wrapTextToWidth
-} from "./chunk-MTGGOCND.js";
+} from "./chunk-YC6GVLTI.js";
 import {
   getRenderCategory,
   parseArc,
@@ -45,19 +49,19 @@ import {
   parseVenn,
   parseVisualization,
   parseWordcloud
-} from "./chunk-FTTB64OJ.js";
+} from "./chunk-EBEFYSVZ.js";
 import {
   resolveActiveTagGroup,
   tagAttrKey
-} from "./chunk-76LHNLGX.js";
+} from "./chunk-O2HU4AQN.js";
 import {
   getPalette
-} from "./chunk-R3XI2VC7.js";
+} from "./chunk-IDJGV6VM.js";
 import {
   getSeriesColors,
   mix,
   themeBaseBg
-} from "./chunk-GLREDNBA.js";
+} from "./chunk-AMQFJ7P7.js";
 import {
   emit,
   makeDgmoError
@@ -101,7 +105,7 @@ function renderSlopeChart(container, parsed, palette, isDark, onClickItem, expor
   const sPeriodFont = ctx.text(18);
   const sValueFont = ctx.text(16);
   const sPeriodHeaderY = ctx.structural(15);
-  const sDash = `${ctx.structural(4)},${ctx.structural(4)}`;
+  const sDash = scaleDash(GRID_DASH, (n) => ctx.structural(n));
   const sLineStroke = ctx.structural(2.5);
   const sHitWidth = ctx.structural(14);
   const sPointR = ctx.structural(4);
@@ -141,7 +145,7 @@ function renderSlopeChart(container, parsed, palette, isDark, onClickItem, expor
   );
   for (const period of periods) {
     const x = xScale(period);
-    g.append("text").attr("x", x).attr("y", -sPeriodHeaderY).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", `${sPeriodFont}px`).attr("font-weight", "600").text(period);
+    g.append("text").attr("x", x).attr("y", -sPeriodHeaderY).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", sPeriodFont).attr("font-weight", "bold").text(period);
     g.append("line").attr("x1", x).attr("y1", 0).attr("x2", x).attr("y2", innerHeight).attr("stroke", mutedColor).attr("stroke-width", 1).attr("stroke-dasharray", sDash);
   }
   const lineGen = d3Shape.line().x((_d, i) => xScale(periods[i])).y((d) => yScale(d));
@@ -232,11 +236,11 @@ function renderSlopeChart(container, parsed, palette, isDark, onClickItem, expor
       const isLast = i === periods.length - 1;
       if (!isLast) {
         const adjustedY = leftLabelCollisions.get(i)[idx];
-        seriesG.append("text").attr("x", isFirst ? x - sValueLabelXOff : x).attr("y", adjustedY).attr("dy", "0.35em").attr("text-anchor", isFirst ? "end" : "middle").attr("fill", color).attr("font-size", `${sValueFont}px`).text(val.toString());
+        seriesG.append("text").attr("x", isFirst ? x - sValueLabelXOff : x).attr("y", adjustedY).attr("dy", "0.35em").attr("text-anchor", isFirst ? "end" : "middle").attr("fill", color).attr("font-size", sValueFont).text(val.toString());
       }
     });
     const adjustedLastY = rightAdjustedY[idx];
-    const labelEl = seriesG.append("text").attr("x", si.lastX + sLabelGap).attr("y", adjustedLastY).attr("text-anchor", "start").attr("fill", color).attr("font-size", `${sLabelFontSize}px`).attr("font-weight", "500");
+    const labelEl = seriesG.append("text").attr("x", si.lastX + sLabelGap).attr("y", adjustedLastY).attr("text-anchor", "start").attr("fill", color).attr("font-size", sLabelFontSize).attr("font-weight", "normal");
     if (!si.wrappedLines) {
       labelEl.attr("dy", "0.35em").text(si.labelText);
     } else {
@@ -392,7 +396,7 @@ function renderArcDiagram(container, parsed, palette, isDark, onClickItem, expor
   const sNodeLabelYOffset = ctx.structural(ARC_NODE_LABEL_Y_OFFSET);
   const sStrokeMin = ctx.structural(ARC_STROKE_MIN);
   const sStrokeMax = ctx.structural(ARC_STROKE_MAX);
-  const sBaselineDash = `${ctx.structural(4)},${ctx.structural(4)}`;
+  const sBaselineDash = scaleDash(GRID_DASH, (n) => ctx.structural(n));
   const sBaselineStrokeWidth = ctx.structural(ARC_BASELINE_STROKE_WIDTH);
   svg.attr("preserveAspectRatio", "xMidYMin meet");
   if (ctx.isBelowFloor) {
@@ -530,7 +534,7 @@ function renderArcDiagram(container, parsed, palette, isDark, onClickItem, expor
           if (onClickItem) onClickItem(group.lineNumber);
         });
         const nameX = bandLeft + vNameColW / 2;
-        g.append("text").attr("class", "arc-group-label").attr("data-group", group.name).attr("data-line-number", String(group.lineNumber)).attr("x", nameX).attr("y", midYBand).attr("text-anchor", "middle").attr("transform", `rotate(-90 ${nameX} ${midYBand})`).attr("fill", textColor).attr("font-size", `${sGroupLabelFont}px`).attr("font-weight", "600").attr("fill-opacity", 0.6).style("cursor", onClickItem ? "pointer" : "default").text(group.name).on("mouseenter", () => handleGroupEnter(group.name)).on("mouseleave", handleMouseLeave).on("click", () => {
+        g.append("text").attr("class", "arc-group-label").attr("data-group", group.name).attr("data-line-number", String(group.lineNumber)).attr("x", nameX).attr("y", midYBand).attr("text-anchor", "middle").attr("transform", `rotate(-90 ${nameX} ${midYBand})`).attr("fill", textColor).attr("font-size", sGroupLabelFont).attr("font-weight", "bold").attr("fill-opacity", 0.6).style("cursor", onClickItem ? "pointer" : "default").text(group.name).on("mouseenter", () => handleGroupEnter(group.name)).on("mouseleave", handleMouseLeave).on("click", () => {
           if (onClickItem) onClickItem(group.lineNumber);
         });
       }
@@ -564,7 +568,7 @@ function renderArcDiagram(container, parsed, palette, isDark, onClickItem, expor
         "stroke-width",
         outlineDots ? ctx.structural(2) : sNodeStrokeWidth
       );
-      nodeG.append("text").attr("x", baseX - sNodeLabelXOffset).attr("y", y).attr("dy", "0.35em").attr("text-anchor", "end").attr("fill", textColor).attr("font-size", `${sNodeLabelFont}px`).text(node);
+      nodeG.append("text").attr("x", baseX - sNodeLabelXOffset).attr("y", y).attr("dy", "0.35em").attr("text-anchor", "end").attr("fill", textColor).attr("font-size", sNodeLabelFont).text(node);
     }
   } else {
     const xScale = d3Scale2.scalePoint().domain(nodes).range([0, innerWidth]).padding(0.5);
@@ -649,7 +653,7 @@ function renderArcDiagram(container, parsed, palette, isDark, onClickItem, expor
         }).style("cursor", "pointer").on("mouseenter", () => handleGroupEnter(group.name)).on("mouseleave", handleMouseLeave).on("click", () => {
           if (onClickItem) onClickItem(group.lineNumber);
         });
-        g.append("text").attr("class", "arc-group-label").attr("data-group", group.name).attr("data-line-number", String(group.lineNumber)).attr("x", (minP + maxP) / 2).attr("y", nameY).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", `${sGroupLabelFont}px`).attr("font-weight", "600").attr("fill-opacity", 0.6).style("cursor", onClickItem ? "pointer" : "default").text(group.name).on("mouseenter", () => handleGroupEnter(group.name)).on("mouseleave", handleMouseLeave).on("click", () => {
+        g.append("text").attr("class", "arc-group-label").attr("data-group", group.name).attr("data-line-number", String(group.lineNumber)).attr("x", (minP + maxP) / 2).attr("y", nameY).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", sGroupLabelFont).attr("font-weight", "bold").attr("fill-opacity", 0.6).style("cursor", onClickItem ? "pointer" : "default").text(group.name).on("mouseenter", () => handleGroupEnter(group.name)).on("mouseleave", handleMouseLeave).on("click", () => {
           if (onClickItem) onClickItem(group.lineNumber);
         });
       }
@@ -684,7 +688,7 @@ function renderArcDiagram(container, parsed, palette, isDark, onClickItem, expor
         outlineDots ? ctx.structural(2) : sNodeStrokeWidth
       );
       const labelY = rotateLabels ? baseY + labelPivotGap : baseY + sNodeLabelYOffset;
-      const nodeLabel = nodeG.append("text").attr("x", x).attr("y", labelY).attr("text-anchor", rotateLabels ? "end" : "middle").attr("fill", textColor).attr("font-size", `${sNodeLabelFont}px`).text(node);
+      const nodeLabel = nodeG.append("text").attr("x", x).attr("y", labelY).attr("text-anchor", rotateLabels ? "end" : "middle").attr("fill", textColor).attr("font-size", sNodeLabelFont).text(node);
       if (rotateLabels) {
         nodeLabel.attr("transform", `rotate(-45 ${x} ${labelY})`);
       }
@@ -795,7 +799,7 @@ function renderWordCloud(container, parsed, palette, _isDark, onClickItem, expor
   );
   const sized = words.map((w) => ({ ...w, size: fontSize(w.weight) }));
   const draw = (layoutWords) => {
-    g.selectAll("text").data(layoutWords).join("text").style("font-size", (d) => `${d.size}px`).style("font-family", FONT_FAMILY).style("font-weight", "600").style("fill", (_d, i) => colors[i % colors.length]).style(
+    g.selectAll("text").data(layoutWords).join("text").style("font-size", (d) => `${d.size}px`).style("font-family", FONT_FAMILY).style("font-weight", "bold").style("fill", (_d, i) => colors[i % colors.length]).style(
       "cursor",
       (d) => onClickItem && d.lineNumber ? "pointer" : "default"
     ).attr("text-anchor", "middle").attr("transform", (d) => `translate(${d.x},${d.y}) rotate(${d.rotate})`).attr("data-line-number", (d) => {
@@ -850,7 +854,7 @@ function renderWordCloudAsync(container, parsed, palette, _isDark, exportDims) {
     );
     const sized = words.map((w) => ({ ...w, size: fontSize(w.weight) }));
     const draw = (layoutWords) => {
-      g.selectAll("text").data(layoutWords).join("text").style("font-size", (d) => `${d.size}px`).style("font-family", FONT_FAMILY).style("font-weight", "600").style("fill", (_d, i) => colors[i % colors.length]).attr("text-anchor", "middle").attr(
+      g.selectAll("text").data(layoutWords).join("text").style("font-size", (d) => `${d.size}px`).style("font-family", FONT_FAMILY).style("font-weight", "bold").style("fill", (_d, i) => colors[i % colors.length]).attr("text-anchor", "middle").attr(
         "transform",
         (d) => `translate(${d.x},${d.y}) rotate(${d.rotate})`
       ).text((d) => d.text);
@@ -1215,7 +1219,7 @@ function renderVenn(container, parsed, palette, _isDark, onClickItem, exportDims
     const labelG = labelGroup.append("g").style("cursor", "default").on("mouseenter", () => showRegionOverlay([i])).on("mouseleave", () => hideAllOverlays());
     registerLabel(setKey, labelG);
     if (fitsInside) {
-      labelG.append("text").attr("x", centroid.x).attr("y", centroid.y).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", textColor).attr("font-size", `${Math.round(fitFont)}px`).attr("font-weight", "bold").text(text);
+      labelG.append("text").attr("x", centroid.x).attr("y", centroid.y).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", textColor).attr("font-size", Math.round(fitFont)).attr("font-weight", "bold").text(text);
       setLabelBBoxes[i] = {
         x: centroid.x - estTextW / 2,
         y: centroid.y - fitFont / 2,
@@ -1251,7 +1255,7 @@ function renderVenn(container, parsed, palette, _isDark, onClickItem, exportDims
         sSetLabelFont,
         Math.min(height - 4, textY)
       );
-      labelG.append("text").attr("x", textX).attr("y", renderedTextY).attr("text-anchor", textAnchor).attr("dominant-baseline", "central").attr("fill", textColor).attr("font-size", `${sSetLabelFont}px`).attr("font-weight", "bold").text(text);
+      labelG.append("text").attr("x", textX).attr("y", renderedTextY).attr("text-anchor", textAnchor).attr("dominant-baseline", "central").attr("fill", textColor).attr("font-size", sSetLabelFont).attr("font-weight", "bold").text(text);
       const externalEstW = measureText(text, sSetLabelFont, { bold: true });
       setLabelBBoxes[i] = {
         x: isRight ? textX : textX - externalEstW,
@@ -1468,7 +1472,7 @@ function renderVenn(container, parsed, palette, _isDark, onClickItem, exportDims
     for (const seg of segments) {
       ovLabelG.append("line").attr("x1", seg.x1).attr("y1", seg.y1).attr("x2", seg.x2).attr("y2", seg.y2).attr("stroke", overlapColor).attr("stroke-width", ctx.structural(1.25)).attr("opacity", 0.85);
     }
-    const textEl = ovLabelG.append("text").attr("text-anchor", textAnchor).attr("dominant-baseline", baseline).attr("fill", overlapColor).attr("font-size", `${OVERLAP_FONT}px`).attr("font-weight", "600");
+    const textEl = ovLabelG.append("text").attr("text-anchor", textAnchor).attr("dominant-baseline", baseline).attr("fill", overlapColor).attr("font-size", OVERLAP_FONT).attr("font-weight", "bold");
     lines.forEach((line2, i) => {
       const tspan = textEl.append("tspan").attr("x", textX);
       if (i === 0) tspan.attr("y", startY);
@@ -1637,7 +1641,7 @@ function renderQuadrant(container, parsed, palette, isDark, onClickItem, exportD
     }
   ];
   const quadrantRects = chartG.selectAll("rect.quadrant").data(quadrantDefs).enter().append("rect").attr("class", "quadrant").attr("x", (d) => d.x).attr("y", (d) => d.y).attr("width", (d) => d.w).attr("height", (d) => d.h).attr("fill", (d) => getQuadrantFill(d.label, d.colorIdx)).attr("stroke", (d) => getQuadrantColor(d.label, d.colorIdx)).attr("stroke-width", ctx.structural(2));
-  const shadowColor = "rgba(0,0,0,0.4)";
+  const shadowColor = isDark ? "rgba(0,0,0,0.55)" : "rgba(0,0,0,0.4)";
   const quadrantLabelColor = mix(textColor, bg, 35);
   const LABEL_MAX_FONT = ctx.text(48);
   const LABEL_MIN_FONT = ctx.text(14);
@@ -1686,7 +1690,7 @@ function renderQuadrant(container, parsed, palette, isDark, onClickItem, exportD
   const renderWatermarkOriginal = (textEl, d) => {
     const layout = labelLayouts.get(d.label.text);
     const el = d3Selection3.select(textEl);
-    el.text(null).attr("font-size", `${layout.fontSize}px`).attr("font-weight", "700");
+    el.text(null).attr("font-size", layout.fontSize).attr("font-weight", "bold");
     if (layout.lines.length === 1) {
       el.text(layout.lines[0]);
     } else {
@@ -1720,14 +1724,14 @@ function renderQuadrant(container, parsed, palette, isDark, onClickItem, exportD
   const sAxisPad = ctx.aesthetic(20);
   const sAxisX = ctx.aesthetic(22);
   if (quadrantXAxis) {
-    const xLowLabel = svg.append("text").attr("class", "quadrant-axis-label").attr("x", margin.left + chartWidth / 4).attr("y", height - sAxisPad).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", `${sAxisFont}px`).attr(
+    const xLowLabel = svg.append("text").attr("class", "quadrant-axis-label").attr("x", margin.left + chartWidth / 4).attr("y", height - sAxisPad).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", sAxisFont).attr(
       "data-line-number",
       quadrantXAxisLineNumber ? String(quadrantXAxisLineNumber) : null
     ).style(
       "cursor",
       onClickItem && quadrantXAxisLineNumber ? "pointer" : "default"
     ).text(quadrantXAxis[0]);
-    const xHighLabel = svg.append("text").attr("class", "quadrant-axis-label").attr("x", margin.left + chartWidth * 3 / 4).attr("y", height - sAxisPad).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", `${sAxisFont}px`).attr(
+    const xHighLabel = svg.append("text").attr("class", "quadrant-axis-label").attr("x", margin.left + chartWidth * 3 / 4).attr("y", height - sAxisPad).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", sAxisFont).attr(
       "data-line-number",
       quadrantXAxisLineNumber ? String(quadrantXAxisLineNumber) : null
     ).style(
@@ -1747,14 +1751,14 @@ function renderQuadrant(container, parsed, palette, isDark, onClickItem, exportD
   if (quadrantYAxis) {
     const yMidBottom = margin.top + chartHeight * 3 / 4;
     const yMidTop = margin.top + chartHeight / 4;
-    const yLowLabel = svg.append("text").attr("class", "quadrant-axis-label").attr("x", sAxisX).attr("y", yMidBottom).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", `${sAxisFont}px`).attr("transform", `rotate(-90, ${sAxisX}, ${yMidBottom})`).attr(
+    const yLowLabel = svg.append("text").attr("class", "quadrant-axis-label").attr("x", sAxisX).attr("y", yMidBottom).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", sAxisFont).attr("transform", `rotate(-90, ${sAxisX}, ${yMidBottom})`).attr(
       "data-line-number",
       quadrantYAxisLineNumber ? String(quadrantYAxisLineNumber) : null
     ).style(
       "cursor",
       onClickItem && quadrantYAxisLineNumber ? "pointer" : "default"
     ).text(quadrantYAxis[0]);
-    const yHighLabel = svg.append("text").attr("class", "quadrant-axis-label").attr("x", sAxisX).attr("y", yMidTop).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", `${sAxisFont}px`).attr("transform", `rotate(-90, ${sAxisX}, ${yMidTop})`).attr(
+    const yHighLabel = svg.append("text").attr("class", "quadrant-axis-label").attr("x", sAxisX).attr("y", yMidTop).attr("text-anchor", "middle").attr("fill", textColor).attr("font-size", sAxisFont).attr("transform", `rotate(-90, ${sAxisX}, ${yMidTop})`).attr(
       "data-line-number",
       quadrantYAxisLineNumber ? String(quadrantYAxisLineNumber) : null
     ).style(
@@ -1820,10 +1824,10 @@ function renderQuadrant(container, parsed, palette, isDark, onClickItem, exportD
     if (placed.connectorLine) {
       pointG.append("line").attr("x1", placed.connectorLine.x1).attr("y1", placed.connectorLine.y1).attr("x2", placed.connectorLine.x2).attr("y2", placed.connectorLine.y2).attr("stroke", pointColor).attr("stroke-width", 1).attr("opacity", 0.5);
     }
-    pointG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", POINT_RADIUS).attr("fill", parsed.fillMode === "outline" ? bg : "#ffffff").attr("stroke", pointColor).attr("stroke-width", ctx.structural(2));
-    const labelText = pointG.append("text").attr("x", placed.x).attr("y", placed.y).attr("text-anchor", placed.anchor).attr("dominant-baseline", "central").attr("fill", textColor).attr("font-size", `${POINT_LABEL_FONT_SIZE}px`).attr("font-weight", "700").style("text-shadow", `0 1px 2px ${shadowColor}`).style("transition", "y 120ms ease-out");
+    pointG.append("circle").attr("cx", cx).attr("cy", cy).attr("r", POINT_RADIUS).attr("fill", bg).attr("stroke", pointColor).attr("stroke-width", ctx.structural(2));
+    const labelText = pointG.append("text").attr("x", placed.x).attr("y", placed.y).attr("text-anchor", placed.anchor).attr("dominant-baseline", "central").attr("fill", textColor).attr("font-size", POINT_LABEL_FONT_SIZE).attr("font-weight", "bold").style("text-shadow", `0 1px 2px ${shadowColor}`).style("transition", "y 120ms ease-out");
     labelText.append("tspan").text(point.label);
-    const coordsTspan = labelText.append("tspan").attr("class", "point-coords").attr("x", placed.x).attr("dy", `${POINT_LABEL_FONT_SIZE}px`).attr("font-size", `${ctx.text(10)}px`).attr("font-weight", "500").attr("opacity", 0).text(`${point.x.toFixed(2)}, ${point.y.toFixed(2)}`);
+    const coordsTspan = labelText.append("tspan").attr("class", "point-coords").attr("x", placed.x).attr("dy", `${POINT_LABEL_FONT_SIZE}px`).attr("font-size", ctx.text(10)).attr("font-weight", "normal").attr("opacity", 0).text(`${point.x.toFixed(2)}, ${point.y.toFixed(2)}`);
     const COORDS_LINE_H = ctx.structural(14);
     const bumpDy = placed.y < cy ? -COORDS_LINE_H : COORDS_LINE_H;
     pointG.style("cursor", onClickItem ? "pointer" : "default").on("mouseenter", () => {
@@ -1947,15 +1951,18 @@ function resolveArcChordOverride(content, detectedType, palette) {
 }
 async function renderForExport(content, theme, palette, viewState, options) {
   const exportMode = options?.exportMode ?? false;
-  const { parseDgmoChartType } = await import("./dgmo-router-A3LIHT6H.js");
+  const { parseDgmoChartType } = await import("./dgmo-router-OXFV43XX.js");
   const detectedTypeRaw = parseDgmoChartType(content);
   const override = resolveArcChordOverride(content, detectedTypeRaw, palette);
   const renderContent = override?.content ?? content;
   const detectedType = override?.type ?? detectedTypeRaw;
   if (detectedType !== null) {
-    const { supportsD3DataChart, renderDataChartD3: renderDataChartD32 } = await import("./charts-d3-HMEMHSSW.js");
+    const { supportsD3DataChart, renderDataChartD3: renderDataChartD32 } = await import("./charts-d3-EST3Z5VG.js");
     if (supportsD3DataChart(detectedType)) {
-      return renderDataChartD32(renderContent, theme, palette);
+      return renderDataChartD32(renderContent, theme, palette, {
+        ...options?.width !== void 0 && { width: options.width },
+        ...options?.height !== void 0 && { height: options.height }
+      });
     }
   }
   const ctx = {
@@ -1966,6 +1973,12 @@ async function renderForExport(content, theme, palette, viewState, options) {
     options,
     exportMode,
     isDark: theme === "dark",
+    // The resolved canvas, and the raw request beside it. A chart whose own
+    // natural size is not EXPORT_WIDTH (tech-radar) needs to tell "the caller
+    // asked for 1200" apart from "nobody asked", which the resolved value
+    // cannot express.
+    requestedWidth: options?.width && options.width > 0 ? Math.round(options.width) : void 0,
+    requestedHeight: options?.height && options.height > 0 ? Math.round(options.height) : void 0,
     width: options?.width && options.width > 0 ? Math.round(options.width) : EXPORT_WIDTH,
     height: options?.height && options.height > 0 ? Math.round(options.height) : EXPORT_HEIGHT
   };
@@ -1977,8 +1990,8 @@ function ctxTagOverride(ctx) {
 }
 async function exportEventLine(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseEventLine } = await import("./parser-PR3OR3LO.js");
-  const { renderEventLineForExport } = await import("./renderer-5E2AH5TO.js");
+  const { parseEventLine } = await import("./parser-HRIKI5O3.js");
+  const { renderEventLineForExport } = await import("./renderer-4HFT4HJG.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const parsed = parseEventLine(content, effectivePalette);
   if (parsed.error || parsed.events.length === 0) return "";
@@ -1996,8 +2009,8 @@ async function exportEventLine(ctx) {
 }
 async function exportBody(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseBody } = await import("./parser-WWRRG2DV.js");
-  const { renderBodyForExport } = await import("./renderer-RNFECJ5D.js");
+  const { parseBody } = await import("./parser-N4YB5EIZ.js");
+  const { renderBodyForExport } = await import("./renderer-HNEMQJXT.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const parsed = parseBody(content, effectivePalette);
   if (parsed.error) return "";
@@ -2014,8 +2027,8 @@ async function exportBody(ctx) {
 }
 async function exportVersionControl(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseVersionControl } = await import("./parser-4DLU4SNG.js");
-  const { renderVersionControlForExport } = await import("./renderer-GHBF5PRH.js");
+  const { parseVersionControl } = await import("./parser-LXU3MGG6.js");
+  const { renderVersionControlForExport } = await import("./renderer-RW446FGL.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const parsed = parseVersionControl(content, effectivePalette);
   if (parsed.error || parsed.nodes.length === 0) return "";
@@ -2039,10 +2052,10 @@ function unionHiddenAttributes(hideOption, ha) {
 }
 async function exportOrg(ctx) {
   const { content, theme, palette, viewState, exportMode } = ctx;
-  const { parseOrg, findOrgNodeIdByName } = await import("./parser-QOIZGW7I.js");
-  const { layoutOrg } = await import("./layout-5ILNODTP.js");
+  const { parseOrg, findOrgNodeIdByName } = await import("./parser-2Y7LWKNO.js");
+  const { layoutOrg } = await import("./layout-XY45TFJ4.js");
   const { collapseOrgTree, focusOrgTree, unionCollapsedOrgNodes } = await import("./collapse-JRGPUE67.js");
-  const { renderOrg, ancestorTrailReserve } = await import("./renderer-OL5QSZPC.js");
+  const { renderOrg, ancestorTrailReserve } = await import("./renderer-N5CRYFBI.js");
   const isDark = ctx.isDark;
   const effectivePalette = await resolveExportPalette(theme, palette);
   const orgParsed = parseOrg(content, effectivePalette);
@@ -2103,10 +2116,10 @@ async function exportOrg(ctx) {
 }
 async function exportSitemap(ctx) {
   const { content, theme, palette, viewState, exportMode } = ctx;
-  const { parseSitemap } = await import("./parser-2GMHFSTS.js");
-  const { layoutSitemap } = await import("./layout-VUZ3MLOI.js");
+  const { parseSitemap } = await import("./parser-66QZQYGE.js");
+  const { layoutSitemap } = await import("./layout-LELNMRM5.js");
   const { collapseSitemapTree } = await import("./collapse-ZWUFFCK2.js");
-  const { renderSitemap } = await import("./renderer-IR5655M7.js");
+  const { renderSitemap } = await import("./renderer-DV44AS75.js");
   const isDark = ctx.isDark;
   const effectivePalette = await resolveExportPalette(theme, palette);
   const sitemapParsed = parseSitemap(content, effectivePalette);
@@ -2134,7 +2147,7 @@ async function exportSitemap(ctx) {
   const {
     LEGEND_HEIGHT: SITEMAP_LEGEND_HEIGHT,
     LEGEND_GROUP_GAP: SITEMAP_LEGEND_GROUP_GAP
-  } = await import("./legend-constants-PLN2YHGM.js");
+  } = await import("./legend-constants-RSWFR3L6.js");
   const suppressedLegendBand = sitemapLayout.legend.length > 0 && effectiveParsed.options["no-legend"] === "on" ? SITEMAP_LEGEND_HEIGHT + SITEMAP_LEGEND_GROUP_GAP : 0;
   const exportWidth = sitemapLayout.width + PADDING * 2;
   const exportHeight = sitemapLayout.height + PADDING * 2 + titleOffset - suppressedLegendBand;
@@ -2155,8 +2168,8 @@ async function exportSitemap(ctx) {
 }
 async function exportKanban(ctx) {
   const { content, theme, palette, viewState, exportMode } = ctx;
-  const { parseKanban } = await import("./parser-6FUESG4N.js");
-  const { renderKanban } = await import("./renderer-4BF6ILP6.js");
+  const { parseKanban } = await import("./parser-EP2JQJNV.js");
+  const { renderKanban } = await import("./renderer-H6XEVHKH.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const kanbanParsed = parseKanban(content, effectivePalette);
   if (kanbanParsed.error || kanbanParsed.columns.length === 0) return "";
@@ -2187,9 +2200,9 @@ async function exportKanban(ctx) {
 }
 async function exportClass(ctx) {
   const { content, theme, palette, exportMode } = ctx;
-  const { parseClassDiagram } = await import("./parser-ZYAFHXKQ.js");
-  const { layoutClassDiagram } = await import("./layout-ROORJQ4X.js");
-  const { renderClassDiagram } = await import("./renderer-LSJWYGOL.js");
+  const { parseClassDiagram } = await import("./parser-FDDHTBRV.js");
+  const { layoutClassDiagram } = await import("./layout-YPRXVCW5.js");
+  const { renderClassDiagram } = await import("./renderer-2ZGZSSCV.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const classParsed = parseClassDiagram(content, effectivePalette);
   if (classParsed.error || classParsed.classes.length === 0) return "";
@@ -2214,9 +2227,9 @@ async function exportClass(ctx) {
 }
 async function exportEr(ctx) {
   const { content, theme, palette, viewState, exportMode } = ctx;
-  const { parseERDiagram } = await import("./parser-EQ4I3TSH.js");
-  const { layoutERDiagram } = await import("./layout-KQUSB45X.js");
-  const { renderERDiagram } = await import("./renderer-2RIIIO34.js");
+  const { parseERDiagram } = await import("./parser-4GUQUDAC.js");
+  const { layoutERDiagram } = await import("./layout-WASEHV3S.js");
+  const { renderERDiagram } = await import("./renderer-OVRX36WE.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const erParsed = parseERDiagram(content, effectivePalette);
   if (erParsed.error || erParsed.tables.length === 0) return "";
@@ -2248,14 +2261,14 @@ async function exportEr(ctx) {
 }
 async function exportSketch(ctx) {
   const { content, theme, viewState, exportMode } = ctx;
-  const { parseSketch } = await import("./parser-QYAIFXLP.js");
+  const { parseSketch } = await import("./parser-AYURCBDZ.js");
   const effectivePalette = await resolveExportPalette(theme, ctx.palette);
   const parsed = parseSketch(content, effectivePalette);
   if (parsed.error || parsed.nodes.length === 0 && parsed.boxes.length === 0) {
     return "";
   }
-  const { layoutSketch } = await import("./layout-Y2V3LYV7.js");
-  const { renderSketchForExport } = await import("./renderer-62SLWRYF.js");
+  const { layoutSketch } = await import("./layout-5AYAYUJH.js");
+  const { renderSketchForExport } = await import("./renderer-SJV75NUI.js");
   const collapsedBoxes = viewState?.cg ? new Set(viewState.cg) : void 0;
   const skLayout = layoutSketch(parsed, {
     ...collapsedBoxes !== void 0 && { collapsedBoxes }
@@ -2282,7 +2295,7 @@ async function exportSketch(ctx) {
 }
 async function exportBoxesAndLines(ctx) {
   const { content, theme, palette, viewState, exportMode } = ctx;
-  const { parseBoxesAndLines } = await import("./parser-TA5TYZNL.js");
+  const { parseBoxesAndLines } = await import("./parser-4OXANARZ.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const blParsed = parseBoxesAndLines(content, effectivePalette);
   if (blParsed.error || blParsed.nodes.length === 0) return "";
@@ -2293,8 +2306,8 @@ async function exportBoxesAndLines(ctx) {
       blHiddenTagValues.set(k, new Set(v));
     }
   }
-  const { renderBoxesAndLinesForExport } = await import("./renderer-LWXDMZOV.js");
-  const { layoutBoxesAndLines } = await import("./layout-B5GQVXXY.js");
+  const { renderBoxesAndLinesForExport } = await import("./renderer-4E6NNPNU.js");
+  const { layoutBoxesAndLines } = await import("./layout-6VUNAH6F.js");
   const blLayout = await layoutBoxesAndLines(blParsed);
   const PADDING = 20;
   const titleOffset = blParsed.title ? 40 : 0;
@@ -2323,9 +2336,9 @@ async function exportBoxesAndLines(ctx) {
 }
 async function exportSwimlane(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseSwimlane } = await import("./parser-E3OHNNTH.js");
+  const { parseSwimlane } = await import("./parser-JNJ2IFSO.js");
   const { layoutSwimlane } = await import("./layout-OHAIIXBC.js");
-  const { renderSwimlaneForExport } = await import("./renderer-L237AOOZ.js");
+  const { renderSwimlaneForExport } = await import("./renderer-FSV7MTW3.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const swimParsed = parseSwimlane(content, effectivePalette);
   if (swimParsed.error || swimParsed.nodes.length === 0) return "";
@@ -2355,9 +2368,9 @@ async function exportSwimlane(ctx) {
 }
 async function exportFamily(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseFamily } = await import("./parser-3AOMUX5D.js");
-  const { layoutFamily } = await import("./layout-6SKHNQYO.js");
-  const { renderFamilyForExport } = await import("./renderer-3HFU3DTO.js");
+  const { parseFamily } = await import("./parser-6SS7DKVW.js");
+  const { layoutFamily } = await import("./layout-FCIYZV63.js");
+  const { renderFamilyForExport } = await import("./renderer-K2OWHNBV.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const parsed = parseFamily(content, effectivePalette);
   if (parsed.error || parsed.persons.size === 0) return "";
@@ -2387,10 +2400,10 @@ async function exportFamily(ctx) {
 }
 async function exportMindmap(ctx) {
   const { content, theme, palette, viewState, exportMode } = ctx;
-  const { parseMindmap } = await import("./parser-LV7PQBUG.js");
-  const { layoutMindmap } = await import("./layout-RV2T2YTT.js");
+  const { parseMindmap } = await import("./parser-GK6CMK4P.js");
+  const { layoutMindmap } = await import("./layout-74HDWQYG.js");
   const { collapseMindmapTree } = await import("./collapse-SLINJQW6.js");
-  const { renderMindmap } = await import("./renderer-D6GJ6EVK.js");
+  const { renderMindmap } = await import("./renderer-PLKMHBAB.js");
   const isDark = ctx.isDark;
   const effectivePalette = await resolveExportPalette(theme, palette);
   const mmParsed = parseMindmap(content, effectivePalette);
@@ -2440,9 +2453,9 @@ async function exportMindmap(ctx) {
 }
 async function exportWireframe(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseWireframe } = await import("./parser-WMJEPZDC.js");
-  const { layoutWireframe } = await import("./layout-IN53LAE6.js");
-  const { renderWireframe } = await import("./renderer-2ANDPQWC.js");
+  const { parseWireframe } = await import("./parser-JIPG576H.js");
+  const { layoutWireframe } = await import("./layout-SUND6B7D.js");
+  const { renderWireframe } = await import("./renderer-UNYFAMFE.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const wireframeParsed = parseWireframe(content);
   if (wireframeParsed.error || wireframeParsed.roots.length === 0 && wireframeParsed.modals.length === 0)
@@ -2465,14 +2478,14 @@ async function exportWireframe(ctx) {
 }
 async function exportC4(ctx) {
   const { content, theme, palette, viewState, exportMode } = ctx;
-  const { parseC4 } = await import("./parser-YWQCC33R.js");
+  const { parseC4 } = await import("./parser-JGMQE7FS.js");
   const {
     layoutC4Context,
     layoutC4Containers,
     layoutC4Components,
     layoutC4Deployment
-  } = await import("./layout-ZAGUFT2G.js");
-  const { renderC4Context, renderC4Containers } = await import("./renderer-G2DPKJAN.js");
+  } = await import("./layout-6APS2RRG.js");
+  const { renderC4Context, renderC4Containers } = await import("./renderer-REHVBQ57.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const c4Parsed = parseC4(content, effectivePalette);
   if (c4Parsed.error || c4Parsed.elements.length === 0) return "";
@@ -2506,9 +2519,9 @@ async function exportC4(ctx) {
 }
 async function exportFlowchart(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseFlowchart } = await import("./flowchart-parser-NVBP3C5D.js");
-  const { layoutGraph } = await import("./layout-2OJ25STS.js");
-  const { renderFlowchart } = await import("./flowchart-renderer-BBJUPORB.js");
+  const { parseFlowchart } = await import("./flowchart-parser-MRNAVG35.js");
+  const { layoutGraph } = await import("./layout-ZJOWB27N.js");
+  const { renderFlowchart } = await import("./flowchart-renderer-IGSKJFMF.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const fcParsed = parseFlowchart(content, effectivePalette);
   if (fcParsed.error || fcParsed.nodes.length === 0) return "";
@@ -2527,10 +2540,10 @@ async function exportFlowchart(ctx) {
 }
 async function exportInfra(ctx) {
   const { content, theme, palette, viewState } = ctx;
-  const { parseInfra } = await import("./parser-WVE6SKB7.js");
+  const { parseInfra } = await import("./parser-H33OKBUB.js");
   const { computeInfra } = await import("./compute-JAP5E2E4.js");
-  const { layoutInfra } = await import("./layout-4LNMXLVK.js");
-  const { renderInfra, computeInfraLegendGroups } = await import("./renderer-ANJUDBOS.js");
+  const { layoutInfra } = await import("./layout-J2Z2SYH5.js");
+  const { renderInfra, computeInfraLegendGroups } = await import("./renderer-33AB7UAZ.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const infraParsed = parseInfra(content);
   if (infraParsed.error || infraParsed.nodes.length === 0) return "";
@@ -2577,10 +2590,10 @@ async function exportInfra(ctx) {
 }
 async function exportPert(ctx) {
   const { content, theme, palette, viewState } = ctx;
-  const { parsePert } = await import("./parser-ZT3PU2HT.js");
+  const { parsePert } = await import("./parser-ZUH2G7J2.js");
   const { analyzePert } = await import("./analyzer-QTDQEMS5.js");
-  const { layoutPert } = await import("./layout-SGYR6HBX.js");
-  const { renderPert, measurePertAnalysisBlock } = await import("./renderer-DNFV2IQI.js");
+  const { layoutPert } = await import("./layout-XAJLQPI6.js");
+  const { renderPert, measurePertAnalysisBlock } = await import("./renderer-TKWW45LZ.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const pertParsed = parsePert(content, { palette: effectivePalette });
   if (pertParsed.error || pertParsed.activities.length === 0) return "";
@@ -2623,15 +2636,15 @@ async function exportPert(ctx) {
 }
 async function exportGantt(ctx) {
   const { content, theme, palette, viewState, exportMode } = ctx;
-  const { parseGantt } = await import("./parser-5XFGK5C5.js");
-  const { calculateSchedule } = await import("./calculator-CVQ54JNE.js");
-  const { renderGantt } = await import("./renderer-RPZVNCTF.js");
+  const { parseGantt } = await import("./parser-COPCQEHV.js");
+  const { calculateSchedule } = await import("./calculator-OHTCZSBW.js");
+  const { renderGantt } = await import("./renderer-ZG6GPWZF.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const ganttParsed = parseGantt(content, effectivePalette);
   const resolved = calculateSchedule(ganttParsed);
   if (resolved.tasks.length === 0) return "";
-  const EXPORT_W = 1200;
-  const EXPORT_H = 800;
+  const EXPORT_W = ctx.width;
+  const EXPORT_H = ctx.height;
   const container = createExportContainer(EXPORT_W, EXPORT_H);
   const sourceCollapsedGroups = resolved.groups.filter((g) => g.collapsed).map((g) => g.name);
   const ganttCollapsedGroups = viewState?.cg || sourceCollapsedGroups.length > 0 ? /* @__PURE__ */ new Set([...sourceCollapsedGroups, ...viewState?.cg ?? []]) : void 0;
@@ -2666,9 +2679,9 @@ async function exportGantt(ctx) {
 }
 async function exportState(ctx) {
   const { content, theme, palette, viewState } = ctx;
-  const { parseState } = await import("./state-parser-TPA67IXM.js");
-  const { layoutGraph } = await import("./layout-2OJ25STS.js");
-  const { renderState } = await import("./state-renderer-ELWDRXD6.js");
+  const { parseState } = await import("./state-parser-XT4ZPQAF.js");
+  const { layoutGraph } = await import("./layout-ZJOWB27N.js");
+  const { renderState } = await import("./state-renderer-6TVII5ZJ.js");
   const { collapseStateGroups } = await import("./state-collapse-HCGD6IVJ.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const stateParsed = parseState(content, effectivePalette);
@@ -2705,13 +2718,13 @@ async function exportState(ctx) {
 }
 async function exportTechRadar(ctx) {
   const { content, theme, palette, viewState, exportMode } = ctx;
-  const { parseTechRadar } = await import("./parser-3KQONLXZ.js");
-  const { renderTechRadarForExport } = await import("./renderer-MYSVPERC.js");
+  const { parseTechRadar } = await import("./parser-FDESUQ32.js");
+  const { renderTechRadarForExport } = await import("./renderer-6HPV7BMG.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const radarParsed = parseTechRadar(content);
   if (radarParsed.error || radarParsed.quadrants.length === 0) return "";
-  const RADAR_EXPORT_W = 1300;
-  const RADAR_EXPORT_H = 1500;
+  const RADAR_EXPORT_W = ctx.requestedWidth ?? 1300;
+  const RADAR_EXPORT_H = ctx.requestedHeight ?? 1500;
   const container = createExportContainer(RADAR_EXPORT_W, RADAR_EXPORT_H);
   renderTechRadarForExport(
     container,
@@ -2726,9 +2739,9 @@ async function exportTechRadar(ctx) {
 }
 async function exportJourneyMap(ctx) {
   const { content, theme, palette, exportMode } = ctx;
-  const { parseJourneyMap } = await import("./parser-ML3LVNDV.js");
-  const { renderJourneyMap } = await import("./renderer-P26HH3NA.js");
-  const { layoutJourneyMap } = await import("./layout-EM4DLMAX.js");
+  const { parseJourneyMap } = await import("./parser-HJBSWTDY.js");
+  const { renderJourneyMap } = await import("./renderer-FLLVGYUY.js");
+  const { layoutJourneyMap } = await import("./layout-OPF6KTOH.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const jmParsed = parseJourneyMap(content, effectivePalette);
   if (jmParsed.error || jmParsed.phases.length === 0 && jmParsed.steps.length === 0)
@@ -2748,8 +2761,8 @@ async function exportJourneyMap(ctx) {
 }
 async function exportCycle(ctx) {
   const { content, theme, palette, viewState, exportMode } = ctx;
-  const { parseCycle } = await import("./parser-WCFG3DZA.js");
-  const { renderCycleForExport } = await import("./renderer-GZLRX764.js");
+  const { parseCycle } = await import("./parser-EMPM3V35.js");
+  const { renderCycleForExport } = await import("./renderer-XGJIACBV.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const cycleParsed = parseCycle(content);
   if (cycleParsed.error || cycleParsed.nodes.length === 0) return "";
@@ -2767,10 +2780,10 @@ async function exportCycle(ctx) {
 }
 async function exportMap(ctx) {
   const { content, theme, palette, options } = ctx;
-  const { parseMap } = await import("./parser-GCVSRQPY.js");
+  const { parseMap } = await import("./parser-V6HULGXW.js");
   const { resolveMap } = await import("./resolver-H5E6V7LJ.js");
-  const { renderMapForExport } = await import("./renderer-EFQSMHID.js");
-  const { mapExportDimensions } = await import("./dimensions-OFF4GRFL.js");
+  const { renderMapForExport } = await import("./renderer-M6UIXQHH.js");
+  const { mapExportDimensions } = await import("./dimensions-AN34SPVX.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const mapParsed = parseMap(content, effectivePalette);
   const { data: mapData, reason } = await resolveMapDataSource(
@@ -2803,8 +2816,8 @@ async function exportMap(ctx) {
 }
 async function exportPyramid(ctx) {
   const { content, theme, palette } = ctx;
-  const { parsePyramid } = await import("./parser-B2XQNHZM.js");
-  const { renderPyramidForExport } = await import("./renderer-2NYQDW37.js");
+  const { parsePyramid } = await import("./parser-YJGTPT7A.js");
+  const { renderPyramidForExport } = await import("./renderer-BVJ3NVRB.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const pyramidParsed = parsePyramid(content);
   if (pyramidParsed.error || pyramidParsed.layers.length === 0) return "";
@@ -2820,8 +2833,8 @@ async function exportPyramid(ctx) {
 }
 async function exportRing(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseRing } = await import("./parser-XVSDFO56.js");
-  const { renderRingForExport } = await import("./renderer-Y3Y7PEUS.js");
+  const { parseRing } = await import("./parser-NC36PRBR.js");
+  const { renderRingForExport } = await import("./renderer-63MHARNI.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const ringParsed = parseRing(content);
   if (ringParsed.error || ringParsed.layers.length === 0) return "";
@@ -2834,14 +2847,14 @@ async function exportRing(ctx) {
 }
 async function exportTreemap(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseTreemap } = await import("./parser-RDBXEVI4.js");
+  const { parseTreemap } = await import("./parser-O6WYAXTS.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const treemapParsed = parseTreemap(content, effectivePalette);
   if (treemapParsed.error || treemapParsed.roots.length === 0) return "";
   const container = createExportContainer(ctx.width, ctx.height);
   const dims = { width: ctx.width, height: ctx.height };
   if (treemapParsed.options.radial) {
-    const { renderTreemapRadialForExport } = await import("./renderer-radial-QNGCGKZP.js");
+    const { renderTreemapRadialForExport } = await import("./renderer-radial-7UHFYOOL.js");
     renderTreemapRadialForExport(
       container,
       treemapParsed,
@@ -2850,7 +2863,7 @@ async function exportTreemap(ctx) {
       dims
     );
   } else {
-    const { renderTreemapForExport } = await import("./renderer-SDNWZDUY.js");
+    const { renderTreemapForExport } = await import("./renderer-43KEDLTQ.js");
     renderTreemapForExport(
       container,
       treemapParsed,
@@ -2863,15 +2876,15 @@ async function exportTreemap(ctx) {
 }
 async function exportLiveLink(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseLiveLink } = await import("./parser-WQNT7T2P.js");
-  const { renderLiveLinkCard } = await import("./renderer-EDVCGIQO.js");
+  const { parseLiveLink } = await import("./parser-YQ5F7ATB.js");
+  const { renderLiveLinkCard } = await import("./renderer-VI72MVFW.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   return renderLiveLinkCard(parseLiveLink(content), effectivePalette, theme);
 }
 async function exportBlock(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseBlock } = await import("./parser-UTR5WE4O.js");
-  const { renderBlockForExport } = await import("./renderer-2LDT4TUX.js");
+  const { parseBlock } = await import("./parser-VVWZIMYS.js");
+  const { renderBlockForExport } = await import("./renderer-URXHBQOF.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const blockParsed = parseBlock(content, effectivePalette);
   if (blockParsed.error || blockParsed.top.rows.length === 0) return "";
@@ -2884,8 +2897,8 @@ async function exportBlock(ctx) {
 }
 async function exportGoal(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseGoal } = await import("./parser-4KFJKLP2.js");
-  const { renderGoalForExport } = await import("./renderer-H2HYLFN3.js");
+  const { parseGoal } = await import("./parser-UHABNZBC.js");
+  const { renderGoalForExport } = await import("./renderer-XVTKGPYT.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const parsed = parseGoal(content, effectivePalette);
   if (parsed.error) return "";
@@ -2898,8 +2911,8 @@ async function exportGoal(ctx) {
 }
 async function exportCountdown(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseCountdown } = await import("./parser-ZXQZZK6W.js");
-  const { renderCountdownForExport } = await import("./renderer-FTX67CYZ.js");
+  const { parseCountdown } = await import("./parser-DQKZDA2J.js");
+  const { renderCountdownForExport } = await import("./renderer-UHLTPQTW.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const parsed = parseCountdown(content, effectivePalette);
   if (parsed.error) return "";
@@ -2912,8 +2925,8 @@ async function exportCountdown(ctx) {
 }
 async function exportClock(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseClock } = await import("./parser-F4ZKDGUZ.js");
-  const { renderClockForExport } = await import("./renderer-CVWQD442.js");
+  const { parseClock } = await import("./parser-DEWJM5PX.js");
+  const { renderClockForExport } = await import("./renderer-IIN3RY4F.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const parsed = parseClock(content, effectivePalette);
   if (parsed.error) return "";
@@ -2926,8 +2939,8 @@ async function exportClock(ctx) {
 }
 async function exportBracket(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseBracket } = await import("./parser-CJNP7RKR.js");
-  const { renderBracketForExport, bracketExportDimensions } = await import("./renderer-UKHH4UWV.js");
+  const { parseBracket } = await import("./parser-LCUQTABE.js");
+  const { renderBracketForExport, bracketExportDimensions } = await import("./renderer-VBAQQWDB.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const parsed = parseBracket(content, effectivePalette);
   if (parsed.error) return "";
@@ -2941,8 +2954,8 @@ async function exportBracket(ctx) {
 }
 async function exportRaci(ctx) {
   const { content, theme, palette } = ctx;
-  const { parseRaci } = await import("./parser-H4ZUNLX4.js");
-  const { renderRaciForExport } = await import("./renderer-R5HIRN2M.js");
+  const { parseRaci } = await import("./parser-I77632XB.js");
+  const { renderRaciForExport } = await import("./renderer-YLIICO4R.js");
   const effectivePalette = await resolveExportPalette(theme, palette);
   const raciParsed = parseRaci(content, effectivePalette);
   if (raciParsed.error) return "";
@@ -3074,8 +3087,8 @@ async function exportVisualization(ctx) {
   const effectivePalette = await resolveExportPalette(theme, palette);
   const isDark = ctx.isDark;
   const container = createExportContainer(ctx.width, ctx.height);
-  const { parseSequenceDgmo } = await import("./parser-L7T7FY3H.js");
-  const { renderSequenceDiagram } = await import("./renderer-VF7X66SL.js");
+  const { parseSequenceDgmo } = await import("./parser-56UEMRXS.js");
+  const { renderSequenceDiagram } = await import("./renderer-O3O6A3RY.js");
   const seqParsed = parseSequenceDgmo(content, effectivePalette);
   if (seqParsed.error || seqParsed.participants.length === 0) return "";
   const collapsedSections = viewState?.cs ? new Set(viewState.cs) : void 0;
@@ -3648,6 +3661,24 @@ function injectHoverStyles(svg, chartType, opts) {
   return `${svg.slice(0, at)}<style>${css}</style>${svg.slice(at)}`;
 }
 
+// src/utils/root-a11y.ts
+function applyRootA11y(svg, chartType) {
+  if (!chartType) return svg;
+  const m = svg.match(/<svg\b[^>]*>/);
+  if (!m) return svg;
+  const rootTag = m[0];
+  if (/\brole=/.test(rootTag) || /\baria-label=/.test(rootTag)) return svg;
+  const label = `${chartType.charAt(0).toUpperCase()}${chartType.slice(1)} diagram`;
+  const withA11y = rootTag.replace(
+    /^<svg\b/,
+    `<svg role="img" aria-label="${escapeAttr(label)}"`
+  );
+  return svg.replace(rootTag, withA11y);
+}
+function escapeAttr(s) {
+  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+
 // src/render.ts
 var DOM_GLOBALS = [
   "document",
@@ -3739,6 +3770,22 @@ async function render(content, options) {
     );
   })();
   const withLegendInlineWarning = (ds) => legendInlineWarning ? [...ds, legendInlineWarning] : ds;
+  const withCanvasWidthWarning = (ds, svg2) => {
+    const asked = options?.width;
+    if (!asked || asked <= 0) return ds;
+    const vb = /viewBox="[-\d.]+ [-\d.]+ ([\d.]+) /.exec(svg2);
+    const got = vb ? Number(vb[1]) : NaN;
+    if (!Number.isFinite(got) || got <= asked + 1) return ds;
+    return [
+      ...ds,
+      makeDgmoError(
+        1,
+        `This ${chartType ?? "diagram"} is ${Math.round(got)}px wide \u2014 it sizes itself from its content, so the requested width of ${Math.round(asked)}px was not applied.`,
+        "warning",
+        "W_CANVAS_WIDTH_IGNORED"
+      )
+    ];
+  };
   const viewState = options?.viewState ?? (options?.legendState ? {
     ...options.legendState.activeGroup !== void 0 && {
       tag: options.legendState.activeGroup
@@ -3754,10 +3801,16 @@ async function render(content, options) {
         ...options?.width !== void 0 && { width: options.width },
         ...options?.height !== void 0 && { height: options.height }
       });
-      const svg2 = injectHoverStyles(raw, chartType, { bakeHover });
+      const svg2 = applyRootA11y(
+        injectHoverStyles(raw, chartType, { bakeHover }),
+        chartType
+      );
       return {
         svg: svg2,
-        diagnostics: withLegendInlineWarning(diagnostics),
+        diagnostics: withCanvasWidthWarning(
+          withLegendInlineWarning(diagnostics),
+          svg2
+        ),
         chartType: chartType ?? void 0
       };
     } finally {
@@ -3788,7 +3841,10 @@ async function render(content, options) {
         }
       }
     );
-    svg = injectHoverStyles(svg, chartType, { bakeHover });
+    svg = applyRootA11y(
+      injectHoverStyles(svg, chartType, { bakeHover }),
+      chartType
+    );
   } finally {
     releaseDom();
   }
@@ -3797,7 +3853,10 @@ async function render(content, options) {
   }
   return {
     svg,
-    diagnostics: withLegendInlineWarning(diagnostics),
+    diagnostics: withCanvasWidthWarning(
+      withLegendInlineWarning(diagnostics),
+      svg
+    ),
     chartType: chartType ?? void 0
   };
 }
@@ -3810,6 +3869,7 @@ export {
   renderVenn,
   renderQuadrant,
   renderForExport,
+  DEFAULT_DIM_OPACITY,
   render
 };
-//# sourceMappingURL=chunk-HDLRRY3N.js.map
+//# sourceMappingURL=chunk-3KFGPXHD.js.map