@diagrammo/dgmo 0.1.3 → 0.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/cli.cjs +17 -4
  2. package/dist/index.cjs +17 -4
  3. package/dist/index.cjs.map +1 -1
  4. package/dist/index.js +17 -4
  5. package/dist/index.js.map +1 -1
  6. package/package.json +1 -1
  7. package/src/sequence/renderer.ts +21 -4
package/dist/cli.cjs CHANGED
@@ -1627,6 +1627,16 @@ __export(renderer_exports, {
1627
1627
  groupMessagesBySection: () => groupMessagesBySection,
1628
1628
  renderSequenceDiagram: () => renderSequenceDiagram
1629
1629
  });
1630
+ function mix(a, b, pct) {
1631
+ const parse = (h) => {
1632
+ const r = h.replace("#", "");
1633
+ const f = r.length === 3 ? r[0] + r[0] + r[1] + r[1] + r[2] + r[2] : r;
1634
+ return [parseInt(f.substring(0, 2), 16), parseInt(f.substring(2, 4), 16), parseInt(f.substring(4, 6), 16)];
1635
+ };
1636
+ const [ar, ag, ab] = parse(a), [br, bg, bb] = parse(b), t = pct / 100;
1637
+ const c = (x, y) => Math.round(x * t + y * (1 - t)).toString(16).padStart(2, "0");
1638
+ return `#${c(ar, br)}${c(ag, bg)}${c(ab, bb)}`;
1639
+ }
1630
1640
  function renderRectParticipant(g, palette, isDark) {
1631
1641
  g.append("rect").attr("x", -W / 2).attr("y", 0).attr("width", W).attr("height", H).attr("rx", 2).attr("ry", 2).attr("fill", fill(palette, isDark)).attr("stroke", stroke(palette)).attr("stroke-width", SW);
1632
1642
  }
@@ -1916,7 +1926,10 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
1916
1926
  }
1917
1927
  }
1918
1928
  const allRenderSteps = buildRenderSequence(messages);
1919
- const renderSteps = hiddenMsgIndices.size > 0 ? allRenderSteps.filter((s) => !hiddenMsgIndices.has(s.messageIndex)) : allRenderSteps;
1929
+ let renderSteps = hiddenMsgIndices.size > 0 ? allRenderSteps.filter((s) => !hiddenMsgIndices.has(s.messageIndex)) : allRenderSteps;
1930
+ renderSteps = renderSteps.filter(
1931
+ (s) => s.type === "call" || s.label
1932
+ );
1920
1933
  const activations = activationsOff ? [] : computeActivations(renderSteps);
1921
1934
  const stepSpacing = 35;
1922
1935
  const BLOCK_HEADER_SPACE = 30;
@@ -2140,7 +2153,7 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
2140
2153
  const boxY = participantStartY - GROUP_PADDING_TOP;
2141
2154
  const boxH = PARTICIPANT_BOX_HEIGHT + GROUP_PADDING_TOP + GROUP_PADDING_BOTTOM;
2142
2155
  const resolvedGroupColor = group.color ? resolveColor(group.color, palette) : void 0;
2143
- const fillColor = resolvedGroupColor ? `color-mix(in srgb, ${resolvedGroupColor} 10%, ${isDark ? palette.surface : palette.bg})` : isDark ? palette.surface : palette.bg;
2156
+ const fillColor = resolvedGroupColor ? mix(resolvedGroupColor, isDark ? palette.surface : palette.bg, 10) : isDark ? palette.surface : palette.bg;
2144
2157
  const strokeColor = resolvedGroupColor || palette.textMuted;
2145
2158
  svg.append("rect").attr("x", minX).attr("y", boxY).attr("width", maxX - minX).attr("height", boxH).attr("rx", 6).attr("fill", fillColor).attr("stroke", strokeColor).attr("stroke-width", 1).attr("stroke-opacity", 0.5).attr("class", "group-box").attr("data-group-line", String(group.lineNumber));
