@logicflow/extension 0.7.4 → 0.7.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,52 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [0.7.8](https://github.com/didi/LogicFlow/compare/@logicflow/extension@0.7.7...@logicflow/extension@0.7.8) (2021-11-22)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * nodeResize getResizeShape bugfix ([e617013](https://github.com/didi/LogicFlow/commit/e617013f979cd67dbe438dad141f0eef25690aa2))
12
+
13
+
14
+ ### Features
15
+
16
+ * export context menu ([f0ff960](https://github.com/didi/LogicFlow/commit/f0ff960a2518cfe0e3f9d2a5abb843b87957def6))
17
+
18
+
19
+
20
+
21
+
22
+ ## [0.7.7](https://github.com/didi/LogicFlow/compare/@logicflow/extension@0.7.6...@logicflow/extension@0.7.7) (2021-11-19)
23
+
24
+
25
+ ### Features
26
+
27
+ * add context menu plugin ([8c5d7a8](https://github.com/didi/LogicFlow/commit/8c5d7a84309ba8d07fbbb99dcebcae81b521bd06))
28
+
29
+
30
+
31
+
32
+
33
+ ## [0.7.6](https://github.com/didi/LogicFlow/compare/@logicflow/extension@0.7.5...@logicflow/extension@0.7.6) (2021-11-11)
34
+
35
+
36
+ ### Bug Fixes
37
+
38
+ * minimap become invisible when repeat init ([ad488fd](https://github.com/didi/LogicFlow/commit/ad488fde9041834e9e809eb38904c013751d9cc8))
39
+
40
+
41
+
42
+
43
+
44
+ ## [0.7.5](https://github.com/didi/LogicFlow/compare/@logicflow/extension@0.7.4...@logicflow/extension@0.7.5) (2021-11-08)
45
+
46
+ **Note:** Version bump only for package @logicflow/extension
47
+
48
+
49
+
50
+
51
+
6
52
  ## [0.7.4](https://github.com/didi/LogicFlow/compare/@logicflow/extension@0.7.3...@logicflow/extension@0.7.4) (2021-11-04)
7
53
 
8
54
  **Note:** Version bump only for package @logicflow/extension
@@ -55,15 +55,15 @@ var RectResizeView = /** @class */ (function (_super) {
55
55
  var _a = this.props, model = _a.model, graphModel = _a.graphModel;
56
56
  return (core_1.h(ControlGroup_1.default, __assign({}, attributes, { nodeModel: model, graphModel: graphModel })));
57
57
  };
58
- // // getResizeShape绘制图形,功能等同于基础矩形的getShape功能,可以通过复写此方法,进行节点自定义
59
- // getResizeShape() {
60
- // return super.getShape();
61
- // }
58
+ // getResizeShape绘制图形,功能等同于基础矩形的getShape功能,可以通过复写此方法,进行节点自定义
59
+ RectResizeView.prototype.getResizeShape = function () {
60
+ return _super.prototype.getShape.call(this);
61
+ };
62
62
  RectResizeView.prototype.getShape = function () {
63
63
  var attributes = _super.prototype.getAttributes.call(this);
64
64
  var isSelected = this.props.model.isSelected;
65
65
  return (core_1.h("g", null,
66
- _super.prototype.getShape.call(this),
66
+ this.getResizeShape(),
67
67
  isSelected ? this.getControlGroup(attributes) : ''));
68
68
  };
69
69
  return RectResizeView;
package/cjs/bpmn/index.js CHANGED
@@ -31,8 +31,11 @@ var BpmnElement = /** @class */ (function () {
31
31
  lf.register(ExclusiveGateway_1.default);
32
32
  lf.register(UserTask_1.default);
33
33
  lf.register(ServiceTask_1.default);
34
- lf.register(SequenceFlow_1.default);
35
- lf.setDefaultEdgeType('bpmn:sequenceFlow');
34
+ // 支持自定义bpmn元素的连线
35
+ if (!lf.options.customBpmnEdge) {
36
+ lf.register(SequenceFlow_1.default);
37
+ lf.setDefaultEdgeType('bpmn:sequenceFlow');
38
+ }
36
39
  }
37
40
  BpmnElement.pluginName = 'BpmnElement';
38
41
  return BpmnElement;
@@ -0,0 +1,211 @@
1
+ "use strict";
2
+ var __read = (this && this.__read) || function (o, n) {
3
+ var m = typeof Symbol === "function" && o[Symbol.iterator];
4
+ if (!m) return o;
5
+ var i = m.call(o), r, ar = [], e;
6
+ try {
7
+ while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
8
+ }
9
+ catch (error) { e = { error: error }; }
10
+ finally {
11
+ try {
12
+ if (r && !r.done && (m = i["return"])) m.call(i);
13
+ }
14
+ finally { if (e) throw e.error; }
15
+ }
16
+ return ar;
17
+ };
18
+ Object.defineProperty(exports, "__esModule", { value: true });
19
+ exports.ContextMenu = void 0;
20
+ var COMMON_TYPE_KEY = 'menu-common';
21
+ var NEXT_X_DISTANCE = 200;
22
+ var NEXT_Y_DISTANCE = 100;
23
+ var ContextMenu = /** @class */ (function () {
24
+ function ContextMenu(_a) {
25
+ var _this = this;
26
+ var lf = _a.lf;
27
+ this.menuTypeMap = new Map();
28
+ this.listenDelete = function () {
29
+ _this.hideMenu();
30
+ };
31
+ this.lf = lf;
32
+ this.__menuDOM = document.createElement('div');
33
+ this.__menuDOM.className = 'lf-inner-context';
34
+ // const commonMenu = [];
35
+ this.menuTypeMap.set(COMMON_TYPE_KEY, []);
36
+ this.lf.setContextMenuByType = function (type, menus) {
37
+ _this.menuTypeMap.set(type, menus);
38
+ };
39
+ this.lf.setContextMenuItems = function (menus) {
40
+ _this.menuTypeMap.set(COMMON_TYPE_KEY, menus);
41
+ };
42
+ this.lf.showContextMenu = function (data) {
43
+ if (!data || !data.id) {
44
+ console.warn('请检查传入的参数');
45
+ return;
46
+ }
47
+ _this._activeData = data;
48
+ _this.createContextMenu();
49
+ };
50
+ this.lf.hideContextMenu = function () {
51
+ _this.hideMenu();
52
+ };
53
+ }
54
+ ContextMenu.prototype.render = function (lf, container) {
55
+ var _this = this;
56
+ this.container = container;
57
+ lf.on('node:click', function (_a) {
58
+ var data = _a.data;
59
+ _this._activeData = data;
60
+ _this.createContextMenu();
61
+ });
62
+ lf.on('edge:click', function (_a) {
63
+ var data = _a.data;
64
+ // 获取右上角坐标
65
+ _this._activeData = data;
66
+ _this.createContextMenu();
67
+ });
68
+ lf.on('blank:click', function () {
69
+ _this.hideMenu();
70
+ });
71
+ };
72
+ /**
73
+ * 获取新菜单位置
74
+ */
75
+ ContextMenu.prototype.getContextMenuPosition = function () {
76
+ var _a;
77
+ var data = this._activeData;
78
+ var Model = this.lf.graphModel.getElement(data.id);
79
+ if (!Model) {
80
+ console.warn("\u627E\u4E0D\u5230\u5143\u7D20" + data.id);
81
+ return;
82
+ }
83
+ var x;
84
+ var y;
85
+ if (Model.BaseType === 'edge') {
86
+ x = Number.MIN_SAFE_INTEGER;
87
+ y = Number.MAX_SAFE_INTEGER;
88
+ var edgeData = Model.getData();
89
+ x = Math.max(edgeData.startPoint.x, x);
90
+ y = Math.min(edgeData.startPoint.y, y);
91
+ x = Math.max(edgeData.endPoint.x, x);
92
+ y = Math.min(edgeData.endPoint.y, y);
93
+ if (edgeData.pointsList) {
94
+ edgeData.pointsList.forEach(function (point) {
95
+ x = Math.max(point.x, x);
96
+ y = Math.min(point.y, y);
97
+ });
98
+ }
99
+ }
100
+ if (Model.BaseType === 'node') {
101
+ var x1 = data.x + Model.width / 2;
102
+ var y1 = data.y - Model.height / 2;
103
+ _a = __read(this.lf.graphModel.transformMatrix.CanvasPointToHtmlPoint([x1, y1]), 2), x = _a[0], y = _a[1];
104
+ }
105
+ return [x, y];
106
+ };
107
+ ContextMenu.prototype.createContextMenu = function () {
108
+ var _this = this;
109
+ var isSilentMode = this.lf.options.isSilentMode;
110
+ // 静默模式不显示菜单
111
+ if (isSilentMode) {
112
+ return;
113
+ }
114
+ var items = this.menuTypeMap.get(this._activeData.type) || [];
115
+ items = items.concat(this.menuTypeMap.get(COMMON_TYPE_KEY));
116
+ var menus = document.createDocumentFragment();
117
+ items.forEach(function (item) {
118
+ var menuItem = document.createElement('div');
119
+ menuItem.className = 'lf-context-item';
120
+ var img = document.createElement('img');
121
+ img.src = item.icon;
122
+ img.style.width = '20px';
123
+ img.style.height = '20px';
124
+ img.style.cursor = 'pointer';
125
+ img.addEventListener('click', function () {
126
+ _this.hideMenu();
127
+ if (item.callback) {
128
+ item.callback(_this._activeData);
129
+ }
130
+ else {
131
+ _this.addNode({
132
+ sourceId: _this._activeData.id,
133
+ x: _this._activeData.x,
134
+ y: _this._activeData.y,
135
+ properties: item.properties,
136
+ type: item.type,
137
+ });
138
+ }
139
+ });
140
+ menuItem.appendChild(img);
141
+ menus.appendChild(menuItem);
142
+ });
143
+ this.__menuDOM.innerHTML = '';
144
+ this.__menuDOM.appendChild(menus);
145
+ this.showMenu();
146
+ };
147
+ ContextMenu.prototype.addNode = function (node, y) {
148
+ var isDeep = y !== undefined;
149
+ if (y === undefined) {
150
+ y = node.y;
151
+ }
152
+ var nodeModel = this.lf.getNodeModel(node.sourceId);
153
+ var leftTopX = node.x - nodeModel.width + NEXT_X_DISTANCE;
154
+ var leftTopY = y - node.y / 2 - 20;
155
+ var rightBottomX = node.x + nodeModel.width + NEXT_X_DISTANCE;
156
+ var rightBottomY = y + node.y / 2 + 20;
157
+ var exsitElements = this.lf.getAreaElement([leftTopX, leftTopY], [rightBottomX, rightBottomY]);
158
+ if (exsitElements.length) {
159
+ y = y + NEXT_Y_DISTANCE;
160
+ this.addNode(node, y);
161
+ return;
162
+ }
163
+ var newNode = this.lf.addNode({
164
+ type: node.type,
165
+ x: node.x + 200,
166
+ y: y,
167
+ properties: node.properties,
168
+ });
169
+ var startPoint;
170
+ var endPoint;
171
+ if (isDeep) {
172
+ startPoint = {
173
+ x: node.x,
174
+ y: node.y + nodeModel.height / 2,
175
+ };
176
+ endPoint = {
177
+ x: newNode.x - newNode.width / 2,
178
+ y: newNode.y,
179
+ };
180
+ }
181
+ this.lf.createEdge({
182
+ sourceNodeId: node.sourceId,
183
+ targetNodeId: newNode.id,
184
+ startPoint: startPoint,
185
+ endPoint: endPoint,
186
+ });
187
+ };
188
+ ContextMenu.prototype.showMenu = function () {
189
+ var _a = __read(this.getContextMenuPosition(), 2), x = _a[0], y = _a[1];
190
+ this.__menuDOM.style.display = 'flex';
191
+ this.__menuDOM.style.top = y + "px";
192
+ this.__menuDOM.style.left = x + 10 + "px";
193
+ this.container.appendChild(this.__menuDOM);
194
+ // 菜单显示的时候,监听删除,同时隐藏
195
+ !this.isShow && this.lf.on('node:delete,edge:delete,node:drag,graph:transform', this.listenDelete);
196
+ this.isShow = true;
197
+ };
198
+ ContextMenu.prototype.hideMenu = function () {
199
+ this.__menuDOM.innerHTML = '';
200
+ this.__menuDOM.style.display = 'none';
201
+ if (this.isShow) {
202
+ this.container.removeChild(this.__menuDOM);
203
+ }
204
+ this.lf.off('node:delete,edge:delete,node:drag,graph:transform', this.listenDelete);
205
+ this.isShow = false;
206
+ };
207
+ ContextMenu.pluginName = 'ContextMenu';
208
+ return ContextMenu;
209
+ }());
210
+ exports.ContextMenu = ContextMenu;
211
+ exports.default = ContextMenu;
@@ -30,7 +30,6 @@ var MiniMap = {
30
30
  __height: 220,
31
31
  __miniMapWidth: 450,
32
32
  __miniMapHeight: 660,
33
- __isShow: false,
34
33
  __viewPortTop: 0,
35
34
  __viewPortLeft: 0,
36
35
  __startPosition: null,
@@ -47,6 +46,8 @@ var MiniMap = {
47
46
  MiniMap.__miniMapHeight = (lf.width * 220) / 150;
48
47
  MiniMap.__LogicFlow = LogicFlow;
49
48
  this.__init();
49
+ // 避免多次install的时候, _isShow状态被修改了
50
+ MiniMap.__isShow = false;
50
51
  },
51
52
  init: function (option) {
52
53
  this.__disabledPlugins = this.__disabledPlugins.concat(option.disabledPlugins || []);
@@ -63,7 +64,9 @@ var MiniMap = {
63
64
  ];
64
65
  events.forEach(function (eventName) {
65
66
  MiniMap.__lf.on(eventName, function () {
66
- MiniMap.__setView();
67
+ if (MiniMap.__isShow) {
68
+ MiniMap.__setView();
69
+ }
67
70
  });
68
71
  });
69
72
  },
package/cjs/index.js CHANGED
@@ -17,6 +17,7 @@ __exportStar(require("./turbo-adapter"), exports);
17
17
  __exportStar(require("./insert-node-in-polyline"), exports);
18
18
  __exportStar(require("./components/control"), exports);
19
19
  __exportStar(require("./components/menu"), exports);
20
+ __exportStar(require("./components/context-menu"), exports);
20
21
  __exportStar(require("./components/dnd-panel"), exports);
21
22
  __exportStar(require("./components/selection-select"), exports);
22
23
  __exportStar(require("./components/mini-map"), exports);
@@ -177,3 +177,21 @@
177
177
  .lf-resize-control-3{
178
178
  cursor: sw-resize;
179
179
  }
180
+ /* context-menu */
181
+ .lf-inner-context {
182
+ display: none;
183
+ position: absolute;
184
+ /* display: flex; */
185
+ flex-direction: column;
186
+ flex-wrap: wrap;
187
+ height: 90px;
188
+ }
189
+ .lf-context-item {
190
+ padding: 2px 3px;
191
+ width: 20px;
192
+ height: 20px;
193
+ margin: 0 2px 2px 0;
194
+ }
195
+ .lf-context-item:hover {
196
+ background: rgba(201, 217, 216, 0.5);
197
+ }
@@ -8,6 +8,7 @@ declare class RectResizeModel extends RectNodeModel {
8
8
  }
9
9
  declare class RectResizeView extends RectNode {
10
10
  getControlGroup(attributes: any): h.JSX.Element;
11
+ getResizeShape(): h.JSX.Element;
11
12
  getShape(): h.JSX.Element;
12
13
  }
13
14
  declare const RectResize: {
@@ -53,15 +53,15 @@ var RectResizeView = /** @class */ (function (_super) {
53
53
  var _a = this.props, model = _a.model, graphModel = _a.graphModel;
54
54
  return (h(ControlGroup, __assign({}, attributes, { nodeModel: model, graphModel: graphModel })));
55
55
  };
56
- // // getResizeShape绘制图形,功能等同于基础矩形的getShape功能,可以通过复写此方法,进行节点自定义
57
- // getResizeShape() {
58
- // return super.getShape();
59
- // }
56
+ // getResizeShape绘制图形,功能等同于基础矩形的getShape功能,可以通过复写此方法,进行节点自定义
57
+ RectResizeView.prototype.getResizeShape = function () {
58
+ return _super.prototype.getShape.call(this);
59
+ };
60
60
  RectResizeView.prototype.getShape = function () {
61
61
  var attributes = _super.prototype.getAttributes.call(this);
62
62
  var isSelected = this.props.model.isSelected;
63
63
  return (h("g", null,
64
- _super.prototype.getShape.call(this),
64
+ this.getResizeShape(),
65
65
  isSelected ? this.getControlGroup(attributes) : ''));
66
66
  };
67
67
  return RectResizeView;
package/es/bpmn/index.js CHANGED
@@ -16,8 +16,11 @@ var BpmnElement = /** @class */ (function () {
16
16
  lf.register(ExclusiveGateway);
17
17
  lf.register(UserTask);
18
18
  lf.register(ServiceTask);
19
- lf.register(SequenceFlow);
20
- lf.setDefaultEdgeType('bpmn:sequenceFlow');
19
+ // 支持自定义bpmn元素的连线
20
+ if (!lf.options.customBpmnEdge) {
21
+ lf.register(SequenceFlow);
22
+ lf.setDefaultEdgeType('bpmn:sequenceFlow');
23
+ }
21
24
  }
22
25
  BpmnElement.pluginName = 'BpmnElement';
23
26
  return BpmnElement;
@@ -0,0 +1,24 @@
1
+ declare class ContextMenu {
2
+ static pluginName: string;
3
+ private __menuDOM;
4
+ private lf;
5
+ private _activeData;
6
+ private menuTypeMap;
7
+ container: any;
8
+ isShow: boolean;
9
+ constructor({ lf }: {
10
+ lf: any;
11
+ });
12
+ render(lf: any, container: any): void;
13
+ /**
14
+ * 获取新菜单位置
15
+ */
16
+ private getContextMenuPosition;
17
+ private createContextMenu;
18
+ private addNode;
19
+ private showMenu;
20
+ listenDelete: () => void;
21
+ private hideMenu;
22
+ }
23
+ export default ContextMenu;
24
+ export { ContextMenu, };
@@ -0,0 +1,208 @@
1
+ var __read = (this && this.__read) || function (o, n) {
2
+ var m = typeof Symbol === "function" && o[Symbol.iterator];
3
+ if (!m) return o;
4
+ var i = m.call(o), r, ar = [], e;
5
+ try {
6
+ while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
7
+ }
8
+ catch (error) { e = { error: error }; }
9
+ finally {
10
+ try {
11
+ if (r && !r.done && (m = i["return"])) m.call(i);
12
+ }
13
+ finally { if (e) throw e.error; }
14
+ }
15
+ return ar;
16
+ };
17
+ var COMMON_TYPE_KEY = 'menu-common';
18
+ var NEXT_X_DISTANCE = 200;
19
+ var NEXT_Y_DISTANCE = 100;
20
+ var ContextMenu = /** @class */ (function () {
21
+ function ContextMenu(_a) {
22
+ var _this = this;
23
+ var lf = _a.lf;
24
+ this.menuTypeMap = new Map();
25
+ this.listenDelete = function () {
26
+ _this.hideMenu();
27
+ };
28
+ this.lf = lf;
29
+ this.__menuDOM = document.createElement('div');
30
+ this.__menuDOM.className = 'lf-inner-context';
31
+ // const commonMenu = [];
32
+ this.menuTypeMap.set(COMMON_TYPE_KEY, []);
33
+ this.lf.setContextMenuByType = function (type, menus) {
34
+ _this.menuTypeMap.set(type, menus);
35
+ };
36
+ this.lf.setContextMenuItems = function (menus) {
37
+ _this.menuTypeMap.set(COMMON_TYPE_KEY, menus);
38
+ };
39
+ this.lf.showContextMenu = function (data) {
40
+ if (!data || !data.id) {
41
+ console.warn('请检查传入的参数');
42
+ return;
43
+ }
44
+ _this._activeData = data;
45
+ _this.createContextMenu();
46
+ };
47
+ this.lf.hideContextMenu = function () {
48
+ _this.hideMenu();
49
+ };
50
+ }
51
+ ContextMenu.prototype.render = function (lf, container) {
52
+ var _this = this;
53
+ this.container = container;
54
+ lf.on('node:click', function (_a) {
55
+ var data = _a.data;
56
+ _this._activeData = data;
57
+ _this.createContextMenu();
58
+ });
59
+ lf.on('edge:click', function (_a) {
60
+ var data = _a.data;
61
+ // 获取右上角坐标
62
+ _this._activeData = data;
63
+ _this.createContextMenu();
64
+ });
65
+ lf.on('blank:click', function () {
66
+ _this.hideMenu();
67
+ });
68
+ };
69
+ /**
70
+ * 获取新菜单位置
71
+ */
72
+ ContextMenu.prototype.getContextMenuPosition = function () {
73
+ var _a;
74
+ var data = this._activeData;
75
+ var Model = this.lf.graphModel.getElement(data.id);
76
+ if (!Model) {
77
+ console.warn("\u627E\u4E0D\u5230\u5143\u7D20" + data.id);
78
+ return;
79
+ }
80
+ var x;
81
+ var y;
82
+ if (Model.BaseType === 'edge') {
83
+ x = Number.MIN_SAFE_INTEGER;
84
+ y = Number.MAX_SAFE_INTEGER;
85
+ var edgeData = Model.getData();
86
+ x = Math.max(edgeData.startPoint.x, x);
87
+ y = Math.min(edgeData.startPoint.y, y);
88
+ x = Math.max(edgeData.endPoint.x, x);
89
+ y = Math.min(edgeData.endPoint.y, y);
90
+ if (edgeData.pointsList) {
91
+ edgeData.pointsList.forEach(function (point) {
92
+ x = Math.max(point.x, x);
93
+ y = Math.min(point.y, y);
94
+ });
95
+ }
96
+ }
97
+ if (Model.BaseType === 'node') {
98
+ var x1 = data.x + Model.width / 2;
99
+ var y1 = data.y - Model.height / 2;
100
+ _a = __read(this.lf.graphModel.transformMatrix.CanvasPointToHtmlPoint([x1, y1]), 2), x = _a[0], y = _a[1];
101
+ }
102
+ return [x, y];
103
+ };
104
+ ContextMenu.prototype.createContextMenu = function () {
105
+ var _this = this;
106
+ var isSilentMode = this.lf.options.isSilentMode;
107
+ // 静默模式不显示菜单
108
+ if (isSilentMode) {
109
+ return;
110
+ }
111
+ var items = this.menuTypeMap.get(this._activeData.type) || [];
112
+ items = items.concat(this.menuTypeMap.get(COMMON_TYPE_KEY));
113
+ var menus = document.createDocumentFragment();
114
+ items.forEach(function (item) {
115
+ var menuItem = document.createElement('div');
116
+ menuItem.className = 'lf-context-item';
117
+ var img = document.createElement('img');
118
+ img.src = item.icon;
119
+ img.style.width = '20px';
120
+ img.style.height = '20px';
121
+ img.style.cursor = 'pointer';
122
+ img.addEventListener('click', function () {
123
+ _this.hideMenu();
124
+ if (item.callback) {
125
+ item.callback(_this._activeData);
126
+ }
127
+ else {
128
+ _this.addNode({
129
+ sourceId: _this._activeData.id,
130
+ x: _this._activeData.x,
131
+ y: _this._activeData.y,
132
+ properties: item.properties,
133
+ type: item.type,
134
+ });
135
+ }
136
+ });
137
+ menuItem.appendChild(img);
138
+ menus.appendChild(menuItem);
139
+ });
140
+ this.__menuDOM.innerHTML = '';
141
+ this.__menuDOM.appendChild(menus);
142
+ this.showMenu();
143
+ };
144
+ ContextMenu.prototype.addNode = function (node, y) {
145
+ var isDeep = y !== undefined;
146
+ if (y === undefined) {
147
+ y = node.y;
148
+ }
149
+ var nodeModel = this.lf.getNodeModel(node.sourceId);
150
+ var leftTopX = node.x - nodeModel.width + NEXT_X_DISTANCE;
151
+ var leftTopY = y - node.y / 2 - 20;
152
+ var rightBottomX = node.x + nodeModel.width + NEXT_X_DISTANCE;
153
+ var rightBottomY = y + node.y / 2 + 20;
154
+ var exsitElements = this.lf.getAreaElement([leftTopX, leftTopY], [rightBottomX, rightBottomY]);
155
+ if (exsitElements.length) {
156
+ y = y + NEXT_Y_DISTANCE;
157
+ this.addNode(node, y);
158
+ return;
159
+ }
160
+ var newNode = this.lf.addNode({
161
+ type: node.type,
162
+ x: node.x + 200,
163
+ y: y,
164
+ properties: node.properties,
165
+ });
166
+ var startPoint;
167
+ var endPoint;
168
+ if (isDeep) {
169
+ startPoint = {
170
+ x: node.x,
171
+ y: node.y + nodeModel.height / 2,
172
+ };
173
+ endPoint = {
174
+ x: newNode.x - newNode.width / 2,
175
+ y: newNode.y,
176
+ };
177
+ }
178
+ this.lf.createEdge({
179
+ sourceNodeId: node.sourceId,
180
+ targetNodeId: newNode.id,
181
+ startPoint: startPoint,
182
+ endPoint: endPoint,
183
+ });
184
+ };
185
+ ContextMenu.prototype.showMenu = function () {
186
+ var _a = __read(this.getContextMenuPosition(), 2), x = _a[0], y = _a[1];
187
+ this.__menuDOM.style.display = 'flex';
188
+ this.__menuDOM.style.top = y + "px";
189
+ this.__menuDOM.style.left = x + 10 + "px";
190
+ this.container.appendChild(this.__menuDOM);
191
+ // 菜单显示的时候,监听删除,同时隐藏
192
+ !this.isShow && this.lf.on('node:delete,edge:delete,node:drag,graph:transform', this.listenDelete);
193
+ this.isShow = true;
194
+ };
195
+ ContextMenu.prototype.hideMenu = function () {
196
+ this.__menuDOM.innerHTML = '';
197
+ this.__menuDOM.style.display = 'none';
198
+ if (this.isShow) {
199
+ this.container.removeChild(this.__menuDOM);
200
+ }
201
+ this.lf.off('node:delete,edge:delete,node:drag,graph:transform', this.listenDelete);
202
+ this.isShow = false;
203
+ };
204
+ ContextMenu.pluginName = 'ContextMenu';
205
+ return ContextMenu;
206
+ }());
207
+ export default ContextMenu;
208
+ export { ContextMenu, };
@@ -27,7 +27,6 @@ var MiniMap = {
27
27
  __height: 220,
28
28
  __miniMapWidth: 450,
29
29
  __miniMapHeight: 660,
30
- __isShow: false,
31
30
  __viewPortTop: 0,
32
31
  __viewPortLeft: 0,
33
32
  __startPosition: null,
@@ -44,6 +43,8 @@ var MiniMap = {
44
43
  MiniMap.__miniMapHeight = (lf.width * 220) / 150;
45
44
  MiniMap.__LogicFlow = LogicFlow;
46
45
  this.__init();
46
+ // 避免多次install的时候, _isShow状态被修改了
47
+ MiniMap.__isShow = false;
47
48
  },
48
49
  init: function (option) {
49
50
  this.__disabledPlugins = this.__disabledPlugins.concat(option.disabledPlugins || []);
@@ -60,7 +61,9 @@ var MiniMap = {
60
61
  ];
61
62
  events.forEach(function (eventName) {
62
63
  MiniMap.__lf.on(eventName, function () {
63
- MiniMap.__setView();
64
+ if (MiniMap.__isShow) {
65
+ MiniMap.__setView();
66
+ }
64
67
  });
65
68
  });
66
69
  },
package/es/index.d.ts CHANGED
@@ -5,6 +5,7 @@ export * from './turbo-adapter';
5
5
  export * from './insert-node-in-polyline';
6
6
  export * from './components/control';
7
7
  export * from './components/menu';
8
+ export * from './components/context-menu';
8
9
  export * from './components/dnd-panel';
9
10
  export * from './components/selection-select';
10
11
  export * from './components/mini-map';
package/es/index.js CHANGED
@@ -5,6 +5,7 @@ export * from './turbo-adapter';
5
5
  export * from './insert-node-in-polyline';
6
6
  export * from './components/control';
7
7
  export * from './components/menu';
8
+ export * from './components/context-menu';
8
9
  export * from './components/dnd-panel';
9
10
  export * from './components/selection-select';
10
11
  export * from './components/mini-map';