@formicoidea/labre-framework-edgy 0.31.0 → 0.33.0

package/dist/rules.js

@@ -0,0 +1,153 @@
+import { EDGY_DYNAMIC_RELATIONS } from './metamodel.js';
+import { EDGY_ROLE, EDGY_ROLES, EDGY_VERB_ROLE, } from './roles.js';
+/**
+ * EDGY validation rules (WS1).
+ *
+ * DATA owned by the framework, versioned per rule: the engine
+ * (`@labre/affine-block-surface`) knows how to evaluate a FAMILY, never a
+ * concrete rule. Adding an EDGY rule is adding an entry to this array.
+ *
+ * Registered from the flag-gated `EdgyViewExtension`, so switching the EDGY
+ * flag off removes the rules with the rest of the tooling — boards already
+ * drawn keep rendering, they simply stop being checked (`docs/adr/0009`).
+ *
+ * ## Two rules, and the ones deliberately left out
+ *
+ * The PO arbitration of 26/08/2026 put EDGY's two JUDGEMENT controls — "every
+ * intersection element is linked to both its parent facets" and "every element
+ * wears its facet's colour" — in `./nudges.ts` rather than here. Neither is
+ * decidable: the first would have to guess which circle an element belongs to
+ * from where somebody dropped it, and the second would indict a board whose
+ * author uses their own palette. A checklist can ask them; an algorithm cannot
+ * answer them.
+ *
+ * ## Debt: `tree-mixed-kinds`
+ *
+ * EDGY's own notation has TREES — a capability tree, an organisation tree —
+ * whose levels must all be the same kind of element. There is no tree on this
+ * canvas yet: nothing draws one, nothing stores one, and no role names one. The
+ * rule is therefore deferred rather than written against an artefact that does
+ * not exist. When a tree lands, it comes with its own role and this is where its
+ * rule goes.
+ */
+/**
+ * The 24 sanctioned sentences, DERIVED from the metamodel.
+ *
+ * One triplet per row of `EDGY_DYNAMIC_RELATIONS`, read exactly as
+ * `docs/adr/0010` reads a typed edge: source is the subject, target the object.
+ * The matrix is never restated — a relation added to the metamodel is drawn by
+ * the template, gets a role from `roles.ts` and becomes legal here, all from the
+ * one table. `requires` contributes three triplets under one role, which is what
+ * it means for a verb to be spoken of three different pairs.
+ */
+export const EDGY_ALLOWED_RELATIONS = EDGY_DYNAMIC_RELATIONS.map(([source, target, verb]) => ({
+    source: EDGY_ROLE[source],
+    edge: EDGY_VERB_ROLE[verb],
+    target: EDGY_ROLE[target],
+}));
+/**
+ * **E1** — a relation says something the EDGY metamodel does not.
+ *
+ * EDGY is a language before it is a diagram: its 24 relations are the sentences
+ * the method sanctions, and a link drawn between the wrong two elements — or
+ * drawn the right way round between the right two but carrying the wrong verb —
+ * is a modelling mistake no amount of dragging fixes. "A journey traverses a
+ * channel" is EDGY; "a channel traverses a journey" is a sentence nobody can
+ * act on.
+ *
+ * ## What stays silent
+ *
+ * Everything the `relation-endpoints` family already keeps quiet about, and one
+ * of them matters more here than anywhere: **a plain connector carries no role
+ * and is never judged**. Free links are how an EDGY workshop actually runs —
+ * somebody draws an arrow to say "these two have something to do with each
+ * other" and names it later — and the day the tool starts indicting that
+ * gesture is the day it gets switched off. Only the typed relations the toolbox
+ * and the templates stamp are read, and only when BOTH ends are official
+ * elements: a relation onto a bare sticky, onto a People node or onto an
+ * element of another framework is outside the alphabet, hence outside the
+ * conversation.
+ *
+ * Severity `warning` and not `blocking-overridable`: nothing in this library
+ * refuses a gesture, so declaring the blocking level would be data claiming an
+ * effect that does not exist (the note `wardley/rules.ts` carries at length).
+ * The profiles demote it to `audit` on a sketch.
+ */
+const nonCanonicalLink = {
+    id: 'edgy.non-canonical-link',
+    framework: 'edgy',
+    family: 'relation-endpoints',
+    severity: 'warning',
+    // No `appliesTo`: the subject is a RELATION, and the role that names it is
+    // declared where the family reads it — naming one of the three indicted
+    // elements here would be data that lies.
+    roles: EDGY_ROLES,
+    messageKey: 'com.labre.edgy.validation.non-canonical-link',
+    messageFallback: 'This relation is not one the EDGY metamodel declares between these two elements.',
+    suggestionKey: 'com.labre.edgy.validation.non-canonical-link.suggestion',
+    suggestionFallback: 'Read the link out loud — source, verb, target. Reverse it, re-point an end, or use the verb EDGY gives these two elements.',
+    version: 1,
+    provenance: {
+        source: 'recommendation',
+        reference: 'EDGY (Enterprise Design) — the 24 relations its metamodel sanctions',
+    },
+    // Not a frame the rule measures against — a sentence is right or wrong
+    // wherever it is written — but the facets diagram or board a finding is
+    // ATTRIBUTED to, so the arbitration "ignore this rule on the whole board" has
+    // somewhere to live (the `no-overlap` pattern).
+    backgroundRole: EDGY_ROLE.background,
+    endpoints: {
+        // The PARENT role: every verb specialises it, so the rule reads all 22 of
+        // them and no free connector.
+        edgeRole: EDGY_ROLE.relation,
+        allowed: EDGY_ALLOWED_RELATIONS,
+    },
+};
+/**
+ * **E2** — two artefacts must not sit on top of each other.
+ *
+ * A readability rule, the same one Wardley ships and for the same reason: a
+ * board you cannot read is useless, while a momentary overlap during a drag is
+ * not a mistake. It matters more on an EDGY facets diagram than almost
+ * anywhere, because WHERE an element sits is what says which facet it belongs
+ * to: an artefact hidden under another has lost its meaning, not just its
+ * legibility.
+ *
+ * ONE declared pair, `element × element`, because `roleIsA` covers the whole
+ * subtree — the four kinds and the twelve official elements — from the root.
+ * Backgrounds are outside that subtree by construction, so an element sitting on
+ * the diagram it belongs to is never a collision.
+ *
+ * `minPenetration: 4` model units, the calibration Wardley's W3 arrived at on
+ * the recette of 01/08/2026: under a twentieth of an EDGY node's 80-unit height
+ * and about twice a connector's stroke, so two boxes whose corners share a hair
+ * are silent while a box genuinely covering another is not. Verified against
+ * every layout this package ships: the twelve nodes of the EDGY dynamic
+ * template — the only stamped layout, hence the only one this rule can see —
+ * clear each other by 80 model units at the closest, twenty times the
+ * threshold.
+ */
+const overlappingArtefacts = {
+    id: 'edgy.overlapping-artefacts',
+    framework: 'edgy',
+    family: 'no-overlap',
+    severity: 'warning',
+    // No `appliesTo`: the subjects of a `no-overlap` rule are the pairs below.
+    roles: EDGY_ROLES,
+    messageKey: 'com.labre.edgy.validation.overlapping-artefacts',
+    messageFallback: 'These two overlap and make the board harder to read.',
+    suggestionKey: 'com.labre.edgy.validation.overlapping-artefacts.suggestion',
+    suggestionFallback: 'Move one of them aside — on a facets diagram, where an element sits is what says which facet it belongs to.',
+    version: 1,
+    provenance: {
+        source: 'labre-convention',
+        reference: 'Labre readability convention — no EDGY rule speaks of overlapping ink',
+    },
+    backgroundRole: EDGY_ROLE.background,
+    overlap: [[EDGY_ROLE.element, EDGY_ROLE.element]],
+    minPenetration: 4,
+};
+export const EDGY_RULES = [
+    nonCanonicalLink,
+    overlappingArtefacts,
+];

