@particle-academy/fancy-flow 0.3.0 → 0.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 (41) hide show
  1. package/dist/{chunk-DDHKYIH2.js → chunk-2BZ6OE5H.js} +229 -435
  2. package/dist/chunk-2BZ6OE5H.js.map +1 -0
  3. package/dist/{chunk-FGUJNX65.js → chunk-35OXF6W3.js} +3 -3
  4. package/dist/{chunk-FGUJNX65.js.map → chunk-35OXF6W3.js.map} +1 -1
  5. package/dist/chunk-4PZQRN5Y.js +114 -0
  6. package/dist/chunk-4PZQRN5Y.js.map +1 -0
  7. package/dist/chunk-DW66NGU5.js +138 -0
  8. package/dist/chunk-DW66NGU5.js.map +1 -0
  9. package/dist/{chunk-YPINKH2D.js → engine.cjs} +4 -111
  10. package/dist/engine.cjs.map +1 -0
  11. package/dist/engine.d.cts +35 -0
  12. package/dist/engine.d.ts +35 -0
  13. package/dist/engine.js +3 -0
  14. package/dist/engine.js.map +1 -0
  15. package/dist/index.cjs +227 -464
  16. package/dist/index.cjs.map +1 -1
  17. package/dist/index.css +1 -0
  18. package/dist/index.css.map +1 -1
  19. package/dist/index.d.cts +19 -19
  20. package/dist/index.d.ts +19 -19
  21. package/dist/index.js +6 -6
  22. package/dist/registry/index.d.cts +2 -3
  23. package/dist/registry/index.d.ts +2 -3
  24. package/dist/registry.cjs +225 -462
  25. package/dist/registry.cjs.map +1 -1
  26. package/dist/registry.js +2 -3
  27. package/dist/runtime/index.d.cts +4 -32
  28. package/dist/runtime/index.d.ts +4 -32
  29. package/dist/runtime.cjs +226 -463
  30. package/dist/runtime.cjs.map +1 -1
  31. package/dist/runtime.js +3 -3
  32. package/dist/schema/index.d.cts +1 -1
  33. package/dist/schema/index.d.ts +1 -1
  34. package/dist/schema.js +0 -1
  35. package/dist/{types-Ch4sAvum.d.cts → types-TemTtb04.d.cts} +1 -1
  36. package/dist/{types-Ch4sAvum.d.ts → types-TemTtb04.d.ts} +1 -1
  37. package/package.json +46 -9
  38. package/dist/chunk-7D4SUZUM.js +0 -35
  39. package/dist/chunk-7D4SUZUM.js.map +0 -1
  40. package/dist/chunk-DDHKYIH2.js.map +0 -1
  41. package/dist/chunk-YPINKH2D.js.map +0 -1
@@ -1,279 +1,7 @@
1
- import { __commonJS, __require, __toESM } from './chunk-7D4SUZUM.js';
2
1
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
3
- import ReactExports, { createContext, forwardRef, memo, useMemo, useState, useRef, useEffect, useCallback, useContext, useLayoutEffect } from 'react';
2
+ import ReactExports, { createContext, forwardRef, memo, useMemo, useState, useRef, useEffect, useCallback, useContext, useSyncExternalStore, useDebugValue, useLayoutEffect } from 'react';
4
3
  import 'react-dom';
5
4
 
6
- // node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.production.js
7
- var require_use_sync_external_store_shim_production = __commonJS({
8
- "node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.production.js"(exports) {
9
- var React = __require("react");
10
- function is(x, y) {
11
- return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
12
- }
13
- var objectIs = "function" === typeof Object.is ? Object.is : is;
14
- var useState2 = React.useState;
15
- var useEffect2 = React.useEffect;
16
- var useLayoutEffect2 = React.useLayoutEffect;
17
- var useDebugValue2 = React.useDebugValue;
18
- function useSyncExternalStore$2(subscribe, getSnapshot) {
19
- var value = getSnapshot(), _useState = useState2({ inst: { value, getSnapshot } }), inst = _useState[0].inst, forceUpdate = _useState[1];
20
- useLayoutEffect2(
21
- function() {
22
- inst.value = value;
23
- inst.getSnapshot = getSnapshot;
24
- checkIfSnapshotChanged(inst) && forceUpdate({ inst });
25
- },
26
- [subscribe, value, getSnapshot]
27
- );
28
- useEffect2(
29
- function() {
30
- checkIfSnapshotChanged(inst) && forceUpdate({ inst });
31
- return subscribe(function() {
32
- checkIfSnapshotChanged(inst) && forceUpdate({ inst });
33
- });
34
- },
35
- [subscribe]
36
- );
37
- useDebugValue2(value);
38
- return value;
39
- }
40
- function checkIfSnapshotChanged(inst) {
41
- var latestGetSnapshot = inst.getSnapshot;
42
- inst = inst.value;
43
- try {
44
- var nextValue = latestGetSnapshot();
45
- return !objectIs(inst, nextValue);
46
- } catch (error) {
47
- return true;
48
- }
49
- }
50
- function useSyncExternalStore$1(subscribe, getSnapshot) {
51
- return getSnapshot();
52
- }
53
- var shim = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2;
54
- exports.useSyncExternalStore = void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
55
- }
56
- });
57
-
58
- // node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js
59
- var require_use_sync_external_store_shim_development = __commonJS({
60
- "node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js"(exports) {
61
- "production" !== process.env.NODE_ENV && (function() {
62
- function is(x, y) {
63
- return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
64
- }
65
- function useSyncExternalStore$2(subscribe, getSnapshot) {
66
- didWarnOld18Alpha || void 0 === React.startTransition || (didWarnOld18Alpha = true, console.error(
67
- "You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."
68
- ));
69
- var value = getSnapshot();
70
- if (!didWarnUncachedGetSnapshot) {
71
- var cachedValue = getSnapshot();
72
- objectIs(value, cachedValue) || (console.error(
73
- "The result of getSnapshot should be cached to avoid an infinite loop"
74
- ), didWarnUncachedGetSnapshot = true);
75
- }
76
- cachedValue = useState2({
77
- inst: { value, getSnapshot }
78
- });
79
- var inst = cachedValue[0].inst, forceUpdate = cachedValue[1];
80
- useLayoutEffect2(
81
- function() {
82
- inst.value = value;
83
- inst.getSnapshot = getSnapshot;
84
- checkIfSnapshotChanged(inst) && forceUpdate({ inst });
85
- },
86
- [subscribe, value, getSnapshot]
87
- );
88
- useEffect2(
89
- function() {
90
- checkIfSnapshotChanged(inst) && forceUpdate({ inst });
91
- return subscribe(function() {
92
- checkIfSnapshotChanged(inst) && forceUpdate({ inst });
93
- });
94
- },
95
- [subscribe]
96
- );
97
- useDebugValue2(value);
98
- return value;
99
- }
100
- function checkIfSnapshotChanged(inst) {
101
- var latestGetSnapshot = inst.getSnapshot;
102
- inst = inst.value;
103
- try {
104
- var nextValue = latestGetSnapshot();
105
- return !objectIs(inst, nextValue);
106
- } catch (error) {
107
- return true;
108
- }
109
- }
110
- function useSyncExternalStore$1(subscribe, getSnapshot) {
111
- return getSnapshot();
112
- }
113
- "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
114
- var React = __require("react"), objectIs = "function" === typeof Object.is ? Object.is : is, useState2 = React.useState, useEffect2 = React.useEffect, useLayoutEffect2 = React.useLayoutEffect, useDebugValue2 = React.useDebugValue, didWarnOld18Alpha = false, didWarnUncachedGetSnapshot = false, shim = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2;
115
- exports.useSyncExternalStore = void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
116
- "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
117
- })();
118
- }
119
- });
120
-
121
- // node_modules/use-sync-external-store/shim/index.js
122
- var require_shim = __commonJS({
123
- "node_modules/use-sync-external-store/shim/index.js"(exports, module) {
124
- if (process.env.NODE_ENV === "production") {
125
- module.exports = require_use_sync_external_store_shim_production();
126
- } else {
127
- module.exports = require_use_sync_external_store_shim_development();
128
- }
129
- }
130
- });
131
-
132
- // node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.production.js
133
- var require_with_selector_production = __commonJS({
134
- "node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.production.js"(exports) {
135
- var React = __require("react");
136
- var shim = require_shim();
137
- function is(x, y) {
138
- return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
139
- }
140
- var objectIs = "function" === typeof Object.is ? Object.is : is;
141
- var useSyncExternalStore = shim.useSyncExternalStore;
142
- var useRef2 = React.useRef;
143
- var useEffect2 = React.useEffect;
144
- var useMemo2 = React.useMemo;
145
- var useDebugValue2 = React.useDebugValue;
146
- exports.useSyncExternalStoreWithSelector = function(subscribe, getSnapshot, getServerSnapshot, selector, isEqual) {
147
- var instRef = useRef2(null);
148
- if (null === instRef.current) {
149
- var inst = { hasValue: false, value: null };
150
- instRef.current = inst;
151
- } else inst = instRef.current;
152
- instRef = useMemo2(
153
- function() {
154
- function memoizedSelector(nextSnapshot) {
155
- if (!hasMemo) {
156
- hasMemo = true;
157
- memoizedSnapshot = nextSnapshot;
158
- nextSnapshot = selector(nextSnapshot);
159
- if (void 0 !== isEqual && inst.hasValue) {
160
- var currentSelection = inst.value;
161
- if (isEqual(currentSelection, nextSnapshot))
162
- return memoizedSelection = currentSelection;
163
- }
164
- return memoizedSelection = nextSnapshot;
165
- }
166
- currentSelection = memoizedSelection;
167
- if (objectIs(memoizedSnapshot, nextSnapshot)) return currentSelection;
168
- var nextSelection = selector(nextSnapshot);
169
- if (void 0 !== isEqual && isEqual(currentSelection, nextSelection))
170
- return memoizedSnapshot = nextSnapshot, currentSelection;
171
- memoizedSnapshot = nextSnapshot;
172
- return memoizedSelection = nextSelection;
173
- }
174
- var hasMemo = false, memoizedSnapshot, memoizedSelection, maybeGetServerSnapshot = void 0 === getServerSnapshot ? null : getServerSnapshot;
175
- return [
176
- function() {
177
- return memoizedSelector(getSnapshot());
178
- },
179
- null === maybeGetServerSnapshot ? void 0 : function() {
180
- return memoizedSelector(maybeGetServerSnapshot());
181
- }
182
- ];
183
- },
184
- [getSnapshot, getServerSnapshot, selector, isEqual]
185
- );
186
- var value = useSyncExternalStore(subscribe, instRef[0], instRef[1]);
187
- useEffect2(
188
- function() {
189
- inst.hasValue = true;
190
- inst.value = value;
191
- },
192
- [value]
193
- );
194
- useDebugValue2(value);
195
- return value;
196
- };
197
- }
198
- });
199
-
200
- // node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js
201
- var require_with_selector_development = __commonJS({
202
- "node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js"(exports) {
203
- "production" !== process.env.NODE_ENV && (function() {
204
- function is(x, y) {
205
- return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
206
- }
207
- "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
208
- var React = __require("react"), shim = require_shim(), objectIs = "function" === typeof Object.is ? Object.is : is, useSyncExternalStore = shim.useSyncExternalStore, useRef2 = React.useRef, useEffect2 = React.useEffect, useMemo2 = React.useMemo, useDebugValue2 = React.useDebugValue;
209
- exports.useSyncExternalStoreWithSelector = function(subscribe, getSnapshot, getServerSnapshot, selector, isEqual) {
210
- var instRef = useRef2(null);
211
- if (null === instRef.current) {
212
- var inst = { hasValue: false, value: null };
213
- instRef.current = inst;
214
- } else inst = instRef.current;
215
- instRef = useMemo2(
216
- function() {
217
- function memoizedSelector(nextSnapshot) {
218
- if (!hasMemo) {
219
- hasMemo = true;
220
- memoizedSnapshot = nextSnapshot;
221
- nextSnapshot = selector(nextSnapshot);
222
- if (void 0 !== isEqual && inst.hasValue) {
223
- var currentSelection = inst.value;
224
- if (isEqual(currentSelection, nextSnapshot))
225
- return memoizedSelection = currentSelection;
226
- }
227
- return memoizedSelection = nextSnapshot;
228
- }
229
- currentSelection = memoizedSelection;
230
- if (objectIs(memoizedSnapshot, nextSnapshot))
231
- return currentSelection;
232
- var nextSelection = selector(nextSnapshot);
233
- if (void 0 !== isEqual && isEqual(currentSelection, nextSelection))
234
- return memoizedSnapshot = nextSnapshot, currentSelection;
235
- memoizedSnapshot = nextSnapshot;
236
- return memoizedSelection = nextSelection;
237
- }
238
- var hasMemo = false, memoizedSnapshot, memoizedSelection, maybeGetServerSnapshot = void 0 === getServerSnapshot ? null : getServerSnapshot;
239
- return [
240
- function() {
241
- return memoizedSelector(getSnapshot());
242
- },
243
- null === maybeGetServerSnapshot ? void 0 : function() {
244
- return memoizedSelector(maybeGetServerSnapshot());
245
- }
246
- ];
247
- },
248
- [getSnapshot, getServerSnapshot, selector, isEqual]
249
- );
250
- var value = useSyncExternalStore(subscribe, instRef[0], instRef[1]);
251
- useEffect2(
252
- function() {
253
- inst.hasValue = true;
254
- inst.value = value;
255
- },
256
- [value]
257
- );
258
- useDebugValue2(value);
259
- return value;
260
- };
261
- "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
262
- })();
263
- }
264
- });
265
-
266
- // node_modules/use-sync-external-store/shim/with-selector.js
267
- var require_with_selector = __commonJS({
268
- "node_modules/use-sync-external-store/shim/with-selector.js"(exports, module) {
269
- if (process.env.NODE_ENV === "production") {
270
- module.exports = require_with_selector_production();
271
- } else {
272
- module.exports = require_with_selector_development();
273
- }
274
- }
275
- });
276
-
277
5
  // node_modules/d3-dispatch/src/dispatch.js
