@logicflow/extension 1.0.0-alpha.0 → 1.0.0-alpha.6

package/cjs/NodeResize/Control/Control.js

@@ -120,7 +120,7 @@ var Control = /** @class */ (function (_super) {
                 beforeNode: beforeNode,
                 afterNode: afterNode,
             };
-            // 更新连线
+            // 更新边
             var afterPoint;
             edges.sourceEdges.forEach(function (item) {
                 params.point = item.startPoint;
@@ -183,7 +183,7 @@ var Control = /** @class */ (function (_super) {
                 beforeNode: beforeNode,
                 afterNode: afterNode,
             };
-            // 更新连线
+            // 更新边
             var afterPoint;
             edges.sourceEdges.forEach(function (item) {
                 params.point = item.startPoint;
@@ -245,7 +245,7 @@ var Control = /** @class */ (function (_super) {
                 beforeNode: beforeNode,
                 afterNode: afterNode,
             };
-            // 更新连线
+            // 更新边
             var afterPoint;
             var edges = _this.getNodeEdges(id);
             edges.sourceEdges.forEach(function (item) {
@@ -281,7 +281,7 @@ var Control = /** @class */ (function (_super) {
             }
         };
         _this.index = props.index;
-        _this.nodeModel = props.nodeModel;
+        _this.nodeModel = props.model;
         _this.graphModel = props.graphModel;
         var gridSize = _this.graphModel.gridSize;
         // 为保证对齐线功能正常使用，step默认是网格grid的两倍，

package/cjs/NodeResize/Control/ControlGroup.js

@@ -36,7 +36,8 @@ var ControlGroup = /** @class */ (function (_super) {
         return _this;
     }
     ControlGroup.prototype.getResizeControl = function () {
-        var _a = this.props, x = _a.x, y = _a.y, width = _a.width, height = _a.height, nodeModel = _a.nodeModel, graphModel = _a.graphModel;
+        var _a = this.props, model = _a.model, graphModel = _a.graphModel;
+        var x = model.x, y = model.y, width = model.width, height = model.height;
         var box = {
             minX: x - width / 2,
             minY: y - height / 2,
@@ -62,11 +63,11 @@ var ControlGroup = /** @class */ (function (_super) {
                 y: maxY,
             },
         ];
-        return controlList.map(function (control, index) { return (preact_1.h(Control_1.default, __assign({ index: index }, control, { nodeModel: nodeModel, graphModel: graphModel }))); });
+        return controlList.map(function (control, index) { return (preact_1.h(Control_1.default, __assign({ index: index }, control, { model: model, graphModel: graphModel }))); });
     };
     // 一般节点被选中了会有outline, 先不用这个
     ControlGroup.prototype.getGroupSolid = function () {
-        var _a = this.props, x = _a.x, y = _a.y, width = _a.width, height = _a.height;
+        var _a = this.props.model, x = _a.x, y = _a.y, width = _a.width, height = _a.height;
         var _b = index_1.default.style.outline, stroke = _b.stroke, strokeWidth = _b.strokeWidth, strokeDasharray = _b.strokeDasharray;
         return (preact_1.h(Rect_1.default, { fill: "none", x: x, y: y, width: width, height: height, stroke: stroke, strokeWidth: strokeWidth, strokeDasharray: strokeDasharray }));
     };

package/cjs/NodeResize/Node/DiamondResize.js

@@ -48,21 +48,23 @@ var DiamondResizeView = /** @class */ (function (_super) {
     function DiamondResizeView() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
-    DiamondResizeView.prototype.getControlGroup = function (attributes) {
+    DiamondResizeView.prototype.getControlGroup = function () {
         var _a = this.props, model = _a.model, graphModel = _a.graphModel;
-        return (core_1.h(ControlGroup_1.default, __assign({}, attributes, { nodeModel: model, graphModel: graphModel })));
+        return (core_1.h(ControlGroup_1.default, { model: model, graphModel: graphModel }));
     };
     // getResizeShape绘制图形，功能等同于基础菱形的getShape功能，可以通过复写此方法，进行节点自定义
-    DiamondResizeView.prototype.getResizeShape = function (arrt) {
-        return core_1.h("g", null,
-            core_1.h(Polygon_1.default, __assign({}, arrt)));
+    DiamondResizeView.prototype.getResizeShape = function () {
+        var model = this.props.model;
+        var points = model.points;
+        var style = model.getNodeStyle();
+        return (core_1.h("g", null,
+            core_1.h(Polygon_1.default, __assign({}, style, { points: points }))));
     };
     DiamondResizeView.prototype.getShape = function () {
-        var attributes = _super.prototype.getAttributes.call(this);
         var isSelected = this.props.model.isSelected;
         return (core_1.h("g", null,
-            this.getResizeShape(attributes),
-            isSelected ? this.getControlGroup(attributes) : ''));
+            this.getResizeShape(),
+            isSelected ? this.getControlGroup() : ''));
     };
     return DiamondResizeView;
 }(core_1.DiamondNode));

package/cjs/NodeResize/Node/EllipseResize.js

@@ -53,21 +53,23 @@ var EllipseResizeView = /** @class */ (function (_super) {
     function EllipseResizeView() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
-    EllipseResizeView.prototype.getControlGroup = function (attributes) {
+    EllipseResizeView.prototype.getControlGroup = function () {
         var _a = this.props, model = _a.model, graphModel = _a.graphModel;
-        return (core_1.h(ControlGroup_1.default, __assign({}, attributes, { nodeModel: model, graphModel: graphModel })));
+        return (core_1.h(ControlGroup_1.default, { model: model, graphModel: graphModel }));
     };
     // getResizeShape绘制图形，功能等同于基础椭圆的getShape功能，可以通过复写此方法，进行节点自定义
-    EllipseResizeView.prototype.getResizeShape = function (arrt) {
-        return core_1.h("g", null,
-            core_1.h(Ellipse_1.default, __assign({}, arrt)));
+    EllipseResizeView.prototype.getResizeShape = function () {
+        var model = this.props.model;
+        var rx = model.rx, ry = model.ry, x = model.x, y = model.y;
+        var style = model.getNodeStyle();
+        return (core_1.h("g", null,
+            core_1.h(Ellipse_1.default, __assign({}, style, { rx: rx, ry: ry, x: x, y: y }))));
     };
     EllipseResizeView.prototype.getShape = function () {
-        var attributes = _super.prototype.getAttributes.call(this);
-        var isSelected = this.props.model.isSelected;
+        var model = this.props.model;
         return (core_1.h("g", null,
-            this.getResizeShape(attributes),
-            isSelected ? this.getControlGroup(attributes) : ''));
+            this.getResizeShape(),
+            model.isSelected ? this.getControlGroup() : ''));
     };
     return EllipseResizeView;
 }(core_1.EllipseNode));

package/cjs/NodeResize/Node/RectResize.js

@@ -12,17 +12,6 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 var core_1 = require("@logicflow/core");
 var ControlGroup_1 = require("../Control/ControlGroup");
@@ -52,20 +41,19 @@ var RectResizeView = /** @class */ (function (_super) {
     function RectResizeView() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
-    RectResizeView.prototype.getControlGroup = function (attributes) {
+    RectResizeView.prototype.getControlGroup = function () {
         var _a = this.props, model = _a.model, graphModel = _a.graphModel;
-        return (core_1.h(ControlGroup_1.default, __assign({}, attributes, { nodeModel: model, graphModel: graphModel })));
+        return (core_1.h(ControlGroup_1.default, { model: model, graphModel: graphModel }));
     };
     // getResizeShape绘制图形，功能等同于基础矩形的getShape功能，可以通过复写此方法，进行节点自定义
     RectResizeView.prototype.getResizeShape = function () {
         return _super.prototype.getShape.call(this);
     };
     RectResizeView.prototype.getShape = function () {
-        var attributes = _super.prototype.getAttributes.call(this);
         var isSelected = this.props.model.isSelected;
         return (core_1.h("g", null,
             this.getResizeShape(),
-            isSelected ? this.getControlGroup(attributes) : ''));
+            isSelected ? this.getControlGroup() : ''));
     };
     return RectResizeView;
 }(core_1.RectNode));

package/cjs/bpmn/events/EndEvent.js

@@ -12,6 +12,17 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EndEventModel = exports.EndEventView = void 0;
 var core_1 = require("@logicflow/core");
@@ -36,10 +47,13 @@ var EndEventModel = /** @class */ (function (_super) {
         _this = _super.call(this, data, graphModel) || this;
         return _this;
     }
+    EndEventModel.prototype.setAttributes = function () {
+        this.r = 18;
+    };
     EndEventModel.prototype.getConnectedSourceRules = function () {
         var rules = _super.prototype.getConnectedSourceRules.call(this);
         var notAsSource = {
-            message: '结束节点不能作为连线的起点',
+            message: '结束节点不能作为边的起点',
             validate: function () { return false; },
         };
         rules.push(notAsSource);
@@ -60,16 +74,11 @@ var EndEventView = /** @class */ (function (_super) {
         };
     };
     EndEventView.prototype.getShape = function () {
-        var _a = this.getAttributes(), x = _a.x, y = _a.y, fill = _a.fill, stroke = _a.stroke, strokeWidth = _a.strokeWidth, r = _a.r;
+        var model = this.props.model;
+        var style = model.getNodeStyle();
+        var x = model.x, y = model.y, r = model.r;
         var outCircle = _super.prototype.getShape.call(this);
-        return core_1.h('g', {}, outCircle, core_1.h('circle', {
-            cx: x,
-            cy: y,
-            fill: fill,
-            stroke: stroke,
-            strokeWidth: strokeWidth,
-            r: r - 5,
-        }));
+        return core_1.h('g', {}, outCircle, core_1.h('circle', __assign(__assign({}, style), { cx: x, cy: y, r: r - 5 })));
     };
     EndEventView.extendKey = 'EndEventView';
     return EndEventView;

package/cjs/bpmn/events/StartEvent.js

@@ -12,17 +12,6 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.StartEventView = exports.StartEventModel = void 0;
 var core_1 = require("@logicflow/core");
@@ -49,10 +38,13 @@ var StartEventModel = /** @class */ (function (_super) {
         _this = _super.call(this, data, graphModel) || this;
         return _this;
     }
+    StartEventModel.prototype.setAttributes = function () {
+        this.r = 18;
+    };
     StartEventModel.prototype.getConnectedTargetRules = function () {
         var rules = _super.prototype.getConnectedTargetRules.call(this);
         var notAsTarget = {
-            message: '起始节点不能作为连线的终点',
+            message: '起始节点不能作为边的终点',
             validate: function () { return false; },
         };
         rules.push(notAsTarget);
@@ -67,10 +59,6 @@ var StartEventView = /** @class */ (function (_super) {
     function StartEventView() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
-    StartEventView.prototype.getAttributes = function () {
-        var attr = _super.prototype.getAttributes.call(this);
-        return __assign({}, attr);
-    };
     StartEventView.extendKey = 'StartEventNode';
     return StartEventView;
 }(core_1.CircleNode));

package/cjs/bpmn/gateways/ExclusiveGateway.js

@@ -12,6 +12,17 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ExclusiveGatewayModel = exports.ExclusiveGatewayView = void 0;
 var core_1 = require("@logicflow/core");
@@ -52,23 +63,14 @@ var ExclusiveGatewayView = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     ExclusiveGatewayView.prototype.getShape = function () {
-        var attributes = _super.prototype.getAttributes.call(this);
-        var x = attributes.x, y = attributes.y, fill = attributes.fill, stroke = attributes.stroke, strokeWidth = attributes.strokeWidth, width = attributes.width, height = attributes.height, points = attributes.points;
+        var model = this.props.model;
+        var x = model.x, y = model.y, width = model.width, height = model.height, points = model.points;
+        var style = model.getNodeStyle();
         return core_1.h('g', {
             transform: "matrix(1 0 0 1 " + (x - width / 2) + " " + (y - height / 2) + ")",
-        }, core_1.h('polygon', {
-            fill: fill,
-            x: x,
+        }, core_1.h('polygon', __assign(__assign({}, style), { x: x,
             y: y,
-            stroke: stroke,
-            strokeWidth: strokeWidth,
-            points: points,
-        }), core_1.h('path', {
-            fill: fill,
-            stroke: stroke,
-            strokeWidth: strokeWidth,
-            d: 'm 16,15 7.42857142857143,9.714285714285715 -7.42857142857143,9.714285714285715 3.428571428571429,0 5.714285714285715,-7.464228571428572 5.714285714285715,7.464228571428572 3.428571428571429,0 -7.42857142857143,-9.714285714285715 7.42857142857143,-9.714285714285715 -3.428571428571429,0 -5.714285714285715,7.464228571428572 -5.714285714285715,-7.464228571428572 -3.428571428571429,0 z',
-        }));
+            points: points })), core_1.h('path', __assign({ d: 'm 16,15 7.42857142857143,9.714285714285715 -7.42857142857143,9.714285714285715 3.428571428571429,0 5.714285714285715,-7.464228571428572 5.714285714285715,7.464228571428572 3.428571428571429,0 -7.42857142857143,-9.714285714285715 7.42857142857143,-9.714285714285715 -3.428571428571429,0 -5.714285714285715,7.464228571428572 -5.714285714285715,-7.464228571428572 -3.428571428571429,0 z' }, style)));
     };
     ExclusiveGatewayView.extendKey = 'ExclusiveGatewayNode';
     return ExclusiveGatewayView;

package/cjs/bpmn/index.js

@@ -31,7 +31,7 @@ var BpmnElement = /** @class */ (function () {
         lf.register(ExclusiveGateway_1.default);
         lf.register(UserTask_1.default);
         lf.register(ServiceTask_1.default);
-        // 支持自定义bpmn元素的连线
+        // 支持自定义bpmn元素的边
         if (!lf.options.customBpmnEdge) {
             lf.register(SequenceFlow_1.default);
             lf.setDefaultEdgeType('bpmn:sequenceFlow');

package/cjs/bpmn/tasks/ServiceTask.js

@@ -12,6 +12,17 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ServiceTaskModel = exports.ServiceTaskView = void 0;
 var core_1 = require("@logicflow/core");
@@ -36,8 +47,9 @@ var ServiceTaskView = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     ServiceTaskView.prototype.getLabelShape = function () {
-        var attributes = _super.prototype.getAttributes.call(this);
-        var x = attributes.x, y = attributes.y, width = attributes.width, height = attributes.height, stroke = attributes.stroke;
+        var model = this.props.model;
+        var x = model.x, y = model.y, width = model.width, height = model.height;
+        var style = model.getNodeStyle();
         return core_1.h('svg', {
             x: x - width / 2 + 5,
             y: y - height / 2 + 5,
@@ -45,26 +57,17 @@ var ServiceTaskView = /** @class */ (function (_super) {
             height: 30,
             viewBox: '0 0 1274 1024',
         }, core_1.h('path', {
-            fill: stroke,
+            fill: style.stroke,
             d: 'M882.527918 434.149934c-2.234901-5.303796-7.311523-8.853645-13.059434-9.138124l-61.390185-3.009544c-6.635117-20.973684-15.521508-41.175795-26.513864-60.282968l42.051745-47.743374c4.308119-4.889357 4.955872-12.004405 1.602498-17.59268-46.384423-77.30362-103.969956-101.422947-106.400309-102.410438-5.332449-2.170432-11.432377-1.090844-15.693424 2.77009L654.674467 240.664222c-17.004279-8.654101-35.092239-15.756869-53.995775-21.210068l-3.26537-66.490344c-0.280386-5.747911-3.833305-10.824533-9.134031-13.059434-1.683339-0.709151-30.193673-12.391215-76.866668-12.051477-46.672996-0.339738-75.18333 11.342326-76.866668 12.051477-5.300726 2.234901-8.853645 7.311523-9.134031 13.059434l-3.26537 66.490344c-18.903535 5.453199-36.991496 12.555967-53.995775 21.210068l-48.450479-43.922349c-4.261047-3.860934-10.360975-4.940522-15.693424-2.77009-2.430352 0.98749-60.015885 25.106818-106.400309 102.410438-3.353374 5.588275-2.705622 12.703323 1.602498 17.59268l42.051745 47.743374c-10.992355 19.107173-19.878746 39.309284-26.513864 60.282968l-61.390185 3.009544c-5.747911 0.284479-10.824533 3.834328-13.059434 9.138124-1.01512 2.415003-24.687262 60.190871-2.822278 147.651828 1.583055 6.324032 7.072069 10.893094 13.57518 11.308557 5.892197 0.37146 11.751648 0.523933 17.419741 0.667196 14.498202 0.372483 28.193109 0.723477 40.908712 4.63353 4.212952 1.294482 6.435573 8.270361 9.349949 18.763342 1.287319 4.640694 2.617617 9.43693 4.484128 14.010085 1.794879 4.393054 3.75758 8.570189 5.66093 12.607132 1.302669 2.765997 2.529613 5.380544 3.689019 8.018627 2.986007 6.803963 2.682086 9.773598 2.578732 10.349719-3.061732 3.672646-6.391571 7.238868-9.91379 11.015891-1.810229 1.943258-3.680832 3.949962-5.523807 5.980201l-22.560832 24.8909c-3.865028 4.261047-4.940522 10.365068-2.774183 15.693424 0.991584 2.426259 25.102724 60.011792 102.414531 106.400309 5.588275 3.353374 12.703323 2.701528 17.591657-1.603521l23.476691-20.682042c2.346441-2.061962 4.64888-4.336772 6.875594-6.534833 9.05319-8.93858 14.018272-12.95608 17.73185-11.576663 3.305279 1.222851 6.907317 3.166109 10.720156 5.228071 3.325745 1.794879 6.764054 3.650133 10.465352 5.288446 6.016017 2.662643 12.120039 4.688789 18.019399 6.65149 6.827499 2.266623 13.279445 4.409426 18.819624 7.275707 1.518586 0.782829 1.926886 0.994654 2.358721 7.830339 0.726547 11.496845 1.25048 23.276123 1.753947 34.672684 0.264013 5.900384 0.528026 11.803837 0.815575 17.700127 0.284479 5.743818 3.833305 10.82044 9.138124 13.05534 1.654686 0.698918 29.371958 12.063757 74.869175 12.063757 0.328481 0 3.65832 0 3.986801 0 45.497217 0 73.214489-11.364839 74.869175-12.063757 5.304819-2.234901 8.853645-7.311523 9.138124-13.05534 0.287549-5.89629 0.551562-11.799744 0.815575-17.700127 0.503467-11.396561 1.027399-23.175839 1.753947-34.672684 0.431835-6.835685 0.840134-7.04751 2.358721-7.830339 5.54018-2.866281 11.992125-5.009084 18.819624-7.275707 5.89936-1.962701 12.003382-3.988848 18.019399-6.65149 3.701299-1.638313 7.139607-3.493567 10.465352-5.288446 3.812839-2.061962 7.414877-4.00522 10.720156-5.228071 3.713578-1.379417 8.67866 2.638083 17.73185 11.576663 2.226714 2.198062 4.529153 4.472871 6.875594 6.534833l23.476691 20.682042c4.888334 4.305049 12.003382 4.956895 17.591657 1.603521 77.311807-46.388517 101.422947-103.97405 102.414531-106.400309 2.166339-5.328355 1.090844-11.432377-2.774183-15.693424l-22.560832-24.8909c-1.842974-2.030239-3.713578-4.036943-5.523807-5.980201-3.52222-3.777023-6.852058-7.343245-9.91379-11.015891-0.103354-0.576121-0.407276-3.545756 2.578732-10.349719 1.159406-2.638083 2.38635-5.252631 3.689019-8.018627 1.90335-4.036943 3.866051-8.214079 5.66093-12.607132 1.866511-4.573155 3.196809-9.369392 4.484128-14.010085 2.914376-10.492982 5.136997-17.46886 9.349949-18.763342 12.715603-3.910053 26.41051-4.261047 40.908712-4.63353 5.668093-0.143263 11.527544-0.295735 17.419741-0.667196 6.503111-0.415462 11.992125-4.984524 13.57518-11.308557C907.21518 494.340805 883.543038 436.564937 882.527918 434.149934zM643.49894 643.761929c-35.280528 35.280528-82.191954 54.711066-132.086317 54.711066s-96.806813-19.430538-132.086317-54.711066c-35.280528-35.279504-54.711066-82.191954-54.711066-132.086317 0-49.894364 19.430538-96.80272 54.711066-132.082224 35.283598-35.284621 82.191954-54.711066 132.086317-54.711066s96.80579 19.426445 132.086317 54.711066c35.279504 35.279504 54.711066 82.187861 54.711066 132.082224C698.210006 561.569976 678.782537 608.482425 643.49894 643.761929z',
         }));
     };
     ServiceTaskView.prototype.getShape = function () {
-        var attributes = _super.prototype.getAttributes.call(this);
-        var x = attributes.x, y = attributes.y, width = attributes.width, height = attributes.height, fill = attributes.fill, stroke = attributes.stroke, strokeWidth = attributes.strokeWidth, radius = attributes.radius;
-        // todo: 将basic-shape对外暴露，在这里可以直接用。现在纯手写有点麻烦。
+        var model = this.props.model;
+        var x = model.x, y = model.y, width = model.width, height = model.height, radius = model.radius;
+        var style = model.getNodeStyle();
         return core_1.h('g', {}, [
-            core_1.h('rect', {
-                x: x - width / 2,
-                y: y - height / 2,
-                rx: radius,
-                ry: radius,
-                fill: fill,
-                stroke: stroke,
-                strokeWidth: strokeWidth,
-                width: width,
-                height: height,
-            }),
+            core_1.h('rect', __assign({ x: x - width / 2, y: y - height / 2, rx: radius, ry: radius, width: width,
+                height: height }, style)),
             this.getLabelShape(),
         ]);
     };

package/cjs/bpmn/tasks/UserTask.js

@@ -12,6 +12,17 @@ var __extends = (this && this.__extends) || (function () {
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
     };
 })();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.UserTaskModel = exports.UserTaskView = void 0;
 var core_1 = require("@logicflow/core");
@@ -36,8 +47,9 @@ var UserTaskView = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     UserTaskView.prototype.getLabelShape = function () {
-        var attributes = _super.prototype.getAttributes.call(this);
-        var x = attributes.x, y = attributes.y, width = attributes.width, height = attributes.height, stroke = attributes.stroke;
+        var model = this.props.model;
+        var x = model.x, y = model.y, width = model.width, height = model.height;
+        var style = model.getNodeStyle();
         return core_1.h('svg', {
             x: x - width / 2 + 5,
             y: y - height / 2 + 5,
@@ -45,26 +57,18 @@ var UserTaskView = /** @class */ (function (_super) {
             height: 25,
             viewBox: '0 0 1274 1024',
         }, core_1.h('path', {
-            fill: stroke,
+            fill: style.stroke,
             d: 'M655.807326 287.35973m-223.989415 0a218.879 218.879 0 1 0 447.978829 0 218.879 218.879 0 1 0-447.978829 0ZM1039.955839 895.482975c-0.490184-212.177424-172.287821-384.030443-384.148513-384.030443-211.862739 0-383.660376 171.85302-384.15056 384.030443L1039.955839 895.482975z',
         }));
     };
     UserTaskView.prototype.getShape = function () {
-        var attributes = _super.prototype.getAttributes.call(this);
-        var x = attributes.x, y = attributes.y, width = attributes.width, height = attributes.height, fill = attributes.fill, stroke = attributes.stroke, strokeWidth = attributes.strokeWidth, radius = attributes.radius;
+        var model = this.props.model;
+        var x = model.x, y = model.y, width = model.width, height = model.height, radius = model.radius;
+        var style = model.getNodeStyle();
         // todo: 将basic-shape对外暴露，在这里可以直接用。现在纯手写有点麻烦。
         return core_1.h('g', {}, [
-            core_1.h('rect', {
-                x: x - width / 2,
-                y: y - height / 2,
-                rx: radius,
-                ry: radius,
-                fill: fill,
-                stroke: stroke,
-                strokeWidth: strokeWidth,
-                width: width,
-                height: height,
-            }),
+            core_1.h('rect', __assign(__assign({}, style), { x: x - width / 2, y: y - height / 2, rx: radius, ry: radius, width: width,
+                height: height })),
             this.getLabelShape(),
         ]);
     };

package/cjs/bpmn-adapter/index.js

@@ -360,7 +360,7 @@ function getEdgeConfig(edgeValue, processValue) {
     var textVal = processValue['-name'];
     if (textVal) {
         var textBounds = edgeValue['bpmndi:BPMNLabel']['dc:Bounds'];
-        // 如果连线文本换行，则其偏移量应该是最长一行的位置
+        // 如果边文本换行，则其偏移量应该是最长一行的位置
         var textLength_1 = 0;
         textVal.split('\n').forEach(function (textSpan) {
             if (textLength_1 < textSpan.length) {

package/cjs/components/context-menu/index.js

@@ -100,7 +100,7 @@ var ContextMenu = /** @class */ (function () {
             x = data.x + Model.width / 2;
             y = data.y - Model.height / 2;
         }
-        return this.lf.graphModel.transformMatrix.CanvasPointToHtmlPoint([x, y]);
+        return this.lf.graphModel.transformModel.CanvasPointToHtmlPoint([x, y]);
     };
     ContextMenu.prototype.createContextMenu = function () {
         var _this = this;
@@ -148,7 +148,7 @@ var ContextMenu = /** @class */ (function () {
         if (y === undefined) {
             y = node.y;
         }
-        var nodeModel = this.lf.getNodeModel(node.sourceId);
+        var nodeModel = this.lf.getNodeModelById(node.sourceId);
         var leftTopX = node.x - nodeModel.width + NEXT_X_DISTANCE;
         var leftTopY = y - node.y / 2 - 20;
         var rightBottomX = node.x + nodeModel.width + NEXT_X_DISTANCE;
@@ -177,7 +177,7 @@ var ContextMenu = /** @class */ (function () {
                 y: newNode.y,
             };
         }
-        this.lf.createEdge({
+        this.lf.addEdge({
             sourceNodeId: node.sourceId,
             targetNodeId: newNode.id,
             startPoint: startPoint,

package/cjs/components/menu/index.js

@@ -58,7 +58,7 @@ var Menu = /** @class */ (function () {
             {
                 text: '编辑文本',
                 callback: function (node) {
-                    _this.lf.graphModel.setTextEditable(node.id);
+                    _this.lf.graphModel.editText(node.id);
                 },
             },
             {
@@ -79,7 +79,7 @@ var Menu = /** @class */ (function () {
             {
                 text: '编辑文本',
                 callback: function (edge) {
-                    _this.lf.graphModel.setTextEditable(edge.id);
+                    _this.lf.graphModel.editText(edge.id);
                 },
             },
         ];
@@ -131,7 +131,7 @@ var Menu = /** @class */ (function () {
             var data = _a.data, position = _a.position;
             var _b = position.domOverlayPosition, x = _b.x, y = _b.y;
             var id = data.id;
-            var model = _this.lf.graphModel.getNodeModel(id);
+            var model = _this.lf.graphModel.getNodeModelById(id);
             var menuList = [];
             var typeMenus = _this.menuTypeMap.get(model.type);
             // 如果单个节点自定义了节点，以单个节点自定义为准
@@ -151,14 +151,14 @@ var Menu = /** @class */ (function () {
             var data = _a.data, position = _a.position;
             var _b = position.domOverlayPosition, x = _b.x, y = _b.y;
             var id = data.id;
-            var model = _this.lf.graphModel.getEdgeModel(id);
+            var model = _this.lf.graphModel.getEdgeModelById(id);
             var menuList = [];
             var typeMenus = _this.menuTypeMap.get(model.type);
-            // 如果单个节点自定义了连线
+            // 如果单个节点自定义了边
             if (model && model.menu && Array.isArray(model.menu)) {
                 menuList = model.menu;
             }
-            else if (typeMenus) { // 如果定义当前连线类型的元素
+            else if (typeMenus) { // 如果定义当前边类型的元素
                 menuList = typeMenus;
             }
             else { // 最后取全局默认

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

@@ -42,8 +42,8 @@ var MiniMap = {
     __disabledPlugins: ['minimap', 'control', 'selection-select'],
     install: function (lf, LogicFlow) {
         MiniMap.__lf = lf;
-        MiniMap.__miniMapWidth = lf.width;
-        MiniMap.__miniMapHeight = (lf.width * 220) / 150;
+        MiniMap.__miniMapWidth = lf.graphModel.width;
+        MiniMap.__miniMapHeight = (lf.graphModel.width * 220) / 150;
         MiniMap.__LogicFlow = LogicFlow;
         this.__init();
         // 避免多次install的时候, _isShow状态被修改了

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

@@ -39,7 +39,7 @@ var SelectionSelect = /** @class */ (function () {
             var rt = [Math.max(x, x1), Math.max(y, y1)];
             var elements = _this.lf.getAreaElement(lt, rt);
             elements.forEach(function (element) {
-                _this.lf.select(element.id, true);
+                _this.lf.selectElementById(element.id, true);
             });
             _this.lf.emit('selection:selected', elements);
         };

package/cjs/index.js

@@ -27,3 +27,4 @@ __exportStar(require("./materials/group"), exports);
 __exportStar(require("./NodeResize"), exports);
 __exportStar(require("./tools/flow-path"), exports);
 __exportStar(require("./tools/auto-layout"), exports);
+// export * from './materials/node-selection';

package/cjs/insert-node-in-polyline/index.js

@@ -60,19 +60,19 @@ var InsertNodeInPolyline = {
     },
     insetNode: function (nodeData) {
         var edges = this._lf.graphModel.edges;
-        var nodeModel = this._lf.getNodeModel(nodeData.id);
+        var nodeModel = this._lf.getNodeModelById(nodeData.id);
         for (var i = 0; i < edges.length; i++) {
             // eslint-disable-next-line max-len
             var _a = edge_1.isNodeInSegement(nodeModel, edges[i]), crossIndex = _a.crossIndex, crossPoints = _a.crossPoints;
             if (crossIndex >= 0) {
                 var _b = edges[i], sourceNodeId = _b.sourceNodeId, targetNodeId = _b.targetNodeId, id = _b.id, type = _b.type, pointsList = _b.pointsList;
-                this._lf.createEdge({
+                this._lf.addEdge({
                     type: type,
                     sourceNodeId: sourceNodeId,
                     targetNodeId: nodeData.id,
                     pointsList: __spread(pointsList.slice(0, crossIndex), [crossPoints.startCrossPoint]),
                 });
-                this._lf.createEdge({
+                this._lf.addEdge({
                     type: type,
                     sourceNodeId: nodeData.id,
                     targetNodeId: targetNodeId,

package/cjs/materials/curved-edge/index.js

@@ -37,7 +37,8 @@ var CurvedEdgeView = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     CurvedEdgeView.prototype.getEdge = function () {
-        var _a = this.getAttributes(), points = _a.points, strokeWidth = _a.strokeWidth, stroke = _a.stroke, strokeDashArray = _a.strokeDashArray;
+        var _a = this.props.model.getEdgeStyle(), strokeWidth = _a.strokeWidth, stroke = _a.stroke, strokeDashArray = _a.strokeDashArray;
+        var points = this.props.model.points;
         var points2 = points.split(' ').map(function (p) { return p.split(',').map(function (a) { return Number(a); }); });
         var _b = __read(points2[0], 2), startX = _b[0], startY = _b[1];
         var d = "M" + startX + " " + startY;

package/cjs/materials/group/GroupNode.js

@@ -48,6 +48,7 @@ var GroupNodeModel = /** @class */ (function (_super) {
         this.height = 200;
         this.strokeWidth = 1;
         this.zIndex = 0;
+        this.radius = 0;
     };
     /**
      * 设置是否允许子节点被拖动移除分组
@@ -93,11 +94,6 @@ var GroupNode = /** @class */ (function (_super) {
      * 重新toFront，阻止其置顶
      */
     GroupNode.prototype.toFront = function () { };
-    GroupNode.prototype.getShapeStyle = function () {
-        var shape = _super.prototype.getShapeStyle.call(this);
-        shape.radius = 0;
-        return shape;
-    };
     return GroupNode;
 }(core_1.RectNode));
 exports.default = {