@logicflow/core 1.1.20 → 1.1.23

package/dist/logic-flow.js

@@ -20392,7 +20392,7 @@ var pick = _flatRest(function(object, paths) {
 
 
 
-var _class, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6, _descriptor7, _descriptor8, _descriptor9, _descriptor10, _descriptor11, _descriptor12, _descriptor13, _descriptor14, _descriptor15, _descriptor16;
+var _class, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6, _descriptor7, _descriptor8, _descriptor9, _descriptor10, _descriptor11, _descriptor12, _descriptor13, _descriptor14, _descriptor15, _descriptor16, _descriptor17;
 
 
 
@@ -20426,7 +20426,7 @@ var SilentConfig = {
   nodeTextDraggable: false,
   edgeTextDraggable: false
 };
-var EditConfigModel_keys = ['isSilentMode', 'stopZoomGraph', 'stopScrollGraph', 'stopMoveGraph', 'adjustEdge', 'adjustEdgeMiddle', 'adjustEdgeStartAndEnd', 'adjustNodePosition', 'hideAnchors', 'hoverOutline', 'nodeSelectedOutline', 'edgeSelectedOutline', 'nodeTextEdit', 'edgeTextEdit', 'nodeTextDraggable', 'edgeTextDraggable', 'multipleSelectKey'];
+var EditConfigModel_keys = ['isSilentMode', 'stopZoomGraph', 'stopScrollGraph', 'stopMoveGraph', 'adjustEdge', 'adjustEdgeMiddle', 'adjustEdgeStartAndEnd', 'adjustNodePosition', 'hideAnchors', 'hoverOutline', 'nodeSelectedOutline', 'edgeSelectedOutline', 'nodeTextEdit', 'edgeTextEdit', 'nodeTextDraggable', 'edgeTextDraggable', 'multipleSelectKey', 'autoExpand'];
 /**
  * 页面编辑配置
  */
@@ -20468,6 +20468,8 @@ var EditConfigModel_EditConfigModel = (_class = /*#__PURE__*/function () {
 
     _initializerDefineProperty(this, "edgeTextDraggable", _descriptor16, this);
 
+    _initializerDefineProperty(this, "autoExpand", _descriptor17, this);
+
     EditConfigModel_defineProperty(this, "multipleSelectKey", '');
 
     EditConfigModel_defineProperty(this, "defaultConfig", {});
@@ -20511,7 +20513,8 @@ var EditConfigModel_EditConfigModel = (_class = /*#__PURE__*/function () {
           nodeTextEdit: this.nodeTextEdit,
           edgeTextEdit: this.edgeTextEdit,
           nodeTextDraggable: this.nodeTextDraggable,
-          edgeTextDraggable: this.edgeTextDraggable
+          edgeTextDraggable: this.edgeTextDraggable,
+          autoExpand: this.autoExpand
         };
         lodash_es_assign(conf, silentConfig);
       } // 如果不传，默认undefined表示允许文本编辑
@@ -20647,6 +20650,13 @@ var EditConfigModel_EditConfigModel = (_class = /*#__PURE__*/function () {
   initializer: function initializer() {
     return false;
   }
+}), _descriptor17 = _applyDecoratedDescriptor(_class.prototype, "autoExpand", [mobx_module["C" /* observable */]], {
+  configurable: true,
+  enumerable: true,
+  writable: true,
+  initializer: function initializer() {
+    return true;
+  }
 }), _applyDecoratedDescriptor(_class.prototype, "updateEditConfig", [mobx_module["k" /* action */]], Object.getOwnPropertyDescriptor(_class.prototype, "updateEditConfig"), _class.prototype)), _class);
 
 
@@ -23399,7 +23409,7 @@ var getMinIndex = function getMinIndex() {
 
 
 
-var BaseEdgeModel_class, BaseEdgeModel_descriptor, BaseEdgeModel_descriptor2, BaseEdgeModel_descriptor3, BaseEdgeModel_descriptor4, BaseEdgeModel_descriptor5, BaseEdgeModel_descriptor6, BaseEdgeModel_descriptor7, BaseEdgeModel_descriptor8, BaseEdgeModel_descriptor9, BaseEdgeModel_descriptor10, BaseEdgeModel_descriptor11, BaseEdgeModel_descriptor12, BaseEdgeModel_descriptor13, BaseEdgeModel_descriptor14, BaseEdgeModel_descriptor15, BaseEdgeModel_descriptor16, _descriptor17, _descriptor18, _descriptor19;
+var BaseEdgeModel_class, BaseEdgeModel_descriptor, BaseEdgeModel_descriptor2, BaseEdgeModel_descriptor3, BaseEdgeModel_descriptor4, BaseEdgeModel_descriptor5, BaseEdgeModel_descriptor6, BaseEdgeModel_descriptor7, BaseEdgeModel_descriptor8, BaseEdgeModel_descriptor9, BaseEdgeModel_descriptor10, BaseEdgeModel_descriptor11, BaseEdgeModel_descriptor12, BaseEdgeModel_descriptor13, BaseEdgeModel_descriptor14, BaseEdgeModel_descriptor15, BaseEdgeModel_descriptor16, BaseEdgeModel_descriptor17, _descriptor18, _descriptor19;
 
 
 
@@ -23478,7 +23488,7 @@ var BaseEdgeModel_BaseEdgeModel = (BaseEdgeModel_class = /*#__PURE__*/function (
 
     BaseEdgeModel_defineProperty(this, "modelType", ModelType.EDGE);
 
-    BaseEdgeModel_initializerDefineProperty(this, "state", _descriptor17, this);
+    BaseEdgeModel_initializerDefineProperty(this, "state", BaseEdgeModel_descriptor17, this);
 
     BaseEdgeModel_defineProperty(this, "additionStateData", void 0);
 
@@ -24126,7 +24136,7 @@ var BaseEdgeModel_BaseEdgeModel = (BaseEdgeModel_class = /*#__PURE__*/function (
   initializer: function initializer() {
     return 0;
   }
-}), _descriptor17 = BaseEdgeModel_applyDecoratedDescriptor(BaseEdgeModel_class.prototype, "state", [mobx_module["C" /* observable */]], {
+}), BaseEdgeModel_descriptor17 = BaseEdgeModel_applyDecoratedDescriptor(BaseEdgeModel_class.prototype, "state", [mobx_module["C" /* observable */]], {
   configurable: true,
   enumerable: true,
   writable: true,
@@ -26385,21 +26395,14 @@ var GraphModel_GraphModel = (GraphModel_class = /*#__PURE__*/function () {
     this.transformModel = new TransformModel_TransfromModel(this.eventCenter);
     this.theme = theme_updateTheme(options.style);
     this.edgeType = options.edgeType || 'polyline';
-
-    if (!options.width) {
-      options.width = container.getBoundingClientRect().width;
-    }
-
-    if (!options.height) {
-      options.height = container.getBoundingClientRect().height;
-    }
-
     this.width = options.width;
     this.height = options.height;
     this.animation = animation_updateAnimation(animation);
     this.partial = options.partial;
     this.overlapMode = options.overlapMode || 0;
     this.idGenerator = idGenerator;
+    this.width = options.width || this.rootEl.getBoundingClientRect().width;
+    this.height = options.height || this.rootEl.getBoundingClientRect().height;
   }
 
   GraphModel_createClass(GraphModel, [{
@@ -26683,6 +26686,10 @@ var GraphModel_GraphModel = (GraphModel_class = /*#__PURE__*/function () {
     value: function graphDataToModel(graphData) {
       var _this = this;
 
+      if (!this.width || !this.height) {
+        this.resize();
+      }
+
       this.nodes = lodash_es_map(graphData.nodes, function (node) {
         var Model = _this.getModel(node.type);
 
@@ -27648,8 +27655,12 @@ var GraphModel_GraphModel = (GraphModel_class = /*#__PURE__*/function () {
   }, {
     key: "resize",
     value: function resize(width, height) {
-      this.width = width !== null && width !== void 0 ? width : this.width;
-      this.height = height !== null && height !== void 0 ? height : this.height;
+      this.width = width || this.rootEl.getBoundingClientRect().width;
+      this.height = height || this.rootEl.getBoundingClientRect().height;
+
+      if (!this.width || !this.height) {
+        console.warn('渲染画布的时候无法获取画布宽高，请确认在container已挂载到DOM。@see https://github.com/didi/LogicFlow/issues/675');
+      }
     }
     /**
      * 清空画布
@@ -32227,6 +32238,39 @@ var SnaplineModel_SnaplineModel = (SnaplineModel_class = /*#__PURE__*/function (
 
 
 
+// CONCATENATED MODULE: ./src/util/raf.ts
+
+
+
+
+
+
+var rafIdMap = new Map();
+var raf_createRaf = function createRaf(callback) {
+  var rafId = uuid_createUuid();
+
+  function run() {
+    callback();
+    var eId = rafIdMap.get(rafId);
+
+    if (eId) {
+      var nId = window.requestAnimationFrame(run);
+      rafIdMap.set(rafId, nId);
+    }
+  }
+
+  var id = window.requestAnimationFrame(run);
+  rafIdMap.set(rafId, id);
+  return rafId;
+};
+var cancelRaf = function cancelRaf(rafId) {
+  var eId = rafIdMap.get(rafId);
+
+  if (eId) {
+    window.cancelAnimationFrame(eId);
+    rafIdMap.delete(rafId);
+  }
+};
 // CONCATENATED MODULE: ./src/view/Anchor.tsx
 function Anchor_typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { Anchor_typeof = function _typeof(obj) { return typeof obj; }; } else { Anchor_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return Anchor_typeof(obj); }
 
@@ -32301,6 +32345,7 @@ function Anchor_defineProperty(obj, key, value) { if (key in obj) { Object.defin
 
 
 
+
 var Anchor_Anchor = /*#__PURE__*/function (_Component) {
   Anchor_inherits(Anchor, _Component);
 
@@ -32363,7 +32408,9 @@ var Anchor_Anchor = /*#__PURE__*/function (_Component) {
           eventCenter = graphModel.eventCenter,
           width = graphModel.width,
           height = graphModel.height,
-          editConfigModel = graphModel.editConfigModel;
+          _graphModel$editConfi = graphModel.editConfigModel,
+          autoExpand = _graphModel$editConfi.autoExpand,
+          stopMoveGraph = _graphModel$editConfi.stopMoveGraph;
       var clientX = event.clientX,
           clientY = event.clientY;
 
@@ -32379,7 +32426,7 @@ var Anchor_Anchor = /*#__PURE__*/function (_Component) {
           y1 = _graphModel$getPointB3.y;
 
       if (_this.t) {
-        clearInterval(_this.t);
+        cancelRaf(_this.t);
       }
 
       var nearBoundary = [];
@@ -32403,8 +32450,8 @@ var Anchor_Anchor = /*#__PURE__*/function (_Component) {
 
       _this.moveAnchorEnd(x1, y1);
 
-      if (nearBoundary.length > 0 && !editConfigModel.stopMoveGraph) {
-        _this.t = setInterval(function () {
+      if (nearBoundary.length > 0 && !stopMoveGraph && autoExpand) {
+        _this.t = raf_createRaf(function () {
           var _nearBoundary = nearBoundary,
               _nearBoundary2 = Anchor_slicedToArray(_nearBoundary, 2),
               translateX = _nearBoundary2[0],
@@ -32421,7 +32468,7 @@ var Anchor_Anchor = /*#__PURE__*/function (_Component) {
           });
 
           _this.moveAnchorEnd(endX - translateX, endY - translateY);
-        }, 50);
+        });
       }
 
       eventCenter.emit(EventType.ANCHOR_DRAG, {
@@ -32433,9 +32480,11 @@ var Anchor_Anchor = /*#__PURE__*/function (_Component) {
 
     Anchor_defineProperty(Anchor_assertThisInitialized(_this), "onDragEnd", function (event) {
       if (_this.t) {
-        clearInterval(_this.t);
+        cancelRaf(_this.t);
       }
 
+      console.log(555, 'dragend');
+
       _this.checkEnd(event);
 
       _this.setState({
@@ -33026,39 +33075,6 @@ var BaseText_BaseText = /*#__PURE__*/function (_Component) {
 
 
 var isIe = window.navigator.userAgent.match(/MSIE|Trident/) !== null;
-// CONCATENATED MODULE: ./src/util/raf.ts
-
-
-
-
-
-
-var rafIdMap = new Map();
-var raf_createRaf = function createRaf(callback) {
-  var rafId = uuid_createUuid();
-
-  function run() {
-    callback();
-    var eId = rafIdMap.get(rafId);
-
-    if (eId) {
-      var nId = window.requestAnimationFrame(run);
-      rafIdMap.set(rafId, nId);
-    }
-  }
-
-  var id = window.requestAnimationFrame(run);
-  rafIdMap.set(rafId, id);
-  return rafId;
-};
-var cancelRaf = function cancelRaf(rafId) {
-  var eId = rafIdMap.get(rafId);
-
-  if (eId) {
-    window.cancelAnimationFrame(eId);
-    rafIdMap.delete(rafId);
-  }
-};
 // CONCATENATED MODULE: ./src/view/node/BaseNode.tsx
 function BaseNode_typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { BaseNode_typeof = function _typeof(obj) { return typeof obj; }; } else { BaseNode_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return BaseNode_typeof(obj); }
 
@@ -33174,7 +33190,9 @@ var BaseNode_BaseNode = /*#__PURE__*/function (_Component) {
           model = _this$props2.model,
           graphModel = _this$props2.graphModel; // const { isDragging } = model;
 
-      var editConfigModel = graphModel.editConfigModel,
+      var _graphModel$editConfi = graphModel.editConfigModel,
+          stopMoveGraph = _graphModel$editConfi.stopMoveGraph,
+          autoExpand = _graphModel$editConfi.autoExpand,
           transformModel = graphModel.transformModel,
           width = graphModel.width,
           height = graphModel.height,
@@ -33194,12 +33212,7 @@ var BaseNode_BaseNode = /*#__PURE__*/function (_Component) {
       var _transformModel$Canva = transformModel.CanvasPointToHtmlPoint([x, y]),
           _transformModel$Canva2 = BaseNode_slicedToArray(_transformModel$Canva, 2),
           x1 = _transformModel$Canva2[0],
-          y1 = _transformModel$Canva2[1];
-
-      if (x1 < 0 || y1 < 0 || x1 > width || y1 > height) {
-        // 鼠标超出画布后的拖动，不处理，而是让上一次setInterval持续滚动画布
-        return;
-      } // 1. 考虑画布被缩放
+          y1 = _transformModel$Canva2[1]; // 1. 考虑画布被缩放
       // 2. 考虑鼠标位置不再节点中心
 
 
@@ -33207,7 +33220,20 @@ var BaseNode_BaseNode = /*#__PURE__*/function (_Component) {
       y = y + _this.moveOffset.y; // 将x, y移动到grid上
 
       x = snapToGrid(x, gridSize);
-      y = snapToGrid(y, gridSize); // 取节点左上角和右下角，计算节点移动是否超出范围
+      y = snapToGrid(y, gridSize);
+
+      if (!width || !height) {
+        graphModel.moveNode2Coordinate(model.id, x, y);
+        return;
+      }
+
+      var isOutCanvas = x1 < 0 || y1 < 0 || x1 > width || y1 > height;
+
+      if (autoExpand && !stopMoveGraph && isOutCanvas) {
+        // 鼠标超出画布后的拖动，不处理，而是让上一次setInterval持续滚动画布
+        return;
+      } // 取节点左上角和右下角，计算节点移动是否超出范围
+
 
       var _transformModel$Canva3 = transformModel.CanvasPointToHtmlPoint([x - model.width / 2, y - model.height / 2]),
           _transformModel$Canva4 = BaseNode_slicedToArray(_transformModel$Canva3, 2),
@@ -33236,7 +33262,7 @@ var BaseNode_BaseNode = /*#__PURE__*/function (_Component) {
         cancelRaf(_this.t);
       }
 
-      if (nearBoundary.length > 0 && !editConfigModel.stopMoveGraph) {
+      if (nearBoundary.length > 0 && !stopMoveGraph && autoExpand) {
         _this.t = raf_createRaf(function () {
           var _nearBoundary = nearBoundary,
               _nearBoundary2 = BaseNode_slicedToArray(_nearBoundary, 2),
@@ -33525,9 +33551,9 @@ var BaseNode_BaseNode = /*#__PURE__*/function (_Component) {
       var _this$props11 = this.props,
           model = _this$props11.model,
           graphModel = _this$props11.graphModel;
-      var _graphModel$editConfi = graphModel.editConfigModel,
-          hideAnchors = _graphModel$editConfi.hideAnchors,
-          adjustNodePosition = _graphModel$editConfi.adjustNodePosition,
+      var _graphModel$editConfi2 = graphModel.editConfigModel,
+          hideAnchors = _graphModel$editConfi2.hideAnchors,
+          adjustNodePosition = _graphModel$editConfi2.adjustNodePosition,
           gridSize = graphModel.gridSize,
           SCALE_X = graphModel.transformModel.SCALE_X;
       var isHitable = model.isHitable,
@@ -38108,14 +38134,15 @@ var LogicFlow_LogicFlow = /*#__PURE__*/function () {
     }
     /**
      * 重新设置画布的宽高
+     * 不传会自动计算画布宽高
      */
 
   }, {
     key: "resize",
     value: function resize(width, height) {
-      this.options.width = width !== null && width !== void 0 ? width : this.options.width;
-      this.options.height = height !== null && height !== void 0 ? height : this.options.height;
       this.graphModel.resize(width, height);
+      this.options.width = this.graphModel.width;
+      this.options.height = this.graphModel.height;
     }
     /**
      * 设置默认的边类型。