@formicoidea/labre-framework-edgy 0.40.0 → 0.42.0

package/dist/templates/index.js

@@ -1,10 +1,102 @@
 import { makeTemplateSnapshot, surfaceText, surfaceYMap, templateFromCommand, } from '@formicoidea/labre-core/gfx/template';
 import { ConnectorMode, FontFamily, PointStyle, ShapeStyle, StrokeStyle, TextAlign, } from '@formicoidea/labre-core/model';
 import { NOTATION_NEUTRALS } from '@formicoidea/labre-core/shared/consts';
+import { translateKey, } from '@formicoidea/labre-core/shared/services';
 import { edgyCommands } from '../commands.js';
+import { edgyElementLabel, edgyElementLabelKey, edgyVerbSeedKey, } from '../metamodel.js';
 import { NODE_FILL, NODE_STROKE, NODE_STROKE_WIDTH } from '../node/consts.js';
 import { edgyNodeProps, edgyNodeTextProps } from '../presets.js';
 import { edgyDynamicTemplate } from './dynamic.js';
+/**
+ * The seeds that belong to these four scenes only — a case name, a lane
+ * title, a step counter — and nowhere else in the framework. Declared once so
+ * the builders below and the manifest (`../translations.ts`) read the very
+ * same fallback. The twelve element/zone names and the two verbs these scenes
+ * REUSE (`Organisation`, `Task`, `traverses`…) go through
+ * `edgyElementLabelKey` / `edgyVerbSeedKey` instead — the same key the
+ * metamodel and `templates/dynamic.ts` already write, per "un mot partagé =
+ * une clé".
+ */
+const S = (slug, fallback) => ({
+    key: `com.labre.edgy.seed.${slug}`,
+    fallback,
+});
+/**
+ * The four hand-composed scenes' own tile names — chrome, not seeds: a
+ * `Template.nameKey`, re-resolved every time the panel opens, never written
+ * into a document. None of the four derives from a command.
+ */
+export const EDGY_TEMPLATE_NAME_FACETS_OVERVIEW = [
+    'com.labre.edgy.template.facets-overview',
+    'Facets overview',
+];
+export const EDGY_TEMPLATE_NAME_CUSTOMER_JOURNEY = [
+    'com.labre.edgy.template.customer-journey',
+    'Customer journey',
+];
+export const EDGY_TEMPLATE_NAME_SERVICE_BLUEPRINT = [
+    'com.labre.edgy.template.service-blueprint',
+    'Service blueprint',
+];
+export const EDGY_TEMPLATE_NAME_ORGANISATION_CHART = [
+    'com.labre.edgy.template.organisation-chart',
+    'Organisation chart',
+];
+export const EDGY_TEMPLATE_SEED = {
+    facetsTitle: S('facets-title', 'Facets'),
+    intersectionsTitle: S('intersections-title', 'Intersections'),
+    journeyStep: S('journey-step', 'Journey step {{n}}'),
+    channel: S('channel-n', 'Channel {{n}}'),
+    taskN: S('task-n', 'Task {{n}}'),
+    customer: S('customer', 'Customer'),
+    laneEvidence: S('lane-physical-evidence', 'Physical Evidence'),
+    laneCustomerActions: S('lane-customer-actions', 'Customer Actions'),
+    laneOnstage: S('lane-onstage-actions', 'On-stage Actions'),
+    laneBackstage: S('lane-backstage-actions', 'Back-stage Actions'),
+    laneSupportProcesses: S('lane-support-processes', 'Support Processes'),
+    laneSupportSystems: S('lane-support-systems', 'Support Systems'),
+    admissionForm: S('admission-form', 'Admission Form'),
+    confirmation: S('confirmation', 'Confirmation'),
+    sendForm: S('send-form', 'Send Form'),
+    followStatus: S('follow-status', 'Follow status'),
+    receiveDecision: S('receive-decision', 'Receive decision'),
+    formHandling: S('form-handling', 'Form handling'),
+    customerSupport: S('customer-support', 'Customer support'),
+    contact: S('contact', 'Contact'),
+    customerService: S('customer-service', 'Customer service'),
+    customerFollowUp: S('customer-follow-up', 'Customer follow-up'),
+    processForm: S('process-form', 'Process Form'),
+    decisionAcceptReject: S('decision-accept-reject', 'Decision [Accept|Reject]'),
+    crmApplication: S('crm-application', 'CRM Application'),
+    caseManagement: S('case-management', 'Case Management'),
+    paymentsSystem: S('payments-system', 'Payments System'),
+    businessUnit: S('business-unit', 'Business Unit {{unit}}'),
+    group: S('group', 'Group {{code}}'),
+};
+/**
+ * One seed's resolved text — the host's catalogue when `std` is a real
+ * inserting editor, the English fallback when building the module's own
+ * `content` (no editor exists yet at that point).
+ */
+function seedText(std, def, params) {
+    return std
+        ? translateKey(std, def.key, def.fallback, params)
+        : // No interpolation library at module load: every fallback with a
+            // placeholder is filled by hand here, the same way `translateKey`
+            // fills it internally when a host has no entry for the key.
+            Object.entries(params ?? {}).reduce((text, [name, value]) => text.replace(`{{${name}}}`, String(value)), def.fallback);
+}
+/** One of the twelve element/zone names, shared with the rest of the framework. */
+function elementLabel(std, name) {
+    return seedText(std, {
+        key: edgyElementLabelKey(name),
+        fallback: edgyElementLabel(name),
+    });
+}
+/** One of the metamodel's verbs, shared with `templates/dynamic.ts`. */
+function verbLabel(std, verb) {
+    return seedText(std, { key: edgyVerbSeedKey(verb), fallback: verb });
+}
 /**
  * The EDGY palette — DERIVED from the toolbox, one template per command.
  *
@@ -147,8 +239,9 @@ function attach(src, dst, opts = {}) {
     };
 }
 // ── Facets overview (six facets, sub-cards, facets/intersections) ─────
-function facetsOverview() {
+function facetsOverview(std) {
     const out = {};
+    const el = (name) => elementLabel(std, name);
     const tall = (key, x, name, cards) => {
         const [hdr, sub] = C[key];
         out[`${key}F`] = rect(x, 140, 192, 460, {
@@ -200,39 +293,55 @@ function facetsOverview() {
         });
     };
     // lower facets first (drawn behind the tall ones at the overlaps)
-    low('organisation', 240, 'Organisation');
-    low('product', 664, 'Product');
-    low('brand', 1088, 'Brand');
-    tall('identity', 40, 'Identity', ['Purpose', 'Content', 'Story']);
-    tall('architecture', 464, 'Architecture', ['Capability', 'Asset', 'Process']);
-    tall('experience', 888, 'Experience', ['Task', 'Channel', 'Journey']);
-    out.fLabel = label(464, 80, 192, 28, 'Facets', { fontSize: 18 });
+    low('organisation', 240, el('organisation'));
+    low('product', 664, el('product'));
+    low('brand', 1088, el('brand'));
+    tall('identity', 40, el('identity'), [
+        el('purpose'),
+        el('content'),
+        el('story'),
+    ]);
+    tall('architecture', 464, el('architecture'), [
+        el('capability'),
+        el('asset'),
+        el('process'),
+    ]);
+    tall('experience', 888, el('experience'), [
+        el('task'),
+        el('channel'),
+        el('journey'),
+    ]);
+    out.fLabel = label(464, 80, 192, 28, seedText(std, EDGY_TEMPLATE_SEED.facetsTitle), { fontSize: 18 });
     out.fBar = line(136, 120, 984, 120);
-    out.iLabel = label(664, 740, 192, 28, 'Intersections', { fontSize: 18 });
+    out.iLabel = label(664, 740, 192, 28, seedText(std, EDGY_TEMPLATE_SEED.intersectionsTitle), { fontSize: 18 });
     out.iBar = line(336, 728, 1184, 728);
     return out;
 }
 // ── Customer journey ──────────────────────────────────────────────────
-function journey() {
+function journey(std) {
     const step = (i, x) => enode('activity', x, 132, 224, 116, {
         fill: JOURNEY_PINK,
-        text: `Journey step ${i}`,
+        text: seedText(std, EDGY_TEMPLATE_SEED.journeyStep, { n: i }),
         textColor: '#ffffff',
         fontSize: 18,
     });
     const ch = (x, n) => enode('object', x, 392, 184, 96, {
         fill: JOURNEY_PINK,
-        text: `Channel ${n}`,
+        text: seedText(std, EDGY_TEMPLATE_SEED.channel, { n }),
         fontSize: 16,
     });
     const tk = (x, n) => enode('object', x, 540, 168, 92, {
         fill: JOURNEY_PINK,
-        text: `Task ${n}`,
+        text: seedText(std, EDGY_TEMPLATE_SEED.taskN, { n }),
         fontSize: 16,
     });
+    const traverses = verbLabel(std, 'traverses');
+    const uses = verbLabel(std, 'uses');
     return {
         cust: enode('people', 40, 120, 64, 64, { fill: NODE_FILL }),
-        custL: label(20, 192, 104, 24, 'Customer', { fontSize: 14 }),
+        custL: label(20, 192, 104, 24, seedText(std, EDGY_TEMPLATE_SEED.customer), {
+            fontSize: 14,
+        }),
         // The person and its name travel together, as `createEdgyPeople` writes
         // them. A group is placed AFTER its members: the id middleware remaps
         // `children` against elements it has already seen.
@@ -255,7 +364,7 @@ function journey() {
             roughness: 0,
             xywh: '[150,108,860,164]',
         },
-        bandL: label(170, 116, 120, 24, 'Journey', {
+        bandL: label(170, 116, 120, 24, elementLabel(std, 'journey'), {
             color: '#ffffff',
             fontSize: 16,
             align: TextAlign.Left,
@@ -264,7 +373,7 @@ function journey() {
         s2: step(2, 500),
         s3: step(3, 760),
         rightTask: enode('object', 1060, 132, 168, 92, {
-            text: 'Task',
+            text: elementLabel(std, 'task'),
             fontSize: 16,
         }),
         c1: ch(258, 'X'),
@@ -273,27 +382,27 @@ function journey() {
         t1: tk(266, 'A'),
         t2: tk(526, 'B'),
         t3: tk(786, 'C'),
-        trav1: label(258, 350, 184, 20, 'traverses', {
+        trav1: label(258, 350, 184, 20, traverses, {
             fontSize: 13,
             color: NOTATION_NEUTRALS.label,
         }),
-        trav2: label(518, 350, 184, 20, 'traverses', {
+        trav2: label(518, 350, 184, 20, traverses, {
             fontSize: 13,
             color: NOTATION_NEUTRALS.label,
         }),
-        trav3: label(778, 350, 184, 20, 'traverses', {
+        trav3: label(778, 350, 184, 20, traverses, {
             fontSize: 13,
             color: NOTATION_NEUTRALS.label,
         }),
-        use1: label(258, 504, 184, 20, 'uses', {
+        use1: label(258, 504, 184, 20, uses, {
             fontSize: 13,
             color: NOTATION_NEUTRALS.label,
         }),
-        use2: label(518, 504, 184, 20, 'uses', {
+        use2: label(518, 504, 184, 20, uses, {
             fontSize: 13,
             color: NOTATION_NEUTRALS.label,
         }),
-        use3: label(778, 504, 184, 20, 'uses', {
+        use3: label(778, 504, 184, 20, uses, {
             fontSize: 13,
             color: NOTATION_NEUTRALS.label,
         }),
@@ -306,14 +415,14 @@ function journey() {
     };
 }
 // ── Service blueprint (six swimlanes) ─────────────────────────────────
-function blueprint() {
+function blueprint(std) {
     const lanes = [
-        'Physical Evidence',
-        'Customer Actions',
-        'On-stage Actions',
-        'Back-stage Actions',
-        'Support Processes',
-        'Support Systems',
+        seedText(std, EDGY_TEMPLATE_SEED.laneEvidence),
+        seedText(std, EDGY_TEMPLATE_SEED.laneCustomerActions),
+        seedText(std, EDGY_TEMPLATE_SEED.laneOnstage),
+        seedText(std, EDGY_TEMPLATE_SEED.laneBackstage),
+        seedText(std, EDGY_TEMPLATE_SEED.laneSupportProcesses),
+        seedText(std, EDGY_TEMPLATE_SEED.laneSupportSystems),
     ];
     const laneFill = [
         '#fdeef2',
@@ -340,21 +449,25 @@ function blueprint() {
     const box = (x, y, fill, t) => enode('object', x, y, 200, 60, { fill, text: t, fontSize: 14 });
     const P = C.experience[1], B = C.architecture[1];
     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'),
+        af: rect(280, 64, 220, 70, {
+            text: seedText(std, EDGY_TEMPLATE_SEED.admissionForm),
+        }),
+        cf: rect(1010, 64, 220, 70, {
+            text: seedText(std, EDGY_TEMPLATE_SEED.confirmation),
+        }),
+        sf: chev(280, 214, P, seedText(std, EDGY_TEMPLATE_SEED.sendForm)),
+        fs: chev(600, 214, P, seedText(std, EDGY_TEMPLATE_SEED.followStatus)),
+        rd: chev(1010, 214, P, seedText(std, EDGY_TEMPLATE_SEED.receiveDecision)),
+        fh: chev(280, 364, B, seedText(std, EDGY_TEMPLATE_SEED.formHandling)),
+        cs: chev(600, 364, B, seedText(std, EDGY_TEMPLATE_SEED.customerSupport)),
+        ct: chev(1010, 364, B, seedText(std, EDGY_TEMPLATE_SEED.contact)),
+        csv: chev(280, 514, B, seedText(std, EDGY_TEMPLATE_SEED.customerService)),
+        cfu: box(1010, 514, B, seedText(std, EDGY_TEMPLATE_SEED.customerFollowUp)),
+        pf: chev(600, 664, B, seedText(std, EDGY_TEMPLATE_SEED.processForm)),
+        dec: chev(900, 664, B, seedText(std, EDGY_TEMPLATE_SEED.decisionAcceptReject)),
+        crm: box(280, 814, B, seedText(std, EDGY_TEMPLATE_SEED.crmApplication)),
+        cms: box(600, 814, B, seedText(std, EDGY_TEMPLATE_SEED.caseManagement)),
+        pay: box(900, 814, B, seedText(std, EDGY_TEMPLATE_SEED.paymentsSystem)),
         a1: attach('af', 'sf', { arrow: true }),
         a2: attach('sf', 'fs', { arrow: true }),
         a3: attach('fs', 'rd', { arrow: true }),
@@ -367,17 +480,19 @@ function blueprint() {
     return out;
 }
 // ── Organisation chart ────────────────────────────────────────────────
-function orgChart() {
+function orgChart(std) {
     const cyan = C.organisation[0];
     const u = (x, y, w, t) => enode('object', x, y, w, 64, { fill: cyan, text: t, fontSize: 16 });
+    const businessUnit = (unit) => seedText(std, EDGY_TEMPLATE_SEED.businessUnit, { unit });
+    const group = (code) => seedText(std, EDGY_TEMPLATE_SEED.group, { code });
     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'),
+        org: u(420, 40, 180, elementLabel(std, 'organisation')),
+        a: u(120, 200, 200, businessUnit('A')),
+        b: u(410, 200, 200, businessUnit('B')),
+        c: u(700, 200, 200, businessUnit('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 }),
@@ -397,26 +512,46 @@ function orgChart() {
 export { EDGY_DYNAMIC_NODES, EDGY_DYNAMIC_RELATIONS, } from '../metamodel.js';
 export { DYN_SCALE, dynToModel, edgyDynamicTemplate } from './dynamic.js';
 const ATTRS = 'width="100%" height="100%" viewBox="0 0 135 80" xmlns="http://www.w3.org/2000/svg"';
-/** A hand-composed template — what is left once the artefacts are derived. */
-function tpl(name, preview, elements) {
+/**
+ * A hand-composed template — what is left once the artefacts are derived.
+ *
+ * `build` takes the OPTIONAL inserting editor: called with none, at module
+ * load, for the English `content`; called again with the real `std` as
+ * {@link Template.localize}, so the two builds read the very same layout and
+ * differ only in the words a seed resolves to (`docs/adr/0023`).
+ */
+function tpl(name, preview, build, nameKey) {
     return {
         name,
         type: 'template',
         preview,
-        content: makeTemplateSnapshot(elements, name),
+        nameKey,
+        content: makeTemplateSnapshot(build(), name),
+        localize: std => makeTemplateSnapshot(build(std), name),
     };
 }
 export const edgyTemplateCategory = {
     name: 'EDGY',
+    // Reuses the senior button's own key — see `TemplateCategory.nameKey`.
+    nameKey: 'com.labre.framework.edgy',
     templates: [
-        tpl('Facets overview', `<svg ${ATTRS} fill="none"><rect x="6" y="20" width="18" height="46" rx="3" fill="#1ec873"/><rect x="46" y="20" width="18" height="46" rx="3" fill="#2f6ff0"/><rect x="86" y="20" width="18" height="46" rx="3" fill="#f5246e"/><rect x="26" y="30" width="18" height="40" rx="3" fill="#4fd0ea"/><rect x="66" y="30" width="18" height="40" rx="3" fill="#cf8cff"/><rect x="106" y="30" width="18" height="40" rx="3" fill="#eeba51"/></svg>`, facetsOverview()),
-        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="${NODE_STROKE}"/></svg>`, orgChart()),
+        tpl('Facets overview', `<svg ${ATTRS} fill="none"><rect x="6" y="20" width="18" height="46" rx="3" fill="#1ec873"/><rect x="46" y="20" width="18" height="46" rx="3" fill="#2f6ff0"/><rect x="86" y="20" width="18" height="46" rx="3" fill="#f5246e"/><rect x="26" y="30" width="18" height="40" rx="3" fill="#4fd0ea"/><rect x="66" y="30" width="18" height="40" rx="3" fill="#cf8cff"/><rect x="106" y="30" width="18" height="40" rx="3" fill="#eeba51"/></svg>`, facetsOverview, EDGY_TEMPLATE_NAME_FACETS_OVERVIEW[0]),
+        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, EDGY_TEMPLATE_NAME_CUSTOMER_JOURNEY[0]),
+        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, EDGY_TEMPLATE_NAME_SERVICE_BLUEPRINT[0]),
+        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="${NODE_STROKE}"/></svg>`, orgChart, EDGY_TEMPLATE_NAME_ORGANISATION_CHART[0]),
+        // Kept: `addFacets`'s own label is "Enterprise Design facets" (the senior
+        // sub-menu's wording), and this tile's tooltip has always said the
+        // shorter "Facets diagram". `resolveTemplateName` still resolves it
+        // through the command's `labelKey`, with THIS literal (not the command's)
+        // as the fallback, so the tile keeps its own English wording with no
+        // catalogue.
         templateFromCommand(byId('edgy.addFacets'), `<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>`, 'Facets diagram'),
         edgyDynamicTemplate,
         // The blank board had no template at all until the palette was derived —
         // the coverage test is what said so.
+        //
+        // Kept, same reason as `addFacets` above: `addBoard`'s own label spells
+        // out "(hover spotlight)", which this tile's tooltip never has.
         templateFromCommand(byId('edgy.addBoard'), `<svg ${ATTRS} fill="none"><rect x="8" y="9" width="119" height="62" rx="8" fill="${NOTATION_NEUTRALS.cardFill}" stroke="${NOTATION_NEUTRALS.cardBorder}" stroke-width="2"/><path d="M52 30 H84 M53 31 L66 58 M83 31 L70 58" stroke="${NODE_STROKE}" stroke-width="1.4"/><rect x="48" y="26" width="9" height="9" fill="#00ea4e"/><circle cx="84" cy="30" r="4.5" fill="#034cee"/><path d="M61 54 h8 l4 4 -4 4 h-8 z" fill="#ff0056"/></svg>`, 'EDGY board'),
         templateFromCommand(byId('edgy.addPeople'), `<svg ${ATTRS} fill="${NODE_STROKE}"><circle cx="67" cy="32" r="9" fill="none" stroke="${NODE_STROKE}" stroke-width="2.4"/><path d="M50 60 a17 17 0 0 1 34 0" fill="none" stroke="${NODE_STROKE}" stroke-width="2.4"/></svg>`),
         templateFromCommand(byId('edgy.addOutcome'), `<svg ${ATTRS} fill="none"><rect x="20" y="24" width="95" height="34" rx="6" stroke="${NODE_STROKE}" stroke-width="2"/></svg>`),

package/dist/toolbar/config.d.ts

@@ -1,5 +1,7 @@
-import { type ChromeWording, type ToolbarContext } from '@formicoidea/labre-core/shared/services';
+import { type ChromeWording, type ToolbarContext, type ToolbarModuleConfig } from '@formicoidea/labre-core/shared/services';
 import { type TemplateResult } from 'lit';
+/** Every wording above, for `translations.ts`'s manifest contribution. */
+export declare const EDGY_TOOLBAR_WORDINGS: readonly ChromeWording[];
 export declare const edgyToolbarConfig: {
     readonly actions: [{
         id: string;
@@ -15,11 +17,6 @@ export declare const edgyToolbarConfig: {
         icon: TemplateResult;
         active(ctx: ToolbarContext): boolean;
         run(ctx: ToolbarContext): void;
-    }, {
-        id: string;
-        tooltipWording: ChromeWording;
-        icon: TemplateResult<1>;
-        run(ctx: ToolbarContext): void;
     }];
     readonly when: (ctx: ToolbarContext) => boolean;
 };
@@ -39,12 +36,11 @@ export declare const edgyBoardToolbarConfig: {
         icon: TemplateResult;
         active(ctx: ToolbarContext): boolean;
         run(ctx: ToolbarContext): void;
-    }, {
-        id: string;
-        tooltipWording: ChromeWording;
-        icon: TemplateResult<1>;
-        run(ctx: ToolbarContext): void;
     }];
     readonly when: (ctx: ToolbarContext) => boolean;
 };
 export declare const edgyBoardToolbarExtension: import("@formicoidea/labre-core/store").ExtensionType;
+export declare const edgyToolingToolbarConfig: ToolbarModuleConfig;
+export declare const edgyBoardToolingToolbarConfig: ToolbarModuleConfig;
+export declare const edgyToolingToolbarExtension: import("@formicoidea/labre-core/store").ExtensionType;
+export declare const edgyBoardToolingToolbarExtension: import("@formicoidea/labre-core/store").ExtensionType;

package/dist/toolbar/config.js

@@ -1,10 +1,22 @@
-import { EdgelessCRUDIdentifier } from '@formicoidea/labre-core/blocks/surface';
-import { createAutoLegend, dddLegendIcon } from '@formicoidea/labre-ddd-shared';
+import { EdgelessCRUDIdentifier, legendToolbarAction, validationToolbarConfig, } from '@formicoidea/labre-core/blocks/surface';
 import { EdgyBoardElementModel, EdgyFacetsElementModel, } from '@formicoidea/labre-core/model';
-import { BOARD_LEGEND_NOTATION, BOARD_RESIZE_TOGGLE, TelemetryProvider, ToolbarModuleExtension, } from '@formicoidea/labre-core/shared/services';
+import { BOARD_RESIZE_TOGGLE, ToolbarModuleExtension, } from '@formicoidea/labre-core/shared/services';
 import { BlockFlavourIdentifier } from '@formicoidea/labre-core/std';
 import { html } from 'lit';
-import { EDGY_AUTO_LEGEND } from '../legend.js';
+/** The two toolbar tooltips this file used to hard-code as English literals. */
+const FACET_LABELS_TOGGLE = [
+    'com.labre.edgy.toolbar.facet-labels',
+    'Show / hide facet labels',
+];
+const HOVER_SPOTLIGHT_TOGGLE = [
+    'com.labre.edgy.toolbar.hover-spotlight',
+    'Enable / disable hover spotlight',
+];
+/** Every wording above, for `translations.ts`'s manifest contribution. */
+export const EDGY_TOOLBAR_WORDINGS = [
+    FACET_LABELS_TOGGLE,
+    HOVER_SPOTLIGHT_TOGGLE,
+];
 const ResizeIcon = html `<svg
   width="24"
   height="24"
@@ -82,46 +94,12 @@ function booleanToggle(Model, id, tooltip, icon, prop) {
         },
     };
 }
-/**
- * The legend action, shared by the two EDGY backgrounds: both frame the same
- * notation, so both answer the same question — "what is actually drawn here" —
- * with the same table ({@link EDGY_AUTO_LEGEND}) and the same box.
- *
- * Registered ALWAYS-ON (`EdgyRenderViewExtension`) with the toggles it sits
- * next to: a legend is real, editable elements written into the document, so
- * generating one is authoring, not tooling a flag may take away
- * (`docs/adr/0009`).
- */
-function legendAction(Model, id) {
-    return {
-        id,
-        tooltipWording: BOARD_LEGEND_NOTATION,
-        icon: dddLegendIcon,
-        run(ctx) {
-            const background = ctx.getSurfaceModelsByType(Model)[0];
-            if (!background)
-                return;
-            createAutoLegend(ctx.std, background, EDGY_AUTO_LEGEND);
-            ctx.std.getOptional(TelemetryProvider)?.track('FrameworkLegendCreated', {
-                // The WIRE value from `frameworks.ts` (`telemetryKey`), which for EDGY
-                // happens to be the module id itself. Same field set as Wardley's and
-                // the three DDD legend buttons, so the four are comparable.
-                framework: 'edgy',
-                element: 'legend',
-                page: 'whiteboard editor',
-                segment: 'element toolbar',
-                module: 'edgy toolbar',
-            });
-        },
-    };
-}
 export const edgyToolbarConfig = {
     actions: [
         booleanToggle(EdgyFacetsElementModel, 'a.toggle-resize', BOARD_RESIZE_TOGGLE, ResizeIcon, 'resizeEnabled'),
-        booleanToggle(EdgyFacetsElementModel, 'b.toggle-labels', 'Show / hide facet labels', LabelsIcon, 'showLabels'),
+        booleanToggle(EdgyFacetsElementModel, 'b.toggle-labels', FACET_LABELS_TOGGLE, LabelsIcon, 'showLabels'),
         // No spotlight toggle here: the hover spotlight is BOARD logic and lives on
         // the EDGY board toolbar below. The Venn only carries APPEARANCE (#195).
-        legendAction(EdgyFacetsElementModel, 'c.legend'),
     ],
     when: ctx => ctx.getSurfaceModelsByType(EdgyFacetsElementModel).length > 0,
 };
@@ -132,8 +110,7 @@ export const edgyToolbarExtension = ToolbarModuleExtension({
 export const edgyBoardToolbarConfig = {
     actions: [
         booleanToggle(EdgyBoardElementModel, 'a.toggle-resize', BOARD_RESIZE_TOGGLE, ResizeIcon, 'resizeEnabled'),
-        booleanToggle(EdgyBoardElementModel, 'b.toggle-spotlight', 'Enable / disable hover spotlight', SpotlightIcon, 'spotlightEnabled'),
-        legendAction(EdgyBoardElementModel, 'c.legend'),
+        booleanToggle(EdgyBoardElementModel, 'b.toggle-spotlight', HOVER_SPOTLIGHT_TOGGLE, SpotlightIcon, 'spotlightEnabled'),
     ],
     when: ctx => ctx.getSurfaceModelsByType(EdgyBoardElementModel).length > 0,
 };
@@ -141,3 +118,55 @@ export const edgyBoardToolbarExtension = ToolbarModuleExtension({
     id: BlockFlavourIdentifier('affine:surface:edgyBoard'),
     config: edgyBoardToolbarConfig,
 });
+/**
+ * A background's flag-gated row, WHOLE: the legend button and the Validation
+ * dropdown, in ONE module — registered by `EdgyViewExtension` on the `custom:`
+ * flavour slot of each of the two frames.
+ *
+ * ## Why one module and not two
+ *
+ * `renderToolbar` merges exactly four slots per element and
+ * `ToolbarModuleExtension` binds by DI variant, so a second module claiming
+ * `custom:affine:surface:edgy` throws `DuplicateServiceDefinitionError` before
+ * the editor finishes setting up. The always-on module above holds the
+ * APPEARANCE toggles a stored board must keep; these two entries are gated by
+ * the same flag and appear together or not at all.
+ *
+ * ## Why the legend moved out of the always-on half
+ *
+ * It used to sit with the toggles, argued as authoring. `docs/adr/0026` (which
+ * amends `docs/adr/0009`) reverses that reading: GENERATING a legend is
+ * tooling — it is the framework telling you what its notation means — while the
+ * legend it wrote is content, made of plain shapes, text and this pack's own
+ * always-on renderers, and keeps being painted with the flag off.
+ *
+ * `c.legend` and not the factory's default `b.`: the sort is lexicographic and
+ * both frames already spend `a.` and `b.` on their toggles.
+ */
+function toolingConfig(Model) {
+    return {
+        actions: [
+            legendToolbarAction({
+                id: 'c.legend',
+                Model,
+                owner: 'edgy',
+                framework: 'edgy',
+            }),
+            // The generic dropdown, not an EDGY variant of it: the config names no
+            // framework — it reads the registered rules and profiles — so this is the
+            // very same object wardley, bpmn, the context map and C4 register.
+            ...validationToolbarConfig.actions,
+        ],
+        when: (ctx) => ctx.getSurfaceModelsByType(Model).length > 0,
+    };
+}
+export const edgyToolingToolbarConfig = toolingConfig(EdgyFacetsElementModel);
+export const edgyBoardToolingToolbarConfig = toolingConfig(EdgyBoardElementModel);
+export const edgyToolingToolbarExtension = ToolbarModuleExtension({
+    id: BlockFlavourIdentifier('custom:affine:surface:edgy'),
+    config: edgyToolingToolbarConfig,
+});
+export const edgyBoardToolingToolbarExtension = ToolbarModuleExtension({
+    id: BlockFlavourIdentifier('custom:affine:surface:edgyBoard'),
+    config: edgyBoardToolingToolbarConfig,
+});

package/dist/toolbar/edgy-senior-button.d.ts

@@ -10,6 +10,8 @@ export declare class EdgelessEdgySeniorButton extends EdgelessEdgySeniorButton_b
     enableActiveBackground: boolean;
     type: typeof EmptyTool;
     private _toggleMenu;
+    /** Lit while one of THIS framework's artefacts is armed. See the Wardley one. */
+    private get _armed();
     render(): import("lit-html").TemplateResult<1>;
 }
 export {};

package/dist/toolbar/edgy-senior-button.js

@@ -1,7 +1,7 @@
 import { DefaultTool } from '@formicoidea/labre-core/blocks/surface';
 import { EmptyTool } from '@formicoidea/labre-core/gfx/pointer';
 import { translateKey } from '@formicoidea/labre-core/shared/services';
-import { EdgelessToolbarToolMixin } from '@formicoidea/labre-core/widgets/edgeless-toolbar';
+import { armedArtefact, EdgelessToolbarToolMixin, } from '@formicoidea/labre-core/widgets/edgeless-toolbar';
 import { SignalWatcher } from '@formicoidea/labre-core/global/lit';
 import { css, html, LitElement } from 'lit';
 import { edgyToolbarIcon } from './icons.js';
@@ -72,6 +72,10 @@ export class EdgelessEdgySeniorButton extends EdgelessToolbarToolMixin(SignalWat
         const menu = this.createPopper('edgeless-edgy-menu', this);
         menu.element.edgeless = this.edgeless;
     }
+    /** Lit while one of THIS framework's artefacts is armed. See the Wardley one. */
+    get _armed() {
+        return armedArtefact(this.gfx)?.owner === 'edgy';
+    }
     render() {
         return html `<edgeless-toolbar-button
       class="edgy-button"
@@ -79,7 +83,7 @@ export class EdgelessEdgySeniorButton extends EdgelessToolbarToolMixin(SignalWat
             ? ''
             : translateKey(this.edgeless.std, 'com.labre.framework.edgy', 'EDGY')}
       .tooltipOffset=${4}
-      .active=${!!this.popper}
+      .active=${!!this.popper || this._armed}
       @click=${this._toggleMenu}
     >
       <div class="edgy-root">

package/dist/toolbar/node-config.d.ts

@@ -1 +1,40 @@
+import type { FrameworkPalette, NamedPalette } from '@formicoidea/labre-core/components/color-picker';
+import { type ChromeWording } from '@formicoidea/labre-core/shared/services';
+/**
+ * The twelve EDGY swatches' own names, resolved by `resolvePaletteLabel`
+ * (`@labre/affine-components/color-picker`) through each swatch's own
+ * {@link NamedPalette.labelWording} — see Wardley's own
+ * `WARDLEY_PALETTE_WORDINGS` (`../../wardley/src/toolbar/node-config.ts`)
+ * for the same mechanism applied to a sibling framework; the two never
+ * import each other.
+ *
+ * Exported so `../translations.ts` can list them in the manifest under
+ * source `chrome`.
+ */
+export declare const EDGY_PALETTE_WORDING_IDENTITY: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_ARCHITECTURE: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_EXPERIENCE: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_ORGANISATION: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_BRAND: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_PRODUCT: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_IDENTITY_LIGHT: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_ARCHITECTURE_LIGHT: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_EXPERIENCE_LIGHT: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_ORGANISATION_LIGHT: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_BRAND_LIGHT: ChromeWording;
+export declare const EDGY_PALETTE_WORDING_PRODUCT_LIGHT: ChromeWording;
+export declare const EDGY_PALETTE_WORDINGS: readonly ChromeWording[];
+/**
+ * From the default editor palette we keep ONLY the neutrals (greys, white,
+ * black, transparent) — the historical colours are dropped in favour of the
+ * EDGY swatches above.
+ */
+export declare const EDGY_PALETTE_LIST: NamedPalette[];
+/**
+ * EDGY's page of the colour pickers' carousel (`docs/adr/0027`) — the same
+ * list its node picker is seeded with, offered on every other picker too.
+ * Registered from the FLAG-GATED view extension: offering hues is tooling
+ * (`docs/adr/0009`).
+ */
+export declare const EDGY_FRAMEWORK_PALETTE: FrameworkPalette;
 export declare const edgyNodeToolbarExtension: import("@formicoidea/labre-core/store").ExtensionType;