@tldraw/mermaid 4.6.0-internal.c7df3c92455a

package/dist-cjs/sequenceDiagram.js

@@ -0,0 +1,686 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var sequenceDiagram_exports = {};
+__export(sequenceDiagram_exports, {
+  countSequenceEvents: () => countSequenceEvents,
+  parseSequenceLayout: () => parseSequenceLayout,
+  sequenceToBlueprint: () => sequenceToBlueprint
+});
+module.exports = __toCommonJS(sequenceDiagram_exports);
+var import_colors = require("./colors");
+var import_svgParsing = require("./svgParsing");
+const LINETYPE = {
+  SOLID: 0,
+  DOTTED: 1,
+  NOTE: 2,
+  SOLID_CROSS: 3,
+  DOTTED_CROSS: 4,
+  SOLID_OPEN: 5,
+  DOTTED_OPEN: 6,
+  LOOP_START: 10,
+  LOOP_END: 11,
+  ALT_START: 12,
+  ALT_ELSE: 13,
+  ALT_END: 14,
+  OPT_START: 15,
+  OPT_END: 16,
+  ACTIVE_START: 17,
+  ACTIVE_END: 18,
+  PAR_START: 19,
+  PAR_AND: 20,
+  PAR_END: 21,
+  RECT_START: 22,
+  RECT_END: 23,
+  SOLID_POINT: 24,
+  DOTTED_POINT: 25,
+  AUTONUMBER: 26,
+  CRITICAL_START: 27,
+  CRITICAL_OPTION: 28,
+  CRITICAL_END: 29,
+  BREAK_START: 30,
+  BREAK_END: 31,
+  PAR_OVER_START: 32,
+  BIDIRECTIONAL_SOLID: 33,
+  BIDIRECTIONAL_DOTTED: 34
+};
+const PLACEMENT = {
+  LEFTOF: 0,
+  RIGHTOF: 1,
+  OVER: 2
+};
+const signalTypes = [
+  LINETYPE.SOLID,
+  LINETYPE.DOTTED,
+  LINETYPE.SOLID_CROSS,
+  LINETYPE.DOTTED_CROSS,
+  LINETYPE.SOLID_OPEN,
+  LINETYPE.DOTTED_OPEN,
+  LINETYPE.SOLID_POINT,
+  LINETYPE.DOTTED_POINT,
+  LINETYPE.BIDIRECTIONAL_SOLID,
+  LINETYPE.BIDIRECTIONAL_DOTTED
+];
+function isSignalMessage(type) {
+  if (type === void 0) return false;
+  return signalTypes.includes(type);
+}
+function isNoteMessage(type) {
+  return type === LINETYPE.NOTE;
+}
+function isActiveStart(type) {
+  return type === LINETYPE.ACTIVE_START;
+}
+function isActiveEnd(type) {
+  return type === LINETYPE.ACTIVE_END;
+}
+function isAutonumber(type) {
+  return type === LINETYPE.AUTONUMBER;
+}
+function getFragmentStartKeyword(type) {
+  if (type === void 0) return null;
+  if (type === LINETYPE.LOOP_START) return "loop";
+  if (type === LINETYPE.ALT_START) return "alt";
+  if (type === LINETYPE.OPT_START) return "opt";
+  if (type === LINETYPE.PAR_START) return "par";
+  if (type === LINETYPE.RECT_START) return "rect";
+  if (type === LINETYPE.CRITICAL_START) return "critical";
+  if (type === LINETYPE.BREAK_START) return "break";
+  if (type === LINETYPE.PAR_OVER_START) return "par";
+  return null;
+}
+function isFragmentEnd(type) {
+  if (type === void 0) return false;
+  const endTypes = [
+    LINETYPE.LOOP_END,
+    LINETYPE.ALT_END,
+    LINETYPE.OPT_END,
+    LINETYPE.PAR_END,
+    LINETYPE.RECT_END,
+    LINETYPE.CRITICAL_END,
+    LINETYPE.BREAK_END
+  ];
+  return endTypes.includes(type);
+}
+function getFragmentSeparatorKeyword(type) {
+  if (type === LINETYPE.ALT_ELSE) return "else";
+  if (type === LINETYPE.PAR_AND) return "and";
+  if (type === LINETYPE.CRITICAL_OPTION) return "option";
+  return null;
+}
+function mapParticipantTypeToGeo(type) {
+  switch (type) {
+    case "actor":
+      return "ellipse";
+    case "database":
+      return "oval";
+    default:
+      return "rectangle";
+  }
+}
+function mapLineTypeToArrowProps(type) {
+  switch (type) {
+    case LINETYPE.SOLID:
+      return { dash: "solid", arrowheadEnd: "arrow" };
+    case LINETYPE.DOTTED:
+      return { dash: "dotted", arrowheadEnd: "arrow" };
+    case LINETYPE.SOLID_CROSS:
+      return { dash: "solid", arrowheadEnd: "bar" };
+    case LINETYPE.DOTTED_CROSS:
+      return { dash: "dotted", arrowheadEnd: "bar" };
+    case LINETYPE.SOLID_OPEN:
+      return { dash: "solid", arrowheadEnd: "none" };
+    case LINETYPE.DOTTED_OPEN:
+      return { dash: "dotted", arrowheadEnd: "none" };
+    case LINETYPE.SOLID_POINT:
+      return { dash: "solid", arrowheadEnd: "arrow" };
+    case LINETYPE.DOTTED_POINT:
+      return { dash: "dotted", arrowheadEnd: "arrow" };
+    case LINETYPE.BIDIRECTIONAL_SOLID:
+      return { dash: "solid", arrowheadEnd: "arrow" };
+    case LINETYPE.BIDIRECTIONAL_DOTTED:
+      return { dash: "dotted", arrowheadEnd: "arrow" };
+    default:
+      return { dash: "solid", arrowheadEnd: "arrow" };
+  }
+}
+function isBidirectional(type) {
+  return type === LINETYPE.BIDIRECTIONAL_SOLID || type === LINETYPE.BIDIRECTIONAL_DOTTED;
+}
+const TARGET_ACTOR_SPACING = 300;
+const MIN_VERTICAL_GAP = 400;
+const FALLBACK_ACTOR_WIDTH = 200;
+const FALLBACK_ACTOR_HEIGHT = 70;
+const FALLBACK_ACTOR_SPACING = 100;
+const FALLBACK_EVENT_SPACING = 80;
+const FALLBACK_NOTE_WIDTH = 120;
+const FALLBACK_NOTE_HEIGHT = 50;
+const NOTE_PADDING = 5;
+const NOTE_CHAR_WIDTH = 11;
+const NOTE_TEXT_PADDING = 40;
+const FRAGMENT_PADDING_X = 30;
+const FRAGMENT_PADDING_TOP = 50;
+const FRAGMENT_PADDING_BOTTOM = 25;
+const ACTOR_PADDING_WIDTH = 30;
+const ACTOR_PADDING_HEIGHT = 10;
+const SELF_MSG_Y_OFFSET = 0.04;
+const SELF_MSG_BEND = -80;
+const ACTIVATION_BOX_WIDTH = 20;
+const ACTIVATION_NEST_OFFSET = 6;
+const ACTIVATION_PAD_RATIO = 0.15;
+const FRAGMENT_SECTION_LABEL_HEIGHT = 25;
+const FRAGMENT_SECTION_LABEL_PADDING = 5;
+function parseSvgRects(root, selector) {
+  const results = [];
+  for (const rect of root.querySelectorAll(selector)) {
+    const ancestor = (0, import_svgParsing.getAccumulatedTranslate)(rect);
+    const x = parseFloat(rect.getAttribute("x") || "0");
+    const y = parseFloat(rect.getAttribute("y") || "0");
+    const w = parseFloat(rect.getAttribute("width") || "0");
+    const h = parseFloat(rect.getAttribute("height") || "0");
+    if (w > 0 && h > 0) {
+      results.push({
+        x: Number.isFinite(ancestor.x + x) ? ancestor.x + x : 0,
+        y: Number.isFinite(ancestor.y + y) ? ancestor.y + y : 0,
+        w,
+        h
+      });
+    }
+  }
+  return results;
+}
+function parseActorManRects(root) {
+  const results = [];
+  for (const group of root.querySelectorAll("g.actor-man")) {
+    const ancestor = (0, import_svgParsing.getAccumulatedTranslate)(group);
+    let minX = Infinity;
+    let minY = Infinity;
+    let maxX = -Infinity;
+    let maxY = -Infinity;
+    for (const line of group.querySelectorAll("line")) {
+      for (const attr of ["x1", "x2"]) {
+        const coord = parseFloat(line.getAttribute(attr) || "0");
+        if (coord < minX) minX = coord;
+        if (coord > maxX) maxX = coord;
+      }
+      for (const attr of ["y1", "y2"]) {
+        const coord = parseFloat(line.getAttribute(attr) || "0");
+        if (coord < minY) minY = coord;
+        if (coord > maxY) maxY = coord;
+      }
+    }
+    if (Number.isFinite(minX) && Number.isFinite(minY)) {
+      results.push({
+        x: ancestor.x + minX,
+        y: ancestor.y + minY,
+        w: maxX - minX || FALLBACK_ACTOR_WIDTH,
+        h: maxY - minY || FALLBACK_ACTOR_HEIGHT
+      });
+    }
+  }
+  return results;
+}
+function computeActorLayouts(root, actorCount, eventCount) {
+  const byX = (a, b) => a.x - b.x;
+  let top = parseSvgRects(root, "rect.actor-top").sort(byX);
+  let bottom = parseSvgRects(root, "rect.actor-bottom").sort(byX);
+  const actorManRects = parseActorManRects(root).sort(byX);
+  if (actorManRects.length > 0 && (top.length < actorCount || bottom.length < actorCount)) {
+    const midY = top.length > 0 && bottom.length > 0 ? (Math.max(...top.map((r) => r.y + r.h)) + Math.min(...bottom.map((r) => r.y))) / 2 : actorManRects.length >= 2 ? (actorManRects[0].y + actorManRects[actorManRects.length - 1].y) / 2 : 0;
+    for (const rect of actorManRects) {
+      if (rect.y < midY) top.push(rect);
+      else bottom.push(rect);
+    }
+    top.sort(byX);
+    bottom.sort(byX);
+  }
+  if (top.length < actorCount || bottom.length < actorCount) {
+    const all = parseSvgRects(root, 'rect[class*="actor"]').sort((a, b) => a.y - b.y);
+    if (all.length >= 2 * actorCount) {
+      let maxGap = 0;
+      let splitAt = actorCount;
+      for (let i = 1; i < all.length; i++) {
+        const gap = all[i].y - all[i - 1].y;
+        if (gap > maxGap) {
+          maxGap = gap;
+          splitAt = i;
+        }
+      }
+      top = all.slice(0, splitAt).sort(byX).slice(0, actorCount);
+      bottom = all.slice(splitAt).sort(byX).slice(0, actorCount);
+    } else {
+      top = [];
+      bottom = [];
+    }
+  } else {
+    top = top.slice(0, actorCount);
+    bottom = bottom.slice(0, actorCount);
+  }
+  if (actorManRects.length > 0) {
+    const actorManSet = new Set(actorManRects);
+    const regularTops = top.filter((r) => !actorManSet.has(r));
+    const regularBottoms = bottom.filter((r) => !actorManSet.has(r));
+    const refHeight = regularTops.length > 0 ? Math.max(...regularTops.map((r) => r.h)) : FALLBACK_ACTOR_HEIGHT;
+    const refWidth = regularTops.length > 0 ? Math.max(...regularTops.map((r) => r.w)) : FALLBACK_ACTOR_WIDTH;
+    const refTopY = regularTops.length > 0 ? Math.min(...regularTops.map((r) => r.y)) : void 0;
+    const refBottomEndY = regularBottoms.length > 0 ? Math.max(...regularBottoms.map((r) => r.y + r.h)) : void 0;
+    for (const rect of top) {
+      if (!actorManSet.has(rect)) continue;
+      const centerY = rect.y + rect.h / 2;
+      rect.h = refHeight;
+      rect.w = Math.max(rect.w, refWidth);
+      rect.y = refTopY !== void 0 ? refTopY : centerY - refHeight / 2;
+    }
+    for (const rect of bottom) {
+      if (!actorManSet.has(rect)) continue;
+      const centerY = rect.y + rect.h / 2;
+      rect.h = refHeight;
+      rect.w = Math.max(rect.w, refWidth);
+      rect.y = refBottomEndY !== void 0 ? refBottomEndY - refHeight : centerY - refHeight / 2;
+    }
+  }
+  if (top.length >= actorCount && bottom.length >= actorCount) {
+    const svgCenters = top.map((r) => r.x + r.w / 2);
+    const spacings = [];
+    for (let i = 1; i < svgCenters.length; i++) {
+      spacings.push(svgCenters[i] - svgCenters[i - 1]);
+    }
+    const minSpacing = spacings.length > 0 ? Math.min(...spacings) : 1;
+    const scale = Math.max(1, TARGET_ACTOR_SPACING / minSpacing);
+    const xCenters = svgCenters.map((c) => (c - svgCenters[0]) * scale);
+    const totalSpan = xCenters.length > 1 ? xCenters[xCenters.length - 1] : 0;
+    const topRowBottom = Math.max(...top.map((r) => r.y + r.h));
+    const bottomRowTop = Math.min(...bottom.map((r) => r.y));
+    const yStretch = Math.max(0, MIN_VERTICAL_GAP - (bottomRowTop - topRowBottom));
+    const topMinY = Math.min(...top.map((r) => r.y));
+    const bottomMaxY = Math.max(...bottom.map((r) => r.y + r.h));
+    const originY = -(bottomMaxY + yStretch + topMinY) / 2;
+    return top.map((topRect, i) => {
+      const w = topRect.w + ACTOR_PADDING_WIDTH;
+      const h = topRect.h + ACTOR_PADDING_HEIGHT;
+      return {
+        x: xCenters[i] - totalSpan / 2 - w / 2,
+        y: originY + topRect.y,
+        w,
+        h,
+        bottomY: originY + bottom[i].y + yStretch
+      };
+    });
+  }
+  const fallbackLifelineHeight = Math.max(300, eventCount * FALLBACK_EVENT_SPACING);
+  const totalWidth = actorCount * FALLBACK_ACTOR_WIDTH + (actorCount - 1) * FALLBACK_ACTOR_SPACING;
+  const totalHeight = FALLBACK_ACTOR_HEIGHT * 2 + fallbackLifelineHeight;
+  const startX = -totalWidth / 2;
+  const startY = -totalHeight / 2;
+  return Array.from({ length: actorCount }, (_, i) => ({
+    x: startX + i * (FALLBACK_ACTOR_WIDTH + FALLBACK_ACTOR_SPACING),
+    y: startY,
+    w: FALLBACK_ACTOR_WIDTH,
+    h: FALLBACK_ACTOR_HEIGHT,
+    bottomY: startY + totalHeight - FALLBACK_ACTOR_HEIGHT
+  }));
+}
+function getMessageLabel(msg) {
+  return typeof msg.message === "string" ? msg.message : void 0;
+}
+function countSequenceEvents(messages) {
+  let count = 0;
+  for (const msg of messages) {
+    if (isAutonumber(msg.type)) continue;
+    if (getFragmentStartKeyword(msg.type)) continue;
+    if (isFragmentEnd(msg.type)) continue;
+    if (getFragmentSeparatorKeyword(msg.type)) continue;
+    if (isActiveStart(msg.type) || isActiveEnd(msg.type)) continue;
+    const isEvent = isSignalMessage(msg.type) && msg.from && msg.to || isNoteMessage(msg.type) && msg.from;
+    if (isEvent) count++;
+  }
+  return count;
+}
+function parseSequenceLayout(root, actorCount, eventCount) {
+  return {
+    actorLayouts: computeActorLayouts(root, actorCount, eventCount),
+    noteRects: parseSvgRects(root, "rect.note")
+  };
+}
+function sequenceToBlueprint(layout, actors, actorKeys, messages, createdActors = /* @__PURE__ */ new Map(), destroyedActors = /* @__PURE__ */ new Map()) {
+  const actorCount = actorKeys.length;
+  const keyIndex = new Map(actorKeys.map((key, i) => [key, i]));
+  const fragments = [];
+  const fragmentStack = [];
+  const events = [];
+  const activationStack = /* @__PURE__ */ new Map();
+  const activationSpans = [];
+  let autonumberStart = 0;
+  let autonumberStep = 0;
+  let autonumberVisible = false;
+  for (const msg of messages) {
+    if (isAutonumber(msg.type)) {
+      autonumberStart = 1;
+      autonumberStep = 1;
+      autonumberVisible = true;
+      continue;
+    }
+    const keyword = getFragmentStartKeyword(msg.type);
+    if (keyword) {
+      fragmentStack.push({
+        keyword,
+        sections: [{ title: getMessageLabel(msg) ?? "", firstEventIndex: events.length }],
+        firstEventIndex: events.length,
+        actorKeys: /* @__PURE__ */ new Set()
+      });
+      continue;
+    }
+    if (isFragmentEnd(msg.type)) {
+      const frag = fragmentStack.pop();
+      if (frag) fragments.push({ ...frag, lastEventIndex: events.length - 1 });
+      continue;
+    }
+    if (getFragmentSeparatorKeyword(msg.type)) {
+      const current = fragmentStack[fragmentStack.length - 1];
+      if (current) {
+        current.sections.push({
+          title: getMessageLabel(msg) ?? "",
+          firstEventIndex: events.length
+        });
+      }
+      continue;
+    }
+    if (isActiveStart(msg.type)) {
+      const key = msg.from ?? msg.to;
+      if (key) {
+        if (!activationStack.has(key)) activationStack.set(key, []);
+        activationStack.get(key).push(Math.max(0, events.length - 1));
+      }
+      continue;
+    }
+    if (isActiveEnd(msg.type)) {
+      const key = msg.from ?? msg.to;
+      if (key) {
+        const startIdx = activationStack.get(key)?.pop();
+        if (startIdx !== void 0) {
+          activationSpans.push({
+            participantKey: key,
+            startEventIndex: startIdx,
+            endEventIndex: Math.max(events.length - 1, startIdx)
+          });
+        }
+      }
+      continue;
+    }
+    const isEvent = isSignalMessage(msg.type) && msg.from && msg.to || isNoteMessage(msg.type) && msg.from;
+    if (!isEvent) continue;
+    for (const frag of fragmentStack) {
+      if (msg.from) frag.actorKeys.add(msg.from);
+      if (msg.to) frag.actorKeys.add(msg.to);
+    }
+    events.push(msg);
+  }
+  const layouts = layout.actorLayouts;
+  const creationEventIndex = /* @__PURE__ */ new Map();
+  const destructionEventIndex = /* @__PURE__ */ new Map();
+  for (let i = 0; i < events.length; i++) {
+    const ev = events[i];
+    if (!isSignalMessage(ev.type)) continue;
+    if (ev.to && createdActors.has(ev.to) && !creationEventIndex.has(ev.to)) {
+      creationEventIndex.set(ev.to, i);
+    }
+    if (ev.from && destroyedActors.has(ev.from) && !destructionEventIndex.has(ev.from)) {
+      destructionEventIndex.set(ev.from, i);
+    }
+  }
+  const svgNoteRects = layout.noteRects;
+  let svgNoteIndex = 0;
+  const nodes = [];
+  const lines = [];
+  const edges = [];
+  const { y: firstY, h: firstH, bottomY: firstBottomY } = layouts[0];
+  const lifelineTop = firstY + firstH;
+  const eventStep = (firstBottomY - lifelineTop) / (events.length + 1);
+  for (let i = 0; i < actorCount; i++) {
+    const key = actorKeys[i];
+    const { x, y, w, h, bottomY } = layouts[i];
+    const isCreated = creationEventIndex.has(key);
+    const isDestroyed = destructionEventIndex.has(key);
+    const eventY = isCreated ? lifelineTop + eventStep * (creationEventIndex.get(key) + 1) : 0;
+    const topY = isCreated ? eventY + h / 2 : y + h;
+    const botY = isDestroyed ? lifelineTop + eventStep * (destructionEventIndex.get(key) + 1) : bottomY;
+    const lifelineHeight = botY - topY;
+    if (lifelineHeight > 0) {
+      lines.push({ id: `lifeline-${key}`, x: x + w / 2, y: topY, endY: lifelineHeight });
+    }
+  }
+  const activationPad = eventStep * ACTIVATION_PAD_RATIO;
+  const sortedSpans = activationSpans.map((span, origIdx) => ({ ...span, origIdx })).sort((a, b) => {
+    const sizeA = a.endEventIndex - a.startEventIndex;
+    const sizeB = b.endEventIndex - b.startEventIndex;
+    return sizeB - sizeA || a.origIdx - b.origIdx;
+  });
+  for (let i = 0; i < sortedSpans.length; i++) {
+    const span = sortedSpans[i];
+    const actorIdx = keyIndex.get(span.participantKey);
+    if (actorIdx === void 0) continue;
+    const spanSize = span.endEventIndex - span.startEventIndex;
+    let depth = 0;
+    for (const other of sortedSpans) {
+      if (other === span) continue;
+      const sameParticipant = other.participantKey === span.participantKey;
+      const containsSpan = other.startEventIndex <= span.startEventIndex && other.endEventIndex >= span.endEventIndex;
+      const strictlyLarger = other.endEventIndex - other.startEventIndex > spanSize;
+      if (sameParticipant && containsSpan && strictlyLarger) depth++;
+    }
+    const layout2 = layouts[actorIdx];
+    const lifelineCenterX = layout2.x + layout2.w / 2;
+    const boxTop = lifelineTop + eventStep * (span.startEventIndex + 1) - activationPad;
+    const boxBottom = lifelineTop + eventStep * (span.endEventIndex + 1) + activationPad;
+    nodes.push({
+      id: `activation-${span.origIdx}`,
+      x: lifelineCenterX - ACTIVATION_BOX_WIDTH / 2 + depth * ACTIVATION_NEST_OFFSET,
+      y: boxTop,
+      w: ACTIVATION_BOX_WIDTH,
+      h: boxBottom - boxTop,
+      geo: "rectangle",
+      fill: "solid",
+      color: "light-violet",
+      size: "s"
+    });
+  }
+  for (let fragmentIndex = 0; fragmentIndex < fragments.length; fragmentIndex++) {
+    const fragment = fragments[fragmentIndex];
+    if (fragment.lastEventIndex < fragment.firstEventIndex) continue;
+    const fragTop = lifelineTop + eventStep * (fragment.firstEventIndex + 1) - FRAGMENT_PADDING_TOP;
+    const fragBottom = lifelineTop + eventStep * (fragment.lastEventIndex + 1) + FRAGMENT_PADDING_BOTTOM;
+    const indices = [...fragment.actorKeys].map((k) => keyIndex.get(k)).filter((idx) => idx >= 0);
+    if (indices.length === 0) continue;
+    const minIndex = Math.min(...indices);
+    const maxIndex = Math.max(...indices);
+    const leftX = layouts[minIndex].x - FRAGMENT_PADDING_X;
+    const fragW = layouts[maxIndex].x + layouts[maxIndex].w + FRAGMENT_PADDING_X - leftX;
+    const fragH = fragBottom - fragTop;
+    const rgbColor = fragment.keyword === "rect" ? (0, import_colors.parseRgbToTldrawColor)(fragment.sections[0].title) : null;
+    if (rgbColor) {
+      nodes.push({
+        id: `fragment-${fragmentIndex}`,
+        x: leftX,
+        y: fragTop,
+        w: fragW,
+        h: fragH,
+        geo: "rectangle",
+        fill: rgbColor.hasAlpha ? "semi" : "solid",
+        color: rgbColor.color,
+        size: "s"
+      });
+    } else {
+      nodes.push({
+        id: `fragment-${fragmentIndex}`,
+        x: leftX,
+        y: fragTop,
+        w: fragW,
+        h: fragH,
+        geo: "rectangle",
+        dash: "dashed",
+        fill: "none",
+        color: "light-blue",
+        size: "s",
+        align: "start",
+        verticalAlign: "start",
+        label: `${fragment.keyword} [${fragment.sections[0].title}]`
+      });
+      for (let s = 1; s < fragment.sections.length; s++) {
+        const section = fragment.sections[s];
+        const sepY = lifelineTop + eventStep * (section.firstEventIndex + 0.5);
+        lines.push({
+          id: `fragment-${fragmentIndex}-sep-${s}`,
+          x: leftX,
+          y: sepY,
+          endX: fragW,
+          endY: 0,
+          dash: "dashed",
+          color: "light-blue",
+          size: "s"
+        });
+        nodes.push({
+          id: `fragment-${fragmentIndex}-section-${s}`,
+          x: leftX + FRAGMENT_SECTION_LABEL_PADDING,
+          y: sepY + FRAGMENT_SECTION_LABEL_PADDING,
+          w: fragW - FRAGMENT_SECTION_LABEL_PADDING * 2,
+          h: FRAGMENT_SECTION_LABEL_HEIGHT,
+          geo: "rectangle",
+          fill: "none",
+          dash: "dashed",
+          color: "light-blue",
+          size: "s",
+          align: "start",
+          verticalAlign: "start",
+          label: `[${section.title}]`
+        });
+      }
+    }
+  }
+  for (let i = 0; i < actorCount; i++) {
+    const key = actorKeys[i];
+    const actor = actors.get(key);
+    if (!actor) continue;
+    const { x, y, w, h, bottomY } = layouts[i];
+    const isCreated = creationEventIndex.has(key);
+    const isDestroyed = destructionEventIndex.has(key);
+    const shared = {
+      geo: mapParticipantTypeToGeo(actor.type),
+      label: actor.description || actor.name || key,
+      align: "middle",
+      verticalAlign: "middle",
+      size: "s"
+    };
+    const creationY = isCreated ? lifelineTop + eventStep * (creationEventIndex.get(key) + 1) : 0;
+    const topY = isCreated ? creationY - h / 2 : y;
+    nodes.push({ id: `actor-top-${key}`, x, y: topY, w, h, ...shared });
+    if (!isDestroyed) {
+      nodes.push({ id: `actor-bottom-${key}`, x, y: bottomY, w, h, ...shared });
+    }
+  }
+  const pendingCreations = new Set(createdActors.keys());
+  let sequenceNumber = autonumberStart;
+  for (let eventIndex = 0; eventIndex < events.length; eventIndex++) {
+    const msg = events[eventIndex];
+    const anchor = (eventIndex + 1) / (events.length + 1);
+    if (isSignalMessage(msg.type)) {
+      const fromKey = msg.from;
+      const toKey = msg.to;
+      if (!keyIndex.has(fromKey) || !keyIndex.has(toKey)) continue;
+      const isCreationMessage = pendingCreations.has(toKey);
+      if (isCreationMessage) pendingCreations.delete(toKey);
+      const msgType = msg.type ?? LINETYPE.SOLID;
+      const { dash, arrowheadEnd } = mapLineTypeToArrowProps(msgType);
+      const isSelf = fromKey === toKey;
+      const bidir = !isSelf && isBidirectional(msgType);
+      const edge = {
+        startNodeId: `lifeline-${fromKey}`,
+        endNodeId: isCreationMessage ? `actor-top-${toKey}` : `lifeline-${toKey}`,
+        label: getMessageLabel(msg),
+        bend: isSelf ? SELF_MSG_BEND : 0,
+        dash,
+        arrowheadEnd,
+        arrowheadStart: bidir ? "arrow" : "none",
+        size: "s",
+        anchorStartY: isSelf ? anchor - SELF_MSG_Y_OFFSET : anchor,
+        anchorEndY: isCreationMessage ? 0.5 : isSelf ? anchor + SELF_MSG_Y_OFFSET : anchor,
+        isExact: true,
+        isPrecise: true,
+        ...isCreationMessage && { isExactEnd: false, isPreciseEnd: false }
+      };
+      if (autonumberVisible) {
+        edge.decoration = { type: "autonumber", value: String(sequenceNumber) };
+        sequenceNumber += autonumberStep;
+      }
+      edges.push(edge);
+    } else if (isNoteMessage(msg.type)) {
+      const eventY = lifelineTop + eventStep * (eventIndex + 1);
+      const fromKey = msg.from;
+      const fromIdx = keyIndex.get(fromKey);
+      const toIdx = keyIndex.get(msg.to ?? fromKey);
+      if (fromIdx === void 0) continue;
+      const label = getMessageLabel(msg);
+      const msgPlacement = msg.placement;
+      const fromCenterX = layouts[fromIdx].x + layouts[fromIdx].w / 2;
+      const toCenterX = toIdx !== void 0 ? layouts[toIdx].x + layouts[toIdx].w / 2 : fromCenterX;
+      const isSpanning = msgPlacement === PLACEMENT.OVER && msg.from !== msg.to && toIdx !== void 0;
+      const svgNote = svgNoteRects[svgNoteIndex++];
+      const noteHeight = svgNote?.h ?? FALLBACK_NOTE_HEIGHT;
+      const textWidth = label ? label.length * NOTE_CHAR_WIDTH + NOTE_TEXT_PADDING : 0;
+      const baseWidth = Math.max(svgNote?.w ?? FALLBACK_NOTE_WIDTH, textWidth);
+      const noteWidth = isSpanning ? Math.max(baseWidth, Math.abs(toCenterX - fromCenterX) + NOTE_PADDING) : baseWidth;
+      let noteX;
+      if (msgPlacement === PLACEMENT.LEFTOF) {
+        noteX = fromCenterX - noteWidth - NOTE_PADDING;
+      } else if (msgPlacement === PLACEMENT.RIGHTOF) {
+        noteX = fromCenterX + NOTE_PADDING;
+      } else if (isSpanning) {
+        noteX = (fromCenterX + toCenterX) / 2 - noteWidth / 2;
+      } else {
+        noteX = fromCenterX - noteWidth / 2;
+      }
+      nodes.push({
+        id: `note-${eventIndex}`,
+        x: noteX,
+        y: eventY - noteHeight / 2,
+        w: noteWidth,
+        h: noteHeight,
+        geo: "rectangle",
+        fill: "solid",
+        color: "yellow",
+        dash: "draw",
+        size: "s",
+        align: "middle",
+        verticalAlign: "middle",
+        label
+      });
+    }
+  }
+  return {
+    nodes,
+    edges,
+    lines,
+    groups: actorKeys.map((key) => {
+      const group = [`actor-top-${key}`, `lifeline-${key}`];
+      if (!destructionEventIndex.has(key)) {
+        group.push(`actor-bottom-${key}`);
+      }
+      return group;
+    })
+  };
+}
+//# sourceMappingURL=sequenceDiagram.js.map