@formicoidea/labre-framework-wardley 0.39.3 → 0.41.0

package/dist/toolbar/icons.js

@@ -1,4 +1,5 @@
 import { svg } from 'lit';
+import { NODE_FILL, NODE_STROKE } from '../node/consts.js';
 /** Colored Wardley glyph (mockup proposal B) for the main toolbar button. */
 export const wardleyToolbarIcon = svg `<svg width="100%" height="100%" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
   <defs>
@@ -36,19 +37,19 @@ const RED = '#d6455d';
 const GREEN = '#1f9e4d';
 /** Component node (validated COMP-C2): single circle. */
 export const wardleyComponentIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <circle cx="12" cy="12" r="6.3" fill="#fff" stroke="currentColor" stroke-width="1.5"/>
+  <circle cx="12" cy="12" r="6.3" fill="${NODE_FILL}" stroke="currentColor" stroke-width="1.5"/>
 </svg>`;
 /** Anchor (validated ANCH-B): person glyph inscribed in a circle. */
 export const wardleyAnchorIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <circle cx="12" cy="12" r="6" fill="#fff" stroke="currentColor" stroke-width="1.6"/>
+  <circle cx="12" cy="12" r="6" fill="${NODE_FILL}" stroke="currentColor" stroke-width="1.6"/>
   <circle cx="12" cy="9.4" r="1.8" fill="none" stroke="currentColor" stroke-width="1.3"/>
   <path d="M7.4 15.9 C 8.2 12.1, 15.8 12.1, 16.6 15.9" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round"/>
 </svg>`;
 /** Dependency link (validated LINK-A3): two outline nodes joined by a line. */
 export const wardleyLinkIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
   <line x1="5.5" y1="16" x2="18.5" y2="8" stroke="currentColor" stroke-width="1.8"/>
-  <circle cx="5.5" cy="16" r="2.2" fill="#fff" stroke="currentColor" stroke-width="1.5"/>
-  <circle cx="18.5" cy="8" r="2.2" fill="#fff" stroke="currentColor" stroke-width="1.5"/>
+  <circle cx="5.5" cy="16" r="2.2" fill="${NODE_FILL}" stroke="currentColor" stroke-width="1.5"/>
+  <circle cx="18.5" cy="8" r="2.2" fill="${NODE_FILL}" stroke="currentColor" stroke-width="1.5"/>
 </svg>`;
 /** Evolution arrow (validated ARR-B): red dashed arrow. */
 export const wardleyArrowIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -63,21 +64,21 @@ export const wardleyInertiaIcon = svg `<svg width="24" height="24" viewBox="0 0
 </svg>`;
 /** Pipeline (validated PIPE-D): wide thin rect + square handle astride the top edge, thin borders. */
 export const wardleyPipelineIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <rect x="3.5" y="11" width="17" height="7" rx="1" fill="#fff" stroke="currentColor" stroke-width="1.2"/>