package/dist/templates/index.d.ts

@@ -1,2 +1,23 @@
-import { type TemplateCategory } from '@formicoidea/labre-core/gfx/template';
+import { type Template, type TemplateCategory } from '@formicoidea/labre-core/gfx/template';
+/**
+ * Background scale (from REF coords to model coords): large enough that the
+ * default-size nodes breathe inside each zone. The background is cropped to
+ * the circles (`cropToCircles`), so its xywh covers CROP × DYN_SCALE.
+ */
+export declare const DYN_SCALE = 4.8;
+/**
+ * The metamodel itself — the 12 elements and the 24 relations — now lives in
+ * `../metamodel.ts`, so the role vocabulary can DERIVE from it without this
+ * module and that one importing each other. Re-exported here under the names
+ * they have always had: nothing that reads them had to change.
+ */
+export { EDGY_DYNAMIC_NODES, EDGY_DYNAMIC_RELATIONS, type EdgyElementName, } from '../metamodel.js';
+/**
+ * Reference coords → template model coords: the background element sits at
+ * (0,0) and renders the cropped circles box, so a reference point maps to
+ * `(p - CROP.origin) × DYN_SCALE`.
+ */
+export declare function dynToModel(refX: number, refY: number): [number, number];
+/** Exported for direct insertion from the EDGY senior toolbar menu. */
+export declare const edgyDynamicTemplate: Template;
 export declare const edgyTemplateCategory: TemplateCategory;

