@diagrammo/dgmo 0.2.7 → 0.2.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@diagrammo/dgmo",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "description": "DGMO diagram markup language — parser, renderer, and color system",
   "license": "MIT",
   "type": "module",

package/src/sequence/parser.ts

@@ -97,6 +97,7 @@ export interface SequenceNote {
   position: 'right' | 'left';
   participantId: string;
   lineNumber: number;
+  endLineNumber: number;
 }
 
 export type SequenceElement =
@@ -165,7 +166,7 @@ const UML_RETURN_PATTERN = /^(\w+\([^)]*\))\s*:\s*(.+)$/;
 
 // Note patterns — "note: text", "note right of API: text", "note left of User"
 const NOTE_SINGLE = /^note(?:\s+(right|left)\s+of\s+(\S+))?\s*:\s*(.+)$/i;
-const NOTE_MULTI = /^note(?:\s+(right|left)\s+of\s+(\S+))?\s*$/i;
+const NOTE_MULTI = /^note(?:\s+(right|left)\s+of\s+([^\s:]+))?\s*:?\s*$/i;
 
 /**
  * Extract return label from a message label string.
@@ -647,15 +648,11 @@ export function parseSequenceDgmo(content: string): ParsedSequenceDgmo {
         (noteSingleMatch[1]?.toLowerCase() as 'right' | 'left') || 'right';
       let noteParticipant = noteSingleMatch[2] || null;
       if (!noteParticipant) {
-        if (!lastMsgFrom) {
-          result.error = `Line ${lineNumber}: note requires a preceding message`;
-          return result;
-        }
+        if (!lastMsgFrom) continue; // incomplete — skip during live typing
         noteParticipant = lastMsgFrom;
       }
       if (!result.participants.some((p) => p.id === noteParticipant)) {
-        result.error = `Line ${lineNumber}: note references unknown participant '${noteParticipant}'`;
-        return result;
+        continue; // unknown participant — skip during live typing
       }
       const note: SequenceNote = {
         kind: 'note',
@@ -663,6 +660,7 @@ export function parseSequenceDgmo(content: string): ParsedSequenceDgmo {
         position: notePosition,
         participantId: noteParticipant,
         lineNumber,
+        endLineNumber: lineNumber,
       };
       currentContainer().push(note);
       continue;
@@ -675,15 +673,11 @@ export function parseSequenceDgmo(content: string): ParsedSequenceDgmo {
         (noteMultiMatch[1]?.toLowerCase() as 'right' | 'left') || 'right';
       let noteParticipant = noteMultiMatch[2] || null;
       if (!noteParticipant) {
-        if (!lastMsgFrom) {
-          result.error = `Line ${lineNumber}: note requires a preceding message`;
-          return result;
-        }
+        if (!lastMsgFrom) continue; // incomplete — skip during live typing
         noteParticipant = lastMsgFrom;
       }
       if (!result.participants.some((p) => p.id === noteParticipant)) {
-        result.error = `Line ${lineNumber}: note references unknown participant '${noteParticipant}'`;
-        return result;
+        continue; // unknown participant — skip during live typing
       }
       // Collect indented body lines
       const noteLines: string[] = [];
@@ -696,16 +690,14 @@ export function parseSequenceDgmo(content: string): ParsedSequenceDgmo {
         noteLines.push(nextTrimmed);
         i++;
       }
-      if (noteLines.length === 0) {
-        result.error = `Line ${lineNumber}: multi-line note has no content — add indented lines or use 'note: text'`;
-        return result;
-      }
+      if (noteLines.length === 0) continue; // no body yet — skip during live typing
       const note: SequenceNote = {
         kind: 'note',
         text: noteLines.join('\n'),
         position: notePosition,
         participantId: noteParticipant,
         lineNumber,
+        endLineNumber: i + 1, // i has advanced past the body lines (1-based)
       };
       currentContainer().push(note);
       continue;

package/src/sequence/renderer.ts

@@ -52,14 +52,16 @@ interface InlineSpan {
 
 function parseInlineMarkdown(text: string): InlineSpan[] {
   const spans: InlineSpan[] = [];
-  const regex = /\*\*(.+?)\*\*|\*(.+?)\*|`(.+?)`|\[(.+?)\]\((.+?)\)|([^*`[]+)/g;
+  const regex = /\*\*(.+?)\*\*|__(.+?)__|\*(.+?)\*|_(.+?)_|`(.+?)`|\[(.+?)\]\((.+?)\)|([^*_`[]+)/g;
   let match;
   while ((match = regex.exec(text)) !== null) {
-    if (match[1]) spans.push({ text: match[1], bold: true });
-    else if (match[2]) spans.push({ text: match[2], italic: true });
-    else if (match[3]) spans.push({ text: match[3], code: true });
-    else if (match[4]) spans.push({ text: match[4], href: match[5] });
-    else if (match[6]) spans.push({ text: match[6] });
+    if (match[1]) spans.push({ text: match[1], bold: true });       // **bold**
+    else if (match[2]) spans.push({ text: match[2], bold: true });  // __bold__
+    else if (match[3]) spans.push({ text: match[3], italic: true }); // *italic*
+    else if (match[4]) spans.push({ text: match[4], italic: true }); // _italic_
+    else if (match[5]) spans.push({ text: match[5], code: true });   // `code`
+    else if (match[6]) spans.push({ text: match[6], href: match[7] }); // [text](url)
+    else if (match[8]) spans.push({ text: match[8] });
   }
   return spans;
 }
@@ -915,6 +917,38 @@ export function renderSequenceDiagram(
     markBlockSpacing(elements);
   }
 
+  // Note spacing — add vertical room after messages that have notes attached
+  const NOTE_OFFSET_BELOW = 16; // gap between message arrow and top of note box
+  const computeNoteHeight = (text: string): number => {
+    const lines = wrapTextLines(text, NOTE_CHARS_PER_LINE);
+    return lines.length * NOTE_LINE_H + NOTE_PAD_V * 2;
+  };
+  const markNoteSpacing = (els: SequenceElement[]): void => {
+    for (let i = 0; i < els.length; i++) {
+      const el = els[i];
+      if (isSequenceNote(el)) {
+        const noteH = computeNoteHeight(el.text);
+        // Find the next non-note element after this note
+        const nextIdx =
+          i + 1 < els.length ? findFirstMsgIndex([els[i + 1]]) : -1;
+        if (nextIdx >= 0) {
+          addExtra(nextIdx, noteH + NOTE_OFFSET_BELOW);
+        }
+      } else if (isSequenceBlock(el)) {
+        markNoteSpacing(el.children);
+        if (el.elseIfBranches) {
+          for (const branch of el.elseIfBranches) {
+            markNoteSpacing(branch.children);
+          }
+        }
+        markNoteSpacing(el.elseChildren);
+      }
+    }
+  };
+  if (elements && elements.length > 0) {
+    markNoteSpacing(elements);
+  }
+
   // --- Section-aware Y layout ---
   // Sections get their own Y positions computed from content above them (not anchored
   // to messages below). This ensures toggling collapse/expand doesn't move the divider.
@@ -1865,14 +1899,15 @@ export function renderSequenceDiagram(
         const noteX = isRight
           ? px + ACTIVATION_WIDTH + NOTE_GAP
           : px - ACTIVATION_WIDTH - NOTE_GAP - noteW;
-        const noteTopY = noteY - noteH / 2;
+        const noteTopY = noteY + NOTE_OFFSET_BELOW;
 
         // Wrap in <g> with data attributes for toggle support
         const noteG = svg
           .append('g')
           .attr('class', 'note')
           .attr('data-note-toggle', '')
-          .attr('data-line-number', String(el.lineNumber));
+          .attr('data-line-number', String(el.lineNumber))
+          .attr('data-line-end', String(el.endLineNumber));
 
         // Folded-corner path
         noteG
@@ -1909,35 +1944,32 @@ export function renderSequenceDiagram(
           .attr('stroke-width', 0.75)
           .attr('class', 'note-fold');
 
-        // Dashed connector to lifeline
-        const connectorNoteX = isRight ? noteX : noteX + noteW;
-        const connectorLifeX = isRight
-          ? px + ACTIVATION_WIDTH / 2
-          : px - ACTIVATION_WIDTH / 2;
-        noteG
-          .append('line')
-          .attr('x1', connectorNoteX)
-          .attr('y1', noteY)
-          .attr('x2', connectorLifeX)
-          .attr('y2', noteY)
-          .attr('stroke', palette.textMuted)
-          .attr('stroke-width', 0.75)
-          .attr('stroke-dasharray', '3 2')
-          .attr('class', 'note-connector');
-
         // Render text with inline markdown
         wrappedLines.forEach((line, li) => {
           const textY =
             noteTopY + NOTE_PAD_V + (li + 1) * NOTE_LINE_H - 3;
+          const isBullet = line.startsWith('- ');
+          const bulletIndent = isBullet ? 10 : 0;
+          const displayLine = isBullet ? line.slice(2) : line;
           const textEl = noteG
             .append('text')
-            .attr('x', noteX + NOTE_PAD_H)
+            .attr('x', noteX + NOTE_PAD_H + bulletIndent)
             .attr('y', textY)
             .attr('fill', palette.text)
             .attr('font-size', NOTE_FONT_SIZE)
             .attr('class', 'note-text');
 
-          const spans = parseInlineMarkdown(line);
+          if (isBullet) {
+            noteG
+              .append('text')
+              .attr('x', noteX + NOTE_PAD_H)
+              .attr('y', textY)
+              .attr('fill', palette.text)
+              .attr('font-size', NOTE_FONT_SIZE)
+              .text('\u2022');
+          }
+
+          const spans = parseInlineMarkdown(displayLine);
           for (const span of spans) {
             if (span.href) {
               const a = textEl