@diagrammo/dgmo 0.77.0 → 0.78.0

package/dist/{chunk-N5NQIZ56.js → chunk-36UQ77JV.js}

@@ -1,51 +1,53 @@
 import {
   computeNodeText,
   layoutMindmap
-} from "./chunk-QMFIZQTB.js";
-import {
-  extractExportSvg,
-  runInExportContainer
-} from "./chunk-YM5RMLFO.js";
+} from "./chunk-IDGQB6XD.js";
 import {
   renderInlineText
-} from "./chunk-WGC42WJU.js";
+} from "./chunk-FWNJDD4U.js";
+import {
+  ScaleContext
+} from "./chunk-24YPR5EH.js";
 import {
+  CARD_RADIUS,
   COLLAPSE_BAR_HEIGHT,
   EDGE_STROKE_WIDTH,
+  HEADER_HEIGHT,
   NODE_STROKE_WIDTH
-} from "./chunk-FJ57274M.js";
+} from "./chunk-IIEI7VK5.js";
 import {
-  ScaleContext
-} from "./chunk-24YPR5EH.js";
+  extractExportSvg,
+  runInExportContainer
+} from "./chunk-QFIXL3OK.js";
 import {
   layoutInlineHeader
-} from "./chunk-MG3DE3VO.js";
+} from "./chunk-FLMXJMMY.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT
-} from "./chunk-DEW62ON3.js";
+} from "./chunk-VSPNH7LC.js";
 import {
   renderIntegratedLegend
-} from "./chunk-U4DS2ODO.js";
+} from "./chunk-67I3HFSF.js";
 import {
   getLegendExtent,
   getMaxLegendReservedHeight
-} from "./chunk-VRPV6QXR.js";
+} from "./chunk-IZTU6WVR.js";
 import {
   FONT_FAMILY
-} from "./chunk-53SEVJQM.js";
+} from "./chunk-ICLB27PZ.js";
 import {
   LEGEND_GROUP_GAP
-} from "./chunk-YT5ICQ4R.js";
+} from "./chunk-MFK7LF66.js";
 import {
   parseMindmap
-} from "./chunk-QOVM5VRC.js";
+} from "./chunk-57GSSHBR.js";
 import {
   preprocessDescriptionLine
 } from "./chunk-IYULMRBE.js";
 import {
   tagAttrKey
-} from "./chunk-76LHNLGX.js";
+} from "./chunk-R4YGH7DJ.js";
 import {
   fillModeFromOptions,
   legendInlineRequested,
@@ -54,16 +56,14 @@ import {
 import {
   contrastText,
   shapeFill
-} from "./chunk-GLREDNBA.js";
+} from "./chunk-YVLTNNME.js";
 
 // src/mindmap/renderer.ts
 import * as d3Selection from "d3-selection";
 var DIAGRAM_PADDING = 20;
 var TITLE_HEIGHT = 30;
-var SINGLE_LABEL_HEIGHT = 28;
 var LABEL_LINE_HEIGHT = 18;
 var DESC_LINE_HEIGHT = 14;
-var NODE_RADIUS = 6;
 var ROOT_STROKE_WIDTH = 2.5;
 function nodeFill(palette, isDark, nodeColor, fillMode) {
   const color = nodeColor ?? palette.primary;
@@ -318,7 +318,7 @@ function renderMindmap(container, parsed, layout, palette, isDark, onClickItem,
         node.hiddenCount != null && node.hiddenCount > 0 ? "false" : "true"
       ).attr("aria-label", node.label);
     }
-    nodeG.append("rect").attr("x", node.x).attr("y", node.y).attr("width", node.width).attr("height", node.height).attr("rx", NODE_RADIUS).attr("ry", NODE_RADIUS).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", strokeW);
+    nodeG.append("rect").attr("x", node.x).attr("y", node.y).attr("width", node.width).attr("height", node.height).attr("rx", CARD_RADIUS).attr("ry", CARD_RADIUS).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", strokeW);
     const collapsed = node.hiddenCount != null && node.hiddenCount > 0;
     const showDesc = !hideDescriptions && !!node.description && !collapsed;
     const textLayout = computeNodeText(
@@ -335,7 +335,7 @@ function renderMindmap(container, parsed, layout, palette, isDark, onClickItem,
       descFontSize
     } = textLayout;
     const labelLineCount = labelLines.length;
-    const labelZoneH = labelLineCount <= 1 ? SINGLE_LABEL_HEIGHT : LABEL_LINE_HEIGHT * labelLineCount;
+    const labelZoneH = labelLineCount <= 1 ? HEADER_HEIGHT : LABEL_LINE_HEIGHT * labelLineCount;
     const labelZoneHeight = showDesc ? labelZoneH : node.height;
     const centerX = node.x + node.width / 2;
     if (labelLineCount <= 1) {
@@ -372,7 +372,7 @@ function renderMindmap(container, parsed, layout, palette, isDark, onClickItem,
     if (!isExport && node.hiddenCount != null && node.hiddenCount > 0) {
       const clipId = `collapse-clip-${node.id}`;
       const defs = mainG.append("defs");
-      defs.append("clipPath").attr("id", clipId).append("rect").attr("x", node.x).attr("y", node.y).attr("width", node.width).attr("height", node.height).attr("rx", NODE_RADIUS).attr("ry", NODE_RADIUS);
+      defs.append("clipPath").attr("id", clipId).append("rect").attr("x", node.x).attr("y", node.y).attr("width", node.width).attr("height", node.height).attr("rx", CARD_RADIUS).attr("ry", CARD_RADIUS);
       nodeG.append("rect").attr("class", "collapse-bar").attr("x", node.x).attr("y", node.y + node.height - COLLAPSE_BAR_HEIGHT).attr("width", node.width).attr("height", COLLAPSE_BAR_HEIGHT).attr("fill", stroke).attr("clip-path", `url(#${clipId})`);
     }
     if (onClickItem) {
@@ -426,4 +426,4 @@ export {
   renderMindmap,
   renderMindmapForExport
 };
-//# sourceMappingURL=chunk-N5NQIZ56.js.map
+//# sourceMappingURL=chunk-36UQ77JV.js.map

package/dist/chunk-3DPOIW3W.js

@@ -0,0 +1,10 @@
+// src/utils/now.ts
+var pinnedMs = null;
+function now() {
+  return pinnedMs ?? Date.now();
+}
+
+export {
+  now
+};
+//# sourceMappingURL=chunk-3DPOIW3W.js.map

package/dist/{chunk-3SP6G4LN.js → chunk-3GLTQZKE.js}

@@ -9,7 +9,7 @@ import {
   stripDefaultModifier,
   tagAttrKey,
   validateTagGroupNames
-} from "./chunk-76LHNLGX.js";
+} from "./chunk-R4YGH7DJ.js";
 import {
   AliasRegistry,
   KANBAN_REGISTRY,
@@ -400,4 +400,4 @@ function parseCardLine(trimmed, lineNumber, counter, metaAliasMap, _palette, dia
 export {
   parseKanban
 };
-//# sourceMappingURL=chunk-3SP6G4LN.js.map
+//# sourceMappingURL=chunk-3GLTQZKE.js.map

package/dist/{chunk-DY7KDZUF.js → chunk-3OWIYK52.js}

@@ -1,6 +1,6 @@
 import {
   isTagBlockHeading
-} from "./chunk-76LHNLGX.js";
+} from "./chunk-R4YGH7DJ.js";
 import {
   OPTION_NOCOLON_RE,
   measureIndent,
@@ -690,4 +690,4 @@ export {
   resetWireframeIds,
   parseWireframe
 };
-//# sourceMappingURL=chunk-DY7KDZUF.js.map
+//# sourceMappingURL=chunk-3OWIYK52.js.map

package/dist/{chunk-3E4YB6TY.js → chunk-3XFOE3DQ.js}

@@ -1,17 +1,20 @@
+import {
+  paintRootBackground
+} from "./chunk-QFIXL3OK.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-53SEVJQM.js";
+} from "./chunk-ICLB27PZ.js";
 import {
   getSeriesColors
-} from "./chunk-GLREDNBA.js";
+} from "./chunk-YVLTNNME.js";
 
 // src/utils/d3-helpers.ts
 import * as d3Selection from "d3-selection";
@@ -90,8 +93,9 @@ var EXPORT_WIDTH = 1200;
 var EXPORT_HEIGHT = 800;
 async function resolveExportPalette(theme, palette) {
   if (palette) return palette;
-  const { getPalette } = await import("./palettes-54YSI3IX.js");
-  return theme === "dark" ? getPalette("nord").dark : getPalette("nord").light;
+  const { getPalette, DEFAULT_PALETTE_ID } = await import("./palettes-YIPSRYXP.js");
+  const cfg = getPalette(DEFAULT_PALETTE_ID);
+  return theme === "dark" ? cfg.dark : cfg.light;
 }
 function createExportContainer(width, height) {
   const container = document.createElement("div");
@@ -113,6 +117,7 @@ function finalizeSvgExport(container, theme, palette) {
   svgEl.setAttribute("xmlns", "http://www.w3.org/2000/svg");
   svgEl.style.fontFamily = FONT_FAMILY;
   svgEl.querySelectorAll("[data-export-ignore]").forEach((el) => el.remove());
+  paintRootBackground(svgEl, theme, palette.bg);
   const svgHtml = serializeSvg(svgEl);
   document.body.removeChild(container);
   return svgHtml;
@@ -130,4 +135,4 @@ export {
   createExportContainer,
   finalizeSvgExport
 };
-//# sourceMappingURL=chunk-3E4YB6TY.js.map
+//# sourceMappingURL=chunk-3XFOE3DQ.js.map

package/dist/{chunk-W7UBPARG.js → chunk-3ZLQM6XN.js}

@@ -4,7 +4,7 @@ import {
   matchTagBlockHeading,
   stripDefaultModifier,
   tagAttrKey
-} from "./chunk-76LHNLGX.js";
+} from "./chunk-R4YGH7DJ.js";
 import {
   FILL_FAMILY_TOKENS,
   extractColor,
@@ -692,4 +692,4 @@ export {
   SWIMLANE_DIAGNOSTICS,
   parseSwimlane
 };
-//# sourceMappingURL=chunk-W7UBPARG.js.map
+//# sourceMappingURL=chunk-3ZLQM6XN.js.map

package/dist/{chunk-5GM6BZO7.js → chunk-4AWLEWSD.js}

@@ -1,3 +1,6 @@
+import {
+  EDGE_DASH
+} from "./chunk-IIEI7VK5.js";
 import {
   measureText
 } from "./chunk-MTGGOCND.js";
@@ -6,7 +9,7 @@ import {
 function renderNodeCard(container, opts) {
   const rect = container.append("rect").attr("x", 0).attr("y", 0).attr("width", opts.width).attr("height", opts.height).attr("rx", opts.rx).attr("fill", opts.fill).attr("stroke", opts.stroke).attr("stroke-width", opts.strokeWidth);
   if (opts.dashed) {
-    rect.attr("stroke-dasharray", "6 3");
+    rect.attr("stroke-dasharray", EDGE_DASH);
   }
   const labelLines = opts.labelLines;
   if (labelLines && labelLines.length > 1) {
@@ -44,4 +47,4 @@ export {
   renderNodeCard,
   renderCollapseBar
 };
-//# sourceMappingURL=chunk-5GM6BZO7.js.map
+//# sourceMappingURL=chunk-4AWLEWSD.js.map

package/dist/{chunk-SWUQJ5VR.js → chunk-4IGUEGD6.js}

@@ -4,46 +4,57 @@ import {
   layoutC4Containers,
   layoutC4Context,
   layoutC4Deployment
-} from "./chunk-FPRMP6YA.js";
+} from "./chunk-AHN2CVCH.js";
+import {
+  appendArrowheadMarkers,
+  appendReverseArrowheadMarkers
+} from "./chunk-XBJJP2HN.js";
 import {
   renderInlineText
-} from "./chunk-WGC42WJU.js";
+} from "./chunk-FWNJDD4U.js";
 import {
+  ARROWHEAD_HEIGHT,
+  ARROWHEAD_WIDTH,
   CARD_RADIUS,
+  COLLAPSE_BAR_HEIGHT,
+  CONTAINER_RADIUS,
+  EDGE_DASH,
+  EDGE_LABEL_KNOCKOUT_OPACITY,
   EDGE_STROKE_WIDTH,
+  LABEL_FONT_SIZE,
   META_FONT_SIZE,
   META_LINE_HEIGHT,
   NODE_STROKE_WIDTH
-} from "./chunk-FJ57274M.js";
+} from "./chunk-IIEI7VK5.js";
 import {
   serializeSvg
-} from "./chunk-RU2HHHYA.js";
+} from "./chunk-LD2JSKU3.js";
 import {
   TITLE_FONT_SIZE,
   TITLE_FONT_WEIGHT
-} from "./chunk-DEW62ON3.js";
+} from "./chunk-VSPNH7LC.js";
 import {
   renderIntegratedLegend
-} from "./chunk-U4DS2ODO.js";
+} from "./chunk-67I3HFSF.js";
 import {
   FONT_FAMILY
-} from "./chunk-53SEVJQM.js";
+} from "./chunk-ICLB27PZ.js";
 import {
   LEGEND_HEIGHT
-} from "./chunk-YT5ICQ4R.js";
+} from "./chunk-MFK7LF66.js";
 import {
   measureText,
   wrapTextToWidth
 } from "./chunk-MTGGOCND.js";
 import {
   parseC4
-} from "./chunk-ZM27UI5O.js";
+} from "./chunk-A7Y32YD6.js";
 import {
   preprocessDescriptionLine
 } from "./chunk-IYULMRBE.js";
 import {
   tagAttrKey
-} from "./chunk-76LHNLGX.js";
+} from "./chunk-R4YGH7DJ.js";
 import {
   fillModeFromOptions
 } from "./chunk-M5OOAP65.js";
