@next-bricks/diagram 0.22.0 → 0.23.1
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/bricks.json +1 -1
- package/dist/chunks/2696.8ec49230.js +2 -0
- package/dist/chunks/2696.8ec49230.js.map +1 -0
- package/dist/chunks/5676.25458ec2.js +2 -0
- package/dist/chunks/5676.25458ec2.js.map +1 -0
- package/dist/chunks/eo-draw-canvas.623578df.js +2 -0
- package/dist/chunks/eo-draw-canvas.623578df.js.map +1 -0
- package/dist/chunks/{main.242a00e6.js → main.96890609.js} +2 -2
- package/dist/chunks/{main.242a00e6.js.map → main.96890609.js.map} +1 -1
- package/dist/examples.json +3 -3
- package/dist/index.86b6ec27.js +2 -0
- package/dist/{index.a52ad469.js.map → index.86b6ec27.js.map} +1 -1
- package/dist/manifest.json +42 -36
- package/dist/types.json +58 -0
- package/dist-types/draw-canvas/CellComponent.d.ts +7 -2
- package/dist-types/draw-canvas/decorators/DecoratorText.d.ts +2 -1
- package/dist-types/draw-canvas/decorators/DecoratorText.spec.d.ts +1 -0
- package/dist-types/draw-canvas/decorators/index.d.ts +1 -1
- package/dist-types/draw-canvas/index.d.ts +4 -2
- package/dist-types/draw-canvas/interfaces.d.ts +9 -0
- package/docs/eo-draw-canvas.md +21 -14
- package/package.json +2 -2
- package/dist/chunks/2696.830146cb.js +0 -2
- package/dist/chunks/2696.830146cb.js.map +0 -1
- package/dist/chunks/5676.68d9676c.js +0 -2
- package/dist/chunks/5676.68d9676c.js.map +0 -1
- package/dist/chunks/eo-draw-canvas.1e9bd8dc.js +0 -2
- package/dist/chunks/eo-draw-canvas.1e9bd8dc.js.map +0 -1
- package/dist/index.a52ad469.js +0 -2
package/dist/manifest.json
CHANGED
|
@@ -179,42 +179,6 @@
|
|
|
179
179
|
"parts": [],
|
|
180
180
|
"description": "构件 `diagram.experimental-node`"
|
|
181
181
|
},
|
|
182
|
-
{
|
|
183
|
-
"name": "diagram.editable-label",
|
|
184
|
-
"properties": [
|
|
185
|
-
{
|
|
186
|
-
"name": "label",
|
|
187
|
-
"type": "string"
|
|
188
|
-
},
|
|
189
|
-
{
|
|
190
|
-
"name": "type",
|
|
191
|
-
"type": "LabelType"
|
|
192
|
-
}
|
|
193
|
-
],
|
|
194
|
-
"events": [
|
|
195
|
-
{
|
|
196
|
-
"name": "label.editing.change",
|
|
197
|
-
"detail": {
|
|
198
|
-
"type": "boolean"
|
|
199
|
-
}
|
|
200
|
-
},
|
|
201
|
-
{
|
|
202
|
-
"name": "label.change",
|
|
203
|
-
"detail": {
|
|
204
|
-
"type": "string"
|
|
205
|
-
}
|
|
206
|
-
}
|
|
207
|
-
],
|
|
208
|
-
"slots": [],
|
|
209
|
-
"methods": [
|
|
210
|
-
{
|
|
211
|
-
"name": "enableEditing",
|
|
212
|
-
"params": []
|
|
213
|
-
}
|
|
214
|
-
],
|
|
215
|
-
"parts": [],
|
|
216
|
-
"description": "构件 `diagram.editable-label`"
|
|
217
|
-
},
|
|
218
182
|
{
|
|
219
183
|
"name": "eo-draw-canvas",
|
|
220
184
|
"properties": [
|
|
@@ -314,6 +278,12 @@
|
|
|
314
278
|
"type": "CellContextMenuDetail"
|
|
315
279
|
}
|
|
316
280
|
},
|
|
281
|
+
{
|
|
282
|
+
"name": "decorator.text.change",
|
|
283
|
+
"detail": {
|
|
284
|
+
"type": "DecoratorTextChangeDetail"
|
|
285
|
+
}
|
|
286
|
+
},
|
|
317
287
|
{
|
|
318
288
|
"name": "scale.change",
|
|
319
289
|
"description": "缩放变化后,从素材库拖拽元素进画布时,拖拽图像应设置对应的缩放比例。",
|
|
@@ -403,6 +373,42 @@
|
|
|
403
373
|
],
|
|
404
374
|
"parts": [],
|
|
405
375
|
"description": "用于手工绘图的画布。\n\n注意:将配套另外一个用于展示的画布构件。"
|
|
376
|
+
},
|
|
377
|
+
{
|
|
378
|
+
"name": "diagram.editable-label",
|
|
379
|
+
"properties": [
|
|
380
|
+
{
|
|
381
|
+
"name": "label",
|
|
382
|
+
"type": "string"
|
|
383
|
+
},
|
|
384
|
+
{
|
|
385
|
+
"name": "type",
|
|
386
|
+
"type": "LabelType"
|
|
387
|
+
}
|
|
388
|
+
],
|
|
389
|
+
"events": [
|
|
390
|
+
{
|
|
391
|
+
"name": "label.editing.change",
|
|
392
|
+
"detail": {
|
|
393
|
+
"type": "boolean"
|
|
394
|
+
}
|
|
395
|
+
},
|
|
396
|
+
{
|
|
397
|
+
"name": "label.change",
|
|
398
|
+
"detail": {
|
|
399
|
+
"type": "string"
|
|
400
|
+
}
|
|
401
|
+
}
|
|
402
|
+
],
|
|
403
|
+
"slots": [],
|
|
404
|
+
"methods": [
|
|
405
|
+
{
|
|
406
|
+
"name": "enableEditing",
|
|
407
|
+
"params": []
|
|
408
|
+
}
|
|
409
|
+
],
|
|
410
|
+
"parts": [],
|
|
411
|
+
"description": "构件 `diagram.editable-label`"
|
|
406
412
|
}
|
|
407
413
|
],
|
|
408
414
|
"providers": []
|
package/dist/types.json
CHANGED
|
@@ -2223,6 +2223,18 @@
|
|
|
2223
2223
|
}
|
|
2224
2224
|
}
|
|
2225
2225
|
},
|
|
2226
|
+
{
|
|
2227
|
+
"name": "decorator.text.change",
|
|
2228
|
+
"detail": {
|
|
2229
|
+
"annotation": {
|
|
2230
|
+
"type": "reference",
|
|
2231
|
+
"typeName": {
|
|
2232
|
+
"type": "identifier",
|
|
2233
|
+
"name": "DecoratorTextChangeDetail"
|
|
2234
|
+
}
|
|
2235
|
+
}
|
|
2236
|
+
}
|
|
2237
|
+
},
|
|
2226
2238
|
{
|
|
2227
2239
|
"name": "scale.change",
|
|
2228
2240
|
"detail": {
|
|
@@ -3552,6 +3564,39 @@
|
|
|
3552
3564
|
}
|
|
3553
3565
|
]
|
|
3554
3566
|
},
|
|
3567
|
+
{
|
|
3568
|
+
"type": "interface",
|
|
3569
|
+
"name": "DecoratorTextChangeDetail",
|
|
3570
|
+
"body": [
|
|
3571
|
+
{
|
|
3572
|
+
"type": "propertySignature",
|
|
3573
|
+
"key": {
|
|
3574
|
+
"type": "identifier",
|
|
3575
|
+
"name": "id"
|
|
3576
|
+
},
|
|
3577
|
+
"annotation": {
|
|
3578
|
+
"type": "keyword",
|
|
3579
|
+
"value": "string"
|
|
3580
|
+
},
|
|
3581
|
+
"computed": false
|
|
3582
|
+
},
|
|
3583
|
+
{
|
|
3584
|
+
"type": "propertySignature",
|
|
3585
|
+
"key": {
|
|
3586
|
+
"type": "identifier",
|
|
3587
|
+
"name": "view"
|
|
3588
|
+
},
|
|
3589
|
+
"annotation": {
|
|
3590
|
+
"type": "reference",
|
|
3591
|
+
"typeName": {
|
|
3592
|
+
"type": "identifier",
|
|
3593
|
+
"name": "DecoratorView"
|
|
3594
|
+
}
|
|
3595
|
+
},
|
|
3596
|
+
"computed": false
|
|
3597
|
+
}
|
|
3598
|
+
]
|
|
3599
|
+
},
|
|
3555
3600
|
{
|
|
3556
3601
|
"type": "interface",
|
|
3557
3602
|
"name": "DropNodeInfo",
|
|
@@ -3683,6 +3728,19 @@
|
|
|
3683
3728
|
},
|
|
3684
3729
|
"computed": false,
|
|
3685
3730
|
"description": "[PointerEvent::clientX, PointerEvent::clientY]"
|
|
3731
|
+
},
|
|
3732
|
+
{
|
|
3733
|
+
"type": "propertySignature",
|
|
3734
|
+
"key": {
|
|
3735
|
+
"type": "identifier",
|
|
3736
|
+
"name": "text"
|
|
3737
|
+
},
|
|
3738
|
+
"annotation": {
|
|
3739
|
+
"type": "keyword",
|
|
3740
|
+
"value": "string"
|
|
3741
|
+
},
|
|
3742
|
+
"optional": true,
|
|
3743
|
+
"computed": false
|
|
3686
3744
|
}
|
|
3687
3745
|
]
|
|
3688
3746
|
},
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import type { ActiveTarget, Cell, CellContextMenuDetail, EdgeLineConf, NodeBrickConf } from "./interfaces";
|
|
2
|
+
import type { ActiveTarget, Cell, CellContextMenuDetail, DecoratorTextChangeDetail, EdgeLineConf, NodeBrickConf } from "./interfaces";
|
|
3
3
|
import type { MoveCellPayload, ResizeCellPayload } from "./reducers/interfaces";
|
|
4
4
|
import type { TransformLiteral } from "../diagram/interfaces";
|
|
5
5
|
export interface CellComponentProps {
|
|
@@ -16,5 +16,10 @@ export interface CellComponentProps {
|
|
|
16
16
|
onCellResized(info: ResizeCellPayload): void;
|
|
17
17
|
onSwitchActiveTarget(target: ActiveTarget | null): void;
|
|
18
18
|
onCellContextMenu(detail: CellContextMenuDetail): void;
|
|
19
|
+
onDecoratorTextEditing(detail: {
|
|
20
|
+
id: string;
|
|
21
|
+
editing: boolean;
|
|
22
|
+
}): void;
|
|
23
|
+
onDecoratorTextChange(detail: DecoratorTextChangeDetail): void;
|
|
19
24
|
}
|
|
20
|
-
export declare function CellComponent({ cell, cells, defaultNodeBricks, defaultEdgeLines, markerEnd, active, transform, onCellMoving, onCellMoved, onCellResizing, onCellResized, onSwitchActiveTarget, onCellContextMenu, }: CellComponentProps): JSX.Element | null;
|
|
25
|
+
export declare function CellComponent({ cell, cells, defaultNodeBricks, defaultEdgeLines, markerEnd, active, transform, onCellMoving, onCellMoved, onCellResizing, onCellResized, onSwitchActiveTarget, onCellContextMenu, onDecoratorTextEditing, onDecoratorTextChange, }: CellComponentProps): JSX.Element | null;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { BasicDecoratorProps } from "../interfaces";
|
|
3
|
-
export
|
|
3
|
+
export type DecoratorTextProps = Pick<BasicDecoratorProps, "cell" | "onDecoratorTextEditing" | "onDecoratorTextChange">;
|
|
4
|
+
export declare function DecoratorText({ cell, onDecoratorTextEditing, onDecoratorTextChange, }: DecoratorTextProps): JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { BasicDecoratorProps } from "../interfaces";
|
|
3
|
-
export declare function DecoratorComponent({ cell, transform, onCellResizing, onCellResized, onSwitchActiveTarget, }: BasicDecoratorProps): JSX.Element | null;
|
|
3
|
+
export declare function DecoratorComponent({ cell, transform, onCellResizing, onCellResized, onSwitchActiveTarget, onDecoratorTextEditing, onDecoratorTextChange, }: BasicDecoratorProps): JSX.Element | null;
|
|
@@ -3,7 +3,7 @@ import { ReactNextElement } from "@next-core/react-element";
|
|
|
3
3
|
import type { UseSingleBrickConf } from "@next-core/react-runtime";
|
|
4
4
|
import "@next-core/theme";
|
|
5
5
|
import type { PositionTuple, RangeTuple, SizeTuple, TransformLiteral } from "../diagram/interfaces";
|
|
6
|
-
import type { ActiveTarget, Cell, EdgeCell, InitialCell, NodeBrickConf, NodeCell, NodeId, DecoratorCell, DecoratorType, CellContextMenuDetail, ConnectNodesDetail, EdgeLineConf } from "./interfaces";
|
|
6
|
+
import type { ActiveTarget, Cell, EdgeCell, InitialCell, NodeBrickConf, NodeCell, NodeId, DecoratorCell, DecoratorType, CellContextMenuDetail, ConnectNodesDetail, EdgeLineConf, DecoratorTextChangeDetail } from "./interfaces";
|
|
7
7
|
import type { MoveCellPayload, ResizeCellPayload } from "./reducers/interfaces";
|
|
8
8
|
export interface EoDrawCanvasProps {
|
|
9
9
|
cells: InitialCell[] | undefined;
|
|
@@ -24,6 +24,7 @@ export interface DropDecoratorInfo {
|
|
|
24
24
|
decorator: DecoratorType;
|
|
25
25
|
/** [PointerEvent::clientX, PointerEvent::clientY] */
|
|
26
26
|
position: PositionTuple;
|
|
27
|
+
text?: string;
|
|
27
28
|
}
|
|
28
29
|
export interface AddNodeInfo {
|
|
29
30
|
id: NodeId;
|
|
@@ -70,7 +71,7 @@ export declare class EoDrawCanvas extends ReactNextElement implements EoDrawCanv
|
|
|
70
71
|
accessor pannable: boolean | undefined;
|
|
71
72
|
accessor scaleRange: RangeTuple | undefined;
|
|
72
73
|
dropNode({ id, position, size, data, useBrick, }: DropNodeInfo): Promise<NodeCell | null>;
|
|
73
|
-
dropDecorator({ position, decorator, }: DropDecoratorInfo): Promise<DecoratorCell | null>;
|
|
74
|
+
dropDecorator({ position, decorator, text, }: DropDecoratorInfo): Promise<DecoratorCell | null>;
|
|
74
75
|
addNodes(nodes: AddNodeInfo[]): Promise<NodeCell[]>;
|
|
75
76
|
addEdge({ source, target, data }: AddEdgeInfo): Promise<EdgeCell>;
|
|
76
77
|
manuallyConnectNodes(source: NodeId): Promise<ConnectNodesDetail>;
|
|
@@ -88,6 +89,7 @@ export interface EoDrawCanvasComponentProps extends EoDrawCanvasProps {
|
|
|
88
89
|
onCellResize(cell: ResizeCellPayload): void;
|
|
89
90
|
onCellDelete(cell: Cell): void;
|
|
90
91
|
onCellContextMenu(detail: CellContextMenuDetail): void;
|
|
92
|
+
onDecoratorTextChange(detail: DecoratorTextChangeDetail): void;
|
|
91
93
|
onScaleChange(scale: number): void;
|
|
92
94
|
}
|
|
93
95
|
export interface DrawCanvasRef {
|
|
@@ -77,6 +77,11 @@ export interface BasicDecoratorProps {
|
|
|
77
77
|
onCellResizing(info: ResizeCellPayload): void;
|
|
78
78
|
onCellResized(info: ResizeCellPayload): void;
|
|
79
79
|
onSwitchActiveTarget(activeTarget: ActiveTarget | null): void;
|
|
80
|
+
onDecoratorTextEditing(detail: {
|
|
81
|
+
id: string;
|
|
82
|
+
editing: boolean;
|
|
83
|
+
}): void;
|
|
84
|
+
onDecoratorTextChange(detail: DecoratorTextChangeDetail): void;
|
|
80
85
|
}
|
|
81
86
|
export interface CellContextMenuDetail {
|
|
82
87
|
cell: Cell;
|
|
@@ -96,3 +101,7 @@ export interface ConnectNodesDetail {
|
|
|
96
101
|
source: NodeCell;
|
|
97
102
|
target: NodeCell;
|
|
98
103
|
}
|
|
104
|
+
export interface DecoratorTextChangeDetail {
|
|
105
|
+
id: string;
|
|
106
|
+
view: DecoratorView;
|
|
107
|
+
}
|
package/docs/eo-draw-canvas.md
CHANGED
|
@@ -29,18 +29,6 @@
|
|
|
29
29
|
height: 300,
|
|
30
30
|
},
|
|
31
31
|
},
|
|
32
|
-
{
|
|
33
|
-
type: "decorator",
|
|
34
|
-
id: "text-1",
|
|
35
|
-
decorator: "text",
|
|
36
|
-
view: {
|
|
37
|
-
x: 100,
|
|
38
|
-
y: 120,
|
|
39
|
-
width: 100,
|
|
40
|
-
height: 20,
|
|
41
|
-
text: "Hello!"
|
|
42
|
-
},
|
|
43
|
-
},
|
|
44
32
|
{
|
|
45
33
|
type: "edge",
|
|
46
34
|
source: "X",
|
|
@@ -74,7 +62,20 @@
|
|
|
74
62
|
height: 60,
|
|
75
63
|
}
|
|
76
64
|
}))
|
|
77
|
-
)
|
|
65
|
+
).concat([
|
|
66
|
+
{
|
|
67
|
+
type: "decorator",
|
|
68
|
+
id: "text-1",
|
|
69
|
+
decorator: "text",
|
|
70
|
+
view: {
|
|
71
|
+
x: 100,
|
|
72
|
+
y: 120,
|
|
73
|
+
width: 100,
|
|
74
|
+
height: 20,
|
|
75
|
+
text: "Hello!"
|
|
76
|
+
},
|
|
77
|
+
},
|
|
78
|
+
])
|
|
78
79
|
%>
|
|
79
80
|
- name: dragging
|
|
80
81
|
- name: activeTarget
|
|
@@ -261,6 +262,7 @@
|
|
|
261
262
|
args:
|
|
262
263
|
- position: <% EVENT.detail %>
|
|
263
264
|
decorator: <% ITEM %>
|
|
265
|
+
text: '<% ITEM === "text" ? "Text" : undefined %>'
|
|
264
266
|
callback:
|
|
265
267
|
success:
|
|
266
268
|
if: <% EVENT.detail %>
|
|
@@ -333,6 +335,10 @@
|
|
|
333
335
|
args:
|
|
334
336
|
- targetCell
|
|
335
337
|
- <% EVENT.detail.cell %>
|
|
338
|
+
decorator.text.change:
|
|
339
|
+
action: message.info
|
|
340
|
+
args:
|
|
341
|
+
- <% JSON.stringify(EVENT.detail) %>
|
|
336
342
|
scale.change:
|
|
337
343
|
action: context.replace
|
|
338
344
|
args:
|
|
@@ -342,7 +348,7 @@
|
|
|
342
348
|
properties:
|
|
343
349
|
usage: dragging
|
|
344
350
|
textContent: |
|
|
345
|
-
<%= CTX.dragging?.type === "decorator" ? (CTX.dragging.decorator === "text" ? "
|
|
351
|
+
<%= CTX.dragging?.type === "decorator" ? (CTX.dragging.decorator === "text" ? "Text" : null) : CTX.dragging?.data.name %>
|
|
346
352
|
decorator: |
|
|
347
353
|
<%= CTX.dragging?.type === "decorator" ? CTX.dragging.decorator : null %>
|
|
348
354
|
style: |
|
|
@@ -352,6 +358,7 @@
|
|
|
352
358
|
top: `${CTX.dragging?.position[1]}px`,
|
|
353
359
|
transform: `scale(${CTX.scale})`,
|
|
354
360
|
transformOrigin: "0 0",
|
|
361
|
+
padding: CTX.dragging?.decorator === "text" ? "0.5em" : "0"
|
|
355
362
|
}
|
|
356
363
|
%>
|
|
357
364
|
hidden: <%= !CTX.dragging %>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@next-bricks/diagram",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.23.1",
|
|
4
4
|
"homepage": "https://github.com/easyops-cn/next-bricks/tree/master/bricks/diagram",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -41,5 +41,5 @@
|
|
|
41
41
|
"@next-bricks/basic": "*",
|
|
42
42
|
"@next-bricks/icons": "*"
|
|
43
43
|
},
|
|
44
|
-
"gitHead": "
|
|
44
|
+
"gitHead": "201dbaa07d7820358d2a5c0089d482581bf1be09"
|
|
45
45
|
}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
"use strict";(self.webpackChunk_next_bricks_diagram=self.webpackChunk_next_bricks_diagram||[]).push([[2696],{5776:(e,t,n)=>{n.d(t,{s:()=>E});var r=n(5600),a=n.n(r),o=n(1252),i=n.n(o),c=n(7181),l=n(6960),d=n(960);function s(e,t){return e.find((e=>(0,c.G4)(e)&&e.id===t))}function v(e){var{edge:t,cells:n,markerEnd:o,defaultEdgeLines:c}=e,v=(0,r.useMemo)((()=>s(n,t.source)),[n,t.source]),f=(0,r.useMemo)((()=>s(n,t.target)),[n,t.target]),h=(0,r.useMemo)((()=>null==c?void 0:c.find((e=>(0,l.checkIfByTransform)(e,{edge:t})))),[c,t]),m=(0,r.useMemo)((()=>v&&f?(0,d.g)(u(v.view,5),u(f.view,5)):null),[v,f]);if(!m)return null;var w="M".concat(m[0].x," ").concat(m[0].y,"L").concat(m[1].x," ").concat(m[1].y);return a().createElement(a().Fragment,null,a().createElement("path",{d:w,fill:"none",stroke:"transparent",strokeWidth:16}),a().createElement("path",{className:i()("line",{dashed:null==h?void 0:h.dashed}),d:w,fill:"none",stroke:"gray",markerEnd:"url(#".concat(o,")")}),a().createElement("path",{className:"line-active-bg",d:w,fill:"none"}))}function u(e,t){return{x:e.x+e.width/2,y:e.y+e.height/2,width:e.width+t,height:e.height+t}}var f=n(6196);function h(e){var{node:t,defaultNodeBricks:n}=e,o=(0,r.useMemo)((()=>({node:{id:t.id,data:t.data}})),[t.id,t.data]),i=t.useBrick,c=(0,r.useMemo)((()=>{var e;return null!=i?i:null==n||null===(e=n.find((e=>(0,l.checkIfByTransform)(e,o))))||void 0===e?void 0:e.useBrick}),[n,i,o]);return c?a().createElement("foreignObject",{width:t.view.width,height:t.view.height,style:{overflow:"visible"}},c&&a().createElement(f.ReactUseBrick,{useBrick:c,data:o})):null}var m=n(7568);function w(e){return"edge"===e.type?(0,m.pick)(e,["type","source","target","data"]):(0,m.pick)(e,["type","id","data"])}function p(e,t){var{action:n,cell:r,scale:a,onCellMoving:o,onCellMoved:i,onCellResizing:c,onCellResized:l,onSwitchActiveTarget:d}=t;if(e.stopPropagation(),d(w(r)),"edge"!==r.type){var s=[e.clientX,e.clientY],v="move"===n?[r.view.x,r.view.y]:[r.view.width,r.view.height],u=!1,f=(e,t)=>{var d,f,h=function(e){return[(e.clientX-s[0])/a,(e.clientY-s[1])/a]}(e);u||(u=h[0]**2+h[1]**2>=9),u&&("move"===n?null===(d=t?i:o)||void 0===d||d({type:r.type,id:r.id,x:v[0]+h[0],y:v[1]+h[1]}):null===(f=t?l:c)||void 0===f||f({type:r.type,id:r.id,width:v[0]+h[0],height:v[1]+h[1]}))},h=e=>{f(e)},m=e=>{f(e,!0),u=!1,document.removeEventListener("mousemove",h),document.removeEventListener("mouseup",m)};document.addEventListener("mousemove",h),document.addEventListener("mouseup",m)}}function g(e){var{cell:t,transform:n,onCellResizing:o,onCellResized:i,onSwitchActiveTarget:c}=e,l=a().useRef(null);return(0,r.useEffect)((()=>{var e=l.current,r=e=>{p(e,{action:"resize",cell:t,scale:n.k,onCellResizing:o,onCellResized:i,onSwitchActiveTarget:c})};return null==e||e.addEventListener("mousedown",r),()=>{null==e||e.removeEventListener("mousedown",r)}}),[t,i,o,c,n.k]),a().createElement("g",{className:"decorator-area"},a().createElement("rect",{width:t.view.width,height:t.view.height,className:"area"}),a().createElement("g",{ref:l,className:"resize-handle",transform:"translate(".concat(t.view.width-20," ").concat(t.view.height-20,")")},a().createElement("rect",{width:20,height:20}),a().createElement("path",{d:"M10 18L18 10 M15 18L18 15"})))}function y(e){var{cell:t}=e;return a().createElement("text",{className:"decorator-text"},t.view.text||"未命名")}function k(e){var t,{cell:n,transform:r,onCellResizing:o,onCellResized:i,onSwitchActiveTarget:c}=e;switch(n.decorator){case"area":t=g;break;case"text":t=y;break;default:return console.error("Unknown decorator: ".concat(n.decorator)),null}return a().createElement(t,{cell:n,transform:r,onCellResizing:o,onCellResized:i,onSwitchActiveTarget:c})}function E(e){var{cell:t,cells:n,defaultNodeBricks:o,defaultEdgeLines:l,markerEnd:d,active:s,transform:u,onCellMoving:f,onCellMoved:m,onCellResizing:g,onCellResized:y,onSwitchActiveTarget:E,onCellContextMenu:x}=e,C=(0,r.useRef)(null);(0,r.useEffect)((()=>{var e=C.current,n=e=>{p(e,{action:"move",cell:t,scale:u.k,onCellMoving:f,onCellMoved:m,onSwitchActiveTarget:E})};return null==e||e.addEventListener("mousedown",n),()=>{null==e||e.removeEventListener("mousedown",n)}}),[t,m,f,E,u.k]);var z=(0,r.useCallback)((e=>{e.preventDefault(),E(w(t)),x({cell:t,clientX:e.clientX,clientY:e.clientY})}),[t,x,E]);return a().createElement("g",{className:i()("cell",{active:s}),ref:C,transform:"edge"===t.type?void 0:"translate(".concat(t.view.x," ").concat(t.view.y,")"),onContextMenu:z},(0,c.G4)(t)?a().createElement(h,{node:t,defaultNodeBricks:o}):(0,c.Wk)(t)?a().createElement(v,{edge:t,defaultEdgeLines:l,cells:n,markerEnd:d}):(0,c.c1)(t)?a().createElement(k,{cell:t,transform:u,onCellResizing:g,onCellResized:y,onSwitchActiveTarget:E}):null)}},8044:(e,t,n)=>{n.d(t,{E:()=>c});var r=n(5600),a=n.n(r),o=n(1252),i=n.n(o);function c(e){var{connectLineState:t,transform:n,markerEnd:o,onConnect:c}=e,[l,d]=(0,r.useState)(null);return(0,r.useEffect)((()=>{t&&d(t.from)}),[t]),(0,r.useEffect)((()=>{if(t){var e=e=>{d([(e.clientX-n.x-t.offset[0])/n.k,(e.clientY-n.y-t.offset[1])/n.k])},r=e=>{e.stopPropagation()},a=e=>{e.stopPropagation(),o(),c(t,[(e.clientX-n.x-t.offset[0])/n.k,(e.clientY-n.y-t.offset[1])/n.k])},o=()=>{document.removeEventListener("mousemove",e),document.removeEventListener("mousedown",r,{capture:!0}),document.removeEventListener("click",a,{capture:!0}),d(null)};return document.addEventListener("mousemove",e),document.addEventListener("mousedown",r,{capture:!0}),document.addEventListener("click",a,{capture:!0}),o}}),[t,c,n]),a().createElement("path",{className:i()("connect-line",{connecting:!!t&&l&&(l[0]-t.from[0])**2+(l[1]-t.from[1])**2>25}),d:t&&l?"M".concat(t.from.join(" "),"L").concat(l.join(" ")):"",fill:"none",stroke:"gray",strokeWidth:1,markerEnd:"url(#".concat(o,")")})}},7181:(e,t,n)=>{function r(e){return"node"===e.type}function a(e){return"decorator"===e.type}function o(e){return"node"===e.type}function i(e){return"edge"===e.type}n.d(t,{Cy:()=>o,G4:()=>r,Wk:()=>i,c1:()=>a})},6876:(e,t,n)=>{n.d(t,{Y:()=>a});var r=n(4552);function a(e,t){var{cells:n,activeTarget:a}=t,o=n.find((e=>(0,r.M)(e,a)));if(o)switch(e.key||e.keyCode||e.which){case"Backspace":case 8:case"Delete":case 46:return e.preventDefault(),e.stopPropagation(),{action:"delete-cell",cell:o}}}},7876:(e,t,n)=>{n.d(t,{S:()=>o});var r=n(4412),a=n(7181);function o(e,t){var{defaultNodeSize:n}=t;return(null!=e?e:[]).map((e=>{var t,o;return!(0,a.Cy)(e)||void 0!==(null===(t=e.view)||void 0===t?void 0:t.width)&&void 0!==(null===(o=e.view)||void 0===o?void 0:o.height)?e:(0,r.c)((0,r.c)({},e),{},{view:(0,r.c)({width:n[0],height:n[1]},e.view)})}))}},4552:(e,t,n)=>{function r(e,t){return e?!!t&&e.type===t.type&&("node"===e.type||"decorator"===e.type?e.id===t.id:e.source===t.source&&e.target===t.target):!t}n.d(t,{M:()=>r})},3788:(e,t,n)=>{n.d(t,{c:()=>a});var r=n(7181);function a(e,t){var{canvasWidth:n,canvasHeight:a,scaleRange:o}=t,i=1/0,c=1/0,l=-1/0,d=-1/0,s=!0;for(var v of e)if(!(0,r.Wk)(v)){s=!1;var{view:u}=v,f=u.x+u.width,h=u.y+u.height;u.x<i&&(i=u.x),f>l&&(l=f),u.y<c&&(c=u.y),h>d&&(d=h)}var m=l-i,w=d-c,p=o&&!s&&(m>n||w>a)?Math.max(Math.min(n/m,a/w,o[1]),o[0]):1;return{x:s?0:(n-m*p)/2-i*p,y:s?0:(a-w*p)/2-c*p,k:p}}},2872:(e,t,n)=>{n.d(t,{s:()=>o});var r=n(7181),a=n(7876);function o(e){var{cells:t,defaultNodeSize:n,reason:o,parent:i}=e,c=(0,a.S)(t,{defaultNodeSize:n}),l=[];if("add-related-nodes"===o&&i){var d=new Map,s=new Set;for(var v of c)(0,r.G4)(v)?d.set(v.id,v):(0,r.Wk)(v)&&v.source===i&&v.target!==i&&s.add(v.target);var u=d.get(i);if(void 0!==(null==u?void 0:u.view.x)&&void 0!==u.view.y){var f=[...s].map((e=>d.get(e))).filter(Boolean),h=void 0;for(var m of f)void 0!==m.view.x&&void 0!==m.view.y?(!h||m.view.x>h.view.x)&&(h=m):l.push(m);if(l.length>0){var w,p;if(h)w=h.view.x+h.view.width+20,p=h.view.y;else{var g=l.reduce(((e,t)=>e+t.view.width+20),-20);w=u.view.x-g/2+u.view.width/2,p=u.view.y+u.view.height+20}for(var y of l)y.view.x=w,y.view.y=p,w+=y.view.width+20}}}return{cells:c,updated:l}}},3876:(e,t,n)=>{n.d(t,{M:()=>i});var r=n(4412);function a(e,t,n){var r=e.findLastIndex(n)+1;return[...e.slice(0,r),t,...e.slice(r)]}var o,i=(o={cells:(e,t)=>{switch(t.type){case"drop-node":return a(e,t.payload,(e=>!("decorator"===e.type&&"text"===e.decorator)));case"drop-decorator":return"text"===t.payload.decorator?[...e,t.payload]:a(e,t.payload,(e=>"decorator"===e.type&&"area"===e.decorator));case"add-nodes":var n=e.findLastIndex((e=>!("decorator"===e.type&&"text"===e.decorator)))+1;return[...e.slice(0,n),...t.payload,...e.slice(n)];case"add-edge":return a(e,t.payload,(e=>"edge"===e.type||"decorator"===e.type&&"area"===e.decorator));case"move-cell":var{type:o,id:i,x:c,y:l}=t.payload,d=e.findIndex((e=>e.type===o&&e.id===i));if(-1!==d){var s=e[d];return[...e.slice(0,d),(0,r.c)((0,r.c)({},s),{},{view:(0,r.c)((0,r.c)({},s.view),{},{x:c,y:l})}),...e.slice(d+1)]}return e;case"resize-cell":var{type:v,id:u,width:f,height:h}=t.payload,m=e.findIndex((e=>e.type===v&&e.id===u));if(-1!==m){var w=e[m];return[...e.slice(0,m),(0,r.c)((0,r.c)({},w),{},{view:(0,r.c)((0,r.c)({},w.view),{},{width:f,height:h})}),...e.slice(m+1)]}return e;case"update-cells":return t.payload}return e}},(e,t)=>Object.fromEntries(Object.entries(o).map((n=>{var[r,a]=n;return[r,a(e[r],t)]}))))},7584:(e,t,n)=>{n.d(t,{c:()=>c});var r=n(8304),a=n.n(r),o=n(1849),i=n.n(o)()(a());i.push([e.id,"*{box-sizing:border-box}:host{display:block;position:relative;overflow:hidden}:host,\n.root{width:100%;height:100%}:host([hidden]){display:none}.root:focus{outline:none}.decorator-area .area{fill:rgba(119,141,195,0.1);stroke:none;stroke-width:0}.cell.active .decorator-area .area,\n.cell.active .line-active-bg{stroke:var(--palette-blue-5);stroke-dasharray:4;stroke-width:1}.cell.active .decorator-text{fill:var(--palette-blue-5)}.cell{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize-handle{cursor:nwse-resize;opacity:0}.resize-handle rect{fill:transparent;stroke:none}.resize-handle path{fill:none;stroke:var(--palette-gray-5);stroke-width:1.5}.cell.active .decorator-area .resize-handle,\n.decorator-area:hover .resize-handle{opacity:1}.connect-line:not(.connecting){display:none}.line.dashed{stroke-dasharray:4}",""]);const c=i.toString()}}]);
|
|
2
|
-
//# sourceMappingURL=2696.830146cb.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"chunks/2696.830146cb.js","mappings":"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","sources":["webpack:///./src/draw-canvas/processors/findNode.ts","webpack:///./src/draw-canvas/EdgeComponent.tsx","webpack:///./src/draw-canvas/NodeComponent.tsx","webpack:///./src/draw-canvas/processors/cellToTarget.ts","webpack:///./src/draw-canvas/processors/handleMouseDown.ts","webpack:///./src/draw-canvas/decorators/DecoratorArea.tsx","webpack:///./src/draw-canvas/decorators/DecoratorText.tsx","webpack:///./src/draw-canvas/decorators/index.tsx","webpack:///./src/draw-canvas/CellComponent.tsx","webpack:///./src/draw-canvas/ConnectLineComponent.tsx","webpack:///./src/draw-canvas/processors/asserts.ts","webpack:///./src/draw-canvas/processors/handleKeyboard.ts","webpack:///./src/draw-canvas/processors/initializeCells.ts","webpack:///./src/draw-canvas/processors/sameTarget.ts","webpack:///./src/draw-canvas/processors/transformToCenter.ts","webpack:///./src/draw-canvas/processors/updateCells.ts","webpack:///./src/draw-canvas/reducers/cells.ts","webpack:///./src/draw-canvas/reducers/index.ts","webpack:///./src/draw-canvas/styles.shadow.css"],"sourcesContent":["import type { Cell, NodeCell, NodeId } from \"../interfaces\";\nimport { isNodeCell } from \"./asserts\";\n\nexport function findNode(cells: Cell[], id: NodeId): NodeCell | undefined {\n return cells.find((cell) => isNodeCell(cell) && cell.id === id) as\n | NodeCell\n | undefined;\n}\n","import React, { useMemo } from \"react\";\nimport { checkIfByTransform } from \"@next-core/runtime\";\nimport classNames from \"classnames\";\nimport type { Cell, EdgeCell, EdgeLineConf, NodeView } from \"./interfaces\";\nimport { getDirectLinePoints } from \"../diagram/lines/getDirectLinePoints\";\nimport type { NodeRect } from \"../diagram/interfaces\";\nimport { findNode } from \"./processors/findNode\";\n\nexport interface EdgeComponentProps {\n edge: EdgeCell;\n cells: Cell[];\n markerEnd: string;\n defaultEdgeLines?: EdgeLineConf[];\n}\n\nexport function EdgeComponent({\n edge,\n cells,\n markerEnd,\n defaultEdgeLines,\n}: EdgeComponentProps): JSX.Element | null {\n const sourceNode = useMemo(\n () => findNode(cells, edge.source),\n [cells, edge.source]\n );\n const targetNode = useMemo(\n () => findNode(cells, edge.target),\n [cells, edge.target]\n );\n const lineConf = useMemo(\n () => defaultEdgeLines?.find((item) => checkIfByTransform(item, { edge })),\n [defaultEdgeLines, edge]\n );\n\n const padding = 5;\n\n const line = useMemo(\n () =>\n sourceNode && targetNode\n ? getDirectLinePoints(\n nodeViewToNodeRect(sourceNode.view, padding),\n nodeViewToNodeRect(targetNode.view, padding)\n )\n : null,\n [sourceNode, targetNode]\n );\n\n if (!line) {\n // This happens when source or target is not found\n return null;\n }\n\n const d = `M${line[0].x} ${line[0].y}L${line[1].x} ${line[1].y}`;\n\n return (\n <>\n <path\n // This `path` is made for expanding interaction area of graph lines.\n d={d}\n fill=\"none\"\n stroke=\"transparent\"\n strokeWidth={16}\n />\n <path\n className={classNames(\"line\", { dashed: lineConf?.dashed })}\n d={d}\n fill=\"none\"\n stroke=\"gray\"\n markerEnd={`url(#${markerEnd})`}\n />\n <path className=\"line-active-bg\" d={d} fill=\"none\" />\n </>\n );\n}\n\nfunction nodeViewToNodeRect(view: NodeView, padding: number): NodeRect {\n return {\n x: view.x + view.width / 2,\n y: view.y + view.height / 2,\n width: view.width + padding,\n height: view.height + padding,\n };\n}\n","import React, { useMemo } from \"react\";\nimport { ReactUseBrick } from \"@next-core/react-runtime\";\nimport { checkIfByTransform } from \"@next-core/runtime\";\nimport type { NodeBrickCell, NodeBrickConf, NodeCell } from \"./interfaces\";\n\nexport interface NodeComponentProps {\n node: NodeCell;\n defaultNodeBricks?: NodeBrickConf[];\n}\n\nexport function NodeComponent({\n node,\n defaultNodeBricks,\n}: NodeComponentProps): JSX.Element | null {\n const memoizedData = useMemo(\n () => ({ node: { id: node.id, data: node.data } }),\n [node.id, node.data]\n );\n const specifiedUseBrick = (node as NodeBrickCell).useBrick;\n\n const useBrick = useMemo(() => {\n return (\n specifiedUseBrick ??\n defaultNodeBricks?.find((item) => checkIfByTransform(item, memoizedData))\n ?.useBrick\n );\n }, [defaultNodeBricks, specifiedUseBrick, memoizedData]);\n\n return useBrick ? (\n <foreignObject\n // x={node.view.x}\n // y={node.view.y}\n width={node.view.width}\n height={node.view.height}\n style={{ overflow: \"visible\" }}\n >\n {useBrick && <ReactUseBrick useBrick={useBrick} data={memoizedData} />}\n </foreignObject>\n ) : null;\n}\n","import { pick } from \"lodash\";\nimport type { ActiveTarget, Cell } from \"../interfaces\";\n\nexport function cellToTarget(cell: Cell): ActiveTarget {\n return cell.type === \"edge\"\n ? pick(cell, [\"type\", \"source\", \"target\", \"data\"])\n : pick(cell, [\"type\", \"id\", \"data\"]);\n}\n","import type { PositionTuple } from \"../../diagram/interfaces\";\nimport type { ActiveTarget, Cell } from \"../interfaces\";\nimport type {\n MoveCellPayload,\n ResizeCellPayload,\n} from \"../reducers/interfaces\";\nimport { cellToTarget } from \"./cellToTarget\";\n\nexport function handleMouseDown(\n event: MouseEvent,\n {\n action,\n cell,\n scale,\n onCellMoving,\n onCellMoved,\n onCellResizing,\n onCellResized,\n onSwitchActiveTarget,\n }: {\n action: \"move\" | \"resize\";\n cell: Cell;\n scale: number;\n onCellMoving?(info: MoveCellPayload): void;\n onCellMoved?(info: MoveCellPayload): void;\n onCellResizing?(info: ResizeCellPayload): void;\n onCellResized?(info: ResizeCellPayload): void;\n onSwitchActiveTarget(activeTarget: ActiveTarget | null): void;\n }\n) {\n event.stopPropagation();\n // Drag node\n onSwitchActiveTarget(cellToTarget(cell));\n\n if (cell.type === \"edge\") {\n return;\n }\n\n const from: PositionTuple = [event.clientX, event.clientY];\n const original =\n action === \"move\"\n ? [cell.view.x, cell.view.y]\n : [cell.view.width, cell.view.height];\n\n function getMovement(e: MouseEvent): PositionTuple {\n return [(e.clientX - from[0]) / scale, (e.clientY - from[1]) / scale];\n }\n\n let moved = false;\n\n const handleMove = (e: MouseEvent, finished?: boolean) => {\n // Respect the scale\n const movement = getMovement(e);\n if (!moved) {\n moved = movement[0] ** 2 + movement[1] ** 2 >= 9;\n }\n // const [x, y] = getNewPosition(movement);\n // adjustCellPosition(x, y);\n if (moved) {\n if (action === \"move\") {\n (finished ? onCellMoved : onCellMoving)?.({\n type: cell.type,\n id: cell.id,\n x: original[0] + movement[0],\n y: original[1] + movement[1],\n });\n } else {\n (finished ? onCellResized : onCellResizing)?.({\n type: cell.type,\n id: cell.id,\n width: original[0] + movement[0],\n height: original[1] + movement[1],\n });\n }\n }\n };\n\n const onMouseMove = (e: MouseEvent) => {\n handleMove(e);\n };\n const onMouseUp = (e: MouseEvent) => {\n handleMove(e, true);\n moved = false;\n document.removeEventListener(\"mousemove\", onMouseMove);\n document.removeEventListener(\"mouseup\", onMouseUp);\n };\n document.addEventListener(\"mousemove\", onMouseMove);\n document.addEventListener(\"mouseup\", onMouseUp);\n}\n","import React, { useEffect } from \"react\";\nimport type { BasicDecoratorProps } from \"../interfaces\";\nimport { handleMouseDown } from \"../processors/handleMouseDown\";\n\nexport function DecoratorArea({\n cell,\n transform,\n onCellResizing,\n onCellResized,\n onSwitchActiveTarget,\n}: BasicDecoratorProps): JSX.Element {\n const resizeHandleRef = React.useRef<SVGGElement>(null);\n\n useEffect(() => {\n const resizeHandle = resizeHandleRef.current;\n const onMouseDown = (event: MouseEvent) => {\n handleMouseDown(event, {\n action: \"resize\",\n cell,\n scale: transform.k,\n onCellResizing,\n onCellResized,\n onSwitchActiveTarget,\n });\n };\n resizeHandle?.addEventListener(\"mousedown\", onMouseDown);\n return () => {\n resizeHandle?.removeEventListener(\"mousedown\", onMouseDown);\n };\n }, [cell, onCellResized, onCellResizing, onSwitchActiveTarget, transform.k]);\n\n return (\n <g className=\"decorator-area\">\n <rect\n // x={cell.view.x}\n // y={cell.view.y}\n width={cell.view.width}\n height={cell.view.height}\n className=\"area\"\n />\n <g\n ref={resizeHandleRef}\n className=\"resize-handle\"\n transform={`translate(${cell.view.width - 20} ${cell.view.height - 20})`}\n >\n <rect width={20} height={20} />\n <path d=\"M10 18L18 10 M15 18L18 15\" />\n </g>\n </g>\n );\n}\n","import React from \"react\";\nimport type { BasicDecoratorProps } from \"../interfaces\";\n\nexport function DecoratorText({ cell }: BasicDecoratorProps): JSX.Element {\n return (\n <text\n // x={cell.view.x}\n // y={cell.view.y}\n className=\"decorator-text\"\n >\n {cell.view.text || \"未命名\"}\n </text>\n );\n}\n","import React from \"react\";\nimport type { BasicDecoratorProps } from \"../interfaces\";\nimport { DecoratorArea } from \"./DecoratorArea\";\nimport { DecoratorText } from \"./DecoratorText\";\n\nexport function DecoratorComponent({\n cell,\n transform,\n onCellResizing,\n onCellResized,\n onSwitchActiveTarget,\n}: BasicDecoratorProps): JSX.Element | null {\n let SpecifiedComponent: (props: BasicDecoratorProps) => JSX.Element | null;\n\n switch (cell.decorator) {\n case \"area\":\n SpecifiedComponent = DecoratorArea;\n break;\n case \"text\":\n SpecifiedComponent = DecoratorText;\n break;\n // istanbul ignore next\n default:\n // eslint-disable-next-line no-console\n console.error(`Unknown decorator: ${cell.decorator}`);\n return null;\n }\n\n return (\n <SpecifiedComponent\n cell={cell}\n transform={transform}\n onCellResizing={onCellResizing}\n onCellResized={onCellResized}\n onSwitchActiveTarget={onSwitchActiveTarget}\n />\n );\n}\n","import React, { useCallback, useEffect, useRef } from \"react\";\nimport classNames from \"classnames\";\nimport type {\n ActiveTarget,\n Cell,\n CellContextMenuDetail,\n EdgeLineConf,\n NodeBrickConf,\n} from \"./interfaces\";\nimport { isDecoratorCell, isEdgeCell, isNodeCell } from \"./processors/asserts\";\nimport { EdgeComponent } from \"./EdgeComponent\";\nimport { NodeComponent } from \"./NodeComponent\";\nimport { handleMouseDown } from \"./processors/handleMouseDown\";\nimport type { MoveCellPayload, ResizeCellPayload } from \"./reducers/interfaces\";\nimport { DecoratorComponent } from \"./decorators\";\nimport { cellToTarget } from \"./processors/cellToTarget\";\nimport type { TransformLiteral } from \"../diagram/interfaces\";\n\nexport interface CellComponentProps {\n cell: Cell;\n cells: Cell[];\n defaultNodeBricks?: NodeBrickConf[];\n defaultEdgeLines?: EdgeLineConf[];\n transform: TransformLiteral;\n markerEnd: string;\n active: boolean;\n onCellMoving(info: MoveCellPayload): void;\n onCellMoved(info: MoveCellPayload): void;\n onCellResizing(info: ResizeCellPayload): void;\n onCellResized(info: ResizeCellPayload): void;\n onSwitchActiveTarget(target: ActiveTarget | null): void;\n onCellContextMenu(detail: CellContextMenuDetail): void;\n}\n\nexport function CellComponent({\n cell,\n cells,\n defaultNodeBricks,\n defaultEdgeLines,\n markerEnd,\n active,\n transform,\n onCellMoving,\n onCellMoved,\n onCellResizing,\n onCellResized,\n onSwitchActiveTarget,\n onCellContextMenu,\n}: CellComponentProps): JSX.Element | null {\n const gRef = useRef<SVGGElement>(null);\n\n useEffect(() => {\n const g = gRef.current;\n const onMouseDown = (event: MouseEvent) => {\n handleMouseDown(event, {\n action: \"move\",\n cell,\n scale: transform.k,\n onCellMoving,\n onCellMoved,\n onSwitchActiveTarget,\n });\n };\n g?.addEventListener(\"mousedown\", onMouseDown);\n return () => {\n g?.removeEventListener(\"mousedown\", onMouseDown);\n };\n }, [cell, onCellMoved, onCellMoving, onSwitchActiveTarget, transform.k]);\n\n const handleContextMenu = useCallback(\n (event: React.MouseEvent<SVGGElement>) => {\n event.preventDefault();\n onSwitchActiveTarget(cellToTarget(cell));\n onCellContextMenu({\n cell,\n clientX: event.clientX,\n clientY: event.clientY,\n });\n },\n [cell, onCellContextMenu, onSwitchActiveTarget]\n );\n\n return (\n <g\n className={classNames(\"cell\", { active })}\n ref={gRef}\n transform={\n cell.type === \"edge\"\n ? undefined\n : `translate(${cell.view.x} ${cell.view.y})`\n }\n onContextMenu={handleContextMenu}\n >\n {isNodeCell(cell) ? (\n <NodeComponent node={cell} defaultNodeBricks={defaultNodeBricks} />\n ) : isEdgeCell(cell) ? (\n <EdgeComponent\n edge={cell}\n defaultEdgeLines={defaultEdgeLines}\n cells={cells}\n markerEnd={markerEnd}\n />\n ) : isDecoratorCell(cell) ? (\n <DecoratorComponent\n cell={cell}\n transform={transform}\n onCellResizing={onCellResizing}\n onCellResized={onCellResized}\n onSwitchActiveTarget={onSwitchActiveTarget}\n />\n ) : null}\n </g>\n );\n}\n","import React, { useEffect, useState } from \"react\";\nimport classNames from \"classnames\";\nimport type { ConnectLineState } from \"./interfaces\";\nimport type { PositionTuple, TransformLiteral } from \"../diagram/interfaces\";\n\nexport interface ConnectLineComponentProps {\n connectLineState: ConnectLineState | null;\n transform: TransformLiteral;\n markerEnd: string;\n onConnect(state: ConnectLineState, to: PositionTuple): void;\n}\n\nexport function ConnectLineComponent({\n connectLineState,\n transform,\n markerEnd,\n onConnect,\n}: ConnectLineComponentProps): JSX.Element {\n const [connectLineTo, setConnectLineTo] = useState<PositionTuple | null>(\n null\n );\n\n useEffect(() => {\n if (connectLineState) {\n setConnectLineTo(connectLineState.from);\n }\n }, [connectLineState]);\n\n useEffect(() => {\n if (connectLineState) {\n const onMouseMove = (e: MouseEvent) => {\n // Set connect line to based on the mouse position and the transform\n setConnectLineTo([\n (e.clientX - transform.x - connectLineState.offset[0]) / transform.k,\n (e.clientY - transform.y - connectLineState.offset[1]) / transform.k,\n ]);\n };\n const onMouseDown = (e: MouseEvent) => {\n e.stopPropagation();\n };\n const onClick = (e: MouseEvent) => {\n e.stopPropagation();\n // eslint-disable-next-line @typescript-eslint/no-use-before-define\n reset();\n onConnect(connectLineState, [\n (e.clientX - transform.x - connectLineState.offset[0]) / transform.k,\n (e.clientY - transform.y - connectLineState.offset[1]) / transform.k,\n ]);\n };\n const reset = () => {\n document.removeEventListener(\"mousemove\", onMouseMove);\n document.removeEventListener(\"mousedown\", onMouseDown, {\n capture: true,\n });\n document.removeEventListener(\"click\", onClick, { capture: true });\n setConnectLineTo(null);\n };\n document.addEventListener(\"mousemove\", onMouseMove);\n document.addEventListener(\"mousedown\", onMouseDown, { capture: true });\n document.addEventListener(\"click\", onClick, { capture: true });\n\n return reset;\n }\n }, [connectLineState, onConnect, transform]);\n\n return (\n <path\n className={classNames(\"connect-line\", {\n connecting:\n !!connectLineState &&\n connectLineTo &&\n // Do not show when the distance of mouse move is less than 5px\n (connectLineTo[0] - connectLineState.from[0]) ** 2 +\n (connectLineTo[1] - connectLineState.from[1]) ** 2 >\n 25,\n })}\n d={\n connectLineState && connectLineTo\n ? `M${connectLineState.from.join(\" \")}L${connectLineTo.join(\" \")}`\n : \"\"\n }\n fill=\"none\"\n stroke=\"gray\"\n strokeWidth={1}\n markerEnd={`url(#${markerEnd})`}\n />\n );\n}\n","import type {\n Cell,\n DecoratorCell,\n EdgeCell,\n InitialCell,\n InitialNodeCell,\n NodeCell,\n} from \"../interfaces\";\n\nexport function isNodeCell(cell: Cell): cell is NodeCell {\n return cell.type === \"node\";\n}\n\nexport function isDecoratorCell(cell: Cell): cell is DecoratorCell {\n return cell.type === \"decorator\";\n}\n\nexport function isInitialNodeCell(cell: InitialCell): cell is InitialNodeCell {\n return cell.type === \"node\";\n}\n\nexport function isEdgeCell(cell: Cell): cell is EdgeCell {\n return cell.type === \"edge\";\n}\n","import type { ActiveTarget, Cell } from \"../interfaces\";\nimport { sameTarget } from \"./sameTarget\";\n\nexport type KeyboardAction = KeyboardActionDeleteCell;\n\nexport interface KeyboardActionDeleteCell {\n action: \"delete-cell\";\n cell: Cell;\n}\n\nexport function handleKeyboard(\n event: KeyboardEvent,\n {\n cells,\n activeTarget,\n }: {\n cells: Cell[];\n activeTarget: ActiveTarget | null | undefined;\n }\n): KeyboardAction | undefined {\n const activeCell = cells.find((cell) => sameTarget(cell, activeTarget));\n\n if (!activeCell) {\n return;\n }\n\n const key =\n event.key ||\n /* istanbul ignore next: compatibility */ event.keyCode ||\n /* istanbul ignore next: compatibility */ event.which;\n\n switch (key) {\n case \"Backspace\":\n case 8:\n case \"Delete\":\n case 46: {\n event.preventDefault();\n event.stopPropagation();\n return {\n action: \"delete-cell\",\n cell: activeCell,\n };\n }\n }\n}\n","import type { SizeTuple } from \"../../diagram/interfaces\";\nimport type { Cell, InitialCell, NodeCell } from \"../interfaces\";\nimport { isInitialNodeCell } from \"./asserts\";\n\nexport function initializeCells(\n initialCells: InitialCell[] | undefined,\n {\n defaultNodeSize,\n }: {\n defaultNodeSize: SizeTuple;\n }\n): Cell[] {\n const originalCells = initialCells ?? [];\n const finalCells: Cell[] = originalCells.map<Cell>((cell) => {\n if (\n !isInitialNodeCell(cell) ||\n (cell.view?.width !== undefined && cell.view?.height !== undefined)\n ) {\n return cell as NodeCell;\n }\n return {\n ...cell,\n view: {\n width: defaultNodeSize[0],\n height: defaultNodeSize[1],\n ...cell.view,\n },\n } as NodeCell;\n });\n return finalCells;\n}\n","import type {\n ActiveTarget,\n ActiveTargetOfEdge,\n ActiveTargetOfNode,\n} from \"../interfaces\";\n\nexport function sameTarget(\n a: ActiveTarget | null | undefined,\n b: ActiveTarget | null | undefined\n): boolean {\n return a\n ? !!b &&\n a.type === b.type &&\n (a.type === \"node\" || a.type === \"decorator\"\n ? a.id === (b as ActiveTargetOfNode).id\n : a.source === (b as ActiveTargetOfEdge).source &&\n a.target === (b as ActiveTargetOfEdge).target)\n : !b;\n}\n","import type { TransformLiteral } from \"../../diagram/interfaces\";\nimport type { Cell } from \"../interfaces\";\nimport { isEdgeCell } from \"./asserts\";\n\nexport interface TransformToCenterOptions {\n canvasWidth: number;\n canvasHeight: number;\n scaleRange?: [min: number, max: number];\n}\n\nexport function transformToCenter(\n cells: Cell[],\n { canvasWidth, canvasHeight, scaleRange }: TransformToCenterOptions\n): TransformLiteral {\n let left = Infinity;\n let top = Infinity;\n let right = -Infinity;\n let bottom = -Infinity;\n let empty = true;\n for (const cell of cells) {\n if (!isEdgeCell(cell)) {\n empty = false;\n const { view } = cell;\n const r = view.x + view.width;\n const b = view.y + view.height;\n if (view.x < left) {\n left = view.x;\n }\n if (r > right) {\n right = r;\n }\n if (view.y < top) {\n top = view.y;\n }\n if (b > bottom) {\n bottom = b;\n }\n }\n }\n\n const width = right - left;\n const height = bottom - top;\n\n const scale =\n scaleRange && !empty && (width > canvasWidth || height > canvasHeight)\n ? Math.max(\n Math.min(canvasWidth / width, canvasHeight / height, scaleRange[1]),\n scaleRange[0]\n )\n : 1;\n\n const x = empty ? 0 : (canvasWidth - width * scale) / 2 - left * scale;\n const y = empty ? 0 : (canvasHeight - height * scale) / 2 - top * scale;\n\n return { x, y, k: scale };\n}\n","import type { SizeTuple } from \"../../diagram/interfaces\";\nimport type { Cell, InitialCell, NodeCell, NodeId } from \"../interfaces\";\nimport { isEdgeCell, isNodeCell } from \"./asserts\";\nimport { initializeCells } from \"./initializeCells\";\n\nexport function updateCells({\n cells,\n defaultNodeSize,\n reason,\n parent,\n}: {\n cells: InitialCell[];\n defaultNodeSize: SizeTuple;\n reason?: \"add-related-nodes\";\n parent?: NodeId;\n}): {\n cells: Cell[];\n updated: Cell[];\n} {\n const newCells = initializeCells(cells, { defaultNodeSize });\n const updateCandidates: NodeCell[] = [];\n if (reason === \"add-related-nodes\" && parent) {\n // Place these unpositioned downstream nodes below the parent node, and\n // on the right side of the positioned siblings.\n const nodesMap = new Map<string, NodeCell>();\n const downstreamNodeIds = new Set<string>();\n for (const cell of newCells) {\n if (isNodeCell(cell)) {\n nodesMap.set(cell.id, cell);\n } else if (isEdgeCell(cell)) {\n if (cell.source === parent && cell.target !== parent) {\n downstreamNodeIds.add(cell.target);\n }\n }\n }\n const parentNode = nodesMap.get(parent);\n if (parentNode?.view.x !== undefined && parentNode.view.y !== undefined) {\n const downstreamNodes = [...downstreamNodeIds]\n .map((id) => nodesMap.get(id))\n .filter(Boolean) as NodeCell[];\n let rightMostNode: NodeCell | undefined = undefined;\n for (const node of downstreamNodes) {\n if (node.view.x !== undefined && node.view.y !== undefined) {\n // Positioned nodes\n if (!rightMostNode || node.view.x > rightMostNode.view.x) {\n rightMostNode = node;\n }\n } else {\n // Unpositioned nodes\n updateCandidates.push(node);\n }\n }\n if (updateCandidates.length > 0) {\n const gap = 20;\n let nextX: number;\n let nextY: number;\n if (rightMostNode) {\n // Place unpositioned nodes on the right side of the rightmost positioned siblings.\n nextX = rightMostNode.view.x + rightMostNode.view.width + gap;\n nextY = rightMostNode.view.y;\n } else {\n // If there are no positioned siblings, just place them below the parent.\n const totalWidth = updateCandidates.reduce(\n (acc, node) => acc + node.view.width + gap,\n -gap\n );\n nextX =\n parentNode.view.x - totalWidth / 2 + parentNode.view.width / 2;\n nextY = parentNode.view.y + parentNode.view.height + gap;\n }\n for (const node of updateCandidates) {\n node.view.x = nextX;\n node.view.y = nextY;\n nextX += node.view.width + gap;\n }\n }\n }\n }\n return { cells: newCells, updated: updateCandidates };\n}\n","import type { Reducer } from \"react\";\nimport type { DrawCanvasAction } from \"./interfaces\";\nimport type { Cell, NodeCell } from \"../interfaces\";\n\nexport const cells: Reducer<Cell[], DrawCanvasAction> = (state, action) => {\n switch (action.type) {\n case \"drop-node\":\n return insertCellAfter(\n state,\n action.payload,\n (cell) => !(cell.type === \"decorator\" && cell.decorator === \"text\")\n );\n case \"drop-decorator\": {\n if (action.payload.decorator === \"text\") {\n return [...state, action.payload];\n }\n return insertCellAfter(\n state,\n action.payload,\n (cell) => cell.type === \"decorator\" && cell.decorator === \"area\"\n );\n }\n case \"add-nodes\": {\n const index =\n state.findLastIndex(\n (cell) => !(cell.type === \"decorator\" && cell.decorator === \"text\")\n ) + 1;\n return [\n ...state.slice(0, index),\n ...action.payload,\n ...state.slice(index),\n ];\n }\n case \"add-edge\":\n // Add the edge to just next to the previous last edge or area decorator.\n // If not found, append to the start.\n return insertCellAfter(\n state,\n action.payload,\n (cell) =>\n cell.type === \"edge\" ||\n (cell.type === \"decorator\" && cell.decorator === \"area\")\n );\n case \"move-cell\": {\n const { type, id, x, y } = action.payload;\n const index = state.findIndex(\n (cell) => cell.type === type && cell.id === id\n );\n if (index !== -1) {\n const node = state[index] as NodeCell;\n return [\n ...state.slice(0, index),\n { ...node, view: { ...node.view, x, y } },\n ...state.slice(index + 1),\n ];\n }\n return state;\n }\n case \"resize-cell\": {\n const { type, id, width, height } = action.payload;\n const index = state.findIndex(\n (cell) => cell.type === type && cell.id === id\n );\n if (index !== -1) {\n const node = state[index] as NodeCell;\n return [\n ...state.slice(0, index),\n { ...node, view: { ...node.view, width, height } },\n ...state.slice(index + 1),\n ];\n }\n return state;\n }\n case \"update-cells\":\n return action.payload;\n }\n return state;\n};\n\nfunction insertCellAfter(\n cells: Cell[],\n newCell: Cell,\n after: (cell: Cell) => boolean\n) {\n const index = cells.findLastIndex(after) + 1;\n return [...cells.slice(0, index), newCell, ...cells.slice(index)];\n}\n","import { Reducer } from \"react\";\nimport type { DrawCanvasAction, DrawCanvasState } from \"./interfaces\";\nimport { cells } from \"./cells\";\n\ntype ReducersMapObject<S, A> = {\n [K in keyof S]: Reducer<S[K], A>;\n};\n\nfunction combineReducers<S, A>(\n reducers: ReducersMapObject<S, A>\n): Reducer<S, A> {\n return ((state, action) =>\n Object.fromEntries(\n Object.entries<Reducer<any, A>>(reducers).map(([key, value]) => [\n key,\n value(state[key as keyof S], action),\n ])\n )) as Reducer<S, A>;\n}\n\nexport const rootReducer = combineReducers<DrawCanvasState, DrawCanvasAction>({\n cells,\n});\n","// Imports\nimport ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/noSourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `*{box-sizing:border-box}:host{display:block;position:relative;overflow:hidden}:host,\n.root{width:100%;height:100%}:host([hidden]){display:none}.root:focus{outline:none}.decorator-area .area{fill:rgba(119,141,195,0.1);stroke:none;stroke-width:0}.cell.active .decorator-area .area,\n.cell.active .line-active-bg{stroke:var(--palette-blue-5);stroke-dasharray:4;stroke-width:1}.cell.active .decorator-text{fill:var(--palette-blue-5)}.cell{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize-handle{cursor:nwse-resize;opacity:0}.resize-handle rect{fill:transparent;stroke:none}.resize-handle path{fill:none;stroke:var(--palette-gray-5);stroke-width:1.5}.cell.active .decorator-area .resize-handle,\n.decorator-area:hover .resize-handle{opacity:1}.connect-line:not(.connecting){display:none}.line.dashed{stroke-dasharray:4}`, \"\"]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___.toString();\n"],"names":["findNode","cells","id","find","cell","isNodeCell","EdgeComponent","_ref","edge","markerEnd","defaultEdgeLines","sourceNode","useMemo","source","targetNode","target","lineConf","item","checkIfByTransform","line","getDirectLinePoints","nodeViewToNodeRect","view","d","concat","x","y","React","fill","stroke","strokeWidth","className","classNames","dashed","padding","width","height","NodeComponent","node","defaultNodeBricks","memoizedData","data","specifiedUseBrick","useBrick","_defaultNodeBricks$fi","style","overflow","ReactUseBrick","cellToTarget","type","pick","handleMouseDown","event","action","scale","onCellMoving","onCellMoved","onCellResizing","onCellResized","onSwitchActiveTarget","stopPropagation","from","clientX","clientY","original","moved","handleMove","e","finished","_ref2","_ref3","movement","getMovement","onMouseMove","onMouseUp","document","removeEventListener","addEventListener","DecoratorArea","transform","resizeHandleRef","useEffect","resizeHandle","current","onMouseDown","k","ref","DecoratorText","text","DecoratorComponent","SpecifiedComponent","decorator","console","error","CellComponent","active","onCellContextMenu","gRef","useRef","g","handleContextMenu","useCallback","preventDefault","undefined","onContextMenu","isEdgeCell","isDecoratorCell","ConnectLineComponent","connectLineState","onConnect","connectLineTo","setConnectLineTo","useState","offset","onClick","reset","capture","connecting","join","isInitialNodeCell","handleKeyboard","activeTarget","activeCell","sameTarget","key","keyCode","which","initializeCells","initialCells","defaultNodeSize","map","_cell$view","_cell$view2","_objectSpread","a","b","transformToCenter","canvasWidth","canvasHeight","scaleRange","left","Infinity","top","right","bottom","empty","r","Math","max","min","updateCells","reason","parent","newCells","updateCandidates","nodesMap","Map","downstreamNodeIds","Set","set","add","parentNode","get","downstreamNodes","filter","Boolean","rightMostNode","push","length","nextX","nextY","totalWidth","reduce","acc","updated","insertCellAfter","newCell","after","index","findLastIndex","slice","reducers","rootReducer","state","payload","findIndex","Object","fromEntries","entries","value","___CSS_LOADER_EXPORT___","module","toString"],"sourceRoot":""}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
"use strict";(self.webpackChunk_next_bricks_diagram=self.webpackChunk_next_bricks_diagram||[]).push([[5676],{5676:(e,t,a)=>{a.r(t);var n,l,i,r,s,c,o,u,d,h,v,p,g,b,w,f,m,k,y,M,x,E,W,C,N,z,S,R,L,D,T,B,A,P,I,O,H,Y,K,X,V,_,j,q,F,G,Z,$,U,J,Q,ee,te,ae,ne,le,ie,re,se=a(123),ce=a(592),oe=a(5866),ue=a(1412),de=a(8644),he=a(5600),ve=a.n(he),pe=a(7672),ge=a(8160),be=(a(48),a(5248)),we=a(1920),fe=a(1252),me=a.n(fe),ke=a(7568),ye=a(2504),Me=a(8996),xe=a(9140),Ee=a(3600),We=a(3904),Ce=a(4378),Ne=a(8276),ze=a(2092),Se=a(8752),Re=a(4092),Le=a(3784),De=a(3732),Te=a(636),Be=a(6932),Ae=a(4580),Pe=a(9900),Ie=a(6152),Oe=a(3888),He=a(4588),Ye=a(3256),{defineElement:Ke,property:Xe,event:Ve,method:_e}=(0,pe.createDecorators)(),je=(0,he.forwardRef)(Ht);i=[Ke("eo-diagram",{styleTexts:[Ie.c]})],r=Xe({type:String}),c=Xe({attribute:!1}),u=Xe({attribute:!1}),h=Xe({attribute:!1}),p=Xe({attribute:!1}),b=Xe({attribute:!1}),f=Xe({attribute:!1}),k=Xe({type:Boolean}),M=Xe({attribute:!1}),E=Xe({attribute:!1}),C=Xe({type:Boolean}),z=Xe({type:Boolean}),R=Xe({type:Boolean}),D=Xe({attribute:!1}),B=Ve({type:"activeTarget.change"}),O=Ve({type:"node.delete"}),X=Ve({type:"edge.delete"}),q=Ve({type:"line.click"}),$=Ve({type:"line.dblclick"}),ee=Ve({type:"nodes.connect"}),le=_e();var qe=new WeakMap,Fe=new WeakMap,Ge=new WeakMap,Ze=new WeakMap,$e=new WeakMap,Ue=new WeakMap,Je=new WeakMap,Qe=new WeakMap,et=new WeakMap,tt=new WeakMap,at=new WeakMap,nt=new WeakMap,lt=new WeakMap,it=new WeakMap,rt=new WeakMap,st=new WeakMap,ct=new WeakMap,ot=new WeakMap,ut=new WeakMap,dt=new WeakMap,ht=new WeakMap,vt=new WeakMap,pt=new WeakMap,gt=new WeakMap,bt=new WeakMap,wt=new WeakMap,ft=new WeakMap,mt=new WeakMap,kt=new WeakMap,yt=new WeakMap,Mt=new WeakMap,xt=new WeakMap,Et=new WeakMap,Wt=new WeakMap;class Ct extends ge.ReactNextElement{constructor(){super(...arguments),(0,se.c)(this,Mt,{get:Ot,set:It}),(0,se.c)(this,mt,{get:Pt,set:At}),(0,se.c)(this,bt,{get:Bt,set:Tt}),(0,se.c)(this,vt,{get:Dt,set:Lt}),(0,se.c)(this,ut,{get:Rt,set:St}),(0,se.c)(this,st,{get:zt,set:Nt}),(0,se.c)(this,qe,{writable:!0,value:(n(this),s(this))}),(0,se.c)(this,Fe,{writable:!0,value:o(this)}),(0,se.c)(this,Ge,{writable:!0,value:d(this)}),(0,se.c)(this,Ze,{writable:!0,value:v(this)}),(0,se.c)(this,$e,{writable:!0,value:g(this)}),(0,se.c)(this,Ue,{writable:!0,value:w(this)}),(0,se.c)(this,Je,{writable:!0,value:m(this)}),(0,se.c)(this,Qe,{writable:!0,value:y(this)}),(0,se.c)(this,et,{writable:!0,value:x(this)}),(0,se.c)(this,tt,{writable:!0,value:W(this)}),(0,se.c)(this,at,{writable:!0,value:N(this,!0)}),(0,se.c)(this,nt,{writable:!0,value:S(this,!0)}),(0,se.c)(this,lt,{writable:!0,value:L(this,!0)}),(0,se.c)(this,it,{writable:!0,value:T(this)}),(0,se.c)(this,rt,{writable:!0,value:A(this)}),(0,se.c)(this,ct,{writable:!0,value:e=>{(0,ue.c)(this,st).emit(e)}}),(0,se.c)(this,ot,{writable:!0,value:H(this)}),(0,se.c)(this,dt,{writable:!0,value:e=>{(0,ue.c)(this,ut).emit(e)}}),(0,se.c)(this,ht,{writable:!0,value:V(this)}),(0,se.c)(this,pt,{writable:!0,value:e=>{(0,ue.c)(this,vt).emit(e)}}),(0,se.c)(this,gt,{writable:!0,value:F(this)}),(0,se.c)(this,wt,{writable:!0,value:e=>{(0,ue.c)(this,bt).emit(e)}}),(0,se.c)(this,ft,{writable:!0,value:U(this)}),(0,se.c)(this,kt,{writable:!0,value:e=>{(0,ue.c)(this,mt).emit(e)}}),(0,se.c)(this,yt,{writable:!0,value:te(this)}),(0,se.c)(this,xt,{writable:!0,value:e=>{(0,ue.c)(this,Mt).emit(e)}}),(0,se.c)(this,Et,{writable:!0,value:e=>{(0,He.M)(e,this.activeTarget)||(this.activeTarget=e)}}),(0,se.c)(this,Wt,{writable:!0,value:(0,he.createRef)()})}get layout(){return(0,ue.c)(this,qe)}set layout(e){(0,oe.c)(this,qe,e)}get nodes(){return(0,ue.c)(this,Fe)}set nodes(e){(0,oe.c)(this,Fe,e)}get edges(){return(0,ue.c)(this,Ge)}set edges(e){(0,oe.c)(this,Ge,e)}get nodeBricks(){return(0,ue.c)(this,Ze)}set nodeBricks(e){(0,oe.c)(this,Ze,e)}get lines(){return(0,ue.c)(this,$e)}set lines(e){(0,oe.c)(this,$e,e)}get layoutOptions(){return(0,ue.c)(this,Ue)}set layoutOptions(e){(0,oe.c)(this,Ue,e)}get activeTarget(){return(0,ue.c)(this,Je)}set activeTarget(e){(0,oe.c)(this,Je,e)}get disableKeyboardAction(){return(0,ue.c)(this,Qe)}set disableKeyboardAction(e){(0,oe.c)(this,Qe,e)}get connectNodes(){return(0,ue.c)(this,et)}set connectNodes(e){(0,oe.c)(this,et,e)}get dragNodes(){return(0,ue.c)(this,tt)}set dragNodes(e){(0,oe.c)(this,tt,e)}get zoomable(){return(0,ue.c)(this,at)}set zoomable(e){(0,oe.c)(this,at,e)}get scrollable(){return(0,ue.c)(this,nt)}set scrollable(e){(0,oe.c)(this,nt,e)}get pannable(){return(0,ue.c)(this,lt)}set pannable(e){(0,oe.c)(this,lt,e)}get scaleRange(){return(0,ue.c)(this,it)}set scaleRange(e){(0,oe.c)(this,it,e)}callOnLineLabel(e,t){for(var a,n=arguments.length,l=new Array(n>2?n-2:0),i=2;i<n;i++)l[i-2]=arguments[i];null===(a=(0,ue.c)(this,Wt).current)||void 0===a||a.callOnLineLabel(e,t,...l)}render(){return ve().createElement(je,{ref:(0,ue.c)(this,Wt),layout:this.layout,nodes:this.nodes,edges:this.edges,nodeBricks:this.nodeBricks,lines:this.lines,layoutOptions:this.layoutOptions,connectNodes:this.connectNodes,dragNodes:this.dragNodes,activeTarget:this.activeTarget,disableKeyboardAction:this.disableKeyboardAction,zoomable:this.zoomable,scrollable:this.scrollable,pannable:this.pannable,scaleRange:this.scaleRange,onActiveTargetChange:(0,ue.c)(this,ct),onSwitchActiveTarget:(0,ue.c)(this,Et),onNodeDelete:(0,ue.c)(this,dt),onEdgeDelete:(0,ue.c)(this,pt),onLineClick:(0,ue.c)(this,wt),onLineDoubleClick:(0,ue.c)(this,kt),onNodesConnect:(0,ue.c)(this,xt)})}}function Nt(e){I(this,e)}function zt(){return P(this)}function St(e){K(this,e)}function Rt(){return Y(this)}function Lt(e){j(this,e)}function Dt(){return _(this)}function Tt(e){Z(this,e)}function Bt(){return G(this)}function At(e){Q(this,e)}function Pt(){return J(this)}function It(e){ne(this,e)}function Ot(){return ae(this)}function Ht(e,t){var{layout:a,nodes:n,edges:l,nodeBricks:i,lines:r,layoutOptions:s,connectNodes:c,dragNodes:o,activeTarget:u,disableKeyboardAction:d,zoomable:h,scrollable:v,pannable:p,scaleRange:g,onActiveTargetChange:b,onSwitchActiveTarget:w,onNodeDelete:f,onEdgeDelete:m,onLineClick:k,onLineDoubleClick:y,onNodesConnect:M}=e,[x,E]=(0,he.useState)(!1),[W,C]=(0,he.useState)(0),[N,z]=(0,he.useState)(null),[S,R]=(0,he.useState)(!1),[L,D]=(0,he.useState)(0),[T,B]=(0,he.useState)(null),[A,P]=(0,he.useState)([]),[I,O]=(0,he.useState)(!1),[H,Y]=(0,he.useState)({k:1,x:0,y:0}),K=(0,he.useRef)(new Map),X=(0,he.useRef)(null),V=(0,he.useRef)(null),[_,j]=(0,he.useState)(!1),{userViewReady:q,userViewNodesMap:F,saveUserView:G}=(0,Oe.y)(null==o?void 0:o.save),[Z,$]=(0,he.useState)([0,0]),[U,J]=(0,he.useState)(null),[Q,ee]=(0,he.useState)("initial"),[te,ae]=(0,he.useState)(null);(0,he.useImperativeHandle)(t,(()=>({callOnLineLabel(e,t){for(var a,n=arguments.length,l=new Array(n>2?n-2:0),i=2;i<n;i++)l[i-2]=arguments[i];null==T||null===(a=T.get(e))||void 0===a||null===(a=a.firstElementChild)||void 0===a||a[t](...l)}}))),(0,he.useEffect)((()=>{var e=e=>{(0,Te.w)(e,{nodes:n,nodesRefRepository:N,connectNodes:c,dragNodes:o,scale:H.k,setConnectLineState:J,setConnectLineTo:$,setManualLayoutStatus:ee,setNodeMovement:ae,onSwitchActiveTarget:w,onNodesConnect:M})},t=V.current;return null==t||t.addEventListener("mousedown",e),()=>{null==t||t.removeEventListener("mousedown",e)}}),[n,c,o,H.k,N,M,w]);var{normalizedLines:ne,normalizedLinesMap:le,markers:ie}=(0,he.useMemo)((()=>(0,Ce.K)(l,r)),[l,r]),re=(0,he.useMemo)((()=>ne.flatMap((e=>{var t,a,{line:{text:n,label:l,$id:i},edge:r}=e;return n||l?(l?(t="label",a=[].concat(l)):(t="text",a=[].concat(n)),a.map((e=>{var a;return{[t]:e,id:"".concat(i,"-").concat(null!==(a=e.placement)&&void 0!==a?a:"center"),edge:r}}))):[]}))),[ne]),{nodes:se,edges:ce}=(0,Ae.C)({layout:a,nodes:n,edges:l,manualLayoutStatus:Q,userViewReady:q,userViewNodesMap:F,nodeMovement:te,nodesRefRepository:N,lineLabelsRefRepository:T,normalizedLinesMap:le,layoutOptions:s,nodesRenderId:W,lineLabelsRenderId:L});(0,he.useEffect)((()=>{"finished"===Q&&G(se.map((e=>({id:e.id,x:e.x,y:e.y}))))}),[Q]);var oe=(0,he.useMemo)((()=>(0,We.e)(ce,se,ne)),[ne,se,ce]),ue=null!=u?u:null,[de,pe]=(0,he.useState)(ue);(0,he.useEffect)((()=>{pe((e=>(0,He.M)(e,ue)?e:ue))}),[ue]);var ge=(0,he.useRef)(!1);(0,he.useEffect)((()=>{ge.current?null==b||b(de):ge.current=!0}),[de,b]),(0,he.useEffect)((()=>{var e=X.current;if(e&&!d){var t=e=>{var t=(0,xe.Y)(e,{renderedNodes:se,activeTarget:de});"delete-node"===(null==t?void 0:t.action)?null==f||f(t.node):"delete-edge"===(null==t?void 0:t.action)?null==m||m(t.edge):"switch-active-node"===(null==t?void 0:t.action)&&t.node&&(null==w||w({type:"node",nodeId:t.node.id}))};return e.addEventListener("keydown",t),()=>{e.removeEventListener("keydown",t)}}}),[de,se,d,w,f,m]);var fe=(0,he.useCallback)((e=>{e&&(C((e=>e+1)),z(e)),E((t=>t||!!e))}),[]),Ie=(0,he.useCallback)((e=>{e&&(D((e=>e+1)),B(e)),R((t=>t||!!e))}),[]),Ke=(0,he.useMemo)((()=>null!=g?g:[Be.WH,Be.Oi]),[g]),Xe=(0,he.useMemo)((()=>(0,we.AT)()),[]);(0,he.useEffect)((()=>{var e=!1;Xe.scaleExtent(h?Ke:[1,1]).on("start",(()=>{e=!1,O(!0)})).on("zoom",(t=>{e=!0,Y(t.transform)})).on("end",(()=>{O(!1),e||null==w||w(null)}))}),[w,Ke,h,Xe]),(0,he.useEffect)((()=>{var e=X.current;if(e){var t=(0,be.c)(e),a=()=>{t.on(".zoom",null).on(".zoom.custom",null).on("wheel",null)};if(h||v||p)return(h||v)&&t.on("wheel.zoom.custom",(e=>{e.ctrlKey||(e.stopImmediatePropagation(),v&&(e.preventDefault(),Xe.translateBy(t,e.wheelDeltaX/5,e.wheelDeltaY/5)))})),t.call(Xe).on("wheel",(e=>e.preventDefault())).on("dblclick.zoom",null),p||t.on("mousedown.zoom",null).on("touchstart.zoom",null).on("touchmove.zoom",null).on("touchend.zoom",null),a;a()}}),[p,v,h,Xe]),(0,he.useEffect)((()=>{var e=X.current;if(0!==se.length&&e&&!_){var{k:t,x:a,y:n}=(0,Ee.c)(se,{canvasWidth:e.clientWidth,canvasHeight:e.clientHeight,scaleRange:h?Ke:void 0});Xe.transform((0,be.c)(e),new we.O(t,a,n)),j(!0)}}),[_,se,Ke,h,Xe]);var Ve=(0,he.useMemo)((()=>"".concat((0,ke.uniqueId)("diagram-"),"-")),[]),_e="".concat(Ve,"line-arrow-"),je="".concat(Ve,"mask-"),qe="".concat(Ve,"active-line-");(0,he.useEffect)((()=>{P((e=>(0,De.c)(e,oe,K.current)))}),[oe]);var[Fe,Ge]=ve().useState(new Map);return(0,he.useEffect)((()=>{if(T){(0,Pe.c)(A,T);var e=new ye.c((()=>{Ge((0,Ye.E)(A,T))}));for(var t of T.values())e.observe(t);return()=>{e.disconnect()}}}),[L,T,A]),"dagre"!==a&&"force"!==a?ve().createElement("div",null,'Diagram layout not supported: "'.concat(a,'"')):ve().createElement("div",{className:me()("diagram",{ready:x&&_,grabbing:I,pannable:p}),tabIndex:-1,ref:X},ve().createElement("svg",{width:"100%",height:"100%",className:"lines"},ve().createElement("defs",null,ie.map(((e,t)=>{var{type:a,strokeColor:n}=e;return ve().createElement(Se.y,{key:t,id:"".concat(_e).concat(t),type:a,strokeColor:n})})),[...Fe].map((e=>{var[t,a]=e;return ve().createElement(Re.g,{key:t,lineId:t,rects:a,maskPrefix:je,renderedLineLabels:A})})),ve().createElement("marker",{id:"".concat(qe,"start"),viewBox:"0 0 8 8",refX:4,refY:4,markerWidth:8,markerHeight:8,orient:"auto"},ve().createElement("path",{d:"M 0.5 0.5 H 7.5 V 7.5 H 0.5 Z",stroke:"var(--palette-gray-7)",strokeWidth:1,fill:"var(--palette-gray-1)"})),ve().createElement("marker",{id:"".concat(qe,"end"),viewBox:"0 0 14 8",refX:3,refY:4,markerWidth:14,markerHeight:8,orient:"auto"},ve().createElement("path",{d:"M 0.5 1.5 L 5.5 4 L 0.5 6.5 z",stroke:"var(--palette-blue-3)",strokeWidth:1,fill:"var(--palette-blue-3)"}),ve().createElement("path",{d:"M 6.5 0.5 H 13.5 V 7.5 H 6.5 Z",stroke:"var(--palette-gray-7)",strokeWidth:1,fill:"var(--palette-gray-1)"}))),ve().createElement("g",{transform:"translate(".concat(H.x," ").concat(H.y,") scale(").concat(H.k,")")},oe.map((e=>ve().createElement(ze.k,{key:e.line.$id,line:e,linePaths:K.current,lineMaskRects:Fe,maskPrefix:je,markerPrefix:_e,activeLineMarkerPrefix:qe,active:"edge"===(null==de?void 0:de.type)&&de.edge.source===e.edge.source&&de.edge.target===e.edge.target,activeRelated:"node"===(null==de?void 0:de.type)&&(e.edge.source===de.nodeId||e.edge.target===de.nodeId),onLineClick:k,onLineDoubleClick:y}))))),ve().createElement("div",{className:me()("line-labels",{ready:S}),style:{left:H.x,top:H.y,transform:"scale(".concat(H.k,")")}},ve().createElement(Ne.Ar,{labels:re,onRendered:Ie})),ve().createElement("div",{className:"nodes",ref:V,style:{left:H.x,top:H.y,transform:"scale(".concat(H.k,")")}},ve().createElement(Me._,{nodes:n,nodeBricks:i,onRendered:fe})),ve().createElement(Le.E,{connectLineState:U,connectLineTo:Z,markerPrefix:_e}))}ie=Ct,({e:[s,o,d,v,g,w,m,y,x,W,N,S,L,T,A,P,I,H,Y,K,V,_,j,F,G,Z,U,J,Q,te,ae,ne,n],c:[re,l]}=(0,de.c)(ie,[[r,1,"layout"],[c,1,"nodes"],[u,1,"edges"],[h,1,"nodeBricks"],[p,1,"lines"],[b,1,"layoutOptions"],[f,1,"activeTarget"],[k,1,"disableKeyboardAction"],[M,1,"connectNodes"],[E,1,"dragNodes"],[C,1,"zoomable"],[z,1,"scrollable"],[R,1,"pannable"],[D,1,"scaleRange"],[B,1,"activeTargetChangeEvent",e=>(0,ue.c)(e,rt),(e,t)=>(0,oe.c)(e,rt,t)],[O,1,"nodeDelete",e=>(0,ue.c)(e,ot),(e,t)=>(0,oe.c)(e,ot,t)],[X,1,"edgeDelete",e=>(0,ue.c)(e,ht),(e,t)=>(0,oe.c)(e,ht,t)],[q,1,"lineClick",e=>(0,ue.c)(e,gt),(e,t)=>(0,oe.c)(e,gt,t)],[$,1,"lineDoubleClick",e=>(0,ue.c)(e,ft),(e,t)=>(0,oe.c)(e,ft,t)],[ee,1,"connectNodes",e=>(0,ue.c)(e,yt),(e,t)=>(0,oe.c)(e,yt,t)],[le,2,"callOnLineLabel"]],i,0,(e=>Wt.has((0,ce.c)(e))),ge.ReactNextElement)),l();var Yt,Kt,Xt,Vt,_t,jt,qt,Ft,Gt,Zt,$t,Ut,Jt,Qt,ea,ta,aa,na,la=a(7518),{defineElement:ia,property:ra,event:sa,method:ca}=(0,pe.createDecorators)(),oa=(0,he.forwardRef)(Ea);Xt=[ia("diagram.editable-label",{styleTexts:[la.c]})],Vt=ra(),jt=ra({render:!1}),Ft=sa({type:"label.editing.change"}),Ut=sa({type:"label.change"}),ta=ca();var ua=new WeakMap,da=new WeakMap,ha=new WeakMap,va=new WeakMap,pa=new WeakMap,ga=new WeakMap,ba=new WeakMap,wa=new WeakMap,fa=new WeakMap;class ma extends ge.ReactNextElement{constructor(){super(...arguments),(0,se.c)(this,ba,{get:xa,set:Ma}),(0,se.c)(this,va,{get:ya,set:ka}),(0,se.c)(this,ua,{writable:!0,value:(Yt(this),_t(this))}),(0,se.c)(this,da,{writable:!0,value:qt(this)}),(0,se.c)(this,ha,{writable:!0,value:Gt(this)}),(0,se.c)(this,pa,{writable:!0,value:e=>{(0,ue.c)(this,va).emit(e)}}),(0,se.c)(this,ga,{writable:!0,value:Jt(this)}),(0,se.c)(this,wa,{writable:!0,value:e=>{(0,ue.c)(this,ba).emit(e)}}),(0,se.c)(this,fa,{writable:!0,value:(0,he.createRef)()})}get label(){return(0,ue.c)(this,ua)}set label(e){(0,oe.c)(this,ua,e)}get type(){return(0,ue.c)(this,da)}set type(e){(0,oe.c)(this,da,e)}enableEditing(){var e;null===(e=(0,ue.c)(this,fa).current)||void 0===e||e.enableEditing()}render(){return ve().createElement(oa,{ref:(0,ue.c)(this,fa),label:this.label,onLabelEditingChange:(0,ue.c)(this,pa),onLabelChange:(0,ue.c)(this,wa)})}}function ka(e){$t(this,e)}function ya(){return Zt(this)}function Ma(e){ea(this,e)}function xa(){return Qt(this)}function Ea(e,t){var{label:a,onLabelChange:n,onLabelEditingChange:l}=e,i=null!=a?a:"",[r,s]=(0,he.useState)(i),[c,o]=(0,he.useState)(!1),u=(0,he.useRef)(!1),[d,h]=(0,he.useState)(!1),v=(0,he.useRef)(null);(0,he.useImperativeHandle)(t,(()=>({enableEditing(){o(!0)}}))),(0,he.useEffect)((()=>{s(i)}),[i]);var p=(0,he.useCallback)((e=>{e.preventDefault(),e.stopPropagation(),o(!0)}),[]);(0,he.useEffect)((()=>{var e,t;c&&(null===(e=v.current)||void 0===e||e.focus({preventScroll:!0}),null===(t=v.current)||void 0===t||t.select())}),[c]),(0,he.useEffect)((()=>{u.current?null==l||l(c):u.current=!0}),[c,l]);var g=(0,he.useCallback)((e=>{s(e.target.value)}),[]),b=(0,he.useCallback)((e=>{var t,a=e.key||e.keyCode||e.which;"Enter"!==a&&13!==a||null===(t=v.current)||void 0===t||t.blur()}),[]),w=(0,he.useCallback)((()=>{o(!1),h(!0)}),[]);(0,he.useEffect)((()=>{d&&(null==n||n(r),h(!1))}),[r,n,d]);var f=(0,he.useCallback)((e=>{e.stopPropagation()}),[]);return ve().createElement("div",{className:me()("label",{editing:c,empty:!r}),onDoubleClick:f,onMouseDown:f},ve().createElement("input",{className:"label-input",value:r,ref:v,onChange:g,onKeyDown:b,onBlur:w}),ve().createElement("div",{className:"label-text",onDoubleClick:p},r))}aa=ma,({e:[_t,qt,Gt,Zt,$t,Jt,Qt,ea,Yt],c:[na,Kt]}=(0,de.c)(aa,[[Vt,1,"label"],[jt,1,"type"],[Ft,1,"labelEditingChange",e=>(0,ue.c)(e,ha),(e,t)=>(0,oe.c)(e,ha,t)],[Ut,1,"labelChange",e=>(0,ue.c)(e,ga),(e,t)=>(0,oe.c)(e,ga,t)],[ta,2,"enableEditing"]],Xt,0,(e=>fa.has((0,ce.c)(e))),ge.ReactNextElement)),Kt();var Wa,Ca,Na,za,Sa,Ra,La,Da,Ta,Ba,Aa,Pa,Ia,Oa,Ha,Ya,Ka,Xa,Va,_a,ja,qa,Fa,Ga,Za,$a,Ua,Ja,Qa,en,tn,an,nn,ln,rn,sn,cn,on,un,dn,hn,vn,pn,gn,bn,wn,fn,mn,kn,yn,Mn,xn,En,Wn,Cn,Nn,zn,Sn,Rn,Ln,Dn,Tn=a(4412),Bn=a(640),An=a(8944),Pn=a(4516),In=a(3876),On=a(7181),Hn=a(4552),Yn=a(6876),Kn=a(5776),Xn=a(7584),Vn=a(8044),_n=a(7876),jn=a(3788),qn=a(2872),Fn=["size","useBrick"],Gn=(0,Pn.unwrapProvider)("basic.lock-body-scroll"),{defineElement:Zn,property:$n,method:Un,event:Jn}=(0,pe.createDecorators)(),Qn=ve().forwardRef($l);Na=[Zn("eo-draw-canvas",{styleTexts:[Xn.c]})],za=$n({attribute:!1}),Ra=$n({attribute:!1}),Da=$n({attribute:!1}),Ba=$n({attribute:!1}),Pa=$n({attribute:!1}),Oa=$n({type:Boolean}),Ya=$n({type:Boolean}),Xa=$n({type:Boolean}),_a=$n({attribute:!1}),qa=Jn({type:"activeTarget.change"}),$a=Jn({type:"node.move"}),en=Jn({type:"cell.move"}),ln=Jn({type:"cell.resize"}),on=Jn({type:"node.delete"}),vn=Jn({type:"cell.delete"}),wn=Jn({type:"cell.contextmenu"}),yn=Jn({type:"scale.change"}),Wn=Un(),Cn=Un(),Nn=Un(),zn=Un(),Sn=Un(),Rn=Un();var el=new WeakMap,tl=new WeakMap,al=new WeakMap,nl=new WeakMap,ll=new WeakMap,il=new WeakMap,rl=new WeakMap,sl=new WeakMap,cl=new WeakMap,ol=new WeakMap,ul=new WeakMap,dl=new WeakMap,hl=new WeakMap,vl=new WeakMap,pl=new WeakMap,gl=new WeakMap,bl=new WeakMap,wl=new WeakMap,fl=new WeakMap,ml=new WeakMap,kl=new WeakMap,yl=new WeakMap,Ml=new WeakMap,xl=new WeakMap,El=new WeakMap,Wl=new WeakMap,Cl=new WeakMap,Nl=new WeakMap,zl=new WeakMap,Sl=new WeakMap,Rl=new WeakMap,Ll=new WeakMap,Dl=new WeakMap;class Tl extends ge.ReactNextElement{constructor(){super(...arguments),(0,se.c)(this,Rl,{get:Zl,set:Gl}),(0,se.c)(this,Nl,{get:Fl,set:ql}),(0,se.c)(this,El,{get:jl,set:_l}),(0,se.c)(this,Ml,{get:Vl,set:Xl}),(0,se.c)(this,ml,{get:Kl,set:Yl}),(0,se.c)(this,bl,{get:Hl,set:Ol}),(0,se.c)(this,pl,{get:Il,set:Pl}),(0,se.c)(this,ul,{get:Al,set:Bl}),(0,se.c)(this,el,{writable:!0,value:(Wa(this),Sa(this))}),(0,se.c)(this,tl,{writable:!0,value:La(this,[20,20])}),(0,se.c)(this,al,{writable:!0,value:Ta(this)}),(0,se.c)(this,nl,{writable:!0,value:Aa(this)}),(0,se.c)(this,ll,{writable:!0,value:Ia(this)}),(0,se.c)(this,il,{writable:!0,value:Ha(this,!0)}),(0,se.c)(this,rl,{writable:!0,value:Ka(this,!0)}),(0,se.c)(this,sl,{writable:!0,value:Va(this,!0)}),(0,se.c)(this,cl,{writable:!0,value:ja(this)}),(0,se.c)(this,ol,{writable:!0,value:Fa(this)}),(0,se.c)(this,dl,{writable:!0,value:e=>{(0,ue.c)(this,ul).emit(e)}}),(0,se.c)(this,hl,{writable:!0,value:e=>{(0,Hn.M)(e,this.activeTarget)||(this.activeTarget=e)}}),(0,se.c)(this,vl,{writable:!0,value:Ua(this)}),(0,se.c)(this,gl,{writable:!0,value:tn(this)}),(0,se.c)(this,wl,{writable:!0,value:e=>{(0,ue.c)(this,bl).emit(e),"node"===e.type&&(0,ue.c)(this,pl).emit(e)}}),(0,se.c)(this,fl,{writable:!0,value:rn(this)}),(0,se.c)(this,kl,{writable:!0,value:e=>{(0,ue.c)(this,ml).emit(e)}}),(0,se.c)(this,yl,{writable:!0,value:un(this)}),(0,se.c)(this,xl,{writable:!0,value:pn(this)}),(0,se.c)(this,Wl,{writable:!0,value:e=>{(0,ue.c)(this,El).emit(e),"node"===e.type&&(0,ue.c)(this,Ml).emit(e)}}),(0,se.c)(this,Cl,{writable:!0,value:fn(this)}),(0,se.c)(this,zl,{writable:!0,value:e=>{(0,ue.c)(this,Nl).emit(e)}}),(0,se.c)(this,Sl,{writable:!0,value:Mn(this)}),(0,se.c)(this,Ll,{writable:!0,value:e=>{(0,ue.c)(this,Rl).emit(e)}}),(0,se.c)(this,Dl,{writable:!0,value:(0,he.createRef)()})}get cells(){return(0,ue.c)(this,el)}set cells(e){(0,oe.c)(this,el,e)}get defaultNodeSize(){return(0,ue.c)(this,tl)}set defaultNodeSize(e){(0,oe.c)(this,tl,e)}get defaultNodeBricks(){return(0,ue.c)(this,al)}set defaultNodeBricks(e){(0,oe.c)(this,al,e)}get defaultEdgeLines(){return(0,ue.c)(this,nl)}set defaultEdgeLines(e){(0,oe.c)(this,nl,e)}get activeTarget(){return(0,ue.c)(this,ll)}set activeTarget(e){(0,oe.c)(this,ll,e)}get zoomable(){return(0,ue.c)(this,il)}set zoomable(e){(0,oe.c)(this,il,e)}get scrollable(){return(0,ue.c)(this,rl)}set scrollable(e){(0,oe.c)(this,rl,e)}get pannable(){return(0,ue.c)(this,sl)}set pannable(e){(0,oe.c)(this,sl,e)}get scaleRange(){return(0,ue.c)(this,cl)}set scaleRange(e){(0,oe.c)(this,cl,e)}dropNode(e){var t=this;return(0,An.c)((function*(){var a,n,{id:l,position:i,size:r,data:s,useBrick:c}=e;if(null===(a=(n=document).elementsFromPoint)||void 0===a||null===(a=a.call(n,i[0],i[1]))||void 0===a?void 0:a.includes(t)){var o,u,d,h=t.getBoundingClientRect(),v=(0,ue.c)(t,Dl).current.getTransform(),p={type:"node",id:l,view:{x:(i[0]-h.left-v.x)/v.k,y:(i[1]-h.top-v.y)/v.k,width:null!==(o=null==r?void 0:r[0])&&void 0!==o?o:t.defaultNodeSize[0],height:null!==(u=null==r?void 0:r[1])&&void 0!==u?u:t.defaultNodeSize[0]},data:s,useBrick:c};return null===(d=(0,ue.c)(t,Dl).current)||void 0===d||d.dropNode(p),p}return null}))()}dropDecorator(e){var t=this;return(0,An.c)((function*(){var a,n,{position:l,decorator:i}=e;if(null===(a=(n=document).elementsFromPoint)||void 0===a||null===(a=a.call(n,l[0],l[1]))||void 0===a?void 0:a.includes(t)){var r,s=t.getBoundingClientRect(),c=(0,ue.c)(t,Dl).current.getTransform(),o={type:"decorator",decorator:i,id:"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,(function(e){var t=16*Math.random()|0;return("x"==e?t:3&t|8).toString(16)})),view:{x:(l[0]-s.left-c.x)/c.k,y:(l[1]-s.top-c.y)/c.k,width:100,height:60}};return null===(r=(0,ue.c)(t,Dl).current)||void 0===r||r.dropDecorator(o),o}return null}))()}addNodes(e){var t=this;return(0,An.c)((function*(){var a,n,l,i,r,s,c;if(0===e.length)return[];var o=e[0],u=null!==(a=null===(n=o.size)||void 0===n?void 0:n[0])&&void 0!==a?a:null===(l=t.defaultNodeSize)||void 0===l?void 0:l[0],d=null!==(i=null===(r=o.size)||void 0===r?void 0:r[1])&&void 0!==i?i:null===(s=t.defaultNodeSize)||void 0===s?void 0:s[1],h=Math.floor(600/(d+20)),v=e.map(((e,a)=>{var n,l,i,r,{size:s,useBrick:c}=e,o=(0,Bn.c)(e,Fn);return(0,Tn.c)((0,Tn.c)({},o),{},{type:"node",view:{x:Math.floor(a/h)*(u+20)+20,y:a%h*(d+20)+20,width:null!==(n=null==s?void 0:s[0])&&void 0!==n?n:null===(l=t.defaultNodeSize)||void 0===l?void 0:l[0],height:null!==(i=null==s?void 0:s[1])&&void 0!==i?i:null===(r=t.defaultNodeSize)||void 0===r?void 0:r[0]},useBrick:c})}));return null===(c=(0,ue.c)(t,Dl).current)||void 0===c||c.addNodes(v),v}))()}addEdge(e){var t=this;return(0,An.c)((function*(){var a,{source:n,target:l,data:i}=e,r={type:"edge",source:n,target:l,data:i};return null===(a=(0,ue.c)(t,Dl).current)||void 0===a||a.addEdge(r),r}))()}manuallyConnectNodes(e){return(0,ue.c)(this,Dl).current.manuallyConnectNodes(e)}updateCells(e,t){var a=this;return(0,An.c)((function*(){var{cells:n,updated:l}=(0,qn.s)((0,Tn.c)((0,Tn.c)({},t),{},{cells:e,defaultNodeSize:a.defaultNodeSize}));return(0,ue.c)(a,Dl).current.updateCells(n),{updated:l}}))()}disconnectedCallback(){super.disconnectedCallback(),Gn(this,!1)}render(){return ve().createElement(Qn,{host:this,ref:(0,ue.c)(this,Dl),cells:this.cells,defaultNodeSize:this.defaultNodeSize,defaultNodeBricks:this.defaultNodeBricks,defaultEdgeLines:this.defaultEdgeLines,activeTarget:this.activeTarget,zoomable:this.zoomable,scrollable:this.scrollable,pannable:this.pannable,scaleRange:this.scaleRange,onActiveTargetChange:(0,ue.c)(this,dl),onSwitchActiveTarget:(0,ue.c)(this,hl),onCellMove:(0,ue.c)(this,wl),onCellResize:(0,ue.c)(this,kl),onCellDelete:(0,ue.c)(this,Wl),onCellContextMenu:(0,ue.c)(this,zl),onScaleChange:(0,ue.c)(this,Ll)})}}function Bl(e){Za(this,e)}function Al(){return Ga(this)}function Pl(e){Qa(this,e)}function Il(){return Ja(this)}function Ol(e){nn(this,e)}function Hl(){return an(this)}function Yl(e){cn(this,e)}function Kl(){return sn(this)}function Xl(e){hn(this,e)}function Vl(){return dn(this)}function _l(e){bn(this,e)}function jl(){return gn(this)}function ql(e){kn(this,e)}function Fl(){return mn(this)}function Gl(e){En(this,e)}function Zl(){return xn(this)}function $l(e,t){var{host:a,cells:n,defaultNodeSize:l,defaultNodeBricks:i,defaultEdgeLines:r,activeTarget:s,zoomable:c,scrollable:o,pannable:u,scaleRange:d,onActiveTargetChange:h,onSwitchActiveTarget:v,onCellMove:p,onCellResize:g,onCellDelete:b,onCellContextMenu:w,onScaleChange:f}=e,[{cells:m},k]=(0,he.useReducer)(In.M,n,(e=>({cells:(0,_n.S)(e,{defaultNodeSize:l})}))),y=(0,he.useRef)(null),M=(0,he.useRef)(null),x=(0,he.useRef)(null),[E,W]=(0,he.useState)(!1),[C,N]=(0,he.useState)({k:1,x:0,y:0}),[z,S]=(0,he.useState)(!1);(0,he.useEffect)((()=>{f(C.k)}),[f,C.k]);var[R,L]=(0,he.useState)(null),D=(0,he.useMemo)((()=>null!=d?d:[.5,2]),[d]),T=(0,he.useMemo)((()=>(0,we.AT)()),[]);(0,he.useEffect)((()=>{var e=!1;T.scaleExtent(c?D:[1,1]).on("start",(()=>{e=!1,W(!0)})).on("zoom",(t=>{e=!0,N(t.transform)})).on("end",(()=>{W(!1),e||null==v||v(null)}))}),[v,D,c,T]),(0,he.useEffect)((()=>{var e=y.current;if(e){var t=(0,be.c)(e),a=()=>{t.on(".zoom",null).on(".zoom.custom",null).on("wheel",null)};if(c||o||u)return(c||o)&&t.on("wheel.zoom.custom",(e=>{e.ctrlKey||(e.stopImmediatePropagation(),o&&(e.preventDefault(),T.translateBy(t,e.wheelDeltaX/5,e.wheelDeltaY/5)))})),t.call(T).on("wheel",(e=>e.preventDefault())).on("dblclick.zoom",null).on("mousedown.zoom",null),u||t.on("touchstart.zoom",null).on("touchmove.zoom",null).on("touchend.zoom",null),a;a()}}),[u,o,c,T]),(0,he.useEffect)((()=>{var e=y.current;if(e&&!z){var{k:t,x:a,y:n}=(0,jn.c)(m,{canvasWidth:e.clientWidth,canvasHeight:e.clientHeight,scaleRange:c?D:void 0});T.transform((0,be.c)(e),new we.O(t,a,n)),S(!0)}}),[m,z,D,c,T]),(0,he.useImperativeHandle)(t,(()=>({dropNode(e){k({type:"drop-node",payload:e})},dropDecorator(e){k({type:"drop-decorator",payload:e})},addNodes(e){k({type:"add-nodes",payload:e})},addEdge(e){k({type:"add-edge",payload:e})},updateCells(e){k({type:"update-cells",payload:e})},getTransform:()=>C,manuallyConnectNodes(e){var t=m.find((t=>(0,On.G4)(t)&&t.id===e));if(t){var a=y.current.getBoundingClientRect();return L({source:t,from:[t.view.x+t.view.width/2,t.view.y+t.view.height/2],offset:[a.left,a.top]}),new Promise(((e,t)=>{x.current={resolve:e,reject:t}}))}return Promise.reject(null)}})),[m,C]);var B=(0,he.useCallback)(((e,t)=>{for(var a,n=0;n<m.length;n++){var l=m[n];if((0,On.G4)(l)&&l.id!==e.source.id&&l.view.x<t[0]&&l.view.x+l.view.width>t[0]&&l.view.y<t[1]&&l.view.y+l.view.height>t[1]){var i;null===(i=x.current)||void 0===i||i.resolve({source:e.source,target:l});break}}null===(a=x.current)||void 0===a||a.reject(null),L(null)}),[m]);(0,he.useEffect)((()=>{Gn(a,!!R)}),[R,a]);var A=null!=s?s:null,[P,I]=(0,he.useState)(A);(0,he.useEffect)((()=>{I((e=>(0,Hn.M)(e,A)?e:A))}),[A]);var O=(0,he.useRef)(!1);(0,he.useEffect)((()=>{O.current?h(P):O.current=!0}),[P,h]),(0,he.useEffect)((()=>{if(P){var e=e=>{e.composedPath().indexOf(M.current)<=0&&I(null)};return document.addEventListener("click",e),()=>{document.removeEventListener("click",e)}}}),[P]),(0,he.useEffect)((()=>{var e=y.current,t=e=>{var t=(0,Yn.Y)(e,{cells:m,activeTarget:P});"delete-cell"===(null==t?void 0:t.action)&&b(t.cell)};return null==e||e.addEventListener("keydown",t),()=>{null==e||e.removeEventListener("keydown",t)}}),[P,m,b]);var H=(0,he.useMemo)((()=>"".concat((0,ke.uniqueId)("diagram-"),"-")),[]),Y="".concat(H,"line-arrow-"),K="".concat(Y,"1"),X=(0,he.useCallback)((e=>{k({type:"move-cell",payload:e})}),[]),V=(0,he.useCallback)((e=>{k({type:"move-cell",payload:e}),p(e)}),[p]),_=(0,he.useCallback)((e=>{k({type:"resize-cell",payload:e})}),[]),j=(0,he.useCallback)((e=>{k({type:"resize-cell",payload:e}),g(e)}),[g]);return ve().createElement("svg",{width:"100%",height:"100%",ref:y,className:me()("root",{grabbing:E,pannable:u}),tabIndex:-1},ve().createElement("defs",null,ve().createElement(Se.y,{id:K,type:"arrow",strokeColor:"gray"})),ve().createElement("g",{transform:"translate(".concat(C.x," ").concat(C.y,") scale(").concat(C.k,")")},ve().createElement("g",{className:"cells",ref:M},m.map((e=>ve().createElement(Kn.s,{key:"".concat(e.type,":").concat("edge"===e.type?"".concat(e.source,"~").concat(e.target):e.id),cell:e,cells:m,defaultNodeBricks:i,defaultEdgeLines:r,transform:C,markerEnd:K,active:(0,Hn.M)(P,e),onCellMoving:X,onCellMoved:V,onCellResizing:_,onCellResized:j,onSwitchActiveTarget:v,onCellContextMenu:w})))),ve().createElement(Vn.E,{connectLineState:R,transform:C,markerEnd:K,onConnect:B})))}Ln=Tl,({e:[Sa,La,Ta,Aa,Ia,Ha,Ka,Va,ja,Fa,Ga,Za,Ua,Ja,Qa,tn,an,nn,rn,sn,cn,un,dn,hn,pn,gn,bn,fn,mn,kn,Mn,xn,En,Wa],c:[Dn,Ca]}=(0,de.c)(Ln,[[za,1,"cells"],[Ra,1,"defaultNodeSize"],[Da,1,"defaultNodeBricks"],[Ba,1,"defaultEdgeLines"],[Pa,1,"activeTarget"],[Oa,1,"zoomable"],[Ya,1,"scrollable"],[Xa,1,"pannable"],[_a,1,"scaleRange"],[qa,1,"activeTargetChangeEvent",e=>(0,ue.c)(e,ol),(e,t)=>(0,oe.c)(e,ol,t)],[$a,1,"nodeMoveEvent",e=>(0,ue.c)(e,vl),(e,t)=>(0,oe.c)(e,vl,t)],[en,1,"cellMoveEvent",e=>(0,ue.c)(e,gl),(e,t)=>(0,oe.c)(e,gl,t)],[ln,1,"cellResizeEvent",e=>(0,ue.c)(e,fl),(e,t)=>(0,oe.c)(e,fl,t)],[on,1,"nodeDelete",e=>(0,ue.c)(e,yl),(e,t)=>(0,oe.c)(e,yl,t)],[vn,1,"cellDelete",e=>(0,ue.c)(e,xl),(e,t)=>(0,oe.c)(e,xl,t)],[wn,1,"cellContextMenu",e=>(0,ue.c)(e,Cl),(e,t)=>(0,oe.c)(e,Cl,t)],[yn,1,"scaleChange",e=>(0,ue.c)(e,Sl),(e,t)=>(0,oe.c)(e,Sl,t)],[Wn,2,"dropNode"],[Cn,2,"dropDecorator"],[Nn,2,"addNodes"],[zn,2,"addEdge"],[Sn,2,"manuallyConnectNodes"],[Rn,2,"updateCells"]],Na,0,(e=>Dl.has((0,ce.c)(e))),ge.ReactNextElement)),Ca();var Ul,Jl,Ql,ei,ti,ai,ni,li,ii,ri,si,ci,oi,ui,di,hi,vi,pi,gi,bi,wi,fi,mi,ki=a(3704),{defineElement:yi,property:Mi,event:xi}=(0,pe.createDecorators)();Ql=[yi("diagram.experimental-node",{styleTexts:[ki.c]})],ei=Mi(),ai=Mi({type:String,render:!1}),li=Mi({type:String}),ri=xi({type:"drag.start"}),ui=xi({type:"drag.move"}),pi=xi({type:"drag.end"});var Ei=new WeakMap,Wi=new WeakMap,Ci=new WeakMap,Ni=new WeakMap,zi=new WeakMap,Si=new WeakMap,Ri=new WeakMap,Li=new WeakMap,Di=new WeakMap,Ti=new WeakMap,Bi=new WeakMap,Ai=new WeakMap;class Pi extends ge.ReactNextElement{constructor(){super(...arguments),(0,se.c)(this,Bi,{get:Xi,set:Ki}),(0,se.c)(this,Li,{get:Yi,set:Hi}),(0,se.c)(this,zi,{get:Oi,set:Ii}),(0,se.c)(this,Ei,{writable:!0,value:(Ul(this),ti(this))}),(0,se.c)(this,Wi,{writable:!0,value:ni(this)}),(0,se.c)(this,Ci,{writable:!0,value:ii(this)}),(0,se.c)(this,Ni,{writable:!0,value:si(this)}),(0,se.c)(this,Si,{writable:!0,value:e=>{(0,ue.c)(this,zi).emit(e)}}),(0,se.c)(this,Ri,{writable:!0,value:di(this)}),(0,se.c)(this,Di,{writable:!0,value:e=>{(0,ue.c)(this,Li).emit(e)}}),(0,se.c)(this,Ti,{writable:!0,value:gi(this)}),(0,se.c)(this,Ai,{writable:!0,value:e=>{(0,ue.c)(this,Bi).emit(e)}})}get usage(){return(0,ue.c)(this,Ei)}set usage(e){(0,oe.c)(this,Ei,e)}get status(){return(0,ue.c)(this,Wi)}set status(e){(0,oe.c)(this,Wi,e)}get decorator(){return(0,ue.c)(this,Ci)}set decorator(e){(0,oe.c)(this,Ci,e)}render(){return ve().createElement(Vi,{usage:this.usage,onDragStart:(0,ue.c)(this,Si),onDragMove:(0,ue.c)(this,Di),onDragEnd:(0,ue.c)(this,Ai)})}}function Ii(e){oi(this,e)}function Oi(){return ci(this)}function Hi(e){vi(this,e)}function Yi(){return hi(this)}function Ki(e){wi(this,e)}function Xi(){return bi(this)}function Vi(e){var{usage:t,onDragStart:a,onDragMove:n,onDragEnd:l}=e,i=(0,he.useCallback)((e=>{if("library"===t){e.stopPropagation(),e.preventDefault();var i=[e.clientX,e.clientY],r=!1,s=e=>{r||(r=(e.clientX-i[0])**2+(e.clientY-i[1])**2>=9)&&(null==a||a([e.clientX,e.clientY])),r&&(null==n||n([e.clientX,e.clientY]))},c=e=>{document.removeEventListener("mousemove",s),document.removeEventListener("mouseup",c),r&&(null==l||l([e.clientX,e.clientY]))};document.addEventListener("mousemove",s),document.addEventListener("mouseup",c)}}),[l,n,a,t]);return ve().createElement("div",{onMouseDown:i},ve().createElement("slot",null))}fi=Pi,({e:[ti,ni,ii,si,ci,oi,di,hi,vi,gi,bi,wi,Ul],c:[mi,Jl]}=(0,de.c)(fi,[[ei,1,"usage"],[ai,1,"status"],[li,1,"decorator"],[ri,1,"dragStartEvent",e=>(0,ue.c)(e,Ni),(e,t)=>(0,oe.c)(e,Ni,t)],[ui,1,"dragMoveEvent",e=>(0,ue.c)(e,Ri),(e,t)=>(0,oe.c)(e,Ri,t)],[pi,1,"dragEndEvent",e=>(0,ue.c)(e,Ti),(e,t)=>(0,oe.c)(e,Ti,t)]],Ql,0,(e=>Ai.has((0,ce.c)(e))),ge.ReactNextElement)),Jl()},7518:(e,t,a)=>{a.d(t,{c:()=>s});var n=a(8304),l=a.n(n),i=a(1849),r=a.n(i)()(l());r.push([e.id,':host{display:block;--local-label-line-height:inherit;--local-label-font-size:inherit;--local-label-color:inherit;--local-label-font-weight:inherit}:host([hidden]){display:none}:host([type="line"]){--local-label-line-height:18px;--local-label-font-size:11px;--local-label-color:var(--color-secondary-text);--local-label-font-weight:400}*{box-sizing:border-box}.label{max-width:168px;margin:-3px}.label-text,\n.label-input{width:100%;height:24px;padding:3px;border:none;line-height:var(--local-label-line-height);font-size:var(--local-label-font-size);color:var(--local-label-color);font-weight:var(--local-label-font-weight);text-align:center;font-family:inherit;cursor:text;-webkit-user-select:text;-moz-user-select:text;user-select:text}.label-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.label.editing .label-text,\n.label.empty:not(.editing) .label-text,\n.label:not(.editing) .label-input{display:none}',""]);const s=r.toString()},3704:(e,t,a)=>{a.d(t,{c:()=>s});var n=a(8304),l=a.n(n),i=a(1849),r=a.n(i)()(l());r.push([e.id,'*{box-sizing:border-box}:host{display:block;border:1px solid var(--palette-gray-5);cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none}:host([hidden]){display:none}:host([usage="dragging"]){opacity:0.75;position:fixed}:host(:not([usage="library"])){background:var(--palette-gray-3);width:60px;height:60px}:host([usage="library"]){width:180px;height:30px;margin-bottom:10px}div{width:100%;height:100%;display:flex;align-items:center;justify-content:center}:host([status="highlighted"]){color:var(--palette-blue-5);background:var(--palette-blue-1);border-color:1px solid var(--palette-blue-4)}:host([status="faded"]){opacity:0.3}:host([decorator="area"]){width:100px;height:60px;background:rgba(119,141,195,0.1);border:none}:host([decorator="text"]){width:auto;height:auto;background:none;border:none}',""]);const s=r.toString()}}]);
|
|
2
|
-
//# sourceMappingURL=5676.68d9676c.js.map
|