@logicflow/extension 1.0.7-alpha.0 → 1.1.0-alpha.1

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

@@ -12,48 +12,92 @@ var __values = (this && this.__values) || function(o) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MiniMap = void 0;
-// interface MiniMapPlugin extends Extension {
-//   init: (option) => void;
-//   show: (leftPosition?: number, topPosition?: number) => void;
-//   hide: () => void;
-//   [x: string]: any;
-// }
-var MiniMap = {
-    pluginName: 'minimap',
-    __lf: null,
-    __container: null,
-    __miniMapWrap: null,
-    __miniMapContainer: null,
-    __lfMap: null,
-    __viewport: null,
-    __width: 150,
-    __height: 220,
-    __miniMapWidth: 450,
-    __miniMapHeight: 660,
-    __viewPortTop: 0,
-    __viewPortLeft: 0,
-    __startPosition: null,
-    __viewPortScale: 1,
-    __viewPortWidth: 150,
-    __viewPortHeight: 75,
-    __resetDataX: 0,
-    __resetDataY: 0,
-    __LogicFlow: null,
-    __disabledPlugins: ['minimap', 'control', 'selection-select'],
-    install: function (lf, LogicFlow) {
-        MiniMap.__lf = lf;
-        MiniMap.__miniMapWidth = lf.graphModel.width;
-        MiniMap.__miniMapHeight = (lf.graphModel.width * 220) / 150;
-        MiniMap.__LogicFlow = LogicFlow;
+var MiniMap = /** @class */ (function () {
+    function MiniMap(_a) {
+        var _this = this;
+        var lf = _a.lf, LogicFlow = _a.LogicFlow;
+        this.__lf = null;
+        this.__container = null;
+        this.__miniMapWrap = null;
+        this.__miniMapContainer = null;
+        this.__lfMap = null;
+        this.__viewport = null;
+        this.__width = 150;
+        this.__height = 220;
+        this.__miniMapWidth = 450;
+        this.__miniMapHeight = 660;
+        this.__viewPortTop = 0;
+        this.__viewPortLeft = 0;
+        this.__startPosition = null;
+        this.__viewPortScale = 1;
+        this.__viewPortWidth = 150;
+        this.__viewPortHeight = 75;
+        this.__resetDataX = 0;
+        this.__resetDataY = 0;
+        this.__LogicFlow = null;
+        this.__isShow = false;
+        this.__disabledPlugins = ['miniMap', 'control', 'selectionSelect'];
+        /**
+         * 显示mini map
+         */
+        this.show = function (leftPosition, topPosition) {
+            _this.__setView();
+            if (!_this.__isShow) {
+                _this.__createMiniMap(leftPosition, topPosition);
+            }
+            _this.__isShow = true;
+        };
+        /**
+         * 隐藏mini map
+         */
+        this.hide = function () {
+            if (_this.__isShow) {
+                _this.__removeMiniMap();
+            }
+            _this.__isShow = false;
+        };
+        this.__startDrag = function (e) {
+            document.addEventListener('mousemove', _this.__drag);
+            document.addEventListener('mouseup', _this.__drop);
+            _this.__startPosition = {
+                x: e.x,
+                y: e.y,
+            };
+        };
+        this.__drag = function (e) {
+            var viewStyle = _this.__viewport.style;
+            _this.__viewPortTop += e.y - _this.__startPosition.y;
+            _this.__viewPortLeft += e.x - _this.__startPosition.x;
+            viewStyle.top = _this.__viewPortTop + "px";
+            viewStyle.left = _this.__viewPortLeft + "px";
+            _this.__startPosition = {
+                x: e.x,
+                y: e.y,
+            };
+            var centerX = (_this.__viewPortLeft + _this.__viewPortWidth / 2)
+                / _this.__viewPortScale;
+            var centerY = (_this.__viewPortTop + _this.__viewPortHeight / 2)
+                / _this.__viewPortScale;
+            _this.__lf.focusOn({
+                coordinate: {
+                    x: centerX + _this.__resetDataX,
+                    y: centerY + _this.__resetDataY,
+                },
+            });
+        };
+        this.__drop = function () {
+            document.removeEventListener('mousemove', _this.__drag);
+            document.removeEventListener('mouseup', _this.__drop);
+        };
+        this.__lf = lf;
+        this.__miniMapWidth = lf.graphModel.width;
+        this.__miniMapHeight = (lf.graphModel.width * 220) / 150;
+        this.__LogicFlow = LogicFlow;
         this.__init();
-        // 避免多次install的时候, _isShow状态被修改了
-        MiniMap.__isShow = false;
-    },
-    init: function (option) {
-        this.__disabledPlugins = this.__disabledPlugins.concat(option.disabledPlugins || []);
-    },
-    render: function (lf, container) {
-        MiniMap.__container = container;
+    }
+    MiniMap.prototype.render = function (lf, container) {
+        var _this = this;
+        this.__container = container;
         var events = [
             'node:add',
             'node:delete',
@@ -63,34 +107,24 @@ var MiniMap = {
             'blank:drop',
         ];
         events.forEach(function (eventName) {
-            MiniMap.__lf.on(eventName, function () {
-                if (MiniMap.__isShow) {
-                    MiniMap.__setView();
+            _this.__lf.on(eventName, function () {
+                if (_this.__isShow) {
+                    _this.__setView();
                 }
             });
         });
-    },
-    show: function (leftPosition, topPosition) {
-        MiniMap.__setView();
-        if (!MiniMap.__isShow) {
-            MiniMap.__createMiniMap(leftPosition, topPosition);
-        }
-        MiniMap.__isShow = true;
-    },
-    hide: function () {
-        if (MiniMap.__isShow) {
-            MiniMap.__removeMiniMap();
-        }
-        MiniMap.__isShow = false;
-    },
-    __init: function () {
+    };
+    MiniMap.prototype.init = function (option) {
+        this.__disabledPlugins = this.__disabledPlugins.concat(option.disabledPlugins || []);
+    };
+    MiniMap.prototype.__init = function () {
         var miniMapWrap = document.createElement('div');
         miniMapWrap.className = 'lf-mini-map-graph';
-        miniMapWrap.style.width = MiniMap.__width + "px";
-        miniMapWrap.style.height = MiniMap.__height + "px";
-        MiniMap.__lfMap = new MiniMap.__LogicFlow({
-            width: MiniMap.__lf.graphModel.width,
-            height: (MiniMap.__lf.graphModel.width * 220) / 150,
+        miniMapWrap.style.width = this.__width + "px";
+        miniMapWrap.style.height = this.__height + "px";
+        this.__lfMap = new this.__LogicFlow({
+            width: this.__lf.graphModel.width,
+            height: (this.__lf.graphModel.width * 220) / 150,
             container: miniMapWrap,
             isSilentMode: true,
             stopZoomGraph: true,
@@ -98,17 +132,17 @@ var MiniMap = {
             stopMoveGraph: true,
             hideAnchors: true,
             hoverOutline: false,
-            disabledPlugins: MiniMap.__disabledPlugins,
+            disabledPlugins: this.__disabledPlugins,
         });
         // minimap中禁用adapter。
-        MiniMap.__lfMap.adapterIn = function (a) { return a; };
-        MiniMap.__lfMap.adapterOut = function (a) { return a; };
-        MiniMap.__miniMapWrap = miniMapWrap;
-        MiniMap.__createViewPort();
-    },
-    __createMiniMap: function (left, top) {
+        this.__lfMap.adapterIn = function (a) { return a; };
+        this.__lfMap.adapterOut = function (a) { return a; };
+        this.__miniMapWrap = miniMapWrap;
+        this.__createViewPort();
+    };
+    MiniMap.prototype.__createMiniMap = function (left, top) {
         var miniMapContainer = document.createElement('div');
-        var miniMapWrap = MiniMap.__miniMapWrap;
+        var miniMapWrap = this.__miniMapWrap;
         miniMapContainer.appendChild(miniMapWrap);
         if (typeof left !== 'undefined' && typeof top !== 'undefined') {
             miniMapContainer.style.left = left + "px";
@@ -116,30 +150,30 @@ var MiniMap = {
         }
         miniMapContainer.style.position = 'absolute';
         miniMapContainer.className = 'lf-mini-map';
-        MiniMap.__container.appendChild(miniMapContainer);
-        MiniMap.__miniMapWrap.appendChild(MiniMap.__viewport);
+        this.__container.appendChild(miniMapContainer);
+        this.__miniMapWrap.appendChild(this.__viewport);
         var header = document.createElement('div');
         header.className = 'lf-mini-map-header';
         header.innerText = '导航';
         miniMapContainer.appendChild(header);
         var close = document.createElement('span');
         close.className = 'lf-mini-map-close';
-        close.addEventListener('click', MiniMap.hide);
+        close.addEventListener('click', this.hide);
         miniMapContainer.appendChild(close);
-        MiniMap.__miniMapContainer = miniMapContainer;
-    },
-    __removeMiniMap: function () {
-        MiniMap.__container.removeChild(MiniMap.__miniMapContainer);
-    },
+        this.__miniMapContainer = miniMapContainer;
+    };
+    MiniMap.prototype.__removeMiniMap = function () {
+        this.__container.removeChild(this.__miniMapContainer);
+    };
     /**
      * 计算所有图形一起，占领的区域范围。
      * @param data
      */
-    __getBounds: function (data) {
+    MiniMap.prototype.__getBounds = function (data) {
         var left = 0;
-        var right = MiniMap.__miniMapWidth;
+        var right = this.__miniMapWidth;
         var top = 0;
-        var bottom = MiniMap.__miniMapHeight;
+        var bottom = this.__miniMapHeight;
         var nodes = data.nodes;
         if (nodes && nodes.length > 0) {
             // 因为获取的节点不知道真实的宽高，这里需要补充一点数值
@@ -161,13 +195,13 @@ var MiniMap = {
             bottom: bottom,
             right: right,
         };
-    },
+    };
     /**
      * 将负值的平移转换为正值。
      * 保证渲染的时候，minimap能完全展示。
      * 获取将画布所有元素平移到0，0开始时，所有节点数据
      */
-    __resetData: function (data) {
+    MiniMap.prototype.__resetData = function (data) {
         var nodes = data.nodes, edges = data.edges;
         var left = 0;
         var top = 0;
@@ -181,8 +215,8 @@ var MiniMap = {
                 top = nodeTop < top ? nodeTop : top;
             });
             if (left < 0 || top < 0) {
-                MiniMap.__resetDataX = left;
-                MiniMap.__resetDataY = top;
+                this.__resetDataX = left;
+                this.__resetDataY = top;
                 nodes.forEach(function (node) {
                     node.x = node.x - left;
                     node.y = node.y - top;
@@ -214,27 +248,27 @@ var MiniMap = {
             }
         }
         return data;
-    },
+    };
     /**
      * 显示导航
      * 显示视口范围
      * 1. 基于画布的范围比例，设置视口范围比例。宽度默认为导航宽度。
      */
-    __setView: function () {
+    MiniMap.prototype.__setView = function () {
         var e_1, _a;
         // 1. 获取到图中所有的节点中的位置，将其偏移到原点开始（避免节点位置为负的时候无法展示问题）。
-        var data = MiniMap.__resetData(MiniMap.__lf.getGraphRawData());
+        var data = this.__resetData(this.__lf.getGraphRawData());
         // 由于随时都会有新节点注册进来，需要同步将注册的
-        var viewMap = MiniMap.__lf.viewMap;
-        var modelMap = MiniMap.__lf.graphModel.modelMap;
-        var minimapViewMap = MiniMap.__lfMap.viewMap;
+        var viewMap = this.__lf.viewMap;
+        var modelMap = this.__lf.graphModel.modelMap;
+        var minimapViewMap = this.__lfMap.viewMap;
         try {
             // todo: no-restricted-syntax
             for (var _b = __values(viewMap.keys()), _c = _b.next(); !_c.done; _c = _b.next()) {
                 var key = _c.value;
                 if (!minimapViewMap.has(key)) {
-                    MiniMap.__lfMap.setView(key, viewMap.get(key));
-                    MiniMap.__lfMap.graphModel.modelMap.set(key, modelMap.get(key));
+                    this.__lfMap.setView(key, viewMap.get(key));
+                    this.__lfMap.graphModel.modelMap.set(key, modelMap.get(key));
                 }
             }
         }
@@ -245,91 +279,60 @@ var MiniMap = {
             }
             finally { if (e_1) throw e_1.error; }
         }
-        MiniMap.__lfMap.render(data);
+        this.__lfMap.render(data);
         // 2. 将偏移后的数据渲染到minimap画布上
         // 3. 计算出所有节点在一起的边界。
-        var _d = MiniMap.__getBounds(data), left = _d.left, top = _d.top, right = _d.right, bottom = _d.bottom;
+        var _d = this.__getBounds(data), left = _d.left, top = _d.top, right = _d.right, bottom = _d.bottom;
         // 4. 计算所有节点的边界与minimap看板的边界的比例.
-        var realWidthScale = MiniMap.__width / (right - left);
-        var realHeightScale = MiniMap.__height / (bottom - top);
+        var realWidthScale = this.__width / (right - left);
+        var realHeightScale = this.__height / (bottom - top);
         // 5. 取比例最小的值，将渲染的画布缩小对应比例。
-        var innerStyle = MiniMap.__miniMapWrap.firstChild.style;
+        var innerStyle = this.__miniMapWrap.firstChild.style;
         var scale = Math.min(realWidthScale, realHeightScale);
         innerStyle.transform = "matrix(" + scale + ", 0, 0, " + scale + ", 0, 0)";
         innerStyle.transformOrigin = 'left top';
         innerStyle.height = bottom - Math.min(top, 0) + "px";
         innerStyle.width = right - Math.min(left, 0) + "px";
-        MiniMap.__viewPortScale = scale;
-        MiniMap.__setViewPort(scale, {
+        this.__viewPortScale = scale;
+        this.__setViewPort(scale, {
             left: left,
             top: top,
             right: right,
             bottom: bottom,
         });
-    },
+    };
     // 设置视口
-    __setViewPort: function (scale, _a) {
-        var left = _a.left, right = _a.right;
-        var viewStyle = MiniMap.__viewport.style;
-        viewStyle.width = MiniMap.__width - 4 + "px";
-        viewStyle.height = (MiniMap.__width - 4) / (MiniMap.__lf.graphModel.width / MiniMap.__lf.graphModel.height) + "px";
+    MiniMap.prototype.__setViewPort = function (scale, _a) {
+        var left = _a.left, right = _a.right, top = _a.top, bottom = _a.bottom;
+        var viewStyle = this.__viewport.style;
+        viewStyle.width = this.__width - 4 + "px";
+        viewStyle.height = (this.__width - 4) / (this.__lf.graphModel.width / this.__lf.graphModel.height) + "px";
         // top
-        var _b = MiniMap.__lf.getTransform(), TRANSLATE_X = _b.TRANSLATE_X, TRANSLATE_Y = _b.TRANSLATE_Y;
+        var _b = this.__lf.getTransform(), TRANSLATE_X = _b.TRANSLATE_X, TRANSLATE_Y = _b.TRANSLATE_Y;
         var realWidth = right - left;
         // 视口实际宽 = 视口默认宽 / (所有元素一起占据的真实宽 / 绘布宽)
-        var realViewPortWidth = (MiniMap.__width - 4) / (realWidth / MiniMap.__lf.graphModel.width);
+        var realViewPortWidth = (this.__width - 4) / (realWidth / this.__lf.graphModel.width);
         // 视口实际高 = 视口实际宽 / (绘布宽 / 绘布高)
-        var graphRatio = (MiniMap.__lf.graphModel.width / MiniMap.__lf.graphModel.height);
+        var graphRatio = (this.__lf.graphModel.width / this.__lf.graphModel.height);
         var realViewPortHeight = realViewPortWidth / graphRatio;
-        MiniMap.__viewPortTop = TRANSLATE_Y > 0 ? 0 : -TRANSLATE_Y * scale;
-        MiniMap.__viewPortLeft = -TRANSLATE_X * scale;
-        MiniMap.__viewPortWidth = realViewPortWidth;
-        MiniMap.__viewPortHeight = realViewPortHeight;
-        viewStyle.top = MiniMap.__viewPortTop + "px";
-        viewStyle.left = MiniMap.__viewPortLeft + "px";
+        this.__viewPortTop = TRANSLATE_Y > 0 ? 0 : -TRANSLATE_Y * scale;
+        this.__viewPortLeft = -TRANSLATE_X * scale;
+        this.__viewPortWidth = realViewPortWidth;
+        this.__viewPortHeight = realViewPortHeight;
+        viewStyle.top = this.__viewPortTop + "px";
+        viewStyle.left = this.__viewPortLeft + "px";
         viewStyle.width = realViewPortWidth + "px";
         viewStyle.height = realViewPortHeight + "px";
-    },
+    };
     // 预览视窗
-    __createViewPort: function () {
+    MiniMap.prototype.__createViewPort = function () {
         var div = document.createElement('div');
         div.className = 'lf-minimap-viewport';
-        div.addEventListener('mousedown', MiniMap.__startDrag);
-        MiniMap.__viewport = div;
-    },
-    __startDrag: function (e) {
-        document.addEventListener('mousemove', MiniMap.__drag);
-        document.addEventListener('mouseup', MiniMap.__drop);
-        MiniMap.__startPosition = {
-            x: e.x,
-            y: e.y,
-        };
-    },
-    __drag: function (e) {
-        var viewStyle = MiniMap.__viewport.style;
-        MiniMap.__viewPortTop += e.y - MiniMap.__startPosition.y;
-        MiniMap.__viewPortLeft += e.x - MiniMap.__startPosition.x;
-        viewStyle.top = MiniMap.__viewPortTop + "px";
-        viewStyle.left = MiniMap.__viewPortLeft + "px";
-        MiniMap.__startPosition = {
-            x: e.x,
-            y: e.y,
-        };
-        var centerX = (MiniMap.__viewPortLeft + MiniMap.__viewPortWidth / 2)
-            / MiniMap.__viewPortScale;
-        var centerY = (MiniMap.__viewPortTop + MiniMap.__viewPortHeight / 2)
-            / MiniMap.__viewPortScale;
-        MiniMap.__lf.focusOn({
-            coordinate: {
-                x: centerX + MiniMap.__resetDataX,
-                y: centerY + MiniMap.__resetDataY,
-            },
-        });
-    },
-    __drop: function () {
-        document.removeEventListener('mousemove', MiniMap.__drag);
-        document.removeEventListener('mouseup', MiniMap.__drop);
-    },
-};
+        div.addEventListener('mousedown', this.__startDrag);
+        this.__viewport = div;
+    };
+    MiniMap.pluginName = 'miniMap';
+    return MiniMap;
+}());
 exports.MiniMap = MiniMap;
 exports.default = MiniMap;

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

@@ -48,21 +48,10 @@ var SelectionSelect = /** @class */ (function () {
         var stopMoveGraph = lf.getEditConfig().stopMoveGraph;
         this.isDefalutStopMoveGraph = stopMoveGraph;
         lf.openSelectionSelect = function () {
-            if (!stopMoveGraph) {
-                _this.isDefalutStopMoveGraph = false;
-                lf.updateEditConfig({
-                    stopMoveGraph: true,
-                });
-            }
-            _this.open();
+            _this.openSelectionSelect();
         };
         lf.closeSelectionSelect = function () {
-            if (!_this.isDefalutStopMoveGraph) {
-                lf.updateEditConfig({
-                    stopMoveGraph: false,
-                });
-            }
-            _this.close();
+            _this.closeSelectionSelect();
         };
     }
     SelectionSelect.prototype.render = function (lf, domContainer) {
@@ -88,13 +77,37 @@ var SelectionSelect = /** @class */ (function () {
             document.addEventListener('mouseup', _this.__drawOff);
         });
     };
+    /**
+     * 开启选区
+     */
+    SelectionSelect.prototype.openSelectionSelect = function () {
+        var stopMoveGraph = this.lf.getEditConfig().stopMoveGraph;
+        if (!stopMoveGraph) {
+            this.isDefalutStopMoveGraph = false;
+            this.lf.updateEditConfig({
+                stopMoveGraph: true,
+            });
+        }
+        this.open();
+    };
+    /**
+     * 关闭选区
+     */
+    SelectionSelect.prototype.closeSelectionSelect = function () {
+        if (!this.isDefalutStopMoveGraph) {
+            this.lf.updateEditConfig({
+                stopMoveGraph: false,
+            });
+        }
+        this.close();
+    };
     SelectionSelect.prototype.open = function () {
         this.__disabled = false;
     };
     SelectionSelect.prototype.close = function () {
         this.__disabled = true;
     };
-    SelectionSelect.pluginName = 'selection-select';
+    SelectionSelect.pluginName = 'selectionSelect';
     return SelectionSelect;
 }());
 exports.SelectionSelect = SelectionSelect;

package/cjs/index.js

@@ -27,3 +27,5 @@ __exportStar(require("./materials/group"), exports);
 __exportStar(require("./NodeResize"), exports);
 __exportStar(require("./tools/flow-path"), exports);
 __exportStar(require("./tools/auto-layout"), exports);
+__exportStar(require("./bpmn-adapter/xml2json"), exports);
+__exportStar(require("./bpmn-adapter/json2xml"), exports);

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

@@ -23,7 +23,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.InsertNodeInPolyline = void 0;
 var edge_1 = require("./edge");
 var InsertNodeInPolyline = {
-    pluginName: 'insert-node-in-polyline',
+    pluginName: 'insertNodeInPolyline',
     _lf: null,
     dndAdd: true,
     dropAdd: true,

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

@@ -81,7 +81,7 @@ var CurvedEdgeView = /** @class */ (function (_super) {
             strokeDashArray: strokeDashArray,
         });
     };
-    CurvedEdgeView.extendKey = 'CurvedEdge';
+    CurvedEdgeView.extendKey = 'curvedEdge';
     return CurvedEdgeView;
 }(core_1.PolylineEdge));
 var CurvedEdgeModel = /** @class */ (function (_super) {

package/cjs/tools/flow-path/index.js

@@ -209,7 +209,7 @@ var FlowPath = /** @class */ (function () {
         var length = elements.length;
         return elements.indexOf(elements[length - 1]) !== length - 1 ? 1 : 0;
     };
-    FlowPath.pluginName = 'FlowPath';
+    FlowPath.pluginName = 'flowPath';
     return FlowPath;
 }());
 exports.FlowPath = FlowPath;

package/cjs/turbo-adapter/index.js

@@ -157,7 +157,7 @@ function toLogicflowData(data) {
 }
 exports.toLogicflowData = toLogicflowData;
 var TurboAdapter = {
-    pluginName: 'TurboAdapter',
+    pluginName: 'turboAdapter',
     install: function (lf) {
         lf.adapterIn = this.adapterIn;
         lf.adapterOut = this.adapterOut;

package/es/NodeResize/Control/Control.js

@@ -268,7 +268,8 @@ var Control = /** @class */ (function (_super) {
         _this.onDraging = function (_a) {
             var deltaX = _a.deltaX, deltaY = _a.deltaY;
             var modelType = _this.nodeModel.modelType;
-            if (modelType === ModelType.RECT_NODE) {
+            // html和矩形的计算方式是一样的，共用一个方法
+            if (modelType === ModelType.RECT_NODE || modelType === ModelType.HTML_NODE) {
                 _this.updateRect({ deltaX: deltaX, deltaY: deltaY });
             }
             else if (modelType === ModelType.ELLIPSE_NODE) {

package/es/NodeResize/Control/Util.d.ts

@@ -3,6 +3,7 @@ export declare enum ModelType {
     CIRCLE_NODE = "circle-node",
     POLYGON_NODE = "polygon-node",
     RECT_NODE = "rect-node",
+    HTML_NODE = "html-node",
     TEXT_NODE = "text-node",
     ELLIPSE_NODE = "ellipse-node",
     DIAMOND_NODE = "diamond-node",

package/es/NodeResize/Control/Util.js

@@ -4,6 +4,7 @@ export var ModelType;
     ModelType["CIRCLE_NODE"] = "circle-node";
     ModelType["POLYGON_NODE"] = "polygon-node";
     ModelType["RECT_NODE"] = "rect-node";
+    ModelType["HTML_NODE"] = "html-node";
     ModelType["TEXT_NODE"] = "text-node";
     ModelType["ELLIPSE_NODE"] = "ellipse-node";
     ModelType["DIAMOND_NODE"] = "diamond-node";

package/es/NodeResize/Node/EllipseResize.js

@@ -11,20 +11,8 @@ 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);
-};
 import { h, EllipseNode, EllipseNodeModel } from '@logicflow/core';
 import ControlGroup from '../Control/ControlGroup';
-import Ellipse from '../BasicShape/Ellipse';
 var EllipseResizeModel = /** @class */ (function (_super) {
     __extends(EllipseResizeModel, _super);
     function EllipseResizeModel(data, graphModel) {
@@ -66,11 +54,7 @@ var EllipseResizeView = /** @class */ (function (_super) {
     };
     // getResizeShape绘制图形，功能等同于基础椭圆的getShape功能，可以通过复写此方法，进行节点自定义
     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 (h("g", null,
-            h(Ellipse, __assign({}, style, { rx: rx, ry: ry, x: x, y: y }))));
+        return _super.prototype.getShape.call(this);
     };
     EllipseResizeView.prototype.getShape = function () {
         var model = this.props.model;

package/es/NodeResize/Node/HtmlResize.d.ts

@@ -0,0 +1,20 @@
+import { h, HtmlNode, HtmlNodeModel } from '@logicflow/core';
+declare class HtmlResizeModel extends HtmlNodeModel {
+    minWidth: number;
+    minHeight: number;
+    maxWidth: number;
+    maxHeight: number;
+    getOutlineStyle(): import("@logicflow/core/types/constant/DefaultTheme").OutlineTheme;
+    setAttributes(): void;
+}
+declare class HtmlResizeView extends HtmlNode {
+    getControlGroup(): h.JSX.Element;
+    getResizeShape(): h.JSX.Element;
+    getShape(): h.JSX.Element;
+}
+declare const HtmlResize: {
+    type: string;
+    view: typeof HtmlResizeView;
+    model: typeof HtmlResizeModel;
+};
+export default HtmlResize;