@diagrammo/dgmo 0.46.0 → 0.47.0

package/dist/chunk-3R5POCTZ.js

@@ -0,0 +1,967 @@
+import {
+  renderInlineText
+} from "./chunk-3HDBAXF5.js";
+import {
+  wrapDescriptionLines
+} from "./chunk-BMR4CIEO.js";
+import {
+  renderIntegratedLegend
+} from "./chunk-PWIHZ6NJ.js";
+import {
+  ScaleContext
+} from "./chunk-YYVTBZZC.js";
+import {
+  TITLE_FONT_SIZE,
+  TITLE_FONT_WEIGHT,
+  TITLE_Y
+} from "./chunk-A4GOY3PE.js";
+import {
+  FONT_FAMILY
+} from "./chunk-6KFWC4CO.js";
+import {
+  LEGEND_HEIGHT
+} from "./chunk-QOOUC2J5.js";
+import {
+  measureText,
+  wrapTextToWidth
+} from "./chunk-WCT3NYCV.js";
+import {
+  contrastText,
+  shapeFill
+} from "./chunk-P6T66CCZ.js";
+import {
+  resolveColor
+} from "./chunk-TLVIHFRO.js";
+
+// src/cycle/renderer.ts
+import * as d3Selection from "d3-selection";
+
+// src/cycle/types.ts
+var DEFAULT_EDGE_WIDTH = 3;
+var MIN_EDGE_WIDTH = 2;
+var BASE_ARROW_SIZE = 8;
+var ARROW_SCALE = 6;
+function arrowHeadLength(strokeWidth) {
+  return BASE_ARROW_SIZE + ARROW_SCALE * Math.sqrt(strokeWidth);
+}
+
+// src/cycle/layout.ts
+var MIN_ARC_ANGLE = 15 * Math.PI / 180;
+var LABEL_FONT_SIZE = 13;
+var CIRCLE_LABEL_FONT_SIZE = 16;
+var DESC_FONT_SIZE = 11;
+var EDGE_LABEL_FONT_SIZE = 11;
+var MIN_NODE_WIDTH = 70;
+var MAX_NODE_WIDTH = 260;
+var DESC_MIN_WIDTH = 140;
+var DESC_WIDTH_STEP = 20;
+var DESC_TARGET_RATIO = 1.6;
+var PLAIN_NODE_HEIGHT = 50;
+var HEADER_HEIGHT = 36;
+var DESC_LINE_HEIGHT = 16;
+var DESC_PAD_Y = 14;
+var NODE_PAD_X = 20;
+var MIN_CIRCLE_RADIUS = 35;
+var CIRCLE_PAD = 14;
+function computeCycleLayout(parsed, options) {
+  const width = options?.width ?? 800;
+  const height = options?.height ?? 600;
+  const hideDescriptions = options?.hideDescriptions ?? false;
+  if (parsed.nodes.length === 0) {
+    return {
+      nodes: [],
+      edges: [],
+      cx: width / 2,
+      cy: height / 2,
+      radius: 0,
+      width,
+      height,
+      scale: 1
+    };
+  }
+  const nodeCount = parsed.nodes.length;
+  const cx = width / 2;
+  const cy = height / 2;
+  const circleNodes = parsed.options["circle-nodes"] === "true";
+  const nodeDims = parsed.nodes.map((node) => {
+    const hasDesc = !hideDescriptions && node.description.length > 0;
+    const labelWidth = Math.max(
+      MIN_NODE_WIDTH,
+      measureText(node.label, LABEL_FONT_SIZE) + NODE_PAD_X * 2
+    );
+    if (circleNodes) {
+      return computeCircleNodeDims(node, hasDesc);
+    }
+    if (!hasDesc) {
+      return {
+        width: Math.min(MAX_NODE_WIDTH, labelWidth),
+        height: PLAIN_NODE_HEIGHT,
+        wrappedDesc: []
+      };
+    }
+    return chooseDescribedRectDims(node.description, labelWidth);
+  });
+  if (circleNodes) {
+    const maxDiam = Math.max(...nodeDims.map((d) => d.width));
+    for (const d of nodeDims) {
+      d.width = maxDiam;
+      d.height = maxDiam;
+      const nodeIdx = nodeDims.indexOf(d);
+      const node = parsed.nodes[nodeIdx];
+      const hasDesc = !hideDescriptions && node.description.length > 0;
+      if (hasDesc) {
+        d.wrappedDesc = wrapLinesForCircle(node.description, maxDiam / 2).map(
+          (text) => ({ text, kind: "plain" })
+        );
+      }
+    }
+  }
+  const totalSpan = parsed.nodes.reduce((sum, n) => sum + n.span, 0);
+  let rawAngles = parsed.nodes.map((n) => n.span / totalSpan * 2 * Math.PI);
+  const tooSmall = rawAngles.filter((a) => a < MIN_ARC_ANGLE);
+  if (tooSmall.length > 0 && tooSmall.length < nodeCount) {
+    const deficit = tooSmall.reduce((sum, a) => sum + (MIN_ARC_ANGLE - a), 0);
+    const largeTotal = rawAngles.filter((a) => a >= MIN_ARC_ANGLE).reduce((sum, a) => sum + a, 0);
+    rawAngles = rawAngles.map((a) => {
+      if (a < MIN_ARC_ANGLE) return MIN_ARC_ANGLE;
+      return a - a / largeTotal * deficit;
+    });
+  }
+  const isClockwise = parsed.direction === "clockwise";
+  const GAP = 20;
+  let minRadiusForNodes = 0;
+  for (let i = 0; i < nodeCount; i++) {
+    const j = (i + 1) % nodeCount;
+    const diA = Math.sqrt(nodeDims[i].width ** 2 + nodeDims[i].height ** 2) / 2;
+    const diB = Math.sqrt(nodeDims[j].width ** 2 + nodeDims[j].height ** 2) / 2;
+    const neededChord = diA + diB + GAP;
+    const halfAngle = rawAngles[i] / 2;
+    if (halfAngle > 1e-3) {
+      const r = neededChord / (2 * Math.sin(halfAngle));
+      minRadiusForNodes = Math.max(minRadiusForNodes, r);
+    }
+  }
+  const maxNodeHalf = Math.max(
+    ...nodeDims.map((d) => Math.max(d.width, d.height) / 2)
+  );
+  const maxRadius = Math.min(cx, cy) - maxNodeHalf - 10;
+  let radius;
+  let scale = 1;
+  if (minRadiusForNodes <= maxRadius) {
+    radius = Math.max(100, maxRadius);
+  } else {
+    radius = Math.max(80, maxRadius);
+    scale = radius / minRadiusForNodes;
+    for (let i = 0; i < nodeDims.length; i++) {
+      const d = nodeDims[i];
+      const node = parsed.nodes[i];
+      const hasDesc = !hideDescriptions && node.description.length > 0;
+      const newW = Math.max(50, d.width * scale);
+      if (circleNodes) {
+        d.width = newW;
+        d.height = newW;
+        if (hasDesc) {
+          d.wrappedDesc = wrapLinesForCircle(node.description, newW / 2).map(
+            (text) => ({ text, kind: "plain" })
+          );
+        }
+      } else if (hasDesc) {
+        d.width = newW;
+        const layoutWidth = newW / scale;
+        d.wrappedDesc = wrapDescForWidth(node.description, layoutWidth);
+        d.height = renderedDescNodeHeight(d.wrappedDesc.length, scale);
+      } else {
+        d.width = newW;
+        d.height = Math.max(30, d.height * scale);
+      }
+    }
+  }
+  const nodeAngles = new Array(nodeCount);
+  for (let i = 0; i < nodeCount; i++) {
+    nodeAngles[i] = -Math.PI / 2 + i * (2 * Math.PI / nodeCount) * (isClockwise ? 1 : -1);
+  }
+  const ITERATIONS = 3;
+  const footprints = new Array(nodeCount);
+  for (let iter = 0; iter < ITERATIONS; iter++) {
+    for (let i = 0; i < nodeCount; i++) {
+      const theta = nodeAngles[i];
+      const approxX = cx + radius * Math.cos(theta);
+      const approxY = cy + radius * Math.sin(theta);
+      const hw = nodeDims[i].width / 2;
+      const hh = nodeDims[i].height / 2;
+      let exitCW, exitCCW;
+      if (circleNodes) {
+        const nodeR = hw;
+        exitCW = circleNodeExitAngle(nodeR, radius, theta, 1);
+        exitCCW = circleNodeExitAngle(nodeR, radius, theta, -1);
+      } else {
+        exitCW = circleRectExitAngle(
+          approxX,
+          approxY,
+          hw,
+          hh,
+          cx,
+          cy,
+          radius,
+          theta,
+          1
+        );
+        exitCCW = circleRectExitAngle(
+          approxX,
+          approxY,
+          hw,
+          hh,
+          cx,
+          cy,
+          radius,
+          theta,
+          -1
+        );
+      }
+      footprints[i] = Math.abs(exitCW - exitCCW);
+    }
+    const totalFootprint = footprints.reduce(
+      (s, f) => s + f,
+      0
+    );
+    const totalGapAngle = Math.max(0, 2 * Math.PI - totalFootprint);
+    const gapAngles = parsed.nodes.map(
+      (n) => n.span / totalSpan * totalGapAngle
+    );
+    let cumAngle = -Math.PI / 2;
+    for (let i = 0; i < nodeCount; i++) {
+      nodeAngles[i] = cumAngle;
+      const nextIdx = (i + 1) % nodeCount;
+      const advance = footprints[i] / 2 + gapAngles[i] + footprints[nextIdx] / 2;
+      cumAngle += isClockwise ? advance : -advance;
+    }
+  }
+  const layoutNodes = [];
+  for (let i = 0; i < nodeCount; i++) {
+    const angle = nodeAngles[i];
+    layoutNodes.push({
+      label: parsed.nodes[i].label,
+      x: cx + radius * Math.cos(angle),
+      y: cy + radius * Math.sin(angle),
+      angle,
+      width: nodeDims[i].width,
+      height: nodeDims[i].height,
+      wrappedDesc: nodeDims[i].wrappedDesc,
+      isCircle: circleNodes
+    });
+  }
+  let layoutEdges = computeEdgePaths(
+    layoutNodes,
+    parsed,
+    cx,
+    cy,
+    radius,
+    isClockwise
+  );
+  const fitResult = fitToCanvas(
+    layoutNodes,
+    layoutEdges,
+    parsed,
+    cx,
+    cy,
+    radius,
+    width,
+    height,
+    isClockwise
+  );
+  if (fitResult) {
+    radius = fitResult.radius;
+    for (let i = 0; i < nodeCount; i++) {
+      layoutNodes[i].x = cx + radius * Math.cos(nodeAngles[i]);
+      layoutNodes[i].y = cy + radius * Math.sin(nodeAngles[i]);
+    }
+    layoutEdges = computeEdgePaths(
+      layoutNodes,
+      parsed,
+      cx,
+      cy,
+      radius,
+      isClockwise
+    );
+  }
+  return {
+    nodes: layoutNodes,
+    edges: layoutEdges,
+    cx,
+    cy,
+    radius,
+    width,
+    height,
+    scale
+  };
+}
+function chooseDescribedRectDims(description, labelWidth) {
+  const minW = Math.min(
+    MAX_NODE_WIDTH,
+    Math.max(MIN_NODE_WIDTH, labelWidth, DESC_MIN_WIDTH)
+  );
+  let best = null;
+  let bestScore = Infinity;
+  for (let w = minW; w <= MAX_NODE_WIDTH; w += DESC_WIDTH_STEP) {
+    const wrapped2 = wrapDescForWidth(description, w);
+    const h = HEADER_HEIGHT + wrapped2.length * DESC_LINE_HEIGHT + DESC_PAD_Y;
+    const ratio = w / h;
+    const score = Math.abs(Math.log(ratio / DESC_TARGET_RATIO));
+    if (score < bestScore) {
+      bestScore = score;
+      best = { width: w, height: h, wrappedDesc: wrapped2 };
+    }
+  }
+  if (best) return best;
+  const wrapped = wrapDescForWidth(description, minW);
+  return {
+    width: minW,
+    height: HEADER_HEIGHT + wrapped.length * DESC_LINE_HEIGHT + DESC_PAD_Y,
+    wrappedDesc: wrapped
+  };
+}
+function wrapDescForWidth(description, nodeWidth) {
+  const textWidth = Math.max(40, nodeWidth - NODE_PAD_X * 2);
+  return wrapDescriptionLines(
+    [...description],
+    textWidth,
+    (s) => measureText(s, DESC_FONT_SIZE)
+  );
+}
+var RENDERER_DESC_FONT = 11;
+var RENDERER_DESC_FONT_MIN = 8;
+var RENDERER_DESC_LINE_H = 15;
+var RENDERER_DESC_LINE_H_MIN = 11;
+function renderedDescNodeHeight(numLines, scale) {
+  const headerH = HEADER_HEIGHT * scale;
+  const descFont = Math.max(
+    RENDERER_DESC_FONT_MIN,
+    Math.round(RENDERER_DESC_FONT * scale)
+  );
+  const descLineH = Math.max(
+    RENDERER_DESC_LINE_H_MIN,
+    Math.round(RENDERER_DESC_LINE_H * scale)
+  );
+  const textBlockH = 4 + descFont + (numLines - 1) * descLineH;
+  const bottomPad = 8;
+  return headerH + textBlockH + bottomPad;
+}
+var EDGE_LABEL_MAX_WIDTH = 197;
+function wrapEdgeLabelText(label, description, maxWidth = EDGE_LABEL_MAX_WIDTH) {
+  const labelLines = label ? wrapTextToWidth(label, EDGE_LABEL_FONT_SIZE, maxWidth) : [];
+  const descLines = [];
+  for (const d of description) {
+    descLines.push(...wrapTextToWidth(d, EDGE_LABEL_FONT_SIZE, maxWidth));
+  }
+  return { labelLines, descLines };
+}
+function computeCircleNodeDims(node, hasDesc) {
+  if (!hasDesc) {
+    const textW = measureText(node.label, CIRCLE_LABEL_FONT_SIZE);
+    const r2 = Math.max(MIN_CIRCLE_RADIUS, textW / 2 + CIRCLE_PAD);
+    return { width: r2 * 2, height: r2 * 2, wrappedDesc: [] };
+  }
+  let r = MIN_CIRCLE_RADIUS;
+  for (let attempt = 0; attempt < 10; attempt++) {
+    const wrappedDesc2 = wrapLinesForCircle(node.description, r);
+    const totalLines = 1 + wrappedDesc2.length;
+    const textBlockH = totalLines * DESC_LINE_HEIGHT + CIRCLE_PAD;
+    if (textBlockH / 2 <= r * 0.85) {
+      const labelW = measureText(node.label, CIRCLE_LABEL_FONT_SIZE);
+      const labelY = -textBlockH / 2 + DESC_LINE_HEIGHT;
+      const availW = 2 * Math.sqrt(Math.max(0, r * r - labelY * labelY));
+      if (labelW <= availW - CIRCLE_PAD) {
+        return {
+          width: r * 2,
+          height: r * 2,
+          wrappedDesc: wrappedDesc2.map((text) => ({
+            text,
+            kind: "plain"
+          }))
+        };
+      }
+    }
+    r += 10;
+  }
+  const wrappedDesc = wrapLinesForCircle(node.description, r);
+  return {
+    width: r * 2,
+    height: r * 2,
+    wrappedDesc: wrappedDesc.map((text) => ({ text, kind: "plain" }))
+  };
+}
+function wrapLinesForCircle(descriptions, radius) {
+  const centerWidth = radius * 2 * 0.75;
+  const roughWrapped = descriptions.flatMap(
+    (d) => wrapTextToWidth(d, DESC_FONT_SIZE, centerWidth)
+  );
+  const totalLines = 1 + roughWrapped.length;
+  const blockH = totalLines * DESC_LINE_HEIGHT;
+  const result = [];
+  let lineIdx = 1;
+  for (const srcLine of descriptions) {
+    const words = srcLine.split(/\s+/).filter((w) => w.length > 0);
+    let current = "";
+    for (const word of words) {
+      const y = -blockH / 2 + (lineIdx + 0.5) * DESC_LINE_HEIGHT;
+      const rSq = radius * radius;
+      const availPx = Math.max(
+        20,
+        y * y < rSq ? 2 * Math.sqrt(rSq - y * y) - CIRCLE_PAD * 2 : centerWidth
+      );
+      const test = current ? `${current} ${word}` : word;
+      if (measureText(test, DESC_FONT_SIZE) > availPx && current) {
+        result.push(current);
+        lineIdx++;
+        current = word;
+      } else {
+        current = test;
+      }
+    }
+    if (current) {
+      result.push(current);
+      lineIdx++;
+    }
+  }
+  return result;
+}
+function circleNodeExitAngle(nodeR, cycleR, nodeAngle, direction) {
+  const cosAlpha = Math.max(
+    -1,
+    Math.min(1, 1 - nodeR * nodeR / (2 * cycleR * cycleR))
+  );
+  const halfAngle = Math.acos(cosAlpha);
+  return nodeAngle + direction * halfAngle;
+}
+function insideRect(px, py, rx, ry, hw, hh) {
+  return Math.abs(px - rx) < hw && Math.abs(py - ry) < hh;
+}
+function circleRectExitAngle(nodeCx, nodeCy, halfW, halfH, circleCx, circleCy, radius, nodeAngle, direction) {
+  const steps = 90;
+  const maxSweep = Math.PI;
+  const step = maxSweep / steps;
+  let insideAngle = nodeAngle;
+  let outsideAngle = nodeAngle + direction * step;
+  for (let i = 1; i <= steps; i++) {
+    const angle = nodeAngle + direction * step * i;
+    const px = circleCx + radius * Math.cos(angle);
+    const py = circleCy + radius * Math.sin(angle);
+    if (!insideRect(px, py, nodeCx, nodeCy, halfW, halfH)) {
+      outsideAngle = angle;
+      insideAngle = nodeAngle + direction * step * (i - 1);
+      break;
+    }
+  }
+  for (let i = 0; i < 16; i++) {
+    const mid = (insideAngle + outsideAngle) / 2;
+    const px = circleCx + radius * Math.cos(mid);
+    const py = circleCy + radius * Math.sin(mid);
+    if (insideRect(px, py, nodeCx, nodeCy, halfW, halfH)) {
+      insideAngle = mid;
+    } else {
+      outsideAngle = mid;
+    }
+  }
+  return (insideAngle + outsideAngle) / 2;
+}
+function computeEdgePaths(layoutNodes, parsed, cx, cy, radius, isClockwise) {
+  return parsed.edges.map((edge) => {
+    const src = layoutNodes[edge.sourceIndex];
+    const tgt = layoutNodes[edge.targetIndex];
+    const strokeWidth = Math.max(
+      edge.width ?? DEFAULT_EDGE_WIDTH,
+      MIN_EDGE_WIDTH
+    );
+    const arrowLen = arrowHeadLength(strokeWidth) * 0.9;
+    const { path, midAngle } = buildEdgeArc(
+      src,
+      tgt,
+      cx,
+      cy,
+      radius,
+      isClockwise,
+      arrowLen
+    );
+    const { labelLines, descLines } = wrapEdgeLabelText(
+      edge.label,
+      edge.description
+    );
+    const lineCount = labelLines.length + descLines.length;
+    let labelPxW = 0;
+    for (const l of labelLines)
+      labelPxW = Math.max(labelPxW, measureText(l, EDGE_LABEL_FONT_SIZE));
+    for (const l of descLines)
+      labelPxW = Math.max(labelPxW, measureText(l, EDGE_LABEL_FONT_SIZE));
+    const { labelX, labelY, labelAngle } = computeEdgeLabelPosition(
+      midAngle,
+      radius,
+      cx,
+      cy,
+      lineCount,
+      labelPxW,
+      layoutNodes
+    );
+    const layoutEdge = {
+      sourceIndex: edge.sourceIndex,
+      targetIndex: edge.targetIndex,
+      path,
+      labelX,
+      labelY,
+      labelAngle,
+      ...edge.label !== void 0 && { label: edge.label }
+    };
+    return layoutEdge;
+  });
+}
+function computeEdgeLabelPosition(midAngle, radius, cx, cy, lineCount, labelPxW, layoutNodes) {
+  if (lineCount === 0 || labelPxW === 0) {
+    return {
+      labelX: cx + radius * Math.cos(midAngle),
+      labelY: cy + radius * Math.sin(midAngle),
+      labelAngle: midAngle
+    };
+  }
+  const EDGE_LABEL_CORNER_OFFSET = 10;
+  const labelW = labelPxW;
+  const labelH = lineCount * 15;
+  const cosT = Math.cos(midAngle);
+  const sinT = Math.sin(midAngle);
+  function place(sign) {
+    const cornerX = cx + (radius + sign * EDGE_LABEL_CORNER_OFFSET) * cosT;
+    const cornerY = cy + (radius + sign * EDGE_LABEL_CORNER_OFFSET) * sinT;
+    const ROUND_THRESH = 0.3;
+    const radialX = sign * cosT;
+    const radialY = sign * sinT;
+    const sx = Math.abs(radialX) < ROUND_THRESH ? 0 : Math.sign(radialX);
+    const sy = Math.abs(radialY) < ROUND_THRESH ? 0 : Math.sign(radialY);
+    const bboxCx = cornerX + sx * labelW / 2;
+    const bboxCy = cornerY + sy * labelH / 2;
+    let labelX;
+    if (sx > 0) labelX = bboxCx - labelW / 2;
+    else if (sx < 0) labelX = bboxCx + labelW / 2;
+    else labelX = bboxCx;
+    const labelY = bboxCy - labelH / 2 + 12;
+    const bbX1 = bboxCx - labelW / 2;
+    const bbX2 = bboxCx + labelW / 2;
+    const bbY1 = bboxCy - labelH / 2;
+    const bbY2 = bboxCy + labelH / 2;
+    let overlap = 0;
+    for (const n of layoutNodes) {
+      const nx1 = n.x - n.width / 2;
+      const nx2 = n.x + n.width / 2;
+      const ny1 = n.y - n.height / 2;
+      const ny2 = n.y + n.height / 2;
+      const ox = Math.max(0, Math.min(bbX2, nx2) - Math.max(bbX1, nx1));
+      const oy = Math.max(0, Math.min(bbY2, ny2) - Math.max(bbY1, ny1));
+      overlap += ox * oy;
+    }
+    const labelAngle = sign === 1 ? midAngle : midAngle + Math.PI;
+    return { labelX, labelY, labelAngle, bbX1, bbX2, bbY1, bbY2, overlap };
+  }
+  const outward = place(1);
+  if (outward.overlap === 0) {
+    return {
+      labelX: outward.labelX,
+      labelY: outward.labelY,
+      labelAngle: outward.labelAngle
+    };
+  }
+  const inward = place(-1);
+  const best = inward.overlap < outward.overlap ? inward : outward;
+  return {
+    labelX: best.labelX,
+    labelY: best.labelY,
+    labelAngle: best.labelAngle
+  };
+}
+function fitToCanvas(nodes, edges, parsed, _cx, _cy, radius, width, height, _isClockwise) {
+  const PADDING = 30;
+  let contentMinX = Infinity, contentMaxX = -Infinity;
+  let contentMinY = Infinity, contentMaxY = -Infinity;
+  for (const n of nodes) {
+    contentMinX = Math.min(contentMinX, n.x - n.width / 2);
+    contentMaxX = Math.max(contentMaxX, n.x + n.width / 2);
+    contentMinY = Math.min(contentMinY, n.y - n.height / 2);
+    contentMaxY = Math.max(contentMaxY, n.y + n.height / 2);
+  }
+  for (let i = 0; i < edges.length; i++) {
+    const le = edges[i];
+    const edge = parsed.edges[i];
+    const { labelLines, descLines } = wrapEdgeLabelText(
+      le.label,
+      edge.description
+    );
+    let textWidth = 0;
+    for (const l of labelLines)
+      textWidth = Math.max(textWidth, measureText(l, EDGE_LABEL_FONT_SIZE));
+    for (const l of descLines)
+      textWidth = Math.max(textWidth, measureText(l, EDGE_LABEL_FONT_SIZE));
+    if (textWidth === 0) continue;
+    const normAngle = (le.labelAngle % (2 * Math.PI) + 2 * Math.PI) % (2 * Math.PI);
+    const isRight = normAngle < Math.PI * 0.4 || normAngle > Math.PI * 1.6;
+    const isLeft = normAngle > Math.PI * 0.6 && normAngle < Math.PI * 1.4;
+    let labelLeft, labelRight;
+    if (isRight) {
+      labelLeft = le.labelX;
+      labelRight = le.labelX + textWidth;
+    } else if (isLeft) {
+      labelLeft = le.labelX - textWidth;
+      labelRight = le.labelX;
+    } else {
+      labelLeft = le.labelX - textWidth / 2;
+      labelRight = le.labelX + textWidth / 2;
+    }
+    contentMinX = Math.min(contentMinX, labelLeft);
+    contentMaxX = Math.max(contentMaxX, labelRight);
+    const lineCount = labelLines.length + descLines.length;
+    contentMinY = Math.min(contentMinY, le.labelY - 12);
+    contentMaxY = Math.max(contentMaxY, le.labelY + (lineCount - 1) * 15);
+  }
+  const overflowX = Math.max(0, PADDING - contentMinX) + Math.max(0, contentMaxX - (width - PADDING));
+  const overflowY = Math.max(0, PADDING - contentMinY) + Math.max(0, contentMaxY - (height - PADDING));
+  if (overflowX <= 0 && overflowY <= 0) return null;
+  const contentW = contentMaxX - contentMinX;
+  const contentH = contentMaxY - contentMinY;
+  const availW = width - 2 * PADDING;
+  const availH = height - 2 * PADDING;
+  const shrink = Math.min(availW / contentW, availH / contentH);
+  const newRadius = Math.max(80, radius * shrink);
+  return { radius: newRadius };
+}
+function buildEdgeArc(src, tgt, cx, cy, radius, isClockwise, arrowLength = 0) {
+  const dir = isClockwise ? 1 : -1;
+  const startAngle = src.angle;
+  const srcExitAngle = src.isCircle ? circleNodeExitAngle(src.width / 2, radius, src.angle, dir) : circleRectExitAngle(
+    src.x,
+    src.y,
+    src.width / 2,
+    src.height / 2,
+    cx,
+    cy,
+    radius,
+    src.angle,
+    dir
+  );
+  const nodeEndAngle = tgt.isCircle ? circleNodeExitAngle(tgt.width / 2, radius, tgt.angle, -dir) : circleRectExitAngle(
+    tgt.x,
+    tgt.y,
+    tgt.width / 2,
+    tgt.height / 2,
+    cx,
+    cy,
+    radius,
+    tgt.angle,
+    -dir
+  );
+  const arrowPullback = arrowLength > 0 ? arrowLength / radius : 0;
+  const endAngle = nodeEndAngle - dir * arrowPullback;
+  const startX = cx + radius * Math.cos(startAngle);
+  const startY = cy + radius * Math.sin(startAngle);
+  const endX = cx + radius * Math.cos(endAngle);
+  const endY = cy + radius * Math.sin(endAngle);
+  let effectiveSweep = (endAngle - startAngle) * dir;
+  if (effectiveSweep <= 0) effectiveSweep += 2 * Math.PI;
+  const largeArc = effectiveSweep > Math.PI ? 1 : 0;
+  const sweepFlag = isClockwise ? 1 : 0;
+  const path = `M ${startX} ${startY} A ${radius} ${radius} 0 ${largeArc} ${sweepFlag} ${endX} ${endY}`;
+  let visibleSweep = (nodeEndAngle - srcExitAngle) * dir;
+  if (visibleSweep <= 0) visibleSweep += 2 * Math.PI;
+  const midAngle = srcExitAngle + dir * visibleSweep / 2;
+  return { path, midAngle };
+}
+
+// src/cycle/renderer.ts
+var NODE_FONT_SIZE = 13;
+var DESC_FONT_SIZE2 = 11;
+var EDGE_LABEL_FONT_SIZE2 = 11;
+var DESC_LINE_HEIGHT2 = 15;
+var TITLE_AREA_HEIGHT = 50;
+function renderCycle(container, parsed, palette, isDark, onClickItem, exportDims, viewState, renderOptions) {
+  if (parsed.nodes.length === 0) return;
+  const solid = parsed.options?.["solid-fill"] === "on";
+  d3Selection.select(container).selectAll(":not([data-d3-tooltip])").remove();
+  const width = exportDims?.width ?? container.clientWidth;
+  const height = exportDims?.height ?? container.clientHeight;
+  if (width <= 0 || height <= 0) return;
+  const idealWidth = width;
+  const sctx = exportDims ? ScaleContext.identity() : ScaleContext.from(width, idealWidth);
+  const sTitleFontSize = sctx.text(TITLE_FONT_SIZE);
+  const sTitleY = sctx.structural(TITLE_Y);
+  const sTitleAreaHeight = sctx.structural(TITLE_AREA_HEIGHT);
+  const sLegendHeight = sctx.structural(LEGEND_HEIGHT);
+  const hideDescriptions = (renderOptions?.hideDescriptions ?? false) || parsed.options["no-descriptions"] === "true" || viewState?.hd === true;
+  const showDescriptions = !hideDescriptions;
+  const hasDescriptions = parsed.nodes.some((n) => n.description.length > 0) || parsed.edges.some((e) => e.description.length > 0);
+  const appHostedControls = renderOptions?.controlsHost === "app";
+  const hasLegend = !appHostedControls && hasDescriptions && !!renderOptions?.onToggleDescriptions;
+  const showTitle = !!parsed.title && parsed.options["no-title"] !== "on";
+  const legendOffset = hasLegend ? sLegendHeight : 0;
+  const layoutHeight = height - (showTitle ? sTitleAreaHeight : 0) - legendOffset;
+  const layout = computeCycleLayout(parsed, {
+    width,
+    height: layoutHeight,
+    hideDescriptions
+  });
+  const svg = d3Selection.select(container).append("svg").attr("width", width).attr("height", height).attr("viewBox", `0 0 ${width} ${height}`).attr("preserveAspectRatio", "xMidYMid meet").attr("xmlns", "http://www.w3.org/2000/svg").style("font-family", FONT_FAMILY);
+  if (sctx.isBelowFloor) {
+    svg.attr("width", "100%");
+  }
+  svg.append("rect").attr("width", width).attr("height", height).attr("fill", palette.bg);
+  if (showTitle) {
+    const titleText = svg.append("text").attr("x", width / 2).attr("y", sTitleY).attr("text-anchor", "middle").attr("fill", palette.text).attr("font-family", FONT_FAMILY).attr("font-size", sTitleFontSize).attr("font-weight", TITLE_FONT_WEIGHT).attr("data-line-number", parsed.titleLineNumber).text(parsed.title).style("cursor", onClickItem ? "pointer" : "default");
+    if (onClickItem) {
+      titleText.on("click", () => onClickItem(parsed.titleLineNumber));
+    }
+  }
+  if (hasLegend) {
+    const controlsGroup = {
+      toggles: [
+        {
+          id: "descriptions",
+          type: "toggle",
+          label: "Descriptions",
+          active: !hideDescriptions,
+          onToggle: () => {
+          }
+        }
+      ]
+    };
+    const legendCallbacks = {
+      ...renderOptions?.onToggleControlsExpand !== void 0 && {
+        onControlsExpand: renderOptions.onToggleControlsExpand
+      },
+      onControlsToggle: (toggleId, active) => {
+        if (toggleId === "descriptions" && renderOptions?.onToggleDescriptions) {
+          renderOptions.onToggleDescriptions(active);
+        }
+      }
+    };
+    const titleOffsetForLegend = showTitle ? sTitleAreaHeight : 0;
+    const legendG = svg.append("g").attr("transform", `translate(0, ${titleOffsetForLegend + 4})`);
+    renderIntegratedLegend(legendG, {
+      groups: [],
+      activeGroup: null,
+      mode: renderOptions?.exportMode ? "export" : "preview",
+      controlsGroup,
+      ...renderOptions?.controlsHost !== void 0 && {
+        controlsHost: renderOptions.controlsHost
+      },
+      ...renderOptions?.controlsExpanded !== void 0 && {
+        controlsExpanded: renderOptions.controlsExpanded
+      },
+      callbacks: legendCallbacks,
+      palette,
+      isDark,
+      width
+    });
+  }
+  const diagramTop = (showTitle ? sTitleAreaHeight : 0) + legendOffset;
+  const g = svg.append("g").attr("transform", `translate(0, ${diagramTop})`);
+  const defs = svg.append("defs");
+  const defaultNodeColor = palette.primary;
+  const markerKeys = /* @__PURE__ */ new Set();
+  for (const edge of parsed.edges) {
+    const color = resolveEdgeColor(edge, parsed, palette, defaultNodeColor);
+    const sw = Math.max(edge.width ?? DEFAULT_EDGE_WIDTH, MIN_EDGE_WIDTH);
+    const key = `${color}|${sw}`;
+    if (!markerKeys.has(key)) {
+      markerKeys.add(key);
+      ensureArrowMarker(defs, color, sw);
+    }
+  }
+  const edgeLabelInfo = [];
+  for (let i = 0; i < layout.edges.length; i++) {
+    const le = layout.edges[i];
+    const edge = parsed.edges[i];
+    const color = resolveEdgeColor(edge, parsed, palette, defaultNodeColor);
+    const strokeWidth = Math.max(
+      edge.width ?? DEFAULT_EDGE_WIDTH,
+      MIN_EDGE_WIDTH
+    );
+    const markerId = arrowMarkerId(color, strokeWidth);
+    const edgeG = g.append("g").attr("class", "cycle-edge");
+    if (edge.lineNumber) {
+      edgeG.attr("data-line-number", edge.lineNumber);
+    }
+    edgeG.attr("data-from", String(edge.sourceIndex)).attr("data-to", String(edge.targetIndex));
+    const pathEl = edgeG.append("path").attr("d", le.path).attr("fill", "none").attr("stroke", color).attr("stroke-width", strokeWidth).attr("marker-end", `url(#${markerId})`);
+    if (onClickItem && edge.lineNumber) {
+      const ln = edge.lineNumber;
+      pathEl.style("cursor", "pointer").on("click", () => onClickItem(ln));
+    }
+    edgeLabelInfo.push({ le, edge });
+  }
+  const HEADER_H = 36 * layout.scale;
+  const scaledNodeFont = Math.max(6, Math.round(NODE_FONT_SIZE * layout.scale));
+  const scaledEdgeLabelFont = Math.max(
+    6,
+    Math.round(EDGE_LABEL_FONT_SIZE2 * layout.scale)
+  );
+  const CIRCLE_LABEL_FONT_SIZE2 = 16;
+  const scaledCircleLabelFont = Math.max(
+    8,
+    Math.round(CIRCLE_LABEL_FONT_SIZE2 * layout.scale)
+  );
+  const scaledDescFont = Math.max(5, Math.round(DESC_FONT_SIZE2 * layout.scale));
+  const scaledDescLineH = Math.max(
+    7,
+    Math.round(DESC_LINE_HEIGHT2 * layout.scale)
+  );
+  const scaledEdgeLineH = Math.max(
+    8,
+    Math.round(DESC_LINE_HEIGHT2 * layout.scale)
+  );
+  for (let i = 0; i < layout.nodes.length; i++) {
+    const ln = layout.nodes[i];
+    const node = parsed.nodes[i];
+    const solidColor = resolveNodeColor(node.color, palette, defaultNodeColor);
+    const fillColor = shapeFill(palette, solidColor, isDark, { solid });
+    const textColor = contrastText(
+      fillColor,
+      palette.textOnFillLight,
+      palette.textOnFillDark
+    );
+    const descColor = textColor;
+    const nodeW = ln.width;
+    const nodeH = ln.height;
+    const wrappedDesc = ln.wrappedDesc;
+    const hasDesc = showDescriptions && wrappedDesc.length > 0;
+    const nodeG = g.append("g").attr("class", "cycle-node").attr("data-line-number", node.lineNumber).attr("data-node-index", String(i)).style("cursor", onClickItem ? "pointer" : "default");
+    if (onClickItem) {
+      const lineNum = node.lineNumber;
+      nodeG.on("click", () => onClickItem(lineNum));
+    }
+    if (ln.isCircle) {
+      const r = nodeW / 2;
+      nodeG.append("circle").attr("cx", ln.x).attr("cy", ln.y).attr("r", r).attr("fill", fillColor).attr("stroke", solidColor).attr("stroke-width", 2);
+      if (hasDesc) {
+        const labelFont = scaledCircleLabelFont;
+        const blockH = labelFont + 4 + wrappedDesc.length * scaledDescLineH;
+        const startY = ln.y - blockH / 2 + labelFont;
+        const labelText = nodeG.append("text").attr("x", ln.x).attr("y", startY).attr("text-anchor", "middle").attr("fill", textColor).attr("font-family", FONT_FAMILY).attr("font-size", labelFont).attr("font-weight", "600");
+        renderInlineText(labelText, node.label, palette, labelFont);
+        let descY = startY + scaledDescLineH + 4;
+        wrappedDesc.forEach((line) => {
+          const descText = nodeG.append("text").attr("x", ln.x).attr("y", descY).attr("text-anchor", "middle").attr("fill", descColor).attr("font-family", FONT_FAMILY).attr("font-size", scaledDescFont);
+          renderInlineText(descText, line.text, palette, DESC_FONT_SIZE2);
+          descY += scaledDescLineH;
+        });
+      } else {
+        const labelFont = scaledCircleLabelFont;
+        const labelText = nodeG.append("text").attr("x", ln.x).attr("y", ln.y + labelFont / 3).attr("text-anchor", "middle").attr("fill", textColor).attr("font-family", FONT_FAMILY).attr("font-size", labelFont).attr("font-weight", "600");
+        renderInlineText(labelText, node.label, palette, labelFont);
+      }
+    } else {
+      const rx = 6;
+      nodeG.append("rect").attr("x", ln.x - nodeW / 2).attr("y", ln.y - nodeH / 2).attr("width", nodeW).attr("height", nodeH).attr("rx", rx).attr("ry", rx).attr("fill", fillColor).attr("stroke", solidColor).attr("stroke-width", 2);
+      if (hasDesc) {
+        const headerCenterY = ln.y - nodeH / 2 + HEADER_H / 2;
+        const labelText = nodeG.append("text").attr("x", ln.x).attr("y", headerCenterY + scaledNodeFont / 3).attr("text-anchor", "middle").attr("fill", textColor).attr("font-family", FONT_FAMILY).attr("font-size", scaledNodeFont).attr("font-weight", "600");
+        renderInlineText(labelText, node.label, palette, scaledNodeFont);
+        const sepY = ln.y - nodeH / 2 + HEADER_H;
+        nodeG.append("line").attr("x1", ln.x - nodeW / 2).attr("y1", sepY).attr("x2", ln.x + nodeW / 2).attr("y2", sepY).attr("stroke", solid ? descColor : solidColor).attr("stroke-opacity", 0.3).attr("stroke-width", 1);
+        const descStartY = sepY + 4 + scaledDescFont;
+        const descPadX = Math.max(8, 12 * layout.scale);
+        const descX = ln.x - nodeW / 2 + descPadX;
+        const bulletBodyX = descX + Math.max(8, 12 * layout.scale);
+        wrappedDesc.forEach((line, li) => {
+          const lineY = descStartY + li * scaledDescLineH;
+          if (line.kind === "bullet-first") {
+            nodeG.append("text").attr("x", descX).attr("y", lineY).attr("text-anchor", "start").attr("fill", descColor).attr("font-family", FONT_FAMILY).attr("font-size", scaledDescFont).text("\u2022");
+            const bodyText = nodeG.append("text").attr("x", bulletBodyX).attr("y", lineY).attr("text-anchor", "start").attr("fill", descColor).attr("font-family", FONT_FAMILY).attr("font-size", scaledDescFont);
+            renderInlineText(bodyText, line.text, palette, DESC_FONT_SIZE2);
+          } else {
+            const x = line.kind === "bullet-cont" ? bulletBodyX : descX;
+            const descText = nodeG.append("text").attr("x", x).attr("y", lineY).attr("text-anchor", "start").attr("fill", descColor).attr("font-family", FONT_FAMILY).attr("font-size", scaledDescFont);
+            renderInlineText(descText, line.text, palette, DESC_FONT_SIZE2);
+          }
+        });
+      } else {
+        const labelText = nodeG.append("text").attr("x", ln.x).attr("y", ln.y + scaledNodeFont / 3).attr("text-anchor", "middle").attr("fill", textColor).attr("font-family", FONT_FAMILY).attr("font-size", scaledNodeFont).attr("font-weight", "600");
+        renderInlineText(labelText, node.label, palette, scaledNodeFont);
+      }
+    }
+  }
+  const labelLayer = g.append("g").attr("class", "cycle-edge-labels");
+  for (const { le, edge } of edgeLabelInfo) {
+    const hasEdgeLabel = !!le.label;
+    const hasEdgeDesc = showDescriptions && edge.description.length > 0;
+    const { labelLines, descLines } = wrapEdgeLabelText(
+      hasEdgeLabel ? le.label : void 0,
+      hasEdgeDesc ? edge.description : []
+    );
+    if (labelLines.length === 0 && descLines.length === 0) continue;
+    const edgeG = labelLayer.append("g").attr("class", "cycle-edge");
+    if (edge.lineNumber) {
+      edgeG.attr("data-line-number", edge.lineNumber);
+    }
+    const normAngle = (le.labelAngle % (2 * Math.PI) + 2 * Math.PI) % (2 * Math.PI);
+    const isRight = normAngle < Math.PI * 0.4 || normAngle > Math.PI * 1.6;
+    const isLeft = normAngle > Math.PI * 0.6 && normAngle < Math.PI * 1.4;
+    const anchor = isRight ? "start" : isLeft ? "end" : "middle";
+    const lineCount = labelLines.length + descLines.length;
+    let maxLineW = 0;
+    for (const l of labelLines)
+      maxLineW = Math.max(maxLineW, measureText(l, scaledEdgeLabelFont));
+    for (const l of descLines)
+      maxLineW = Math.max(maxLineW, measureText(l, scaledDescFont));
+    const bgW = maxLineW + 12;
+    const bgH = lineCount * scaledEdgeLineH + 6;
+    const bgX = isRight ? le.labelX - 4 : isLeft ? le.labelX - bgW + 4 : le.labelX - bgW / 2;
+    const bgY = le.labelY - scaledEdgeLabelFont - 2;
+    edgeG.append("rect").attr("x", bgX).attr("y", bgY).attr("width", bgW).attr("height", bgH).attr("rx", 3).attr("fill", palette.bg).attr("fill-opacity", 0.85);
+    let textY = le.labelY;
+    for (const line of labelLines) {
+      const labelText = edgeG.append("text").attr("x", le.labelX).attr("y", textY).attr("text-anchor", anchor).attr("fill", palette.text).attr("font-family", FONT_FAMILY).attr("font-size", scaledEdgeLabelFont).attr("font-weight", "600");
+      renderInlineText(labelText, line, palette, scaledEdgeLabelFont);
+      textY += scaledEdgeLineH;
+    }
+    for (const line of descLines) {
+      const descText = edgeG.append("text").attr("x", le.labelX).attr("y", textY).attr("text-anchor", anchor).attr("fill", palette.textMuted).attr("font-family", FONT_FAMILY).attr("font-size", scaledDescFont);
+      renderInlineText(descText, line, palette, scaledDescFont);
+      textY += scaledEdgeLineH;
+    }
+  }
+}
+function renderCycleForExport(container, parsed, palette, isDark, exportDims, viewState, exportMode) {
+  renderCycle(
+    container,
+    parsed,
+    palette,
+    isDark,
+    void 0,
+    exportDims,
+    viewState,
+    { ...exportMode !== void 0 && { exportMode } }
+  );
+}
+function resolveNodeColor(color, palette, defaultColor) {
+  if (!color) return defaultColor;
+  return resolveColor(color, palette) ?? defaultColor;
+}
+function resolveEdgeColor(edge, parsed, palette, defaultNodeColor) {
+  if (edge.color) {
+    return resolveColor(edge.color, palette) ?? defaultNodeColor;
+  }
+  const sourceNode = parsed.nodes[edge.sourceIndex];
+  if (sourceNode?.color) {
+    return resolveColor(sourceNode.color, palette) ?? defaultNodeColor;
+  }
+  return defaultNodeColor;
+}
+function arrowMarkerId(color, strokeWidth) {
+  return `cycle-arrow-${color.replace("#", "")}-w${strokeWidth}`;
+}
+function ensureArrowMarker(defs, color, strokeWidth) {
+  const id = arrowMarkerId(color, strokeWidth);
+  const mw = arrowHeadLength(strokeWidth) / strokeWidth;
+  const mh = Math.max(1.5, mw * 0.5);
+  defs.append("marker").attr("id", id).attr("viewBox", `0 0 ${mw} ${mh}`).attr("refX", mw * 0.1).attr("refY", mh / 2).attr("markerWidth", mw).attr("markerHeight", mh).attr("orient", "auto").append("polygon").attr("points", `0,0 ${mw},${mh / 2} 0,${mh}`).attr("fill", color);
+}
+
+export {
+  computeCycleLayout,
+  renderCycle,
+  renderCycleForExport
+};
+//# sourceMappingURL=chunk-3R5POCTZ.js.map