@@ -51,7 +62,7 @@ import {
   contrastText,
   mix,
   shapeFill
-} from "./chunk-GLREDNBA.js";
+} from "./chunk-YVLTNNME.js";
 
 // src/c4/renderer.ts
 import * as d3Selection from "d3-selection";
@@ -60,9 +71,6 @@ var DIAGRAM_PADDING = 20;
 var MAX_SCALE = 3;
 var TITLE_HEIGHT = 30;
 var TYPE_FONT_SIZE = 10;
-var NAME_FONT_SIZE = 14;
-var DESC_FONT_SIZE = 11;
-var DESC_LINE_HEIGHT = 16;
 var EDGE_LABEL_FONT_SIZE = 11;
 var TECH_FONT_SIZE = 10;
 var CARD_H_PAD = 20;
@@ -71,9 +79,6 @@ var TYPE_LABEL_HEIGHT = 18;
 var DIVIDER_GAP = 6;
 var NAME_HEIGHT = 20;
 var BOUNDARY_LABEL_FONT_SIZE = 12;
-var BOUNDARY_STROKE_WIDTH = 1.5;
-var BOUNDARY_RADIUS = 8;
-var DRILL_BAR_HEIGHT = 6;
 var CYLINDER_RY = 8;
 var PERSON_HEAD_R = 4;
 var PERSON_ARM_SPAN = 10;
