@foblex/flow 19.1.2 → 19.1.3

package/AI.md

@@ -139,6 +139,7 @@ export class Editor {
 - Rotation, connection waypoint editing, and user resize are not captured by managed state in v1.
 - `state.changes()` increments once when a standalone mutation or outer batch settles. A drag can emit selection at start and move/drop at end while remaining one history step and one `changes()` increment.
 - Use `state.snapshot()` for persistence; `load()` replaces data and resets history.
+- `canvasTransformDebounce` defaults to `350ms`. It waits for wheel/pinch zoom events to settle, then records the current canvas transform as one change and one undo item. Setting it to `0` disables batching: every emitted `fCanvasChange` is applied immediately, increments `state.changes()`, and normally creates a separate undo item. Keep the canvas `[debounceTime]` unset when managed state owns viewport history; do not stack canvas and State debounce layers.
 - For initial or other application-driven viewport positioning, suppress the event at the canvas helper: `canvas.resetScaleAndCenter(false, false)`. The second `false` means `emitCanvasChange = false`, so managed history is untouched.
 - Connection endpoints are connector ids. Automatic cascade from node/group deletion uses the rendered connector registry; before connectors render, remove known attached connection ids explicitly in the same `state.batch(...)`.
 

package/fesm2022/foblex-flow.mjs

@@ -22492,7 +22492,7 @@ function mergeFlowStateConfig(config) {
         historyLimit: 50,
         selectionInHistory: true,
         canvasTransformInHistory: true,
-        canvasTransformDebounce: 0,
+        canvasTransformDebounce: 350,
         dropToGroup: false,
         ...config,
     };
@@ -23308,18 +23308,34 @@ class FFlowStateController {
         if (this._transformDebounceTimer !== null) {
             clearTimeout(this._transformDebounceTimer);
         }
+        this._scheduleCanvasChangeFlush(debounce);
+    }
+    _flushCanvasChange() {
+        const pending = this._pendingTransform;
+        if (!pending) {
+            return;
+        }
+        const current = this._readCanvasTransform();
+        const debounce = this._config?.canvasTransformDebounce ?? 0;
+        if (debounce > 0 && current && !this._isSameCanvasTransform(pending, current)) {
+            this._pendingTransform = current;
+            this._scheduleCanvasChangeFlush(debounce);
+            return;
+        }
+        this._pendingTransform = null;
+        const settled = debounce > 0 ? (current ?? pending) : pending;
+        this._dispatch(() => this._state.applyTransform(settled));
+    }
+    _scheduleCanvasChangeFlush(debounce) {
         this._transformDebounceTimer = setTimeout(() => {
             this._transformDebounceTimer = null;
             this._flushCanvasChange();
         }, debounce);
     }
-    _flushCanvasChange() {
-        const transform = this._pendingTransform;
-        this._pendingTransform = null;
-        if (!transform) {
-            return;
-        }
-        this._dispatch(() => this._state.applyTransform(transform));
+    _isSameCanvasTransform(first, second) {
+        return (first.position.x === second.position.x &&
+            first.position.y === second.position.y &&
+            first.scale === second.scale);
     }
     /**
      * Subscribes to every node's and group's `sizeChange` (a per-directive