-  <rect x="10" y="9" width="4" height="4" rx="0.6" fill="#fff" stroke="currentColor" stroke-width="1.2"/>
+  <rect x="3.5" y="11" width="17" height="7" rx="1" fill="${NODE_FILL}" stroke="currentColor" stroke-width="1.2"/>
+  <rect x="10" y="9" width="4" height="4" rx="0.6" fill="${NODE_FILL}" stroke="currentColor" stroke-width="1.2"/>
 </svg>`;
 /** Market (validated MKT-B): thin outer circle + 3 thick-bordered nodes wired in a triangle. */
 export const wardleyMarketIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <circle cx="12" cy="12" r="9.6" fill="#fff" stroke="currentColor" stroke-width="1.2"/>
+  <circle cx="12" cy="12" r="9.6" fill="${NODE_FILL}" stroke="currentColor" stroke-width="1.2"/>
   <path d="M12 6.6 L7.3 14.7 H16.7 Z" fill="none" stroke="currentColor" stroke-width="1.1"/>
-  <circle cx="12" cy="6.6" r="2.3" fill="#fff" stroke="currentColor" stroke-width="2.1"/>
-  <circle cx="7.3" cy="14.7" r="2.3" fill="#fff" stroke="currentColor" stroke-width="2.1"/>
-  <circle cx="16.7" cy="14.7" r="2.3" fill="#fff" stroke="currentColor" stroke-width="2.1"/>
+  <circle cx="12" cy="6.6" r="2.3" fill="${NODE_FILL}" stroke="currentColor" stroke-width="2.1"/>
+  <circle cx="7.3" cy="14.7" r="2.3" fill="${NODE_FILL}" stroke="currentColor" stroke-width="2.1"/>
+  <circle cx="16.7" cy="14.7" r="2.3" fill="${NODE_FILL}" stroke="currentColor" stroke-width="2.1"/>
 </svg>`;
 /** Ecosystem (validated ECO-A): double border at the rim + hatching confined to the inner donut + hollow center. */
 export const wardleyEcosystemIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
   <defs><clipPath id="ecoHatch"><path d="M12 3.8 a8.2 8.2 0 1 0 0.001 0 Z M12 7.8 a4.2 4.2 0 1 1 -0.001 0 Z" clip-rule="evenodd"/></clipPath></defs>
-  <circle cx="12" cy="12" r="9.8" fill="#fff" stroke="currentColor" stroke-width="1.2"/>
+  <circle cx="12" cy="12" r="9.8" fill="${NODE_FILL}" stroke="currentColor" stroke-width="1.2"/>
   <g clip-path="url(#ecoHatch)" stroke="currentColor" stroke-width="0.6">
     <line x1="2" y1="-8" x2="22" y2="12"/>
     <line x1="2" y1="-6" x2="22" y2="14"/>
@@ -91,12 +92,12 @@ export const wardleyEcosystemIcon = svg `<svg width="24" height="24" viewBox="0
     <line x1="2" y1="10" x2="22" y2="30"/>
   </g>
   <circle cx="12" cy="12" r="8.5" fill="none" stroke="currentColor" stroke-width="0.8"/>
-  <circle cx="12" cy="12" r="4.2" fill="#fff" stroke="currentColor" stroke-width="1"/>
+  <circle cx="12" cy="12" r="4.2" fill="${NODE_FILL}" stroke="currentColor" stroke-width="1"/>
 </svg>`;
 /** Component + method (validated METH-A): component inscribed in a colored outer circle (default grey). */
 export const wardleyMethodIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <circle cx="12" cy="12" r="9.6" fill="#d9d9d9" stroke="#1f2328" stroke-width="1.2"/>
