@likec4/diagram 1.2.2 → 1.4.0

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.
Files changed (69) hide show
  1. package/dist/LikeC4Diagram.d.ts +1 -1
  2. package/dist/LikeC4Diagram.props.d.ts +27 -4
  3. package/dist/index.mjs +1543 -1346
  4. package/dist/state/DiagramContext.d.ts +2353 -264
  5. package/dist/state/diagramStore.d.ts +2360 -268
  6. package/dist/state/index.d.ts +0 -1
  7. package/dist/state/useDiagramStore.d.ts +3 -2534
  8. package/dist/state/useNavigationHistory.d.ts +5 -0
  9. package/dist/style.css +194 -131
  10. package/dist/theme.css.d.ts +5 -1
  11. package/dist/ui/BackwardForwardPanel.css.d.ts +1 -0
  12. package/dist/ui/BackwardForwardPanel.d.ts +1 -0
  13. package/dist/ui/DiagramTitlePanel.css.d.ts +1 -1
  14. package/dist/xyflow/XYFlow.d.ts +2 -1
  15. package/dist/xyflow/XYFlowEvents.d.ts +4 -4
  16. package/dist/xyflow/XYFlowInner.d.ts +2 -1
  17. package/dist/xyflow/const.d.ts +1 -1
  18. package/dist/xyflow/diagram-to-xyflow.d.ts +1 -1
  19. package/dist/xyflow/edges/RelationshipEdge.d.ts +4 -5
  20. package/dist/xyflow/edges/utils.d.ts +4 -2
  21. package/dist/xyflow/hooks/useXYFlow.d.ts +9 -9
  22. package/dist/xyflow/nodes/compound/CompoundNode.css.d.ts +3 -1
  23. package/dist/xyflow/nodes/element/ElementNode.d.ts +1 -1
  24. package/dist/xyflow/nodes/element/element.css.d.ts +1 -0
  25. package/dist/xyflow/nodes/element/index.d.ts +1 -1
  26. package/dist/xyflow/types.d.ts +3 -3
  27. package/dist/xyflow/utils.d.ts +3 -0
  28. package/package.json +18 -17
  29. package/src/LikeC4Diagram.css.ts +15 -5
  30. package/src/LikeC4Diagram.props.ts +33 -5
  31. package/src/LikeC4Diagram.tsx +103 -32
  32. package/src/globals.css.ts +1 -2
  33. package/src/mantine/theme.ts +1 -0
  34. package/src/state/DiagramContext.tsx +3 -4
  35. package/src/state/diagramStore.ts +177 -103
  36. package/src/state/index.ts +0 -1
  37. package/src/state/useDiagramStore.ts +6 -13
  38. package/src/state/useNavigationHistory.ts +39 -0
  39. package/src/theme.css.ts +5 -1
  40. package/src/ui/BackwardForwardPanel.css.ts +22 -0
  41. package/src/ui/BackwardForwardPanel.tsx +59 -0
  42. package/src/ui/DiagramTitlePanel.css.ts +11 -5
  43. package/src/ui/DiagramTitlePanel.tsx +108 -96
  44. package/src/ui/DynamicViewWalkthrough.css.ts +3 -2
  45. package/src/ui/DynamicViewWalkthrough.tsx +36 -17
  46. package/src/ui/OptionsPanel.tsx +28 -19
  47. package/src/ui/options/NodeOptions.tsx +16 -19
  48. package/src/xyflow/FitviewOnDiagramChange.tsx +15 -23
  49. package/src/xyflow/SelectEdgesOnNodeFocus.tsx +3 -6
  50. package/src/xyflow/SyncWithDiagram.tsx +21 -2
  51. package/src/xyflow/XYFlow.tsx +20 -23
  52. package/src/xyflow/XYFlowEvents.tsx +26 -8
  53. package/src/xyflow/XYFlowInner.tsx +10 -6
  54. package/src/xyflow/const.ts +1 -1
  55. package/src/xyflow/diagram-to-xyflow.ts +4 -41
  56. package/src/xyflow/edges/RelationshipEdge.tsx +160 -111
  57. package/src/xyflow/edges/edges.css.ts +41 -26
  58. package/src/xyflow/edges/utils.ts +5 -2
  59. package/src/xyflow/hooks/useLayoutConstraints.ts +19 -4
  60. package/src/xyflow/nodes/compound/CompoundNode.css.ts +45 -37
  61. package/src/xyflow/nodes/compound/CompoundNode.tsx +36 -26
  62. package/src/xyflow/nodes/element/ElementNode.tsx +27 -14
  63. package/src/xyflow/nodes/element/element.css.ts +31 -18
  64. package/src/xyflow/nodes/element/index.ts +1 -1
  65. package/src/xyflow/nodes/shared/NavigateToBtn.tsx +7 -3
  66. package/src/xyflow/types.ts +5 -2
  67. package/src/xyflow/utils.ts +48 -0
  68. package/dist/ui/index.d.ts +0 -2
  69. package/src/ui/index.ts +0 -3
package/dist/state/useDiagramStore.d.ts CHANGED
@@ -1,2538 +1,7 @@
1
+ import { DiagramZustandStore } from './DiagramContext';
1
2
  import { DiagramState } from './diagramStore';
2
3
 
3
4
  declare function useDiagramState<StateSlice = unknown>(selector: (state: DiagramState) => StateSlice, equalityFn?: (a: StateSlice, b: StateSlice) => boolean): StateSlice;