2146
2159
  svg.append("text").attr("x", minX + 8).attr("y", boxY + GROUP_LABEL_SIZE + 4).attr("fill", strokeColor).attr("font-size", GROUP_LABEL_SIZE).attr("font-weight", "bold").attr("opacity", 0.7).attr("class", "group-label").attr("data-group-line", String(group.lineNumber)).text(group.name);
@@ -2263,7 +2276,7 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
2263
2276
  if (msg) coveredLines.push(msg.lineNumber);
2264
2277
  }
2265
2278
  svg.append("rect").attr("x", x).attr("y", y1).attr("width", ACTIVATION_WIDTH).attr("height", y2 - y1).attr("fill", isDark ? palette.surface : palette.bg);
2266
- const actFill = `color-mix(in srgb, ${palette.primary} ${isDark ? "15%" : "30%"}, ${isDark ? palette.surface : palette.bg})`;
2279
+ const actFill = mix(palette.primary, isDark ? palette.surface : palette.bg, isDark ? 15 : 30);
2267
2280
  svg.append("rect").attr("x", x).attr("y", y1).attr("width", ACTIVATION_WIDTH).attr("height", y2 - y1).attr("fill", actFill).attr("stroke", palette.primary).attr("stroke-width", 1).attr("stroke-opacity", 0.5).attr("data-participant-id", act.participantId).attr("data-msg-lines", coveredLines.join(",")).attr("class", "activation");
2268
2281
  });
