@transitrix/diagrams 1.2.0 → 1.4.0

package/dist/webview/__tests__/render-blocks.test.js

@@ -0,0 +1,130 @@
+/**
+ * Unit tests for the host-neutral nested-blocks SVG renderer used by both the
+ * VS Code blocks preview and the IntelliJ JCEF webview bundle. These tests pin
+ * the per-node label rule (CLAUDE.md "Entity block layout"): leaf nodes wrap
+ * the name to at most 3 lines and the ID to at most 2 lines, with `…`
+ * truncation beyond that; container headers stack name + ID, each truncated
+ * with `…` to fit the block width. No label may extend past the rect.
+ */
+import { describe, expect, it } from 'vitest';
+import { renderBlocksSvg } from '../render-blocks.js';
+// Approximate character widths used by the renderer when sizing labels.
+// Kept in sync with `CHAR_W` / `CHAR_W_ID` in render-blocks.ts so the test
+// can compute the same overflow bounds the renderer uses.
+const CHAR_W = 7;
+const CHAR_W_ID = 6;
+// Same horizontal margin the renderer reserves so text never abuts the rect.
+const TEXT_MARGIN_X = 8;
+function leafDoc(name, id) {
+    return {
+        notation: 'blocks',
+        spec_version: '0.1',
+        nested_blocks: {
+            id: 'BLOCKS-T-1',
+            name: 'Test',
+            blocks: [{ id, name }],
+        },
+    };
+}
+function containerDoc(name, id, childId = 'CHILD', childName = 'Child') {
+    return {
+        notation: 'blocks',
+        spec_version: '0.1',
+        nested_blocks: {
+            id: 'BLOCKS-T-1',
+            name: 'Test',
+            blocks: [
+                {
+                    id,
+                    name,
+                    children: [{ id: childId, name: childName }],
+                },
+            ],
+        },
+    };
+}
+/** Pull every text-primary / text-id line out of an SVG, in document order. */
+function extractLabels(svg) {
+    const re = /<text class="(text-(?:primary|id))"[^>]*>([^<]*)<\/text>/g;
+    const out = [];
+    let m;
+    while ((m = re.exec(svg)))
+        out.push({ cls: m[1], text: m[2] });
+    return out;
+}
+describe('renderBlocksSvg — leaf labels', () => {
+    it('wraps a long name to at most 3 lines and truncates with …', () => {
+        const longName = 'Personal data records that linger after consent withdrawal across many systems and ' +
+            'archives — known erasure gap';
+        const svg = renderBlocksSvg(leafDoc(longName, 'PII'));
+        const nameLines = extractLabels(svg).filter((l) => l.cls === 'text-primary');
+        expect(nameLines.length).toBeGreaterThan(0);
+        expect(nameLines.length).toBeLessThanOrEqual(3);
+        // If the name needed truncation, the final visible line must end with `…`.
+        if (nameLines.length === 3) {
+            expect(nameLines[2].text.endsWith('…')).toBe(true);
+        }
+    });
+    it('wraps a long ID to at most 2 lines and truncates with …', () => {
+        const longId = 'VERY_LONG_BLOCK_IDENTIFIER_WITH_MANY_SEGMENTS_AND_MORE_AND_MORE';
+        const svg = renderBlocksSvg(leafDoc('Short name', longId));
+        const idLines = extractLabels(svg).filter((l) => l.cls === 'text-id');
+        expect(idLines.length).toBeGreaterThan(0);
+        expect(idLines.length).toBeLessThanOrEqual(2);
+        if (idLines.length === 2) {
+            expect(idLines[1].text.endsWith('…')).toBe(true);
+        }
+    });
+    it('keeps every label inside the 160px leaf width (approximated by CHAR_W * length)', () => {
+        const svg = renderBlocksSvg(leafDoc('Personal data records that linger after consent withdrawal across many systems', 'PII_RECORDS_WITH_A_FAIRLY_LONG_IDENTIFIER_HERE'));
+        const labels = extractLabels(svg);
+        const inner = 160 - TEXT_MARGIN_X * 2;
+        for (const l of labels) {
+            const cw = l.cls === 'text-primary' ? CHAR_W : CHAR_W_ID;
+            expect(l.text.length * cw).toBeLessThanOrEqual(inner);
+        }
+    });
+});
+describe('renderBlocksSvg — container headers', () => {
+    it('renders the name and ID as two separate stacked text elements', () => {
+        const svg = renderBlocksSvg(containerDoc('Active systems', 'ACTIVE_SYSTEMS'));
+        const labels = extractLabels(svg);
+        // Container header contributes one text-primary (name) and one text-id (id);
+        // the leaf child contributes another pair. So 2 of each kind in total.
+        const primaries = labels.filter((l) => l.cls === 'text-primary').map((l) => l.text);
+        const ids = labels.filter((l) => l.cls === 'text-id').map((l) => l.text);
+        expect(primaries).toContain('Active systems');
+        expect(ids).toContain('ACTIVE_SYSTEMS');
+        // The legacy "(id)" suffix on the name line must not appear — id has its own row.
+        for (const t of primaries)
+            expect(t).not.toContain('(');
+    });
+    it('truncates a long container ID so it does not overflow the block width', () => {
+        const svg = renderBlocksSvg(containerDoc('Short name', 'VERY_LONG_CONTAINER_IDENTIFIER_THAT_WOULD_OTHERWISE_OVERFLOW', 'CHILD', 'Child'));
+        const labels = extractLabels(svg);
+        // The container width derives from its single 160px child: 160 + 2*12 (padding) = 184.
+        const containerW = 160 + 24;
+        const inner = containerW - TEXT_MARGIN_X * 2;
+        for (const l of labels) {
+            const cw = l.cls === 'text-primary' ? CHAR_W : CHAR_W_ID;
+            expect(l.text.length * cw).toBeLessThanOrEqual(inner);
+        }
+        // The full ID was too long to fit on one line of `inner / CHAR_W_ID` chars, so
+        // the rendered ID must be the truncated form ending in `…`.
+        const renderedIds = labels.filter((l) => l.cls === 'text-id').map((l) => l.text);
+        expect(renderedIds.some((t) => t.endsWith('…'))).toBe(true);
+    });
+    it('truncates a long container name with … to fit the block width', () => {
+        const longName = 'Active systems that are erasure-reachable within the standard 30-day operational window';
+        const svg = renderBlocksSvg(containerDoc(longName, 'ACTIVE'));
+        const labels = extractLabels(svg);
+        const containerW = 160 + 24;
+        const inner = containerW - TEXT_MARGIN_X * 2;
+        const primaries = labels.filter((l) => l.cls === 'text-primary');
+        for (const l of primaries) {
+            expect(l.text.length * CHAR_W).toBeLessThanOrEqual(inner);
+        }
+        // At least one primary line must have been truncated.
+        expect(primaries.some((l) => l.text.endsWith('…'))).toBe(true);
+    });
+});