278
6
  var noop = { value: () => {
279
7
  } };
@@ -3205,10 +2933,10 @@ function zoom_default2() {
3205
2933
 
3206
2934
  // node_modules/@xyflow/system/dist/esm/index.js
3207
2935
  var errorMessages = {
3208
- error001: () => "[React Flow]: Seems like you have not used zustand provider as an ancestor. Help: https://reactflow.dev/error#001",
2936
+ error001: (lib = "react") => `Seems like you have not used zustand provider as an ancestor. Help: https://${lib}flow.dev/error#001`,
3209
2937
  error002: () => "It looks like you've created a new nodeTypes or edgeTypes object. If this wasn't on purpose please define the nodeTypes/edgeTypes outside of the component or memoize them.",
3210
2938
  error003: (nodeType) => `Node type "${nodeType}" not found. Using fallback type "default".`,
3211
- error004: () => "The React Flow parent container needs a width and a height to render the graph.",
2939
+ error004: () => "The parent container needs a width and a height to render the graph.",
3212
2940
  error005: () => "Only child nodes can use a parent extent.",
3213
2941
  error006: () => "Can't create edge. An edge needs a source and a target.",
3214
2942
  error007: (id2) => `The old edge with id=${id2} does not exist.`,
@@ -3219,7 +2947,8 @@ var errorMessages = {
3219
2947
  error012: (id2) => `Node with id "${id2}" does not exist, it may have been removed. This can happen when a node is deleted before the "onNodeClick" handler is called.`,
3220
2948
  error013: (lib = "react") => `It seems that you haven't loaded the styles. Please import '@xyflow/${lib}/dist/style.css' or base.css to make sure everything is working properly.`,
3221
2949
  error014: () => "useNodeConnections: No node ID found. Call useNodeConnections inside a custom Node or provide a node ID.",
3222
- error015: () => "It seems that you are trying to drag a node that is not initialized. Please use onNodesChange as explained in the docs."
2950
+ error015: () => "It seems that you are trying to drag a node that is not initialized. Please use onNodesChange as explained in the docs.",
2951
+ error016: (id2) => `Edge with id "${id2}" does not exist, it may have been removed. This can happen when an edge is deleted before the "onEdgeClick" handler is called.`
3223
2952
  };
3224
2953
  var infiniteExtent = [
3225
2954
  [Number.NEGATIVE_INFINITY, Number.NEGATIVE_INFINITY],
@@ -3387,7 +3116,7 @@ function getFitViewNodes(nodeLookup, options) {
3387
3116
  }
3388
3117
  async function fitViewport({ nodes, width, height, panZoom, minZoom, maxZoom }, options) {
3389
3118
  if (nodes.size === 0) {
3390
- return Promise.resolve(true);
3119
+ return true;
3391
3120
  }
3392
3121
  const nodesToFit = getFitViewNodes(nodes, options);
3393
3122
  const bounds = getInternalNodesBounds(nodesToFit);
@@ -3397,7 +3126,7 @@ async function fitViewport({ nodes, width, height, panZoom, minZoom, maxZoom },
3397
3126
  ease: options?.ease,
3398
3127
  interpolate: options?.interpolate
3399
3128
  });
3400
- return Promise.resolve(true);
3129
+ return true;
3401
3130
  }
3402
3131
  function calculateNodePosition({ nodeId, nextPosition, nodeLookup, nodeOrigin = [0, 0], nodeExtent, onError }) {
3403
3132
  const node = nodeLookup.get(nodeId);
@@ -3544,9 +3273,9 @@ var getOverlappingArea = (rectA, rectB) => {
3544
3273
  };
3545
3274
  var isRectObject = (obj) => isNumeric(obj.width) && isNumeric(obj.height) && isNumeric(obj.x) && isNumeric(obj.y);
3546
3275
  var isNumeric = (n) => !isNaN(n) && isFinite(n);
3547
- var devWarn = (id2, message) => {
3276
+ var createDevWarn = (lib, helpUrl) => (id2, message) => {
3548
3277
  if (process.env.NODE_ENV === "development") {
3549
- console.warn(`[React Flow]: ${message} Help: https://reactflow.dev/error#${id2}`);
3278
+ console.warn(`[${lib}]: ${message} Help: ${helpUrl}error#${id2}`);
3550
3279
  }
3551
3280
  };
3552
3281
  var snapPosition = (position, snapGrid = [1, 1]) => {
@@ -3584,7 +3313,7 @@ function parsePadding(padding, viewport) {
3584
3313
  return Math.floor(viewport * paddingValue * 0.01);
3585
3314
  }
3586
3315
  }
3587
- console.error(`[React Flow] The padding value "${padding}" is invalid. Please provide a number or a string with a valid unit (px or %).`);
3316
+ console.error(`The padding value "${padding}" is invalid. Please provide a number or a string with a valid unit (px or %).`);
3588
3317
  return 0;
3589
3318
  }
3590
3319
  function parsePaddings(padding, width, height) {
@@ -3838,7 +3567,7 @@ var connectionExists = (edge, edges) => {
3838
3567
  };
3839
3568
  var addEdge = (edgeParams, edges, options = {}) => {
3840
3569
  if (!edgeParams.source || !edgeParams.target) {
3841
- devWarn("006", errorMessages["error006"]());
3570
+ options.onError?.("006", errorMessages["error006"]());
3842
3571
  return edges;
3843
3572
  }
3844
3573
  const edgeIdGenerator = options.getEdgeId || getEdgeId;
@@ -4434,7 +4163,7 @@ function updateNodeInternals(updates, nodeLookup, parentLookup, domNode, nodeOri
4434
4163
  }
4435
4164
  async function panBy({ delta, panZoom, transform: transform2, translateExtent, width, height }) {
4436
4165
  if (!panZoom || !delta.x && !delta.y) {
4437
- return Promise.resolve(false);
4166
+ return false;
4438
4167
  }
4439
4168
  const nextViewport = await panZoom.setViewportConstrained({
4440
4169
  x: transform2[0] + delta.x,
@@ -4445,7 +4174,7 @@ async function panBy({ delta, panZoom, transform: transform2, translateExtent, w
4445
4174
  [width, height]
4446
4175
  ], translateExtent);
4447
4176
  const transformChanged = !!nextViewport && (nextViewport.x !== transform2[0] || nextViewport.y !== transform2[1] || nextViewport.k !== transform2[2]);
4448
- return Promise.resolve(transformChanged);
4177
+ return transformChanged;
4449
4178
  }
4450
4179
  function addConnectionToLookup(type, connection, connectionKey, connectionLookup, nodeId, handleId) {
4451
4180
  let key = nodeId;
@@ -4735,6 +4464,9 @@ function XYDrag({ onNodeMouseDown, getStoreItems, onDragStart, onDrag, onDragSto
4735
4464
  }
4736
4465
  }).on("end", (event) => {
4737
4466
  if (!dragStarted || abortDrag) {
4467
+ if (abortDrag && dragItems.size > 0) {
4468
+ getStoreItems().updateNodePositions(dragItems, false);
4469
+ }
4738
4470
  return;
4739
4471
  }
4740
4472
  autoPanStarted = false;
@@ -5276,7 +5008,7 @@ function XYPanZoom({ domNode, minZoom, maxZoom, translateExtent, viewport, onPan
5276
5008
  const zoomPanValues = {
5277
5009
  isZoomingOrPanning: false,
5278
5010
  usedRightMouseButton: false,
5279
- prevViewport: { },
5011
+ prevViewport: {},
5280
5012
  mouseButton: 0,
5281
5013
  timerId: void 0,
5282
5014
  panScrollTimeout: void 0,
@@ -5296,13 +5028,13 @@ function XYPanZoom({ domNode, minZoom, maxZoom, translateExtent, viewport, onPan
5296
5028
  const d3ZoomHandler = d3Selection.on("wheel.zoom");
5297
5029
  const d3DblClickZoomHandler = d3Selection.on("dblclick.zoom");
5298
5030
  d3ZoomInstance.wheelDelta(wheelDelta);
5299
- function setTransform(transform2, options) {
5031
+ async function setTransform(transform2, options) {
5300
5032
  if (d3Selection) {
5301
5033
  return new Promise((resolve) => {
5302
5034
  d3ZoomInstance?.interpolate(options?.interpolate === "linear" ? value_default : zoom_default).transform(getD3Transition(d3Selection, options?.duration, options?.ease, () => resolve(true)), transform2);
5303
5035
  });
5304
5036
  }
5305
- return Promise.resolve(false);
5037
+ return false;
5306
5038
  }
5307
5039
  function update({ noWheelClassName, noPanClassName, onPaneContextMenu, userSelectionActive, panOnScroll, panOnDrag, panOnScrollMode, panOnScrollSpeed, preventScrolling, zoomOnPinch, zoomOnScroll, zoomOnDoubleClick, zoomActivationKeyPressed, lib, onTransformChange, connectionInProgress, paneClickDistance, selectionOnDrag }) {
5308
5040
  if (userSelectionActive && !zoomPanValues.isZoomingOrPanning) {
@@ -5327,31 +5059,29 @@ function XYPanZoom({ domNode, minZoom, maxZoom, translateExtent, viewport, onPan
5327
5059
  d3ZoomHandler
5328
5060
  });
5329
5061
  d3Selection.on("wheel.zoom", wheelHandler, { passive: false });
5330
- if (!userSelectionActive) {
5331
- const startHandler = createPanZoomStartHandler({
5332
- zoomPanValues,
5333
- onDraggingChange,
5334
- onPanZoomStart
5335
- });
5336
- d3ZoomInstance.on("start", startHandler);
5337
- const panZoomHandler = createPanZoomHandler({
5338
- zoomPanValues,
5339
- panOnDrag,
5340
- onPaneContextMenu: !!onPaneContextMenu,
5341
- onPanZoom,
5342
- onTransformChange
5343
- });
5344
- d3ZoomInstance.on("zoom", panZoomHandler);
5345
- const panZoomEndHandler = createPanZoomEndHandler({
5346
- zoomPanValues,
5347
- panOnDrag,
5348
- panOnScroll,
5349
- onPaneContextMenu,
5350
- onPanZoomEnd,
5351
- onDraggingChange
5352
- });
5353
- d3ZoomInstance.on("end", panZoomEndHandler);
5354
- }
5062
+ const startHandler = createPanZoomStartHandler({
5063
+ zoomPanValues,
5064
+ onDraggingChange,
5065
+ onPanZoomStart
5066
+ });
5067
+ d3ZoomInstance.on("start", startHandler);
5068
+ const panZoomHandler = createPanZoomHandler({
5069
+ zoomPanValues,
5070
+ panOnDrag,
5071
+ onPaneContextMenu: !!onPaneContextMenu,
5072
+ onPanZoom,
5073
+ onTransformChange
5074
+ });
5075
+ d3ZoomInstance.on("zoom", panZoomHandler);
5076
+ const panZoomEndHandler = createPanZoomEndHandler({
5077
+ zoomPanValues,
5078
+ panOnDrag,
5079
+ panOnScroll,
5080
+ onPaneContextMenu,
5081
+ onPanZoomEnd,
5082
+ onDraggingChange
5083
+ });
5084
+ d3ZoomInstance.on("end", panZoomEndHandler);
5355
5085
  const filter2 = createFilter({
5356
5086
  zoomActivationKeyPressed,
5357
5087
  panOnDrag,
@@ -5381,12 +5111,12 @@ function XYPanZoom({ domNode, minZoom, maxZoom, translateExtent, viewport, onPan
5381
5111
  if (contrainedTransform) {
5382
5112
  await setTransform(contrainedTransform);
5383
5113
  }
5384
- return new Promise((resolve) => resolve(contrainedTransform));
5114
+ return contrainedTransform;
5385
5115
  }
5386
5116
  async function setViewport(viewport2, options) {
5387
5117
  const nextTransform = viewportToTransform(viewport2);
5388
5118
  await setTransform(nextTransform, options);
5389
- return new Promise((resolve) => resolve(nextTransform));
5119
+ return nextTransform;
5390
5120
  }
5391
5121
  function syncViewport(viewport2) {
5392
5122
  if (d3Selection) {
@@ -5401,21 +5131,21 @@ function XYPanZoom({ domNode, minZoom, maxZoom, translateExtent, viewport, onPan
5401
5131
  const transform2 = d3Selection ? transform(d3Selection.node()) : { x: 0, y: 0, k: 1 };
5402
5132
  return { x: transform2.x, y: transform2.y, zoom: transform2.k };
5403
5133
  }
5404
- function scaleTo(zoom, options) {
5134
+ async function scaleTo(zoom, options) {
5405
5135
  if (d3Selection) {
5406
5136
  return new Promise((resolve) => {
5407
5137
  d3ZoomInstance?.interpolate(options?.interpolate === "linear" ? value_default : zoom_default).scaleTo(getD3Transition(d3Selection, options?.duration, options?.ease, () => resolve(true)), zoom);
5408
5138
  });
5409
5139
  }
5410
- return Promise.resolve(false);
5140
+ return false;
5411
5141
  }
5412
- function scaleBy(factor, options) {
5142
+ async function scaleBy(factor, options) {
5413
5143
  if (d3Selection) {
5414
5144
  return new Promise((resolve) => {
5415
5145
  d3ZoomInstance?.interpolate(options?.interpolate === "linear" ? value_default : zoom_default).scaleBy(getD3Transition(d3Selection, options?.duration, options?.ease, () => resolve(true)), factor);
5416
5146
  });
5417
5147
  }
5418
- return Promise.resolve(false);
5148
+ return false;
5419
5149
  }
5420
5150
  function setScaleExtent(scaleExtent) {
5421
5151
  d3ZoomInstance?.scaleExtent(scaleExtent);
@@ -5610,12 +5340,6 @@ var initStartValues = {
5610
5340
  pointerY: 0,
5611
5341
  aspectRatio: 1
5612
5342
  };
5613
- function nodeToParentExtent(node) {
5614
- return [
5615
- [0, 0],
5616
- [node.measured.width, node.measured.height]
5617
- ];
5618
- }
5619
5343
  function nodeToChildExtent(child, parent, nodeOrigin) {
5620
5344
  const x = parent.position.x + child.position.x;
5621
5345
  const y = parent.position.y + child.position.y;
@@ -5654,7 +5378,7 @@ function XYResizer({ domNode, nodeId, getStoreItems, onChange, onEnd }) {
5654
5378
  let containerBounds = null;
5655
5379
  let childNodes = [];
5656
5380
  let parentNode = void 0;
5657
- let parentExtent = void 0;
5381
+ let nodeExtent = void 0;
5658
5382
  let childExtent = void 0;
5659
5383
  let resizeDetected = false;
5660
5384
  const dragHandler = drag_default().on("start", (event) => {
@@ -5683,9 +5407,15 @@ function XYResizer({ domNode, nodeId, getStoreItems, onChange, onEnd }) {
5683
5407
  aspectRatio: prevValues.width / prevValues.height
5684
5408
  };
5685
5409
  parentNode = void 0;
5410
+ nodeExtent = isCoordinateExtent(node.extent) ? node.extent : void 0;
5686
5411
  if (node.parentId && (node.extent === "parent" || node.expandParent)) {
5687
5412
  parentNode = nodeLookup.get(node.parentId);
5688
- parentExtent = parentNode && node.extent === "parent" ? nodeToParentExtent(parentNode) : void 0;
5413
+ }
5414
+ if (parentNode && node.extent === "parent") {
5415
+ nodeExtent = [
5416
+ [0, 0],
5417
+ [parentNode.measured.width, parentNode.measured.height]
5418
+ ];
5689
5419
  }
5690
5420
  childNodes = [];
5691
5421
  childExtent = void 0;
@@ -5725,7 +5455,7 @@ function XYResizer({ domNode, nodeId, getStoreItems, onChange, onEnd }) {
5725
5455
  const { x: prevX, y: prevY, width: prevWidth, height: prevHeight } = prevValues;
5726
5456
  const change = {};
5727
5457
  const nodeOrigin = node.origin ?? storeNodeOrigin;
5728
- const { width, height, x, y } = getDimensionsAfterResize(startValues, params.controlDirection, pointerPosition, params.boundaries, params.keepAspectRatio, nodeOrigin, parentExtent, childExtent);
5458
+ const { width, height, x, y } = getDimensionsAfterResize(startValues, params.controlDirection, pointerPosition, params.boundaries, params.keepAspectRatio, nodeOrigin, nodeExtent, childExtent);
5729
5459
  const isWidthChange = width !== prevWidth;
5730
5460
  const isHeightChange = height !== prevHeight;
5731
5461
  const isXPosChange = x !== prevX && isWidthChange;
@@ -5820,9 +5550,62 @@ function cc(names) {
5820
5550
  }
5821
5551
  return out;
5822
5552
  }
5823
-
5824
- // node_modules/zustand/esm/traditional.mjs
5825
- var import_with_selector = __toESM(require_with_selector(), 1);
5553
+ function useSyncExternalStoreWithSelector(subscribe, getSnapshot, getServerSnapshot, selector, isEqual) {
5554
+ const instRef = useRef(null);
5555
+ let inst;
5556
+ if (instRef.current === null) {
5557
+ inst = { hasValue: false, value: null };
5558
+ instRef.current = inst;
5559
+ } else {
5560
+ inst = instRef.current;
5561
+ }
5562
+ const [getSelection, getServerSelection] = useMemo(() => {
5563
+ let hasMemo = false;
5564
+ let memoizedSnapshot;
5565
+ let memoizedSelection;
5566
+ const memoizedSelector = (nextSnapshot) => {
5567
+ if (!hasMemo) {
5568
+ hasMemo = true;
5569
+ memoizedSnapshot = nextSnapshot;
5570
+ const nextSelection2 = selector(nextSnapshot);
5571
+ if (isEqual !== void 0 && inst.hasValue) {
5572
+ const currentSelection = inst.value;
5573
+ if (isEqual(currentSelection, nextSelection2)) {
5574
+ memoizedSelection = currentSelection;
5575
+ return currentSelection;
5576
+ }
5577
+ }
5578
+ memoizedSelection = nextSelection2;
5579
+ return nextSelection2;
5580
+ }
5581
+ const prevSnapshot = memoizedSnapshot;
5582
+ const prevSelection = memoizedSelection;
5583
+ if (Object.is(prevSnapshot, nextSnapshot)) {
5584
+ return prevSelection;
5585
+ }
5586
+ const nextSelection = selector(nextSnapshot);
5587
+ if (isEqual !== void 0 && isEqual(prevSelection, nextSelection)) {
5588
+ memoizedSnapshot = nextSnapshot;
5589
+ return prevSelection;
5590
+ }
5591
+ memoizedSnapshot = nextSnapshot;
5592
+ memoizedSelection = nextSelection;
5593
+ return nextSelection;
5594
+ };
5595
+ const maybeGetServerSnapshot = getServerSnapshot === void 0 || getServerSnapshot === null ? null : getServerSnapshot;
5596
+ const getSnapshotWithSelector = () => memoizedSelector(getSnapshot());
5597
+ const getServerSnapshotWithSelector = maybeGetServerSnapshot === null ? void 0 : () => memoizedSelector(maybeGetServerSnapshot());
5598
+ return [getSnapshotWithSelector, getServerSnapshotWithSelector];
5599
+ }, [getSnapshot, getServerSnapshot, selector, isEqual]);
5600
+ const value = useSyncExternalStore(subscribe, getSelection, getServerSelection);
5601
+ useEffect(() => {
5602
+ inst.hasValue = true;
5603
+ inst.value = value;
5604
+ }, [value]);
5605
+ useDebugValue(value);
5606
+ return value;
5607
+ }
5608
+ var use_sync_external_store_with_selector_default = { useSyncExternalStoreWithSelector };
5826
5609
 
5827
5610
  // node_modules/zustand/esm/vanilla.mjs
5828
5611
  var createStoreImpl = (createState) => {
@@ -5857,18 +5640,18 @@ var createStoreImpl = (createState) => {
5857
5640
  var createStore = (createState) => createState ? createStoreImpl(createState) : createStoreImpl;
5858
5641
 
5859
5642
  // node_modules/zustand/esm/traditional.mjs
5860
- var { useDebugValue } = ReactExports;
5861
- var { useSyncExternalStoreWithSelector } = import_with_selector.default;
5643
+ var { useDebugValue: useDebugValue2 } = ReactExports;
5644
+ var { useSyncExternalStoreWithSelector: useSyncExternalStoreWithSelector2 } = use_sync_external_store_with_selector_default;
5862
5645
  var identity3 = (arg) => arg;
5863
5646
  function useStoreWithEqualityFn(api, selector = identity3, equalityFn) {
5864
- const slice = useSyncExternalStoreWithSelector(
5647
+ const slice = useSyncExternalStoreWithSelector2(
5865
5648
  api.subscribe,
5866
5649
  api.getState,
5867
5650
  api.getServerState || api.getInitialState,
5868
5651
  selector,
5869
5652
  equalityFn
5870
5653
  );
5871
- useDebugValue(slice);
5654
+ useDebugValue2(slice);
5872
5655
  return slice;
5873
5656
  }
5874
5657
  var createWithEqualityFnImpl = (createState, defaultEqualityFn) => {
@@ -5918,7 +5701,7 @@ function shallow$1(objA, objB) {
5918
5701
  }
5919
5702
  var StoreContext = createContext(null);
5920
5703
  var Provider$1 = StoreContext.Provider;
5921
- var zustandErrorMessage = errorMessages["error001"]();
5704
+ var zustandErrorMessage = errorMessages["error001"]("react");
5922
5705
  function useStore(selector, equalityFn) {
5923
5706
  const store = useContext(StoreContext);
5924
5707
  if (store === null) {
@@ -6010,7 +5793,6 @@ function SelectionListener({ onSelectionChange }) {
6010
5793
  }
6011
5794
  return null;
6012
5795
  }
6013
- var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
6014
5796
  var defaultNodeOrigin = [0, 0];
6015
5797
  var defaultViewport = { x: 0, y: 0, zoom: 1 };
6016
5798
  var reactFlowFieldsToTrack = [
@@ -6101,7 +5883,7 @@ var initPrevValues2 = {
6101
5883
  function StoreUpdater(props) {
6102
5884
  const { setNodes, setEdges, setMinZoom, setMaxZoom, setTranslateExtent, setNodeExtent, reset, setDefaultNodesAndEdges } = useStore(selector$l, shallow$1);
6103
5885
  const store = useStoreApi();
6104
- useIsomorphicLayoutEffect(() => {
5886
+ useEffect(() => {
6105
5887
  setDefaultNodesAndEdges(props.defaultNodes, props.defaultEdges);
6106
5888
  return () => {
6107
5889
  previousFields.current = initPrevValues2;
@@ -6109,7 +5891,7 @@ function StoreUpdater(props) {
6109
5891
  };
6110
5892
  }, []);
6111
5893
  const previousFields = useRef(initPrevValues2);
6112
- useIsomorphicLayoutEffect(
5894
+ useEffect(
6113
5895
  () => {
6114
5896
  for (const fieldName of fieldsToTrack) {
6115
5897
  const fieldValue = props[fieldName];
@@ -6245,30 +6027,30 @@ var useViewportHelper = () => {
6245
6027
  const store = useStoreApi();
6246
6028
  return useMemo(() => {
6247
6029
  return {
6248
- zoomIn: (options) => {
6030
+ zoomIn: async (options) => {
6249
6031
  const { panZoom } = store.getState();
6250
- return panZoom ? panZoom.scaleBy(1.2, options) : Promise.resolve(false);
6032
+ return panZoom ? panZoom.scaleBy(1.2, options) : false;
6251
6033
  },
6252
- zoomOut: (options) => {
6034
+ zoomOut: async (options) => {
6253
6035
  const { panZoom } = store.getState();
6254
- return panZoom ? panZoom.scaleBy(1 / 1.2, options) : Promise.resolve(false);
6036
+ return panZoom ? panZoom.scaleBy(1 / 1.2, options) : false;
6255
6037
  },
6256
- zoomTo: (zoomLevel, options) => {
6038
+ zoomTo: async (zoomLevel, options) => {
6257
6039
  const { panZoom } = store.getState();
6258
- return panZoom ? panZoom.scaleTo(zoomLevel, options) : Promise.resolve(false);
6040
+ return panZoom ? panZoom.scaleTo(zoomLevel, options) : false;
6259
6041
  },
6260
6042
  getZoom: () => store.getState().transform[2],
6261
6043
  setViewport: async (viewport, options) => {
6262
6044
  const { transform: [tX, tY, tZoom], panZoom } = store.getState();
6263
6045
  if (!panZoom) {
6264
- return Promise.resolve(false);
6046
+ return false;
6265
6047
  }
6266
6048
  await panZoom.setViewport({
6267
6049
  x: viewport.x ?? tX,
6268
6050
  y: viewport.y ?? tY,
6269
6051
  zoom: viewport.zoom ?? tZoom
6270
6052
  }, options);
6271
- return Promise.resolve(true);
6053
+ return true;
6272
6054
  },
6273
6055
  getViewport: () => {
6274
6056
  const [x, y, zoom] = store.getState().transform;
@@ -6281,14 +6063,14 @@ var useViewportHelper = () => {
6281
6063
  const { width, height, minZoom, maxZoom, panZoom } = store.getState();
6282
6064
  const viewport = getViewportForBounds(bounds, width, height, minZoom, maxZoom, options?.padding ?? 0.1);
6283
6065
  if (!panZoom) {
6284
- return Promise.resolve(false);
6066
+ return false;
6285
6067
  }
6286
6068
  await panZoom.setViewport(viewport, {
6287
6069
  duration: options?.duration,
6288
6070
  ease: options?.ease,
6289
6071
  interpolate: options?.interpolate
6290
6072
  });
6291
- return Promise.resolve(true);
6073
+ return true;
6292
6074
  },
6293
6075
  screenToFlowPosition: (clientPosition, options = {}) => {
6294
6076
  const { transform: transform2, snapGrid, snapToGrid, domNode } = store.getState();
@@ -6457,11 +6239,19 @@ function elementToRemoveChange(item) {
6457
6239
  type: "remove"
6458
6240
  };
6459
6241
  }
6242
+ var defaultOnError = createDevWarn("React Flow", "https://reactflow.dev/");
6243
+ function addEdge2(edgeParams, edges, options = {}) {
6244
+ return addEdge(edgeParams, edges, {
6245
+ ...options,
6246
+ onError: options.onError ?? defaultOnError
6247
+ });
6248
+ }
6460
6249
  var isNode = (element) => isNodeBase(element);
6461
6250
  var isEdge = (element) => isEdgeBase(element);
6462
6251
  function fixedForwardRef(render) {
6463
6252
  return forwardRef(render);
6464
6253
  }
6254
+ var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
6465
6255
  function useQueue(runQueue) {
6466
6256
  const [serial, setSerial] = useState(BigInt(0));
6467
6257
  const [queue] = useState(() => createQueue(() => setSerial((n) => n + BigInt(1))));
@@ -6892,17 +6682,22 @@ var selector$h = (s) => ({
6892
6682
  userSelectionActive: s.userSelectionActive,
6893
6683
  elementsSelectable: s.elementsSelectable,
6894
6684
  connectionInProgress: s.connection.inProgress,
6895
- dragging: s.paneDragging
6685
+ dragging: s.paneDragging,
6686
+ panBy: s.panBy,
6687
+ autoPanSpeed: s.autoPanSpeed
6896
6688
  });
6897
- function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.Full, panOnDrag, paneClickDistance, selectionOnDrag, onSelectionStart, onSelectionEnd, onPaneClick, onPaneContextMenu, onPaneScroll, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, children: children2 }) {
6689
+ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.Full, panOnDrag, autoPanOnSelection, paneClickDistance, selectionOnDrag, onSelectionStart, onSelectionEnd, onPaneClick, onPaneContextMenu, onPaneScroll, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, children: children2 }) {
6690
+ const autoPanId = useRef(0);
6898
6691
  const store = useStoreApi();
6899
- const { userSelectionActive, elementsSelectable, dragging, connectionInProgress } = useStore(selector$h, shallow$1);
6692
+ const { userSelectionActive, elementsSelectable, dragging, connectionInProgress, panBy: panBy2, autoPanSpeed } = useStore(selector$h, shallow$1);
6900
6693
  const isSelectionEnabled = elementsSelectable && (isSelecting || userSelectionActive);
6901
6694
  const container = useRef(null);
6902
6695
  const containerBounds = useRef();
6903
6696
  const selectedNodeIds = useRef(/* @__PURE__ */ new Set());
6904
6697
  const selectedEdgeIds = useRef(/* @__PURE__ */ new Set());
6905
6698
  const selectionInProgress = useRef(false);
6699
+ const position = useRef({ x: 0, y: 0 });
6700
+ const autoPanStarted = useRef(false);
6906
6701
  const onClick = (event) => {
6907
6702
  if (selectionInProgress.current || connectionInProgress) {
6908
6703
  selectionInProgress.current = false;
@@ -6927,7 +6722,7 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
6927
6722
  }
6928
6723
  };
6929
6724
  const onPointerDownCapture = (event) => {
6930
- const { domNode } = store.getState();
6725
+ const { domNode, transform: transform2 } = store.getState();
6931
6726
  containerBounds.current = domNode?.getBoundingClientRect();
6932
6727
  if (!containerBounds.current)
6933
6728
  return;
@@ -6940,12 +6735,13 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
6940
6735
  event.target?.setPointerCapture?.(event.pointerId);
6941
6736
  selectionInProgress.current = false;
6942
6737
  const { x, y } = getEventPosition(event.nativeEvent, containerBounds.current);
6738
+ const userSelectionStartPosition = pointToRendererPoint({ x, y }, transform2);
6943
6739
  store.setState({
6944
6740
  userSelectionRect: {
6945
6741
  width: 0,
6946
6742
  height: 0,
6947
- startX: x,
6948
- startY: y,
6743
+ startX: userSelectionStartPosition.x,
6744
+ startY: userSelectionStartPosition.y,
6949
6745
  x,
6950
6746
  y
6951
6747
  }
@@ -6955,30 +6751,21 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
6955
6751
  event.preventDefault();
6956
6752
  }
6957
6753
  };
6958
- const onPointerMove = (event) => {
6959
- const { userSelectionRect, transform: transform2, nodeLookup, edgeLookup, connectionLookup, triggerNodeChanges, triggerEdgeChanges, defaultEdgeOptions, resetSelectedElements } = store.getState();
6960
- if (!containerBounds.current || !userSelectionRect) {
6754
+ function commitUserSelectionRect(mouseX, mouseY) {
6755
+ const { userSelectionRect } = store.getState();
6756
+ if (!userSelectionRect) {
6961
6757
  return;
6962
6758
  }
6963
- const { x: mouseX, y: mouseY } = getEventPosition(event.nativeEvent, containerBounds.current);
6964
- const { startX, startY } = userSelectionRect;
6965
- if (!selectionInProgress.current) {
6966
- const requiredDistance = selectionKeyPressed ? 0 : paneClickDistance;
6967
- const distance2 = Math.hypot(mouseX - startX, mouseY - startY);
6968
- if (distance2 <= requiredDistance) {
6969
- return;
6970
- }
6971
- resetSelectedElements();
6972
- onSelectionStart?.(event);
6973
- }
6974
- selectionInProgress.current = true;
6759
+ const { transform: transform2, nodeLookup, edgeLookup, connectionLookup, triggerNodeChanges, triggerEdgeChanges, defaultEdgeOptions } = store.getState();
6760
+ const userStartPosition = { x: userSelectionRect.startX, y: userSelectionRect.startY };
6761
+ const { x: screenStartX, y: screenStartY } = rendererPointToPoint(userStartPosition, transform2);
6975
6762
  const nextUserSelectRect = {
6976
- startX,
6977
- startY,
6978
- x: mouseX < startX ? mouseX : startX,
6979
- y: mouseY < startY ? mouseY : startY,
6980
- width: Math.abs(mouseX - startX),
6981
- height: Math.abs(mouseY - startY)
6763
+ startX: userStartPosition.x,
6764
+ startY: userStartPosition.y,
6765
+ x: mouseX < screenStartX ? mouseX : screenStartX,
6766
+ y: mouseY < screenStartY ? mouseY : screenStartY,
6767
+ width: Math.abs(mouseX - screenStartX),
6768
+ height: Math.abs(mouseY - screenStartY)
6982
6769
  };
6983
6770
  const prevSelectedNodeIds = selectedNodeIds.current;
6984
6771
  const prevSelectedEdgeIds = selectedEdgeIds.current;
@@ -7009,6 +6796,53 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
7009
6796
  userSelectionActive: true,
7010
6797
  nodesSelectionActive: false
7011
6798
  });
6799
+ }
6800
+ function autoPan() {
6801
+ if (!autoPanOnSelection || !containerBounds.current) {
6802
+ return;
6803
+ }
6804
+ const [x, y] = calcAutoPan(position.current, containerBounds.current, autoPanSpeed);
6805
+ panBy2({ x, y }).then((panned) => {
6806
+ if (!selectionInProgress.current || !panned) {
6807
+ autoPanId.current = requestAnimationFrame(autoPan);
6808
+ return;
6809
+ }
6810
+ const { x: mx, y: my } = position.current;
6811
+ commitUserSelectionRect(mx, my);
6812
+ autoPanId.current = requestAnimationFrame(autoPan);
6813
+ });
6814
+ }
6815
+ const cleanupAutoPan = () => {
6816
+ cancelAnimationFrame(autoPanId.current);
6817
+ autoPanId.current = 0;
6818
+ autoPanStarted.current = false;
6819
+ };
6820
+ useEffect(() => {
6821
+ return () => cleanupAutoPan();
6822
+ }, []);
6823
+ const onPointerMove = (event) => {
6824
+ const { userSelectionRect, transform: transform2, resetSelectedElements } = store.getState();
6825
+ if (!containerBounds.current || !userSelectionRect) {
6826
+ return;
6827
+ }
6828
+ const { x: mouseX, y: mouseY } = getEventPosition(event.nativeEvent, containerBounds.current);
6829
+ position.current = { x: mouseX, y: mouseY };
6830
+ const screenStart = rendererPointToPoint({ x: userSelectionRect.startX, y: userSelectionRect.startY }, transform2);
6831
+ if (!selectionInProgress.current) {
6832
+ const requiredDistance = selectionKeyPressed ? 0 : paneClickDistance;
6833
+ const distance2 = Math.hypot(mouseX - screenStart.x, mouseY - screenStart.y);
6834
+ if (distance2 <= requiredDistance) {
6835
+ return;
6836
+ }
6837
+ resetSelectedElements();
6838
+ onSelectionStart?.(event);
6839
+ }
6840
+ selectionInProgress.current = true;
6841
+ if (!autoPanStarted.current) {
6842
+ autoPan();
6843
+ autoPanStarted.current = true;
6844
+ }
6845
+ commitUserSelectionRect(mouseX, mouseY);
7012
6846
  };
7013
6847
  const onPointerUp = (event) => {
7014
6848
  if (event.button !== 0) {
@@ -7028,9 +6862,14 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
7028
6862
  nodesSelectionActive: selectedNodeIds.current.size > 0
7029
6863
  });
7030
6864
  }
6865
+ cleanupAutoPan();
6866
+ };
6867
+ const onPointerCancel = (event) => {
6868
+ event.target?.releasePointerCapture?.(event.pointerId);
6869
+ cleanupAutoPan();
7031
6870
  };
7032
6871
  const draggable = panOnDrag === true || Array.isArray(panOnDrag) && panOnDrag.includes(0);
7033
- return jsxs("div", { className: cc(["react-flow__pane", { draggable, dragging, selection: isSelecting }]), onClick: isSelectionEnabled ? void 0 : wrapHandler(onClick, container), onContextMenu: wrapHandler(onContextMenu, container), onWheel: wrapHandler(onWheel, container), onPointerEnter: isSelectionEnabled ? void 0 : onPaneMouseEnter, onPointerMove: isSelectionEnabled ? onPointerMove : onPaneMouseMove, onPointerUp: isSelectionEnabled ? onPointerUp : void 0, onPointerDownCapture: isSelectionEnabled ? onPointerDownCapture : void 0, onClickCapture: isSelectionEnabled ? onClickCapture : void 0, onPointerLeave: onPaneMouseLeave, ref: container, style: containerStyle, children: [children2, jsx(UserSelection, {})] });
6872
+ return jsxs("div", { className: cc(["react-flow__pane", { draggable, dragging, selection: isSelecting }]), onClick: isSelectionEnabled ? void 0 : wrapHandler(onClick, container), onContextMenu: wrapHandler(onContextMenu, container), onWheel: wrapHandler(onWheel, container), onPointerEnter: isSelectionEnabled ? void 0 : onPaneMouseEnter, onPointerMove: isSelectionEnabled ? onPointerMove : onPaneMouseMove, onPointerUp: isSelectionEnabled ? onPointerUp : void 0, onPointerCancel: isSelectionEnabled ? onPointerCancel : void 0, onPointerDownCapture: isSelectionEnabled ? onPointerDownCapture : void 0, onClickCapture: isSelectionEnabled ? onClickCapture : void 0, onPointerLeave: onPaneMouseLeave, ref: container, style: containerStyle, children: [children2, jsx(UserSelection, {})] });
7034
6873
  }
7035
6874
  function handleNodeClick({ id: id2, store, unselect = false, nodeRef }) {
7036
6875
  const { addSelectedNodes, unselectNodesAndEdges, multiSelectionActive, nodeLookup, onError } = store.getState();
@@ -7168,8 +7007,8 @@ function HandleComponent({ type = "source", position = Position.Top, isValidConn
7168
7007
  ...params
7169
7008
  };
7170
7009
  if (hasDefaultEdges) {
7171
- const { edges, setEdges } = store.getState();
7172
- setEdges(addEdge(edgeParams, edges));
7010
+ const { edges, setEdges, onError } = store.getState();
7011
+ setEdges(addEdge2(edgeParams, edges, { onError }));
7173
7012
  }
7174
7013
  onConnectAction?.(edgeParams);
7175
7014
  onConnect?.(edgeParams);
@@ -7365,7 +7204,7 @@ var win = typeof window !== "undefined" ? window : void 0;
7365
7204
  var selector$e = (s) => {
7366
7205
  return { nodesSelectionActive: s.nodesSelectionActive, userSelectionActive: s.userSelectionActive };
7367
7206
  };
7368
- function FlowRendererComponent({ children: children2, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneContextMenu, onPaneScroll, paneClickDistance, deleteKeyCode, selectionKeyCode, selectionOnDrag, selectionMode, onSelectionStart, onSelectionEnd, multiSelectionKeyCode, panActivationKeyCode, zoomActivationKeyCode, elementsSelectable, zoomOnScroll, zoomOnPinch, panOnScroll: _panOnScroll, panOnScrollSpeed, panOnScrollMode, zoomOnDoubleClick, panOnDrag: _panOnDrag, defaultViewport: defaultViewport2, translateExtent, minZoom, maxZoom, preventScrolling, onSelectionContextMenu, noWheelClassName, noPanClassName, disableKeyboardA11y, onViewportChange, isControlledViewport }) {
7207
+ function FlowRendererComponent({ children: children2, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneContextMenu, onPaneScroll, paneClickDistance, deleteKeyCode, selectionKeyCode, selectionOnDrag, selectionMode, onSelectionStart, onSelectionEnd, multiSelectionKeyCode, panActivationKeyCode, zoomActivationKeyCode, elementsSelectable, zoomOnScroll, zoomOnPinch, panOnScroll: _panOnScroll, panOnScrollSpeed, panOnScrollMode, zoomOnDoubleClick, panOnDrag: _panOnDrag, autoPanOnSelection, defaultViewport: defaultViewport2, translateExtent, minZoom, maxZoom, preventScrolling, onSelectionContextMenu, noWheelClassName, noPanClassName, disableKeyboardA11y, onViewportChange, isControlledViewport }) {
7369
7208
  const { nodesSelectionActive, userSelectionActive } = useStore(selector$e, shallow$1);
7370
7209
  const selectionKeyPressed = useKeyPress(selectionKeyCode, { target: win });
7371
7210
  const panActivationKeyPressed = useKeyPress(panActivationKeyCode, { target: win });
@@ -7374,7 +7213,7 @@ function FlowRendererComponent({ children: children2, onPaneClick, onPaneMouseEn
7374
7213
  const _selectionOnDrag = selectionOnDrag && panOnDrag !== true;
7375
7214
  const isSelecting = selectionKeyPressed || userSelectionActive || _selectionOnDrag;
7376
7215
  useGlobalKeyHandler({ deleteKeyCode, multiSelectionKeyCode });
7377
- return jsx(ZoomPane, { onPaneContextMenu, elementsSelectable, zoomOnScroll, zoomOnPinch, panOnScroll, panOnScrollSpeed, panOnScrollMode, zoomOnDoubleClick, panOnDrag: !selectionKeyPressed && panOnDrag, defaultViewport: defaultViewport2, translateExtent, minZoom, maxZoom, zoomActivationKeyCode, preventScrolling, noWheelClassName, noPanClassName, onViewportChange, isControlledViewport, paneClickDistance, selectionOnDrag: _selectionOnDrag, children: jsxs(Pane, { onSelectionStart, onSelectionEnd, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneContextMenu, onPaneScroll, panOnDrag, isSelecting: !!isSelecting, selectionMode, selectionKeyPressed, paneClickDistance, selectionOnDrag: _selectionOnDrag, children: [children2, nodesSelectionActive && jsx(NodesSelection, { onSelectionContextMenu, noPanClassName, disableKeyboardA11y })] }) });
7216
+ return jsx(ZoomPane, { onPaneContextMenu, elementsSelectable, zoomOnScroll, zoomOnPinch, panOnScroll, panOnScrollSpeed, panOnScrollMode, zoomOnDoubleClick, panOnDrag: !selectionKeyPressed && panOnDrag, defaultViewport: defaultViewport2, translateExtent, minZoom, maxZoom, zoomActivationKeyCode, preventScrolling, noWheelClassName, noPanClassName, onViewportChange, isControlledViewport, paneClickDistance, selectionOnDrag: _selectionOnDrag, children: jsxs(Pane, { onSelectionStart, onSelectionEnd, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneContextMenu, onPaneScroll, panOnDrag, autoPanOnSelection, isSelecting: !!isSelecting, selectionMode, selectionKeyPressed, paneClickDistance, selectionOnDrag: _selectionOnDrag, children: [children2, nodesSelectionActive && jsx(NodesSelection, { onSelectionContextMenu, noPanClassName, disableKeyboardA11y })] }) });
7378
7217
  }
7379
7218
  FlowRendererComponent.displayName = "FlowRenderer";
7380
7219
  var FlowRenderer = memo(FlowRendererComponent);
@@ -8179,16 +8018,17 @@ function useStylesLoadedWarning() {
8179
8018
  }
8180
8019
  }, []);
8181
8020
  }
8182
- function GraphViewComponent({ nodeTypes, edgeTypes, onInit, onNodeClick, onEdgeClick, onNodeDoubleClick, onEdgeDoubleClick, onNodeMouseEnter, onNodeMouseMove, onNodeMouseLeave, onNodeContextMenu, onSelectionContextMenu, onSelectionStart, onSelectionEnd, connectionLineType, connectionLineStyle, connectionLineComponent, connectionLineContainerStyle, selectionKeyCode, selectionOnDrag, selectionMode, multiSelectionKeyCode, panActivationKeyCode, zoomActivationKeyCode, deleteKeyCode, onlyRenderVisibleElements, elementsSelectable, defaultViewport: defaultViewport2, translateExtent, minZoom, maxZoom, preventScrolling, defaultMarkerColor, zoomOnScroll, zoomOnPinch, panOnScroll, panOnScrollSpeed, panOnScrollMode, zoomOnDoubleClick, panOnDrag, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneScroll, onPaneContextMenu, paneClickDistance, nodeClickDistance, onEdgeContextMenu, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius, onReconnect, onReconnectStart, onReconnectEnd, noDragClassName, noWheelClassName, noPanClassName, disableKeyboardA11y, nodeExtent, rfId, viewport, onViewportChange }) {
8021
+ function GraphViewComponent({ nodeTypes, edgeTypes, onInit, onNodeClick, onEdgeClick, onNodeDoubleClick, onEdgeDoubleClick, onNodeMouseEnter, onNodeMouseMove, onNodeMouseLeave, onNodeContextMenu, onSelectionContextMenu, onSelectionStart, onSelectionEnd, connectionLineType, connectionLineStyle, connectionLineComponent, connectionLineContainerStyle, selectionKeyCode, selectionOnDrag, selectionMode, multiSelectionKeyCode, panActivationKeyCode, zoomActivationKeyCode, deleteKeyCode, onlyRenderVisibleElements, elementsSelectable, defaultViewport: defaultViewport2, translateExtent, minZoom, maxZoom, preventScrolling, defaultMarkerColor, zoomOnScroll, zoomOnPinch, panOnScroll, panOnScrollSpeed, panOnScrollMode, zoomOnDoubleClick, panOnDrag, autoPanOnSelection, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneScroll, onPaneContextMenu, paneClickDistance, nodeClickDistance, onEdgeContextMenu, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius, onReconnect, onReconnectStart, onReconnectEnd, noDragClassName, noWheelClassName, noPanClassName, disableKeyboardA11y, nodeExtent, rfId, viewport, onViewportChange }) {
8183
8022
  useNodeOrEdgeTypesWarning(nodeTypes);
8184
8023
  useNodeOrEdgeTypesWarning(edgeTypes);
8185
8024
  useStylesLoadedWarning();
8186
8025
  useOnInitHandler(onInit);
8187
8026
  useViewportSync(viewport);
8188
- return jsx(FlowRenderer, { onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneContextMenu, onPaneScroll, paneClickDistance, deleteKeyCode, selectionKeyCode, selectionOnDrag, selectionMode, onSelectionStart, onSelectionEnd, multiSelectionKeyCode, panActivationKeyCode, zoomActivationKeyCode, elementsSelectable, zoomOnScroll, zoomOnPinch, zoomOnDoubleClick, panOnScroll, panOnScrollSpeed, panOnScrollMode, panOnDrag, defaultViewport: defaultViewport2, translateExtent, minZoom, maxZoom, onSelectionContextMenu, preventScrolling, noDragClassName, noWheelClassName, noPanClassName, disableKeyboardA11y, onViewportChange, isControlledViewport: !!viewport, children: jsxs(Viewport, { children: [jsx(EdgeRenderer, { edgeTypes, onEdgeClick, onEdgeDoubleClick, onReconnect, onReconnectStart, onReconnectEnd, onlyRenderVisibleElements, onEdgeContextMenu, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius, defaultMarkerColor, noPanClassName, disableKeyboardA11y, rfId }), jsx(ConnectionLineWrapper, { style: connectionLineStyle, type: connectionLineType, component: connectionLineComponent, containerStyle: connectionLineContainerStyle }), jsx("div", { className: "react-flow__edgelabel-renderer" }), jsx(NodeRenderer, { nodeTypes, onNodeClick, onNodeDoubleClick, onNodeMouseEnter, onNodeMouseMove, onNodeMouseLeave, onNodeContextMenu, nodeClickDistance, onlyRenderVisibleElements, noPanClassName, noDragClassName, disableKeyboardA11y, nodeExtent, rfId }), jsx("div", { className: "react-flow__viewport-portal" })] }) });
8027
+ return jsx(FlowRenderer, { onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneContextMenu, onPaneScroll, paneClickDistance, deleteKeyCode, selectionKeyCode, selectionOnDrag, selectionMode, onSelectionStart, onSelectionEnd, multiSelectionKeyCode, panActivationKeyCode, zoomActivationKeyCode, elementsSelectable, zoomOnScroll, zoomOnPinch, zoomOnDoubleClick, panOnScroll, panOnScrollSpeed, panOnScrollMode, panOnDrag, autoPanOnSelection, defaultViewport: defaultViewport2, translateExtent, minZoom, maxZoom, onSelectionContextMenu, preventScrolling, noDragClassName, noWheelClassName, noPanClassName, disableKeyboardA11y, onViewportChange, isControlledViewport: !!viewport, children: jsxs(Viewport, { children: [jsx(EdgeRenderer, { edgeTypes, onEdgeClick, onEdgeDoubleClick, onReconnect, onReconnectStart, onReconnectEnd, onlyRenderVisibleElements, onEdgeContextMenu, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius, defaultMarkerColor, noPanClassName, disableKeyboardA11y, rfId }), jsx(ConnectionLineWrapper, { style: connectionLineStyle, type: connectionLineType, component: connectionLineComponent, containerStyle: connectionLineContainerStyle }), jsx("div", { className: "react-flow__edgelabel-renderer" }), jsx(NodeRenderer, { nodeTypes, onNodeClick, onNodeDoubleClick, onNodeMouseEnter, onNodeMouseMove, onNodeMouseLeave, onNodeContextMenu, nodeClickDistance, onlyRenderVisibleElements, noPanClassName, noDragClassName, disableKeyboardA11y, nodeExtent, rfId }), jsx("div", { className: "react-flow__viewport-portal" })] }) });
8189
8028
  }
8190
8029
  GraphViewComponent.displayName = "GraphView";
8191
8030
  var GraphView = memo(GraphViewComponent);
8031
+ var devWarn = createDevWarn("React Flow", "https://reactflow.dev/");
8192
8032
  var getInitialState = ({ nodes, edges, defaultNodes, defaultEdges, width, height, fitView, fitViewOptions, minZoom = 0.5, maxZoom = 2, nodeOrigin, nodeExtent, zIndexMode = "basic" } = {}) => {
8193
8033
  const nodeLookup = /* @__PURE__ */ new Map();
8194
8034
  const parentLookup = /* @__PURE__ */ new Map();
@@ -8535,7 +8375,7 @@ var createStore2 = ({ nodes, edges, defaultNodes, defaultEdges, width, height, f
8535
8375
  setCenter: async (x, y, options) => {
8536
8376
  const { width: width2, height: height2, maxZoom: maxZoom2, panZoom } = get3();
8537
8377
  if (!panZoom) {
8538
- return Promise.resolve(false);
8378
+ return false;
8539
8379
  }
8540
8380
  const nextZoom = typeof options?.zoom !== "undefined" ? options.zoom : maxZoom2;
8541
8381
  await panZoom.setViewport({
@@ -8543,7 +8383,7 @@ var createStore2 = ({ nodes, edges, defaultNodes, defaultEdges, width, height, f
8543
8383
  y: height2 / 2 - y * nextZoom,
8544
8384
  zoom: nextZoom
8545
8385
  }, { duration: options?.duration, ease: options?.ease, interpolate: options?.interpolate });
8546
- return Promise.resolve(true);
8386
+ return true;
8547
8387
  },
8548
8388
  cancelConnection: () => {
8549
8389
  set3({
@@ -8588,14 +8428,14 @@ var wrapperStyle = {
8588
8428
  position: "relative",
8589
8429
  zIndex: 0
8590
8430
  };
8591
- function ReactFlow({ nodes, edges, defaultNodes, defaultEdges, className, nodeTypes, edgeTypes, onNodeClick, onEdgeClick, onInit, onMove, onMoveStart, onMoveEnd, onConnect, onConnectStart, onConnectEnd, onClickConnectStart, onClickConnectEnd, onNodeMouseEnter, onNodeMouseMove, onNodeMouseLeave, onNodeContextMenu, onNodeDoubleClick, onNodeDragStart, onNodeDrag, onNodeDragStop, onNodesDelete, onEdgesDelete, onDelete, onSelectionChange, onSelectionDragStart, onSelectionDrag, onSelectionDragStop, onSelectionContextMenu, onSelectionStart, onSelectionEnd, onBeforeDelete, connectionMode, connectionLineType = ConnectionLineType.Bezier, connectionLineStyle, connectionLineComponent, connectionLineContainerStyle, deleteKeyCode = "Backspace", selectionKeyCode = "Shift", selectionOnDrag = false, selectionMode = SelectionMode.Full, panActivationKeyCode = "Space", multiSelectionKeyCode = isMacOs() ? "Meta" : "Control", zoomActivationKeyCode = isMacOs() ? "Meta" : "Control", snapToGrid, snapGrid, onlyRenderVisibleElements = false, selectNodesOnDrag, nodesDraggable, autoPanOnNodeFocus, nodesConnectable, nodesFocusable, nodeOrigin = defaultNodeOrigin, edgesFocusable, edgesReconnectable, elementsSelectable = true, defaultViewport: defaultViewport$1 = defaultViewport, minZoom = 0.5, maxZoom = 2, translateExtent = infiniteExtent, preventScrolling = true, nodeExtent, defaultMarkerColor = "#b1b1b7", zoomOnScroll = true, zoomOnPinch = true, panOnScroll = false, panOnScrollSpeed = 0.5, panOnScrollMode = PanOnScrollMode.Free, zoomOnDoubleClick = true, panOnDrag = true, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneScroll, onPaneContextMenu, paneClickDistance = 1, nodeClickDistance = 0, children: children2, onReconnect, onReconnectStart, onReconnectEnd, onEdgeContextMenu, onEdgeDoubleClick, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius = 10, onNodesChange, onEdgesChange, noDragClassName = "nodrag", noWheelClassName = "nowheel", noPanClassName = "nopan", fitView, fitViewOptions, connectOnClick, attributionPosition, proOptions, defaultEdgeOptions, elevateNodesOnSelect = true, elevateEdgesOnSelect = false, disableKeyboardA11y = false, autoPanOnConnect, autoPanOnNodeDrag, autoPanSpeed, connectionRadius, isValidConnection, onError, style: style2, id: id2, nodeDragThreshold, connectionDragThreshold, viewport, onViewportChange, width, height, colorMode = "light", debug, onScroll, ariaLabelConfig, zIndexMode = "basic", ...rest }, ref) {
8431
+ function ReactFlow({ nodes, edges, defaultNodes, defaultEdges, className, nodeTypes, edgeTypes, onNodeClick, onEdgeClick, onInit, onMove, onMoveStart, onMoveEnd, onConnect, onConnectStart, onConnectEnd, onClickConnectStart, onClickConnectEnd, onNodeMouseEnter, onNodeMouseMove, onNodeMouseLeave, onNodeContextMenu, onNodeDoubleClick, onNodeDragStart, onNodeDrag, onNodeDragStop, onNodesDelete, onEdgesDelete, onDelete, onSelectionChange, onSelectionDragStart, onSelectionDrag, onSelectionDragStop, onSelectionContextMenu, onSelectionStart, onSelectionEnd, onBeforeDelete, connectionMode, connectionLineType = ConnectionLineType.Bezier, connectionLineStyle, connectionLineComponent, connectionLineContainerStyle, deleteKeyCode = "Backspace", selectionKeyCode = "Shift", selectionOnDrag = false, selectionMode = SelectionMode.Full, panActivationKeyCode = "Space", multiSelectionKeyCode = isMacOs() ? "Meta" : "Control", zoomActivationKeyCode = isMacOs() ? "Meta" : "Control", snapToGrid, snapGrid, onlyRenderVisibleElements = false, selectNodesOnDrag, nodesDraggable, autoPanOnNodeFocus, nodesConnectable, nodesFocusable, nodeOrigin = defaultNodeOrigin, edgesFocusable, edgesReconnectable, elementsSelectable = true, defaultViewport: defaultViewport$1 = defaultViewport, minZoom = 0.5, maxZoom = 2, translateExtent = infiniteExtent, preventScrolling = true, nodeExtent, defaultMarkerColor = "#b1b1b7", zoomOnScroll = true, zoomOnPinch = true, panOnScroll = false, panOnScrollSpeed = 0.5, panOnScrollMode = PanOnScrollMode.Free, zoomOnDoubleClick = true, panOnDrag = true, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneScroll, onPaneContextMenu, paneClickDistance = 1, nodeClickDistance = 0, children: children2, onReconnect, onReconnectStart, onReconnectEnd, onEdgeContextMenu, onEdgeDoubleClick, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius = 10, onNodesChange, onEdgesChange, noDragClassName = "nodrag", noWheelClassName = "nowheel", noPanClassName = "nopan", fitView, fitViewOptions, connectOnClick, attributionPosition, proOptions, defaultEdgeOptions, elevateNodesOnSelect = true, elevateEdgesOnSelect = false, disableKeyboardA11y = false, autoPanOnConnect, autoPanOnNodeDrag, autoPanOnSelection = true, autoPanSpeed, connectionRadius, isValidConnection, onError, style: style2, id: id2, nodeDragThreshold, connectionDragThreshold, viewport, onViewportChange, width, height, colorMode = "light", debug, onScroll, ariaLabelConfig, zIndexMode = "basic", ...rest }, ref) {
8592
8432
  const rfId = id2 || "1";
8593
8433
  const colorModeClassName = useColorModeClass(colorMode);
8594
8434
  const wrapperOnScroll = useCallback((e) => {
8595
8435
  e.currentTarget.scrollTo({ top: 0, left: 0, behavior: "instant" });
8596
8436
  onScroll?.(e);
8597
8437
  }, [onScroll]);
8598
- return jsx("div", { "data-testid": "rf__wrapper", ...rest, onScroll: wrapperOnScroll, style: { ...style2, ...wrapperStyle }, ref, className: cc(["react-flow", className, colorModeClassName]), id: id2, role: "application", children: jsxs(Wrapper, { nodes, edges, width, height, fitView, fitViewOptions, minZoom, maxZoom, nodeOrigin, nodeExtent, zIndexMode, children: [jsx(StoreUpdater, { nodes, edges, defaultNodes, defaultEdges, onConnect, onConnectStart, onConnectEnd, onClickConnectStart, onClickConnectEnd, nodesDraggable, autoPanOnNodeFocus, nodesConnectable, nodesFocusable, edgesFocusable, edgesReconnectable, elementsSelectable, elevateNodesOnSelect, elevateEdgesOnSelect, minZoom, maxZoom, nodeExtent, onNodesChange, onEdgesChange, snapToGrid, snapGrid, connectionMode, translateExtent, connectOnClick, defaultEdgeOptions, fitView, fitViewOptions, onNodesDelete, onEdgesDelete, onDelete, onNodeDragStart, onNodeDrag, onNodeDragStop, onSelectionDrag, onSelectionDragStart, onSelectionDragStop, onMove, onMoveStart, onMoveEnd, noPanClassName, nodeOrigin, rfId, autoPanOnConnect, autoPanOnNodeDrag, autoPanSpeed, onError, connectionRadius, isValidConnection, selectNodesOnDrag, nodeDragThreshold, connectionDragThreshold, onBeforeDelete, debug, ariaLabelConfig, zIndexMode }), jsx(GraphView, { onInit, onNodeClick, onEdgeClick, onNodeMouseEnter, onNodeMouseMove, onNodeMouseLeave, onNodeContextMenu, onNodeDoubleClick, nodeTypes, edgeTypes, connectionLineType, connectionLineStyle, connectionLineComponent, connectionLineContainerStyle, selectionKeyCode, selectionOnDrag, selectionMode, deleteKeyCode, multiSelectionKeyCode, panActivationKeyCode, zoomActivationKeyCode, onlyRenderVisibleElements, defaultViewport: defaultViewport$1, translateExtent, minZoom, maxZoom, preventScrolling, zoomOnScroll, zoomOnPinch, zoomOnDoubleClick, panOnScroll, panOnScrollSpeed, panOnScrollMode, panOnDrag, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneScroll, onPaneContextMenu, paneClickDistance, nodeClickDistance, onSelectionContextMenu, onSelectionStart, onSelectionEnd, onReconnect, onReconnectStart, onReconnectEnd, onEdgeContextMenu, onEdgeDoubleClick, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius, defaultMarkerColor, noDragClassName, noWheelClassName, noPanClassName, rfId, disableKeyboardA11y, nodeExtent, viewport, onViewportChange }), jsx(SelectionListener, { onSelectionChange }), children2, jsx(Attribution, { proOptions, position: attributionPosition }), jsx(A11yDescriptions, { rfId, disableKeyboardA11y })] }) });
8438
+ return jsx("div", { "data-testid": "rf__wrapper", ...rest, onScroll: wrapperOnScroll, style: { ...style2, ...wrapperStyle }, ref, className: cc(["react-flow", className, colorModeClassName]), id: id2, role: "application", children: jsxs(Wrapper, { nodes, edges, width, height, fitView, fitViewOptions, minZoom, maxZoom, nodeOrigin, nodeExtent, zIndexMode, children: [jsx(StoreUpdater, { nodes, edges, defaultNodes, defaultEdges, onConnect, onConnectStart, onConnectEnd, onClickConnectStart, onClickConnectEnd, nodesDraggable, autoPanOnNodeFocus, nodesConnectable, nodesFocusable, edgesFocusable, edgesReconnectable, elementsSelectable, elevateNodesOnSelect, elevateEdgesOnSelect, minZoom, maxZoom, nodeExtent, onNodesChange, onEdgesChange, snapToGrid, snapGrid, connectionMode, translateExtent, connectOnClick, defaultEdgeOptions, fitView, fitViewOptions, onNodesDelete, onEdgesDelete, onDelete, onNodeDragStart, onNodeDrag, onNodeDragStop, onSelectionDrag, onSelectionDragStart, onSelectionDragStop, onMove, onMoveStart, onMoveEnd, noPanClassName, nodeOrigin, rfId, autoPanOnConnect, autoPanOnNodeDrag, autoPanSpeed, onError, connectionRadius, isValidConnection, selectNodesOnDrag, nodeDragThreshold, connectionDragThreshold, onBeforeDelete, debug, ariaLabelConfig, zIndexMode }), jsx(GraphView, { onInit, onNodeClick, onEdgeClick, onNodeMouseEnter, onNodeMouseMove, onNodeMouseLeave, onNodeContextMenu, onNodeDoubleClick, nodeTypes, edgeTypes, connectionLineType, connectionLineStyle, connectionLineComponent, connectionLineContainerStyle, selectionKeyCode, selectionOnDrag, selectionMode, deleteKeyCode, multiSelectionKeyCode, panActivationKeyCode, zoomActivationKeyCode, onlyRenderVisibleElements, defaultViewport: defaultViewport$1, translateExtent, minZoom, maxZoom, preventScrolling, zoomOnScroll, zoomOnPinch, zoomOnDoubleClick, panOnScroll, panOnScrollSpeed, panOnScrollMode, panOnDrag, autoPanOnSelection, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneScroll, onPaneContextMenu, paneClickDistance, nodeClickDistance, onSelectionContextMenu, onSelectionStart, onSelectionEnd, onReconnect, onReconnectStart, onReconnectEnd, onEdgeContextMenu, onEdgeDoubleClick, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius, defaultMarkerColor, noDragClassName, noWheelClassName, noPanClassName, rfId, disableKeyboardA11y, nodeExtent, viewport, onViewportChange }), jsx(SelectionListener, { onSelectionChange }), children2, jsx(Attribution, { proOptions, position: attributionPosition }), jsx(A11yDescriptions, { rfId, disableKeyboardA11y })] }) });
8599
8439
  }
8600
8440
  var index = fixedForwardRef(ReactFlow);
8601
8441
  function LinePattern({ dimensions, lineWidth, variant, className }) {
@@ -9030,53 +8870,7 @@ function ResizeControl({ nodeId, position, variant = ResizeControlVariant.Handle
9030
8870
  }, children: children2 });
9031
8871
  }
9032
8872
  memo(ResizeControl);
9033
- /*! Bundled license information:
9034
-
9035
- use-sync-external-store/cjs/use-sync-external-store-shim.production.js:
9036
- (**
9037
- * @license React
9038
- * use-sync-external-store-shim.production.js
9039
- *
9040
- * Copyright (c) Meta Platforms, Inc. and affiliates.
9041
- *
9042
- * This source code is licensed under the MIT license found in the
9043
- * LICENSE file in the root directory of this source tree.
9044
- *)
9045
-
9046
- use-sync-external-store/cjs/use-sync-external-store-shim.development.js:
9047
- (**
9048
- * @license React
9049
- * use-sync-external-store-shim.development.js
9050
- *
9051
- * Copyright (c) Meta Platforms, Inc. and affiliates.
9052
- *
9053
- * This source code is licensed under the MIT license found in the
9054
- * LICENSE file in the root directory of this source tree.
9055
- *)
9056
-
9057
- use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.production.js:
9058
- (**
9059
- * @license React
9060
- * use-sync-external-store-shim/with-selector.production.js
9061
- *
9062
- * Copyright (c) Meta Platforms, Inc. and affiliates.
9063
- *
9064
- * This source code is licensed under the MIT license found in the
9065
- * LICENSE file in the root directory of this source tree.
9066
- *)
9067
-
9068
- use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js:
9069
- (**
9070
- * @license React
9071
- * use-sync-external-store-shim/with-selector.development.js
9072
- *
9073
- * Copyright (c) Meta Platforms, Inc. and affiliates.
9074
- *
9075
- * This source code is licensed under the MIT license found in the
9076
- * LICENSE file in the root directory of this source tree.
9077
- *)
9078
- */
9079
8873
 
9080
- export { Background, BackgroundVariant, Controls, Handle, MiniMap, Position, ReactFlowProvider, addEdge, applyEdgeChanges, applyNodeChanges, index, useReactFlow };
9081
- //# sourceMappingURL=chunk-DDHKYIH2.js.map
9082
- //# sourceMappingURL=chunk-DDHKYIH2.js.map
8874
+ export { Background, BackgroundVariant, Controls, Handle, MiniMap, Position, ReactFlowProvider, addEdge2 as addEdge, applyEdgeChanges, applyNodeChanges, index, useReactFlow };
8875
+ //# sourceMappingURL=chunk-2BZ6OE5H.js.map
8876
+ //# sourceMappingURL=chunk-2BZ6OE5H.js.map