2269
2282
  for (const ln of deferredLines) {
@@ -2447,7 +2460,7 @@ var init_renderer = __esm({
2447
2460
  MESSAGE_START_OFFSET = 30;
2448
2461
  LIFELINE_TAIL = 30;
2449
2462
  ARROWHEAD_SIZE = 8;
2450
- fill = (palette, isDark) => `color-mix(in srgb, ${palette.primary} ${isDark ? "15%" : "30%"}, ${isDark ? palette.surface : palette.bg})`;
2463
+ fill = (palette, isDark) => mix(palette.primary, isDark ? palette.surface : palette.bg, isDark ? 15 : 30);
2451
2464
  stroke = (palette) => palette.textMuted;
2452
2465
  SW = 1.5;
2453
2466
  W = PARTICIPANT_BOX_WIDTH;
package/dist/index.cjs CHANGED
@@ -1627,6 +1627,16 @@ __export(renderer_exports, {
1627
1627
  groupMessagesBySection: () => groupMessagesBySection,
1628
1628
  renderSequenceDiagram: () => renderSequenceDiagram
1629
1629
  });
1630
+ function mix(a, b, pct) {
1631
+ const parse = (h) => {
1632
+ const r = h.replace("#", "");
1633
+ const f = r.length === 3 ? r[0] + r[0] + r[1] + r[1] + r[2] + r[2] : r;
1634
+ return [parseInt(f.substring(0, 2), 16), parseInt(f.substring(2, 4), 16), parseInt(f.substring(4, 6), 16)];
1635
+ };
1636
+ const [ar, ag, ab] = parse(a), [br, bg, bb] = parse(b), t = pct / 100;
1637
+ const c = (x, y) => Math.round(x * t + y * (1 - t)).toString(16).padStart(2, "0");
1638
+ return `#${c(ar, br)}${c(ag, bg)}${c(ab, bb)}`;
1639
+ }
1630
1640
  function renderRectParticipant(g, palette, isDark) {
1631
1641
  g.append("rect").attr("x", -W / 2).attr("y", 0).attr("width", W).attr("height", H).attr("rx", 2).attr("ry", 2).attr("fill", fill(palette, isDark)).attr("stroke", stroke(palette)).attr("stroke-width", SW);
1632
1642
  }
@@ -1916,7 +1926,10 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
1916
1926
  }
1917
1927
  }
1918
1928
  const allRenderSteps = buildRenderSequence(messages);
1919
- const renderSteps = hiddenMsgIndices.size > 0 ? allRenderSteps.filter((s) => !hiddenMsgIndices.has(s.messageIndex)) : allRenderSteps;
1929
+ let renderSteps = hiddenMsgIndices.size > 0 ? allRenderSteps.filter((s) => !hiddenMsgIndices.has(s.messageIndex)) : allRenderSteps;
1930
+ renderSteps = renderSteps.filter(
1931
+ (s) => s.type === "call" || s.label
1932
+ );
1920
1933
  const activations = activationsOff ? [] : computeActivations(renderSteps);
1921
1934
  const stepSpacing = 35;
1922
1935
  const BLOCK_HEADER_SPACE = 30;
@@ -2140,7 +2153,7 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
2140
2153
  const boxY = participantStartY - GROUP_PADDING_TOP;
2141
2154
  const boxH = PARTICIPANT_BOX_HEIGHT + GROUP_PADDING_TOP + GROUP_PADDING_BOTTOM;
2142
2155
  const resolvedGroupColor = group.color ? resolveColor(group.color, palette) : void 0;
2143
- const fillColor = resolvedGroupColor ? `color-mix(in srgb, ${resolvedGroupColor} 10%, ${isDark ? palette.surface : palette.bg})` : isDark ? palette.surface : palette.bg;
2156
+ const fillColor = resolvedGroupColor ? mix(resolvedGroupColor, isDark ? palette.surface : palette.bg, 10) : isDark ? palette.surface : palette.bg;
2144
2157
  const strokeColor = resolvedGroupColor || palette.textMuted;
2145
2158
  svg.append("rect").attr("x", minX).attr("y", boxY).attr("width", maxX - minX).attr("height", boxH).attr("rx", 6).attr("fill", fillColor).attr("stroke", strokeColor).attr("stroke-width", 1).attr("stroke-opacity", 0.5).attr("class", "group-box").attr("data-group-line", String(group.lineNumber));
2146
2159
  svg.append("text").attr("x", minX + 8).attr("y", boxY + GROUP_LABEL_SIZE + 4).attr("fill", strokeColor).attr("font-size", GROUP_LABEL_SIZE).attr("font-weight", "bold").attr("opacity", 0.7).attr("class", "group-label").attr("data-group-line", String(group.lineNumber)).text(group.name);
@@ -2263,7 +2276,7 @@ function renderSequenceDiagram(container, parsed, palette, isDark, _onNavigateTo
2263
2276
  if (msg) coveredLines.push(msg.lineNumber);
2264
2277
  }
2265
2278
  svg.append("rect").attr("x", x).attr("y", y1).attr("width", ACTIVATION_WIDTH).attr("height", y2 - y1).attr("fill", isDark ? palette.surface : palette.bg);
2266
- const actFill = `color-mix(in srgb, ${palette.primary} ${isDark ? "15%" : "30%"}, ${isDark ? palette.surface : palette.bg})`;
2279
+ const actFill = mix(palette.primary, isDark ? palette.surface : palette.bg, isDark ? 15 : 30);
2267
2280
  svg.append("rect").attr("x", x).attr("y", y1).attr("width", ACTIVATION_WIDTH).attr("height", y2 - y1).attr("fill", actFill).attr("stroke", palette.primary).attr("stroke-width", 1).attr("stroke-opacity", 0.5).attr("data-participant-id", act.participantId).attr("data-msg-lines", coveredLines.join(",")).attr("class", "activation");
2268
2281
  });
2269
2282
  for (const ln of deferredLines) {
@@ -2447,7 +2460,7 @@ var init_renderer = __esm({
2447
2460
  MESSAGE_START_OFFSET = 30;
2448
2461
  LIFELINE_TAIL = 30;
2449
2462
  ARROWHEAD_SIZE = 8;
2450
- fill = (palette, isDark) => `color-mix(in srgb, ${palette.primary} ${isDark ? "15%" : "30%"}, ${isDark ? palette.surface : palette.bg})`;
2463
+ fill = (palette, isDark) => mix(palette.primary, isDark ? palette.surface : palette.bg, isDark ? 15 : 30);
2451
2464
  stroke = (palette) => palette.textMuted;
2452
2465
  SW = 1.5;
2453
2466
  W = PARTICIPANT_BOX_WIDTH;