package/dist/templates/index.js

@@ -1,7 +1,10 @@
 import { makeTemplateSnapshot, surfaceText, } from '@formicoidea/labre-core/gfx/template';
 import { ConnectorMode, FontFamily, PointStyle, ShapeStyle, StrokeStyle, TextAlign, } from '@formicoidea/labre-core/model';
-import { REF_H, REF_W } from '../consts.js';
-import { ACTIVITY_VERTICES, INNER_FONT_SIZE, NODE_FILL, NODE_STROKE, NODE_STROKE_WIDTH, OUTCOME_RADIUS, } from '../node/consts.js';
+import { CROP, CROP_LABELED } from '../consts.js';
+import { EDGY_DYNAMIC_NODES, EDGY_DYNAMIC_RELATIONS, EDGY_ZONE_FILL, edgyElementLabel, } from '../metamodel.js';
+import { EDGY_RELATION_LABEL_DISTANCE, edgyVerbLabelXYWH } from '../relation.js';
+import { EDGY_ROLE, EDGY_VERB_ROLE } from '../roles.js';
+import { ACTIVITY_VERTICES, INNER_FONT_SIZE, NODE_FILL, NODE_SIZE, NODE_STROKE, NODE_STROKE_WIDTH, OUTCOME_RADIUS, } from '../node/consts.js';
 // EDGY facet palette (header / pale sub-card).
 const C = {
     identity: ['#1ec873', '#9fe6c2'],
@@ -35,7 +38,15 @@ function rect(x, y, w, h, opts = {}) {
     }
     return el;
 }