@@ -141,10 +146,17 @@ function renderC4Context(container, parsed, layout, palette, isDark, onClickItem
   const offsetY = titleHeight + DIAGRAM_PADDING + legendReserveH;
   const svg = d3Selection.select(container).append("svg").attr("width", width).attr("height", height).attr("viewBox", `0 0 ${width} ${height}`).attr("preserveAspectRatio", "xMidYMid meet").style("font-family", FONT_FAMILY);
   const defs = svg.append("defs");
-  const AW = 10;
-  const AH = 7;
-  defs.append("marker").attr("id", "c4-arrow-end").attr("viewBox", `0 0 ${AW} ${AH}`).attr("refX", AW).attr("refY", AH / 2).attr("markerWidth", AW).attr("markerHeight", AH).attr("orient", "auto").append("polygon").attr("points", `0,0 ${AW},${AH / 2} 0,${AH}`).attr("fill", palette.textMuted);
-  defs.append("marker").attr("id", "c4-arrow-start").attr("viewBox", `0 0 ${AW} ${AH}`).attr("refX", 0).attr("refY", AH / 2).attr("markerWidth", AW).attr("markerHeight", AH).attr("orient", "auto").append("polygon").attr("points", `${AW},0 0,${AH / 2} ${AW},${AH}`).attr("fill", palette.textMuted);
+  const markerOpts = {
+    idPrefix: "c4",
+    width: ARROWHEAD_WIDTH,
+    height: ARROWHEAD_HEIGHT,
+    baseFill: palette.textMuted
+  };
+  appendArrowheadMarkers(defs, markerOpts);
+  appendReverseArrowheadMarkers(defs, {
+    ...markerOpts,
+    reverseSuffix: "arrow-start"
+  });
   if (parsed.title && parsed.options["no-title"] !== "on") {
     const titleEl = svg.append("text").attr("class", "chart-title").attr("x", width / 2).attr("y", 30).attr("text-anchor", "middle").attr("fill", palette.text).attr("font-size", TITLE_FONT_SIZE).attr("font-weight", TITLE_FONT_WEIGHT).style(
       "cursor",
@@ -175,9 +187,9 @@ function renderC4Context(container, parsed, layout, palette, isDark, onClickItem
     const bidir = hasBidirectionalMarkers(edge.arrowType);
     const pathD = lineGenerator(edge.points);
     if (pathD) {
-      const pathEl = edgeG.append("path").attr("d", pathD).attr("fill", "none").attr("stroke", edgeColor).attr("stroke-width", EDGE_STROKE_WIDTH).attr("class", "c4-edge").attr("marker-end", "url(#c4-arrow-end)");
+      const pathEl = edgeG.append("path").attr("d", pathD).attr("fill", "none").attr("stroke", edgeColor).attr("stroke-width", EDGE_STROKE_WIDTH).attr("class", "c4-edge").attr("marker-end", "url(#c4-arrow)");
       if (dashed) {
-        pathEl.attr("stroke-dasharray", "6 3");
+        pathEl.attr("stroke-dasharray", EDGE_DASH);
       }
       if (bidir) {
         pathEl.attr("marker-start", "url(#c4-arrow-start)");
@@ -194,7 +206,7 @@ function renderC4Context(container, parsed, layout, palette, isDark, onClickItem
       );
       const bgW = textW + 12;
       const bgH = (labelText ? 16 : 0) + (techText ? 14 : 0) + 4;
-      edgeG.append("rect").attr("x", midPt.x - bgW / 2).attr("y", midPt.y - bgH / 2).attr("width", bgW).attr("height", bgH).attr("rx", 3).attr("fill", palette.bg).attr("opacity", 0.9).attr("class", "c4-edge-label-bg");
+      edgeG.append("rect").attr("x", midPt.x - bgW / 2).attr("y", midPt.y - bgH / 2).attr("width", bgW).attr("height", bgH).attr("rx", 3).attr("fill", palette.bg).attr("opacity", EDGE_LABEL_KNOCKOUT_OPACITY).attr("class", "c4-edge-label-bg");
       let textY = midPt.y;
       if (labelText && techText) {
         textY = midPt.y - 4;
@@ -247,7 +259,7 @@ function renderC4Context(container, parsed, layout, palette, isDark, onClickItem
     nodeG.append("text").attr("x", 0).attr("y", yPos + TYPE_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", TYPE_FONT_SIZE).attr("font-style", "italic").text(typeLabel);
     yPos += TYPE_LABEL_HEIGHT;
     if (node.type === "person") {
-      const textWidth = measureText(node.name, NAME_FONT_SIZE, { bold: true });
+      const textWidth = measureText(node.name, LABEL_FONT_SIZE, { bold: true });
       const gap = 6;
       const totalWidth = PERSON_ICON_W + gap + textWidth;
       const iconCx = -totalWidth / 2 + PERSON_ICON_W / 2;
@@ -255,38 +267,38 @@ function renderC4Context(container, parsed, layout, palette, isDark, onClickItem
       drawPersonIcon(
         nodeG,
         iconCx,
-        yPos + NAME_FONT_SIZE / 2 - 2,
+        yPos + LABEL_FONT_SIZE / 2 - 2,
         stroke
       );
-      nodeG.append("text").attr("x", textX).attr("y", yPos + NAME_FONT_SIZE / 2).attr("text-anchor", "start").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", NAME_FONT_SIZE).attr("font-weight", "bold").text(node.name);
+      nodeG.append("text").attr("x", textX).attr("y", yPos + LABEL_FONT_SIZE / 2).attr("text-anchor", "start").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", LABEL_FONT_SIZE).attr("font-weight", "bold").text(node.name);
     } else {
-      nodeG.append("text").attr("x", 0).attr("y", yPos + NAME_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", NAME_FONT_SIZE).attr("font-weight", "bold").text(node.name);
+      nodeG.append("text").attr("x", 0).attr("y", yPos + LABEL_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", LABEL_FONT_SIZE).attr("font-weight", "bold").text(node.name);
     }
     yPos += NAME_HEIGHT;
-    nodeG.append("line").attr("x1", -w / 2 + CARD_H_PAD / 2).attr("y1", yPos).attr("x2", w / 2 - CARD_H_PAD / 2).attr("y2", yPos).attr("stroke", fillMode === "solid" ? onFillText : stroke).attr("stroke-width", 0.5).attr("stroke-opacity", 0.4);
+    nodeG.append("line").attr("x1", -w / 2 + CARD_H_PAD / 2).attr("y1", yPos).attr("x2", w / 2 - CARD_H_PAD / 2).attr("y2", yPos).attr("stroke", fillMode === "solid" ? onFillText : stroke).attr("stroke-width", 1).attr("stroke-opacity", 0.3);
     yPos += DIVIDER_GAP;
     if (node.description) {
       const contentWidth = w - CARD_H_PAD * 2;
       const lines = wrapTextToWidth(
         node.description,
-        DESC_FONT_SIZE,
+        META_FONT_SIZE,
         contentWidth
       );
       for (const line2 of lines) {
-        const textEl = nodeG.append("text").attr("x", 0).attr("y", yPos + DESC_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", DESC_FONT_SIZE);
+        const textEl = nodeG.append("text").attr("x", 0).attr("y", yPos + META_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", META_FONT_SIZE);
         renderInlineText(
           textEl,
           preprocessDescriptionLine(line2),
           palette,
-          DESC_FONT_SIZE
+          META_FONT_SIZE
         );
-        yPos += DESC_LINE_HEIGHT;
+        yPos += META_LINE_HEIGHT;
       }
     }
     if (node.drillable) {
       const clipId = `clip-drill-${node.id.replace(/\s+/g, "-")}`;
       nodeG.append("clipPath").attr("id", clipId).append("rect").attr("x", -w / 2).attr("y", -h / 2).attr("width", w).attr("height", h).attr("rx", CARD_RADIUS);
-      nodeG.append("rect").attr("x", -w / 2).attr("y", h / 2 - DRILL_BAR_HEIGHT).attr("width", w).attr("height", DRILL_BAR_HEIGHT).attr("fill", fillMode === "solid" ? onFillText : stroke).attr("clip-path", `url(#${clipId})`).attr("class", "c4-drill-bar");
+      nodeG.append("rect").attr("x", -w / 2).attr("y", h / 2 - COLLAPSE_BAR_HEIGHT).attr("width", w).attr("height", COLLAPSE_BAR_HEIGHT).attr("fill", fillMode === "solid" ? onFillText : stroke).attr("clip-path", `url(#${clipId})`).attr("class", "c4-drill-bar");
     }
   }
   if (hasLegend) {
@@ -347,14 +359,14 @@ function drawCylinderCard(nodeG, w, h, fill, stroke, dashed) {
   ].join(" ");
   const el = nodeG.append("path").attr("d", path).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", NODE_STROKE_WIDTH);
   if (dashed) {
-    el.attr("stroke-dasharray", "6 3");
+    el.attr("stroke-dasharray", EDGE_DASH);
   }
   nodeG.append("ellipse").attr("cx", 0).attr("cy", -h / 2 + ry).attr("rx", w / 2).attr("ry", ry).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", NODE_STROKE_WIDTH);
 }
 function drawCardRect(nodeG, w, h, fill, stroke, dashed) {
   const el = nodeG.append("rect").attr("x", -w / 2).attr("y", -h / 2).attr("width", w).attr("height", h).attr("rx", CARD_RADIUS).attr("ry", CARD_RADIUS).attr("fill", fill).attr("stroke", stroke).attr("stroke-width", NODE_STROKE_WIDTH);
   if (dashed) {
-    el.attr("stroke-dasharray", "6 3");
+    el.attr("stroke-dasharray", EDGE_DASH);
   }
 }
 function renderEdges(contentG, edges, palette, onClickItem, obstacleRects) {
@@ -372,9 +384,9 @@ function renderEdges(contentG, edges, palette, onClickItem, obstacleRects) {
     const bidir = hasBidirectionalMarkers(edge.arrowType);
     const pathD = lineGenerator(edge.points);
     if (pathD) {
-      const pathEl = edgeG.append("path").attr("d", pathD).attr("fill", "none").attr("stroke", edgeColor).attr("stroke-width", EDGE_STROKE_WIDTH).attr("class", "c4-edge").attr("marker-end", "url(#c4-arrow-end)");
+      const pathEl = edgeG.append("path").attr("d", pathD).attr("fill", "none").attr("stroke", edgeColor).attr("stroke-width", EDGE_STROKE_WIDTH).attr("class", "c4-edge").attr("marker-end", "url(#c4-arrow)");
       if (dashed) {
-        pathEl.attr("stroke-dasharray", "6 3");
+        pathEl.attr("stroke-dasharray", EDGE_DASH);
       }
       if (bidir) {
         pathEl.attr("marker-start", "url(#c4-arrow-start)");
@@ -404,7 +416,7 @@ function renderEdges(contentG, edges, palette, onClickItem, obstacleRects) {
   }
   placeEdgeLabels(pendingLabels, edges, obstacleRects);
   for (const lbl of pendingLabels) {
-    lbl.edgeG.append("rect").attr("x", lbl.x - lbl.bgW / 2).attr("y", lbl.y - lbl.bgH / 2).attr("width", lbl.bgW).attr("height", lbl.bgH).attr("rx", 3).attr("fill", palette.bg).attr("opacity", 0.9).attr("class", "c4-edge-label-bg");
+    lbl.edgeG.append("rect").attr("x", lbl.x - lbl.bgW / 2).attr("y", lbl.y - lbl.bgH / 2).attr("width", lbl.bgW).attr("height", lbl.bgH).attr("rx", 3).attr("fill", palette.bg).attr("opacity", EDGE_LABEL_KNOCKOUT_OPACITY).attr("class", "c4-edge-label-bg");
     let textY = lbl.y;
     if (lbl.labelText && lbl.techText) {
       textY = lbl.y - 4;
@@ -698,10 +710,17 @@ function renderC4Containers(container, parsed, layout, palette, isDark, onClickI
   const offsetY = titleHeight + DIAGRAM_PADDING + legendReserveH;
   const svg = d3Selection.select(container).append("svg").attr("width", width).attr("height", height).attr("viewBox", `0 0 ${width} ${height}`).attr("preserveAspectRatio", "xMidYMid meet").style("font-family", FONT_FAMILY);
   const defs = svg.append("defs");
-  const AW = 10;
-  const AH = 7;
-  defs.append("marker").attr("id", "c4-arrow-end").attr("viewBox", `0 0 ${AW} ${AH}`).attr("refX", AW).attr("refY", AH / 2).attr("markerWidth", AW).attr("markerHeight", AH).attr("orient", "auto").append("polygon").attr("points", `0,0 ${AW},${AH / 2} 0,${AH}`).attr("fill", palette.textMuted);
-  defs.append("marker").attr("id", "c4-arrow-start").attr("viewBox", `0 0 ${AW} ${AH}`).attr("refX", 0).attr("refY", AH / 2).attr("markerWidth", AW).attr("markerHeight", AH).attr("orient", "auto").append("polygon").attr("points", `${AW},0 0,${AH / 2} ${AW},${AH}`).attr("fill", palette.textMuted);
+  const markerOpts = {
+    idPrefix: "c4",
+    width: ARROWHEAD_WIDTH,
+    height: ARROWHEAD_HEIGHT,
+    baseFill: palette.textMuted
+  };
+  appendArrowheadMarkers(defs, markerOpts);
+  appendReverseArrowheadMarkers(defs, {
+    ...markerOpts,
+    reverseSuffix: "arrow-start"
+  });
   if (parsed.title && parsed.options["no-title"] !== "on") {
     const titleEl = svg.append("text").attr("class", "chart-title").attr("x", width / 2).attr("y", 30).attr("text-anchor", "middle").attr("fill", palette.text).attr("font-size", TITLE_FONT_SIZE).attr("font-weight", TITLE_FONT_WEIGHT).style(
       "cursor",
@@ -729,7 +748,7 @@ function renderC4Containers(container, parsed, layout, palette, isDark, onClickI
         onClickItem(b.lineNumber);
       });
     }
-    boundaryG.append("rect").attr("x", b.x).attr("y", b.y).attr("width", b.width).attr("height", b.height).attr("rx", BOUNDARY_RADIUS).attr("ry", BOUNDARY_RADIUS).attr("fill", boundaryFill).attr("stroke", boundaryStroke).attr("stroke-width", BOUNDARY_STROKE_WIDTH);
+    boundaryG.append("rect").attr("x", b.x).attr("y", b.y).attr("width", b.width).attr("height", b.height).attr("rx", CONTAINER_RADIUS).attr("ry", CONTAINER_RADIUS).attr("fill", boundaryFill).attr("stroke", boundaryStroke).attr("stroke-width", NODE_STROKE_WIDTH);
     boundaryG.append("text").attr("x", b.x + 12).attr("y", b.y + 16).attr("fill", palette.textMuted).attr("font-size", BOUNDARY_LABEL_FONT_SIZE).attr("font-style", "italic").text(`${b.label} \u2014 ${b.typeLabel}`);
   }
   if (layout.groupBoundaries.length > 0) {
@@ -742,7 +761,7 @@ function renderC4Containers(container, parsed, layout, palette, isDark, onClickI
           onClickItem(gb.lineNumber);
         });
       }
-      gbG.append("rect").attr("x", gb.x).attr("y", gb.y).attr("width", gb.width).attr("height", gb.height).attr("rx", 6).attr("ry", 6).attr("fill", groupFill).attr("stroke", groupStroke).attr("stroke-width", 1);
+      gbG.append("rect").attr("x", gb.x).attr("y", gb.y).attr("width", gb.width).attr("height", gb.height).attr("rx", CONTAINER_RADIUS).attr("ry", CONTAINER_RADIUS).attr("fill", groupFill).attr("stroke", groupStroke).attr("stroke-width", NODE_STROKE_WIDTH);
       gbG.append("text").attr("x", gb.x + 10).attr("y", gb.y + 14).attr("fill", palette.textMuted).attr("font-size", BOUNDARY_LABEL_FONT_SIZE).attr("font-style", "italic").text(gb.label);
     }
   }
@@ -827,7 +846,7 @@ function renderC4Containers(container, parsed, layout, palette, isDark, onClickI
       yPos += TYPE_LABEL_HEIGHT;
     }
     if (node.type === "person") {
-      const textWidth = measureText(node.name, NAME_FONT_SIZE, { bold: true });
+      const textWidth = measureText(node.name, LABEL_FONT_SIZE, { bold: true });
       const gap = 6;
       const totalWidth = PERSON_ICON_W + gap + textWidth;
       const iconCx = -totalWidth / 2 + PERSON_ICON_W / 2;
@@ -835,12 +854,12 @@ function renderC4Containers(container, parsed, layout, palette, isDark, onClickI
       drawPersonIcon(
         nodeG,
         iconCx,
-        yPos + NAME_FONT_SIZE / 2 - 2,
+        yPos + LABEL_FONT_SIZE / 2 - 2,
         stroke
       );
-      nodeG.append("text").attr("x", textX).attr("y", yPos + NAME_FONT_SIZE / 2).attr("text-anchor", "start").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", NAME_FONT_SIZE).attr("font-weight", "bold").text(node.name);
+      nodeG.append("text").attr("x", textX).attr("y", yPos + LABEL_FONT_SIZE / 2).attr("text-anchor", "start").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", LABEL_FONT_SIZE).attr("font-weight", "bold").text(node.name);
     } else {
-      nodeG.append("text").attr("x", 0).attr("y", yPos + NAME_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", NAME_FONT_SIZE).attr("font-weight", "bold").text(node.name);
+      nodeG.append("text").attr("x", 0).attr("y", yPos + LABEL_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", LABEL_FONT_SIZE).attr("font-weight", "bold").text(node.name);
     }
     yPos += NAME_HEIGHT;
     if (node.type === "container") {
@@ -848,23 +867,23 @@ function renderC4Containers(container, parsed, layout, palette, isDark, onClickI
         const contentWidth = w - CARD_H_PAD * 2;
         const lines = wrapTextToWidth(
           node.description,
-          DESC_FONT_SIZE,
+          META_FONT_SIZE,
           contentWidth
         );
         for (const line2 of lines) {
-          const textEl = nodeG.append("text").attr("x", 0).attr("y", yPos + DESC_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", DESC_FONT_SIZE);
+          const textEl = nodeG.append("text").attr("x", 0).attr("y", yPos + META_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", META_FONT_SIZE);
           renderInlineText(
             textEl,
             preprocessDescriptionLine(line2),
             palette,
-            DESC_FONT_SIZE
+            META_FONT_SIZE
           );
-          yPos += DESC_LINE_HEIGHT;
+          yPos += META_LINE_HEIGHT;
         }
       }
       const metaEntries = collectCardMetadata(node.metadata);
       if (metaEntries.length > 0) {
-        nodeG.append("line").attr("x1", -w / 2 + CARD_H_PAD / 2).attr("y1", yPos).attr("x2", w / 2 - CARD_H_PAD / 2).attr("y2", yPos).attr("stroke", fillMode === "solid" ? onFillText : stroke).attr("stroke-width", 0.5).attr("stroke-opacity", 0.4);
+        nodeG.append("line").attr("x1", -w / 2 + CARD_H_PAD / 2).attr("y1", yPos).attr("x2", w / 2 - CARD_H_PAD / 2).attr("y2", yPos).attr("stroke", fillMode === "solid" ? onFillText : stroke).attr("stroke-width", 1).attr("stroke-opacity", 0.3);
         yPos += DIVIDER_GAP;
         const maxKeyWidth = Math.max(
           ...metaEntries.map((e) => measureText(`${e.key}: `, META_FONT_SIZE))
@@ -877,31 +896,31 @@ function renderC4Containers(container, parsed, layout, palette, isDark, onClickI
         }
       }
     } else {
-      nodeG.append("line").attr("x1", -w / 2 + CARD_H_PAD / 2).attr("y1", yPos).attr("x2", w / 2 - CARD_H_PAD / 2).attr("y2", yPos).attr("stroke", fillMode === "solid" ? onFillText : stroke).attr("stroke-width", 0.5).attr("stroke-opacity", 0.4);
+      nodeG.append("line").attr("x1", -w / 2 + CARD_H_PAD / 2).attr("y1", yPos).attr("x2", w / 2 - CARD_H_PAD / 2).attr("y2", yPos).attr("stroke", fillMode === "solid" ? onFillText : stroke).attr("stroke-width", 1).attr("stroke-opacity", 0.3);
       yPos += DIVIDER_GAP;
       if (node.description) {
         const contentWidth = w - CARD_H_PAD * 2;
         const lines = wrapTextToWidth(
           node.description,
-          DESC_FONT_SIZE,
+          META_FONT_SIZE,
           contentWidth
         );
         for (const line2 of lines) {
-          const textEl = nodeG.append("text").attr("x", 0).attr("y", yPos + DESC_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", DESC_FONT_SIZE);
+          const textEl = nodeG.append("text").attr("x", 0).attr("y", yPos + META_FONT_SIZE / 2).attr("text-anchor", "middle").attr("dominant-baseline", "central").attr("fill", onFillText).attr("font-size", META_FONT_SIZE);
           renderInlineText(
             textEl,
             preprocessDescriptionLine(line2),
             palette,
-            DESC_FONT_SIZE
+            META_FONT_SIZE
           );
-          yPos += DESC_LINE_HEIGHT;
+          yPos += META_LINE_HEIGHT;
         }
       }
     }
     if (node.drillable) {
       const clipId = `clip-drill-${node.id.replace(/\s+/g, "-")}`;
       nodeG.append("clipPath").attr("id", clipId).append("rect").attr("x", -w / 2).attr("y", -h / 2).attr("width", w).attr("height", h).attr("rx", CARD_RADIUS);
-      nodeG.append("rect").attr("x", -w / 2).attr("y", h / 2 - DRILL_BAR_HEIGHT).attr("width", w).attr("height", DRILL_BAR_HEIGHT).attr("fill", fillMode === "solid" ? onFillText : stroke).attr("clip-path", `url(#${clipId})`).attr("class", "c4-drill-bar");
+      nodeG.append("rect").attr("x", -w / 2).attr("y", h / 2 - COLLAPSE_BAR_HEIGHT).attr("width", w).attr("height", COLLAPSE_BAR_HEIGHT).attr("fill", fillMode === "solid" ? onFillText : stroke).attr("clip-path", `url(#${clipId})`).attr("class", "c4-drill-bar");
     }
   }
   if (hasLegend) {
@@ -1039,4 +1058,4 @@ export {
   renderC4Deployment,
   renderC4DeploymentForExport
 };
-//# sourceMappingURL=chunk-SWUQJ5VR.js.map
+//# sourceMappingURL=chunk-4IGUEGD6.js.map

package/dist/{chunk-QOVM5VRC.js → chunk-57GSSHBR.js}

@@ -11,7 +11,7 @@ import {
   tagAttrKey,
   validateTagGroupNames,
   validateTagValues
-} from "./chunk-76LHNLGX.js";
+} from "./chunk-R4YGH7DJ.js";
 import {
   MINDMAP_REGISTRY,
   OPTION_NOCOLON_RE,
@@ -337,4 +337,4 @@ function findMetadataParent(indent, indentStack) {
 export {
   parseMindmap
 };
-//# sourceMappingURL=chunk-QOVM5VRC.js.map
+//# sourceMappingURL=chunk-57GSSHBR.js.map