4
- declare function useDiagramStoreApi(): {
5
- getState: () => {
6
- view: import('@likec4/core').DiagramView;
7
- readonly: boolean;
8
- showElementLinks: boolean;
9
- fitViewEnabled: boolean;
10
- fitViewPadding: number;
11
- zoomable: boolean;
12
- pannable: boolean;
13
- nodesDraggable: boolean;
14
- nodesSelectable: boolean;
15
- xyflow: import('..').XYFlowInstance;
16
- initialized: boolean;
17
- xyflowSynced: boolean;
18
- activeDynamicViewStep: number | null;
19
- lastClickedNodeId: string | null;
20
- lastClickedEdgeId: string | null;
21
- focusedNodeId: string | null;
22
- hoveredNodeId: string | null;
23
- hoveredEdgeId: string | null;
24
- dimmed: ReadonlySet<string>;
25
- previousViews: import('@likec4/core').DiagramView[];
26
- lastOnNavigate: {
27
- fromView: import('@likec4/core').ViewID;
28
- toView: import('@likec4/core').ViewID;
29
- element: import('@likec4/core').DiagramNode;
30
- elementCenterScreenPosition: import('@xyflow/system').XYPosition;
31
- positionCorrected: boolean;
32
- } | null;
33
- viewportChanged: boolean;
34
- onChange: import('..').OnChange | null | undefined;
35
- onNavigateTo: import('..').OnNavigateTo | null | undefined;
36
- onNodeClick: import('..').OnNodeClick | null | undefined;
37
- onNodeContextMenu: import('..').OnNodeClick | null | undefined;
38
- onCanvasContextMenu: import('..').OnCanvasClick | null | undefined;
39
- onEdgeClick: import('..').OnEdgeClick | null | undefined;
40
- onEdgeContextMenu: import('..').OnEdgeClick | null | undefined;
41
- onCanvasClick: import('..').OnCanvasClick | null | undefined;
42
- onCanvasDblClick: import('..').OnCanvasClick | null | undefined;
43
- isDynamicView: () => boolean;
44
- updateView: (view: import('@likec4/core').DiagramView) => void;
45
- focusOnNode: (nodeId: string) => void;
46
- setHoveredNode: (nodeId: string | null) => void;
47
- setHoveredEdge: (edgeId: string | null) => void;
48
- setLastClickedNode: (nodeId: string | null) => void;
49
- setLastClickedEdge: (edgeId: string | null) => void;
50
- resetLastClicked: () => void;
51
- getElement: (id: import('@likec4/core').Fqn) => import('@likec4/core').DiagramNode | null;
52
- triggerOnChange: (changes: import('@likec4/core').NonEmptyArray<import("..").Changes.ChangeElementStyle>) => void;
53
- triggerOnNavigateTo: (xynodeId: string, event: import('react').MouseEvent<Element, MouseEvent>) => void;
54
- fitDiagram: (xyStore: {
55
- getState: () => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
56
- source: string;
57
- target: string;
58
- sourceHandle?: string | null;
59
- targetHandle?: string | null;
60
- animated?: boolean;
61
- hidden?: boolean;
62
- deletable?: boolean;
63
- selectable?: boolean;
64
- selected?: boolean;
65
- markerStart?: import('@xyflow/system').EdgeMarkerType;
66
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
67
- zIndex?: number;
68
- ariaLabel?: string;
69
- interactionWidth?: number;
70
- label?: import('react').ReactNode;
71
- labelStyle?: import('react').CSSProperties;
72
- labelShowBg?: boolean;
73
- labelBgStyle?: import('react').CSSProperties;
74
- labelBgPadding?: [number, number];
75
- labelBgBorderRadius?: number;
76
- style?: import('react').CSSProperties;
77
- className?: string;
78
- updatable?: import('@xyflow/react').EdgeUpdatable;
79
- focusable?: boolean;
80
- data: import('..').RelationshipData;
81
- readonly id: string;
82
- readonly type: "relationship";
83
- }>;
84
- setState: (partial: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
85
- source: string;
86
- target: string;
87
- sourceHandle?: string | null;
88
- targetHandle?: string | null;
89
- animated?: boolean;
90
- hidden?: boolean;
91
- deletable?: boolean;
92
- selectable?: boolean;
93
- selected?: boolean;
94
- markerStart?: import('@xyflow/system').EdgeMarkerType;
95
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
96
- zIndex?: number;
97
- ariaLabel?: string;
98
- interactionWidth?: number;
99
- label?: import('react').ReactNode;
100
- labelStyle?: import('react').CSSProperties;
101
- labelShowBg?: boolean;
102
- labelBgStyle?: import('react').CSSProperties;
103
- labelBgPadding?: [number, number];
104
- labelBgBorderRadius?: number;
105
- style?: import('react').CSSProperties;
106
- className?: string;
107
- updatable?: import('@xyflow/react').EdgeUpdatable;
108
- focusable?: boolean;
109
- data: import('..').RelationshipData;
110
- readonly id: string;
111
- readonly type: "relationship";
112
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
113
- source: string;
114
- target: string;
115
- sourceHandle?: string | null;
116
- targetHandle?: string | null;
117
- animated?: boolean;
118
- hidden?: boolean;
119
- deletable?: boolean;
120
- selectable?: boolean;
121
- selected?: boolean;
122
- markerStart?: import('@xyflow/system').EdgeMarkerType;
123
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
124
- zIndex?: number;
125
- ariaLabel?: string;
126
- interactionWidth?: number;
127
- label?: import('react').ReactNode;
128
- labelStyle?: import('react').CSSProperties;
129
- labelShowBg?: boolean;
130
- labelBgStyle?: import('react').CSSProperties;
131
- labelBgPadding?: [number, number];
132
- labelBgBorderRadius?: number;
133
- style?: import('react').CSSProperties;
134
- className?: string;
135
- updatable?: import('@xyflow/react').EdgeUpdatable;
136
- focusable?: boolean;
137
- data: import('..').RelationshipData;
138
- readonly id: string;
139
- readonly type: "relationship";
140
- }>> | ((state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
141
- source: string;
142
- target: string;
143
- sourceHandle?: string | null;
144
- targetHandle?: string | null;
145
- animated?: boolean;
146
- hidden?: boolean;
147
- deletable?: boolean;
148
- selectable?: boolean;
149
- selected?: boolean;
150
- markerStart?: import('@xyflow/system').EdgeMarkerType;
151
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
152
- zIndex?: number;
153
- ariaLabel?: string;
154
- interactionWidth?: number;
155
- label?: import('react').ReactNode;
156
- labelStyle?: import('react').CSSProperties;
157
- labelShowBg?: boolean;
158
- labelBgStyle?: import('react').CSSProperties;
159
- labelBgPadding?: [number, number];
160
- labelBgBorderRadius?: number;
161
- style?: import('react').CSSProperties;
162
- className?: string;
163
- updatable?: import('@xyflow/react').EdgeUpdatable;
164
- focusable?: boolean;
165
- data: import('..').RelationshipData;
166
- readonly id: string;
167
- readonly type: "relationship";
168
- }>) => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
169
- source: string;
170
- target: string;
171
- sourceHandle?: string | null;
172
- targetHandle?: string | null;
173
- animated?: boolean;
174
- hidden?: boolean;
175
- deletable?: boolean;
176
- selectable?: boolean;
177
- selected?: boolean;
178
- markerStart?: import('@xyflow/system').EdgeMarkerType;
179
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
180
- zIndex?: number;
181
- ariaLabel?: string;
182
- interactionWidth?: number;
183
- label?: import('react').ReactNode;
184
- labelStyle?: import('react').CSSProperties;
185
- labelShowBg?: boolean;
186
- labelBgStyle?: import('react').CSSProperties;
187
- labelBgPadding?: [number, number];
188
- labelBgBorderRadius?: number;
189
- style?: import('react').CSSProperties;
190
- className?: string;
191
- updatable?: import('@xyflow/react').EdgeUpdatable;
192
- focusable?: boolean;
193
- data: import('..').RelationshipData;
194
- readonly id: string;
195
- readonly type: "relationship";
196
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
197
- source: string;
198
- target: string;
199
- sourceHandle?: string | null;
200
- targetHandle?: string | null;
201
- animated?: boolean;
202
- hidden?: boolean;
203
- deletable?: boolean;
204
- selectable?: boolean;
205
- selected?: boolean;
206
- markerStart?: import('@xyflow/system').EdgeMarkerType;
207
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
208
- zIndex?: number;
209
- ariaLabel?: string;
210
- interactionWidth?: number;
211
- label?: import('react').ReactNode;
212
- labelStyle?: import('react').CSSProperties;
213
- labelShowBg?: boolean;
214
- labelBgStyle?: import('react').CSSProperties;
215
- labelBgPadding?: [number, number];
216
- labelBgBorderRadius?: number;
217
- style?: import('react').CSSProperties;
218
- className?: string;
219
- updatable?: import('@xyflow/react').EdgeUpdatable;
220
- focusable?: boolean;
221
- data: import('..').RelationshipData;
222
- readonly id: string;
223
- readonly type: "relationship";
224
- }>>), replace?: boolean | undefined) => void;
225
- subscribe: (listener: (state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
226
- source: string;
227
- target: string;
228
- sourceHandle?: string | null;
229
- targetHandle?: string | null;
230
- animated?: boolean;
231
- hidden?: boolean;
232
- deletable?: boolean;
233
- selectable?: boolean;
234
- selected?: boolean;
235
- markerStart?: import('@xyflow/system').EdgeMarkerType;
236
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
237
- zIndex?: number;
238
- ariaLabel?: string;
239
- interactionWidth?: number;
240
- label?: import('react').ReactNode;
241
- labelStyle?: import('react').CSSProperties;
242
- labelShowBg?: boolean;
243
- labelBgStyle?: import('react').CSSProperties;
244
- labelBgPadding?: [number, number];
245
- labelBgBorderRadius?: number;
246
- style?: import('react').CSSProperties;
247
- className?: string;
248
- updatable?: import('@xyflow/react').EdgeUpdatable;
249
- focusable?: boolean;
250
- data: import('..').RelationshipData;
251
- readonly id: string;
252
- readonly type: "relationship";
253
- }>, prevState: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
254
- source: string;
255
- target: string;
256
- sourceHandle?: string | null;
257
- targetHandle?: string | null;
258
- animated?: boolean;
259
- hidden?: boolean;
260
- deletable?: boolean;
261
- selectable?: boolean;
262
- selected?: boolean;
263
- markerStart?: import('@xyflow/system').EdgeMarkerType;
264
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
265
- zIndex?: number;
266
- ariaLabel?: string;
267
- interactionWidth?: number;
268
- label?: import('react').ReactNode;
269
- labelStyle?: import('react').CSSProperties;
270
- labelShowBg?: boolean;
271
- labelBgStyle?: import('react').CSSProperties;
272
- labelBgPadding?: [number, number];
273
- labelBgBorderRadius?: number;
274
- style?: import('react').CSSProperties;
275
- className?: string;
276
- updatable?: import('@xyflow/react').EdgeUpdatable;
277
- focusable?: boolean;
278
- data: import('..').RelationshipData;
279
- readonly id: string;
280
- readonly type: "relationship";
281
- }>) => void) => () => void;
282
- }) => void;
283
- nextDynamicStep: (increment?: number | undefined) => void;
284
- stopDynamicView: () => void;
285
- };
286
- setState: <A extends string | {
287
- type: string;
288
- }>(partial: {
289
- view: import('@likec4/core').DiagramView;
290
- readonly: boolean;
291
- showElementLinks: boolean;
292
- fitViewEnabled: boolean;
293
- fitViewPadding: number;
294
- zoomable: boolean;
295
- pannable: boolean;
296
- nodesDraggable: boolean;
297
- nodesSelectable: boolean;
298
- xyflow: import('..').XYFlowInstance;
299
- initialized: boolean;
300
- xyflowSynced: boolean;
301
- activeDynamicViewStep: number | null;
302
- lastClickedNodeId: string | null;
303
- lastClickedEdgeId: string | null;
304
- focusedNodeId: string | null;
305
- hoveredNodeId: string | null;
306
- hoveredEdgeId: string | null;
307
- dimmed: ReadonlySet<string>;
308
- previousViews: import('@likec4/core').DiagramView[];
309
- lastOnNavigate: {
310
- fromView: import('@likec4/core').ViewID;
311
- toView: import('@likec4/core').ViewID;
312
- element: import('@likec4/core').DiagramNode;
313
- elementCenterScreenPosition: import('@xyflow/system').XYPosition;
314
- positionCorrected: boolean;
315
- } | null;
316
- viewportChanged: boolean;
317
- onChange: import('..').OnChange | null | undefined;
318
- onNavigateTo: import('..').OnNavigateTo | null | undefined;
319
- onNodeClick: import('..').OnNodeClick | null | undefined;
320
- onNodeContextMenu: import('..').OnNodeClick | null | undefined;
321
- onCanvasContextMenu: import('..').OnCanvasClick | null | undefined;
322
- onEdgeClick: import('..').OnEdgeClick | null | undefined;
323
- onEdgeContextMenu: import('..').OnEdgeClick | null | undefined;
324
- onCanvasClick: import('..').OnCanvasClick | null | undefined;
325
- onCanvasDblClick: import('..').OnCanvasClick | null | undefined;
326
- isDynamicView: () => boolean;
327
- updateView: (view: import('@likec4/core').DiagramView) => void;
328
- focusOnNode: (nodeId: string) => void;
329
- setHoveredNode: (nodeId: string | null) => void;
330
- setHoveredEdge: (edgeId: string | null) => void;
331
- setLastClickedNode: (nodeId: string | null) => void;
332
- setLastClickedEdge: (edgeId: string | null) => void;
333
- resetLastClicked: () => void;
334
- getElement: (id: import('@likec4/core').Fqn) => import('@likec4/core').DiagramNode | null;
335
- triggerOnChange: (changes: import('@likec4/core').NonEmptyArray<import("..").Changes.ChangeElementStyle>) => void;
336
- triggerOnNavigateTo: (xynodeId: string, event: import('react').MouseEvent<Element, MouseEvent>) => void;
337
- fitDiagram: (xyStore: {
338
- getState: () => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
339
- source: string;
340
- target: string;
341
- sourceHandle?: string | null;
342
- targetHandle?: string | null;
343
- animated?: boolean;
344
- hidden?: boolean;
345
- deletable?: boolean;
346
- selectable?: boolean;
347
- selected?: boolean;
348
- markerStart?: import('@xyflow/system').EdgeMarkerType;
349
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
350
- zIndex?: number;
351
- ariaLabel?: string;
352
- interactionWidth?: number;
353
- label?: import('react').ReactNode;
354
- labelStyle?: import('react').CSSProperties;
355
- labelShowBg?: boolean;
356
- labelBgStyle?: import('react').CSSProperties;
357
- labelBgPadding?: [number, number];
358
- labelBgBorderRadius?: number;
359
- style?: import('react').CSSProperties;
360
- className?: string;
361
- updatable?: import('@xyflow/react').EdgeUpdatable;
362
- focusable?: boolean;
363
- data: import('..').RelationshipData;
364
- readonly id: string;
365
- readonly type: "relationship";
366
- }>;
367
- setState: (partial: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
368
- source: string;
369
- target: string;
370
- sourceHandle?: string | null;
371
- targetHandle?: string | null;
372
- animated?: boolean;
373
- hidden?: boolean;
374
- deletable?: boolean;
375
- selectable?: boolean;
376
- selected?: boolean;
377
- markerStart?: import('@xyflow/system').EdgeMarkerType;
378
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
379
- zIndex?: number;
380
- ariaLabel?: string;
381
- interactionWidth?: number;
382
- label?: import('react').ReactNode;
383
- labelStyle?: import('react').CSSProperties;
384
- labelShowBg?: boolean;
385
- labelBgStyle?: import('react').CSSProperties;
386
- labelBgPadding?: [number, number];
387
- labelBgBorderRadius?: number;
388
- style?: import('react').CSSProperties;
389
- className?: string;
390
- updatable?: import('@xyflow/react').EdgeUpdatable;
391
- focusable?: boolean;
392
- data: import('..').RelationshipData;
393
- readonly id: string;
394
- readonly type: "relationship";
395
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
396
- source: string;
397
- target: string;
398
- sourceHandle?: string | null;
399
- targetHandle?: string | null;
400
- animated?: boolean;
401
- hidden?: boolean;
402
- deletable?: boolean;
403
- selectable?: boolean;
404
- selected?: boolean;
405
- markerStart?: import('@xyflow/system').EdgeMarkerType;
406
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
407
- zIndex?: number;
408
- ariaLabel?: string;
409
- interactionWidth?: number;
410
- label?: import('react').ReactNode;
411
- labelStyle?: import('react').CSSProperties;
412
- labelShowBg?: boolean;
413
- labelBgStyle?: import('react').CSSProperties;
414
- labelBgPadding?: [number, number];
415
- labelBgBorderRadius?: number;
416
- style?: import('react').CSSProperties;
417
- className?: string;
418
- updatable?: import('@xyflow/react').EdgeUpdatable;
419
- focusable?: boolean;
420
- data: import('..').RelationshipData;
421
- readonly id: string;
422
- readonly type: "relationship";
423
- }>> | ((state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
424
- source: string;
425
- target: string;
426
- sourceHandle?: string | null;
427
- targetHandle?: string | null;
428
- animated?: boolean;
429
- hidden?: boolean;
430
- deletable?: boolean;
431
- selectable?: boolean;
432
- selected?: boolean;
433
- markerStart?: import('@xyflow/system').EdgeMarkerType;
434
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
435
- zIndex?: number;
436
- ariaLabel?: string;
437
- interactionWidth?: number;
438
- label?: import('react').ReactNode;
439
- labelStyle?: import('react').CSSProperties;
440
- labelShowBg?: boolean;
441
- labelBgStyle?: import('react').CSSProperties;
442
- labelBgPadding?: [number, number];
443
- labelBgBorderRadius?: number;
444
- style?: import('react').CSSProperties;
445
- className?: string;
446
- updatable?: import('@xyflow/react').EdgeUpdatable;
447
- focusable?: boolean;
448
- data: import('..').RelationshipData;
449
- readonly id: string;
450
- readonly type: "relationship";
451
- }>) => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
452
- source: string;
453
- target: string;
454
- sourceHandle?: string | null;
455
- targetHandle?: string | null;
456
- animated?: boolean;
457
- hidden?: boolean;
458
- deletable?: boolean;
459
- selectable?: boolean;
460
- selected?: boolean;
461
- markerStart?: import('@xyflow/system').EdgeMarkerType;
462
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
463
- zIndex?: number;
464
- ariaLabel?: string;
465
- interactionWidth?: number;
466
- label?: import('react').ReactNode;
467
- labelStyle?: import('react').CSSProperties;
468
- labelShowBg?: boolean;
469
- labelBgStyle?: import('react').CSSProperties;
470
- labelBgPadding?: [number, number];
471
- labelBgBorderRadius?: number;
472
- style?: import('react').CSSProperties;
473
- className?: string;
474
- updatable?: import('@xyflow/react').EdgeUpdatable;
475
- focusable?: boolean;
476
- data: import('..').RelationshipData;
477
- readonly id: string;
478
- readonly type: "relationship";
479
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
480
- source: string;
481
- target: string;
482
- sourceHandle?: string | null;
483
- targetHandle?: string | null;
484
- animated?: boolean;
485
- hidden?: boolean;
486
- deletable?: boolean;
487
- selectable?: boolean;
488
- selected?: boolean;
489
- markerStart?: import('@xyflow/system').EdgeMarkerType;
490
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
491
- zIndex?: number;
492
- ariaLabel?: string;
493
- interactionWidth?: number;
494
- label?: import('react').ReactNode;
495
- labelStyle?: import('react').CSSProperties;
496
- labelShowBg?: boolean;
497
- labelBgStyle?: import('react').CSSProperties;
498
- labelBgPadding?: [number, number];
499
- labelBgBorderRadius?: number;
500
- style?: import('react').CSSProperties;
501
- className?: string;
502
- updatable?: import('@xyflow/react').EdgeUpdatable;
503
- focusable?: boolean;
504
- data: import('..').RelationshipData;
505
- readonly id: string;
506
- readonly type: "relationship";
507
- }>>), replace?: boolean | undefined) => void;
508
- subscribe: (listener: (state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
509
- source: string;
510
- target: string;
511
- sourceHandle?: string | null;
512
- targetHandle?: string | null;
513
- animated?: boolean;
514
- hidden?: boolean;
515
- deletable?: boolean;
516
- selectable?: boolean;
517
- selected?: boolean;
518
- markerStart?: import('@xyflow/system').EdgeMarkerType;
519
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
520
- zIndex?: number;
521
- ariaLabel?: string;
522
- interactionWidth?: number;
523
- label?: import('react').ReactNode;
524
- labelStyle?: import('react').CSSProperties;
525
- labelShowBg?: boolean;
526
- labelBgStyle?: import('react').CSSProperties;
527
- labelBgPadding?: [number, number];
528
- labelBgBorderRadius?: number;
529
- style?: import('react').CSSProperties;
530
- className?: string;
531
- updatable?: import('@xyflow/react').EdgeUpdatable;
532
- focusable?: boolean;
533
- data: import('..').RelationshipData;
534
- readonly id: string;
535
- readonly type: "relationship";
536
- }>, prevState: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
537
- source: string;
538
- target: string;
539
- sourceHandle?: string | null;
540
- targetHandle?: string | null;
541
- animated?: boolean;
542
- hidden?: boolean;
543
- deletable?: boolean;
544
- selectable?: boolean;
545
- selected?: boolean;
546
- markerStart?: import('@xyflow/system').EdgeMarkerType;
547
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
548
- zIndex?: number;
549
- ariaLabel?: string;
550
- interactionWidth?: number;
551
- label?: import('react').ReactNode;
552
- labelStyle?: import('react').CSSProperties;
553
- labelShowBg?: boolean;
554
- labelBgStyle?: import('react').CSSProperties;
555
- labelBgPadding?: [number, number];
556
- labelBgBorderRadius?: number;
557
- style?: import('react').CSSProperties;
558
- className?: string;
559
- updatable?: import('@xyflow/react').EdgeUpdatable;
560
- focusable?: boolean;
561
- data: import('..').RelationshipData;
562
- readonly id: string;
563
- readonly type: "relationship";
564
- }>) => void) => () => void;
565
- }) => void;
566
- nextDynamicStep: (increment?: number | undefined) => void;
567
- stopDynamicView: () => void;
568
- } | Partial<{
569
- view: import('@likec4/core').DiagramView;
570
- readonly: boolean;
571
- showElementLinks: boolean;
572
- fitViewEnabled: boolean;
573
- fitViewPadding: number;
574
- zoomable: boolean;
575
- pannable: boolean;
576
- nodesDraggable: boolean;
577
- nodesSelectable: boolean;
578
- xyflow: import('..').XYFlowInstance;
579
- initialized: boolean;
580
- xyflowSynced: boolean;
581
- activeDynamicViewStep: number | null;
582
- lastClickedNodeId: string | null;
583
- lastClickedEdgeId: string | null;
584
- focusedNodeId: string | null;
585
- hoveredNodeId: string | null;
586
- hoveredEdgeId: string | null;
587
- dimmed: ReadonlySet<string>;
588
- previousViews: import('@likec4/core').DiagramView[];
589
- lastOnNavigate: {
590
- fromView: import('@likec4/core').ViewID;
591
- toView: import('@likec4/core').ViewID;
592
- element: import('@likec4/core').DiagramNode;
593
- elementCenterScreenPosition: import('@xyflow/system').XYPosition;
594
- positionCorrected: boolean;
595
- } | null;
596
- viewportChanged: boolean;
597
- onChange: import('..').OnChange | null | undefined;
598
- onNavigateTo: import('..').OnNavigateTo | null | undefined;
599
- onNodeClick: import('..').OnNodeClick | null | undefined;
600
- onNodeContextMenu: import('..').OnNodeClick | null | undefined;
601
- onCanvasContextMenu: import('..').OnCanvasClick | null | undefined;
602
- onEdgeClick: import('..').OnEdgeClick | null | undefined;
603
- onEdgeContextMenu: import('..').OnEdgeClick | null | undefined;
604
- onCanvasClick: import('..').OnCanvasClick | null | undefined;
605
- onCanvasDblClick: import('..').OnCanvasClick | null | undefined;
606
- isDynamicView: () => boolean;
607
- updateView: (view: import('@likec4/core').DiagramView) => void;
608
- focusOnNode: (nodeId: string) => void;
609
- setHoveredNode: (nodeId: string | null) => void;
610
- setHoveredEdge: (edgeId: string | null) => void;
611
- setLastClickedNode: (nodeId: string | null) => void;
612
- setLastClickedEdge: (edgeId: string | null) => void;
613
- resetLastClicked: () => void;
614
- getElement: (id: import('@likec4/core').Fqn) => import('@likec4/core').DiagramNode | null;
615
- triggerOnChange: (changes: import('@likec4/core').NonEmptyArray<import("..").Changes.ChangeElementStyle>) => void;
616
- triggerOnNavigateTo: (xynodeId: string, event: import('react').MouseEvent<Element, MouseEvent>) => void;
617
- fitDiagram: (xyStore: {
618
- getState: () => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
619
- source: string;
620
- target: string;
621
- sourceHandle?: string | null;
622
- targetHandle?: string | null;
623
- animated?: boolean;
624
- hidden?: boolean;
625
- deletable?: boolean;
626
- selectable?: boolean;
627
- selected?: boolean;
628
- markerStart?: import('@xyflow/system').EdgeMarkerType;
629
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
630
- zIndex?: number;
631
- ariaLabel?: string;
632
- interactionWidth?: number;
633
- label?: import('react').ReactNode;
634
- labelStyle?: import('react').CSSProperties;
635
- labelShowBg?: boolean;
636
- labelBgStyle?: import('react').CSSProperties;
637
- labelBgPadding?: [number, number];
638
- labelBgBorderRadius?: number;
639
- style?: import('react').CSSProperties;
640
- className?: string;
641
- updatable?: import('@xyflow/react').EdgeUpdatable;
642
- focusable?: boolean;
643
- data: import('..').RelationshipData;
644
- readonly id: string;
645
- readonly type: "relationship";
646
- }>;
647
- setState: (partial: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
648
- source: string;
649
- target: string;
650
- sourceHandle?: string | null;
651
- targetHandle?: string | null;
652
- animated?: boolean;
653
- hidden?: boolean;
654
- deletable?: boolean;
655
- selectable?: boolean;
656
- selected?: boolean;
657
- markerStart?: import('@xyflow/system').EdgeMarkerType;
658
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
659
- zIndex?: number;
660
- ariaLabel?: string;
661
- interactionWidth?: number;
662
- label?: import('react').ReactNode;
663
- labelStyle?: import('react').CSSProperties;
664
- labelShowBg?: boolean;
665
- labelBgStyle?: import('react').CSSProperties;
666
- labelBgPadding?: [number, number];
667
- labelBgBorderRadius?: number;
668
- style?: import('react').CSSProperties;
669
- className?: string;
670
- updatable?: import('@xyflow/react').EdgeUpdatable;
671
- focusable?: boolean;
672
- data: import('..').RelationshipData;
673
- readonly id: string;
674
- readonly type: "relationship";
675
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
676
- source: string;
677
- target: string;
678
- sourceHandle?: string | null;
679
- targetHandle?: string | null;
680
- animated?: boolean;
681
- hidden?: boolean;
682
- deletable?: boolean;
683
- selectable?: boolean;
684
- selected?: boolean;
685
- markerStart?: import('@xyflow/system').EdgeMarkerType;
686
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
687
- zIndex?: number;
688
- ariaLabel?: string;
689
- interactionWidth?: number;
690
- label?: import('react').ReactNode;
691
- labelStyle?: import('react').CSSProperties;
692
- labelShowBg?: boolean;
693
- labelBgStyle?: import('react').CSSProperties;
694
- labelBgPadding?: [number, number];
695
- labelBgBorderRadius?: number;
696
- style?: import('react').CSSProperties;
697
- className?: string;
698
- updatable?: import('@xyflow/react').EdgeUpdatable;
699
- focusable?: boolean;
700
- data: import('..').RelationshipData;
701
- readonly id: string;
702
- readonly type: "relationship";
703
- }>> | ((state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
704
- source: string;
705
- target: string;
706
- sourceHandle?: string | null;
707
- targetHandle?: string | null;
708
- animated?: boolean;
709
- hidden?: boolean;
710
- deletable?: boolean;
711
- selectable?: boolean;
712
- selected?: boolean;
713
- markerStart?: import('@xyflow/system').EdgeMarkerType;
714
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
715
- zIndex?: number;
716
- ariaLabel?: string;
717
- interactionWidth?: number;
718
- label?: import('react').ReactNode;
719
- labelStyle?: import('react').CSSProperties;
720
- labelShowBg?: boolean;
721
- labelBgStyle?: import('react').CSSProperties;
722
- labelBgPadding?: [number, number];
723
- labelBgBorderRadius?: number;
724
- style?: import('react').CSSProperties;
725
- className?: string;
726
- updatable?: import('@xyflow/react').EdgeUpdatable;
727
- focusable?: boolean;
728
- data: import('..').RelationshipData;
729
- readonly id: string;
730
- readonly type: "relationship";
731
- }>) => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
732
- source: string;
733
- target: string;
734
- sourceHandle?: string | null;
735
- targetHandle?: string | null;
736
- animated?: boolean;
737
- hidden?: boolean;
738
- deletable?: boolean;
739
- selectable?: boolean;
740
- selected?: boolean;
741
- markerStart?: import('@xyflow/system').EdgeMarkerType;
742
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
743
- zIndex?: number;
744
- ariaLabel?: string;
745
- interactionWidth?: number;
746
- label?: import('react').ReactNode;
747
- labelStyle?: import('react').CSSProperties;
748
- labelShowBg?: boolean;
749
- labelBgStyle?: import('react').CSSProperties;
750
- labelBgPadding?: [number, number];
751
- labelBgBorderRadius?: number;
752
- style?: import('react').CSSProperties;
753
- className?: string;
754
- updatable?: import('@xyflow/react').EdgeUpdatable;
755
- focusable?: boolean;
756
- data: import('..').RelationshipData;
757
- readonly id: string;
758
- readonly type: "relationship";
759
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
760
- source: string;
761
- target: string;
762
- sourceHandle?: string | null;
763
- targetHandle?: string | null;
764
- animated?: boolean;
765
- hidden?: boolean;
766
- deletable?: boolean;
767
- selectable?: boolean;
768
- selected?: boolean;
769
- markerStart?: import('@xyflow/system').EdgeMarkerType;
770
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
771
- zIndex?: number;
772
- ariaLabel?: string;
773
- interactionWidth?: number;
774
- label?: import('react').ReactNode;
775
- labelStyle?: import('react').CSSProperties;
776
- labelShowBg?: boolean;
777
- labelBgStyle?: import('react').CSSProperties;
778
- labelBgPadding?: [number, number];
779
- labelBgBorderRadius?: number;
780
- style?: import('react').CSSProperties;
781
- className?: string;
782
- updatable?: import('@xyflow/react').EdgeUpdatable;
783
- focusable?: boolean;
784
- data: import('..').RelationshipData;
785
- readonly id: string;
786
- readonly type: "relationship";
787
- }>>), replace?: boolean | undefined) => void;
788
- subscribe: (listener: (state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
789
- source: string;
790
- target: string;
791
- sourceHandle?: string | null;
792
- targetHandle?: string | null;
793
- animated?: boolean;
794
- hidden?: boolean;
795
- deletable?: boolean;
796
- selectable?: boolean;
797
- selected?: boolean;
798
- markerStart?: import('@xyflow/system').EdgeMarkerType;
799
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
800
- zIndex?: number;
801
- ariaLabel?: string;
802
- interactionWidth?: number;
803
- label?: import('react').ReactNode;
804
- labelStyle?: import('react').CSSProperties;
805
- labelShowBg?: boolean;
806
- labelBgStyle?: import('react').CSSProperties;
807
- labelBgPadding?: [number, number];
808
- labelBgBorderRadius?: number;
809
- style?: import('react').CSSProperties;
810
- className?: string;
811
- updatable?: import('@xyflow/react').EdgeUpdatable;
812
- focusable?: boolean;
813
- data: import('..').RelationshipData;
814
- readonly id: string;
815
- readonly type: "relationship";
816
- }>, prevState: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
817
- source: string;
818
- target: string;
819
- sourceHandle?: string | null;
820
- targetHandle?: string | null;
821
- animated?: boolean;
822
- hidden?: boolean;
823
- deletable?: boolean;
824
- selectable?: boolean;
825
- selected?: boolean;
826
- markerStart?: import('@xyflow/system').EdgeMarkerType;
827
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
828
- zIndex?: number;
829
- ariaLabel?: string;
830
- interactionWidth?: number;
831
- label?: import('react').ReactNode;
832
- labelStyle?: import('react').CSSProperties;
833
- labelShowBg?: boolean;
834
- labelBgStyle?: import('react').CSSProperties;
835
- labelBgPadding?: [number, number];
836
- labelBgBorderRadius?: number;
837
- style?: import('react').CSSProperties;
838
- className?: string;
839
- updatable?: import('@xyflow/react').EdgeUpdatable;
840
- focusable?: boolean;
841
- data: import('..').RelationshipData;
842
- readonly id: string;
843
- readonly type: "relationship";
844
- }>) => void) => () => void;
845
- }) => void;
846
- nextDynamicStep: (increment?: number | undefined) => void;
847
- stopDynamicView: () => void;
848
- }> | ((state: {
849
- view: import('@likec4/core').DiagramView;
850
- readonly: boolean;
851
- showElementLinks: boolean;
852
- fitViewEnabled: boolean;
853
- fitViewPadding: number;
854
- zoomable: boolean;
855
- pannable: boolean;
856
- nodesDraggable: boolean;
857
- nodesSelectable: boolean;
858
- xyflow: import('..').XYFlowInstance;
859
- initialized: boolean;
860
- xyflowSynced: boolean;
861
- activeDynamicViewStep: number | null;
862
- lastClickedNodeId: string | null;
863
- lastClickedEdgeId: string | null;
864
- focusedNodeId: string | null;
865
- hoveredNodeId: string | null;
866
- hoveredEdgeId: string | null;
867
- dimmed: ReadonlySet<string>;
868
- previousViews: import('@likec4/core').DiagramView[];
869
- lastOnNavigate: {
870
- fromView: import('@likec4/core').ViewID;
871
- toView: import('@likec4/core').ViewID;
872
- element: import('@likec4/core').DiagramNode;
873
- elementCenterScreenPosition: import('@xyflow/system').XYPosition;
874
- positionCorrected: boolean;
875
- } | null;
876
- viewportChanged: boolean;
877
- onChange: import('..').OnChange | null | undefined;
878
- onNavigateTo: import('..').OnNavigateTo | null | undefined;
879
- onNodeClick: import('..').OnNodeClick | null | undefined;
880
- onNodeContextMenu: import('..').OnNodeClick | null | undefined;
881
- onCanvasContextMenu: import('..').OnCanvasClick | null | undefined;
882
- onEdgeClick: import('..').OnEdgeClick | null | undefined;
883
- onEdgeContextMenu: import('..').OnEdgeClick | null | undefined;
884
- onCanvasClick: import('..').OnCanvasClick | null | undefined;
885
- onCanvasDblClick: import('..').OnCanvasClick | null | undefined;
886
- isDynamicView: () => boolean;
887
- updateView: (view: import('@likec4/core').DiagramView) => void;
888
- focusOnNode: (nodeId: string) => void;
889
- setHoveredNode: (nodeId: string | null) => void;
890
- setHoveredEdge: (edgeId: string | null) => void;
891
- setLastClickedNode: (nodeId: string | null) => void;
892
- setLastClickedEdge: (edgeId: string | null) => void;
893
- resetLastClicked: () => void;
894
- getElement: (id: import('@likec4/core').Fqn) => import('@likec4/core').DiagramNode | null;
895
- triggerOnChange: (changes: import('@likec4/core').NonEmptyArray<import("..").Changes.ChangeElementStyle>) => void;
896
- triggerOnNavigateTo: (xynodeId: string, event: import('react').MouseEvent<Element, MouseEvent>) => void;
897
- fitDiagram: (xyStore: {
898
- getState: () => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
899
- source: string;
900
- target: string;
901
- sourceHandle?: string | null;
902
- targetHandle?: string | null;
903
- animated?: boolean;
904
- hidden?: boolean;
905
- deletable?: boolean;
906
- selectable?: boolean;
907
- selected?: boolean;
908
- markerStart?: import('@xyflow/system').EdgeMarkerType;
909
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
910
- zIndex?: number;
911
- ariaLabel?: string;
912
- interactionWidth?: number;
913
- label?: import('react').ReactNode;
914
- labelStyle?: import('react').CSSProperties;
915
- labelShowBg?: boolean;
916
- labelBgStyle?: import('react').CSSProperties;
917
- labelBgPadding?: [number, number];
918
- labelBgBorderRadius?: number;
919
- style?: import('react').CSSProperties;
920
- className?: string;
921
- updatable?: import('@xyflow/react').EdgeUpdatable;
922
- focusable?: boolean;
923
- data: import('..').RelationshipData;
924
- readonly id: string;
925
- readonly type: "relationship";
926
- }>;
927
- setState: (partial: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
928
- source: string;
929
- target: string;
930
- sourceHandle?: string | null;
931
- targetHandle?: string | null;
932
- animated?: boolean;
933
- hidden?: boolean;
934
- deletable?: boolean;
935
- selectable?: boolean;
936
- selected?: boolean;
937
- markerStart?: import('@xyflow/system').EdgeMarkerType;
938
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
939
- zIndex?: number;
940
- ariaLabel?: string;
941
- interactionWidth?: number;
942
- label?: import('react').ReactNode;
943
- labelStyle?: import('react').CSSProperties;
944
- labelShowBg?: boolean;
945
- labelBgStyle?: import('react').CSSProperties;
946
- labelBgPadding?: [number, number];
947
- labelBgBorderRadius?: number;
948
- style?: import('react').CSSProperties;
949
- className?: string;
950
- updatable?: import('@xyflow/react').EdgeUpdatable;
951
- focusable?: boolean;
952
- data: import('..').RelationshipData;
953
- readonly id: string;
954
- readonly type: "relationship";
955
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
956
- source: string;
957
- target: string;
958
- sourceHandle?: string | null;
959
- targetHandle?: string | null;
960
- animated?: boolean;
961
- hidden?: boolean;
962
- deletable?: boolean;
963
- selectable?: boolean;
964
- selected?: boolean;
965
- markerStart?: import('@xyflow/system').EdgeMarkerType;
966
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
967
- zIndex?: number;
968
- ariaLabel?: string;
969
- interactionWidth?: number;
970
- label?: import('react').ReactNode;
971
- labelStyle?: import('react').CSSProperties;
972
- labelShowBg?: boolean;
973
- labelBgStyle?: import('react').CSSProperties;
974
- labelBgPadding?: [number, number];
975
- labelBgBorderRadius?: number;
976
- style?: import('react').CSSProperties;
977
- className?: string;
978
- updatable?: import('@xyflow/react').EdgeUpdatable;
979
- focusable?: boolean;
980
- data: import('..').RelationshipData;
981
- readonly id: string;
982
- readonly type: "relationship";
983
- }>> | ((state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
984
- source: string;
985
- target: string;
986
- sourceHandle?: string | null;
987
- targetHandle?: string | null;
988
- animated?: boolean;
989
- hidden?: boolean;
990
- deletable?: boolean;
991
- selectable?: boolean;
992
- selected?: boolean;
993
- markerStart?: import('@xyflow/system').EdgeMarkerType;
994
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
995
- zIndex?: number;
996
- ariaLabel?: string;
997
- interactionWidth?: number;
998
- label?: import('react').ReactNode;
999
- labelStyle?: import('react').CSSProperties;
1000
- labelShowBg?: boolean;
1001
- labelBgStyle?: import('react').CSSProperties;
1002
- labelBgPadding?: [number, number];
1003
- labelBgBorderRadius?: number;
1004
- style?: import('react').CSSProperties;
1005
- className?: string;
1006
- updatable?: import('@xyflow/react').EdgeUpdatable;
1007
- focusable?: boolean;
1008
- data: import('..').RelationshipData;
1009
- readonly id: string;
1010
- readonly type: "relationship";
1011
- }>) => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1012
- source: string;
1013
- target: string;
1014
- sourceHandle?: string | null;
1015
- targetHandle?: string | null;
1016
- animated?: boolean;
1017
- hidden?: boolean;
1018
- deletable?: boolean;
1019
- selectable?: boolean;
1020
- selected?: boolean;
1021
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1022
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1023
- zIndex?: number;
1024
- ariaLabel?: string;
1025
- interactionWidth?: number;
1026
- label?: import('react').ReactNode;
1027
- labelStyle?: import('react').CSSProperties;
1028
- labelShowBg?: boolean;
1029
- labelBgStyle?: import('react').CSSProperties;
1030
- labelBgPadding?: [number, number];
1031
- labelBgBorderRadius?: number;
1032
- style?: import('react').CSSProperties;
1033
- className?: string;
1034
- updatable?: import('@xyflow/react').EdgeUpdatable;
1035
- focusable?: boolean;
1036
- data: import('..').RelationshipData;
1037
- readonly id: string;
1038
- readonly type: "relationship";
1039
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1040
- source: string;
1041
- target: string;
1042
- sourceHandle?: string | null;
1043
- targetHandle?: string | null;
1044
- animated?: boolean;
1045
- hidden?: boolean;
1046
- deletable?: boolean;
1047
- selectable?: boolean;
1048
- selected?: boolean;
1049
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1050
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1051
- zIndex?: number;
1052
- ariaLabel?: string;
1053
- interactionWidth?: number;
1054
- label?: import('react').ReactNode;
1055
- labelStyle?: import('react').CSSProperties;
1056
- labelShowBg?: boolean;
1057
- labelBgStyle?: import('react').CSSProperties;
1058
- labelBgPadding?: [number, number];
1059
- labelBgBorderRadius?: number;
1060
- style?: import('react').CSSProperties;
1061
- className?: string;
1062
- updatable?: import('@xyflow/react').EdgeUpdatable;
1063
- focusable?: boolean;
1064
- data: import('..').RelationshipData;
1065
- readonly id: string;
1066
- readonly type: "relationship";
1067
- }>>), replace?: boolean | undefined) => void;
1068
- subscribe: (listener: (state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1069
- source: string;
1070
- target: string;
1071
- sourceHandle?: string | null;
1072
- targetHandle?: string | null;
1073
- animated?: boolean;
1074
- hidden?: boolean;
1075
- deletable?: boolean;
1076
- selectable?: boolean;
1077
- selected?: boolean;
1078
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1079
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1080
- zIndex?: number;
1081
- ariaLabel?: string;
1082
- interactionWidth?: number;
1083
- label?: import('react').ReactNode;
1084
- labelStyle?: import('react').CSSProperties;
1085
- labelShowBg?: boolean;
1086
- labelBgStyle?: import('react').CSSProperties;
1087
- labelBgPadding?: [number, number];
1088
- labelBgBorderRadius?: number;
1089
- style?: import('react').CSSProperties;
1090
- className?: string;
1091
- updatable?: import('@xyflow/react').EdgeUpdatable;
1092
- focusable?: boolean;
1093
- data: import('..').RelationshipData;
1094
- readonly id: string;
1095
- readonly type: "relationship";
1096
- }>, prevState: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1097
- source: string;
1098
- target: string;
1099
- sourceHandle?: string | null;
1100
- targetHandle?: string | null;
1101
- animated?: boolean;
1102
- hidden?: boolean;
1103
- deletable?: boolean;
1104
- selectable?: boolean;
1105
- selected?: boolean;
1106
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1107
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1108
- zIndex?: number;
1109
- ariaLabel?: string;
1110
- interactionWidth?: number;
1111
- label?: import('react').ReactNode;
1112
- labelStyle?: import('react').CSSProperties;
1113
- labelShowBg?: boolean;
1114
- labelBgStyle?: import('react').CSSProperties;
1115
- labelBgPadding?: [number, number];
1116
- labelBgBorderRadius?: number;
1117
- style?: import('react').CSSProperties;
1118
- className?: string;
1119
- updatable?: import('@xyflow/react').EdgeUpdatable;
1120
- focusable?: boolean;
1121
- data: import('..').RelationshipData;
1122
- readonly id: string;
1123
- readonly type: "relationship";
1124
- }>) => void) => () => void;
1125
- }) => void;
1126
- nextDynamicStep: (increment?: number | undefined) => void;
1127
- stopDynamicView: () => void;
1128
- }) => {
1129
- view: import('@likec4/core').DiagramView;
1130
- readonly: boolean;
1131
- showElementLinks: boolean;
1132
- fitViewEnabled: boolean;
1133
- fitViewPadding: number;
1134
- zoomable: boolean;
1135
- pannable: boolean;
1136
- nodesDraggable: boolean;
1137
- nodesSelectable: boolean;
1138
- xyflow: import('..').XYFlowInstance;
1139
- initialized: boolean;
1140
- xyflowSynced: boolean;
1141
- activeDynamicViewStep: number | null;
1142
- lastClickedNodeId: string | null;
1143
- lastClickedEdgeId: string | null;
1144
- focusedNodeId: string | null;
1145
- hoveredNodeId: string | null;
1146
- hoveredEdgeId: string | null;
1147
- dimmed: ReadonlySet<string>;
1148
- previousViews: import('@likec4/core').DiagramView[];
1149
- lastOnNavigate: {
1150
- fromView: import('@likec4/core').ViewID;
1151
- toView: import('@likec4/core').ViewID;
1152
- element: import('@likec4/core').DiagramNode;
1153
- elementCenterScreenPosition: import('@xyflow/system').XYPosition;
1154
- positionCorrected: boolean;
1155
- } | null;
1156
- viewportChanged: boolean;
1157
- onChange: import('..').OnChange | null | undefined;
1158
- onNavigateTo: import('..').OnNavigateTo | null | undefined;
1159
- onNodeClick: import('..').OnNodeClick | null | undefined;
1160
- onNodeContextMenu: import('..').OnNodeClick | null | undefined;
1161
- onCanvasContextMenu: import('..').OnCanvasClick | null | undefined;
1162
- onEdgeClick: import('..').OnEdgeClick | null | undefined;
1163
- onEdgeContextMenu: import('..').OnEdgeClick | null | undefined;
1164
- onCanvasClick: import('..').OnCanvasClick | null | undefined;
1165
- onCanvasDblClick: import('..').OnCanvasClick | null | undefined;
1166
- isDynamicView: () => boolean;
1167
- updateView: (view: import('@likec4/core').DiagramView) => void;
1168
- focusOnNode: (nodeId: string) => void;
1169
- setHoveredNode: (nodeId: string | null) => void;
1170
- setHoveredEdge: (edgeId: string | null) => void;
1171
- setLastClickedNode: (nodeId: string | null) => void;
1172
- setLastClickedEdge: (edgeId: string | null) => void;
1173
- resetLastClicked: () => void;
1174
- getElement: (id: import('@likec4/core').Fqn) => import('@likec4/core').DiagramNode | null;
1175
- triggerOnChange: (changes: import('@likec4/core').NonEmptyArray<import("..").Changes.ChangeElementStyle>) => void;
1176
- triggerOnNavigateTo: (xynodeId: string, event: import('react').MouseEvent<Element, MouseEvent>) => void;
1177
- fitDiagram: (xyStore: {
1178
- getState: () => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1179
- source: string;
1180
- target: string;
1181
- sourceHandle?: string | null;
1182
- targetHandle?: string | null;
1183
- animated?: boolean;
1184
- hidden?: boolean;
1185
- deletable?: boolean;
1186
- selectable?: boolean;
1187
- selected?: boolean;
1188
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1189
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1190
- zIndex?: number;
1191
- ariaLabel?: string;
1192
- interactionWidth?: number;
1193
- label?: import('react').ReactNode;
1194
- labelStyle?: import('react').CSSProperties;
1195
- labelShowBg?: boolean;
1196
- labelBgStyle?: import('react').CSSProperties;
1197
- labelBgPadding?: [number, number];
1198
- labelBgBorderRadius?: number;
1199
- style?: import('react').CSSProperties;
1200
- className?: string;
1201
- updatable?: import('@xyflow/react').EdgeUpdatable;
1202
- focusable?: boolean;
1203
- data: import('..').RelationshipData;
1204
- readonly id: string;
1205
- readonly type: "relationship";
1206
- }>;
1207
- setState: (partial: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1208
- source: string;
1209
- target: string;
1210
- sourceHandle?: string | null;
1211
- targetHandle?: string | null;
1212
- animated?: boolean;
1213
- hidden?: boolean;
1214
- deletable?: boolean;
1215
- selectable?: boolean;
1216
- selected?: boolean;
1217
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1218
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1219
- zIndex?: number;
1220
- ariaLabel?: string;
1221
- interactionWidth?: number;
1222
- label?: import('react').ReactNode;
1223
- labelStyle?: import('react').CSSProperties;
1224
- labelShowBg?: boolean;
1225
- labelBgStyle?: import('react').CSSProperties;
1226
- labelBgPadding?: [number, number];
1227
- labelBgBorderRadius?: number;
1228
- style?: import('react').CSSProperties;
1229
- className?: string;
1230
- updatable?: import('@xyflow/react').EdgeUpdatable;
1231
- focusable?: boolean;
1232
- data: import('..').RelationshipData;
1233
- readonly id: string;
1234
- readonly type: "relationship";
1235
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1236
- source: string;
1237
- target: string;
1238
- sourceHandle?: string | null;
1239
- targetHandle?: string | null;
1240
- animated?: boolean;
1241
- hidden?: boolean;
1242
- deletable?: boolean;
1243
- selectable?: boolean;
1244
- selected?: boolean;
1245
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1246
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1247
- zIndex?: number;
1248
- ariaLabel?: string;
1249
- interactionWidth?: number;
1250
- label?: import('react').ReactNode;
1251
- labelStyle?: import('react').CSSProperties;
1252
- labelShowBg?: boolean;
1253
- labelBgStyle?: import('react').CSSProperties;
1254
- labelBgPadding?: [number, number];
1255
- labelBgBorderRadius?: number;
1256
- style?: import('react').CSSProperties;
1257
- className?: string;
1258
- updatable?: import('@xyflow/react').EdgeUpdatable;
1259
- focusable?: boolean;
1260
- data: import('..').RelationshipData;
1261
- readonly id: string;
1262
- readonly type: "relationship";
1263
- }>> | ((state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1264
- source: string;
1265
- target: string;
1266
- sourceHandle?: string | null;
1267
- targetHandle?: string | null;
1268
- animated?: boolean;
1269
- hidden?: boolean;
1270
- deletable?: boolean;
1271
- selectable?: boolean;
1272
- selected?: boolean;
1273
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1274
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1275
- zIndex?: number;
1276
- ariaLabel?: string;
1277
- interactionWidth?: number;
1278
- label?: import('react').ReactNode;
1279
- labelStyle?: import('react').CSSProperties;
1280
- labelShowBg?: boolean;
1281
- labelBgStyle?: import('react').CSSProperties;
1282
- labelBgPadding?: [number, number];
1283
- labelBgBorderRadius?: number;
1284
- style?: import('react').CSSProperties;
1285
- className?: string;
1286
- updatable?: import('@xyflow/react').EdgeUpdatable;
1287
- focusable?: boolean;
1288
- data: import('..').RelationshipData;
1289
- readonly id: string;
1290
- readonly type: "relationship";
1291
- }>) => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1292
- source: string;
1293
- target: string;
1294
- sourceHandle?: string | null;
1295
- targetHandle?: string | null;
1296
- animated?: boolean;
1297
- hidden?: boolean;
1298
- deletable?: boolean;
1299
- selectable?: boolean;
1300
- selected?: boolean;
1301
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1302
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1303
- zIndex?: number;
1304
- ariaLabel?: string;
1305
- interactionWidth?: number;
1306
- label?: import('react').ReactNode;
1307
- labelStyle?: import('react').CSSProperties;
1308
- labelShowBg?: boolean;
1309
- labelBgStyle?: import('react').CSSProperties;
1310
- labelBgPadding?: [number, number];
1311
- labelBgBorderRadius?: number;
1312
- style?: import('react').CSSProperties;
1313
- className?: string;
1314
- updatable?: import('@xyflow/react').EdgeUpdatable;
1315
- focusable?: boolean;
1316
- data: import('..').RelationshipData;
1317
- readonly id: string;
1318
- readonly type: "relationship";
1319
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1320
- source: string;
1321
- target: string;
1322
- sourceHandle?: string | null;
1323
- targetHandle?: string | null;
1324
- animated?: boolean;
1325
- hidden?: boolean;
1326
- deletable?: boolean;
1327
- selectable?: boolean;
1328
- selected?: boolean;
1329
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1330
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1331
- zIndex?: number;
1332
- ariaLabel?: string;
1333
- interactionWidth?: number;
1334
- label?: import('react').ReactNode;
1335
- labelStyle?: import('react').CSSProperties;
1336
- labelShowBg?: boolean;
1337
- labelBgStyle?: import('react').CSSProperties;
1338
- labelBgPadding?: [number, number];
1339
- labelBgBorderRadius?: number;
1340
- style?: import('react').CSSProperties;
1341
- className?: string;
1342
- updatable?: import('@xyflow/react').EdgeUpdatable;
1343
- focusable?: boolean;
1344
- data: import('..').RelationshipData;
1345
- readonly id: string;
1346
- readonly type: "relationship";
1347
- }>>), replace?: boolean | undefined) => void;
1348
- subscribe: (listener: (state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1349
- source: string;
1350
- target: string;
1351
- sourceHandle?: string | null;
1352
- targetHandle?: string | null;
1353
- animated?: boolean;
1354
- hidden?: boolean;
1355
- deletable?: boolean;
1356
- selectable?: boolean;
1357
- selected?: boolean;
1358
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1359
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1360
- zIndex?: number;
1361
- ariaLabel?: string;
1362
- interactionWidth?: number;
1363
- label?: import('react').ReactNode;
1364
- labelStyle?: import('react').CSSProperties;
1365
- labelShowBg?: boolean;
1366
- labelBgStyle?: import('react').CSSProperties;
1367
- labelBgPadding?: [number, number];
1368
- labelBgBorderRadius?: number;
1369
- style?: import('react').CSSProperties;
1370
- className?: string;
1371
- updatable?: import('@xyflow/react').EdgeUpdatable;
1372
- focusable?: boolean;
1373
- data: import('..').RelationshipData;
1374
- readonly id: string;
1375
- readonly type: "relationship";
1376
- }>, prevState: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1377
- source: string;
1378
- target: string;
1379
- sourceHandle?: string | null;
1380
- targetHandle?: string | null;
1381
- animated?: boolean;
1382
- hidden?: boolean;
1383
- deletable?: boolean;
1384
- selectable?: boolean;
1385
- selected?: boolean;
1386
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1387
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1388
- zIndex?: number;
1389
- ariaLabel?: string;
1390
- interactionWidth?: number;
1391
- label?: import('react').ReactNode;
1392
- labelStyle?: import('react').CSSProperties;
1393
- labelShowBg?: boolean;
1394
- labelBgStyle?: import('react').CSSProperties;
1395
- labelBgPadding?: [number, number];
1396
- labelBgBorderRadius?: number;
1397
- style?: import('react').CSSProperties;
1398
- className?: string;
1399
- updatable?: import('@xyflow/react').EdgeUpdatable;
1400
- focusable?: boolean;
1401
- data: import('..').RelationshipData;
1402
- readonly id: string;
1403
- readonly type: "relationship";
1404
- }>) => void) => () => void;
1405
- }) => void;
1406
- nextDynamicStep: (increment?: number | undefined) => void;
1407
- stopDynamicView: () => void;
1408
- } | Partial<{
1409
- view: import('@likec4/core').DiagramView;
1410
- readonly: boolean;
1411
- showElementLinks: boolean;
1412
- fitViewEnabled: boolean;
1413
- fitViewPadding: number;
1414
- zoomable: boolean;
1415
- pannable: boolean;
1416
- nodesDraggable: boolean;
1417
- nodesSelectable: boolean;
1418
- xyflow: import('..').XYFlowInstance;
1419
- initialized: boolean;
1420
- xyflowSynced: boolean;
1421
- activeDynamicViewStep: number | null;
1422
- lastClickedNodeId: string | null;
1423
- lastClickedEdgeId: string | null;
1424
- focusedNodeId: string | null;
1425
- hoveredNodeId: string | null;
1426
- hoveredEdgeId: string | null;
1427
- dimmed: ReadonlySet<string>;
1428
- previousViews: import('@likec4/core').DiagramView[];
1429
- lastOnNavigate: {
1430
- fromView: import('@likec4/core').ViewID;
1431
- toView: import('@likec4/core').ViewID;
1432
- element: import('@likec4/core').DiagramNode;
1433
- elementCenterScreenPosition: import('@xyflow/system').XYPosition;
1434
- positionCorrected: boolean;
1435
- } | null;
1436
- viewportChanged: boolean;
1437
- onChange: import('..').OnChange | null | undefined;
1438
- onNavigateTo: import('..').OnNavigateTo | null | undefined;
1439
- onNodeClick: import('..').OnNodeClick | null | undefined;
1440
- onNodeContextMenu: import('..').OnNodeClick | null | undefined;
1441
- onCanvasContextMenu: import('..').OnCanvasClick | null | undefined;
1442
- onEdgeClick: import('..').OnEdgeClick | null | undefined;
1443
- onEdgeContextMenu: import('..').OnEdgeClick | null | undefined;
1444
- onCanvasClick: import('..').OnCanvasClick | null | undefined;
1445
- onCanvasDblClick: import('..').OnCanvasClick | null | undefined;
1446
- isDynamicView: () => boolean;
1447
- updateView: (view: import('@likec4/core').DiagramView) => void;
1448
- focusOnNode: (nodeId: string) => void;
1449
- setHoveredNode: (nodeId: string | null) => void;
1450
- setHoveredEdge: (edgeId: string | null) => void;
1451
- setLastClickedNode: (nodeId: string | null) => void;
1452
- setLastClickedEdge: (edgeId: string | null) => void;
1453
- resetLastClicked: () => void;
1454
- getElement: (id: import('@likec4/core').Fqn) => import('@likec4/core').DiagramNode | null;
1455
- triggerOnChange: (changes: import('@likec4/core').NonEmptyArray<import("..").Changes.ChangeElementStyle>) => void;
1456
- triggerOnNavigateTo: (xynodeId: string, event: import('react').MouseEvent<Element, MouseEvent>) => void;
1457
- fitDiagram: (xyStore: {
1458
- getState: () => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1459
- source: string;
1460
- target: string;
1461
- sourceHandle?: string | null;
1462
- targetHandle?: string | null;
1463
- animated?: boolean;
1464
- hidden?: boolean;
1465
- deletable?: boolean;
1466
- selectable?: boolean;
1467
- selected?: boolean;
1468
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1469
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1470
- zIndex?: number;
1471
- ariaLabel?: string;
1472
- interactionWidth?: number;
1473
- label?: import('react').ReactNode;
1474
- labelStyle?: import('react').CSSProperties;
1475
- labelShowBg?: boolean;
1476
- labelBgStyle?: import('react').CSSProperties;
1477
- labelBgPadding?: [number, number];
1478
- labelBgBorderRadius?: number;
1479
- style?: import('react').CSSProperties;
1480
- className?: string;
1481
- updatable?: import('@xyflow/react').EdgeUpdatable;
1482
- focusable?: boolean;
1483
- data: import('..').RelationshipData;
1484
- readonly id: string;
1485
- readonly type: "relationship";
1486
- }>;
1487
- setState: (partial: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1488
- source: string;
1489
- target: string;
1490
- sourceHandle?: string | null;
1491
- targetHandle?: string | null;
1492
- animated?: boolean;
1493
- hidden?: boolean;
1494
- deletable?: boolean;
1495
- selectable?: boolean;
1496
- selected?: boolean;
1497
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1498
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1499
- zIndex?: number;
1500
- ariaLabel?: string;
1501
- interactionWidth?: number;
1502
- label?: import('react').ReactNode;
1503
- labelStyle?: import('react').CSSProperties;
1504
- labelShowBg?: boolean;
1505
- labelBgStyle?: import('react').CSSProperties;
1506
- labelBgPadding?: [number, number];
1507
- labelBgBorderRadius?: number;
1508
- style?: import('react').CSSProperties;
1509
- className?: string;
1510
- updatable?: import('@xyflow/react').EdgeUpdatable;
1511
- focusable?: boolean;
1512
- data: import('..').RelationshipData;
1513
- readonly id: string;
1514
- readonly type: "relationship";
1515
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1516
- source: string;
1517
- target: string;
1518
- sourceHandle?: string | null;
1519
- targetHandle?: string | null;
1520
- animated?: boolean;
1521
- hidden?: boolean;
1522
- deletable?: boolean;
1523
- selectable?: boolean;
1524
- selected?: boolean;
1525
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1526
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1527
- zIndex?: number;
1528
- ariaLabel?: string;
1529
- interactionWidth?: number;
1530
- label?: import('react').ReactNode;
1531
- labelStyle?: import('react').CSSProperties;
1532
- labelShowBg?: boolean;
1533
- labelBgStyle?: import('react').CSSProperties;
1534
- labelBgPadding?: [number, number];
1535
- labelBgBorderRadius?: number;
1536
- style?: import('react').CSSProperties;
1537
- className?: string;
1538
- updatable?: import('@xyflow/react').EdgeUpdatable;
1539
- focusable?: boolean;
1540
- data: import('..').RelationshipData;
1541
- readonly id: string;
1542
- readonly type: "relationship";
1543
- }>> | ((state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1544
- source: string;
1545
- target: string;
1546
- sourceHandle?: string | null;
1547
- targetHandle?: string | null;
1548
- animated?: boolean;
1549
- hidden?: boolean;
1550
- deletable?: boolean;
1551
- selectable?: boolean;
1552
- selected?: boolean;
1553
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1554
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1555
- zIndex?: number;
1556
- ariaLabel?: string;
1557
- interactionWidth?: number;
1558
- label?: import('react').ReactNode;
1559
- labelStyle?: import('react').CSSProperties;
1560
- labelShowBg?: boolean;
1561
- labelBgStyle?: import('react').CSSProperties;
1562
- labelBgPadding?: [number, number];
1563
- labelBgBorderRadius?: number;
1564
- style?: import('react').CSSProperties;
1565
- className?: string;
1566
- updatable?: import('@xyflow/react').EdgeUpdatable;
1567
- focusable?: boolean;
1568
- data: import('..').RelationshipData;
1569
- readonly id: string;
1570
- readonly type: "relationship";
1571
- }>) => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1572
- source: string;
1573
- target: string;
1574
- sourceHandle?: string | null;
1575
- targetHandle?: string | null;
1576
- animated?: boolean;
1577
- hidden?: boolean;
1578
- deletable?: boolean;
1579
- selectable?: boolean;
1580
- selected?: boolean;
1581
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1582
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1583
- zIndex?: number;
1584
- ariaLabel?: string;
1585
- interactionWidth?: number;
1586
- label?: import('react').ReactNode;
1587
- labelStyle?: import('react').CSSProperties;
1588
- labelShowBg?: boolean;
1589
- labelBgStyle?: import('react').CSSProperties;
1590
- labelBgPadding?: [number, number];
1591
- labelBgBorderRadius?: number;
1592
- style?: import('react').CSSProperties;
1593
- className?: string;
1594
- updatable?: import('@xyflow/react').EdgeUpdatable;
1595
- focusable?: boolean;
1596
- data: import('..').RelationshipData;
1597
- readonly id: string;
1598
- readonly type: "relationship";
1599
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1600
- source: string;
1601
- target: string;
1602
- sourceHandle?: string | null;
1603
- targetHandle?: string | null;
1604
- animated?: boolean;
1605
- hidden?: boolean;
1606
- deletable?: boolean;
1607
- selectable?: boolean;
1608
- selected?: boolean;
1609
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1610
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1611
- zIndex?: number;
1612
- ariaLabel?: string;
1613
- interactionWidth?: number;
1614
- label?: import('react').ReactNode;
1615
- labelStyle?: import('react').CSSProperties;
1616
- labelShowBg?: boolean;
1617
- labelBgStyle?: import('react').CSSProperties;
1618
- labelBgPadding?: [number, number];
1619
- labelBgBorderRadius?: number;
1620
- style?: import('react').CSSProperties;
1621
- className?: string;
1622
- updatable?: import('@xyflow/react').EdgeUpdatable;
1623
- focusable?: boolean;
1624
- data: import('..').RelationshipData;
1625
- readonly id: string;
1626
- readonly type: "relationship";
1627
- }>>), replace?: boolean | undefined) => void;
1628
- subscribe: (listener: (state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1629
- source: string;
1630
- target: string;
1631
- sourceHandle?: string | null;
1632
- targetHandle?: string | null;
1633
- animated?: boolean;
1634
- hidden?: boolean;
1635
- deletable?: boolean;
1636
- selectable?: boolean;
1637
- selected?: boolean;
1638
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1639
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1640
- zIndex?: number;
1641
- ariaLabel?: string;
1642
- interactionWidth?: number;
1643
- label?: import('react').ReactNode;
1644
- labelStyle?: import('react').CSSProperties;
1645
- labelShowBg?: boolean;
1646
- labelBgStyle?: import('react').CSSProperties;
1647
- labelBgPadding?: [number, number];
1648
- labelBgBorderRadius?: number;
1649
- style?: import('react').CSSProperties;
1650
- className?: string;
1651
- updatable?: import('@xyflow/react').EdgeUpdatable;
1652
- focusable?: boolean;
1653
- data: import('..').RelationshipData;
1654
- readonly id: string;
1655
- readonly type: "relationship";
1656
- }>, prevState: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1657
- source: string;
1658
- target: string;
1659
- sourceHandle?: string | null;
1660
- targetHandle?: string | null;
1661
- animated?: boolean;
1662
- hidden?: boolean;
1663
- deletable?: boolean;
1664
- selectable?: boolean;
1665
- selected?: boolean;
1666
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1667
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1668
- zIndex?: number;
1669
- ariaLabel?: string;
1670
- interactionWidth?: number;
1671
- label?: import('react').ReactNode;
1672
- labelStyle?: import('react').CSSProperties;
1673
- labelShowBg?: boolean;
1674
- labelBgStyle?: import('react').CSSProperties;
1675
- labelBgPadding?: [number, number];
1676
- labelBgBorderRadius?: number;
1677
- style?: import('react').CSSProperties;
1678
- className?: string;
1679
- updatable?: import('@xyflow/react').EdgeUpdatable;
1680
- focusable?: boolean;
1681
- data: import('..').RelationshipData;
1682
- readonly id: string;
1683
- readonly type: "relationship";
1684
- }>) => void) => () => void;
1685
- }) => void;
1686
- nextDynamicStep: (increment?: number | undefined) => void;
1687
- stopDynamicView: () => void;
1688
- }>), replace?: boolean | undefined, action?: A | undefined) => void;
1689
- subscribe: {
1690
- (listener: (selectedState: {
1691
- view: import('@likec4/core').DiagramView;
1692
- readonly: boolean;
1693
- showElementLinks: boolean;
1694
- fitViewEnabled: boolean;
1695
- fitViewPadding: number;
1696
- zoomable: boolean;
1697
- pannable: boolean;
1698
- nodesDraggable: boolean;
1699
- nodesSelectable: boolean;
1700
- xyflow: import('..').XYFlowInstance;
1701
- initialized: boolean;
1702
- xyflowSynced: boolean;
1703
- activeDynamicViewStep: number | null;
1704
- lastClickedNodeId: string | null;
1705
- lastClickedEdgeId: string | null;
1706
- focusedNodeId: string | null;
1707
- hoveredNodeId: string | null;
1708
- hoveredEdgeId: string | null;
1709
- dimmed: ReadonlySet<string>;
1710
- previousViews: import('@likec4/core').DiagramView[];
1711
- lastOnNavigate: {
1712
- fromView: import('@likec4/core').ViewID;
1713
- toView: import('@likec4/core').ViewID;
1714
- element: import('@likec4/core').DiagramNode;
1715
- elementCenterScreenPosition: import('@xyflow/system').XYPosition;
1716
- positionCorrected: boolean;
1717
- } | null;
1718
- viewportChanged: boolean;
1719
- onChange: import('..').OnChange | null | undefined;
1720
- onNavigateTo: import('..').OnNavigateTo | null | undefined;
1721
- onNodeClick: import('..').OnNodeClick | null | undefined;
1722
- onNodeContextMenu: import('..').OnNodeClick | null | undefined;
1723
- onCanvasContextMenu: import('..').OnCanvasClick | null | undefined;
1724
- onEdgeClick: import('..').OnEdgeClick | null | undefined;
1725
- onEdgeContextMenu: import('..').OnEdgeClick | null | undefined;
1726
- onCanvasClick: import('..').OnCanvasClick | null | undefined;
1727
- onCanvasDblClick: import('..').OnCanvasClick | null | undefined;
1728
- isDynamicView: () => boolean;
1729
- updateView: (view: import('@likec4/core').DiagramView) => void;
1730
- focusOnNode: (nodeId: string) => void;
1731
- setHoveredNode: (nodeId: string | null) => void;
1732
- setHoveredEdge: (edgeId: string | null) => void;
1733
- setLastClickedNode: (nodeId: string | null) => void;
1734
- setLastClickedEdge: (edgeId: string | null) => void;
1735
- resetLastClicked: () => void;
1736
- getElement: (id: import('@likec4/core').Fqn) => import('@likec4/core').DiagramNode | null;
1737
- triggerOnChange: (changes: import('@likec4/core').NonEmptyArray<import("..").Changes.ChangeElementStyle>) => void;
1738
- triggerOnNavigateTo: (xynodeId: string, event: import('react').MouseEvent<Element, MouseEvent>) => void;
1739
- fitDiagram: (xyStore: {
1740
- getState: () => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1741
- source: string;
1742
- target: string;
1743
- sourceHandle?: string | null;
1744
- targetHandle?: string | null;
1745
- animated?: boolean;
1746
- hidden?: boolean;
1747
- deletable?: boolean;
1748
- selectable?: boolean;
1749
- selected?: boolean;
1750
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1751
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1752
- zIndex?: number;
1753
- ariaLabel?: string;
1754
- interactionWidth?: number;
1755
- label?: import('react').ReactNode;
1756
- labelStyle?: import('react').CSSProperties;
1757
- labelShowBg?: boolean;
1758
- labelBgStyle?: import('react').CSSProperties;
1759
- labelBgPadding?: [number, number];
1760
- labelBgBorderRadius?: number;
1761
- style?: import('react').CSSProperties;
1762
- className?: string;
1763
- updatable?: import('@xyflow/react').EdgeUpdatable;
1764
- focusable?: boolean;
1765
- data: import('..').RelationshipData;
1766
- readonly id: string;
1767
- readonly type: "relationship";
1768
- }>;
1769
- setState: (partial: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1770
- source: string;
1771
- target: string;
1772
- sourceHandle?: string | null;
1773
- targetHandle?: string | null;
1774
- animated?: boolean;
1775
- hidden?: boolean;
1776
- deletable?: boolean;
1777
- selectable?: boolean;
1778
- selected?: boolean;
1779
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1780
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1781
- zIndex?: number;
1782
- ariaLabel?: string;
1783
- interactionWidth?: number;
1784
- label?: import('react').ReactNode;
1785
- labelStyle?: import('react').CSSProperties;
1786
- labelShowBg?: boolean;
1787
- labelBgStyle?: import('react').CSSProperties;
1788
- labelBgPadding?: [number, number];
1789
- labelBgBorderRadius?: number;
1790
- style?: import('react').CSSProperties;
1791
- className?: string;
1792
- updatable?: import('@xyflow/react').EdgeUpdatable;
1793
- focusable?: boolean;
1794
- data: import('..').RelationshipData;
1795
- readonly id: string;
1796
- readonly type: "relationship";
1797
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1798
- source: string;
1799
- target: string;
1800
- sourceHandle?: string | null;
1801
- targetHandle?: string | null;
1802
- animated?: boolean;
1803
- hidden?: boolean;
1804
- deletable?: boolean;
1805
- selectable?: boolean;
1806
- selected?: boolean;
1807
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1808
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1809
- zIndex?: number;
1810
- ariaLabel?: string;
1811
- interactionWidth?: number;
1812
- label?: import('react').ReactNode;
1813
- labelStyle?: import('react').CSSProperties;
1814
- labelShowBg?: boolean;
1815
- labelBgStyle?: import('react').CSSProperties;
1816
- labelBgPadding?: [number, number];
1817
- labelBgBorderRadius?: number;
1818
- style?: import('react').CSSProperties;
1819
- className?: string;
1820
- updatable?: import('@xyflow/react').EdgeUpdatable;
1821
- focusable?: boolean;
1822
- data: import('..').RelationshipData;
1823
- readonly id: string;
1824
- readonly type: "relationship";
1825
- }>> | ((state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1826
- source: string;
1827
- target: string;
1828
- sourceHandle?: string | null;
1829
- targetHandle?: string | null;
1830
- animated?: boolean;
1831
- hidden?: boolean;
1832
- deletable?: boolean;
1833
- selectable?: boolean;
1834
- selected?: boolean;
1835
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1836
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1837
- zIndex?: number;
1838
- ariaLabel?: string;
1839
- interactionWidth?: number;
1840
- label?: import('react').ReactNode;
1841
- labelStyle?: import('react').CSSProperties;
1842
- labelShowBg?: boolean;
1843
- labelBgStyle?: import('react').CSSProperties;
1844
- labelBgPadding?: [number, number];
1845
- labelBgBorderRadius?: number;
1846
- style?: import('react').CSSProperties;
1847
- className?: string;
1848
- updatable?: import('@xyflow/react').EdgeUpdatable;
1849
- focusable?: boolean;
1850
- data: import('..').RelationshipData;
1851
- readonly id: string;
1852
- readonly type: "relationship";
1853
- }>) => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1854
- source: string;
1855
- target: string;
1856
- sourceHandle?: string | null;
1857
- targetHandle?: string | null;
1858
- animated?: boolean;
1859
- hidden?: boolean;
1860
- deletable?: boolean;
1861
- selectable?: boolean;
1862
- selected?: boolean;
1863
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1864
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1865
- zIndex?: number;
1866
- ariaLabel?: string;
1867
- interactionWidth?: number;
1868
- label?: import('react').ReactNode;
1869
- labelStyle?: import('react').CSSProperties;
1870
- labelShowBg?: boolean;
1871
- labelBgStyle?: import('react').CSSProperties;
1872
- labelBgPadding?: [number, number];
1873
- labelBgBorderRadius?: number;
1874
- style?: import('react').CSSProperties;
1875
- className?: string;
1876
- updatable?: import('@xyflow/react').EdgeUpdatable;
1877
- focusable?: boolean;
1878
- data: import('..').RelationshipData;
1879
- readonly id: string;
1880
- readonly type: "relationship";
1881
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1882
- source: string;
1883
- target: string;
1884
- sourceHandle?: string | null;
1885
- targetHandle?: string | null;
1886
- animated?: boolean;
1887
- hidden?: boolean;
1888
- deletable?: boolean;
1889
- selectable?: boolean;
1890
- selected?: boolean;
1891
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1892
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1893
- zIndex?: number;
1894
- ariaLabel?: string;
1895
- interactionWidth?: number;
1896
- label?: import('react').ReactNode;
1897
- labelStyle?: import('react').CSSProperties;
1898
- labelShowBg?: boolean;
1899
- labelBgStyle?: import('react').CSSProperties;
1900
- labelBgPadding?: [number, number];
1901
- labelBgBorderRadius?: number;
1902
- style?: import('react').CSSProperties;
1903
- className?: string;
1904
- updatable?: import('@xyflow/react').EdgeUpdatable;
1905
- focusable?: boolean;
1906
- data: import('..').RelationshipData;
1907
- readonly id: string;
1908
- readonly type: "relationship";
1909
- }>>), replace?: boolean | undefined) => void;
1910
- subscribe: (listener: (state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1911
- source: string;
1912
- target: string;
1913
- sourceHandle?: string | null;
1914
- targetHandle?: string | null;
1915
- animated?: boolean;
1916
- hidden?: boolean;
1917
- deletable?: boolean;
1918
- selectable?: boolean;
1919
- selected?: boolean;
1920
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1921
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1922
- zIndex?: number;
1923
- ariaLabel?: string;
1924
- interactionWidth?: number;
1925
- label?: import('react').ReactNode;
1926
- labelStyle?: import('react').CSSProperties;
1927
- labelShowBg?: boolean;
1928
- labelBgStyle?: import('react').CSSProperties;
1929
- labelBgPadding?: [number, number];
1930
- labelBgBorderRadius?: number;
1931
- style?: import('react').CSSProperties;
1932
- className?: string;
1933
- updatable?: import('@xyflow/react').EdgeUpdatable;
1934
- focusable?: boolean;
1935
- data: import('..').RelationshipData;
1936
- readonly id: string;
1937
- readonly type: "relationship";
1938
- }>, prevState: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
1939
- source: string;
1940
- target: string;
1941
- sourceHandle?: string | null;
1942
- targetHandle?: string | null;
1943
- animated?: boolean;
1944
- hidden?: boolean;
1945
- deletable?: boolean;
1946
- selectable?: boolean;
1947
- selected?: boolean;
1948
- markerStart?: import('@xyflow/system').EdgeMarkerType;
1949
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
1950
- zIndex?: number;
1951
- ariaLabel?: string;
1952
- interactionWidth?: number;
1953
- label?: import('react').ReactNode;
1954
- labelStyle?: import('react').CSSProperties;
1955
- labelShowBg?: boolean;
1956
- labelBgStyle?: import('react').CSSProperties;
1957
- labelBgPadding?: [number, number];
1958
- labelBgBorderRadius?: number;
1959
- style?: import('react').CSSProperties;
1960
- className?: string;
1961
- updatable?: import('@xyflow/react').EdgeUpdatable;
1962
- focusable?: boolean;
1963
- data: import('..').RelationshipData;
1964
- readonly id: string;
1965
- readonly type: "relationship";
1966
- }>) => void) => () => void;
1967
- }) => void;
1968
- nextDynamicStep: (increment?: number | undefined) => void;
1969
- stopDynamicView: () => void;
1970
- }, previousSelectedState: {
1971
- view: import('@likec4/core').DiagramView;
1972
- readonly: boolean;
1973
- showElementLinks: boolean;
1974
- fitViewEnabled: boolean;
1975
- fitViewPadding: number;
1976
- zoomable: boolean;
1977
- pannable: boolean;
1978
- nodesDraggable: boolean;
1979
- nodesSelectable: boolean;
1980
- xyflow: import('..').XYFlowInstance;
1981
- initialized: boolean;
1982
- xyflowSynced: boolean;
1983
- activeDynamicViewStep: number | null;
1984
- lastClickedNodeId: string | null;
1985
- lastClickedEdgeId: string | null;
1986
- focusedNodeId: string | null;
1987
- hoveredNodeId: string | null;
1988
- hoveredEdgeId: string | null;
1989
- dimmed: ReadonlySet<string>;
1990
- previousViews: import('@likec4/core').DiagramView[];
1991
- lastOnNavigate: {
1992
- fromView: import('@likec4/core').ViewID;
1993
- toView: import('@likec4/core').ViewID;
1994
- element: import('@likec4/core').DiagramNode;
1995
- elementCenterScreenPosition: import('@xyflow/system').XYPosition;
1996
- positionCorrected: boolean;
1997
- } | null;
1998
- viewportChanged: boolean;
1999
- onChange: import('..').OnChange | null | undefined;
2000
- onNavigateTo: import('..').OnNavigateTo | null | undefined;
2001
- onNodeClick: import('..').OnNodeClick | null | undefined;
2002
- onNodeContextMenu: import('..').OnNodeClick | null | undefined;
2003
- onCanvasContextMenu: import('..').OnCanvasClick | null | undefined;
2004
- onEdgeClick: import('..').OnEdgeClick | null | undefined;
2005
- onEdgeContextMenu: import('..').OnEdgeClick | null | undefined;
2006
- onCanvasClick: import('..').OnCanvasClick | null | undefined;
2007
- onCanvasDblClick: import('..').OnCanvasClick | null | undefined;
2008
- isDynamicView: () => boolean;
2009
- updateView: (view: import('@likec4/core').DiagramView) => void;
2010
- focusOnNode: (nodeId: string) => void;
2011
- setHoveredNode: (nodeId: string | null) => void;
2012
- setHoveredEdge: (edgeId: string | null) => void;
2013
- setLastClickedNode: (nodeId: string | null) => void;
2014
- setLastClickedEdge: (edgeId: string | null) => void;
2015
- resetLastClicked: () => void;
2016
- getElement: (id: import('@likec4/core').Fqn) => import('@likec4/core').DiagramNode | null;
2017
- triggerOnChange: (changes: import('@likec4/core').NonEmptyArray<import("..").Changes.ChangeElementStyle>) => void;
2018
- triggerOnNavigateTo: (xynodeId: string, event: import('react').MouseEvent<Element, MouseEvent>) => void;
2019
- fitDiagram: (xyStore: {
2020
- getState: () => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2021
- source: string;
2022
- target: string;
2023
- sourceHandle?: string | null;
2024
- targetHandle?: string | null;
2025
- animated?: boolean;
2026
- hidden?: boolean;
2027
- deletable?: boolean;
2028
- selectable?: boolean;
2029
- selected?: boolean;
2030
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2031
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2032
- zIndex?: number;
2033
- ariaLabel?: string;
2034
- interactionWidth?: number;
2035
- label?: import('react').ReactNode;
2036
- labelStyle?: import('react').CSSProperties;
2037
- labelShowBg?: boolean;
2038
- labelBgStyle?: import('react').CSSProperties;
2039
- labelBgPadding?: [number, number];
2040
- labelBgBorderRadius?: number;
2041
- style?: import('react').CSSProperties;
2042
- className?: string;
2043
- updatable?: import('@xyflow/react').EdgeUpdatable;
2044
- focusable?: boolean;
2045
- data: import('..').RelationshipData;
2046
- readonly id: string;
2047
- readonly type: "relationship";
2048
- }>;
2049
- setState: (partial: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2050
- source: string;
2051
- target: string;
2052
- sourceHandle?: string | null;
2053
- targetHandle?: string | null;
2054
- animated?: boolean;
2055
- hidden?: boolean;
2056
- deletable?: boolean;
2057
- selectable?: boolean;
2058
- selected?: boolean;
2059
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2060
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2061
- zIndex?: number;
2062
- ariaLabel?: string;
2063
- interactionWidth?: number;
2064
- label?: import('react').ReactNode;
2065
- labelStyle?: import('react').CSSProperties;
2066
- labelShowBg?: boolean;
2067
- labelBgStyle?: import('react').CSSProperties;
2068
- labelBgPadding?: [number, number];
2069
- labelBgBorderRadius?: number;
2070
- style?: import('react').CSSProperties;
2071
- className?: string;
2072
- updatable?: import('@xyflow/react').EdgeUpdatable;
2073
- focusable?: boolean;
2074
- data: import('..').RelationshipData;
2075
- readonly id: string;
2076
- readonly type: "relationship";
2077
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2078
- source: string;
2079
- target: string;
2080
- sourceHandle?: string | null;
2081
- targetHandle?: string | null;
2082
- animated?: boolean;
2083
- hidden?: boolean;
2084
- deletable?: boolean;
2085
- selectable?: boolean;
2086
- selected?: boolean;
2087
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2088
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2089
- zIndex?: number;
2090
- ariaLabel?: string;
2091
- interactionWidth?: number;
2092
- label?: import('react').ReactNode;
2093
- labelStyle?: import('react').CSSProperties;
2094
- labelShowBg?: boolean;
2095
- labelBgStyle?: import('react').CSSProperties;
2096
- labelBgPadding?: [number, number];
2097
- labelBgBorderRadius?: number;
2098
- style?: import('react').CSSProperties;
2099
- className?: string;
2100
- updatable?: import('@xyflow/react').EdgeUpdatable;
2101
- focusable?: boolean;
2102
- data: import('..').RelationshipData;
2103
- readonly id: string;
2104
- readonly type: "relationship";
2105
- }>> | ((state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2106
- source: string;
2107
- target: string;
2108
- sourceHandle?: string | null;
2109
- targetHandle?: string | null;
2110
- animated?: boolean;
2111
- hidden?: boolean;
2112
- deletable?: boolean;
2113
- selectable?: boolean;
2114
- selected?: boolean;
2115
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2116
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2117
- zIndex?: number;
2118
- ariaLabel?: string;
2119
- interactionWidth?: number;
2120
- label?: import('react').ReactNode;
2121
- labelStyle?: import('react').CSSProperties;
2122
- labelShowBg?: boolean;
2123
- labelBgStyle?: import('react').CSSProperties;
2124
- labelBgPadding?: [number, number];
2125
- labelBgBorderRadius?: number;
2126
- style?: import('react').CSSProperties;
2127
- className?: string;
2128
- updatable?: import('@xyflow/react').EdgeUpdatable;
2129
- focusable?: boolean;
2130
- data: import('..').RelationshipData;
2131
- readonly id: string;
2132
- readonly type: "relationship";
2133
- }>) => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2134
- source: string;
2135
- target: string;
2136
- sourceHandle?: string | null;
2137
- targetHandle?: string | null;
2138
- animated?: boolean;
2139
- hidden?: boolean;
2140
- deletable?: boolean;
2141
- selectable?: boolean;
2142
- selected?: boolean;
2143
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2144
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2145
- zIndex?: number;
2146
- ariaLabel?: string;
2147
- interactionWidth?: number;
2148
- label?: import('react').ReactNode;
2149
- labelStyle?: import('react').CSSProperties;
2150
- labelShowBg?: boolean;
2151
- labelBgStyle?: import('react').CSSProperties;
2152
- labelBgPadding?: [number, number];
2153
- labelBgBorderRadius?: number;
2154
- style?: import('react').CSSProperties;
2155
- className?: string;
2156
- updatable?: import('@xyflow/react').EdgeUpdatable;
2157
- focusable?: boolean;
2158
- data: import('..').RelationshipData;
2159
- readonly id: string;
2160
- readonly type: "relationship";
2161
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2162
- source: string;
2163
- target: string;
2164
- sourceHandle?: string | null;
2165
- targetHandle?: string | null;
2166
- animated?: boolean;
2167
- hidden?: boolean;
2168
- deletable?: boolean;
2169
- selectable?: boolean;
2170
- selected?: boolean;
2171
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2172
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2173
- zIndex?: number;
2174
- ariaLabel?: string;
2175
- interactionWidth?: number;
2176
- label?: import('react').ReactNode;
2177
- labelStyle?: import('react').CSSProperties;
2178
- labelShowBg?: boolean;
2179
- labelBgStyle?: import('react').CSSProperties;
2180
- labelBgPadding?: [number, number];
2181
- labelBgBorderRadius?: number;
2182
- style?: import('react').CSSProperties;
2183
- className?: string;
2184
- updatable?: import('@xyflow/react').EdgeUpdatable;
2185
- focusable?: boolean;
2186
- data: import('..').RelationshipData;
2187
- readonly id: string;
2188
- readonly type: "relationship";
2189
- }>>), replace?: boolean | undefined) => void;
2190
- subscribe: (listener: (state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2191
- source: string;
2192
- target: string;
2193
- sourceHandle?: string | null;
2194
- targetHandle?: string | null;
2195
- animated?: boolean;
2196
- hidden?: boolean;
2197
- deletable?: boolean;
2198
- selectable?: boolean;
2199
- selected?: boolean;
2200
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2201
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2202
- zIndex?: number;
2203
- ariaLabel?: string;
2204
- interactionWidth?: number;
2205
- label?: import('react').ReactNode;
2206
- labelStyle?: import('react').CSSProperties;
2207
- labelShowBg?: boolean;
2208
- labelBgStyle?: import('react').CSSProperties;
2209
- labelBgPadding?: [number, number];
2210
- labelBgBorderRadius?: number;
2211
- style?: import('react').CSSProperties;
2212
- className?: string;
2213
- updatable?: import('@xyflow/react').EdgeUpdatable;
2214
- focusable?: boolean;
2215
- data: import('..').RelationshipData;
2216
- readonly id: string;
2217
- readonly type: "relationship";
2218
- }>, prevState: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2219
- source: string;
2220
- target: string;
2221
- sourceHandle?: string | null;
2222
- targetHandle?: string | null;
2223
- animated?: boolean;
2224
- hidden?: boolean;
2225
- deletable?: boolean;
2226
- selectable?: boolean;
2227
- selected?: boolean;
2228
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2229
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2230
- zIndex?: number;
2231
- ariaLabel?: string;
2232
- interactionWidth?: number;
2233
- label?: import('react').ReactNode;
2234
- labelStyle?: import('react').CSSProperties;
2235
- labelShowBg?: boolean;
2236
- labelBgStyle?: import('react').CSSProperties;
2237
- labelBgPadding?: [number, number];
2238
- labelBgBorderRadius?: number;
2239
- style?: import('react').CSSProperties;
2240
- className?: string;
2241
- updatable?: import('@xyflow/react').EdgeUpdatable;
2242
- focusable?: boolean;
2243
- data: import('..').RelationshipData;
2244
- readonly id: string;
2245
- readonly type: "relationship";
2246
- }>) => void) => () => void;
2247
- }) => void;
2248
- nextDynamicStep: (increment?: number | undefined) => void;
2249
- stopDynamicView: () => void;
2250
- }) => void): () => void;
2251
- <U>(selector: (state: {
2252
- view: import('@likec4/core').DiagramView;
2253
- readonly: boolean;
2254
- showElementLinks: boolean;
2255
- fitViewEnabled: boolean;
2256
- fitViewPadding: number;
2257
- zoomable: boolean;
2258
- pannable: boolean;
2259
- nodesDraggable: boolean;
2260
- nodesSelectable: boolean;
2261
- xyflow: import('..').XYFlowInstance;
2262
- initialized: boolean;
2263
- xyflowSynced: boolean;
2264
- activeDynamicViewStep: number | null;
2265
- lastClickedNodeId: string | null;
2266
- lastClickedEdgeId: string | null;
2267
- focusedNodeId: string | null;
2268
- hoveredNodeId: string | null;
2269
- hoveredEdgeId: string | null;
2270
- dimmed: ReadonlySet<string>;
2271
- previousViews: import('@likec4/core').DiagramView[];
2272
- lastOnNavigate: {
2273
- fromView: import('@likec4/core').ViewID;
2274
- toView: import('@likec4/core').ViewID;
2275
- element: import('@likec4/core').DiagramNode;
2276
- elementCenterScreenPosition: import('@xyflow/system').XYPosition;
2277
- positionCorrected: boolean;
2278
- } | null;
2279
- viewportChanged: boolean;
2280
- onChange: import('..').OnChange | null | undefined;
2281
- onNavigateTo: import('..').OnNavigateTo | null | undefined;
2282
- onNodeClick: import('..').OnNodeClick | null | undefined;
2283
- onNodeContextMenu: import('..').OnNodeClick | null | undefined;
2284
- onCanvasContextMenu: import('..').OnCanvasClick | null | undefined;
2285
- onEdgeClick: import('..').OnEdgeClick | null | undefined;
2286
- onEdgeContextMenu: import('..').OnEdgeClick | null | undefined;
2287
- onCanvasClick: import('..').OnCanvasClick | null | undefined;
2288
- onCanvasDblClick: import('..').OnCanvasClick | null | undefined;
2289
- isDynamicView: () => boolean;
2290
- updateView: (view: import('@likec4/core').DiagramView) => void;
2291
- focusOnNode: (nodeId: string) => void;
2292
- setHoveredNode: (nodeId: string | null) => void;
2293
- setHoveredEdge: (edgeId: string | null) => void;
2294
- setLastClickedNode: (nodeId: string | null) => void;
2295
- setLastClickedEdge: (edgeId: string | null) => void;
2296
- resetLastClicked: () => void;
2297
- getElement: (id: import('@likec4/core').Fqn) => import('@likec4/core').DiagramNode | null;
2298
- triggerOnChange: (changes: import('@likec4/core').NonEmptyArray<import("..").Changes.ChangeElementStyle>) => void;
2299
- triggerOnNavigateTo: (xynodeId: string, event: import('react').MouseEvent<Element, MouseEvent>) => void;
2300
- fitDiagram: (xyStore: {
2301
- getState: () => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2302
- source: string;
2303
- target: string;
2304
- sourceHandle?: string | null;
2305
- targetHandle?: string | null;
2306
- animated?: boolean;
2307
- hidden?: boolean;
2308
- deletable?: boolean;
2309
- selectable?: boolean;
2310
- selected?: boolean;
2311
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2312
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2313
- zIndex?: number;
2314
- ariaLabel?: string;
2315
- interactionWidth?: number;
2316
- label?: import('react').ReactNode;
2317
- labelStyle?: import('react').CSSProperties;
2318
- labelShowBg?: boolean;
2319
- labelBgStyle?: import('react').CSSProperties;
2320
- labelBgPadding?: [number, number];
2321
- labelBgBorderRadius?: number;
2322
- style?: import('react').CSSProperties;
2323
- className?: string;
2324
- updatable?: import('@xyflow/react').EdgeUpdatable;
2325
- focusable?: boolean;
2326
- data: import('..').RelationshipData;
2327
- readonly id: string;
2328
- readonly type: "relationship";
2329
- }>;
2330
- setState: (partial: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2331
- source: string;
2332
- target: string;
2333
- sourceHandle?: string | null;
2334
- targetHandle?: string | null;
2335
- animated?: boolean;
2336
- hidden?: boolean;
2337
- deletable?: boolean;
2338
- selectable?: boolean;
2339
- selected?: boolean;
2340
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2341
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2342
- zIndex?: number;
2343
- ariaLabel?: string;
2344
- interactionWidth?: number;
2345
- label?: import('react').ReactNode;
2346
- labelStyle?: import('react').CSSProperties;
2347
- labelShowBg?: boolean;
2348
- labelBgStyle?: import('react').CSSProperties;
2349
- labelBgPadding?: [number, number];
2350
- labelBgBorderRadius?: number;
2351
- style?: import('react').CSSProperties;
2352
- className?: string;
2353
- updatable?: import('@xyflow/react').EdgeUpdatable;
2354
- focusable?: boolean;
2355
- data: import('..').RelationshipData;
2356
- readonly id: string;
2357
- readonly type: "relationship";
2358
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2359
- source: string;
2360
- target: string;
2361
- sourceHandle?: string | null;
2362
- targetHandle?: string | null;
2363
- animated?: boolean;
2364
- hidden?: boolean;
2365
- deletable?: boolean;
2366
- selectable?: boolean;
2367
- selected?: boolean;
2368
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2369
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2370
- zIndex?: number;
2371
- ariaLabel?: string;
2372
- interactionWidth?: number;
2373
- label?: import('react').ReactNode;
2374
- labelStyle?: import('react').CSSProperties;
2375
- labelShowBg?: boolean;
2376
- labelBgStyle?: import('react').CSSProperties;
2377
- labelBgPadding?: [number, number];
2378
- labelBgBorderRadius?: number;
2379
- style?: import('react').CSSProperties;
2380
- className?: string;
2381
- updatable?: import('@xyflow/react').EdgeUpdatable;
2382
- focusable?: boolean;
2383
- data: import('..').RelationshipData;
2384
- readonly id: string;
2385
- readonly type: "relationship";
2386
- }>> | ((state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2387
- source: string;
2388
- target: string;
2389
- sourceHandle?: string | null;
2390
- targetHandle?: string | null;
2391
- animated?: boolean;
2392
- hidden?: boolean;
2393
- deletable?: boolean;
2394
- selectable?: boolean;
2395
- selected?: boolean;
2396
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2397
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2398
- zIndex?: number;
2399
- ariaLabel?: string;
2400
- interactionWidth?: number;
2401
- label?: import('react').ReactNode;
2402
- labelStyle?: import('react').CSSProperties;
2403
- labelShowBg?: boolean;
2404
- labelBgStyle?: import('react').CSSProperties;
2405
- labelBgPadding?: [number, number];
2406
- labelBgBorderRadius?: number;
2407
- style?: import('react').CSSProperties;
2408
- className?: string;
2409
- updatable?: import('@xyflow/react').EdgeUpdatable;
2410
- focusable?: boolean;
2411
- data: import('..').RelationshipData;
2412
- readonly id: string;
2413
- readonly type: "relationship";
2414
- }>) => import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2415
- source: string;
2416
- target: string;
2417
- sourceHandle?: string | null;
2418
- targetHandle?: string | null;
2419
- animated?: boolean;
2420
- hidden?: boolean;
2421
- deletable?: boolean;
2422
- selectable?: boolean;
2423
- selected?: boolean;
2424
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2425
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2426
- zIndex?: number;
2427
- ariaLabel?: string;
2428
- interactionWidth?: number;
2429
- label?: import('react').ReactNode;
2430
- labelStyle?: import('react').CSSProperties;
2431
- labelShowBg?: boolean;
2432
- labelBgStyle?: import('react').CSSProperties;
2433
- labelBgPadding?: [number, number];
2434
- labelBgBorderRadius?: number;
2435
- style?: import('react').CSSProperties;
2436
- className?: string;
2437
- updatable?: import('@xyflow/react').EdgeUpdatable;
2438
- focusable?: boolean;
2439
- data: import('..').RelationshipData;
2440
- readonly id: string;
2441
- readonly type: "relationship";
2442
- }> | Partial<import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2443
- source: string;
2444
- target: string;
2445
- sourceHandle?: string | null;
2446
- targetHandle?: string | null;
2447
- animated?: boolean;
2448
- hidden?: boolean;
2449
- deletable?: boolean;
2450
- selectable?: boolean;
2451
- selected?: boolean;
2452
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2453
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2454
- zIndex?: number;
2455
- ariaLabel?: string;
2456
- interactionWidth?: number;
2457
- label?: import('react').ReactNode;
2458
- labelStyle?: import('react').CSSProperties;
2459
- labelShowBg?: boolean;
2460
- labelBgStyle?: import('react').CSSProperties;
2461
- labelBgPadding?: [number, number];
2462
- labelBgBorderRadius?: number;
2463
- style?: import('react').CSSProperties;
2464
- className?: string;
2465
- updatable?: import('@xyflow/react').EdgeUpdatable;
2466
- focusable?: boolean;
2467
- data: import('..').RelationshipData;
2468
- readonly id: string;
2469
- readonly type: "relationship";
2470
- }>>), replace?: boolean | undefined) => void;
2471
- subscribe: (listener: (state: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2472
- source: string;
2473
- target: string;
2474
- sourceHandle?: string | null;
2475
- targetHandle?: string | null;
2476
- animated?: boolean;
2477
- hidden?: boolean;
2478
- deletable?: boolean;
2479
- selectable?: boolean;
2480
- selected?: boolean;
2481
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2482
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2483
- zIndex?: number;
2484
- ariaLabel?: string;
2485
- interactionWidth?: number;
2486
- label?: import('react').ReactNode;
2487
- labelStyle?: import('react').CSSProperties;
2488
- labelShowBg?: boolean;
2489
- labelBgStyle?: import('react').CSSProperties;
2490
- labelBgPadding?: [number, number];
2491
- labelBgBorderRadius?: number;
2492
- style?: import('react').CSSProperties;
2493
- className?: string;
2494
- updatable?: import('@xyflow/react').EdgeUpdatable;
2495
- focusable?: boolean;
2496
- data: import('..').RelationshipData;
2497
- readonly id: string;
2498
- readonly type: "relationship";
2499
- }>, prevState: import('@xyflow/react').ReactFlowState<import('..').XYFlowNode, {
2500
- source: string;
2501
- target: string;
2502
- sourceHandle?: string | null;
2503
- targetHandle?: string | null;
2504
- animated?: boolean;
2505
- hidden?: boolean;
2506
- deletable?: boolean;
2507
- selectable?: boolean;
2508
- selected?: boolean;
2509
- markerStart?: import('@xyflow/system').EdgeMarkerType;
2510
- markerEnd?: import('@xyflow/system').EdgeMarkerType;
2511
- zIndex?: number;
2512
- ariaLabel?: string;
2513
- interactionWidth?: number;
2514
- label?: import('react').ReactNode;
2515
- labelStyle?: import('react').CSSProperties;
2516
- labelShowBg?: boolean;
2517
- labelBgStyle?: import('react').CSSProperties;
2518
- labelBgPadding?: [number, number];
2519
- labelBgBorderRadius?: number;
2520
- style?: import('react').CSSProperties;
2521
- className?: string;
2522
- updatable?: import('@xyflow/react').EdgeUpdatable;
2523
- focusable?: boolean;
2524
- data: import('..').RelationshipData;
2525
- readonly id: string;
2526
- readonly type: "relationship";
2527
- }>) => void) => () => void;
2528
- }) => void;
2529
- nextDynamicStep: (increment?: number | undefined) => void;
2530
- stopDynamicView: () => void;
2531
- }) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
2532
- equalityFn?: (a: U, b: U) => boolean;
2533
- fireImmediately?: boolean;
2534
- } | undefined): () => void;
2535
- };
2536
- };
2537
- export type DiagramStoreApi = ReturnType<typeof useDiagramStoreApi>;
5
+ export type DiagramStoreApi = Readonly<Pick<DiagramZustandStore, 'getState' | 'setState' | 'subscribe'>>;
6
+ declare function useDiagramStoreApi(): DiagramStoreApi;
2538
7
  export { useDiagramState, useDiagramStoreApi };