@formicoidea/labre-framework-edgy 0.33.0 → 0.34.1

package/dist/actions.js

@@ -3,10 +3,11 @@ import { ConnectorTool } from '@formicoidea/labre-core/gfx/connector';
 import { createGroupCommand } from '@formicoidea/labre-core/gfx/group';
 import { createTemplateJob } from '@formicoidea/labre-core/gfx/template';
 import { ConnectorMode, FontFamily, PointStyle, ShapeStyle, StrokeStyle, } from '@formicoidea/labre-core/model';
+import { translateKey } from '@formicoidea/labre-core/shared/services';
 import { Bound } from '@formicoidea/labre-core/global/gfx';
 import { GfxControllerIdentifier } from '@formicoidea/labre-core/std/gfx';
 import { CROP_LABELED } from './consts.js';
-import { ACTIVITY_VERTICES, INNER_FONT_SIZE, LABEL_FONT_SIZE, LABEL_GAP, NODE_FILL, NODE_LABEL, NODE_SIZE, NODE_STROKE, NODE_STROKE_WIDTH, OUTCOME_RADIUS, } from './node/consts.js';
+import { ACTIVITY_VERTICES, INNER_FONT_SIZE, LABEL_FONT_SIZE, LABEL_GAP, NODE_FILL, NODE_LABEL, nodeLabelKey, NODE_SIZE, NODE_STROKE, NODE_STROKE_WIDTH, OUTCOME_RADIUS, } from './node/consts.js';
 import { EDGY_ROLE } from './roles.js';
 import { edgyDynamicTemplate } from './templates/index.js';
 /** Stroke width the 24 template relations are drawn with. */
@@ -125,7 +126,9 @@ export function createEdgyBox(std, kind) {
         strokeWidth: NODE_STROKE_WIDTH,
         radius: kind === 'outcome' ? OUTCOME_RADIUS : 0,
         vertices: kind === 'activity' ? ACTIVITY_VERTICES : null,
-        text: NODE_LABEL[kind],
+        // Translated HERE and once: what a gesture writes onto the canvas is
+        // document content the moment it lands (`nodeLabelKey`).
+        text: translateKey(std, nodeLabelKey(kind), NODE_LABEL[kind]),
         color: NODE_STROKE,
         fontFamily: FontFamily.Inter,
         fontSize: INNER_FONT_SIZE,
@@ -152,7 +155,7 @@ export function createEdgyPeople(std) {
         strokeWidth: 0,
         xywh: new Bound(cx - w / 2, cy - h / 2, w, h).serialize(),
     });
-    const labelId = addLabel(surface, NODE_LABEL.people, cx - 60, cy + h / 2 + LABEL_GAP);
+    const labelId = addLabel(surface, translateKey(std, nodeLabelKey('people'), NODE_LABEL.people), cx - 60, cy + h / 2 + LABEL_GAP);
     const [, result] = std.command.exec(createGroupCommand, {
         elements: [nodeId, labelId],
     });

package/dist/commands-manifest.d.ts

@@ -0,0 +1,18 @@
+import type { ShortcutManifestEntry } from '@formicoidea/labre-core/std';
+/**
+ * The EDGY commands as SHORTCUT-MANIFEST rows — id, label, chord, scope,
+ * owner — and nothing else.
+ *
+ * DATA ONLY, and that is the whole point (`docs/adr/0008` § Packaging). A
+ * `CommandDescriptor` carries its `run`, so a host settings pane that imports
+ * the package entry to list names and chords drags the entire action graph —
+ * the import/export machinery, the surface and gfx deep paths — into its
+ * chunk. This module has type-only imports, so the published bundle exposes it
+ * as `./commands-manifest`: a few hundred bytes that reference nothing.
+ *
+ * GENERATED-SHAPED, hand-committed: `commands-manifest.unit.spec.ts` asserts
+ * row-for-row equality with `toShortcutManifestEntry` over {@link edgyCommands},
+ * so this file cannot drift from the commands it projects. Add a command and
+ * the test says exactly what to add here.
+ */
+export declare const edgyCommandsManifest: ShortcutManifestEntry[];

