@logicflow/extension 2.1.5 → 2.1.6

package/es/components/mini-map/index.js

@@ -9,7 +9,6 @@ var __values = (this && this.__values) || function(o) {
     };
     throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
 };
-import { createTeleportContainer, destroyTeleportContainer, } from '@logicflow/vue-node-registry';
 var MiniMap = /** @class */ (function () {
     function MiniMap(_a) {
         var lf = _a.lf, LogicFlow = _a.LogicFlow, options = _a.options;
@@ -107,8 +106,6 @@ var MiniMap = /** @class */ (function () {
          */
         this.hide = function () {
             if (_this.isShow) {
-                // 隐藏小地图时摧毁实例
-                destroyTeleportContainer(_this.lfMap.graphModel.flowId);
                 _this.lf.off('graph:resize', _this.onGraphResize);
                 _this.lfMap.destroy();
                 // 保证重新创建实例时，小地图中内容偏移正确
@@ -279,12 +276,11 @@ var MiniMap = /** @class */ (function () {
             history: false,
             snapline: false,
             disabledPlugins: this.disabledPlugins,
+            isMiniMap: true,
         });
         // minimap中禁用adapter。
         // this.lfMap.adapterIn = (a) => a
         // this.lfMap.adapterOut = (a) => a
-        // 创建teleport容器（vue3中生效）
-        createTeleportContainer(miniMapWrap, this.lfMap.graphModel.flowId);
         this.miniMapWrap = miniMapWrap;
         this.createViewPort();
         miniMapWrap.addEventListener('click', this.mapClick);
@@ -526,7 +522,6 @@ var MiniMap = /** @class */ (function () {
         this.viewport = div;
     };
     MiniMap.prototype.destroy = function () {
-        destroyTeleportContainer(this.lfMap.graphModel.flowId);
         this.lf.off('graph:resize', this.onGraphResize);
     };
     MiniMap.pluginName = 'miniMap';

package/es/components/selection-select/index.d.ts

@@ -12,6 +12,7 @@ export declare class SelectionSelect {
     private disabled;
     private isWholeNode;
     private isWholeEdge;
+    private originStatusSaved;
     exclusiveMode: boolean;
     private mouseDownInfo;
     private originalStopMoveGraph;

package/es/components/selection-select/index.js

@@ -32,6 +32,7 @@ var SelectionSelect = /** @class */ (function () {
         this.disabled = true;
         this.isWholeNode = true;
         this.isWholeEdge = true;
+        this.originStatusSaved = false;
         this.exclusiveMode = false; // 框选独占模式：true 表示只能进行框选操作，false 表示可以同时进行其他画布操作
         // 用于区分选区和点击事件
         this.mouseDownInfo = null;
@@ -73,6 +74,11 @@ var SelectionSelect = /** @class */ (function () {
             }
         };
         this.drawOff = function (e) {
+            // 恢复原始的 stopMoveGraph 设置
+            _this.lf.updateEditConfig({
+                stopMoveGraph: _this.originalStopMoveGraph,
+            });
+            _this.originStatusSaved = false;
             // 处理鼠标抬起事件
             // 首先判断是否是点击，如果是，则清空框选
             if (_this.mouseDownInfo) {
@@ -92,10 +98,6 @@ var SelectionSelect = /** @class */ (function () {
             if (!_this.exclusiveMode) {
                 document.removeEventListener('mouseup', _this.drawOff);
             }
-            // 恢复原始的 stopMoveGraph 设置
-            _this.lf.updateEditConfig({
-                stopMoveGraph: _this.originalStopMoveGraph,
-            });
             if (curStartPoint && curEndPoint) {
                 var x = curStartPoint.x, y = curStartPoint.y;
                 var x1 = curEndPoint.x, y1 = curEndPoint.y;
@@ -270,7 +272,11 @@ var SelectionSelect = /** @class */ (function () {
             time: Date.now(),
         };
         // 记录原始设置并临时禁止画布移动
-        this.originalStopMoveGraph = this.lf.getEditConfig().stopMoveGraph;
+        if (!this.originStatusSaved) {
+            // 为了防止在开启框选时用户多次点击画布导致缓存的stopMoveGraph变化，所以只在第一次点击时记录原始的stopMoveGraph issue #2263
+            this.originalStopMoveGraph = this.lf.getEditConfig().stopMoveGraph;
+            this.originStatusSaved = true;
+        }
         this.lf.updateEditConfig({
             stopMoveGraph: true,
         });

package/lib/components/mini-map/index.js

@@ -12,7 +12,6 @@ var __values = (this && this.__values) || function(o) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MiniMap = void 0;
-var vue_node_registry_1 = require("@logicflow/vue-node-registry");
 var MiniMap = /** @class */ (function () {
     function MiniMap(_a) {
         var lf = _a.lf, LogicFlow = _a.LogicFlow, options = _a.options;
@@ -110,8 +109,6 @@ var MiniMap = /** @class */ (function () {
          */
         this.hide = function () {
             if (_this.isShow) {
-                // 隐藏小地图时摧毁实例
-                (0, vue_node_registry_1.destroyTeleportContainer)(_this.lfMap.graphModel.flowId);
                 _this.lf.off('graph:resize', _this.onGraphResize);
                 _this.lfMap.destroy();
                 // 保证重新创建实例时，小地图中内容偏移正确
@@ -282,12 +279,11 @@ var MiniMap = /** @class */ (function () {
             history: false,
             snapline: false,
             disabledPlugins: this.disabledPlugins,
+            isMiniMap: true,
         });
         // minimap中禁用adapter。
         // this.lfMap.adapterIn = (a) => a
         // this.lfMap.adapterOut = (a) => a
-        // 创建teleport容器（vue3中生效）
-        (0, vue_node_registry_1.createTeleportContainer)(miniMapWrap, this.lfMap.graphModel.flowId);
         this.miniMapWrap = miniMapWrap;
         this.createViewPort();
         miniMapWrap.addEventListener('click', this.mapClick);
@@ -529,7 +525,6 @@ var MiniMap = /** @class */ (function () {
         this.viewport = div;
     };
     MiniMap.prototype.destroy = function () {
-        (0, vue_node_registry_1.destroyTeleportContainer)(this.lfMap.graphModel.flowId);
         this.lf.off('graph:resize', this.onGraphResize);
     };
     MiniMap.pluginName = 'miniMap';

package/lib/components/selection-select/index.d.ts

@@ -12,6 +12,7 @@ export declare class SelectionSelect {
     private disabled;
     private isWholeNode;
     private isWholeEdge;
+    private originStatusSaved;
     exclusiveMode: boolean;
     private mouseDownInfo;
     private originalStopMoveGraph;

package/lib/components/selection-select/index.js

@@ -35,6 +35,7 @@ var SelectionSelect = /** @class */ (function () {
         this.disabled = true;
         this.isWholeNode = true;
         this.isWholeEdge = true;
+        this.originStatusSaved = false;
         this.exclusiveMode = false; // 框选独占模式：true 表示只能进行框选操作，false 表示可以同时进行其他画布操作
         // 用于区分选区和点击事件
         this.mouseDownInfo = null;
@@ -76,6 +77,11 @@ var SelectionSelect = /** @class */ (function () {
             }
         };
         this.drawOff = function (e) {
+            // 恢复原始的 stopMoveGraph 设置
+            _this.lf.updateEditConfig({
+                stopMoveGraph: _this.originalStopMoveGraph,
+            });
+            _this.originStatusSaved = false;
             // 处理鼠标抬起事件
             // 首先判断是否是点击，如果是，则清空框选
             if (_this.mouseDownInfo) {
@@ -95,10 +101,6 @@ var SelectionSelect = /** @class */ (function () {
             if (!_this.exclusiveMode) {
                 document.removeEventListener('mouseup', _this.drawOff);
             }
-            // 恢复原始的 stopMoveGraph 设置
-            _this.lf.updateEditConfig({
-                stopMoveGraph: _this.originalStopMoveGraph,
-            });
             if (curStartPoint && curEndPoint) {
                 var x = curStartPoint.x, y = curStartPoint.y;
                 var x1 = curEndPoint.x, y1 = curEndPoint.y;
@@ -273,7 +275,11 @@ var SelectionSelect = /** @class */ (function () {
             time: Date.now(),
         };
         // 记录原始设置并临时禁止画布移动
-        this.originalStopMoveGraph = this.lf.getEditConfig().stopMoveGraph;
+        if (!this.originStatusSaved) {
+            // 为了防止在开启框选时用户多次点击画布导致缓存的stopMoveGraph变化，所以只在第一次点击时记录原始的stopMoveGraph issue #2263
+            this.originalStopMoveGraph = this.lf.getEditConfig().stopMoveGraph;
+            this.originStatusSaved = true;
+        }
         this.lf.updateEditConfig({
             stopMoveGraph: true,
         });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@logicflow/extension",
-  "version": "2.1.5",
+  "version": "2.1.6",
   "description": "LogicFlow Extensions",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -20,8 +20,8 @@
   "author": "Logicflow-Team",
   "license": "Apache-2.0",
   "peerDependencies": {
-    "@logicflow/vue-node-registry": "1.1.4",
-    "@logicflow/core": "2.1.3"
+    "@logicflow/core": "2.1.4",
+    "@logicflow/vue-node-registry": "1.1.5"
   },
   "dependencies": {
     "@antv/hierarchy": "^0.6.11",
@@ -32,8 +32,8 @@
     "preact": "^10.17.1",
     "rangy": "^1.3.1",
     "vanilla-picker": "^2.12.3",
-    "@logicflow/core": "2.1.3",
-    "@logicflow/vue-node-registry": "1.1.4"
+    "@logicflow/core": "2.1.4",
+    "@logicflow/vue-node-registry": "1.1.5"
   },
   "devDependencies": {
     "less": "^4.1.1",

package/src/components/mini-map/index.ts

@@ -1,8 +1,4 @@
 import LogicFlow from '@logicflow/core'
-import {
-  createTeleportContainer,
-  destroyTeleportContainer,
-} from '@logicflow/vue-node-registry'
 
 import Position = LogicFlow.Position
 import MiniMapOption = MiniMap.MiniMapOption
@@ -240,8 +236,6 @@ export class MiniMap {
    */
   public hide = () => {
     if (this.isShow) {
-      // 隐藏小地图时摧毁实例
-      destroyTeleportContainer(this.lfMap.graphModel.flowId)
       this.lf.off('graph:resize', this.onGraphResize)
       this.lfMap.destroy()
       // 保证重新创建实例时，小地图中内容偏移正确
@@ -363,14 +357,12 @@ export class MiniMap {
       history: false,
       snapline: false,
       disabledPlugins: this.disabledPlugins,
+      isMiniMap: true,
     })
     // minimap中禁用adapter。
     // this.lfMap.adapterIn = (a) => a
     // this.lfMap.adapterOut = (a) => a
 
-    // 创建teleport容器（vue3中生效）
-    createTeleportContainer(miniMapWrap, this.lfMap.graphModel.flowId)
-
     this.miniMapWrap = miniMapWrap
     this.createViewPort()
     miniMapWrap.addEventListener('click', this.mapClick)
@@ -687,7 +679,6 @@ export class MiniMap {
   }
 
   destroy() {
-    destroyTeleportContainer(this.lfMap.graphModel.flowId)
     this.lf.off('graph:resize', this.onGraphResize)
   }
 }

package/src/components/selection-select/index.ts

@@ -18,6 +18,7 @@ export class SelectionSelect {
   private disabled = true
   private isWholeNode = true
   private isWholeEdge = true
+  private originStatusSaved = false
   exclusiveMode = false // 框选独占模式：true 表示只能进行框选操作，false 表示可以同时进行其他画布操作
   // 用于区分选区和点击事件
   private mouseDownInfo: {
@@ -97,7 +98,6 @@ export class SelectionSelect {
 
   private addEventListeners() {
     if (!this.container) return
-
     if (this.exclusiveMode) {
       // 独占模式：监听 container 的 mousedown 事件
       this.container.style.pointerEvents = 'auto'
@@ -143,9 +143,12 @@ export class SelectionSelect {
       y: e.clientY,
       time: Date.now(),
     }
-
     // 记录原始设置并临时禁止画布移动
-    this.originalStopMoveGraph = this.lf.getEditConfig().stopMoveGraph!
+    if (!this.originStatusSaved) {
+      // 为了防止在开启框选时用户多次点击画布导致缓存的stopMoveGraph变化，所以只在第一次点击时记录原始的stopMoveGraph issue #2263
+      this.originalStopMoveGraph = this.lf.getEditConfig().stopMoveGraph!
+      this.originStatusSaved = true
+    }
     this.lf.updateEditConfig({
       stopMoveGraph: true,
     })
@@ -249,6 +252,11 @@ export class SelectionSelect {
     }
   }
   private drawOff = (e: MouseEvent) => {
+    // 恢复原始的 stopMoveGraph 设置
+    this.lf.updateEditConfig({
+      stopMoveGraph: this.originalStopMoveGraph,
+    })
+    this.originStatusSaved = false
     // 处理鼠标抬起事件
     // 首先判断是否是点击，如果是，则清空框选
     if (this.mouseDownInfo) {
@@ -271,11 +279,6 @@ export class SelectionSelect {
       document.removeEventListener('mouseup', this.drawOff)
     }
 
-    // 恢复原始的 stopMoveGraph 设置
-    this.lf.updateEditConfig({
-      stopMoveGraph: this.originalStopMoveGraph,
-    })
-
     if (curStartPoint && curEndPoint) {
       const { x, y } = curStartPoint
       const { x: x1, y: y1 } = curEndPoint