@diagrammo/dgmo 0.8.18 → 0.8.20

package/src/graph/state-parser.ts

@@ -2,6 +2,7 @@ import { resolveColorWithDiagnostic } from '../colors';
 import type { DgmoError } from '../diagnostics';
 import type { PaletteColors } from '../palettes';
 import { makeDgmoError, formatDgmoError, suggest } from '../diagnostics';
+import { parseInArrowLabel, matchColorParens } from '../utils/arrows';
 import {
   measureIndent,
   extractColor,
@@ -31,6 +32,8 @@ const GROUP_BRACKET_RE = /^\[([^\]]+)\](?:\(([^)]+)\))?\s*$/;
  * Arrows: `->`, `-label->`, `-(color)->`, `-label(color)->`
  */
 function splitArrows(line: string): string[] {
+  // Mirrors flowchart-parser.ts splitArrows. TD-9 longest-match: arrow token
+  // is the maximal run of `-+>`. See that file for the full algorithm rationale.
   const segments: string[] = [];
   const arrowPositions: {
     start: number;
@@ -40,41 +43,52 @@ function splitArrows(line: string): string[] {
   }[] = [];
 
   let searchFrom = 0;
+  let scanFloor = 0;
   while (searchFrom < line.length) {
     const idx = line.indexOf('->', searchFrom);
     if (idx === -1) break;
 
-    let arrowStart = idx;
+    let runStart = idx;
+    while (runStart > scanFloor && line[runStart - 1] === '-') runStart--;
+    const arrowEnd = idx + 2;
+
+    let arrowStart: number;
     let label: string | undefined;
     let color: string | undefined;
 
-    if (idx > 0 && line[idx - 1] !== ' ' && line[idx - 1] !== '\t') {
-      let scanBack = idx - 1;
-      while (scanBack > 0 && line[scanBack] !== '-') {
-        scanBack--;
+    let openingStart = -1;
+    for (let i = scanFloor; i < runStart; i++) {
+      if (line[i] !== '-') continue;
+      const prevIsWsOrFloor =
+        i === 0 || i === scanFloor || /\s/.test(line[i - 1]);
+      if (prevIsWsOrFloor) {
+        openingStart = i;
+        break;
       }
-      if (
-        line[scanBack] === '-' &&
-        (scanBack === 0 || /\s/.test(line[scanBack - 1]))
-      ) {
-        let arrowContent = line.substring(scanBack + 1, idx);
-        if (arrowContent.endsWith('-'))
-          arrowContent = arrowContent.slice(0, -1);
-        const colorMatch = arrowContent.match(/\(([^)]+)\)\s*$/);
-        if (colorMatch) {
-          color = colorMatch[1].trim();
-          const labelPart = arrowContent.substring(0, colorMatch.index!).trim();
-          if (labelPart) label = labelPart;
-        } else {
-          const labelPart = arrowContent.trim();
-          if (labelPart) label = labelPart;
-        }
-        arrowStart = scanBack;
+    }
+
+    if (openingStart !== -1) {
+      let openingEnd = openingStart;
+      while (openingEnd < runStart && line[openingEnd] === '-') openingEnd++;
+
+      const arrowContent = line.substring(openingEnd, runStart);
+      const colorMatch = arrowContent.match(/\(([^)]+)\)\s*$/);
+      if (colorMatch) {
+        color = colorMatch[1].trim();
+        const labelPart = arrowContent.substring(0, colorMatch.index!).trim();
+        if (labelPart) label = labelPart;
+      } else {
+        const labelPart = arrowContent.trim();
+        if (labelPart) label = labelPart;
       }
+      arrowStart = openingStart;
+    } else {
+      arrowStart = runStart;
     }
 
-    arrowPositions.push({ start: arrowStart, end: idx + 2, label, color });
-    searchFrom = idx + 2;
+    arrowPositions.push({ start: arrowStart, end: arrowEnd, label, color });
+    searchFrom = arrowEnd;
+    scanFloor = arrowEnd;
   }
 
   if (arrowPositions.length === 0) return [line];
@@ -111,19 +125,30 @@ function parseArrowToken(
   diagnostics: DgmoError[]
 ): ArrowInfo {
   if (token === '->') return {};
-  const colorOnly = token.match(/^-\(([^)]+)\)->$/);
-  if (colorOnly)
-    return {
-      color: resolveColorWithDiagnostic(
-        colorOnly[1].trim(),
-        lineNumber,
-        diagnostics,
-        palette
-      ),
-    };
+  // TD-11: `-(X)->` is a color if and only if X is a recognized palette
+  // color; otherwise the whole `(X)` becomes the label. Delegate recognition
+  // to the shared `matchColorParens` helper.
+  const bareParen = token.match(/^-(\([A-Za-z]+\))->$/);
+  if (bareParen) {
+    const colorName = matchColorParens(bareParen[1]);
+    if (colorName) {
+      return {
+        color: resolveColorWithDiagnostic(
+          colorName,
+          lineNumber,
+          diagnostics,
+          palette
+        ),
+      };
+    }
+    // fall through — whole `(X)` becomes label
+  }
   const m = token.match(/^-(.+?)(?:\(([^)]+)\))?->$/);
   if (m) {
-    const label = m[1]?.trim() || undefined;
+    const rawLabel = m[1] ?? '';
+    const labelResult = parseInArrowLabel(rawLabel, lineNumber);
+    diagnostics.push(...labelResult.diagnostics);
+    const label = labelResult.label;
     const color = m[2]
       ? resolveColorWithDiagnostic(
           m[2].trim(),

package/src/index.ts

@@ -5,6 +5,18 @@
 export { makeDgmoError, formatDgmoError } from './diagnostics';
 export type { DgmoError, DgmoSeverity } from './diagnostics';
 
+// ============================================================
+// Arrow helpers (in-arrow label validation)
+// ============================================================
+
+export {
+  parseInArrowLabel,
+  validateLabelCharacters,
+  matchColorParens,
+  ARROW_DIAGNOSTIC_CODES,
+} from './utils/arrows';
+export type { ParseInArrowLabelResult } from './utils/arrows';
+
 // ============================================================
 // Unified API
 // ============================================================
@@ -38,9 +50,9 @@ export {
   orderArcNodes,
   parseTimelineDate,
   addDurationToDate,
-  computeTimeTicks,
   formatDateLabel,
 } from './d3';
+export { computeTimeTicks } from './utils/time-ticks';
 export type {
   ParsedVisualization,
   VisualizationType,
@@ -73,9 +85,6 @@ export {
   RULE_COUNT,
 } from './sequence/participant-inference';
 
-export { parseQuadrant } from './dgmo-mermaid';
-export type { ParsedQuadrant } from './dgmo-mermaid';
-
 export { parseFlowchart, looksLikeFlowchart } from './graph/flowchart-parser';
 
 export { parseState, looksLikeState } from './graph/state-parser';
@@ -378,8 +387,6 @@ export type {
   LegendHandle,
   LegendPalette,
 } from './utils/legend-types';
-export { buildMermaidQuadrant } from './dgmo-mermaid';
-
 // ============================================================
 // Renderers (produce SVG output)
 // ============================================================
@@ -410,6 +417,9 @@ export type {
   SequenceRenderOptions,
 } from './sequence/renderer';
 
+export { applyCollapseProjection } from './sequence/collapse';
+export type { CollapsedView } from './sequence/collapse';
+
 // ============================================================
 // Colors & Palettes
 // ============================================================
@@ -434,7 +444,6 @@ export {
   hexToHSL,
   hslToHex,
   hexToHSLString,
-  mute,
   tint,
   shade,
   getSeriesColors,
@@ -450,9 +459,6 @@ export {
   boldPalette,
   draculaPalette,
   monokaiPalette,
-  // Mermaid bridge
-  buildMermaidThemeVars,
-  buildThemeCSS,
 } from './palettes';
 
 export type { PaletteConfig, PaletteColors } from './palettes';
@@ -461,11 +467,16 @@ export type { PaletteConfig, PaletteColors } from './palettes';
 // Sharing (URL encoding/decoding)
 // ============================================================
 
-export { encodeDiagramUrl, decodeDiagramUrl } from './sharing';
+export {
+  encodeDiagramUrl,
+  decodeDiagramUrl,
+  encodeViewState,
+  decodeViewState,
+} from './sharing';
 export type {
   EncodeDiagramUrlOptions,
   EncodeDiagramUrlResult,
-  DiagramViewState,
+  CompactViewState,
   DecodedDiagramUrl,
 } from './sharing';
 
@@ -492,9 +503,3 @@ export type {
 } from './completion';
 
 export { parseFirstLine, ALL_CHART_TYPES } from './utils/parsing';
-
-// ============================================================
-// Branding
-// ============================================================
-
-export { injectBranding } from './branding';

package/src/infra/parser.ts

@@ -8,6 +8,7 @@
 
 import { makeDgmoError, formatDgmoError, suggest } from '../diagnostics';
 import { resolveColorWithDiagnostic } from '../colors';
+import { parseInArrowLabel } from '../utils/arrows';
 import {
   measureIndent,
   parseFirstLine,
@@ -477,7 +478,10 @@ export function parseInfra(content: string): ParsedInfra {
       // Async labeled connection: ~label~> Target
       const asyncConnMatch = trimmed.match(ASYNC_CONNECTION_RE);
       if (asyncConnMatch) {
-        const label = asyncConnMatch[1]?.trim() || '';
+        const rawLabel = asyncConnMatch[1] ?? '';
+        const labelResult = parseInArrowLabel(rawLabel, lineNumber);
+        result.diagnostics.push(...labelResult.diagnostics);
+        const label = labelResult.label ?? '';
         const targetRaw = asyncConnMatch[2].trim();
         const pipeMeta = extractPipeMetadata(targetRaw);
         const targetName = pipeMeta.clean || targetRaw;
@@ -551,7 +555,10 @@ export function parseInfra(content: string): ParsedInfra {
       // Labeled connection: -label-> Target | split: N%, fanout: 3
       const connMatch = trimmed.match(CONNECTION_RE);
       if (connMatch) {
-        const label = connMatch[1]?.trim() || '';
+        const rawLabel = connMatch[1] ?? '';
+        const labelResult = parseInArrowLabel(rawLabel, lineNumber);
+        result.diagnostics.push(...labelResult.diagnostics);
+        const label = labelResult.label ?? '';
         const targetRaw = connMatch[2].trim();
         const pipeMeta = extractPipeMetadata(targetRaw);
         const targetName = pipeMeta.clean || targetRaw;

package/src/kanban/renderer.ts

@@ -28,7 +28,7 @@ import type {
 // Public options object
 // ============================================================
 
-export interface KanbanInteractiveOptions {
+interface KanbanInteractiveOptions {
   onNavigateToLine?: (line: number) => void;
   exportDims?: { width: number; height: number };
   activeTagGroup?: string | null;
@@ -608,7 +608,7 @@ interface SwimlaneBucket {
   cellsByColumn: Record<string, KanbanCard[]>;
 }
 
-export function bucketCardsBySwimlane(
+function bucketCardsBySwimlane(
   columns: KanbanColumn[],
   swimlaneGroup: KanbanTagGroup
 ): SwimlaneBucket[] {

package/src/palettes/color-utils.ts

@@ -84,17 +84,6 @@ export function hexToHSLString(hex: string): string {
 // Color Manipulation
 // ============================================================
 
-/**
- * Derive a muted (desaturated, darkened) variant of a color.
- * Used by the Mermaid theme generator for dark-mode fills.
- *
- * Algorithm: cap saturation at 35% and lightness at 36%.
- */
-export function mute(hex: string): string {
-  const { h, s, l } = hexToHSL(hex);
-  return hslToHex(h, Math.min(s, 35), Math.min(l, 36));
-}
-
 /**
  * Blend a color toward white (light mode quadrant fills).
  * amount: 0 = original, 1 = white
@@ -232,7 +221,10 @@ export function getSeriesColors(palette: PaletteColors): string[] {
  * saturation and lightness, guaranteeing every segment gets a unique,
  * perceptually distinct color regardless of segment count.
  */
-export function getSegmentColors(palette: PaletteColors, count: number): string[] {
+export function getSegmentColors(
+  palette: PaletteColors,
+  count: number
+): string[] {
   const base = getSeriesColors(palette);
   const unique = [...new Set(base)];
   const hsls = unique.map(hexToHSL);

package/src/palettes/index.ts

@@ -14,7 +14,6 @@ export {
   hexToHSL,
   hslToHex,
   hexToHSLString,
-  mute,
   tint,
   shade,
   getSeriesColors,
@@ -34,6 +33,3 @@ export { tokyoNightPalette } from './tokyo-night';
 
 export { draculaPalette } from './dracula';
 export { monokaiPalette } from './monokai';
-
-// Re-export Mermaid bridge
-export { buildMermaidThemeVars, buildThemeCSS } from './mermaid-bridge';

package/src/render.ts

@@ -1,6 +1,11 @@
 import { renderForExport } from './d3';
 import { renderExtendedChartForExport } from './echarts';
-import { parseDgmoChartType, getRenderCategory } from './dgmo-router';
+import {
+  parseDgmoChartType,
+  getRenderCategory,
+  parseDgmo,
+} from './dgmo-router';
+import type { DgmoError } from './diagnostics';
 import { getPalette } from './palettes/registry';
 
 /**
@@ -45,13 +50,13 @@ async function ensureDom(): Promise<void> {
  *
  * @param content - DGMO source text
  * @param options - Optional theme and palette settings
- * @returns SVG string, or empty string on error
+ * @returns Object with `svg` (SVG string, empty on error) and `diagnostics` (parse errors/warnings)
  *
  * @example
  * ```ts
  * import { render } from '@diagrammo/dgmo';
  *
- * const svg = await render(`pie Languages
+ * const { svg, diagnostics } = await render(`pie Languages
  * TypeScript: 45
  * Python: 30
  * Rust: 25`);
@@ -62,7 +67,6 @@ export async function render(
   options?: {
     theme?: 'light' | 'dark' | 'transparent';
     palette?: string;
-    branding?: boolean;
     c4Level?: 'context' | 'containers' | 'components' | 'deployment';
     c4System?: string;
     c4Container?: string;
@@ -70,14 +74,15 @@ export async function render(
     /** Legend state for export — controls which tag group is shown in exported SVG. */
     legendState?: { activeGroup?: string; hiddenAttributes?: string[] };
   }
-): Promise<string> {
+): Promise<{ svg: string; diagnostics: DgmoError[] }> {
   const theme = options?.theme ?? 'light';
   const paletteName = options?.palette ?? 'nord';
-  const branding = options?.branding ?? false;
 
   const paletteColors =
     getPalette(paletteName)[theme === 'dark' ? 'dark' : 'light'];
 
+  const { diagnostics } = parseDgmo(content);
+
   const chartType = parseDgmoChartType(content);
   const category = chartType ? getRenderCategory(chartType) : null;
 
@@ -92,18 +97,27 @@ export async function render(
     : undefined;
 
   if (category === 'data-chart') {
-    return renderExtendedChartForExport(content, theme, paletteColors, {
-      branding,
-    });
+    const svg = await renderExtendedChartForExport(
+      content,
+      theme,
+      paletteColors
+    );
+    return { svg, diagnostics };
   }
 
   // Visualization/diagram and unknown/null types all go through the unified renderer
   await ensureDom();
-  return renderForExport(content, theme, paletteColors, legendExportState, {
-    branding,
-    c4Level: options?.c4Level,
-    c4System: options?.c4System,
-    c4Container: options?.c4Container,
-    tagGroup: options?.tagGroup,
-  });
+  const svg = await renderForExport(
+    content,
+    theme,
+    paletteColors,
+    legendExportState,
+    {
+      c4Level: options?.c4Level,
+      c4System: options?.c4System,
+      c4Container: options?.c4Container,
+      tagGroup: options?.tagGroup,
+    }
+  );
+  return { svg, diagnostics };
 }

package/src/sequence/collapse.ts

@@ -0,0 +1,169 @@
+// ============================================================
+// Collapse Projection for Sequence Diagram Groups
+// ============================================================
+//
+// Pure projection function that transforms a parsed sequence diagram
+// by collapsing specified groups into single virtual participants.
+// The parsed AST (ParsedSequenceDgmo) stays immutable.
+
+import type {
+  ParsedSequenceDgmo,
+  SequenceElement,
+  SequenceGroup,
+  SequenceMessage,
+  SequenceParticipant,
+} from './parser';
+import { isSequenceBlock, isSequenceNote, isSequenceSection } from './parser';
+
+export interface CollapsedView {
+  participants: SequenceParticipant[];
+  messages: SequenceMessage[];
+  elements: SequenceElement[];
+  groups: SequenceGroup[];
+  /** Maps member participant ID → collapsed group name */
+  collapsedGroupIds: Map<string, string>;
+}
+
+/**
+ * Project a parsed sequence diagram into a collapsed view.
+ *
+ * @param parsed - The immutable parsed sequence diagram
+ * @param collapsedGroups - Set of group lineNumbers that should be collapsed
+ * @returns A new CollapsedView with remapped participants, messages, elements, and groups
+ */
+export function applyCollapseProjection(
+  parsed: ParsedSequenceDgmo,
+  collapsedGroups: Set<number>
+): CollapsedView {
+  if (collapsedGroups.size === 0) {
+    return {
+      participants: parsed.participants,
+      messages: parsed.messages,
+      elements: parsed.elements,
+      groups: parsed.groups,
+      collapsedGroupIds: new Map(),
+    };
+  }
+
+  // Build memberToGroup map: participantId → group name
+  const memberToGroup = new Map<string, string>();
+  const collapsedGroupNames = new Set<string>();
+  for (const group of parsed.groups) {
+    if (collapsedGroups.has(group.lineNumber)) {
+      collapsedGroupNames.add(group.name);
+      for (const memberId of group.participantIds) {
+        memberToGroup.set(memberId, group.name);
+      }
+    }
+  }
+
+  // Participants: remove members of collapsed groups, insert virtual participant per group
+  // Skip non-member participants that collide with a collapsed group name
+  const participants: SequenceParticipant[] = [];
+  const insertedGroups = new Set<string>();
+
+  for (const p of parsed.participants) {
+    const groupName = memberToGroup.get(p.id);
+    if (groupName) {
+      // Replace first occurrence with virtual group participant
+      if (!insertedGroups.has(groupName)) {
+        insertedGroups.add(groupName);
+        const group = parsed.groups.find(
+          (g) => g.name === groupName && collapsedGroups.has(g.lineNumber)
+        )!;
+        participants.push({
+          id: groupName,
+          label: groupName,
+          type: 'default',
+          lineNumber: group.lineNumber,
+        });
+      }
+      // Skip member — it's absorbed into the group
+    } else if (collapsedGroupNames.has(p.id)) {
+      // Skip — participant name collides with a collapsed group name;
+      // the virtual group participant takes precedence
+    } else {
+      participants.push(p);
+    }
+  }
+
+  // Remap helper
+  const remap = (id: string): string => memberToGroup.get(id) ?? id;
+
+  // Messages: remap from/to, preserving order
+  const messages: SequenceMessage[] = parsed.messages.map((msg) => ({
+    ...msg,
+    from: remap(msg.from),
+    to: remap(msg.to),
+  }));
+
+  // Elements: deep clone with remapping and internal return suppression
+  const elements = remapElements(parsed.elements, memberToGroup);
+
+  // Groups: remove collapsed groups (they're now virtual participants)
+  const groups = parsed.groups.filter(
+    (g) => !collapsedGroups.has(g.lineNumber)
+  );
+
+  return {
+    participants,
+    messages,
+    elements,
+    groups,
+    collapsedGroupIds: memberToGroup,
+  };
+}
+
+/**
+ * Deep clone and remap elements, suppressing internal returns within collapsed groups.
+ */
+function remapElements(
+  elements: SequenceElement[],
+  memberToGroup: Map<string, string>
+): SequenceElement[] {
+  const remap = (id: string): string => memberToGroup.get(id) ?? id;
+  const result: SequenceElement[] = [];
+
+  for (const el of elements) {
+    if (isSequenceSection(el)) {
+      // Sections have no participant references — pass through unchanged
+      result.push(el);
+    } else if (isSequenceNote(el)) {
+      // Remap note participant
+      result.push({
+        ...el,
+        participantId: remap(el.participantId),
+      });
+    } else if (isSequenceBlock(el)) {
+      // Recurse into block children
+      result.push({
+        ...el,
+        children: remapElements(el.children, memberToGroup),
+        elseChildren: remapElements(el.elseChildren, memberToGroup),
+        ...(el.elseIfBranches
+          ? {
+              elseIfBranches: el.elseIfBranches.map((branch) => ({
+                ...branch,
+                children: remapElements(branch.children, memberToGroup),
+              })),
+            }
+          : {}),
+      });
+    } else {
+      // Message element
+      const msg = el as SequenceMessage;
+      const from = remap(msg.from);
+      const to = remap(msg.to);
+
+      // Suppress internal return: both endpoints in same collapsed group
+      // and this is a return message (unlabeled response)
+      if (from === to && from !== msg.from && !msg.label) {
+        continue; // internal return suppressed
+      }
+
+      result.push({ ...msg, from, to });
+    }
+  }
+
+  return result;
+}

package/src/sequence/parser.ts

@@ -5,7 +5,7 @@
 import { inferParticipantType } from './participant-inference';
 import type { DgmoError } from '../diagnostics';
 import { makeDgmoError, formatDgmoError, suggest } from '../diagnostics';
-import { parseArrow } from '../utils/arrows';
+import { parseArrow, parseInArrowLabel } from '../utils/arrows';
 import {
   measureIndent,
   extractColor,
@@ -154,6 +154,8 @@ export interface SequenceGroup {
   lineNumber: number;
   /** Pipe-delimited tag metadata (e.g. `[Backend | t: Product]`) */
   metadata?: Record<string, string>;
+  /** Whether this group is collapsed by default */
+  collapsed?: boolean;
 }
 
 /**
@@ -502,8 +504,17 @@ export function parseSequenceDgmo(content: string): ParsedSequenceDgmo {
       const groupColor = groupMatch[2]?.trim();
       let groupMeta: Record<string, string> | undefined;
 
-      // Parse pipe metadata AFTER the closing bracket
-      const afterBracket = groupMatch[3]?.trim() || '';
+      // Parse collapse keyword and pipe metadata AFTER the closing bracket
+      let afterBracket = groupMatch[3]?.trim() || '';
+      let isCollapsed = false;
+
+      // Extract `collapse` keyword (before any pipe metadata)
+      const collapseMatch = afterBracket.match(/^collapse\b/i);
+      if (collapseMatch) {
+        isCollapsed = true;
+        afterBracket = afterBracket.slice(collapseMatch[0].length).trim();
+      }
+
       if (afterBracket.startsWith('|')) {
         const segments = afterBracket.split('|');
         const meta = parsePipeMetadata(segments, aliasMap, () =>
@@ -524,6 +535,7 @@ export function parseSequenceDgmo(content: string): ParsedSequenceDgmo {
         participantIds: [],
         lineNumber,
         ...(groupMeta ? { metadata: groupMeta } : {}),
+        ...(isCollapsed ? { collapsed: true } : {}),
       };
       result.groups.push(activeGroup);
       continue;
@@ -933,9 +945,14 @@ export function parseSequenceDgmo(content: string): ParsedSequenceDgmo {
     }
     if (labeledArrow) {
       contentStarted = true;
-      const { from, to, label, async: isAsync } = labeledArrow;
+      const { from, to, label: rawLabel, async: isAsync } = labeledArrow;
       lastMsgFrom = from;
 
+      // TD-13/TD-14: validate in-arrow label characters
+      const labelResult = parseInArrowLabel(rawLabel, lineNumber);
+      labelResult.diagnostics.forEach((d) => result.diagnostics.push(d));
+      const label = labelResult.label ?? rawLabel;
+
       const msg: SequenceMessage = {
         from,
         to,