package/dist/commands-manifest.js

@@ -0,0 +1,82 @@
+/**
+ * The EDGY commands as SHORTCUT-MANIFEST rows — id, label, chord, scope,
+ * owner — and nothing else.
+ *
+ * DATA ONLY, and that is the whole point (`docs/adr/0008` § Packaging). A
+ * `CommandDescriptor` carries its `run`, so a host settings pane that imports
+ * the package entry to list names and chords drags the entire action graph —
+ * the import/export machinery, the surface and gfx deep paths — into its
+ * chunk. This module has type-only imports, so the published bundle exposes it
+ * as `./commands-manifest`: a few hundred bytes that reference nothing.
+ *
+ * GENERATED-SHAPED, hand-committed: `commands-manifest.unit.spec.ts` asserts
+ * row-for-row equality with `toShortcutManifestEntry` over {@link edgyCommands},
+ * so this file cannot drift from the commands it projects. Add a command and
+ * the test says exactly what to add here.
+ */
+export const edgyCommandsManifest = [
+    {
+        id: 'edgy.addFacets',
+        owner: 'edgy',
+        labelKey: 'com.labre.commands.edgy.addFacets',
+        labelFallback: 'Enterprise Design facets',
+        scope: 'edgeless',
+        defaultKeys: { mac: [], other: [] },
+    },
+    {
+        id: 'edgy.insertDynamic',
+        owner: 'edgy',
+        labelKey: 'com.labre.commands.edgy.insertDynamic',
+        labelFallback: 'EDGY dynamic (elements & relations)',
+        scope: 'edgeless',
+        defaultKeys: { mac: [], other: [] },
+    },
+    {
+        id: 'edgy.addBoard',
+        owner: 'edgy',
+        labelKey: 'com.labre.commands.edgy.addBoard',
+        labelFallback: 'EDGY board (hover spotlight)',
+        scope: 'edgeless',
+        defaultKeys: { mac: [], other: [] },
+    },
+    {
+        id: 'edgy.addPeople',
+        owner: 'edgy',
+        labelKey: 'com.labre.commands.edgy.addPeople',
+        labelFallback: 'People',
+        scope: 'edgeless',
+        defaultKeys: { mac: [], other: [] },
+    },
+    {
+        id: 'edgy.addOutcome',
+        owner: 'edgy',
+        labelKey: 'com.labre.commands.edgy.addOutcome',
+        labelFallback: 'Outcome',
+        scope: 'edgeless',
+        defaultKeys: { mac: [], other: [] },
+    },
+    {
+        id: 'edgy.addObject',
+        owner: 'edgy',
+        labelKey: 'com.labre.commands.edgy.addObject',
+        labelFallback: 'Object',
+        scope: 'edgeless',
+        defaultKeys: { mac: [], other: [] },
+    },
+    {
+        id: 'edgy.addActivity',
+        owner: 'edgy',
+        labelKey: 'com.labre.commands.edgy.addActivity',
+        labelFallback: 'Activity',
+        scope: 'edgeless',
+        defaultKeys: { mac: [], other: [] },
+    },
+    {
+        id: 'edgy.addRelation',
+        owner: 'edgy',
+        labelKey: 'com.labre.commands.edgy.addRelation',
+        labelFallback: 'Relation',
+        scope: 'edgeless',
+        defaultKeys: { mac: [], other: [] },
+    },
+];

package/dist/element-view.d.ts

@@ -1,4 +1,6 @@
 import type { EdgyFacetsElementModel } from '@formicoidea/labre-core/model';