-  <circle cx="12" cy="12" r="4.6" fill="#fff" stroke="#1f2328" stroke-width="1.2"/>
+  <circle cx="12" cy="12" r="9.6" fill="#d9d9d9" stroke="${NODE_STROKE}" stroke-width="1.2"/>
+  <circle cx="12" cy="12" r="4.6" fill="${NODE_FILL}" stroke="${NODE_STROKE}" stroke-width="1.2"/>
 </svg>`;
 /**
  * Porter's forces: a lettered circle pressed on from the four cardinal
@@ -108,7 +109,7 @@ export const wardleyMethodIcon = svg `<svg width="24" height="24" viewBox="0 0 2
  * 24 pixels. The circle keeps `currentColor` like every other artefact glyph.
  */
 export const wardleyPorterIcon = svg `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <circle cx="12" cy="12" r="5.4" fill="#fff" stroke="currentColor" stroke-width="1.3"/>
+  <circle cx="12" cy="12" r="5.4" fill="${NODE_FILL}" stroke="currentColor" stroke-width="1.3"/>
   <g stroke="${RED}" stroke-width="1.4" stroke-linecap="round">
     <line x1="12" y1="6" x2="12" y2="3.4"/>
     <line x1="18" y1="12" x2="20.6" y2="12"/>

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

@@ -1,4 +1,6 @@
-import { type Color, type Palette, type ShapeElementModel } from '@formicoidea/labre-core/model';
+import type { NamedPalette } from '@formicoidea/labre-core/components/color-picker';
+import { type Color, type ShapeElementModel } from '@formicoidea/labre-core/model';
+import { type ChromeWording } from '@formicoidea/labre-core/shared/services';
 /**
  * What a picked swatch WRITES on a Wardley node.
  *
@@ -13,9 +15,31 @@ import { type Color, type Palette, type ShapeElementModel } from '@formicoidea/l
  * (`--affine-…`) is not a hex at all and must reach the document intact.
  */
 export declare function wardleyFillColor(model: ShapeElementModel, value: Color): Color;
+/**
+ * The nine Wardley swatches' own names, resolved by `resolvePaletteLabel`
+ * (`@labre/affine-components/color-picker`) through each swatch's own
+ * {@link NamedPalette.labelWording} — the framework-agnostic mechanism a
+ * gfx module uses to name a palette without touching `Palette`
+ * (`packages/affine/model`, RED ZONE) or importing another framework.
+ *
+ * Exported so `../translations.ts` can list them in the manifest under
+ * source `chrome`, the same treatment `WARDLEY_TOOLBAR_WORDINGS` already
+ * gets — a swatch's name is toolbar chrome, re-rendered on every locale
+ * switch, never seeded into a document.
+ */
+export declare const WARDLEY_PALETTE_WORDING_WONDER: ChromeWording;
+export declare const WARDLEY_PALETTE_WORDING_PEACE: ChromeWording;
+export declare const WARDLEY_PALETTE_WORDING_WAR: ChromeWording;
+export declare const WARDLEY_PALETTE_WORDING_WONDER_LIGHT: ChromeWording;
+export declare const WARDLEY_PALETTE_WORDING_PEACE_LIGHT: ChromeWording;
+export declare const WARDLEY_PALETTE_WORDING_WAR_LIGHT: ChromeWording;
+export declare const WARDLEY_PALETTE_WORDING_RED: ChromeWording;
+export declare const WARDLEY_PALETTE_WORDING_INERTIA: ChromeWording;
+export declare const WARDLEY_PALETTE_WORDING_METHOD_GREY: ChromeWording;
+export declare const WARDLEY_PALETTE_WORDINGS: readonly ChromeWording[];
 /**
  * From the default editor palette we keep ONLY the neutrals — the historical
  * colours are dropped in favour of the Wardley swatches above.
  */
-export declare const WARDLEY_PALETTE_LIST: Palette[];
+export declare const WARDLEY_PALETTE_LIST: NamedPalette[];
 export declare const wardleyNodeToolbarExtension: import("@formicoidea/labre-core/store").ExtensionType;

package/dist/toolbar/node-config.js

@@ -29,6 +29,65 @@ export function wardleyFillColor(model, value) {
         return value;
     return `${value}${AREA_ALPHA}`;
 }
+/**
+ * The nine Wardley swatches' own names, resolved by `resolvePaletteLabel`
+ * (`@labre/affine-components/color-picker`) through each swatch's own
+ * {@link NamedPalette.labelWording} — the framework-agnostic mechanism a
+ * gfx module uses to name a palette without touching `Palette`
+ * (`packages/affine/model`, RED ZONE) or importing another framework.
+ *
+ * Exported so `../translations.ts` can list them in the manifest under
+ * source `chrome`, the same treatment `WARDLEY_TOOLBAR_WORDINGS` already
+ * gets — a swatch's name is toolbar chrome, re-rendered on every locale
+ * switch, never seeded into a document.
+ */
+export const WARDLEY_PALETTE_WORDING_WONDER = [
+    'com.labre.wardley.palette.wonder',
+    'Wonder',
+];
+export const WARDLEY_PALETTE_WORDING_PEACE = [
+    'com.labre.wardley.palette.peace',
+    'Peace',
+];
+export const WARDLEY_PALETTE_WORDING_WAR = [
+    'com.labre.wardley.palette.war',
+    'War',
+];
+export const WARDLEY_PALETTE_WORDING_WONDER_LIGHT = [
+    'com.labre.wardley.palette.wonder-light',
+    'Wonder light',
+];
+export const WARDLEY_PALETTE_WORDING_PEACE_LIGHT = [
+    'com.labre.wardley.palette.peace-light',
+    'Peace light',
+];
+export const WARDLEY_PALETTE_WORDING_WAR_LIGHT = [
+    'com.labre.wardley.palette.war-light',
+    'War light',
+];
+export const WARDLEY_PALETTE_WORDING_RED = [
+    'com.labre.wardley.palette.wardley-red',
+    'Wardley red',
+];
+export const WARDLEY_PALETTE_WORDING_INERTIA = [
+    'com.labre.wardley.palette.inertia',
+    'Inertia',
+];
+export const WARDLEY_PALETTE_WORDING_METHOD_GREY = [
+    'com.labre.wardley.palette.method-grey',
+    'Method grey',
+];
+export const WARDLEY_PALETTE_WORDINGS = [
+    WARDLEY_PALETTE_WORDING_WONDER,
+    WARDLEY_PALETTE_WORDING_PEACE,
+    WARDLEY_PALETTE_WORDING_WAR,
+    WARDLEY_PALETTE_WORDING_WONDER_LIGHT,
+    WARDLEY_PALETTE_WORDING_PEACE_LIGHT,
+    WARDLEY_PALETTE_WORDING_WAR_LIGHT,
+    WARDLEY_PALETTE_WORDING_RED,
+    WARDLEY_PALETTE_WORDING_INERTIA,
+    WARDLEY_PALETTE_WORDING_METHOD_GREY,
+];
 /**
  * The Wardley **evolution cycle**, surfaced as ready-made swatches in the node
  * colour picker: Wonder / Peace / War, the three climatic phases a component
@@ -41,15 +100,47 @@ export function wardleyFillColor(model, value) {
  * an author is free to ignore them, and the custom picker stays one click away.
  */
 const WARDLEY_PALETTES = [
-    { key: 'Wonder', value: '#3ec9f2' },
-    { key: 'Peace', value: '#5b9cf6' },
-    { key: 'War', value: '#9d6df0' },
-    { key: 'Wonder light', value: '#b9e9fa' },
-    { key: 'Peace light', value: '#c6dbfc' },
-    { key: 'War light', value: '#d9c9fa' },
-    { key: 'Wardley red', value: WARDLEY_RED },
-    { key: 'Inertia', value: INERTIA_COLOR },
-    { key: 'Method grey', value: METHOD_FILL },
+    {
+        key: 'Wonder',
+        value: '#3ec9f2',
+        labelWording: WARDLEY_PALETTE_WORDING_WONDER,
+    },
+    {
+        key: 'Peace',
+        value: '#5b9cf6',
+        labelWording: WARDLEY_PALETTE_WORDING_PEACE,
+    },
+    { key: 'War', value: '#9d6df0', labelWording: WARDLEY_PALETTE_WORDING_WAR },
+    {
+        key: 'Wonder light',
+        value: '#b9e9fa',
+        labelWording: WARDLEY_PALETTE_WORDING_WONDER_LIGHT,
+    },
+    {
+        key: 'Peace light',
+        value: '#c6dbfc',
+        labelWording: WARDLEY_PALETTE_WORDING_PEACE_LIGHT,
+    },
+    {
+        key: 'War light',
+        value: '#d9c9fa',
+        labelWording: WARDLEY_PALETTE_WORDING_WAR_LIGHT,
+    },
+    {
+        key: 'Wardley red',
+        value: WARDLEY_RED,
+        labelWording: WARDLEY_PALETTE_WORDING_RED,
+    },
+    {
+        key: 'Inertia',
+        value: INERTIA_COLOR,
+        labelWording: WARDLEY_PALETTE_WORDING_INERTIA,
+    },
+    {
+        key: 'Method grey',
+        value: METHOD_FILL,
+        labelWording: WARDLEY_PALETTE_WORDING_METHOD_GREY,
+    },
 ];
 /**
  * From the default editor palette we keep ONLY the neutrals — the historical

package/dist/translations.js

@@ -1,12 +1,87 @@
+import { tagDefsTranslationEntries } from '@formicoidea/labre-core/shared/services';
 import { collectTranslationKeys, commandCategoryTranslationEntries, commandTranslationEntries, mergeTranslationEntries, } from '@formicoidea/labre-core/std';
+import { WARDLEY_AXIS_SEED } from './actions.js';
 import { WARDLEY_AUDIT_CRITERIA } from './audit-criteria.js';
 import { WARDLEY_BACKGROUND } from './background.js';
 import { wardleyCommands } from './commands.js';
+import { WARDLEY_OWM_IMPORT_REMARKS } from './import.js';
+import { WARDLEY_LEGEND_WORDINGS } from './legend.js';
+import { WARDLEY_TAG_DEFS } from './natures.js';
 import { WARDLEY_NUDGES } from './nudges.js';
+import { WARDLEY_NODE_LABEL, wardleyNodeLabelKey } from './presets.js';
 import { WARDLEY_PROFILES } from './profiles.js';
 import { WARDLEY_READING } from './reading.js';
 import { WARDLEY_ROLES } from './roles.js';
 import { WARDLEY_RULES } from './rules.js';
+import { KODAK_INERTIA_SEED, TEA_SHOP_SEED, WARDLEY_TEMPLATE_NAME_KODAK_INERTIA, WARDLEY_TEMPLATE_NAME_TEA_SHOP, } from './templates/maps.js';
+import { WARDLEY_TEMPLATE_NAME_EVOLUTION_ARROW, WARDLEY_TEMPLATE_NAME_LINK, } from './templates/index.js';
+import { WARDLEY_TOOLBAR_WORDINGS } from './toolbar/config.js';
+import { WARDLEY_PALETTE_WORDINGS } from './toolbar/node-config.js';
+/**
+ * The prompt every labelled artefact is created NEXT TO — the fallback IS
+ * `WARDLEY_NODE_LABEL[kind]`, never restated, mirroring BPMN's `seedEntries`.
+ */
+const nodeSeedEntries = () => Object.entries(WARDLEY_NODE_LABEL).map(([kind, label]) => ({
+    key: wardleyNodeLabelKey(kind),
+    fallback: label,
+    source: 'seed',
+}));
+/** The three axis words a translated background variant is seeded with. */
+const axisSeedEntries = () => Object.values(WARDLEY_AXIS_SEED).map(({ key, fallback }) => ({
+    key,
+    fallback,
+    source: 'seed',
+}));
+/**
+ * The seeds the two worked-example maps write — derived from the very tables
+ * `templates/maps.ts` reads at placement.
+ */
+const exampleSeedEntries = () => [...Object.values(TEA_SHOP_SEED), ...Object.values(KODAK_INERTIA_SEED)].map(({ key, fallback }) => ({ key, fallback, source: 'seed' }));
+/**
+ * The auto-legend's own wordings — title, row captions, gradient blocks and
+ * the Porter panel — derived from `legend.ts`'s own `WARDLEY_LEGEND_WORDINGS`,
+ * the very table `createWardleyLegend` reads when it writes the group onto
+ * the canvas.
+ */
+const legendSeedEntries = () => WARDLEY_LEGEND_WORDINGS.map(([key, fallback]) => ({
+    key,
+    fallback,
+    source: 'seed',
+}));
+/** The toolbar tooltips this framework used to hard-code as English literals. */
+const toolbarChromeEntries = () => WARDLEY_TOOLBAR_WORDINGS.map(([key, fallback]) => ({
+    key,
+    fallback,
+    source: 'chrome',
+}));
+/**
+ * The four hand-composed cards' own tile names — chrome, not seeds: a
+ * `Template.nameKey`, re-resolved every time the panel opens, never written
+ * into a document. See `templates/index.ts` and `templates/maps.ts`.
+ */
+const templateNameEntries = () => [
+    WARDLEY_TEMPLATE_NAME_LINK,
+    WARDLEY_TEMPLATE_NAME_EVOLUTION_ARROW,
+    WARDLEY_TEMPLATE_NAME_TEA_SHOP,
+    WARDLEY_TEMPLATE_NAME_KODAK_INERTIA,
+].map(([key, fallback]) => ({ key, fallback, source: 'chrome' }));
+/** The five fixed-wording OWM import remarks ({@link WARDLEY_OWM_IMPORT_REMARKS}). */
+const importRemarkEntries = () => Object.values(WARDLEY_OWM_IMPORT_REMARKS).map(([key, english]) => ({
+    key,
+    fallback: english,
+    source: 'chrome',
+}));
+/**
+ * The nine node-colour-picker swatches' own names (`WARDLEY_PALETTE_WORDINGS`,
+ * `toolbar/node-config.ts`) — chrome, like the toolbar tooltips above: a
+ * swatch's name is re-rendered on every locale switch, never seeded into a
+ * document.
+ */
+const paletteWordingEntries = () => WARDLEY_PALETTE_WORDINGS.map(([key, fallback]) => ({
+    key,
+    fallback,
+    source: 'chrome',
+}));
 /**
  * THIS framework's contribution to the translation-key manifest — every
  * `com.labre.*` key Wardley can hand to `TranslationProvider.t`, derived from
@@ -27,4 +102,8 @@ export const wardleyTranslationEntries = mergeTranslationEntries(commandTranslat
 // registry names no framework category in the bundled distribution, so a
 // host that composed core's manifest alone drew translated entries under
 // English headers (#183).
-commandCategoryTranslationEntries(wardleyCommands), collectTranslationKeys('role', WARDLEY_ROLES), collectTranslationKeys('background', WARDLEY_BACKGROUND), collectTranslationKeys('rule', WARDLEY_RULES), collectTranslationKeys('nudge', WARDLEY_NUDGES), collectTranslationKeys('profile', WARDLEY_PROFILES), collectTranslationKeys('audit-criterion', WARDLEY_AUDIT_CRITERIA), collectTranslationKeys('reading', WARDLEY_READING));
+commandCategoryTranslationEntries(wardleyCommands), collectTranslationKeys('role', WARDLEY_ROLES), collectTranslationKeys('background', WARDLEY_BACKGROUND), collectTranslationKeys('rule', WARDLEY_RULES), collectTranslationKeys('nudge', WARDLEY_NUDGES), collectTranslationKeys('profile', WARDLEY_PROFILES), collectTranslationKeys('audit-criterion', WARDLEY_AUDIT_CRITERIA), nodeSeedEntries(), axisSeedEntries(), exampleSeedEntries(), legendSeedEntries(), templateNameEntries(), toolbarChromeEntries(), importRemarkEntries(), paletteWordingEntries(), collectTranslationKeys('reading', WARDLEY_READING), 
+// The library's own tag pack (`WARDLEY_TAG_DEFS`) — the natures and the
+// Porter competition tags. A host's app-seeded pack needs no entry here:
+// see `tagDefsTranslationEntries`.
+tagDefsTranslationEntries(WARDLEY_TAG_DEFS));

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@formicoidea/labre-framework-wardley",
   "description": "Labre wardley framework for @formicoidea/labre-core.",
-  "version": "0.39.3",
+  "version": "0.41.0",
   "type": "module",
   "sideEffects": false,
   "author": "lajola",
@@ -31,7 +31,7 @@
     "dist"
   ],
   "dependencies": {
-    "@formicoidea/labre-core": "0.39.3",
+    "@formicoidea/labre-core": "0.41.0",
     "lit": "^3.2.0"
   }
 }