package/dist/webview/entry.d.ts

@@ -27,7 +27,7 @@ export interface RenderResult {
  * convention used by the VS Code extension's `activationEvents`. All twelve
  * are wired to their validator + renderer as of Step 4.
  */
-export type NotationKind = 'goals' | 'dgca' | 'dga' | 'fgca' | 'fga' | 'activities' | 'activity-card' | 'applications' | 'products' | 'process-map' | 'process-blueprint' | 'scenarios' | 'capability-map' | 'blocks';
+export type NotationKind = 'goals' | 'dgca' | 'dga' | 'action' | 'action-card' | 'applications' | 'products' | 'process-map' | 'process-blueprint' | 'scenarios' | 'capability-map' | 'blocks';
 export declare function render(notationKind: string, source: string): RenderResult;
 export declare const api: {
     version: string;

package/dist/webview/entry.js

@@ -48,10 +48,8 @@ const SUPPORTED_KINDS = [
     'goals',
     'dgca',
     'dga',
-    'fgca',
-    'fga',
-    'activities',
-    'activity-card',
+    'action',
+    'action-card',
     'applications',
     'products',
     'process-map',
@@ -110,11 +108,7 @@ function dispatchValidate(kind, doc) {
             }
             return r;
         }
-        // DGCA and DGA are the canonical new names; FGCA/FGA are accepted as
-        // deprecated aliases. All four share the same parse + renderer; only the
-        // Change column visibility differs (DGA/FGA collapse it).
-        case 'dgca':
-        case 'fgca': {
+        case 'dgca': {
             const v = parseCanonicalFGCA(doc);
             const r = emptyResult(kind, v.valid ? 'ok' : 'error');
             r.errors.push(...v.errors);
@@ -124,8 +118,7 @@ function dispatchValidate(kind, doc) {
             }
             return r;
         }
-        case 'dga':
-        case 'fga': {
+        case 'dga': {
             const v = parseCanonicalFGA(doc);
             const r = emptyResult(kind, v.valid ? 'ok' : 'error');
             r.errors.push(...v.errors);
@@ -135,10 +128,10 @@ function dispatchValidate(kind, doc) {
             }
             return r;
         }
-        case 'activities':
-            return renderFromValidation('activities', validateActivities(doc), () => renderActivitiesSvg(doc));
-        case 'activity-card':
-            return renderFromValidation('activity-card', validateActivityCard(doc), () => renderActivityCardSvg(doc));
+        case 'action':
+            return renderFromValidation('action', validateActivities(doc), () => renderActivitiesSvg(doc));
+        case 'action-card':
+            return renderFromValidation('action-card', validateActivityCard(doc), () => renderActivityCardSvg(doc));
         case 'process-blueprint':
             return renderFromValidation('process-blueprint', validateProcessBlueprint(doc), () => renderProcessBlueprintSvg(doc));
         case 'blocks':

package/dist/webview/render-activities.d.ts

@@ -28,6 +28,18 @@ export interface RenderActivitiesOptions {
     curvature?: number;
     /** Entry curvature at the target node; defaults to `curvature` when omitted. */
     entryCurvature?: number;
+    /**
+     * When true (the default), activities with `activity_type === 'project'` are
+     * excluded from the network layout. Project container nodes add visual noise
+     * in the PSND view because the diagram itself already represents the project
+     * scope; suppressing them declutters the network without altering canonical
+     * data. Set to false to render all activities regardless of type.
+     *
+     * Convention: Network/diagram views suppress project nodes by default.
+     * Text/document views (Tree) keep them visible and compensate with the
+     * Action name in the view header.
+     */
+    suppressProjectNodes?: boolean;
 }
 /**
  * Render the network (PSND) view of an already-validated ActivityDoc to a

package/dist/webview/render-activities.js

@@ -132,12 +132,18 @@ export function renderActivitiesNetworkBody(layout, cpm, ox, oy, curvature, entr
  * than short-circuiting.
  */
 export function renderActivitiesSvg(doc, options = {}) {
-    const { title = '', gaps = {}, curvature = DEFAULT_EDGE_CURVATURE, entryCurvature } = options;
-    const layout = layoutActivities(doc, gaps);
+    const { title = '', gaps = {}, curvature = DEFAULT_EDGE_CURVATURE, entryCurvature, suppressProjectNodes = true, } = options;
+    // #421: Suppress project-type container nodes in the network layout by
+    // default (see suppressProjectNodes JSDoc). A shallow copy avoids mutating
+    // the caller's doc.
+    const renderDoc = suppressProjectNodes
+        ? { ...doc, activities: (doc.activities ?? []).filter((a) => a.activity_type?.toLowerCase() !== 'project') }
+        : doc;
+    const layout = layoutActivities(renderDoc, gaps);
     if (layout.nodes.length === 0) {
         return `<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" viewBox="0 0 0 0"></svg>`;
     }
-    const cpm = computeCpm(doc.activities ?? []);
+    const cpm = computeCpm(renderDoc.activities ?? []);
     const titleH = title ? 24 : 0;
     const w = layout.bounds.width + N_PAD * 2;
     const h = layout.bounds.height + N_PAD * 2 + titleH;

package/dist/webview/render-activity-card.js

@@ -12,7 +12,7 @@
  * CROSS-DOCUMENT RESOLUTION CAVEAT
  * The Activity Card is the only MULTI-DOCUMENT Studio notation: the card YAML
  * names a project Activity, and the project's name, dates, motivation chain
- * (Drivers → Assessments → Goals → Changes) and child activities are pulled BY
+ * (Drivers → Goals → Changes) and child activities are pulled BY
  * REFERENCE from the canonical element + relation store (`canon/elements/**`,
  * `canon/relations/**`; see `../activity-card/resolver.ts`). That resolution
  * requires reading those files from disk, which is NOT available inside the
@@ -108,10 +108,9 @@ export function renderActivityCardBody(layout, ox, oy) {
             parts.push(`<text class="text-primary" x="${r.x + ox + 12}" y="${r.y + oy + 44 + i * 18}" style="dominant-baseline:central">${escXml(line)}</text>`);
         });
     }
-    // Chain sections (Drivers → Assessments → Goals → Changes).
+    // Chain sections (Drivers → Goals → Changes).
     const SECTION_LEVEL = {
         drivers: 4,
-        assessments: 5,
         goals: 5,
         changes: 6,
     };

package/dist/webview/render-blocks.js

@@ -18,8 +18,54 @@ import { escXml } from './render-util.js';
 const PAD = 24;
 // Approximate character width (px) at text-primary size (12px/600).
 const CHAR_W = 7;
-// Approximate character width (px) at text-id size (10px/600) — used for ID suffix.
+// Approximate character width (px) at text-id size (10px/600).
 const CHAR_W_ID = 6;
+// Vertical spacing between line centres.
+const LINE_H = 14; // name lines (text-primary)
+const LINE_H_ID = 12; // id lines (text-id)
+const NAME_ID_GAP = 6; // gap between last name centre and first ID centre
+/** Word-wrap `text` to at most `maxLines` lines of `maxChars` each. */
+function wrapWords(text, maxChars, maxLines) {
+    const safeMax = Math.max(2, maxChars);
+    const words = text.split(' ');
+    const lines = [];
+    let cur = '';
+    for (let i = 0; i < words.length; i++) {
+        const w = words[i];
+        const next = cur ? `${cur} ${w}` : w;
+        if (next.length <= safeMax) {
+            cur = next;
+        }
+        else {
+            if (cur)
+                lines.push(cur);
+            cur = '';
+            if (lines.length >= maxLines)
+                break;
+            if (lines.length === maxLines - 1) {
+                const rest = words.slice(i).join(' ');
+                lines.push(rest.length <= safeMax ? rest : rest.slice(0, safeMax - 1) + '…');
+                return lines;
+            }
+            cur = w.length <= safeMax ? w : w.slice(0, safeMax - 1) + '…';
+        }
+    }
+    if (cur && lines.length < maxLines)
+        lines.push(cur);
+    return lines.length ? lines : [text.slice(0, safeMax - 1) + '…'];
+}
+/** Split an ID (no spaces) across at most 2 lines, breaking at `_` or `-`. */
+function wrapId(id, maxChars) {
+    if (id.length <= maxChars)
+        return [id];
+    const seg = id.slice(0, maxChars);
+    const sepIdx = Math.max(seg.lastIndexOf('_'), seg.lastIndexOf('-'));
+    const cut = sepIdx > Math.floor(maxChars / 3) ? sepIdx : maxChars - 1;
+    const isSep = id[cut] === '_' || id[cut] === '-';
+    const line1 = id.slice(0, cut);
+    const rest = id.slice(cut + (isSep ? 1 : 0));
+    return [line1, rest.length <= maxChars ? rest : rest.slice(0, maxChars - 1) + '…'];
+}
 /**
  * Pick the diagram-frame level class for a block at the given depth.
  *
@@ -32,34 +78,67 @@ function levelClassForDepth(depth) {
     const idx = Math.min(Math.max(depth - 1, 0), 6);
     return `level-${idx}`;
 }
-/** Truncate at a word boundary so labels never break in the middle of a word. */
-function wordTruncate(text, maxChars) {
-    if (text.length <= maxChars)
+// Reserve a small horizontal margin so text never abuts the rounded corners.
+const TEXT_MARGIN_X = 8;
+/** Truncate `text` to at most `maxChars` characters, at a word boundary when possible. */
+function truncateLine(text, maxChars) {
+    const safeMax = Math.max(2, maxChars);
+    if (text.length <= safeMax)
         return text;
-    const cut = text.slice(0, maxChars - 1);
+    const cut = text.slice(0, safeMax - 1);
     const lastSpace = cut.lastIndexOf(' ');
-    return (lastSpace > maxChars / 2 ? cut.slice(0, lastSpace) : cut) + '…';
+    return (lastSpace > safeMax / 2 ? cut.slice(0, lastSpace) : cut) + '…';
+}
+/** Single-line ID truncation that prefers `_`/`-` separators before falling back to a hard cut. */
+function truncateId(id, maxChars) {
+    const safeMax = Math.max(2, maxChars);
+    if (id.length <= safeMax)
+        return id;
+    const cut = id.slice(0, safeMax - 1);
+    const sepIdx = Math.max(cut.lastIndexOf('_'), cut.lastIndexOf('-'));
+    return (sepIdx > safeMax / 3 ? cut.slice(0, sepIdx) : cut) + '…';
 }
 function emitBlockSvg(b, ox, oy, parts) {
     const cls = levelClassForDepth(b.depth);
     const cx = b.x + ox + b.width / 2;
     parts.push(`<rect class="diagram-node ${cls}" x="${b.x + ox}" y="${b.y + oy}" width="${b.width}" height="${b.height}" rx="6"/>`);
+    const innerW = Math.max(0, b.width - TEXT_MARGIN_X * 2);
     const isLeaf = b.children.length === 0;
     if (isLeaf) {
-        // Leaf block: name on upper line, ID on lower line — both centred.
-        const nameY = b.y + oy + Math.round(b.height * 0.38);
-        const idY = b.y + oy + Math.round(b.height * 0.66);
-        const maxChars = Math.max(4, Math.floor(b.width / CHAR_W));
-        parts.push(`<text class="text-primary" x="${cx}" y="${nameY}" text-anchor="middle" dominant-baseline="central">${escXml(wordTruncate(b.name, maxChars))}</text>`, `<text class="text-id" x="${cx}" y="${idY}" text-anchor="middle" dominant-baseline="central">${escXml(b.id)}</text>`);
+        // Leaf block: name (up to 3 lines) then ID (up to 2 lines), centred vertically.
+        const maxCharsName = Math.max(4, Math.floor(innerW / CHAR_W));
+        const maxCharsId = Math.max(4, Math.floor(innerW / CHAR_W_ID));
+        const nameLines = wrapWords(b.name, maxCharsName, 3);
+        const idLines = wrapId(b.id, maxCharsId);
+        const nameTotalSpan = (nameLines.length - 1) * LINE_H;
+        const idTotalSpan = (idLines.length - 1) * LINE_H_ID;
+        const totalSpan = nameTotalSpan + NAME_ID_GAP + idTotalSpan;
+        const firstY = Math.round(b.y + oy + (b.height - totalSpan) / 2);
+        for (let i = 0; i < nameLines.length; i++) {
+            parts.push(`<text class="text-primary" x="${cx}" y="${firstY + i * LINE_H}" text-anchor="middle" dominant-baseline="central">${escXml(nameLines[i])}</text>`);
+        }
+        const idFirstY = firstY + nameTotalSpan + NAME_ID_GAP;
+        for (let i = 0; i < idLines.length; i++) {
+            parts.push(`<text class="text-id" x="${cx}" y="${idFirstY + i * LINE_H_ID}" text-anchor="middle" dominant-baseline="central">${escXml(idLines[i])}</text>`);
+        }
     }
     else {
-        // Container block: name + (ID) on the single header line; ID in grey.
-        const headerY = b.y + oy + b.headerHeight / 2;
-        const idSuffix = ` (${b.id})`;
-        const idSuffixW = idSuffix.length * CHAR_W_ID;
-        const nameMaxChars = Math.max(4, Math.floor((b.width - idSuffixW) / CHAR_W));
-        const nameText = wordTruncate(b.name, nameMaxChars);
-        parts.push(`<text class="text-primary" x="${cx}" y="${headerY}" text-anchor="middle" dominant-baseline="central">${escXml(nameText)}<tspan fill="var(--ts-text-secondary, #64748b)" font-size="10" font-weight="600">${escXml(idSuffix)}</tspan></text>`);
+        // Container block: name (text-primary) above, ID (text-id, grey) below — both
+        // single-line, truncated with `…` to fit within `b.width`. The header strip is
+        // only `headerHeight` tall (default 28px), which is enough for one line each at
+        // the configured text sizes. Stacking the ID as its own text-id element keeps
+        // the wrapping/truncation rule consistent with leaves and guarantees no overflow
+        // for any combination of name/ID length.
+        const maxCharsName = Math.max(4, Math.floor(innerW / CHAR_W));
+        const maxCharsId = Math.max(4, Math.floor(innerW / CHAR_W_ID));
+        const nameText = truncateLine(b.name, maxCharsName);
+        const idText = truncateId(b.id, maxCharsId);
+        const headerMid = b.y + oy + b.headerHeight / 2;
+        const halfSpan = (LINE_H + LINE_H_ID) / 4;
+        const nameY = Math.round(headerMid - halfSpan);
+        const idY = Math.round(headerMid + halfSpan);
+        parts.push(`<text class="text-primary" x="${cx}" y="${nameY}" text-anchor="middle" dominant-baseline="central">${escXml(nameText)}</text>`);
+        parts.push(`<text class="text-id" x="${cx}" y="${idY}" text-anchor="middle" dominant-baseline="central">${escXml(idText)}</text>`);
         for (const c of b.children)
             emitBlockSvg(c, ox, oy, parts);
     }

package/dist/webview/render-fgca.js

@@ -67,7 +67,7 @@ export function renderFgcaBody(columns, nodes, edges, curvature, entryCurvature)
             `<rect class="diagram-node layer-${n.col}" x="${n.x}" y="${n.y}" width="${NODE_W}" height="${NODE_H}" rx="8"/>`,
             `<text class="text-primary" x="${n.x + NODE_W / 2}" y="${y1}" text-anchor="middle" dominant-baseline="central">${escXml(line1)}</text>`,
             twoLines
-                ? `<text class="text-secondary" x="${n.x + NODE_W / 2}" y="${y2}" text-anchor="middle" dominant-baseline="central">${escXml(line2)}</text>`
+                ? `<text class="text-primary" x="${n.x + NODE_W / 2}" y="${y2}" text-anchor="middle" dominant-baseline="central">${escXml(line2)}</text>`
                 : '',
             `<text class="text-id" x="${n.x + NODE_W / 2}" y="${idY}" text-anchor="middle" dominant-baseline="central">${escXml(entityId)}</text>`,
         ]

package/dist/webview/render-goals.js

@@ -15,12 +15,11 @@ import { horizontalCubicEdgePath, DEFAULT_EDGE_CURVATURE } from '../edge-path.js
 import { generateSvgEmbedCss } from '../theme/index.js';
 import { escXml } from './render-util.js';
 const NODE_W = 250;
-const NODE_H = 60;
+const NODE_H = 72;
 const RANK_SEP = 100;
 const NODE_SEP = 24;
 const PAD = 24;
-const LABEL_MAX = 36;
-const LABEL_TRIM = 34;
+const LABEL_CHARS = 30;
 /**
  * Host-neutral goals renderer (IntelliJ/UI). Lays the tree out with the default
  * spacing, then delegates the actual SVG emission to {@link renderGoalsLayoutSvg}
@@ -81,10 +80,34 @@ export function renderGoalsLayoutSvg(layout, options = {}) {
         const y = n.y + oy;
         const level = n.data.level % 8;
         const labelText = n.data.name ?? String(n.id);
-        const label = labelText.length > LABEL_MAX ? labelText.slice(0, LABEL_TRIM) + '…' : labelText;
+        const words = labelText.split(' ');
+        let line1 = '';
+        let line2 = '';
+        for (const w of words) {
+            if ((line1 + ' ' + w).trim().length <= LABEL_CHARS) {
+                line1 = (line1 + ' ' + w).trim();
+            }
+            else if ((line2 + ' ' + w).trim().length <= LABEL_CHARS) {
+                line2 = (line2 + ' ' + w).trim();
+            }
+            else if (!line2) {
+                line2 = w.slice(0, LABEL_CHARS - 2) + '…';
+                break;
+            }
+        }
+        const twoLines = line2.length > 0;
+        const nameY1 = twoLines ? y + 12 : y + 16;
+        const nameY2 = y + 26;
+        const typeY = twoLines ? y + 43 : y + 35;
+        const idY = twoLines ? y + 59 : y + 55;
+        const typeLabel = n.data.type ?? '';
+        const idText = String(n.data.id);
         return `<g>
   <rect class="diagram-node level-${level}" x="${x}" y="${y}" width="${n.width}" height="${n.height}" rx="8"/>
-  <text class="text-primary" x="${x + n.width / 2}" y="${y + n.height / 2}" text-anchor="middle" dominant-baseline="central">${escXml(label)}</text>
+  <text class="text-primary" x="${x + n.width / 2}" y="${nameY1}" text-anchor="middle" dominant-baseline="central">${escXml(line1)}</text>${twoLines ? `
+  <text class="text-primary" x="${x + n.width / 2}" y="${nameY2}" text-anchor="middle" dominant-baseline="central">${escXml(line2)}</text>` : ''}${typeLabel ? `
+  <text class="text-secondary" x="${x + n.width / 2}" y="${typeY}" text-anchor="middle" dominant-baseline="central">${escXml(typeLabel)}</text>` : ''}
+  <text class="text-id" x="${x + n.width / 2}" y="${idY}" text-anchor="middle" dominant-baseline="central">${escXml(idText)}</text>
 </g>`;
     })
         .join('\n');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transitrix/diagrams",
-  "version": "1.2.0",
+  "version": "1.4.0",
   "type": "module",
   "description": "Shared rendering, validation, and pure mutations for Transitrix custom diagram formats.",
   "license": "MIT",

package/src/__tests__/yaml-normalize.test.ts

@@ -61,8 +61,8 @@ describe('coerceDatesToIsoStrings', () => {
 describe('coerceDatesToIsoStrings — js-yaml integration', () => {
   it('quoted ISO dates are preserved untouched', () => {
     const text = [
-      'notation: activities',
-      'activities:',
+      'notation: action',
+      'actions:',
       '  - id: "A-001"',
       '    name: "Quoted dates"',
       '    duration: 3',
@@ -70,18 +70,18 @@ describe('coerceDatesToIsoStrings — js-yaml integration', () => {
       '    end_date: "2026-06-03"',
       '',
     ].join('\n');
-    const parsed = yaml.load(text) as { activities: { start_date: unknown; end_date: unknown }[] };
+    const parsed = yaml.load(text) as { actions: { start_date: unknown; end_date: unknown }[] };
     coerceDatesToIsoStrings(parsed);
-    expect(parsed.activities[0].start_date).toBe('2026-06-01');
-    expect(parsed.activities[0].end_date).toBe('2026-06-03');
+    expect(parsed.actions[0].start_date).toBe('2026-06-01');
+    expect(parsed.actions[0].end_date).toBe('2026-06-03');
     const v = validateActivities(parsed);
     expect(v.valid).toBe(true);
   });
 
   it('bare ISO dates are coerced to ISO strings and pass validation', () => {
     const text = [
-      'notation: activities',
-      'activities:',
+      'notation: action',
+      'actions:',
       '  - id: "A-001"',
       '    name: "Bare dates"',
       '    duration: 3',
@@ -89,14 +89,14 @@ describe('coerceDatesToIsoStrings — js-yaml integration', () => {
       '    end_date: 2026-06-03',
       '',
     ].join('\n');
-    const parsed = yaml.load(text) as { activities: { start_date: unknown; end_date: unknown }[] };
+    const parsed = yaml.load(text) as { actions: { start_date: unknown; end_date: unknown }[] };
     // Without coercion, js-yaml returns Date instances and the validator
     // would emit ACT-008 because typeof !== 'string'. Sanity-check that
     // assumption before normalisation.
-    expect(parsed.activities[0].start_date).toBeInstanceOf(Date);
+    expect(parsed.actions[0].start_date).toBeInstanceOf(Date);
     coerceDatesToIsoStrings(parsed);
-    expect(parsed.activities[0].start_date).toBe('2026-06-01');
-    expect(parsed.activities[0].end_date).toBe('2026-06-03');
+    expect(parsed.actions[0].start_date).toBe('2026-06-01');
+    expect(parsed.actions[0].end_date).toBe('2026-06-03');
     const v = validateActivities(parsed);
     expect(v.valid).toBe(true);
   });