+import type { EditorHost } from '@formicoidea/labre-core/std';
+import type { PointTestOptions } from '@formicoidea/labre-core/std/gfx';
 import { GfxElementModelView } from '@formicoidea/labre-core/std/gfx';
 export declare class EdgyView extends GfxElementModelView<EdgyFacetsElementModel> {
     static type: string;
@@ -6,6 +8,18 @@ export declare class EdgyView extends GfxElementModelView<EdgyFacetsElementModel
     private _labelEditor;
     onCreated(): void;
     onDestroyed(): void;
+    /** The editable facet label under a MODEL-space point, or null. */
+    private _labelAt;
+    /**
+     * The diagram is SELECTED by its border (`EdgyFacetsElementModel`), but its
+     * three facet labels must still receive the double-click that renames them.
+     *
+     * Same seam Wardley uses, for the same reason: the pointer router asks the
+     * VIEW, so a framework declares its own gesture zones next to the code that
+     * draws them, and the model layer keeps a hit test that only says what a
+     * click SELECTS.
+     */
+    includesPoint(x: number, y: number, options: PointTestOptions, host: EditorHost): boolean;
     /** Double-click on a label → edit its text in place. */
     private _onDblClick;
     private _openLabelEditor;

package/dist/element-view.js

@@ -18,14 +18,11 @@ export class EdgyView extends GfxElementModelView {
         this._closeLabelEditor();
         super.onDestroyed();
     }
-    /** Double-click on a label → edit its text in place. */
-    _onDblClick(e) {
-        if (this.model.isLocked())
-            return;
+    /** The editable facet label under a MODEL-space point, or null. */
+    _labelAt(mx, my) {
         // No labels shown → nothing to edit (and the cropped mapping differs).
         if (!this.model.showLabels)
-            return;
-        const [mx, my] = this.gfx.viewport.toModelCoord(e.x, e.y);
+            return null;
         const [bx, by, w, h] = this.model.deserializedXYWH;
         // Convert the model-space point into element-local coordinates, undoing the
         // element rotation around its center.
@@ -45,7 +42,28 @@ export class EdgyView extends GfxElementModelView {
             : refScale(w, h);
         const rx = (lx - ox) / s;
         const ry = (ly - oy) / s;
-        const hit = hitTestEdgyLabel(getEdgyLabelHits(this.model), rx, ry);
+        return hitTestEdgyLabel(getEdgyLabelHits(this.model), rx, ry);
+    }
+    /**
+     * The diagram is SELECTED by its border (`EdgyFacetsElementModel`), but its
+     * three facet labels must still receive the double-click that renames them.
+     *
+     * Same seam Wardley uses, for the same reason: the pointer router asks the
+     * VIEW, so a framework declares its own gesture zones next to the code that
+     * draws them, and the model layer keeps a hit test that only says what a
+     * click SELECTS.
+     */
+    includesPoint(x, y, options, host) {
+        if (super.includesPoint(x, y, options, host))
+            return true;
+        return this._labelAt(x, y) !== null;
+    }
+    /** Double-click on a label → edit its text in place. */
+    _onDblClick(e) {
+        if (this.model.isLocked())
+            return;
+        const [mx, my] = this.gfx.viewport.toModelCoord(e.x, e.y);
+        const hit = this._labelAt(mx, my);
         if (!hit)
             return;
         this._openLabelEditor(hit.field, e);

package/dist/node/consts.d.ts

@@ -21,6 +21,18 @@ export declare const NODE_SIZE: Record<EdgyNodeKind, {
 export declare const INNER_FONT_SIZE = 20;
 export declare const LABEL_FONT_SIZE = 18;
 export declare const LABEL_GAP = 8;
+/**
+ * The i18n key {@link NODE_LABEL} is the English default of, when the label is
+ * written onto the canvas.
+ *
+ * Resolved AT PLACEMENT (`createEdgyBox`, `createEdgyPeople`) and never
+ * afterwards: the text a gesture writes is content the author owns from that
+ * moment on, and re-translating it on every paint would overwrite a name
+ * somebody typed. The same words also name the ROLES (`roles.ts`), under their
+ * own keys — a role is a fact about an element and is read live, which is a
+ * different question with a different answer.
+ */
+export declare const nodeLabelKey: (kind: EdgyNodeKind) => string;
 /** Default inner text / label per kind. */
 export declare const NODE_LABEL: Record<EdgyNodeKind, string>;
 /**

package/dist/node/consts.js

@@ -28,6 +28,18 @@ export const NODE_SIZE = {
 export const INNER_FONT_SIZE = 20;
 export const LABEL_FONT_SIZE = 18;
 export const LABEL_GAP = 8;
+/**
+ * The i18n key {@link NODE_LABEL} is the English default of, when the label is
+ * written onto the canvas.
+ *
+ * Resolved AT PLACEMENT (`createEdgyBox`, `createEdgyPeople`) and never
+ * afterwards: the text a gesture writes is content the author owns from that
+ * moment on, and re-translating it on every paint would overwrite a name
+ * somebody typed. The same words also name the ROLES (`roles.ts`), under their
+ * own keys — a role is a fact about an element and is read live, which is a
+ * different question with a different answer.
+ */
+export const nodeLabelKey = (kind) => `com.labre.edgy.seed.${kind}`;
 /** Default inner text / label per kind. */
 export const NODE_LABEL = {
     people: 'People',

package/dist/toolbar/config.d.ts

@@ -1,27 +1,23 @@
-import { type ToolbarContext } from '@formicoidea/labre-core/shared/services';
+import { type ChromeWording, type ToolbarContext } from '@formicoidea/labre-core/shared/services';
 import { type TemplateResult } from 'lit';
 export declare const edgyToolbarConfig: {
     readonly actions: [{
         id: string;
         tooltip: string;
+        tooltipWording: ChromeWording | undefined;
         icon: TemplateResult;
         active(ctx: ToolbarContext): boolean;
         run(ctx: ToolbarContext): void;
     }, {
         id: string;
         tooltip: string;
+        tooltipWording: ChromeWording | undefined;
         icon: TemplateResult;
         active(ctx: ToolbarContext): boolean;
         run(ctx: ToolbarContext): void;
     }, {
         id: string;
-        tooltip: string;
-        icon: TemplateResult;
-        active(ctx: ToolbarContext): boolean;
-        run(ctx: ToolbarContext): void;
-    }, {
-        id: string;
-        tooltip: string;
+        tooltipWording: ChromeWording;
         icon: TemplateResult<1>;
         run(ctx: ToolbarContext): void;
     }];
@@ -32,18 +28,20 @@ export declare const edgyBoardToolbarConfig: {
     readonly actions: [{
         id: string;
         tooltip: string;
+        tooltipWording: ChromeWording | undefined;
         icon: TemplateResult;
         active(ctx: ToolbarContext): boolean;
         run(ctx: ToolbarContext): void;
     }, {
         id: string;
         tooltip: string;
+        tooltipWording: ChromeWording | undefined;
         icon: TemplateResult;
         active(ctx: ToolbarContext): boolean;
         run(ctx: ToolbarContext): void;
     }, {
         id: string;
-        tooltip: string;
+        tooltipWording: ChromeWording;
         icon: TemplateResult<1>;
         run(ctx: ToolbarContext): void;
     }];

package/dist/toolbar/config.js

@@ -1,7 +1,7 @@
 import { EdgelessCRUDIdentifier } from '@formicoidea/labre-core/blocks/surface';
 import { createAutoLegend, dddLegendIcon } from '@formicoidea/labre-ddd-shared';
 import { EdgyBoardElementModel, EdgyFacetsElementModel, } from '@formicoidea/labre-core/model';
-import { TelemetryProvider, ToolbarModuleExtension, } from '@formicoidea/labre-core/shared/services';
+import { BOARD_LEGEND_NOTATION, BOARD_RESIZE_TOGGLE, TelemetryProvider, 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';
@@ -56,7 +56,12 @@ function booleanToggle(Model, id, tooltip, icon, prop) {
     const models = (ctx) => ctx.getSurfaceModelsByType(Model);
     return {
         id,
-        tooltip,
+        tooltip: typeof tooltip === 'string' ? tooltip : tooltip[1],
+        // The declared wording, when the caller gave one instead of a literal:
+        // `combine` resolves it against the host's catalogue and writes it over
+        // the English default above, so a playground with no catalogue reads
+        // exactly what it read before (#183).
+        tooltipWording: typeof tooltip === 'string' ? undefined : tooltip,
         icon,
         active(ctx) {
             const all = models(ctx);
@@ -90,7 +95,7 @@ function booleanToggle(Model, id, tooltip, icon, prop) {
 function legendAction(Model, id) {
     return {
         id,
-        tooltip: 'Generate the legend (notation present)',
+        tooltipWording: BOARD_LEGEND_NOTATION,
         icon: dddLegendIcon,
         run(ctx) {
             const background = ctx.getSurfaceModelsByType(Model)[0];
@@ -112,10 +117,11 @@ function legendAction(Model, id) {
 }
 export const edgyToolbarConfig = {
     actions: [
-        booleanToggle(EdgyFacetsElementModel, 'a.toggle-resize', 'Enable / lock resizing', ResizeIcon, 'resizeEnabled'),
+        booleanToggle(EdgyFacetsElementModel, 'a.toggle-resize', BOARD_RESIZE_TOGGLE, ResizeIcon, 'resizeEnabled'),
         booleanToggle(EdgyFacetsElementModel, 'b.toggle-labels', 'Show / hide facet labels', LabelsIcon, 'showLabels'),
-        booleanToggle(EdgyFacetsElementModel, 'c.toggle-spotlight', 'Enable / disable hover spotlight', SpotlightIcon, 'spotlightEnabled'),
-        legendAction(EdgyFacetsElementModel, 'd.legend'),
+        // 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,
 };
@@ -125,7 +131,7 @@ export const edgyToolbarExtension = ToolbarModuleExtension({
 });
 export const edgyBoardToolbarConfig = {
     actions: [
-        booleanToggle(EdgyBoardElementModel, 'a.toggle-resize', 'Enable / lock resizing', ResizeIcon, 'resizeEnabled'),
+        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'),
     ],

package/dist/translations.js

@@ -1,5 +1,6 @@
-import { collectTranslationKeys, commandTranslationEntries, mergeTranslationEntries, } from '@formicoidea/labre-core/std';
+import { collectTranslationKeys, commandCategoryTranslationEntries, commandTranslationEntries, mergeTranslationEntries, } from '@formicoidea/labre-core/std';
 import { edgyCommands } from './commands.js';
+import { NODE_LABEL, nodeLabelKey } from './node/consts.js';
 import { EDGY_NUDGES } from './nudges.js';
 import { EDGY_PROFILES } from './profiles.js';
 import { EDGY_ROLES } from './roles.js';
@@ -26,4 +27,18 @@ import { EDGY_RULES } from './rules.js';
  * composes it into its catalogue exactly as it already composes `edgyCommands`
  * into the command registry. See `packages/affine/all/src/translations.ts`.
  */
-export const edgyTranslationEntries = mergeTranslationEntries(commandTranslationEntries(edgyCommands), collectTranslationKeys('role', EDGY_ROLES), collectTranslationKeys('rule', EDGY_RULES), collectTranslationKeys('nudge', EDGY_NUDGES), collectTranslationKeys('profile', EDGY_PROFILES));
+export const edgyTranslationEntries = mergeTranslationEntries(commandTranslationEntries(edgyCommands), 
+// The catalogue's own group headers, derived from the very categories
+// these commands declare. They ship WITH the framework because core's
+// 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(edgyCommands), collectTranslationKeys('role', EDGY_ROLES), collectTranslationKeys('rule', EDGY_RULES), collectTranslationKeys('nudge', EDGY_NUDGES), collectTranslationKeys('profile', EDGY_PROFILES), 
+// The captions a placed base element is seeded with. Derived from
+// `NODE_LABEL`, the very table the gesture writes from, so the wording a
+// host is offered is the wording the canvas would have carried.
+Object.entries(NODE_LABEL).map(([kind, label]) => ({
+    key: nodeLabelKey(kind),
+    fallback: label,
+    source: 'seed',
+})));

package/dist/view.d.ts

@@ -2,9 +2,9 @@ import { type ViewExtensionContext, ViewExtensionProvider } from '@formicoidea/l
 /**
  * EDGY rendering — ALWAYS registered, independent of any flag. Disabling `edgy`
  * hides only the creation tooling (see {@link EdgyViewExtension}); boards and
- * facets already drawn must still paint, stay selectable, stay editable, keep
- * their contextual toolbar and keep the dependency spotlight. See
- * `docs/adr/0009`.
+ * facets already drawn must still paint, stay selectable, stay editable and
+ * keep their contextual toolbar — and a board must keep the dependency
+ * spotlight it hosts. See `docs/adr/0009`.
  */
 export declare class EdgyRenderViewExtension extends ViewExtensionProvider {
     name: string;

package/dist/view.js

@@ -24,9 +24,9 @@ import { edgySeniorTool } from './toolbar/senior-tool.js';
 /**
  * EDGY rendering — ALWAYS registered, independent of any flag. Disabling `edgy`
  * hides only the creation tooling (see {@link EdgyViewExtension}); boards and
- * facets already drawn must still paint, stay selectable, stay editable, keep
- * their contextual toolbar and keep the dependency spotlight. See
- * `docs/adr/0009`.
+ * facets already drawn must still paint, stay selectable, stay editable and
+ * keep their contextual toolbar — and a board must keep the dependency
+ * spotlight it hosts. See `docs/adr/0009`.
  */
 export class EdgyRenderViewExtension extends ViewExtensionProvider {
     constructor() {
@@ -54,8 +54,9 @@ export class EdgyRenderViewExtension extends ViewExtensionProvider {
             context.register(edgyToolbarExtension);
             context.register(edgyBoardToolbarExtension);
             context.register(edgyNodeToolbarExtension);
-            // Both EDGY backgrounds grant the dependency spotlight on hover.
-            context.register(SpotlightHostExtension('edgy'));
+            // The dependency spotlight on hover is BOARD logic: only the EDGY board
+            // grants it. The facets Venn is a drawing — it keeps its appearance
+            // toggles (labels, pictos, crop, resize) and nothing else (#195).
             context.register(SpotlightHostExtension('edgyBoard'));
         }
     }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@formicoidea/labre-framework-edgy",
   "description": "Labre edgy framework for @formicoidea/labre-core.",
-  "version": "0.33.0",
+  "version": "0.34.1",
   "type": "module",
   "sideEffects": false,
   "author": "lajola",
@@ -21,14 +21,18 @@
     "./descriptor": {
       "types": "./dist/descriptor.d.ts",
       "import": "./dist/descriptor.js"
+    },
+    "./commands-manifest": {
+      "types": "./dist/commands-manifest.d.ts",
+      "import": "./dist/commands-manifest.js"
     }
   },
   "files": [
     "dist"
   ],
   "dependencies": {
-    "@formicoidea/labre-core": "0.33.0",
-    "@formicoidea/labre-ddd-shared": "0.33.0",
+    "@formicoidea/labre-core": "0.34.1",
+    "@formicoidea/labre-ddd-shared": "0.34.1",
     "@preact/signals-core": "^1.8.0",
     "lit": "^3.2.0",
     "yjs": "^13.6.21"