@stocksharp/diagram 0.2.2 → 0.3.0

package/README.md

@@ -153,6 +153,18 @@ node is rendered as a transient red placeholder whose hover tooltip names the
 missing type. Sites can localize that message through
 `data-diagram-missing-element="Missing: {typeId}"` on the host.
 
+Every text the embedded control shows comes from the host, so a translated page
+carries no English leftovers:
+
+| Host attribute | What it renames |
+|---|---|
+| `data-diagram-fullscreen="Enter\|Exit"` | the fullscreen button's tooltip, collapsed and expanded |
+| `data-diagram-errors="Load\|Empty\|Draw"` | the three failure notes shown in place of a diagram |
+| `data-diagram-missing-element="Missing: {typeId}"` | the placeholder for an element the palette lacks |
+
+The same labels are available to custom integrations as the `fullscreenLabels`
+option and `setFullscreenLabels()` on `StockSharpDiagram`.
+
 ### Node actions and errors
 
 Double-click handling is opt-in. Give only the node types controlled by the

package/dist/esm/canvas-renderer.js

@@ -5,6 +5,8 @@
 // selection, delete, zoom/pan, load/save round-trip.
 import { createDiagramDocument, parseDiagramDocument } from './core/document.js';
 import { DiagramCommandHistory } from './core/history.js';
+import { setJsonKey } from './core/json.js';
+import { toPortDynamicMode } from './core/model.js';
 import { cloneDiagramRuntimeState, createDiagramNodeRuntimeState, createDiagramPortRuntimeState, createDiagramRuntimeState, createEditableDiagramPermissions, createReadOnlyDiagramPermissions, } from './core/state.js';
 const SCREEN_RENDER_OPTIONS = {
     grid: true,
@@ -26,7 +28,7 @@ function copyJsonObject(value) {
         return {};
     const result = {};
     for (const [key, item] of Object.entries(value))
-        result[key] = copyJsonValue(item);
+        setJsonKey(result, key, copyJsonValue(item));
     return result;
 }
 function copyParameters(value) {
@@ -65,7 +67,7 @@ export class PortModel {
         this.maxLinks = typeof init.maxLinks === 'number' ? init.maxLinks : 0;
         this.availableTypes = [...(init.availableTypes ?? [])];
         this.isDynamic = init.isDynamic ?? false;
-        this.dynamicMode = init.dynamicMode ?? '';
+        this.dynamicMode = toPortDynamicMode(init.dynamicMode);
         this.isSibling = init.isSibling ?? false;
         this.metadata = copyJsonObject(init.metadata);
     }
@@ -161,10 +163,8 @@ export class LinkModel {
         };
     }
 }
-const HEADER_H = 22;
 const PORT_R = 6;
 const PORT_ROW_H = 20;
-const NODE_PAD = 10;
 const RELINK_HANDLE_PX = 8; // WPF relink adornment is an 8x8 diamond
 const RELINK_DRAG_THRESHOLD_PX = 4;
 const PORT_SQ = 9; // socket square size — sits outside the node
@@ -241,8 +241,6 @@ export class Diagram {
         this.dragNode = null;
         this.dragStart = []; // group-drag origin
         this.dragAnchor = { wx: 0, wy: 0 };
-        this.dragDX = 0;
-        this.dragDY = 0;
         this.panning = false;
         this.panX = 0;
         this.panY = 0;
@@ -894,7 +892,7 @@ export class Diagram {
             if (value === undefined)
                 delete node.paramValues[name];
             else
-                node.paramValues[name] = value;
+                setJsonKey(node.paramValues, name, value);
         });
     }
     setShowNodeMessages(show) {
@@ -985,7 +983,7 @@ export class Diagram {
             if (node.loadError.length === 0)
                 continue;
             const state = createDiagramNodeRuntimeState();
-            state.error = { kind: 'load', message: node.loadError, pulse: ++this.runtimePulse };
+            state.errors.load = { kind: 'load', message: node.loadError, pulse: ++this.runtimePulse };
             this.runtimeState.nodes[node.id] = state;
         }
         if (Object.keys(this.runtimeState.nodes).length > 0)
@@ -1190,14 +1188,16 @@ export class Diagram {
         else if (previous.globalError?.pulse !== this.runtimeState.globalError.pulse) {
             this.globalErrorFlashStart = performance.now();
         }
-        this.runtimePulse = Math.max(this.runtimePulse, this.runtimeState.globalError?.pulse ?? 0, ...Object.values(this.runtimeState.nodes).map((node) => node.error?.pulse ?? 0));
+        this.runtimePulse = Math.max(this.runtimePulse, this.runtimeState.globalError?.pulse ?? 0, ...Object.values(this.runtimeState.nodes)
+            .flatMap((node) => [node.errors.runtime?.pulse ?? 0, node.errors.load?.pulse ?? 0]));
         for (const node of this.nodes) {
-            const error = this.runtimeState.nodes[node.id]?.error ?? null;
-            const previousError = previous.nodes[node.id]?.error ?? null;
-            node.runtimeError = error?.kind === 'runtime' ? error.message : '';
-            node.loadError = error?.kind === 'load' ? error.message : '';
-            if (error?.kind === 'runtime') {
-                if (previousError?.kind !== 'runtime' || previousError.pulse !== error.pulse) {
+            const errors = this.runtimeState.nodes[node.id]?.errors;
+            const previousRuntime = previous.nodes[node.id]?.errors.runtime;
+            const runtimeError = errors?.runtime;
+            node.runtimeError = runtimeError?.message ?? '';
+            node.loadError = errors?.load?.message ?? '';
+            if (runtimeError !== undefined) {
+                if (previousRuntime === undefined || previousRuntime.pulse !== runtimeError.pulse) {
                     node.errorFlashStart = performance.now();
                 }
             }
@@ -1257,7 +1257,14 @@ export class Diagram {
         const state = this.getRuntimeState();
         const nodeState = state.nodes[id] ?? createDiagramNodeRuntimeState();
         state.nodes[id] = nodeState;
-        nodeState.error = message.length === 0 ? null : { kind, message, pulse: ++this.runtimePulse };
+        // Only this kind's slot is written, so an error of the other kind that is
+        // already on the node survives.
+        if (message.length === 0)
+            delete nodeState.errors[kind];
+        else if (kind === 'load')
+            nodeState.errors.load = { kind, message, pulse: ++this.runtimePulse };
+        else
+            nodeState.errors.runtime = { kind, message, pulse: ++this.runtimePulse };
         this.runtimeState = state;
         this.emitRuntimeStateChanged();
         return true;
@@ -1274,12 +1281,11 @@ export class Diagram {
             node.loadError = '';
         const state = this.getRuntimeState();
         const nodeState = state.nodes[id];
-        if (nodeState !== undefined && (kind === undefined || nodeState.error?.kind === kind)) {
-            nodeState.error = node.runtimeError.length > 0
-                ? { kind: 'runtime', message: node.runtimeError, pulse: ++this.runtimePulse }
-                : node.loadError.length > 0
-                    ? { kind: 'load', message: node.loadError, pulse: ++this.runtimePulse }
-                    : null;
+        if (nodeState !== undefined) {
+            if (kind === undefined || kind === 'runtime')
+                delete nodeState.errors.runtime;
+            if (kind === undefined || kind === 'load')
+                delete nodeState.errors.load;
         }
         this.runtimeState = state;
         this.emitRuntimeStateChanged();