@flowgram.ai/document 0.1.0-alpha.2 → 0.1.0-alpha.20
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/dist/esm/index.js +712 -548
- package/dist/esm/index.js.map +1 -1
- package/dist/index.d.mts +262 -74
- package/dist/index.d.ts +262 -74
- package/dist/index.js +716 -552
- package/dist/index.js.map +1 -1
- package/package.json +11 -11
package/dist/index.js
CHANGED
|
@@ -27,8 +27,8 @@ var __decorateClass = (decorators, target, key, kind) => {
|
|
|
27
27
|
var __decorateParam = (index, decorator) => (target, key) => decorator(target, key, index);
|
|
28
28
|
|
|
29
29
|
// src/index.ts
|
|
30
|
-
var
|
|
31
|
-
__export(
|
|
30
|
+
var index_exports = {};
|
|
31
|
+
__export(index_exports, {
|
|
32
32
|
ConstantKeys: () => ConstantKeys,
|
|
33
33
|
DEFAULT_FLOW_NODE_META: () => DEFAULT_FLOW_NODE_META,
|
|
34
34
|
DEFAULT_SIZE: () => DEFAULT_SIZE,
|
|
@@ -71,7 +71,7 @@ __export(src_exports, {
|
|
|
71
71
|
drawLineToNext: () => drawLineToNext,
|
|
72
72
|
getDefaultSpacing: () => getDefaultSpacing
|
|
73
73
|
});
|
|
74
|
-
module.exports = __toCommonJS(
|
|
74
|
+
module.exports = __toCommonJS(index_exports);
|
|
75
75
|
|
|
76
76
|
// src/typings/flow.ts
|
|
77
77
|
var FlowNodeBaseType = /* @__PURE__ */ ((FlowNodeBaseType2) => {
|
|
@@ -85,11 +85,19 @@ var FlowNodeBaseType = /* @__PURE__ */ ((FlowNodeBaseType2) => {
|
|
|
85
85
|
FlowNodeBaseType2["BLOCK_ORDER_ICON"] = "blockOrderIcon";
|
|
86
86
|
FlowNodeBaseType2["GROUP"] = "group";
|
|
87
87
|
FlowNodeBaseType2["END"] = "end";
|
|
88
|
+
FlowNodeBaseType2["BREAK"] = "break";
|
|
88
89
|
FlowNodeBaseType2["CONDITION"] = "condition";
|
|
89
90
|
FlowNodeBaseType2["SUB_CANVAS"] = "subCanvas";
|
|
91
|
+
FlowNodeBaseType2["MULTI_INPUTS"] = "multiInputs";
|
|
92
|
+
FlowNodeBaseType2["MULTI_OUTPUTS"] = "multiOutputs";
|
|
93
|
+
FlowNodeBaseType2["INPUT"] = "input";
|
|
94
|
+
FlowNodeBaseType2["OUTPUT"] = "output";
|
|
95
|
+
FlowNodeBaseType2["SLOT"] = "slot";
|
|
96
|
+
FlowNodeBaseType2["SLOT_BLOCK"] = "slotBlock";
|
|
90
97
|
return FlowNodeBaseType2;
|
|
91
98
|
})(FlowNodeBaseType || {});
|
|
92
99
|
var FlowNodeSplitType = /* @__PURE__ */ ((FlowNodeSplitType2) => {
|
|
100
|
+
FlowNodeSplitType2["SIMPLE_SPLIT"] = "simpleSplit";
|
|
93
101
|
FlowNodeSplitType2["DYNAMIC_SPLIT"] = "dynamicSplit";
|
|
94
102
|
FlowNodeSplitType2["STATIC_SPLIT"] = "staticSplit";
|
|
95
103
|
return FlowNodeSplitType2;
|
|
@@ -145,6 +153,10 @@ var DefaultSpacingKey = {
|
|
|
145
153
|
* 普通节点间距。垂直 / 水平
|
|
146
154
|
*/
|
|
147
155
|
NODE_SPACING: "SPACING",
|
|
156
|
+
/**
|
|
157
|
+
* 分支节点间距
|
|
158
|
+
*/
|
|
159
|
+
BRANCH_SPACING: "BRANCH_SPACING",
|
|
148
160
|
/**
|
|
149
161
|
* 圆弧线条 x radius
|
|
150
162
|
*/
|
|
@@ -171,13 +183,19 @@ var DEFAULT_SPACING = {
|
|
|
171
183
|
NULL: 0,
|
|
172
184
|
[DefaultSpacingKey.NODE_SPACING]: 32,
|
|
173
185
|
// 普通节点间距。垂直 / 水平
|
|
186
|
+
[DefaultSpacingKey.BRANCH_SPACING]: 20,
|
|
187
|
+
// 分支节点间距
|
|
188
|
+
/**
|
|
189
|
+
* @deprecated use 'BRANCH_SPACING' instead
|
|
190
|
+
*/
|
|
174
191
|
MARGIN_RIGHT: 20,
|
|
175
|
-
//
|
|
192
|
+
// 分支节点右边间距
|
|
176
193
|
INLINE_BLOCK_PADDING_BOTTOM: 16,
|
|
177
194
|
// block 底部留白
|
|
178
195
|
INLINE_BLOCKS_PADDING_TOP: 30,
|
|
179
196
|
// block list 上部留白间距
|
|
180
|
-
|
|
197
|
+
// JS 浮点数有误差,1046.6 -1006.6 = 39.9999999,会导致 间距/20 < 2 导致布局计算问题,因此需要额外增加 0.1 像素
|
|
198
|
+
[DefaultSpacingKey.INLINE_BLOCKS_PADDING_BOTTOM]: 40.1,
|
|
181
199
|
// block lit 下部留白间距,因为有两个拐弯,所以翻一倍
|
|
182
200
|
MIN_INLINE_BLOCK_SPACING: 200,
|
|
183
201
|
// 分支间最小边距 (垂直布局)
|
|
@@ -212,8 +230,6 @@ var DEFAULT_FLOW_NODE_META = (nodeType, document) => {
|
|
|
212
230
|
isStart: nodeType === "start",
|
|
213
231
|
hidden,
|
|
214
232
|
defaultExpanded: document.options.allNodesDefaultExpanded,
|
|
215
|
-
expandedSize: { width: 520, height: 300 },
|
|
216
|
-
// 展开后的大小
|
|
217
233
|
size: DEFAULT_SIZE,
|
|
218
234
|
origin: document.layout.getDefaultNodeOrigin(),
|
|
219
235
|
isInlineBlocks: nodeType === "inlineBlocks" /* INLINE_BLOCKS */,
|
|
@@ -233,13 +249,37 @@ var DEFAULT_FLOW_NODE_META = (nodeType, document) => {
|
|
|
233
249
|
};
|
|
234
250
|
var FlowNodeRegistry;
|
|
235
251
|
((FlowNodeRegistry4) => {
|
|
252
|
+
function mergeChildRegistries(r1 = [], r2 = []) {
|
|
253
|
+
if (r1.length === 0 || r2.length === 0) {
|
|
254
|
+
return [...r1, ...r2];
|
|
255
|
+
}
|
|
256
|
+
const r1Filter = r1.map((r1Current) => {
|
|
257
|
+
const r2Current = r2.find((n) => n.type === r1Current.type);
|
|
258
|
+
if (r2Current) {
|
|
259
|
+
return merge(r1Current, r2Current, r1Current.type);
|
|
260
|
+
}
|
|
261
|
+
return r1Current;
|
|
262
|
+
});
|
|
263
|
+
const r2Filter = r2.filter((n) => !r1.some((r) => r.type === n.type));
|
|
264
|
+
return [...r1Filter, ...r2Filter];
|
|
265
|
+
}
|
|
266
|
+
FlowNodeRegistry4.mergeChildRegistries = mergeChildRegistries;
|
|
236
267
|
function merge(registry1, registry2, finalType) {
|
|
268
|
+
const extendKeys = registry1.__extends__ ? registry1.__extends__.slice() : [];
|
|
269
|
+
if (registry1.type !== registry2.type) {
|
|
270
|
+
extendKeys.unshift(registry1.type);
|
|
271
|
+
}
|
|
237
272
|
return {
|
|
238
273
|
...registry1,
|
|
239
274
|
...registry2,
|
|
275
|
+
extendChildRegistries: mergeChildRegistries(
|
|
276
|
+
registry1.extendChildRegistries,
|
|
277
|
+
registry2.extendChildRegistries
|
|
278
|
+
),
|
|
240
279
|
meta: { ...registry1.meta, ...registry2.meta },
|
|
241
280
|
extend: void 0,
|
|
242
|
-
type: finalType
|
|
281
|
+
type: finalType,
|
|
282
|
+
__extends__: extendKeys
|
|
243
283
|
};
|
|
244
284
|
}
|
|
245
285
|
FlowNodeRegistry4.merge = merge;
|
|
@@ -263,7 +303,6 @@ var OperationType = /* @__PURE__ */ ((OperationType2) => {
|
|
|
263
303
|
OperationType2["moveChildNodes"] = "moveChildNodes";
|
|
264
304
|
OperationType2["addNodes"] = "addNodes";
|
|
265
305
|
OperationType2["deleteNodes"] = "deleteNodes";
|
|
266
|
-
OperationType2["changeNode"] = "changeNode";
|
|
267
306
|
OperationType2["addChildNode"] = "addChildNode";
|
|
268
307
|
OperationType2["deleteChildNode"] = "deleteChildNode";
|
|
269
308
|
OperationType2["addNode"] = "addNode";
|
|
@@ -304,16 +343,18 @@ var _FlowNodeRenderData = class _FlowNodeRenderData extends import_core.EntityDa
|
|
|
304
343
|
expanded: defaultExpanded || false,
|
|
305
344
|
activated: false,
|
|
306
345
|
hovered: false,
|
|
307
|
-
dragging: false
|
|
346
|
+
dragging: false,
|
|
347
|
+
stackIndex: 0
|
|
308
348
|
};
|
|
309
349
|
}
|
|
310
|
-
updateExtInfo(info) {
|
|
311
|
-
|
|
312
|
-
|
|
350
|
+
updateExtInfo(info, fullUpdate) {
|
|
351
|
+
const oldInfo = this.data.extInfo;
|
|
352
|
+
const newInfo = fullUpdate ? info : { ...oldInfo, ...info };
|
|
353
|
+
if (import_utils.Compare.isChanged(oldInfo, newInfo)) {
|
|
313
354
|
this.update({
|
|
314
|
-
extInfo:
|
|
355
|
+
extInfo: newInfo
|
|
315
356
|
});
|
|
316
|
-
this.onExtInfoChangeEmitter.fire({ oldInfo, newInfo
|
|
357
|
+
this.onExtInfoChangeEmitter.fire({ oldInfo, newInfo });
|
|
317
358
|
}
|
|
318
359
|
}
|
|
319
360
|
getExtInfo() {
|
|
@@ -410,6 +451,12 @@ var _FlowNodeRenderData = class _FlowNodeRenderData extends import_core.EntityDa
|
|
|
410
451
|
}
|
|
411
452
|
return this.data.activated;
|
|
412
453
|
}
|
|
454
|
+
get stackIndex() {
|
|
455
|
+
return this.data.stackIndex;
|
|
456
|
+
}
|
|
457
|
+
set stackIndex(index) {
|
|
458
|
+
this.data.stackIndex = index;
|
|
459
|
+
}
|
|
413
460
|
get lineActivated() {
|
|
414
461
|
const { activated } = this;
|
|
415
462
|
if (!activated) return false;
|
|
@@ -459,10 +506,9 @@ var _FlowNodeTransformData = class _FlowNodeTransformData extends import_core2.E
|
|
|
459
506
|
return this.entity.id;
|
|
460
507
|
}
|
|
461
508
|
getDefaultData() {
|
|
462
|
-
const { size,
|
|
463
|
-
const defaultSize = defaultExpanded ? expandedSize : size;
|
|
509
|
+
const { size, hidden } = this.entity.getNodeMeta();
|
|
464
510
|
return {
|
|
465
|
-
size: !hidden ? { ...
|
|
511
|
+
size: !hidden ? { ...size } : { width: 0, height: 0 }
|
|
466
512
|
};
|
|
467
513
|
}
|
|
468
514
|
/**
|
|
@@ -493,6 +539,11 @@ var _FlowNodeTransformData = class _FlowNodeTransformData extends import_core2.E
|
|
|
493
539
|
y: position.y
|
|
494
540
|
};
|
|
495
541
|
}
|
|
542
|
+
set position(position) {
|
|
543
|
+
this.transform.update({
|
|
544
|
+
position
|
|
545
|
+
});
|
|
546
|
+
}
|
|
496
547
|
set size(size) {
|
|
497
548
|
const { width, height } = this.data.size;
|
|
498
549
|
if (this.isContainer) return;
|
|
@@ -1040,37 +1091,7 @@ var FlowNodeEntity = class extends import_core4.Entity {
|
|
|
1040
1091
|
* @param newId
|
|
1041
1092
|
*/
|
|
1042
1093
|
toJSON() {
|
|
1043
|
-
|
|
1044
|
-
return this.document.options.toNodeJSON(this);
|
|
1045
|
-
}
|
|
1046
|
-
const nodesMap = {};
|
|
1047
|
-
let startNodeJSON;
|
|
1048
|
-
this.document.traverse((node) => {
|
|
1049
|
-
const isSystemNode = node.id.startsWith("$");
|
|
1050
|
-
if (isSystemNode) return;
|
|
1051
|
-
const nodeJSONData = this.getJSONData();
|
|
1052
|
-
const nodeJSON = {
|
|
1053
|
-
id: node.id,
|
|
1054
|
-
type: node.flowNodeType
|
|
1055
|
-
};
|
|
1056
|
-
if (nodeJSONData !== void 0) {
|
|
1057
|
-
nodeJSON.data = nodeJSONData;
|
|
1058
|
-
}
|
|
1059
|
-
if (!startNodeJSON) startNodeJSON = nodeJSON;
|
|
1060
|
-
let { parent } = node;
|
|
1061
|
-
if (parent && parent.id.startsWith("$")) {
|
|
1062
|
-
parent = parent.originParent;
|
|
1063
|
-
}
|
|
1064
|
-
const parentJSON = parent ? nodesMap[parent.id] : void 0;
|
|
1065
|
-
if (parentJSON) {
|
|
1066
|
-
if (!parentJSON.blocks) {
|
|
1067
|
-
parentJSON.blocks = [];
|
|
1068
|
-
}
|
|
1069
|
-
parentJSON.blocks.push(nodeJSON);
|
|
1070
|
-
}
|
|
1071
|
-
nodesMap[node.id] = nodeJSON;
|
|
1072
|
-
}, this);
|
|
1073
|
-
return startNodeJSON;
|
|
1094
|
+
return this.document.toNodeJSON(this);
|
|
1074
1095
|
}
|
|
1075
1096
|
get isVertical() {
|
|
1076
1097
|
return this.document.layout.name === "vertical-fixed-layout" /* VERTICAL_FIXED_LAYOUT */;
|
|
@@ -1079,8 +1100,8 @@ var FlowNodeEntity = class extends import_core4.Entity {
|
|
|
1079
1100
|
* 修改节点扩展信息
|
|
1080
1101
|
* @param info
|
|
1081
1102
|
*/
|
|
1082
|
-
updateExtInfo(extInfo) {
|
|
1083
|
-
this.getData(FlowNodeRenderData).updateExtInfo(extInfo);
|
|
1103
|
+
updateExtInfo(extInfo, fullUpdate) {
|
|
1104
|
+
this.getData(FlowNodeRenderData).updateExtInfo(extInfo, fullUpdate);
|
|
1084
1105
|
}
|
|
1085
1106
|
/**
|
|
1086
1107
|
* 获取节点扩展信息
|
|
@@ -1109,6 +1130,19 @@ var FlowNodeEntity = class extends import_core4.Entity {
|
|
|
1109
1130
|
get bounds() {
|
|
1110
1131
|
return this.transform.bounds;
|
|
1111
1132
|
}
|
|
1133
|
+
/**
|
|
1134
|
+
* Check node extend type
|
|
1135
|
+
*/
|
|
1136
|
+
isExtend(parentType) {
|
|
1137
|
+
return this.document.isExtend(this.flowNodeType, parentType);
|
|
1138
|
+
}
|
|
1139
|
+
/**
|
|
1140
|
+
* Check node type
|
|
1141
|
+
* @param parentType
|
|
1142
|
+
*/
|
|
1143
|
+
isTypeOrExtendType(parentType) {
|
|
1144
|
+
return this.document.isTypeOrExtendType(this.flowNodeType, parentType);
|
|
1145
|
+
}
|
|
1112
1146
|
};
|
|
1113
1147
|
FlowNodeEntity.type = "FlowNodeEntity";
|
|
1114
1148
|
((FlowNodeEntity2) => {
|
|
@@ -1202,7 +1236,7 @@ var FlowDocumentTransformerEntity = class extends import_core5.ConfigEntity {
|
|
|
1202
1236
|
FlowDocumentTransformerEntity.type = "FlowDocumentTransformerEntity";
|
|
1203
1237
|
|
|
1204
1238
|
// src/entities/flow-renderer-state-entity.ts
|
|
1205
|
-
var
|
|
1239
|
+
var import_lodash_es = require("lodash-es");
|
|
1206
1240
|
var import_core6 = require("@flowgram.ai/core");
|
|
1207
1241
|
var FlowRendererStateEntity = class extends import_core6.ConfigEntity {
|
|
1208
1242
|
getDefaultConfig() {
|
|
@@ -1219,6 +1253,22 @@ var FlowRendererStateEntity = class extends import_core6.ConfigEntity {
|
|
|
1219
1253
|
nodeHoveredId: node?.id
|
|
1220
1254
|
});
|
|
1221
1255
|
}
|
|
1256
|
+
get dragging() {
|
|
1257
|
+
return this.config.dragging;
|
|
1258
|
+
}
|
|
1259
|
+
setDragging(dragging) {
|
|
1260
|
+
this.updateConfig({
|
|
1261
|
+
dragging
|
|
1262
|
+
});
|
|
1263
|
+
}
|
|
1264
|
+
get isBranch() {
|
|
1265
|
+
return this.config.isBranch;
|
|
1266
|
+
}
|
|
1267
|
+
setIsBranch(isBranch) {
|
|
1268
|
+
this.updateConfig({
|
|
1269
|
+
isBranch
|
|
1270
|
+
});
|
|
1271
|
+
}
|
|
1222
1272
|
getDragLabelSide() {
|
|
1223
1273
|
return this.config.dragLabelSide;
|
|
1224
1274
|
}
|
|
@@ -1257,13 +1307,13 @@ var FlowRendererStateEntity = class extends import_core6.ConfigEntity {
|
|
|
1257
1307
|
});
|
|
1258
1308
|
}
|
|
1259
1309
|
onNodeHoveredChange(fn, debounceTime = 100) {
|
|
1260
|
-
return this.onConfigChanged((0,
|
|
1310
|
+
return this.onConfigChanged((0, import_lodash_es.debounce)(() => fn(this.getNodeHovered()), debounceTime));
|
|
1261
1311
|
}
|
|
1262
1312
|
};
|
|
1263
1313
|
FlowRendererStateEntity.type = "FlowRendererStateEntity";
|
|
1264
1314
|
|
|
1265
1315
|
// src/flow-document.ts
|
|
1266
|
-
var
|
|
1316
|
+
var import_lodash_es2 = require("lodash-es");
|
|
1267
1317
|
var import_inversify2 = require("inversify");
|
|
1268
1318
|
var import_utils7 = require("@flowgram.ai/utils");
|
|
1269
1319
|
var import_core7 = require("@flowgram.ai/core");
|
|
@@ -1441,13 +1491,15 @@ var FlowVirtualTree = class _FlowVirtualTree {
|
|
|
1441
1491
|
get size() {
|
|
1442
1492
|
return this.map.size;
|
|
1443
1493
|
}
|
|
1444
|
-
toString() {
|
|
1494
|
+
toString(showType) {
|
|
1445
1495
|
const ret = [];
|
|
1446
1496
|
this.traverse((node, depth) => {
|
|
1447
1497
|
if (depth === 0) {
|
|
1448
1498
|
ret.push(node.id);
|
|
1449
1499
|
} else {
|
|
1450
|
-
ret.push(
|
|
1500
|
+
ret.push(
|
|
1501
|
+
`|${new Array(depth).fill("--").join("")} ${showType ? `${node.flowNodeType}(${node.id})` : node.id}`
|
|
1502
|
+
);
|
|
1451
1503
|
}
|
|
1452
1504
|
});
|
|
1453
1505
|
return `${ret.join("\n")}`;
|
|
@@ -1653,7 +1705,12 @@ var ConstantKeys = {
|
|
|
1653
1705
|
/***
|
|
1654
1706
|
* 线条、label 激活后的颜色
|
|
1655
1707
|
*/
|
|
1656
|
-
BASE_ACTIVATED_COLOR: "BASE_ACTIVATED_COLOR"
|
|
1708
|
+
BASE_ACTIVATED_COLOR: "BASE_ACTIVATED_COLOR",
|
|
1709
|
+
/**
|
|
1710
|
+
* Branch bottom margin
|
|
1711
|
+
* 分支下边距
|
|
1712
|
+
*/
|
|
1713
|
+
INLINE_BLOCKS_PADDING_TOP: "INLINE_BLOCKS_PADDING_TOP"
|
|
1657
1714
|
};
|
|
1658
1715
|
|
|
1659
1716
|
// src/flow-document-contribution.ts
|
|
@@ -1708,6 +1765,13 @@ var FlowDocument = class {
|
|
|
1708
1765
|
this.onNodeCreate = this.onNodeCreateEmitter.event;
|
|
1709
1766
|
this.onNodeDispose = this.onNodeDisposeEmitter.event;
|
|
1710
1767
|
this.onLayoutChange = this.onLayoutChangeEmitter.event;
|
|
1768
|
+
this._disposed = false;
|
|
1769
|
+
}
|
|
1770
|
+
/**
|
|
1771
|
+
*
|
|
1772
|
+
*/
|
|
1773
|
+
get disposed() {
|
|
1774
|
+
return this._disposed;
|
|
1711
1775
|
}
|
|
1712
1776
|
init() {
|
|
1713
1777
|
if (!this.options) this.options = FlowDocumentOptionsDefault;
|
|
@@ -1733,6 +1797,7 @@ var FlowDocument = class {
|
|
|
1733
1797
|
* @param fireRender 是否要触发渲染,默认 true
|
|
1734
1798
|
*/
|
|
1735
1799
|
fromJSON(json, fireRender = true) {
|
|
1800
|
+
if (this._disposed) return;
|
|
1736
1801
|
this.originTree.clear();
|
|
1737
1802
|
this.renderTree.clear();
|
|
1738
1803
|
this.entityManager.changeEntityLocked = true;
|
|
@@ -1801,7 +1866,7 @@ var FlowDocument = class {
|
|
|
1801
1866
|
* @param data
|
|
1802
1867
|
* @param addedNodes
|
|
1803
1868
|
*/
|
|
1804
|
-
addNode(data, addedNodes
|
|
1869
|
+
addNode(data, addedNodes) {
|
|
1805
1870
|
const { id, type = "block", originParent, parent, meta, hidden, index } = data;
|
|
1806
1871
|
let node = this.getNode(id);
|
|
1807
1872
|
let isNew = false;
|
|
@@ -1819,13 +1884,14 @@ var FlowDocument = class {
|
|
|
1819
1884
|
originParent,
|
|
1820
1885
|
meta
|
|
1821
1886
|
});
|
|
1887
|
+
this.options.preNodeCreate?.(node);
|
|
1822
1888
|
const datas = dataRegistries ? this.nodeDataRegistries.concat(...dataRegistries) : this.nodeDataRegistries;
|
|
1823
1889
|
node.addInitializeData(datas);
|
|
1824
1890
|
node.onDispose(() => this.onNodeDisposeEmitter.fire({ node }));
|
|
1825
|
-
|
|
1826
|
-
this.options.fromNodeJSON(node, data);
|
|
1827
|
-
}
|
|
1891
|
+
this.options.fromNodeJSON?.(node, data, true);
|
|
1828
1892
|
isNew = true;
|
|
1893
|
+
} else {
|
|
1894
|
+
this.options.fromNodeJSON?.(node, data, false);
|
|
1829
1895
|
}
|
|
1830
1896
|
node.initData({
|
|
1831
1897
|
originParent,
|
|
@@ -1837,7 +1903,6 @@ var FlowDocument = class {
|
|
|
1837
1903
|
if (node.isStart) {
|
|
1838
1904
|
this.root.addChild(node);
|
|
1839
1905
|
}
|
|
1840
|
-
this.onNodeUpdateEmitter.fire({ node, data });
|
|
1841
1906
|
addedNodes?.push(node);
|
|
1842
1907
|
if (register.onCreate) {
|
|
1843
1908
|
const extendNodes = register.onCreate(node, data);
|
|
@@ -1851,11 +1916,14 @@ var FlowDocument = class {
|
|
|
1851
1916
|
this.addBlocksAsChildren(node, data.blocks, addedNodes);
|
|
1852
1917
|
}
|
|
1853
1918
|
}
|
|
1854
|
-
if (isNew
|
|
1919
|
+
if (isNew) {
|
|
1855
1920
|
this.onNodeCreateEmitter.fire({
|
|
1856
1921
|
node,
|
|
1857
|
-
data
|
|
1922
|
+
data,
|
|
1923
|
+
json: data
|
|
1858
1924
|
});
|
|
1925
|
+
} else {
|
|
1926
|
+
this.onNodeUpdateEmitter.fire({ node, data, json: data });
|
|
1859
1927
|
}
|
|
1860
1928
|
return node;
|
|
1861
1929
|
}
|
|
@@ -1891,18 +1959,16 @@ var FlowDocument = class {
|
|
|
1891
1959
|
parent: node
|
|
1892
1960
|
});
|
|
1893
1961
|
addedNodes.push(blockIconNode);
|
|
1894
|
-
|
|
1895
|
-
|
|
1896
|
-
|
|
1897
|
-
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
|
|
1901
|
-
|
|
1902
|
-
|
|
1903
|
-
|
|
1904
|
-
});
|
|
1905
|
-
}
|
|
1962
|
+
const inlineBlocksNode = this.addNode({
|
|
1963
|
+
id: `$inlineBlocks$${node.id}`,
|
|
1964
|
+
type: "inlineBlocks" /* INLINE_BLOCKS */,
|
|
1965
|
+
originParent: node,
|
|
1966
|
+
parent: node
|
|
1967
|
+
});
|
|
1968
|
+
addedNodes.push(inlineBlocksNode);
|
|
1969
|
+
blocks.forEach((blockData) => {
|
|
1970
|
+
this.addBlock(node, blockData, addedNodes);
|
|
1971
|
+
});
|
|
1906
1972
|
return addedNodes;
|
|
1907
1973
|
}
|
|
1908
1974
|
/**
|
|
@@ -1920,7 +1986,7 @@ var FlowDocument = class {
|
|
|
1920
1986
|
}
|
|
1921
1987
|
parent = parent || this.getNode(`$inlineBlocks$${node.id}`);
|
|
1922
1988
|
const block = this.addNode({
|
|
1923
|
-
...(0,
|
|
1989
|
+
...(0, import_lodash_es2.omit)(blockData, "blocks"),
|
|
1924
1990
|
type: blockData.type || "block" /* BLOCK */,
|
|
1925
1991
|
originParent: node,
|
|
1926
1992
|
parent,
|
|
@@ -1967,14 +2033,39 @@ var FlowDocument = class {
|
|
|
1967
2033
|
meta: {
|
|
1968
2034
|
...preRegistry?.meta,
|
|
1969
2035
|
...newRegistry?.meta
|
|
1970
|
-
}
|
|
2036
|
+
},
|
|
2037
|
+
extendChildRegistries: FlowNodeRegistry.mergeChildRegistries(
|
|
2038
|
+
preRegistry?.extendChildRegistries,
|
|
2039
|
+
newRegistry?.extendChildRegistries
|
|
2040
|
+
)
|
|
1971
2041
|
});
|
|
1972
2042
|
});
|
|
1973
2043
|
}
|
|
2044
|
+
/**
|
|
2045
|
+
* Check node extend
|
|
2046
|
+
* @param currentType
|
|
2047
|
+
* @param extendType
|
|
2048
|
+
*/
|
|
2049
|
+
isExtend(currentType, extendType) {
|
|
2050
|
+
return (this.getNodeRegistry(currentType).__extends__ || []).includes(extendType);
|
|
2051
|
+
}
|
|
2052
|
+
/**
|
|
2053
|
+
* Check node type
|
|
2054
|
+
* @param currentType
|
|
2055
|
+
* @param extendType
|
|
2056
|
+
*/
|
|
2057
|
+
isTypeOrExtendType(currentType, extendType) {
|
|
2058
|
+
return currentType === extendType || this.isExtend(currentType, extendType);
|
|
2059
|
+
}
|
|
1974
2060
|
/**
|
|
1975
2061
|
* 导出数据,可以重载
|
|
1976
2062
|
*/
|
|
1977
2063
|
toJSON() {
|
|
2064
|
+
if (this.disposed) {
|
|
2065
|
+
throw new Error(
|
|
2066
|
+
"The FlowDocument has been disposed and it is no longer possible to call toJSON."
|
|
2067
|
+
);
|
|
2068
|
+
}
|
|
1978
2069
|
return {
|
|
1979
2070
|
nodes: this.root.toJSON().blocks
|
|
1980
2071
|
};
|
|
@@ -1994,6 +2085,7 @@ var FlowDocument = class {
|
|
|
1994
2085
|
const customDefaultRegistry = this.options.getNodeDefaultRegistry?.(type);
|
|
1995
2086
|
let register = this.registers.get(type) || { type };
|
|
1996
2087
|
const extendRegisters = [];
|
|
2088
|
+
const extendKey = register.extend;
|
|
1997
2089
|
if (register.extend && this.registers.has(register.extend)) {
|
|
1998
2090
|
register = FlowNodeRegistry.merge(
|
|
1999
2091
|
this.getNodeRegistry(register.extend),
|
|
@@ -2024,6 +2116,9 @@ var FlowDocument = class {
|
|
|
2024
2116
|
...register.meta
|
|
2025
2117
|
}
|
|
2026
2118
|
};
|
|
2119
|
+
if (extendKey) {
|
|
2120
|
+
res.extend = extendKey;
|
|
2121
|
+
}
|
|
2027
2122
|
this.nodeRegistryCache.set(typeKey, res);
|
|
2028
2123
|
return res;
|
|
2029
2124
|
}
|
|
@@ -2074,8 +2169,8 @@ var FlowDocument = class {
|
|
|
2074
2169
|
getAllNodes() {
|
|
2075
2170
|
return this.entityManager.getEntities(FlowNodeEntity);
|
|
2076
2171
|
}
|
|
2077
|
-
toString() {
|
|
2078
|
-
return this.originTree.toString();
|
|
2172
|
+
toString(showType) {
|
|
2173
|
+
return this.originTree.toString(showType);
|
|
2079
2174
|
}
|
|
2080
2175
|
/**
|
|
2081
2176
|
* 返回需要渲染的数据
|
|
@@ -2088,6 +2183,39 @@ var FlowDocument = class {
|
|
|
2088
2183
|
});
|
|
2089
2184
|
return result;
|
|
2090
2185
|
}
|
|
2186
|
+
toNodeJSON(node) {
|
|
2187
|
+
if (this.options.toNodeJSON) {
|
|
2188
|
+
return this.options.toNodeJSON(node);
|
|
2189
|
+
}
|
|
2190
|
+
const nodesMap = {};
|
|
2191
|
+
let startNodeJSON;
|
|
2192
|
+
this.traverse((node2) => {
|
|
2193
|
+
const isSystemNode = node2.id.startsWith("$");
|
|
2194
|
+
if (isSystemNode) return;
|
|
2195
|
+
const nodeJSONData = node2.getJSONData();
|
|
2196
|
+
const nodeJSON = {
|
|
2197
|
+
id: node2.id,
|
|
2198
|
+
type: node2.flowNodeType
|
|
2199
|
+
};
|
|
2200
|
+
if (nodeJSONData !== void 0) {
|
|
2201
|
+
nodeJSON.data = nodeJSONData;
|
|
2202
|
+
}
|
|
2203
|
+
if (!startNodeJSON) startNodeJSON = nodeJSON;
|
|
2204
|
+
let { parent } = node2;
|
|
2205
|
+
if (parent && parent.id.startsWith("$")) {
|
|
2206
|
+
parent = parent.originParent;
|
|
2207
|
+
}
|
|
2208
|
+
const parentJSON = parent ? nodesMap[parent.id] : void 0;
|
|
2209
|
+
if (parentJSON) {
|
|
2210
|
+
if (!parentJSON.blocks) {
|
|
2211
|
+
parentJSON.blocks = [];
|
|
2212
|
+
}
|
|
2213
|
+
parentJSON.blocks.push(nodeJSON);
|
|
2214
|
+
}
|
|
2215
|
+
nodesMap[node2.id] = nodeJSON;
|
|
2216
|
+
}, node);
|
|
2217
|
+
return startNodeJSON;
|
|
2218
|
+
}
|
|
2091
2219
|
/**
|
|
2092
2220
|
* 移动节点
|
|
2093
2221
|
* @param param0
|
|
@@ -2170,6 +2298,7 @@ var FlowDocument = class {
|
|
|
2170
2298
|
);
|
|
2171
2299
|
}
|
|
2172
2300
|
dispose() {
|
|
2301
|
+
if (this._disposed) return;
|
|
2173
2302
|
this.registers.clear();
|
|
2174
2303
|
this.nodeRegistryCache.clear();
|
|
2175
2304
|
this.originTree.dispose();
|
|
@@ -2178,6 +2307,7 @@ var FlowDocument = class {
|
|
|
2178
2307
|
this.onNodeCreateEmitter.dispose();
|
|
2179
2308
|
this.onNodeDisposeEmitter.dispose();
|
|
2180
2309
|
this.onLayoutChangeEmitter.dispose();
|
|
2310
|
+
this._disposed = true;
|
|
2181
2311
|
}
|
|
2182
2312
|
};
|
|
2183
2313
|
__decorateClass([
|
|
@@ -2205,115 +2335,429 @@ FlowDocument = __decorateClass([
|
|
|
2205
2335
|
var import_inversify8 = require("inversify");
|
|
2206
2336
|
|
|
2207
2337
|
// src/services/flow-drag-service.ts
|
|
2208
|
-
var import_inversify5 = require("inversify");
|
|
2209
|
-
var import_core10 = require("@flowgram.ai/core");
|
|
2210
|
-
var import_utils9 = require("@flowgram.ai/utils");
|
|
2211
|
-
|
|
2212
|
-
// src/services/flow-operation-base-service.ts
|
|
2213
2338
|
var import_inversify3 = require("inversify");
|
|
2214
2339
|
var import_utils8 = require("@flowgram.ai/utils");
|
|
2215
2340
|
var import_core8 = require("@flowgram.ai/core");
|
|
2216
|
-
|
|
2217
|
-
|
|
2218
|
-
|
|
2219
|
-
|
|
2220
|
-
this.
|
|
2341
|
+
|
|
2342
|
+
// src/services/flow-group-service/flow-group-controller.ts
|
|
2343
|
+
var FlowGroupController = class _FlowGroupController {
|
|
2344
|
+
constructor(groupNode) {
|
|
2345
|
+
this.groupNode = groupNode;
|
|
2221
2346
|
}
|
|
2222
|
-
|
|
2223
|
-
this.
|
|
2347
|
+
get nodes() {
|
|
2348
|
+
return this.groupNode.collapsedChildren || [];
|
|
2224
2349
|
}
|
|
2225
|
-
|
|
2226
|
-
const
|
|
2227
|
-
|
|
2228
|
-
|
|
2229
|
-
|
|
2350
|
+
get collapsed() {
|
|
2351
|
+
const groupTransformData = this.groupNode.getData(FlowNodeTransformData);
|
|
2352
|
+
return groupTransformData.collapsed;
|
|
2353
|
+
}
|
|
2354
|
+
collapse() {
|
|
2355
|
+
this.collapsed = true;
|
|
2356
|
+
}
|
|
2357
|
+
expand() {
|
|
2358
|
+
this.collapsed = false;
|
|
2359
|
+
}
|
|
2360
|
+
/** 获取分组外围的最大边框 */
|
|
2361
|
+
get bounds() {
|
|
2362
|
+
const groupNodeBounds = this.groupNode.getData(FlowNodeTransformData).bounds;
|
|
2363
|
+
return groupNodeBounds;
|
|
2364
|
+
}
|
|
2365
|
+
/** 是否是开始节点 */
|
|
2366
|
+
isStartNode(node) {
|
|
2367
|
+
if (!node) {
|
|
2368
|
+
return false;
|
|
2230
2369
|
}
|
|
2231
|
-
|
|
2232
|
-
if (
|
|
2233
|
-
|
|
2370
|
+
const nodes = this.nodes;
|
|
2371
|
+
if (!nodes[0]) {
|
|
2372
|
+
return false;
|
|
2234
2373
|
}
|
|
2235
|
-
|
|
2236
|
-
|
|
2237
|
-
|
|
2238
|
-
|
|
2239
|
-
|
|
2240
|
-
|
|
2241
|
-
parent: parentEntity,
|
|
2242
|
-
index,
|
|
2243
|
-
hidden
|
|
2244
|
-
};
|
|
2245
|
-
let added;
|
|
2246
|
-
if (parentEntity && register?.addChild) {
|
|
2247
|
-
added = register.addChild(parentEntity, addJSON, {
|
|
2248
|
-
index,
|
|
2249
|
-
hidden
|
|
2250
|
-
});
|
|
2251
|
-
} else {
|
|
2252
|
-
added = this.document.addNode(addNodeData);
|
|
2374
|
+
return node.id === nodes[0].id;
|
|
2375
|
+
}
|
|
2376
|
+
/** 是否是结束节点 */
|
|
2377
|
+
isEndNode(node) {
|
|
2378
|
+
if (!node) {
|
|
2379
|
+
return false;
|
|
2253
2380
|
}
|
|
2254
|
-
this.
|
|
2255
|
-
|
|
2256
|
-
|
|
2257
|
-
}
|
|
2258
|
-
return
|
|
2381
|
+
const nodes = this.nodes;
|
|
2382
|
+
if (!nodes[nodes.length - 1]) {
|
|
2383
|
+
return false;
|
|
2384
|
+
}
|
|
2385
|
+
return node.id === nodes[nodes.length - 1].id;
|
|
2259
2386
|
}
|
|
2260
|
-
|
|
2261
|
-
|
|
2387
|
+
set note(note) {
|
|
2388
|
+
this.groupNode.getNodeMeta().note = note;
|
|
2262
2389
|
}
|
|
2263
|
-
|
|
2264
|
-
this.
|
|
2390
|
+
get note() {
|
|
2391
|
+
return this.groupNode.getNodeMeta().note || "";
|
|
2265
2392
|
}
|
|
2266
|
-
|
|
2267
|
-
(
|
|
2268
|
-
this.deleteNode(node);
|
|
2269
|
-
});
|
|
2393
|
+
set noteHeight(height) {
|
|
2394
|
+
this.groupNode.getNodeMeta().noteHeight = height;
|
|
2270
2395
|
}
|
|
2271
|
-
|
|
2272
|
-
|
|
2273
|
-
return this.document.addBlock(target, blockJSON, void 0, parent, index);
|
|
2396
|
+
get noteHeight() {
|
|
2397
|
+
return this.groupNode.getNodeMeta().noteHeight || 0;
|
|
2274
2398
|
}
|
|
2275
|
-
|
|
2276
|
-
|
|
2277
|
-
|
|
2278
|
-
|
|
2279
|
-
|
|
2280
|
-
|
|
2399
|
+
get positionConfig() {
|
|
2400
|
+
return this.groupNode.getNodeMeta().positionConfig;
|
|
2401
|
+
}
|
|
2402
|
+
set collapsed(collapsed) {
|
|
2403
|
+
const groupTransformData = this.groupNode.getData(FlowNodeTransformData);
|
|
2404
|
+
groupTransformData.collapsed = collapsed;
|
|
2405
|
+
groupTransformData.localDirty = true;
|
|
2406
|
+
if (groupTransformData.parent) groupTransformData.parent.localDirty = true;
|
|
2407
|
+
if (groupTransformData.parent?.firstChild)
|
|
2408
|
+
groupTransformData.parent.firstChild.localDirty = true;
|
|
2409
|
+
}
|
|
2410
|
+
set hovered(hovered) {
|
|
2411
|
+
const groupRenderData = this.groupNode.getData(FlowNodeRenderData);
|
|
2412
|
+
if (hovered) {
|
|
2413
|
+
groupRenderData.toggleMouseEnter();
|
|
2414
|
+
} else {
|
|
2415
|
+
groupRenderData.toggleMouseLeave();
|
|
2281
2416
|
}
|
|
2282
|
-
|
|
2283
|
-
if (!newParentEntity) {
|
|
2284
|
-
console.warn("no new parent found", newParent);
|
|
2417
|
+
if (groupRenderData.hovered === hovered) {
|
|
2285
2418
|
return;
|
|
2286
2419
|
}
|
|
2287
|
-
|
|
2288
|
-
return this.doMoveNode(entity, newParentEntity, toIndex);
|
|
2420
|
+
groupRenderData.hovered = hovered;
|
|
2289
2421
|
}
|
|
2290
|
-
|
|
2291
|
-
|
|
2292
|
-
|
|
2293
|
-
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
if (nodes.length === 0) {
|
|
2422
|
+
get hovered() {
|
|
2423
|
+
const groupRenderData = this.groupNode.getData(FlowNodeRenderData);
|
|
2424
|
+
return groupRenderData.hovered;
|
|
2425
|
+
}
|
|
2426
|
+
static create(groupNode) {
|
|
2427
|
+
if (!groupNode) {
|
|
2297
2428
|
return;
|
|
2298
2429
|
}
|
|
2299
|
-
|
|
2300
|
-
const fromParent = startNode.parent;
|
|
2301
|
-
const toParent = dropNode.parent;
|
|
2302
|
-
if (!fromParent || !toParent) {
|
|
2430
|
+
if (!FlowGroupUtils.isGroupNode(groupNode)) {
|
|
2303
2431
|
return;
|
|
2304
2432
|
}
|
|
2305
|
-
|
|
2306
|
-
|
|
2307
|
-
|
|
2308
|
-
|
|
2309
|
-
|
|
2310
|
-
|
|
2311
|
-
|
|
2312
|
-
|
|
2313
|
-
|
|
2314
|
-
|
|
2315
|
-
|
|
2316
|
-
|
|
2433
|
+
return new _FlowGroupController(groupNode);
|
|
2434
|
+
}
|
|
2435
|
+
};
|
|
2436
|
+
|
|
2437
|
+
// src/services/flow-group-service/flow-group-utils.ts
|
|
2438
|
+
var FlowGroupUtils;
|
|
2439
|
+
((FlowGroupUtils2) => {
|
|
2440
|
+
const findNodeParents = (node) => {
|
|
2441
|
+
const parents = [];
|
|
2442
|
+
let parent = node.parent;
|
|
2443
|
+
while (parent) {
|
|
2444
|
+
parents.push(parent);
|
|
2445
|
+
parent = parent.parent;
|
|
2446
|
+
}
|
|
2447
|
+
return parents;
|
|
2448
|
+
};
|
|
2449
|
+
const isNodeInGroup = (node) => {
|
|
2450
|
+
if (node?.parent?.flowNodeType === "group" /* GROUP */) {
|
|
2451
|
+
return true;
|
|
2452
|
+
}
|
|
2453
|
+
return false;
|
|
2454
|
+
};
|
|
2455
|
+
FlowGroupUtils2.validate = (nodes) => {
|
|
2456
|
+
if (!nodes || !Array.isArray(nodes) || nodes.length === 0) {
|
|
2457
|
+
return false;
|
|
2458
|
+
}
|
|
2459
|
+
const isGroupRelatedNode = nodes.some((node) => (0, FlowGroupUtils2.isGroupNode)(node));
|
|
2460
|
+
if (isGroupRelatedNode) return false;
|
|
2461
|
+
const hasGroup = nodes.some((node) => node && isNodeInGroup(node));
|
|
2462
|
+
if (hasGroup) return false;
|
|
2463
|
+
const parent = nodes[0].parent;
|
|
2464
|
+
const isSameParent = nodes.every((node) => node.parent === parent);
|
|
2465
|
+
if (!isSameParent) return false;
|
|
2466
|
+
const indexes = nodes.map((node) => node.index).sort((a, b) => a - b);
|
|
2467
|
+
const isIndexContinuous = indexes.every((index, i, arr) => {
|
|
2468
|
+
if (i === 0) {
|
|
2469
|
+
return true;
|
|
2470
|
+
}
|
|
2471
|
+
return index === arr[i - 1] + 1;
|
|
2472
|
+
});
|
|
2473
|
+
if (!isIndexContinuous) return false;
|
|
2474
|
+
const parents = findNodeParents(nodes[0]);
|
|
2475
|
+
const parentsInGroup = parents.some((parent2) => isNodeInGroup(parent2));
|
|
2476
|
+
if (parentsInGroup) return false;
|
|
2477
|
+
return true;
|
|
2478
|
+
};
|
|
2479
|
+
FlowGroupUtils2.getNodeGroupController = (node) => {
|
|
2480
|
+
if (!node) {
|
|
2481
|
+
return;
|
|
2482
|
+
}
|
|
2483
|
+
if (!isNodeInGroup(node)) {
|
|
2484
|
+
return;
|
|
2485
|
+
}
|
|
2486
|
+
const groupNode = node?.parent;
|
|
2487
|
+
return FlowGroupController.create(groupNode);
|
|
2488
|
+
};
|
|
2489
|
+
FlowGroupUtils2.getNodeRecursionGroupController = (node) => {
|
|
2490
|
+
if (!node) {
|
|
2491
|
+
return;
|
|
2492
|
+
}
|
|
2493
|
+
const group = (0, FlowGroupUtils2.getNodeGroupController)(node);
|
|
2494
|
+
if (group) {
|
|
2495
|
+
return group;
|
|
2496
|
+
}
|
|
2497
|
+
if (node.parent) {
|
|
2498
|
+
return (0, FlowGroupUtils2.getNodeRecursionGroupController)(node.parent);
|
|
2499
|
+
}
|
|
2500
|
+
return;
|
|
2501
|
+
};
|
|
2502
|
+
FlowGroupUtils2.isGroupNode = (group) => group.flowNodeType === "group" /* GROUP */;
|
|
2503
|
+
})(FlowGroupUtils || (FlowGroupUtils = {}));
|
|
2504
|
+
|
|
2505
|
+
// src/services/flow-drag-service.ts
|
|
2506
|
+
var FlowDragService = class {
|
|
2507
|
+
constructor() {
|
|
2508
|
+
this.onDropEmitter = new import_utils8.Emitter();
|
|
2509
|
+
this.onDrop = this.onDropEmitter.event;
|
|
2510
|
+
}
|
|
2511
|
+
get renderState() {
|
|
2512
|
+
return this.document.renderState;
|
|
2513
|
+
}
|
|
2514
|
+
// 拖拽所有节点中的首个节点
|
|
2515
|
+
get dragStartNode() {
|
|
2516
|
+
return this.renderState.getDragStartEntity();
|
|
2517
|
+
}
|
|
2518
|
+
// 拖拽的所有节点
|
|
2519
|
+
get dragNodes() {
|
|
2520
|
+
return this.renderState.getDragEntities();
|
|
2521
|
+
}
|
|
2522
|
+
// 放置的区域
|
|
2523
|
+
get dropNodeId() {
|
|
2524
|
+
return this.renderState.getNodeDroppingId();
|
|
2525
|
+
}
|
|
2526
|
+
// 是否在拖拽分支
|
|
2527
|
+
get isDragBranch() {
|
|
2528
|
+
return this.renderState.isBranch || this.dragStartNode?.isInlineBlock;
|
|
2529
|
+
}
|
|
2530
|
+
// 拖拽的所有节点及其自节点
|
|
2531
|
+
get nodeDragIdsWithChildren() {
|
|
2532
|
+
return this.renderState.config.nodeDragIdsWithChildren || [];
|
|
2533
|
+
}
|
|
2534
|
+
get dragging() {
|
|
2535
|
+
return !!this.renderState.dragging;
|
|
2536
|
+
}
|
|
2537
|
+
get labelSide() {
|
|
2538
|
+
return this.renderState.config.dragLabelSide;
|
|
2539
|
+
}
|
|
2540
|
+
/**
|
|
2541
|
+
* 放置到目标分支
|
|
2542
|
+
*/
|
|
2543
|
+
dropBranch() {
|
|
2544
|
+
this.dropNode();
|
|
2545
|
+
}
|
|
2546
|
+
/**
|
|
2547
|
+
* 移动并且创建节点
|
|
2548
|
+
* Move and create node
|
|
2549
|
+
*/
|
|
2550
|
+
async dropCreateNode(json, onCreateNode) {
|
|
2551
|
+
const dropEntity = this.document.getNode(this.dropNodeId);
|
|
2552
|
+
if (!dropEntity) {
|
|
2553
|
+
return;
|
|
2554
|
+
}
|
|
2555
|
+
if (json) {
|
|
2556
|
+
const dragNodes = await onCreateNode?.(json, dropEntity);
|
|
2557
|
+
this.onDropEmitter.fire({
|
|
2558
|
+
dropNode: dropEntity,
|
|
2559
|
+
dragNodes: dragNodes ? [dragNodes] : [],
|
|
2560
|
+
dragJSON: json
|
|
2561
|
+
});
|
|
2562
|
+
}
|
|
2563
|
+
}
|
|
2564
|
+
/**
|
|
2565
|
+
* 移动到目标节点
|
|
2566
|
+
*/
|
|
2567
|
+
dropNode() {
|
|
2568
|
+
const dropEntity = this.document.getNode(this.dropNodeId);
|
|
2569
|
+
if (!dropEntity) {
|
|
2570
|
+
return;
|
|
2571
|
+
}
|
|
2572
|
+
const sortNodes = [];
|
|
2573
|
+
let curr = this.dragStartNode;
|
|
2574
|
+
while (curr && this.dragNodes.includes(curr)) {
|
|
2575
|
+
sortNodes.push(curr);
|
|
2576
|
+
curr = curr.next;
|
|
2577
|
+
}
|
|
2578
|
+
this.operationService.dragNodes({
|
|
2579
|
+
dropNode: dropEntity,
|
|
2580
|
+
nodes: sortNodes
|
|
2581
|
+
});
|
|
2582
|
+
if (sortNodes.length > 0) {
|
|
2583
|
+
this.onDropEmitter.fire({
|
|
2584
|
+
dropNode: dropEntity,
|
|
2585
|
+
dragNodes: sortNodes
|
|
2586
|
+
});
|
|
2587
|
+
}
|
|
2588
|
+
}
|
|
2589
|
+
/**
|
|
2590
|
+
* 拖拽是否可以释放在该节点后面
|
|
2591
|
+
*/
|
|
2592
|
+
isDroppableNode(node) {
|
|
2593
|
+
if (!this.dragging || this.isDragBranch) {
|
|
2594
|
+
return false;
|
|
2595
|
+
}
|
|
2596
|
+
if (this.nodeDragIdsWithChildren.includes(node.id) || node.next && this.nodeDragIdsWithChildren.includes(node.next.id)) {
|
|
2597
|
+
return false;
|
|
2598
|
+
}
|
|
2599
|
+
if (node.isInlineBlocks || node.isInlineBlock) {
|
|
2600
|
+
return false;
|
|
2601
|
+
}
|
|
2602
|
+
const hasGroupNode = this.dragNodes.some(
|
|
2603
|
+
(node2) => node2.flowNodeType === "group" /* GROUP */
|
|
2604
|
+
);
|
|
2605
|
+
if (hasGroupNode) {
|
|
2606
|
+
const group = FlowGroupUtils.getNodeRecursionGroupController(node);
|
|
2607
|
+
if (group) {
|
|
2608
|
+
return false;
|
|
2609
|
+
}
|
|
2610
|
+
}
|
|
2611
|
+
return true;
|
|
2612
|
+
}
|
|
2613
|
+
/**
|
|
2614
|
+
* 拖拽分支是否可以释放在该分支
|
|
2615
|
+
* @param node 拖拽的分支节点
|
|
2616
|
+
* @param side 分支的前面还是后面
|
|
2617
|
+
*/
|
|
2618
|
+
isDroppableBranch(node, side = "normal_branch" /* NORMAL_BRANCH */) {
|
|
2619
|
+
if (this.renderState.isBranch) {
|
|
2620
|
+
return true;
|
|
2621
|
+
}
|
|
2622
|
+
if (this.isDragBranch) {
|
|
2623
|
+
if (
|
|
2624
|
+
// 拖拽到分支
|
|
2625
|
+
!node.isInlineBlock || // 只能在同一分支条件下
|
|
2626
|
+
node.parent !== this.dragStartNode.parent || // 自己不能拖拽给自己
|
|
2627
|
+
node === this.dragStartNode
|
|
2628
|
+
) {
|
|
2629
|
+
return false;
|
|
2630
|
+
}
|
|
2631
|
+
if (side === "normal_branch" /* NORMAL_BRANCH */ && node.next !== this.dragStartNode) {
|
|
2632
|
+
return true;
|
|
2633
|
+
}
|
|
2634
|
+
if (side === "pre_branch" /* PRE_BRANCH */ && node.pre !== this.dragStartNode) {
|
|
2635
|
+
return true;
|
|
2636
|
+
}
|
|
2637
|
+
}
|
|
2638
|
+
return false;
|
|
2639
|
+
}
|
|
2640
|
+
};
|
|
2641
|
+
__decorateClass([
|
|
2642
|
+
(0, import_inversify3.inject)(FlowDocument)
|
|
2643
|
+
], FlowDragService.prototype, "document", 2);
|
|
2644
|
+
__decorateClass([
|
|
2645
|
+
(0, import_inversify3.inject)(FlowOperationBaseService)
|
|
2646
|
+
], FlowDragService.prototype, "operationService", 2);
|
|
2647
|
+
__decorateClass([
|
|
2648
|
+
(0, import_inversify3.inject)(import_core8.EntityManager)
|
|
2649
|
+
], FlowDragService.prototype, "entityManager", 2);
|
|
2650
|
+
FlowDragService = __decorateClass([
|
|
2651
|
+
(0, import_inversify3.injectable)()
|
|
2652
|
+
], FlowDragService);
|
|
2653
|
+
|
|
2654
|
+
// src/services/flow-operation-base-service.ts
|
|
2655
|
+
var import_inversify4 = require("inversify");
|
|
2656
|
+
var import_utils9 = require("@flowgram.ai/utils");
|
|
2657
|
+
var import_core9 = require("@flowgram.ai/core");
|
|
2658
|
+
var FlowOperationBaseServiceImpl = class {
|
|
2659
|
+
constructor() {
|
|
2660
|
+
this.onNodeAddEmitter = new import_utils9.Emitter();
|
|
2661
|
+
this.onNodeAdd = this.onNodeAddEmitter.event;
|
|
2662
|
+
this.toDispose = new import_utils9.DisposableCollection();
|
|
2663
|
+
this.onNodeMoveEmitter = new import_utils9.Emitter();
|
|
2664
|
+
this.onNodeMove = this.onNodeMoveEmitter.event;
|
|
2665
|
+
}
|
|
2666
|
+
init() {
|
|
2667
|
+
this.toDispose.pushAll([this.onNodeAddEmitter, this.onNodeMoveEmitter]);
|
|
2668
|
+
}
|
|
2669
|
+
addNode(nodeJSON, config = {}) {
|
|
2670
|
+
const { parent, index, hidden } = config;
|
|
2671
|
+
let parentEntity;
|
|
2672
|
+
if (parent) {
|
|
2673
|
+
parentEntity = this.toNodeEntity(parent);
|
|
2674
|
+
}
|
|
2675
|
+
let register;
|
|
2676
|
+
if (parentEntity) {
|
|
2677
|
+
register = parentEntity.getNodeRegistry();
|
|
2678
|
+
}
|
|
2679
|
+
const addJSON = {
|
|
2680
|
+
...nodeJSON,
|
|
2681
|
+
type: nodeJSON.type || "block" /* BLOCK */
|
|
2682
|
+
};
|
|
2683
|
+
const addNodeData = {
|
|
2684
|
+
...addJSON,
|
|
2685
|
+
parent: parentEntity,
|
|
2686
|
+
index,
|
|
2687
|
+
hidden
|
|
2688
|
+
};
|
|
2689
|
+
let added;
|
|
2690
|
+
if (parentEntity && register?.addChild) {
|
|
2691
|
+
added = register.addChild(parentEntity, addJSON, {
|
|
2692
|
+
index,
|
|
2693
|
+
hidden
|
|
2694
|
+
});
|
|
2695
|
+
} else {
|
|
2696
|
+
added = this.document.addNode(addNodeData);
|
|
2697
|
+
}
|
|
2698
|
+
this.onNodeAddEmitter.fire({
|
|
2699
|
+
node: added,
|
|
2700
|
+
data: addNodeData
|
|
2701
|
+
});
|
|
2702
|
+
return added;
|
|
2703
|
+
}
|
|
2704
|
+
addFromNode(fromNode, nodeJSON) {
|
|
2705
|
+
return this.document.addFromNode(fromNode, nodeJSON);
|
|
2706
|
+
}
|
|
2707
|
+
deleteNode(node) {
|
|
2708
|
+
this.document.removeNode(node);
|
|
2709
|
+
}
|
|
2710
|
+
deleteNodes(nodes) {
|
|
2711
|
+
(nodes || []).forEach((node) => {
|
|
2712
|
+
this.deleteNode(node);
|
|
2713
|
+
});
|
|
2714
|
+
}
|
|
2715
|
+
addBlock(target, blockJSON, config = {}) {
|
|
2716
|
+
const { parent, index } = config;
|
|
2717
|
+
return this.document.addBlock(target, blockJSON, void 0, parent, index);
|
|
2718
|
+
}
|
|
2719
|
+
moveNode(node, config = {}) {
|
|
2720
|
+
const { parent: newParent, index } = config;
|
|
2721
|
+
const entity = this.toNodeEntity(node);
|
|
2722
|
+
const parent = entity?.parent;
|
|
2723
|
+
if (!parent) {
|
|
2724
|
+
return;
|
|
2725
|
+
}
|
|
2726
|
+
const newParentEntity = newParent ? this.toNodeEntity(newParent) : parent;
|
|
2727
|
+
if (!newParentEntity) {
|
|
2728
|
+
console.warn("no new parent found", newParent);
|
|
2729
|
+
return;
|
|
2730
|
+
}
|
|
2731
|
+
let toIndex = typeof index === "undefined" ? newParentEntity.collapsedChildren.length : index;
|
|
2732
|
+
return this.doMoveNode(entity, newParentEntity, toIndex);
|
|
2733
|
+
}
|
|
2734
|
+
/**
|
|
2735
|
+
* 拖拽节点
|
|
2736
|
+
* @param param0
|
|
2737
|
+
* @returns
|
|
2738
|
+
*/
|
|
2739
|
+
dragNodes({ dropNode, nodes }) {
|
|
2740
|
+
if (nodes.length === 0) {
|
|
2741
|
+
return;
|
|
2742
|
+
}
|
|
2743
|
+
const startNode = nodes[0];
|
|
2744
|
+
const fromParent = startNode.parent;
|
|
2745
|
+
const toParent = dropNode.parent;
|
|
2746
|
+
if (!fromParent || !toParent) {
|
|
2747
|
+
return;
|
|
2748
|
+
}
|
|
2749
|
+
const fromIndex = fromParent.children.findIndex((child) => child === startNode);
|
|
2750
|
+
const dropIndex = toParent.children.findIndex((child) => child === dropNode);
|
|
2751
|
+
let toIndex = dropIndex + 1;
|
|
2752
|
+
if (fromParent === toParent && fromIndex < dropIndex) {
|
|
2753
|
+
toIndex = toIndex - nodes.length;
|
|
2754
|
+
}
|
|
2755
|
+
const value = {
|
|
2756
|
+
nodeIds: nodes.map((node) => node.id),
|
|
2757
|
+
fromParentId: fromParent.id,
|
|
2758
|
+
toParentId: toParent.id,
|
|
2759
|
+
fromIndex,
|
|
2760
|
+
toIndex
|
|
2317
2761
|
};
|
|
2318
2762
|
return this.apply({
|
|
2319
2763
|
type: "moveChildNodes" /* moveChildNodes */,
|
|
@@ -2426,420 +2870,140 @@ var FlowOperationBaseServiceImpl = class {
|
|
|
2426
2870
|
return typeof node === "string" ? node : node.id;
|
|
2427
2871
|
}
|
|
2428
2872
|
toNodeEntity(node) {
|
|
2429
|
-
return typeof node === "string" ? this.document.getNode(node) : node;
|
|
2430
|
-
}
|
|
2431
|
-
getNodeIndex(node) {
|
|
2432
|
-
const entity = this.toNodeEntity(node);
|
|
2433
|
-
const parent = entity?.parent;
|
|
2434
|
-
if (!parent) {
|
|
2435
|
-
return -1;
|
|
2436
|
-
}
|
|
2437
|
-
return parent.children.findIndex((child) => child === entity);
|
|
2438
|
-
}
|
|
2439
|
-
doMoveNode(node, newParent, index) {
|
|
2440
|
-
return this.document.moveChildNodes({
|
|
2441
|
-
nodeIds: [this.toId(node)],
|
|
2442
|
-
toParentId: this.toId(newParent),
|
|
2443
|
-
toIndex: index
|
|
2444
|
-
});
|
|
2445
|
-
}
|
|
2446
|
-
};
|
|
2447
|
-
__decorateClass([
|
|
2448
|
-
(0, import_inversify3.inject)(import_core8.EntityManager)
|
|
2449
|
-
], FlowOperationBaseServiceImpl.prototype, "entityManager", 2);
|
|
2450
|
-
__decorateClass([
|
|
2451
|
-
(0, import_inversify3.inject)(FlowDocument)
|
|
2452
|
-
], FlowOperationBaseServiceImpl.prototype, "document", 2);
|
|
2453
|
-
__decorateClass([
|
|
2454
|
-
(0, import_inversify3.postConstruct)()
|
|
2455
|
-
], FlowOperationBaseServiceImpl.prototype, "init", 1);
|
|
2456
|
-
FlowOperationBaseServiceImpl = __decorateClass([
|
|
2457
|
-
(0, import_inversify3.injectable)()
|
|
2458
|
-
], FlowOperationBaseServiceImpl);
|
|
2459
|
-
|
|
2460
|
-
// src/services/flow-group-service.ts
|
|
2461
|
-
var import_nanoid = require("nanoid");
|
|
2462
|
-
var import_inversify4 = require("inversify");
|
|
2463
|
-
var import_core9 = require("@flowgram.ai/core");
|
|
2464
|
-
var FlowGroupService = class {
|
|
2465
|
-
/** 创建分组节点 */
|
|
2466
|
-
createGroup(nodes) {
|
|
2467
|
-
if (!nodes || !Array.isArray(nodes) || nodes.length === 0) {
|
|
2468
|
-
return;
|
|
2469
|
-
}
|
|
2470
|
-
if (!FlowGroupController.validate(nodes)) {
|
|
2471
|
-
return;
|
|
2472
|
-
}
|
|
2473
|
-
const sortedNodes = nodes.sort((a, b) => a.index - b.index);
|
|
2474
|
-
const fromNode = sortedNodes[0];
|
|
2475
|
-
const groupId = `group_${(0, import_nanoid.nanoid)(5)}`;
|
|
2476
|
-
this.operationService.apply({
|
|
2477
|
-
type: "createGroup" /* createGroup */,
|
|
2478
|
-
value: {
|
|
2479
|
-
targetId: fromNode.id,
|
|
2480
|
-
groupId,
|
|
2481
|
-
nodeIds: nodes.map((node) => node.id)
|
|
2482
|
-
}
|
|
2483
|
-
});
|
|
2484
|
-
const groupNode = this.entityManager.getEntityById(groupId);
|
|
2485
|
-
if (!groupNode) {
|
|
2486
|
-
return;
|
|
2487
|
-
}
|
|
2488
|
-
const group = this.groupController(groupNode);
|
|
2489
|
-
if (!group) {
|
|
2490
|
-
return;
|
|
2491
|
-
}
|
|
2492
|
-
group.expand();
|
|
2493
|
-
return groupNode;
|
|
2494
|
-
}
|
|
2495
|
-
/** 删除分组 */
|
|
2496
|
-
deleteGroup(groupNode) {
|
|
2497
|
-
const json = groupNode.toJSON();
|
|
2498
|
-
if (!groupNode.pre || !json) {
|
|
2499
|
-
return;
|
|
2500
|
-
}
|
|
2501
|
-
this.operationService.apply({
|
|
2502
|
-
type: "deleteNodes" /* deleteNodes */,
|
|
2503
|
-
value: {
|
|
2504
|
-
fromId: groupNode.pre.id,
|
|
2505
|
-
nodes: [json]
|
|
2506
|
-
}
|
|
2507
|
-
});
|
|
2508
|
-
}
|
|
2509
|
-
/** 取消分组 */
|
|
2510
|
-
ungroup(groupNode) {
|
|
2511
|
-
const group = this.groupController(groupNode);
|
|
2512
|
-
if (!group) {
|
|
2513
|
-
return;
|
|
2514
|
-
}
|
|
2515
|
-
const nodes = group.nodes;
|
|
2516
|
-
if (!groupNode.pre) {
|
|
2517
|
-
return;
|
|
2518
|
-
}
|
|
2519
|
-
group.collapse();
|
|
2520
|
-
this.operationService.apply({
|
|
2521
|
-
type: "ungroup" /* ungroup */,
|
|
2522
|
-
value: {
|
|
2523
|
-
groupId: groupNode.id,
|
|
2524
|
-
targetId: groupNode.pre.id,
|
|
2525
|
-
nodeIds: nodes.map((node) => node.id)
|
|
2526
|
-
}
|
|
2527
|
-
});
|
|
2528
|
-
}
|
|
2529
|
-
/** 返回所有分组节点 */
|
|
2530
|
-
getAllGroups() {
|
|
2531
|
-
const allNodes = this.entityManager.getEntities(FlowNodeEntity);
|
|
2532
|
-
const groupNodes = allNodes.filter((node) => node.flowNodeType === "group" /* GROUP */);
|
|
2533
|
-
return groupNodes.map((node) => this.groupController(node)).filter(Boolean);
|
|
2534
|
-
}
|
|
2535
|
-
/** 获取分组控制器*/
|
|
2536
|
-
groupController(group) {
|
|
2537
|
-
return FlowGroupController.create(group);
|
|
2538
|
-
}
|
|
2539
|
-
static validate(nodes) {
|
|
2540
|
-
return FlowGroupController.validate(nodes);
|
|
2541
|
-
}
|
|
2542
|
-
};
|
|
2543
|
-
__decorateClass([
|
|
2544
|
-
(0, import_inversify4.inject)(import_core9.EntityManager)
|
|
2545
|
-
], FlowGroupService.prototype, "entityManager", 2);
|
|
2546
|
-
__decorateClass([
|
|
2547
|
-
(0, import_inversify4.inject)(FlowOperationBaseService)
|
|
2548
|
-
], FlowGroupService.prototype, "operationService", 2);
|
|
2549
|
-
FlowGroupService = __decorateClass([
|
|
2550
|
-
(0, import_inversify4.injectable)()
|
|
2551
|
-
], FlowGroupService);
|
|
2552
|
-
var FlowGroupController = class _FlowGroupController {
|
|
2553
|
-
constructor(groupNode) {
|
|
2554
|
-
this.groupNode = groupNode;
|
|
2555
|
-
}
|
|
2556
|
-
get nodes() {
|
|
2557
|
-
return this.groupNode.collapsedChildren || [];
|
|
2558
|
-
}
|
|
2559
|
-
get collapsed() {
|
|
2560
|
-
const groupTransformData = this.groupNode.getData(FlowNodeTransformData);
|
|
2561
|
-
return groupTransformData.collapsed;
|
|
2562
|
-
}
|
|
2563
|
-
collapse() {
|
|
2564
|
-
this.collapsed = true;
|
|
2565
|
-
}
|
|
2566
|
-
expand() {
|
|
2567
|
-
this.collapsed = false;
|
|
2568
|
-
}
|
|
2569
|
-
/** 获取分组外围的最大边框 */
|
|
2570
|
-
get bounds() {
|
|
2571
|
-
const groupNodeBounds = this.groupNode.getData(FlowNodeTransformData).bounds;
|
|
2572
|
-
return groupNodeBounds;
|
|
2573
|
-
}
|
|
2574
|
-
/** 是否是开始节点 */
|
|
2575
|
-
isStartNode(node) {
|
|
2576
|
-
if (!node) {
|
|
2577
|
-
return false;
|
|
2578
|
-
}
|
|
2579
|
-
const nodes = this.nodes;
|
|
2580
|
-
if (!nodes[0]) {
|
|
2581
|
-
return false;
|
|
2582
|
-
}
|
|
2583
|
-
return node.id === nodes[0].id;
|
|
2584
|
-
}
|
|
2585
|
-
/** 是否是结束节点 */
|
|
2586
|
-
isEndNode(node) {
|
|
2587
|
-
if (!node) {
|
|
2588
|
-
return false;
|
|
2589
|
-
}
|
|
2590
|
-
const nodes = this.nodes;
|
|
2591
|
-
if (!nodes[nodes.length - 1]) {
|
|
2592
|
-
return false;
|
|
2593
|
-
}
|
|
2594
|
-
return node.id === nodes[nodes.length - 1].id;
|
|
2595
|
-
}
|
|
2596
|
-
set note(note) {
|
|
2597
|
-
this.groupNode.getNodeMeta().note = note;
|
|
2598
|
-
}
|
|
2599
|
-
get note() {
|
|
2600
|
-
return this.groupNode.getNodeMeta().note || "";
|
|
2601
|
-
}
|
|
2602
|
-
set noteHeight(height) {
|
|
2603
|
-
this.groupNode.getNodeMeta().noteHeight = height;
|
|
2604
|
-
}
|
|
2605
|
-
get noteHeight() {
|
|
2606
|
-
return this.groupNode.getNodeMeta().noteHeight || 0;
|
|
2607
|
-
}
|
|
2608
|
-
get positionConfig() {
|
|
2609
|
-
return this.groupNode.getNodeMeta().positionConfig;
|
|
2610
|
-
}
|
|
2611
|
-
set collapsed(collapsed) {
|
|
2612
|
-
const groupTransformData = this.groupNode.getData(FlowNodeTransformData);
|
|
2613
|
-
groupTransformData.collapsed = collapsed;
|
|
2614
|
-
groupTransformData.localDirty = true;
|
|
2615
|
-
if (groupTransformData.parent) groupTransformData.parent.localDirty = true;
|
|
2616
|
-
if (groupTransformData.parent?.firstChild)
|
|
2617
|
-
groupTransformData.parent.firstChild.localDirty = true;
|
|
2873
|
+
return typeof node === "string" ? this.document.getNode(node) : node;
|
|
2618
2874
|
}
|
|
2619
|
-
|
|
2620
|
-
const
|
|
2621
|
-
|
|
2622
|
-
|
|
2623
|
-
|
|
2624
|
-
groupRenderData.toggleMouseLeave();
|
|
2625
|
-
}
|
|
2626
|
-
if (groupRenderData.hovered === hovered) {
|
|
2627
|
-
return;
|
|
2875
|
+
getNodeIndex(node) {
|
|
2876
|
+
const entity = this.toNodeEntity(node);
|
|
2877
|
+
const parent = entity?.parent;
|
|
2878
|
+
if (!parent) {
|
|
2879
|
+
return -1;
|
|
2628
2880
|
}
|
|
2629
|
-
|
|
2881
|
+
return parent.children.findIndex((child) => child === entity);
|
|
2630
2882
|
}
|
|
2631
|
-
|
|
2632
|
-
|
|
2633
|
-
|
|
2883
|
+
doMoveNode(node, newParent, index) {
|
|
2884
|
+
if (!node.parent) {
|
|
2885
|
+
throw new Error("root node cannot move");
|
|
2886
|
+
}
|
|
2887
|
+
const event = {
|
|
2888
|
+
node,
|
|
2889
|
+
fromParent: node.parent,
|
|
2890
|
+
toParent: newParent,
|
|
2891
|
+
fromIndex: this.getNodeIndex(node),
|
|
2892
|
+
toIndex: index
|
|
2893
|
+
};
|
|
2894
|
+
this.document.moveChildNodes({
|
|
2895
|
+
nodeIds: [this.toId(node)],
|
|
2896
|
+
toParentId: this.toId(newParent),
|
|
2897
|
+
toIndex: index
|
|
2898
|
+
});
|
|
2899
|
+
this.onNodeMoveEmitter.fire(event);
|
|
2634
2900
|
}
|
|
2635
|
-
|
|
2636
|
-
|
|
2901
|
+
};
|
|
2902
|
+
__decorateClass([
|
|
2903
|
+
(0, import_inversify4.inject)(import_core9.EntityManager)
|
|
2904
|
+
], FlowOperationBaseServiceImpl.prototype, "entityManager", 2);
|
|
2905
|
+
__decorateClass([
|
|
2906
|
+
(0, import_inversify4.inject)(FlowDocument)
|
|
2907
|
+
], FlowOperationBaseServiceImpl.prototype, "document", 2);
|
|
2908
|
+
__decorateClass([
|
|
2909
|
+
(0, import_inversify4.postConstruct)()
|
|
2910
|
+
], FlowOperationBaseServiceImpl.prototype, "init", 1);
|
|
2911
|
+
FlowOperationBaseServiceImpl = __decorateClass([
|
|
2912
|
+
(0, import_inversify4.injectable)()
|
|
2913
|
+
], FlowOperationBaseServiceImpl);
|
|
2914
|
+
|
|
2915
|
+
// src/services/flow-group-service/flow-group-service.ts
|
|
2916
|
+
var import_nanoid = require("nanoid");
|
|
2917
|
+
var import_inversify5 = require("inversify");
|
|
2918
|
+
var import_core10 = require("@flowgram.ai/core");
|
|
2919
|
+
var FlowGroupService = class {
|
|
2920
|
+
/** 创建分组节点 */
|
|
2921
|
+
createGroup(nodes) {
|
|
2922
|
+
if (!nodes || !Array.isArray(nodes) || nodes.length === 0) {
|
|
2637
2923
|
return;
|
|
2638
2924
|
}
|
|
2639
|
-
if (!
|
|
2925
|
+
if (!FlowGroupUtils.validate(nodes)) {
|
|
2640
2926
|
return;
|
|
2641
2927
|
}
|
|
2642
|
-
|
|
2643
|
-
|
|
2644
|
-
|
|
2645
|
-
|
|
2646
|
-
|
|
2647
|
-
|
|
2648
|
-
|
|
2649
|
-
|
|
2650
|
-
|
|
2651
|
-
const hasGroup = nodes.some((node) => node && this.isNodeInGroup(node));
|
|
2652
|
-
if (hasGroup) return false;
|
|
2653
|
-
const parent = nodes[0].parent;
|
|
2654
|
-
const isSameParent = nodes.every((node) => node.parent === parent);
|
|
2655
|
-
if (!isSameParent) return false;
|
|
2656
|
-
const indexes = nodes.map((node) => node.index).sort((a, b) => a - b);
|
|
2657
|
-
const isIndexContinuous = indexes.every((index, i, arr) => {
|
|
2658
|
-
if (i === 0) {
|
|
2659
|
-
return true;
|
|
2928
|
+
const sortedNodes = nodes.sort((a, b) => a.index - b.index);
|
|
2929
|
+
const fromNode = sortedNodes[0];
|
|
2930
|
+
const groupId = `group_${(0, import_nanoid.nanoid)(5)}`;
|
|
2931
|
+
this.operationService.apply({
|
|
2932
|
+
type: "createGroup" /* createGroup */,
|
|
2933
|
+
value: {
|
|
2934
|
+
targetId: fromNode.id,
|
|
2935
|
+
groupId,
|
|
2936
|
+
nodeIds: nodes.map((node) => node.id)
|
|
2660
2937
|
}
|
|
2661
|
-
return index === arr[i - 1] + 1;
|
|
2662
2938
|
});
|
|
2663
|
-
|
|
2664
|
-
|
|
2665
|
-
const parentsInGroup = parents.some((parent2) => this.isNodeInGroup(parent2));
|
|
2666
|
-
if (parentsInGroup) return false;
|
|
2667
|
-
return true;
|
|
2668
|
-
}
|
|
2669
|
-
/** 获取节点分组控制 */
|
|
2670
|
-
static getNodeGroupController(node) {
|
|
2671
|
-
if (!node) {
|
|
2939
|
+
const groupNode = this.entityManager.getEntityById(groupId);
|
|
2940
|
+
if (!groupNode) {
|
|
2672
2941
|
return;
|
|
2673
2942
|
}
|
|
2674
|
-
|
|
2943
|
+
const group = this.groupController(groupNode);
|
|
2944
|
+
if (!group) {
|
|
2675
2945
|
return;
|
|
2676
2946
|
}
|
|
2677
|
-
|
|
2678
|
-
return
|
|
2947
|
+
group.expand();
|
|
2948
|
+
return groupNode;
|
|
2679
2949
|
}
|
|
2680
|
-
/**
|
|
2681
|
-
|
|
2682
|
-
|
|
2950
|
+
/** 删除分组 */
|
|
2951
|
+
deleteGroup(groupNode) {
|
|
2952
|
+
const json = groupNode.toJSON();
|
|
2953
|
+
if (!groupNode.pre || !json) {
|
|
2683
2954
|
return;
|
|
2684
2955
|
}
|
|
2685
|
-
|
|
2686
|
-
|
|
2687
|
-
|
|
2688
|
-
|
|
2689
|
-
|
|
2690
|
-
|
|
2691
|
-
}
|
|
2692
|
-
return;
|
|
2693
|
-
}
|
|
2694
|
-
/** 是否分组节点 */
|
|
2695
|
-
static isGroupNode(group) {
|
|
2696
|
-
return group.flowNodeType === "group" /* GROUP */;
|
|
2697
|
-
}
|
|
2698
|
-
/** 找到节点所有上级 */
|
|
2699
|
-
static findNodeParents(node) {
|
|
2700
|
-
const parents = [];
|
|
2701
|
-
let parent = node.parent;
|
|
2702
|
-
while (parent) {
|
|
2703
|
-
parents.push(parent);
|
|
2704
|
-
parent = parent.parent;
|
|
2705
|
-
}
|
|
2706
|
-
return parents;
|
|
2707
|
-
}
|
|
2708
|
-
/** 节点是否处于分组中 */
|
|
2709
|
-
static isNodeInGroup(node) {
|
|
2710
|
-
if (node?.parent?.flowNodeType === "group" /* GROUP */) {
|
|
2711
|
-
return true;
|
|
2712
|
-
}
|
|
2713
|
-
return false;
|
|
2714
|
-
}
|
|
2715
|
-
};
|
|
2716
|
-
|
|
2717
|
-
// src/services/flow-drag-service.ts
|
|
2718
|
-
var FlowDragService = class {
|
|
2719
|
-
constructor() {
|
|
2720
|
-
this.onDropEmitter = new import_utils9.Emitter();
|
|
2721
|
-
this.onDrop = this.onDropEmitter.event;
|
|
2722
|
-
}
|
|
2723
|
-
get renderState() {
|
|
2724
|
-
return this.document.renderState;
|
|
2725
|
-
}
|
|
2726
|
-
// 拖拽所有节点中的首个节点
|
|
2727
|
-
get dragStartNode() {
|
|
2728
|
-
return this.renderState.getDragStartEntity();
|
|
2729
|
-
}
|
|
2730
|
-
// 拖拽的所有节点
|
|
2731
|
-
get dragNodes() {
|
|
2732
|
-
return this.renderState.getDragEntities();
|
|
2733
|
-
}
|
|
2734
|
-
// 放置的区域
|
|
2735
|
-
get dropNodeId() {
|
|
2736
|
-
return this.renderState.getNodeDroppingId();
|
|
2737
|
-
}
|
|
2738
|
-
// 是否在拖拽分支
|
|
2739
|
-
get isDragBranch() {
|
|
2740
|
-
return this.dragStartNode?.isInlineBlock;
|
|
2741
|
-
}
|
|
2742
|
-
// 拖拽的所有节点及其自节点
|
|
2743
|
-
get nodeDragIdsWithChildren() {
|
|
2744
|
-
return this.renderState.config.nodeDragIdsWithChildren || [];
|
|
2745
|
-
}
|
|
2746
|
-
get dragging() {
|
|
2747
|
-
const renderData = this.dragStartNode?.getData(FlowNodeRenderData);
|
|
2748
|
-
return !!renderData?.dragging;
|
|
2749
|
-
}
|
|
2750
|
-
get labelSide() {
|
|
2751
|
-
return this.renderState.config.dragLabelSide;
|
|
2752
|
-
}
|
|
2753
|
-
/**
|
|
2754
|
-
* 放置到目标分支
|
|
2755
|
-
*/
|
|
2756
|
-
dropBranch() {
|
|
2757
|
-
this.dropNode();
|
|
2956
|
+
this.operationService.apply({
|
|
2957
|
+
type: "deleteNodes" /* deleteNodes */,
|
|
2958
|
+
value: {
|
|
2959
|
+
fromId: groupNode.pre.id,
|
|
2960
|
+
nodes: [json]
|
|
2961
|
+
}
|
|
2962
|
+
});
|
|
2758
2963
|
}
|
|
2759
|
-
/**
|
|
2760
|
-
|
|
2761
|
-
|
|
2762
|
-
|
|
2763
|
-
const dropEntity = this.document.getNode(this.dropNodeId);
|
|
2764
|
-
if (!dropEntity) {
|
|
2964
|
+
/** 取消分组 */
|
|
2965
|
+
ungroup(groupNode) {
|
|
2966
|
+
const group = this.groupController(groupNode);
|
|
2967
|
+
if (!group) {
|
|
2765
2968
|
return;
|
|
2766
2969
|
}
|
|
2767
|
-
const
|
|
2768
|
-
|
|
2769
|
-
|
|
2770
|
-
sortNodes.push(curr);
|
|
2771
|
-
curr = curr.next;
|
|
2970
|
+
const nodes = group.nodes;
|
|
2971
|
+
if (!groupNode.pre) {
|
|
2972
|
+
return;
|
|
2772
2973
|
}
|
|
2773
|
-
|
|
2774
|
-
|
|
2775
|
-
|
|
2974
|
+
group.collapse();
|
|
2975
|
+
this.operationService.apply({
|
|
2976
|
+
type: "ungroup" /* ungroup */,
|
|
2977
|
+
value: {
|
|
2978
|
+
groupId: groupNode.id,
|
|
2979
|
+
targetId: groupNode.pre.id,
|
|
2980
|
+
nodeIds: nodes.map((node) => node.id)
|
|
2981
|
+
}
|
|
2776
2982
|
});
|
|
2777
|
-
if (sortNodes.length > 0) {
|
|
2778
|
-
this.onDropEmitter.fire({
|
|
2779
|
-
dropNode: dropEntity,
|
|
2780
|
-
dragNodes: sortNodes
|
|
2781
|
-
});
|
|
2782
|
-
}
|
|
2783
2983
|
}
|
|
2784
|
-
/**
|
|
2785
|
-
|
|
2786
|
-
|
|
2787
|
-
|
|
2788
|
-
|
|
2789
|
-
return false;
|
|
2790
|
-
}
|
|
2791
|
-
if (this.nodeDragIdsWithChildren.includes(node.id) || node.next && this.nodeDragIdsWithChildren.includes(node.next.id)) {
|
|
2792
|
-
return false;
|
|
2793
|
-
}
|
|
2794
|
-
if (node.isInlineBlocks || node.isInlineBlock) {
|
|
2795
|
-
return false;
|
|
2796
|
-
}
|
|
2797
|
-
const hasGroupNode = this.dragNodes.some((node2) => node2.flowNodeType === "group" /* GROUP */);
|
|
2798
|
-
if (hasGroupNode) {
|
|
2799
|
-
const group = FlowGroupController.getNodeRecursionGroupController(node);
|
|
2800
|
-
if (group) {
|
|
2801
|
-
return false;
|
|
2802
|
-
}
|
|
2803
|
-
}
|
|
2804
|
-
return true;
|
|
2984
|
+
/** 返回所有分组节点 */
|
|
2985
|
+
getAllGroups() {
|
|
2986
|
+
const allNodes = this.entityManager.getEntities(FlowNodeEntity);
|
|
2987
|
+
const groupNodes = allNodes.filter((node) => node.flowNodeType === "group" /* GROUP */);
|
|
2988
|
+
return groupNodes.map((node) => this.groupController(node)).filter(Boolean);
|
|
2805
2989
|
}
|
|
2806
|
-
/**
|
|
2807
|
-
|
|
2808
|
-
|
|
2809
|
-
|
|
2810
|
-
|
|
2811
|
-
|
|
2812
|
-
if (this.isDragBranch) {
|
|
2813
|
-
if (
|
|
2814
|
-
// 拖拽到分支
|
|
2815
|
-
!node.isInlineBlock || // 只能在同一分支条件下
|
|
2816
|
-
node.parent !== this.dragStartNode.parent || // 自己不能拖拽给自己
|
|
2817
|
-
node === this.dragStartNode
|
|
2818
|
-
) {
|
|
2819
|
-
return false;
|
|
2820
|
-
}
|
|
2821
|
-
if (side === "normal_branch" /* NORMAL_BRANCH */ && node.next !== this.dragStartNode) {
|
|
2822
|
-
return true;
|
|
2823
|
-
}
|
|
2824
|
-
if (side === "pre_branch" /* PRE_BRANCH */ && node.pre !== this.dragStartNode) {
|
|
2825
|
-
return true;
|
|
2826
|
-
}
|
|
2827
|
-
}
|
|
2828
|
-
return false;
|
|
2990
|
+
/** 获取分组控制器*/
|
|
2991
|
+
groupController(group) {
|
|
2992
|
+
return FlowGroupController.create(group);
|
|
2993
|
+
}
|
|
2994
|
+
static validate(nodes) {
|
|
2995
|
+
return FlowGroupUtils.validate(nodes);
|
|
2829
2996
|
}
|
|
2830
2997
|
};
|
|
2831
2998
|
__decorateClass([
|
|
2832
|
-
(0, import_inversify5.inject)(
|
|
2833
|
-
],
|
|
2999
|
+
(0, import_inversify5.inject)(import_core10.EntityManager)
|
|
3000
|
+
], FlowGroupService.prototype, "entityManager", 2);
|
|
2834
3001
|
__decorateClass([
|
|
2835
3002
|
(0, import_inversify5.inject)(FlowOperationBaseService)
|
|
2836
|
-
],
|
|
2837
|
-
__decorateClass([
|
|
2838
|
-
(0, import_inversify5.inject)(import_core10.EntityManager)
|
|
2839
|
-
], FlowDragService.prototype, "entityManager", 2);
|
|
2840
|
-
FlowDragService = __decorateClass([
|
|
3003
|
+
], FlowGroupService.prototype, "operationService", 2);
|
|
3004
|
+
FlowGroupService = __decorateClass([
|
|
2841
3005
|
(0, import_inversify5.injectable)()
|
|
2842
|
-
],
|
|
3006
|
+
], FlowGroupService);
|
|
2843
3007
|
|
|
2844
3008
|
// src/layout/vertical-fixed-layout.ts
|
|
2845
3009
|
var import_inversify6 = require("inversify");
|