-/** An EDGY node (kind drives the native shape): outcome/object box, people, activity chevron. */
+/**
+ * An EDGY node (kind drives the native shape): outcome/object box, people,
+ * activity chevron.
+ *
+ * `role` is optional and writes NOTHING when absent: the illustrative templates
+ * (journey, blueprint, org chart) stay neutral drawings the engine never looks
+ * at, exactly as they were before roles existed. Only the EDGY dynamic template
+ * — the one that IS the metamodel — stamps its elements.
+ */
 function enode(kind, x, y, w, h, opts = {}) {
     const el = {
         type: 'edgyNode',
@@ -52,6 +63,9 @@ function enode(kind, x, y, w, h, opts = {}) {
     };
     if (kind === 'activity')
         el.vertices = ACTIVITY_VERTICES;
+    // `undefined` writes nothing: a neutral node keeps no `role` key.
+    if (opts.role !== undefined)
+        el.role = opts.role;
     if (opts.text != null) {
         el.text = surfaceText(opts.text);
         el.color = opts.textColor ?? NODE_STROKE;
@@ -85,22 +99,76 @@ function line(x1, y1, x2, y2, opts = {}) {
         target: { position: [x2, y2] },
     };
 }
+/**
+ * Connector ATTACHED to two template elements (by key): endpoints clip to the
+ * element edges and follow moves — unlike `line()`, whose free positions are
+ * only right until the user drags something.
+ */
+function attach(src, dst, opts = {}) {
+    return {
+        type: 'connector',
+        mode: opts.mode ?? ConnectorMode.Straight,
+        stroke: NODE_STROKE,
+        strokeWidth: 2,
+        strokeStyle: StrokeStyle.Solid,
+        frontEndpointStyle: PointStyle.None,
+        rearEndpointStyle: opts.arrow ? PointStyle.Triangle : PointStyle.None,
+        source: { id: src },
+        target: { id: dst },
+    };
+}
 // ── Facets overview (six facets, sub-cards, facets/intersections) ─────
 function facetsOverview() {
     const out = {};
     const tall = (key, x, name, cards) => {
         const [hdr, sub] = C[key];
-        out[`${key}F`] = rect(x, 140, 192, 460, { fill: hdr, stroke: hdr, radius: 16 });
-        out[`${key}N`] = label(x, 168, 192, 28, name, { color: '#ffffff', fontSize: 18 });
-        out[`${key}1`] = rect(x + 16, 208, 160, 80, { fill: sub, stroke: sub, radius: 6, text: cards[0], fontSize: 16 });
-        out[`${key}2`] = rect(x + 16, 300, 160, 80, { fill: sub, stroke: sub, radius: 6, text: cards[1], fontSize: 16 });
-        out[`${key}3`] = enode('activity', x + 16, 392, 160, 84, { fill: sub, text: cards[2], fontSize: 16 });
+        out[`${key}F`] = rect(x, 140, 192, 460, {
+            fill: hdr,
+            stroke: hdr,
+            radius: 16,
+        });
+        out[`${key}N`] = label(x, 168, 192, 28, name, {
+            color: '#ffffff',
+            fontSize: 18,
+        });
+        out[`${key}1`] = rect(x + 16, 208, 160, 80, {
+            fill: sub,
+            stroke: sub,
+            radius: 6,
+            text: cards[0],
+            fontSize: 16,
+        });
+        out[`${key}2`] = rect(x + 16, 300, 160, 80, {
+            fill: sub,
+            stroke: sub,
+            radius: 6,
+            text: cards[1],
+            fontSize: 16,
+        });
+        out[`${key}3`] = enode('activity', x + 16, 392, 160, 84, {
+            fill: sub,
+            text: cards[2],
+            fontSize: 16,
+        });
     };
     const low = (key, x, name) => {
         const [hdr, sub] = C[key];
-        out[`${key}F`] = rect(x, 300, 192, 424, { fill: hdr, stroke: hdr, radius: 16 });
-        out[`${key}1`] = rect(x + 16, 360, 160, 92, { fill: sub, stroke: sub, radius: 6, text: name, fontSize: 16 });
-        out[`${key}N`] = label(x, 686, 192, 28, name, { color: '#ffffff', fontSize: 18 });
+        out[`${key}F`] = rect(x, 300, 192, 424, {
+            fill: hdr,
+            stroke: hdr,
+            radius: 16,
+        });
+        out[`${key}1`] = rect(x + 16, 360, 160, 92, {
+            fill: sub,
+            stroke: sub,
+            radius: 6,
+            text: name,
+            fontSize: 16,
+        });
+        out[`${key}N`] = label(x, 686, 192, 28, name, {
+            color: '#ffffff',
+            fontSize: 18,
+        });
     };
     // lower facets first (drawn behind the tall ones at the overlaps)
     low('organisation', 240, 'Organisation');
@@ -117,39 +185,114 @@ function facetsOverview() {
 }
 // ── Customer journey ──────────────────────────────────────────────────
 function journey() {
-    const step = (i, x) => enode('activity', x, 132, 224, 116, { fill: JOURNEY_PINK, text: `Journey step ${i}`, textColor: '#ffffff', fontSize: 18 });
-    const ch = (x, n) => enode('object', x, 392, 184, 96, { fill: JOURNEY_PINK, text: `Channel ${n}`, fontSize: 16 });
-    const tk = (x, n) => enode('object', x, 540, 168, 92, { fill: JOURNEY_PINK, text: `Task ${n}`, fontSize: 16 });
+    const step = (i, x) => enode('activity', x, 132, 224, 116, {
+        fill: JOURNEY_PINK,
+        text: `Journey step ${i}`,
+        textColor: '#ffffff',
+        fontSize: 18,
+    });
+    const ch = (x, n) => enode('object', x, 392, 184, 96, {
+        fill: JOURNEY_PINK,
+        text: `Channel ${n}`,
+        fontSize: 16,
+    });
+    const tk = (x, n) => enode('object', x, 540, 168, 92, {
+        fill: JOURNEY_PINK,
+        text: `Task ${n}`,
+        fontSize: 16,
+    });
     return {
         cust: enode('people', 40, 120, 64, 64, { fill: '#ffffff' }),
         custL: label(20, 192, 104, 24, 'Customer', { fontSize: 14 }),
-        band: { type: 'shape', shapeType: 'polygon', vertices: [[0, 0], [0.86, 0], [1, 0.5], [0.86, 1], [0, 1]], filled: true, fillColor: JOURNEY_PINK, strokeColor: JOURNEY_PINK, strokeWidth: 1, shapeStyle: ShapeStyle.General, roughness: 0, xywh: '[150,108,860,164]' },
-        bandL: label(170, 116, 120, 24, 'Journey', { color: '#ffffff', fontSize: 16, align: TextAlign.Left }),
+        band: {
+            type: 'shape',
+            shapeType: 'polygon',
+            vertices: [
+                [0, 0],
+                [0.86, 0],
+                [1, 0.5],
+                [0.86, 1],
+                [0, 1],
+            ],
+            filled: true,
+            fillColor: JOURNEY_PINK,
+            strokeColor: JOURNEY_PINK,
+            strokeWidth: 1,
+            shapeStyle: ShapeStyle.General,
+            roughness: 0,
+            xywh: '[150,108,860,164]',
+        },
+        bandL: label(170, 116, 120, 24, 'Journey', {
+            color: '#ffffff',
+            fontSize: 16,
+            align: TextAlign.Left,
+        }),
         s1: step(1, 240),
         s2: step(2, 500),
         s3: step(3, 760),
-        rightTask: enode('object', 1060, 132, 168, 92, { text: 'Task', fontSize: 16 }),
-        c1: ch(258, 'X'), c2: ch(518, 'Y'), c3: ch(778, 'Z'),
-        t1: tk(266, 'A'), t2: tk(526, 'B'), t3: tk(786, 'C'),
-        trav1: label(258, 350, 184, 20, 'traverses', { fontSize: 13, color: '#5f6368' }),
-        trav2: label(518, 350, 184, 20, 'traverses', { fontSize: 13, color: '#5f6368' }),
-        trav3: label(778, 350, 184, 20, 'traverses', { fontSize: 13, color: '#5f6368' }),
+        rightTask: enode('object', 1060, 132, 168, 92, {
+            text: 'Task',
+            fontSize: 16,
+        }),
+        c1: ch(258, 'X'),
+        c2: ch(518, 'Y'),
+        c3: ch(778, 'Z'),
+        t1: tk(266, 'A'),
+        t2: tk(526, 'B'),
+        t3: tk(786, 'C'),
+        trav1: label(258, 350, 184, 20, 'traverses', {
+            fontSize: 13,
+            color: '#5f6368',
+        }),
+        trav2: label(518, 350, 184, 20, 'traverses', {
+            fontSize: 13,
+            color: '#5f6368',
+        }),
+        trav3: label(778, 350, 184, 20, 'traverses', {
+            fontSize: 13,
+            color: '#5f6368',
+        }),
         use1: label(258, 504, 184, 20, 'uses', { fontSize: 13, color: '#5f6368' }),
         use2: label(518, 504, 184, 20, 'uses', { fontSize: 13, color: '#5f6368' }),
         use3: label(778, 504, 184, 20, 'uses', { fontSize: 13, color: '#5f6368' }),
-        l1: line(350, 248, 350, 392), l2: line(610, 248, 610, 392), l3: line(870, 248, 870, 392),
-        l4: line(350, 488, 350, 540), l5: line(610, 488, 610, 540), l6: line(870, 488, 870, 540),
+        l1: attach('s1', 'c1'),
+        l2: attach('s2', 'c2'),
+        l3: attach('s3', 'c3'),
+        l4: attach('c1', 't1'),
+        l5: attach('c2', 't2'),
+        l6: attach('c3', 't3'),
     };
 }
 // ── Service blueprint (six swimlanes) ─────────────────────────────────
 function blueprint() {
-    const lanes = ['Physical Evidence', 'Customer Actions', 'On-stage Actions', 'Back-stage Actions', 'Support Processes', 'Support Systems'];
-    const laneFill = ['#fdeef2', '#fbd5e0', '#dff0fb', '#d4e9f8', '#d4e9f8', '#d4e9f8'];
+    const lanes = [
+        'Physical Evidence',
+        'Customer Actions',
+        'On-stage Actions',
+        'Back-stage Actions',
+        'Support Processes',
+        'Support Systems',
+    ];
+    const laneFill = [
+        '#fdeef2',
+        '#fbd5e0',
+        '#dff0fb',
+        '#d4e9f8',
+        '#d4e9f8',
+        '#d4e9f8',
+    ];
     const out = {};
     lanes.forEach((name, i) => {
         const y = 40 + i * 150;
-        out[`lane${i}`] = rect(36, y, 1280, 150, { fill: laneFill[i], stroke: laneFill[i], sw: 0 });
-        out[`laneL${i}`] = label(52, y + 12, 260, 22, name, { fontSize: 15, align: TextAlign.Left });
+        out[`lane${i}`] = rect(36, y, 1280, 150, {
+            fill: laneFill[i],
+            stroke: laneFill[i],
+            sw: 0,
+        });
+        out[`laneL${i}`] = label(52, y + 12, 260, 22, name, {
+            fontSize: 15,
+            align: TextAlign.Left,
+        });
     });
     const chev = (x, y, fill, t) => enode('activity', x, y, 200, 60, { fill, text: t, fontSize: 14 });
     const box = (x, y, fill, t) => enode('object', x, y, 200, 60, { fill, text: t, fontSize: 14 });
@@ -157,19 +300,27 @@ function blueprint() {
     Object.assign(out, {
         af: rect(280, 64, 220, 70, { text: 'Admission Form' }),
         cf: rect(1010, 64, 220, 70, { text: 'Confirmation' }),
-        sf: chev(280, 214, P, 'Send Form'), fs: chev(600, 214, P, 'Follow status'), rd: chev(1010, 214, P, 'Receive decision'),
-        fh: chev(280, 364, B, 'Form handling'), cs: chev(600, 364, B, 'Customer support'), ct: chev(1010, 364, B, 'Contact'),
-        csv: chev(280, 514, B, 'Customer service'), cfu: box(1010, 514, B, 'Customer follow-up'),
-        pf: chev(600, 664, B, 'Process Form'), dec: chev(900, 664, B, 'Decision [Accept|Reject]'),
-        crm: box(280, 814, B, 'CRM Application'), cms: box(600, 814, B, 'Case Management'), pay: box(900, 814, B, 'Payments System'),
-        a1: line(380, 134, 380, 214, { arrow: true }),
-        a2: line(480, 244, 600, 244, { arrow: true }),
-        a3: line(800, 244, 1010, 244, { arrow: true }),
-        a4: line(320, 274, 320, 364, { arrow: true }),
-        a5: line(320, 424, 320, 514, { arrow: true }),
-        a6: line(700, 724, 900, 694, { arrow: true }),
-        a7: line(380, 874, 600, 844, { arrow: true }),
-        a8: line(800, 844, 900, 844, { arrow: true }),
+        sf: chev(280, 214, P, 'Send Form'),
+        fs: chev(600, 214, P, 'Follow status'),
+        rd: chev(1010, 214, P, 'Receive decision'),
+        fh: chev(280, 364, B, 'Form handling'),
+        cs: chev(600, 364, B, 'Customer support'),
+        ct: chev(1010, 364, B, 'Contact'),
+        csv: chev(280, 514, B, 'Customer service'),
+        cfu: box(1010, 514, B, 'Customer follow-up'),
+        pf: chev(600, 664, B, 'Process Form'),
+        dec: chev(900, 664, B, 'Decision [Accept|Reject]'),
+        crm: box(280, 814, B, 'CRM Application'),
+        cms: box(600, 814, B, 'Case Management'),
+        pay: box(900, 814, B, 'Payments System'),
+        a1: attach('af', 'sf', { arrow: true }),
+        a2: attach('sf', 'fs', { arrow: true }),
+        a3: attach('fs', 'rd', { arrow: true }),
+        a4: attach('sf', 'fh', { arrow: true }),
+        a5: attach('fh', 'csv', { arrow: true }),
+        a6: attach('pf', 'dec', { arrow: true }),
+        a7: attach('crm', 'cms', { arrow: true }),
+        a8: attach('cms', 'pay', { arrow: true }),
     });
     return out;
 }
@@ -179,20 +330,111 @@ function orgChart() {
     const u = (x, y, w, t) => enode('object', x, y, w, 64, { fill: cyan, text: t, fontSize: 16 });
     return {
         org: u(420, 40, 180, 'Organisation'),
-        a: u(120, 200, 200, 'Business Unit A'), b: u(410, 200, 200, 'Business Unit B'), c: u(700, 200, 200, 'Business Unit C'),
-        a1: u(60, 360, 170, 'Group A-1'), a2: u(260, 360, 170, 'Group A-2'), c1: u(715, 360, 170, 'Group C-1'),
-        e1: line(510, 104, 510, 150), e2: line(220, 150, 800, 150),
-        e3: line(220, 150, 220, 200), e4: line(510, 150, 510, 200), e5: line(800, 150, 800, 200),
-        e6: line(220, 264, 220, 320), e7: line(145, 320, 345, 320),
-        e8: line(145, 320, 145, 360), e9: line(345, 320, 345, 360),
-        e10: line(800, 264, 800, 360),
+        a: u(120, 200, 200, 'Business Unit A'),
+        b: u(410, 200, 200, 'Business Unit B'),
+        c: u(700, 200, 200, 'Business Unit C'),
+        a1: u(60, 360, 170, 'Group A-1'),
+        a2: u(260, 360, 170, 'Group A-2'),
+        c1: u(715, 360, 170, 'Group C-1'),
+        // Attached orthogonal connectors: the router draws the org-chart elbows
+        // and the links follow when units are moved around.
+        e1: attach('org', 'a', { mode: ConnectorMode.Orthogonal }),
+        e2: attach('org', 'b', { mode: ConnectorMode.Orthogonal }),
+        e3: attach('org', 'c', { mode: ConnectorMode.Orthogonal }),
+        e4: attach('a', 'a1', { mode: ConnectorMode.Orthogonal }),
+        e5: attach('a', 'a2', { mode: ConnectorMode.Orthogonal }),
+        e6: attach('c', 'c1', { mode: ConnectorMode.Orthogonal }),
     };
 }
-const single = (el) => ({ a: el });
+// ── EDGY dynamic (the relational metamodel, on the facets background) ──
+/**
+ * Background scale (from REF coords to model coords): large enough that the
+ * default-size nodes breathe inside each zone. The background is cropped to
+ * the circles (`cropToCircles`), so its xywh covers CROP × DYN_SCALE.
+ */
+export const DYN_SCALE = 4.8;
+/**
+ * The metamodel itself — the 12 elements and the 24 relations — now lives in
+ * `../metamodel.ts`, so the role vocabulary can DERIVE from it without this
+ * module and that one importing each other. Re-exported here under the names
+ * they have always had: nothing that reads them had to change.
+ */
+export { EDGY_DYNAMIC_NODES, EDGY_DYNAMIC_RELATIONS, } from '../metamodel.js';
+/**
+ * Reference coords → template model coords: the background element sits at
+ * (0,0) and renders the cropped circles box, so a reference point maps to
+ * `(p - CROP.origin) × DYN_SCALE`.
+ */
+export function dynToModel(refX, refY) {
+    return [(refX - CROP.x) * DYN_SCALE, (refY - CROP.y) * DYN_SCALE];
+}
+function dynamic() {
+    const out = {
+        bg: {
+            type: 'edgy',
+            showLabels: false,
+            showPictos: false,
+            cropToCircles: true,
+            // The frame a finding is attributed to. Stamped here and nowhere else in
+            // this template: the background is what makes the board an EDGY board.
+            role: EDGY_ROLE.facets,
+            xywh: `[0,0,${CROP.w * DYN_SCALE},${CROP.h * DYN_SCALE}]`,
+        },
+    };
+    for (const [key, { kind, cx, cy, w, zone }] of Object.entries(EDGY_DYNAMIC_NODES)) {
+        const nw = w ?? NODE_SIZE[kind].w;
+        const nh = NODE_SIZE[kind].h;
+        const [mx, my] = dynToModel(cx, cy);
+        const name = edgyElementLabel(key);
+        out[key] = enode(kind, mx - nw / 2, my - nh / 2, nw, nh, {
+            text: name,
+            fill: EDGY_ZONE_FILL[zone],
+            // The OFFICIAL element, not just its kind: this template IS the
+            // metamodel, so its Purpose is a Purpose and not merely an outcome.
+            role: EDGY_ROLE[key],
+        });
+    }
+    EDGY_DYNAMIC_RELATIONS.forEach(([src, dst, verb, t], i) => {
+        out[`rel${i}`] = {
+            type: 'connector',
+            mode: ConnectorMode.Straight,
+            stroke: NODE_STROKE,
+            strokeWidth: 2,
+            strokeStyle: StrokeStyle.Solid,
+            frontEndpointStyle: PointStyle.None,
+            rearEndpointStyle: PointStyle.None,
+            source: { id: src },
+            target: { id: dst },
+            // The verb, as a ROLE — one per canonical verb, derived from this very
+            // table (`../roles.ts`). Source is the subject and target the object
+            // (`docs/adr/0010` tier 1), which is exactly how the row above reads, so
+            // `edgy.non-canonical-link` finds all 24 of these sentences legal.
+            role: EDGY_VERB_ROLE[verb],
+            // Native connector label: the verb travels with the link. The x/y are
+            // re-centred on the path at the first layout, but the w/h ARE the label
+            // box — size it to the verb so the text lays out on one line. The
+            // distance slides the verb along the link like the reference diagram.
+            text: surfaceText(verb),
+            labelXYWH: edgyVerbLabelXYWH(verb),
+            labelOffset: { distance: t ?? EDGY_RELATION_LABEL_DISTANCE },
+        };
+    });
+    return out;
+}
+const single = (el) => ({
+    a: el,
+});
 const ATTRS = 'width="100%" height="100%" viewBox="0 0 135 80" xmlns="http://www.w3.org/2000/svg"';
 function tpl(name, preview, elements) {
-    return { name, type: 'template', preview, content: makeTemplateSnapshot(elements, name) };
+    return {
+        name,
+        type: 'template',
+        preview,
+        content: makeTemplateSnapshot(elements, name),
+    };
 }
+/** Exported for direct insertion from the EDGY senior toolbar menu. */
+export const edgyDynamicTemplate = tpl('EDGY dynamic', `<svg ${ATTRS}><circle cx="55" cy="34" r="18" fill="#00ea4e" opacity="0.9"/><circle cx="80" cy="34" r="18" fill="#034cee" opacity="0.9"/><circle cx="67" cy="54" r="18" fill="#ff0056" opacity="0.9"/><path d="M55 30 H80 M56 31 L66 52 M79 31 L69 52" stroke="#fff" stroke-width="2"/><rect x="51" y="26" width="8" height="8" fill="#fff"/><circle cx="80" cy="30" r="4" fill="#fff"/><path d="M62 49 h6 l3 3 -3 3 h-6 z" fill="#fff"/></svg>`, dynamic());
 export const edgyTemplateCategory = {
     name: 'EDGY',
     templates: [
@@ -200,8 +442,17 @@ export const edgyTemplateCategory = {
         tpl('Customer journey', `<svg ${ATTRS} fill="none"><path d="M20 24 H110 L122 40 L110 56 H20 Z" fill="#f3a3c0"/><rect x="26" y="30" width="22" height="20" fill="none" stroke="#fff"/><rect x="54" y="30" width="22" height="20" fill="none" stroke="#fff"/><rect x="82" y="30" width="22" height="20" fill="none" stroke="#fff"/></svg>`, journey()),
         tpl('Service blueprint', `<svg ${ATTRS} fill="none"><rect x="8" y="14" width="119" height="16" fill="#fbd5e0"/><rect x="8" y="32" width="119" height="34" fill="#d4e9f8"/><rect x="20" y="18" width="22" height="9" fill="#f5246e" opacity="0.5"/><rect x="20" y="40" width="22" height="9" fill="#2f6ff0" opacity="0.4"/><rect x="60" y="40" width="22" height="9" fill="#2f6ff0" opacity="0.4"/></svg>`, blueprint()),
         tpl('Organisation chart', `<svg ${ATTRS} fill="none"><rect x="52" y="12" width="32" height="14" rx="2" fill="#4fd0ea"/><rect x="14" y="38" width="32" height="14" rx="2" fill="#4fd0ea"/><rect x="52" y="38" width="32" height="14" rx="2" fill="#4fd0ea"/><rect x="90" y="38" width="32" height="14" rx="2" fill="#4fd0ea"/><path d="M68 26 V32 M30 32 H106 M30 32 V38 M68 32 V38 M106 32 V38" stroke="#262626"/></svg>`, orgChart()),
-        tpl('Facets diagram', `<svg ${ATTRS}><circle cx="55" cy="34" r="18" fill="#00ea4e" opacity="0.9"/><circle cx="80" cy="34" r="18" fill="#034cee" opacity="0.9"/><circle cx="67" cy="54" r="18" fill="#ff0056" opacity="0.9"/></svg>`, single({ type: 'edgy', xywh: `[0,0,${REF_W * 1.5},${REF_H * 1.5}]` })),
-        tpl('People', `<svg ${ATTRS} fill="#262626"><circle cx="67" cy="32" r="9" fill="none" stroke="#262626" stroke-width="2.4"/><path d="M50 60 a17 17 0 0 1 34 0" fill="none" stroke="#262626" stroke-width="2.4"/></svg>`, { n: enode('people', 0, 0, 64, 64), l: label(-28, 70, 120, 24, 'People', { fontSize: 16 }) }),
+        tpl('Facets diagram', `<svg ${ATTRS}><circle cx="55" cy="34" r="18" fill="#00ea4e" opacity="0.9"/><circle cx="80" cy="34" r="18" fill="#034cee" opacity="0.9"/><circle cx="67" cy="54" r="18" fill="#ff0056" opacity="0.9"/></svg>`, single({
+            type: 'edgy',
+            cropToCircles: true,
+            role: EDGY_ROLE.facets,
+            xywh: `[0,0,${CROP_LABELED.w * 1.5},${CROP_LABELED.h * 1.5}]`,
+        })),
+        edgyDynamicTemplate,
+        tpl('People', `<svg ${ATTRS} fill="#262626"><circle cx="67" cy="32" r="9" fill="none" stroke="#262626" stroke-width="2.4"/><path d="M50 60 a17 17 0 0 1 34 0" fill="none" stroke="#262626" stroke-width="2.4"/></svg>`, {
+            n: enode('people', 0, 0, 64, 64),
+            l: label(-28, 70, 120, 24, 'People', { fontSize: 16 }),
+        }),
         tpl('Outcome', `<svg ${ATTRS} fill="none"><rect x="20" y="24" width="95" height="34" rx="6" stroke="#262626" stroke-width="2"/></svg>`, single(enode('outcome', 0, 0, 130, 80, { text: 'Outcome' }))),
         tpl('Object', `<svg ${ATTRS} fill="none"><rect x="20" y="24" width="95" height="34" stroke="#262626" stroke-width="2"/></svg>`, single(enode('object', 0, 0, 130, 80, { text: 'Object' }))),
         tpl('Activity', `<svg ${ATTRS} fill="none"><path d="M20 24 H98 L116 41 H116 L98 58 H20 Z" stroke="#262626" stroke-width="2" stroke-linejoin="round"/></svg>`, single(enode('activity', 0, 0, 140, 80, { text: 'Activity' }))),