@particle-academy/fancy-flow 0.3.0 → 0.4.0

package/dist/runtime.cjs

@@ -8,309 +8,6 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var ReactExports__default = /*#__PURE__*/_interopDefault(ReactExports);
 
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
-  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
-}) : x)(function(x) {
-  if (typeof require !== "undefined") return require.apply(this, arguments);
-  throw Error('Dynamic require of "' + x + '" is not supported');
-});
-var __commonJS = (cb, mod) => function __require2() {
-  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  __defProp(target, "default", { value: mod, enumerable: true }) ,
-  mod
-));
-
-// node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.production.js
-var require_use_sync_external_store_shim_production = __commonJS({
-  "node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.production.js"(exports) {
-    var React = __require("react");
-    function is(x, y) {
-      return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
-    }
-    var objectIs = "function" === typeof Object.is ? Object.is : is;
-    var useState4 = React.useState;
-    var useEffect2 = React.useEffect;
-    var useLayoutEffect2 = React.useLayoutEffect;
-    var useDebugValue2 = React.useDebugValue;
-    function useSyncExternalStore$2(subscribe, getSnapshot) {
-      var value = getSnapshot(), _useState = useState4({ inst: { value, getSnapshot } }), inst = _useState[0].inst, forceUpdate = _useState[1];
-      useLayoutEffect2(
-        function() {
-          inst.value = value;
-          inst.getSnapshot = getSnapshot;
-          checkIfSnapshotChanged(inst) && forceUpdate({ inst });
-        },
-        [subscribe, value, getSnapshot]
-      );
-      useEffect2(
-        function() {
-          checkIfSnapshotChanged(inst) && forceUpdate({ inst });
-          return subscribe(function() {
-            checkIfSnapshotChanged(inst) && forceUpdate({ inst });
-          });
-        },
-        [subscribe]
-      );
-      useDebugValue2(value);
-      return value;
-    }
-    function checkIfSnapshotChanged(inst) {
-      var latestGetSnapshot = inst.getSnapshot;
-      inst = inst.value;
-      try {
-        var nextValue = latestGetSnapshot();
-        return !objectIs(inst, nextValue);
-      } catch (error) {
-        return true;
-      }
-    }
-    function useSyncExternalStore$1(subscribe, getSnapshot) {
-      return getSnapshot();
-    }
-    var shim = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2;
-    exports.useSyncExternalStore = void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
-  }
-});
-
-// node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js
-var require_use_sync_external_store_shim_development = __commonJS({
-  "node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.development.js"(exports) {
-    "production" !== process.env.NODE_ENV && (function() {
-      function is(x, y) {
-        return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
-      }
-      function useSyncExternalStore$2(subscribe, getSnapshot) {
-        didWarnOld18Alpha || void 0 === React.startTransition || (didWarnOld18Alpha = true, console.error(
-          "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."
-        ));
-        var value = getSnapshot();
-        if (!didWarnUncachedGetSnapshot) {
-          var cachedValue = getSnapshot();
-          objectIs(value, cachedValue) || (console.error(
-            "The result of getSnapshot should be cached to avoid an infinite loop"
-          ), didWarnUncachedGetSnapshot = true);
-        }
-        cachedValue = useState4({
-          inst: { value, getSnapshot }
-        });
-        var inst = cachedValue[0].inst, forceUpdate = cachedValue[1];
-        useLayoutEffect2(
-          function() {
-            inst.value = value;
-            inst.getSnapshot = getSnapshot;
-            checkIfSnapshotChanged(inst) && forceUpdate({ inst });
-          },
-          [subscribe, value, getSnapshot]
-        );
-        useEffect2(
-          function() {
-            checkIfSnapshotChanged(inst) && forceUpdate({ inst });
-            return subscribe(function() {
-              checkIfSnapshotChanged(inst) && forceUpdate({ inst });
-            });
-          },
-          [subscribe]
-        );
-        useDebugValue2(value);
-        return value;
-      }
-      function checkIfSnapshotChanged(inst) {
-        var latestGetSnapshot = inst.getSnapshot;
-        inst = inst.value;
-        try {
-          var nextValue = latestGetSnapshot();
-          return !objectIs(inst, nextValue);
-        } catch (error) {
-          return true;
-        }
-      }
-      function useSyncExternalStore$1(subscribe, getSnapshot) {
-        return getSnapshot();
-      }
-      "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
-      var React = __require("react"), objectIs = "function" === typeof Object.is ? Object.is : is, useState4 = 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;
-      exports.useSyncExternalStore = void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
-      "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
-    })();
-  }
-});
-
-// node_modules/use-sync-external-store/shim/index.js
-var require_shim = __commonJS({
-  "node_modules/use-sync-external-store/shim/index.js"(exports, module) {
-    if (process.env.NODE_ENV === "production") {
-      module.exports = require_use_sync_external_store_shim_production();
-    } else {
-      module.exports = require_use_sync_external_store_shim_development();
-    }
-  }
-});
-
-// node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.production.js
-var require_with_selector_production = __commonJS({
-  "node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.production.js"(exports) {
-    var React = __require("react");
-    var shim = require_shim();
-    function is(x, y) {
-      return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
-    }
-    var objectIs = "function" === typeof Object.is ? Object.is : is;
-    var useSyncExternalStore = shim.useSyncExternalStore;
-    var useRef3 = React.useRef;
-    var useEffect2 = React.useEffect;
-    var useMemo2 = React.useMemo;
-    var useDebugValue2 = React.useDebugValue;
-    exports.useSyncExternalStoreWithSelector = function(subscribe, getSnapshot, getServerSnapshot, selector, isEqual) {
-      var instRef = useRef3(null);
-      if (null === instRef.current) {
-        var inst = { hasValue: false, value: null };
-        instRef.current = inst;
-      } else inst = instRef.current;
-      instRef = useMemo2(
-        function() {
-          function memoizedSelector(nextSnapshot) {
-            if (!hasMemo) {
-              hasMemo = true;
-              memoizedSnapshot = nextSnapshot;
-              nextSnapshot = selector(nextSnapshot);
-              if (void 0 !== isEqual && inst.hasValue) {
-                var currentSelection = inst.value;
-                if (isEqual(currentSelection, nextSnapshot))
-                  return memoizedSelection = currentSelection;
-              }
-              return memoizedSelection = nextSnapshot;
-            }
-            currentSelection = memoizedSelection;
-            if (objectIs(memoizedSnapshot, nextSnapshot)) return currentSelection;
-            var nextSelection = selector(nextSnapshot);
-            if (void 0 !== isEqual && isEqual(currentSelection, nextSelection))
-              return memoizedSnapshot = nextSnapshot, currentSelection;
-            memoizedSnapshot = nextSnapshot;
-            return memoizedSelection = nextSelection;
-          }
-          var hasMemo = false, memoizedSnapshot, memoizedSelection, maybeGetServerSnapshot = void 0 === getServerSnapshot ? null : getServerSnapshot;
-          return [
-            function() {
-              return memoizedSelector(getSnapshot());
-            },
-            null === maybeGetServerSnapshot ? void 0 : function() {
-              return memoizedSelector(maybeGetServerSnapshot());
-            }
-          ];
-        },
-        [getSnapshot, getServerSnapshot, selector, isEqual]
-      );
-      var value = useSyncExternalStore(subscribe, instRef[0], instRef[1]);
-      useEffect2(
-        function() {
-          inst.hasValue = true;
-          inst.value = value;
-        },
-        [value]
-      );
-      useDebugValue2(value);
-      return value;
-    };
-  }
-});
-
-// node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js
-var require_with_selector_development = __commonJS({
-  "node_modules/use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js"(exports) {
-    "production" !== process.env.NODE_ENV && (function() {
-      function is(x, y) {
-        return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
-      }
-      "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
-      var React = __require("react"), shim = require_shim(), objectIs = "function" === typeof Object.is ? Object.is : is, useSyncExternalStore = shim.useSyncExternalStore, useRef3 = React.useRef, useEffect2 = React.useEffect, useMemo2 = React.useMemo, useDebugValue2 = React.useDebugValue;
-      exports.useSyncExternalStoreWithSelector = function(subscribe, getSnapshot, getServerSnapshot, selector, isEqual) {
-        var instRef = useRef3(null);
-        if (null === instRef.current) {
-          var inst = { hasValue: false, value: null };
-          instRef.current = inst;
-        } else inst = instRef.current;
-        instRef = useMemo2(
-          function() {
-            function memoizedSelector(nextSnapshot) {
-              if (!hasMemo) {
-                hasMemo = true;
-                memoizedSnapshot = nextSnapshot;
-                nextSnapshot = selector(nextSnapshot);
-                if (void 0 !== isEqual && inst.hasValue) {
-                  var currentSelection = inst.value;
-                  if (isEqual(currentSelection, nextSnapshot))
-                    return memoizedSelection = currentSelection;
-                }
-                return memoizedSelection = nextSnapshot;
-              }
-              currentSelection = memoizedSelection;
-              if (objectIs(memoizedSnapshot, nextSnapshot))
-                return currentSelection;
-              var nextSelection = selector(nextSnapshot);
-              if (void 0 !== isEqual && isEqual(currentSelection, nextSelection))
-                return memoizedSnapshot = nextSnapshot, currentSelection;
-              memoizedSnapshot = nextSnapshot;
-              return memoizedSelection = nextSelection;
-            }
-            var hasMemo = false, memoizedSnapshot, memoizedSelection, maybeGetServerSnapshot = void 0 === getServerSnapshot ? null : getServerSnapshot;
-            return [
-              function() {
-                return memoizedSelector(getSnapshot());
-              },
-              null === maybeGetServerSnapshot ? void 0 : function() {
-                return memoizedSelector(maybeGetServerSnapshot());
-              }
-            ];
-          },
-          [getSnapshot, getServerSnapshot, selector, isEqual]
-        );
-        var value = useSyncExternalStore(subscribe, instRef[0], instRef[1]);
-        useEffect2(
-          function() {
-            inst.hasValue = true;
-            inst.value = value;
-          },
-          [value]
-        );
-        useDebugValue2(value);
-        return value;
-      };
-      "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ && "function" === typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
-    })();
-  }
-});
-
-// node_modules/use-sync-external-store/shim/with-selector.js
-var require_with_selector = __commonJS({
-  "node_modules/use-sync-external-store/shim/with-selector.js"(exports, module) {
-    if (process.env.NODE_ENV === "production") {
-      module.exports = require_with_selector_production();
-    } else {
-      module.exports = require_with_selector_development();
-    }
-  }
-});
-
 // src/runtime/run-flow.ts
 async function runFlow(graph, executors, onEvent = () => {
 }, options = {}) {
@@ -3486,10 +3183,10 @@ function zoom_default2() {
 
 // node_modules/@xyflow/system/dist/esm/index.js
 var errorMessages = {
-  error001: () => "[React Flow]: Seems like you have not used zustand provider as an ancestor. Help: https://reactflow.dev/error#001",
+  error001: (lib = "react") => `Seems like you have not used zustand provider as an ancestor. Help: https://${lib}flow.dev/error#001`,
   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.",
   error003: (nodeType) => `Node type "${nodeType}" not found. Using fallback type "default".`,
-  error004: () => "The React Flow parent container needs a width and a height to render the graph.",
+  error004: () => "The parent container needs a width and a height to render the graph.",
   error005: () => "Only child nodes can use a parent extent.",
   error006: () => "Can't create edge. An edge needs a source and a target.",
   error007: (id2) => `The old edge with id=${id2} does not exist.`,
@@ -3500,7 +3197,8 @@ var errorMessages = {
   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.`,
   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.`,
   error014: () => "useNodeConnections: No node ID found. Call useNodeConnections inside a custom Node or provide a node ID.",
-  error015: () => "It seems that you are trying to drag a node that is not initialized. Please use onNodesChange as explained in the docs."
+  error015: () => "It seems that you are trying to drag a node that is not initialized. Please use onNodesChange as explained in the docs.",
+  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.`
 };
 var infiniteExtent = [
   [Number.NEGATIVE_INFINITY, Number.NEGATIVE_INFINITY],
@@ -3668,7 +3366,7 @@ function getFitViewNodes(nodeLookup, options) {
 }
 async function fitViewport({ nodes, width, height, panZoom, minZoom, maxZoom }, options) {
   if (nodes.size === 0) {
-    return Promise.resolve(true);
+    return true;
   }
   const nodesToFit = getFitViewNodes(nodes, options);
   const bounds = getInternalNodesBounds(nodesToFit);
@@ -3678,7 +3376,7 @@ async function fitViewport({ nodes, width, height, panZoom, minZoom, maxZoom },
     ease: options?.ease,
     interpolate: options?.interpolate
   });
-  return Promise.resolve(true);
+  return true;
 }
 function calculateNodePosition({ nodeId, nextPosition, nodeLookup, nodeOrigin = [0, 0], nodeExtent, onError }) {
   const node = nodeLookup.get(nodeId);
@@ -3825,9 +3523,9 @@ var getOverlappingArea = (rectA, rectB) => {
 };
 var isRectObject = (obj) => isNumeric(obj.width) && isNumeric(obj.height) && isNumeric(obj.x) && isNumeric(obj.y);
 var isNumeric = (n) => !isNaN(n) && isFinite(n);
-var devWarn = (id2, message) => {
+var createDevWarn = (lib, helpUrl) => (id2, message) => {
   if (process.env.NODE_ENV === "development") {
-    console.warn(`[React Flow]: ${message} Help: https://reactflow.dev/error#${id2}`);
+    console.warn(`[${lib}]: ${message} Help: ${helpUrl}error#${id2}`);
   }
 };
 var snapPosition = (position, snapGrid = [1, 1]) => {
@@ -3865,7 +3563,7 @@ function parsePadding(padding, viewport) {
       return Math.floor(viewport * paddingValue * 0.01);
     }
   }
-  console.error(`[React Flow] The padding value "${padding}" is invalid. Please provide a number or a string with a valid unit (px or %).`);
+  console.error(`The padding value "${padding}" is invalid. Please provide a number or a string with a valid unit (px or %).`);
   return 0;
 }
 function parsePaddings(padding, width, height) {
@@ -4119,7 +3817,7 @@ var connectionExists = (edge, edges) => {
 };
 var addEdge = (edgeParams, edges, options = {}) => {
   if (!edgeParams.source || !edgeParams.target) {
-    devWarn("006", errorMessages["error006"]());
+    options.onError?.("006", errorMessages["error006"]());
     return edges;
   }
   const edgeIdGenerator = options.getEdgeId || getEdgeId;
@@ -4715,7 +4413,7 @@ function updateNodeInternals(updates, nodeLookup, parentLookup, domNode, nodeOri
 }
 async function panBy({ delta, panZoom, transform: transform2, translateExtent, width, height }) {
   if (!panZoom || !delta.x && !delta.y) {
-    return Promise.resolve(false);
+    return false;
   }
   const nextViewport = await panZoom.setViewportConstrained({
     x: transform2[0] + delta.x,
@@ -4726,7 +4424,7 @@ async function panBy({ delta, panZoom, transform: transform2, translateExtent, w
     [width, height]
   ], translateExtent);
   const transformChanged = !!nextViewport && (nextViewport.x !== transform2[0] || nextViewport.y !== transform2[1] || nextViewport.k !== transform2[2]);
-  return Promise.resolve(transformChanged);
+  return transformChanged;
 }
 function addConnectionToLookup(type, connection, connectionKey, connectionLookup, nodeId, handleId) {
   let key = nodeId;
@@ -5016,6 +4714,9 @@ function XYDrag({ onNodeMouseDown, getStoreItems, onDragStart, onDrag, onDragSto
       }
     }).on("end", (event) => {
       if (!dragStarted || abortDrag) {
+        if (abortDrag && dragItems.size > 0) {
+          getStoreItems().updateNodePositions(dragItems, false);
+        }
         return;
       }
       autoPanStarted = false;
@@ -5557,7 +5258,7 @@ function XYPanZoom({ domNode, minZoom, maxZoom, translateExtent, viewport, onPan
   const zoomPanValues = {
     isZoomingOrPanning: false,
     usedRightMouseButton: false,
-    prevViewport: { },
+    prevViewport: {},
     mouseButton: 0,
     timerId: void 0,
     panScrollTimeout: void 0,
@@ -5577,13 +5278,13 @@ function XYPanZoom({ domNode, minZoom, maxZoom, translateExtent, viewport, onPan
   const d3ZoomHandler = d3Selection.on("wheel.zoom");
   const d3DblClickZoomHandler = d3Selection.on("dblclick.zoom");
   d3ZoomInstance.wheelDelta(wheelDelta);
-  function setTransform(transform2, options) {
+  async function setTransform(transform2, options) {
     if (d3Selection) {
       return new Promise((resolve) => {
         d3ZoomInstance?.interpolate(options?.interpolate === "linear" ? value_default : zoom_default).transform(getD3Transition(d3Selection, options?.duration, options?.ease, () => resolve(true)), transform2);
       });
     }
-    return Promise.resolve(false);
+    return false;
   }
   function update({ noWheelClassName, noPanClassName, onPaneContextMenu, userSelectionActive, panOnScroll, panOnDrag, panOnScrollMode, panOnScrollSpeed, preventScrolling, zoomOnPinch, zoomOnScroll, zoomOnDoubleClick, zoomActivationKeyPressed, lib, onTransformChange, connectionInProgress, paneClickDistance, selectionOnDrag }) {
     if (userSelectionActive && !zoomPanValues.isZoomingOrPanning) {
@@ -5608,31 +5309,29 @@ function XYPanZoom({ domNode, minZoom, maxZoom, translateExtent, viewport, onPan
       d3ZoomHandler
     });
     d3Selection.on("wheel.zoom", wheelHandler, { passive: false });
-    if (!userSelectionActive) {
-      const startHandler = createPanZoomStartHandler({
-        zoomPanValues,
-        onDraggingChange,
-        onPanZoomStart
-      });
-      d3ZoomInstance.on("start", startHandler);
-      const panZoomHandler = createPanZoomHandler({
-        zoomPanValues,
-        panOnDrag,
-        onPaneContextMenu: !!onPaneContextMenu,
-        onPanZoom,
-        onTransformChange
-      });
-      d3ZoomInstance.on("zoom", panZoomHandler);
-      const panZoomEndHandler = createPanZoomEndHandler({
-        zoomPanValues,
-        panOnDrag,
-        panOnScroll,
-        onPaneContextMenu,
-        onPanZoomEnd,
-        onDraggingChange
-      });
-      d3ZoomInstance.on("end", panZoomEndHandler);
-    }
+    const startHandler = createPanZoomStartHandler({
+      zoomPanValues,
+      onDraggingChange,
+      onPanZoomStart
+    });
+    d3ZoomInstance.on("start", startHandler);
+    const panZoomHandler = createPanZoomHandler({
+      zoomPanValues,
+      panOnDrag,
+      onPaneContextMenu: !!onPaneContextMenu,
+      onPanZoom,
+      onTransformChange
+    });
+    d3ZoomInstance.on("zoom", panZoomHandler);
+    const panZoomEndHandler = createPanZoomEndHandler({
+      zoomPanValues,
+      panOnDrag,
+      panOnScroll,
+      onPaneContextMenu,
+      onPanZoomEnd,
+      onDraggingChange
+    });
+    d3ZoomInstance.on("end", panZoomEndHandler);
     const filter2 = createFilter({
       zoomActivationKeyPressed,
       panOnDrag,
@@ -5662,12 +5361,12 @@ function XYPanZoom({ domNode, minZoom, maxZoom, translateExtent, viewport, onPan
     if (contrainedTransform) {
       await setTransform(contrainedTransform);
     }
-    return new Promise((resolve) => resolve(contrainedTransform));
+    return contrainedTransform;
   }
   async function setViewport(viewport2, options) {
     const nextTransform = viewportToTransform(viewport2);
     await setTransform(nextTransform, options);
-    return new Promise((resolve) => resolve(nextTransform));
+    return nextTransform;
   }
   function syncViewport(viewport2) {
     if (d3Selection) {
@@ -5682,21 +5381,21 @@ function XYPanZoom({ domNode, minZoom, maxZoom, translateExtent, viewport, onPan
     const transform2 = d3Selection ? transform(d3Selection.node()) : { x: 0, y: 0, k: 1 };
     return { x: transform2.x, y: transform2.y, zoom: transform2.k };
   }
-  function scaleTo(zoom, options) {
+  async function scaleTo(zoom, options) {
     if (d3Selection) {
       return new Promise((resolve) => {
         d3ZoomInstance?.interpolate(options?.interpolate === "linear" ? value_default : zoom_default).scaleTo(getD3Transition(d3Selection, options?.duration, options?.ease, () => resolve(true)), zoom);
       });
     }
-    return Promise.resolve(false);
+    return false;
   }
-  function scaleBy(factor, options) {
+  async function scaleBy(factor, options) {
     if (d3Selection) {
       return new Promise((resolve) => {
         d3ZoomInstance?.interpolate(options?.interpolate === "linear" ? value_default : zoom_default).scaleBy(getD3Transition(d3Selection, options?.duration, options?.ease, () => resolve(true)), factor);
       });
     }
-    return Promise.resolve(false);
+    return false;
   }
   function setScaleExtent(scaleExtent) {
     d3ZoomInstance?.scaleExtent(scaleExtent);
@@ -5891,12 +5590,6 @@ var initStartValues = {
   pointerY: 0,
   aspectRatio: 1
 };
-function nodeToParentExtent(node) {
-  return [
-    [0, 0],
-    [node.measured.width, node.measured.height]
-  ];
-}
 function nodeToChildExtent(child, parent, nodeOrigin) {
   const x = parent.position.x + child.position.x;
   const y = parent.position.y + child.position.y;
@@ -5935,7 +5628,7 @@ function XYResizer({ domNode, nodeId, getStoreItems, onChange, onEnd }) {
     let containerBounds = null;
     let childNodes = [];
     let parentNode = void 0;
-    let parentExtent = void 0;
+    let nodeExtent = void 0;
     let childExtent = void 0;
     let resizeDetected = false;
     const dragHandler = drag_default().on("start", (event) => {
@@ -5964,9 +5657,15 @@ function XYResizer({ domNode, nodeId, getStoreItems, onChange, onEnd }) {
         aspectRatio: prevValues.width / prevValues.height
       };
       parentNode = void 0;
+      nodeExtent = isCoordinateExtent(node.extent) ? node.extent : void 0;
       if (node.parentId && (node.extent === "parent" || node.expandParent)) {
         parentNode = nodeLookup.get(node.parentId);
-        parentExtent = parentNode && node.extent === "parent" ? nodeToParentExtent(parentNode) : void 0;
+      }
+      if (parentNode && node.extent === "parent") {
+        nodeExtent = [
+          [0, 0],
+          [parentNode.measured.width, parentNode.measured.height]
+        ];
       }
       childNodes = [];
       childExtent = void 0;
@@ -6006,7 +5705,7 @@ function XYResizer({ domNode, nodeId, getStoreItems, onChange, onEnd }) {
       const { x: prevX, y: prevY, width: prevWidth, height: prevHeight } = prevValues;
       const change = {};
       const nodeOrigin = node.origin ?? storeNodeOrigin;
-      const { width, height, x, y } = getDimensionsAfterResize(startValues, params.controlDirection, pointerPosition, params.boundaries, params.keepAspectRatio, nodeOrigin, parentExtent, childExtent);
+      const { width, height, x, y } = getDimensionsAfterResize(startValues, params.controlDirection, pointerPosition, params.boundaries, params.keepAspectRatio, nodeOrigin, nodeExtent, childExtent);
       const isWidthChange = width !== prevWidth;
       const isHeightChange = height !== prevHeight;
       const isXPosChange = x !== prevX && isWidthChange;
@@ -6083,9 +5782,62 @@ function XYResizer({ domNode, nodeId, getStoreItems, onChange, onEnd }) {
     destroy
   };
 }
-
-// node_modules/zustand/esm/traditional.mjs
-var import_with_selector = __toESM(require_with_selector());
+function useSyncExternalStoreWithSelector(subscribe, getSnapshot, getServerSnapshot, selector, isEqual) {
+  const instRef = ReactExports.useRef(null);
+  let inst;
+  if (instRef.current === null) {
+    inst = { hasValue: false, value: null };
+    instRef.current = inst;
+  } else {
+    inst = instRef.current;
+  }
+  const [getSelection, getServerSelection] = ReactExports.useMemo(() => {
+    let hasMemo = false;
+    let memoizedSnapshot;
+    let memoizedSelection;
+    const memoizedSelector = (nextSnapshot) => {
+      if (!hasMemo) {
+        hasMemo = true;
+        memoizedSnapshot = nextSnapshot;
+        const nextSelection2 = selector(nextSnapshot);
+        if (isEqual !== void 0 && inst.hasValue) {
+          const currentSelection = inst.value;
+          if (isEqual(currentSelection, nextSelection2)) {
+            memoizedSelection = currentSelection;
+            return currentSelection;
+          }
+        }
+        memoizedSelection = nextSelection2;
+        return nextSelection2;
+      }
+      const prevSnapshot = memoizedSnapshot;
+      const prevSelection = memoizedSelection;
+      if (Object.is(prevSnapshot, nextSnapshot)) {
+        return prevSelection;
+      }
+      const nextSelection = selector(nextSnapshot);
+      if (isEqual !== void 0 && isEqual(prevSelection, nextSelection)) {
+        memoizedSnapshot = nextSnapshot;
+        return prevSelection;
+      }
+      memoizedSnapshot = nextSnapshot;
+      memoizedSelection = nextSelection;
+      return nextSelection;
+    };
+    const maybeGetServerSnapshot = getServerSnapshot === void 0 || getServerSnapshot === null ? null : getServerSnapshot;
+    const getSnapshotWithSelector = () => memoizedSelector(getSnapshot());
+    const getServerSnapshotWithSelector = maybeGetServerSnapshot === null ? void 0 : () => memoizedSelector(maybeGetServerSnapshot());
+    return [getSnapshotWithSelector, getServerSnapshotWithSelector];
+  }, [getSnapshot, getServerSnapshot, selector, isEqual]);
+  const value = ReactExports.useSyncExternalStore(subscribe, getSelection, getServerSelection);
+  ReactExports.useEffect(() => {
+    inst.hasValue = true;
+    inst.value = value;
+  }, [value]);
+  ReactExports.useDebugValue(value);
+  return value;
+}
+var use_sync_external_store_with_selector_default = { useSyncExternalStoreWithSelector };
 
 // node_modules/zustand/esm/vanilla.mjs
 var createStoreImpl = (createState) => {
@@ -6120,18 +5872,18 @@ var createStoreImpl = (createState) => {
 var createStore = (createState) => createState ? createStoreImpl(createState) : createStoreImpl;
 
 // node_modules/zustand/esm/traditional.mjs
-var { useDebugValue } = ReactExports__default.default;
-var { useSyncExternalStoreWithSelector } = import_with_selector.default;
+var { useDebugValue: useDebugValue2 } = ReactExports__default.default;
+var { useSyncExternalStoreWithSelector: useSyncExternalStoreWithSelector2 } = use_sync_external_store_with_selector_default;
 var identity3 = (arg) => arg;
 function useStoreWithEqualityFn(api, selector = identity3, equalityFn) {
-  const slice = useSyncExternalStoreWithSelector(
+  const slice = useSyncExternalStoreWithSelector2(
     api.subscribe,
     api.getState,
     api.getServerState || api.getInitialState,
     selector,
     equalityFn
   );
-  useDebugValue(slice);
+  useDebugValue2(slice);
   return slice;
 }
 var createWithEqualityFnImpl = (createState, defaultEqualityFn) => {
@@ -6181,7 +5933,7 @@ function shallow$1(objA, objB) {
 }
 var StoreContext = ReactExports.createContext(null);
 var Provider$1 = StoreContext.Provider;
-var zustandErrorMessage = errorMessages["error001"]();
+var zustandErrorMessage = errorMessages["error001"]("react");
 function useStore(selector, equalityFn) {
   const store = ReactExports.useContext(StoreContext);
   if (store === null) {
@@ -6273,7 +6025,6 @@ function SelectionListener({ onSelectionChange }) {
   }
   return null;
 }
-var useIsomorphicLayoutEffect = typeof window !== "undefined" ? ReactExports.useLayoutEffect : ReactExports.useEffect;
 var defaultNodeOrigin = [0, 0];
 var defaultViewport = { x: 0, y: 0, zoom: 1 };
 var reactFlowFieldsToTrack = [
@@ -6364,7 +6115,7 @@ var initPrevValues2 = {
 function StoreUpdater(props) {
   const { setNodes, setEdges, setMinZoom, setMaxZoom, setTranslateExtent, setNodeExtent, reset, setDefaultNodesAndEdges } = useStore(selector$l, shallow$1);
   const store = useStoreApi();
-  useIsomorphicLayoutEffect(() => {
+  ReactExports.useEffect(() => {
     setDefaultNodesAndEdges(props.defaultNodes, props.defaultEdges);
     return () => {
       previousFields.current = initPrevValues2;
@@ -6372,7 +6123,7 @@ function StoreUpdater(props) {
     };
   }, []);
   const previousFields = ReactExports.useRef(initPrevValues2);
-  useIsomorphicLayoutEffect(
+  ReactExports.useEffect(
     () => {
       for (const fieldName of fieldsToTrack) {
         const fieldValue = props[fieldName];
@@ -6508,30 +6259,30 @@ var useViewportHelper = () => {
   const store = useStoreApi();
   return ReactExports.useMemo(() => {
     return {
-      zoomIn: (options) => {
+      zoomIn: async (options) => {
         const { panZoom } = store.getState();
-        return panZoom ? panZoom.scaleBy(1.2, options) : Promise.resolve(false);
+        return panZoom ? panZoom.scaleBy(1.2, options) : false;
       },
-      zoomOut: (options) => {
+      zoomOut: async (options) => {
         const { panZoom } = store.getState();
-        return panZoom ? panZoom.scaleBy(1 / 1.2, options) : Promise.resolve(false);
+        return panZoom ? panZoom.scaleBy(1 / 1.2, options) : false;
       },
-      zoomTo: (zoomLevel, options) => {
+      zoomTo: async (zoomLevel, options) => {
         const { panZoom } = store.getState();
-        return panZoom ? panZoom.scaleTo(zoomLevel, options) : Promise.resolve(false);
+        return panZoom ? panZoom.scaleTo(zoomLevel, options) : false;
       },
       getZoom: () => store.getState().transform[2],
       setViewport: async (viewport, options) => {
         const { transform: [tX, tY, tZoom], panZoom } = store.getState();
         if (!panZoom) {
-          return Promise.resolve(false);
+          return false;
         }
         await panZoom.setViewport({
           x: viewport.x ?? tX,
           y: viewport.y ?? tY,
           zoom: viewport.zoom ?? tZoom
         }, options);
-        return Promise.resolve(true);
+        return true;
       },
       getViewport: () => {
         const [x, y, zoom] = store.getState().transform;
@@ -6544,14 +6295,14 @@ var useViewportHelper = () => {
         const { width, height, minZoom, maxZoom, panZoom } = store.getState();
         const viewport = getViewportForBounds(bounds, width, height, minZoom, maxZoom, options?.padding ?? 0.1);
         if (!panZoom) {
-          return Promise.resolve(false);
+          return false;
         }
         await panZoom.setViewport(viewport, {
           duration: options?.duration,
           ease: options?.ease,
           interpolate: options?.interpolate
         });
-        return Promise.resolve(true);
+        return true;
       },
       screenToFlowPosition: (clientPosition, options = {}) => {
         const { transform: transform2, snapGrid, snapToGrid, domNode } = store.getState();
@@ -6720,11 +6471,19 @@ function elementToRemoveChange(item) {
     type: "remove"
   };
 }
+var defaultOnError = createDevWarn("React Flow", "https://reactflow.dev/");
+function addEdge2(edgeParams, edges, options = {}) {
+  return addEdge(edgeParams, edges, {
+    ...options,
+    onError: options.onError ?? defaultOnError
+  });
+}
 var isNode = (element) => isNodeBase(element);
 var isEdge = (element) => isEdgeBase(element);
 function fixedForwardRef(render) {
   return ReactExports.forwardRef(render);
 }
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? ReactExports.useLayoutEffect : ReactExports.useEffect;
 function useQueue(runQueue) {
   const [serial, setSerial] = ReactExports.useState(BigInt(0));
   const [queue] = ReactExports.useState(() => createQueue(() => setSerial((n) => n + BigInt(1))));
@@ -7155,17 +6914,22 @@ var selector$h = (s) => ({
   userSelectionActive: s.userSelectionActive,
   elementsSelectable: s.elementsSelectable,
   connectionInProgress: s.connection.inProgress,
-  dragging: s.paneDragging
+  dragging: s.paneDragging,
+  panBy: s.panBy,
+  autoPanSpeed: s.autoPanSpeed
 });
-function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.Full, panOnDrag, paneClickDistance, selectionOnDrag, onSelectionStart, onSelectionEnd, onPaneClick, onPaneContextMenu, onPaneScroll, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, children: children2 }) {
+function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.Full, panOnDrag, autoPanOnSelection, paneClickDistance, selectionOnDrag, onSelectionStart, onSelectionEnd, onPaneClick, onPaneContextMenu, onPaneScroll, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, children: children2 }) {
+  const autoPanId = ReactExports.useRef(0);
   const store = useStoreApi();
-  const { userSelectionActive, elementsSelectable, dragging, connectionInProgress } = useStore(selector$h, shallow$1);
+  const { userSelectionActive, elementsSelectable, dragging, connectionInProgress, panBy: panBy2, autoPanSpeed } = useStore(selector$h, shallow$1);
   const isSelectionEnabled = elementsSelectable && (isSelecting || userSelectionActive);
   const container = ReactExports.useRef(null);
   const containerBounds = ReactExports.useRef();
   const selectedNodeIds = ReactExports.useRef(/* @__PURE__ */ new Set());
   const selectedEdgeIds = ReactExports.useRef(/* @__PURE__ */ new Set());
   const selectionInProgress = ReactExports.useRef(false);
+  const position = ReactExports.useRef({ x: 0, y: 0 });
+  const autoPanStarted = ReactExports.useRef(false);
   const onClick = (event) => {
     if (selectionInProgress.current || connectionInProgress) {
       selectionInProgress.current = false;
@@ -7190,7 +6954,7 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
     }
   };
   const onPointerDownCapture = (event) => {
-    const { domNode } = store.getState();
+    const { domNode, transform: transform2 } = store.getState();
     containerBounds.current = domNode?.getBoundingClientRect();
     if (!containerBounds.current)
       return;
@@ -7203,12 +6967,13 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
     event.target?.setPointerCapture?.(event.pointerId);
     selectionInProgress.current = false;
     const { x, y } = getEventPosition(event.nativeEvent, containerBounds.current);
+    const userSelectionStartPosition = pointToRendererPoint({ x, y }, transform2);
     store.setState({
       userSelectionRect: {
         width: 0,
         height: 0,
-        startX: x,
-        startY: y,
+        startX: userSelectionStartPosition.x,
+        startY: userSelectionStartPosition.y,
         x,
         y
       }
@@ -7218,30 +6983,21 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
       event.preventDefault();
     }
   };
-  const onPointerMove = (event) => {
-    const { userSelectionRect, transform: transform2, nodeLookup, edgeLookup, connectionLookup, triggerNodeChanges, triggerEdgeChanges, defaultEdgeOptions, resetSelectedElements } = store.getState();
-    if (!containerBounds.current || !userSelectionRect) {
+  function commitUserSelectionRect(mouseX, mouseY) {
+    const { userSelectionRect } = store.getState();
+    if (!userSelectionRect) {
       return;
     }
-    const { x: mouseX, y: mouseY } = getEventPosition(event.nativeEvent, containerBounds.current);
-    const { startX, startY } = userSelectionRect;
-    if (!selectionInProgress.current) {
-      const requiredDistance = selectionKeyPressed ? 0 : paneClickDistance;
-      const distance2 = Math.hypot(mouseX - startX, mouseY - startY);
-      if (distance2 <= requiredDistance) {
-        return;
-      }
-      resetSelectedElements();
-      onSelectionStart?.(event);
-    }
-    selectionInProgress.current = true;
+    const { transform: transform2, nodeLookup, edgeLookup, connectionLookup, triggerNodeChanges, triggerEdgeChanges, defaultEdgeOptions } = store.getState();
+    const userStartPosition = { x: userSelectionRect.startX, y: userSelectionRect.startY };
+    const { x: screenStartX, y: screenStartY } = rendererPointToPoint(userStartPosition, transform2);
     const nextUserSelectRect = {
-      startX,
-      startY,
-      x: mouseX < startX ? mouseX : startX,
-      y: mouseY < startY ? mouseY : startY,
-      width: Math.abs(mouseX - startX),
-      height: Math.abs(mouseY - startY)
+      startX: userStartPosition.x,
+      startY: userStartPosition.y,
+      x: mouseX < screenStartX ? mouseX : screenStartX,
+      y: mouseY < screenStartY ? mouseY : screenStartY,
+      width: Math.abs(mouseX - screenStartX),
+      height: Math.abs(mouseY - screenStartY)
     };
     const prevSelectedNodeIds = selectedNodeIds.current;
     const prevSelectedEdgeIds = selectedEdgeIds.current;
@@ -7272,6 +7028,53 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
       userSelectionActive: true,
       nodesSelectionActive: false
     });
+  }
+  function autoPan() {
+    if (!autoPanOnSelection || !containerBounds.current) {
+      return;
+    }
+    const [x, y] = calcAutoPan(position.current, containerBounds.current, autoPanSpeed);
+    panBy2({ x, y }).then((panned) => {
+      if (!selectionInProgress.current || !panned) {
+        autoPanId.current = requestAnimationFrame(autoPan);
+        return;
+      }
+      const { x: mx, y: my } = position.current;
+      commitUserSelectionRect(mx, my);
+      autoPanId.current = requestAnimationFrame(autoPan);
+    });
+  }
+  const cleanupAutoPan = () => {
+    cancelAnimationFrame(autoPanId.current);
+    autoPanId.current = 0;
+    autoPanStarted.current = false;
+  };
+  ReactExports.useEffect(() => {
+    return () => cleanupAutoPan();
+  }, []);
+  const onPointerMove = (event) => {
+    const { userSelectionRect, transform: transform2, resetSelectedElements } = store.getState();
+    if (!containerBounds.current || !userSelectionRect) {
+      return;
+    }
+    const { x: mouseX, y: mouseY } = getEventPosition(event.nativeEvent, containerBounds.current);
+    position.current = { x: mouseX, y: mouseY };
+    const screenStart = rendererPointToPoint({ x: userSelectionRect.startX, y: userSelectionRect.startY }, transform2);
+    if (!selectionInProgress.current) {
+      const requiredDistance = selectionKeyPressed ? 0 : paneClickDistance;
+      const distance2 = Math.hypot(mouseX - screenStart.x, mouseY - screenStart.y);
+      if (distance2 <= requiredDistance) {
+        return;
+      }
+      resetSelectedElements();
+      onSelectionStart?.(event);
+    }
+    selectionInProgress.current = true;
+    if (!autoPanStarted.current) {
+      autoPan();
+      autoPanStarted.current = true;
+    }
+    commitUserSelectionRect(mouseX, mouseY);
   };
   const onPointerUp = (event) => {
     if (event.button !== 0) {
@@ -7291,9 +7094,14 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
         nodesSelectionActive: selectedNodeIds.current.size > 0
       });
     }
+    cleanupAutoPan();
+  };
+  const onPointerCancel = (event) => {
+    event.target?.releasePointerCapture?.(event.pointerId);
+    cleanupAutoPan();
   };
   const draggable = panOnDrag === true || Array.isArray(panOnDrag) && panOnDrag.includes(0);
-  return jsxRuntime.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, jsxRuntime.jsx(UserSelection, {})] });
+  return jsxRuntime.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, jsxRuntime.jsx(UserSelection, {})] });
 }
 function handleNodeClick({ id: id2, store, unselect = false, nodeRef }) {
   const { addSelectedNodes, unselectNodesAndEdges, multiSelectionActive, nodeLookup, onError } = store.getState();
@@ -7431,8 +7239,8 @@ function HandleComponent({ type = "source", position = Position.Top, isValidConn
       ...params
     };
     if (hasDefaultEdges) {
-      const { edges, setEdges } = store.getState();
-      setEdges(addEdge(edgeParams, edges));
+      const { edges, setEdges, onError } = store.getState();
+      setEdges(addEdge2(edgeParams, edges, { onError }));
     }
     onConnectAction?.(edgeParams);
     onConnect?.(edgeParams);
@@ -7628,7 +7436,7 @@ var win = typeof window !== "undefined" ? window : void 0;
 var selector$e = (s) => {
   return { nodesSelectionActive: s.nodesSelectionActive, userSelectionActive: s.userSelectionActive };
 };
-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 }) {
+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 }) {
   const { nodesSelectionActive, userSelectionActive } = useStore(selector$e, shallow$1);
   const selectionKeyPressed = useKeyPress(selectionKeyCode, { target: win });
   const panActivationKeyPressed = useKeyPress(panActivationKeyCode, { target: win });
@@ -7637,7 +7445,7 @@ function FlowRendererComponent({ children: children2, onPaneClick, onPaneMouseEn
   const _selectionOnDrag = selectionOnDrag && panOnDrag !== true;
   const isSelecting = selectionKeyPressed || userSelectionActive || _selectionOnDrag;
   useGlobalKeyHandler({ deleteKeyCode, multiSelectionKeyCode });
-  return jsxRuntime.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: jsxRuntime.jsxs(Pane, { onSelectionStart, onSelectionEnd, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneContextMenu, onPaneScroll, panOnDrag, isSelecting: !!isSelecting, selectionMode, selectionKeyPressed, paneClickDistance, selectionOnDrag: _selectionOnDrag, children: [children2, nodesSelectionActive && jsxRuntime.jsx(NodesSelection, { onSelectionContextMenu, noPanClassName, disableKeyboardA11y })] }) });
+  return jsxRuntime.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: jsxRuntime.jsxs(Pane, { onSelectionStart, onSelectionEnd, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneContextMenu, onPaneScroll, panOnDrag, autoPanOnSelection, isSelecting: !!isSelecting, selectionMode, selectionKeyPressed, paneClickDistance, selectionOnDrag: _selectionOnDrag, children: [children2, nodesSelectionActive && jsxRuntime.jsx(NodesSelection, { onSelectionContextMenu, noPanClassName, disableKeyboardA11y })] }) });
 }
 FlowRendererComponent.displayName = "FlowRenderer";
 var FlowRenderer = ReactExports.memo(FlowRendererComponent);
@@ -8442,16 +8250,17 @@ function useStylesLoadedWarning() {
     }
   }, []);
 }
-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 }) {
+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 }) {
   useNodeOrEdgeTypesWarning(nodeTypes);
   useNodeOrEdgeTypesWarning(edgeTypes);
   useStylesLoadedWarning();
   useOnInitHandler(onInit);
   useViewportSync(viewport);
-  return jsxRuntime.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: jsxRuntime.jsxs(Viewport, { children: [jsxRuntime.jsx(EdgeRenderer, { edgeTypes, onEdgeClick, onEdgeDoubleClick, onReconnect, onReconnectStart, onReconnectEnd, onlyRenderVisibleElements, onEdgeContextMenu, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius, defaultMarkerColor, noPanClassName, disableKeyboardA11y, rfId }), jsxRuntime.jsx(ConnectionLineWrapper, { style: connectionLineStyle, type: connectionLineType, component: connectionLineComponent, containerStyle: connectionLineContainerStyle }), jsxRuntime.jsx("div", { className: "react-flow__edgelabel-renderer" }), jsxRuntime.jsx(NodeRenderer, { nodeTypes, onNodeClick, onNodeDoubleClick, onNodeMouseEnter, onNodeMouseMove, onNodeMouseLeave, onNodeContextMenu, nodeClickDistance, onlyRenderVisibleElements, noPanClassName, noDragClassName, disableKeyboardA11y, nodeExtent, rfId }), jsxRuntime.jsx("div", { className: "react-flow__viewport-portal" })] }) });
+  return jsxRuntime.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: jsxRuntime.jsxs(Viewport, { children: [jsxRuntime.jsx(EdgeRenderer, { edgeTypes, onEdgeClick, onEdgeDoubleClick, onReconnect, onReconnectStart, onReconnectEnd, onlyRenderVisibleElements, onEdgeContextMenu, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius, defaultMarkerColor, noPanClassName, disableKeyboardA11y, rfId }), jsxRuntime.jsx(ConnectionLineWrapper, { style: connectionLineStyle, type: connectionLineType, component: connectionLineComponent, containerStyle: connectionLineContainerStyle }), jsxRuntime.jsx("div", { className: "react-flow__edgelabel-renderer" }), jsxRuntime.jsx(NodeRenderer, { nodeTypes, onNodeClick, onNodeDoubleClick, onNodeMouseEnter, onNodeMouseMove, onNodeMouseLeave, onNodeContextMenu, nodeClickDistance, onlyRenderVisibleElements, noPanClassName, noDragClassName, disableKeyboardA11y, nodeExtent, rfId }), jsxRuntime.jsx("div", { className: "react-flow__viewport-portal" })] }) });
 }
 GraphViewComponent.displayName = "GraphView";
 var GraphView = ReactExports.memo(GraphViewComponent);
+var devWarn = createDevWarn("React Flow", "https://reactflow.dev/");
 var getInitialState = ({ nodes, edges, defaultNodes, defaultEdges, width, height, fitView, fitViewOptions, minZoom = 0.5, maxZoom = 2, nodeOrigin, nodeExtent, zIndexMode = "basic" } = {}) => {
   const nodeLookup = /* @__PURE__ */ new Map();
   const parentLookup = /* @__PURE__ */ new Map();
@@ -8798,7 +8607,7 @@ var createStore2 = ({ nodes, edges, defaultNodes, defaultEdges, width, height, f
     setCenter: async (x, y, options) => {
       const { width: width2, height: height2, maxZoom: maxZoom2, panZoom } = get3();
       if (!panZoom) {
-        return Promise.resolve(false);
+        return false;
       }
       const nextZoom = typeof options?.zoom !== "undefined" ? options.zoom : maxZoom2;
       await panZoom.setViewport({
@@ -8806,7 +8615,7 @@ var createStore2 = ({ nodes, edges, defaultNodes, defaultEdges, width, height, f
         y: height2 / 2 - y * nextZoom,
         zoom: nextZoom
       }, { duration: options?.duration, ease: options?.ease, interpolate: options?.interpolate });
-      return Promise.resolve(true);
+      return true;
     },
     cancelConnection: () => {
       set3({
@@ -8851,14 +8660,14 @@ var wrapperStyle = {
   position: "relative",
   zIndex: 0
 };
-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) {
+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) {
   const rfId = id2 || "1";
   const colorModeClassName = useColorModeClass(colorMode);
   const wrapperOnScroll = ReactExports.useCallback((e) => {
     e.currentTarget.scrollTo({ top: 0, left: 0, behavior: "instant" });
     onScroll?.(e);
   }, [onScroll]);
-  return jsxRuntime.jsx("div", { "data-testid": "rf__wrapper", ...rest, onScroll: wrapperOnScroll, style: { ...style2, ...wrapperStyle }, ref, className: cc(["react-flow", className, colorModeClassName]), id: id2, role: "application", children: jsxRuntime.jsxs(Wrapper, { nodes, edges, width, height, fitView, fitViewOptions, minZoom, maxZoom, nodeOrigin, nodeExtent, zIndexMode, children: [jsxRuntime.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 }), jsxRuntime.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 }), jsxRuntime.jsx(SelectionListener, { onSelectionChange }), children2, jsxRuntime.jsx(Attribution, { proOptions, position: attributionPosition }), jsxRuntime.jsx(A11yDescriptions, { rfId, disableKeyboardA11y })] }) });
+  return jsxRuntime.jsx("div", { "data-testid": "rf__wrapper", ...rest, onScroll: wrapperOnScroll, style: { ...style2, ...wrapperStyle }, ref, className: cc(["react-flow", className, colorModeClassName]), id: id2, role: "application", children: jsxRuntime.jsxs(Wrapper, { nodes, edges, width, height, fitView, fitViewOptions, minZoom, maxZoom, nodeOrigin, nodeExtent, zIndexMode, children: [jsxRuntime.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 }), jsxRuntime.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 }), jsxRuntime.jsx(SelectionListener, { onSelectionChange }), children2, jsxRuntime.jsx(Attribution, { proOptions, position: attributionPosition }), jsxRuntime.jsx(A11yDescriptions, { rfId, disableKeyboardA11y })] }) });
 }
 fixedForwardRef(ReactFlow);
 function LinePattern({ dimensions, lineWidth, variant, className }) {
@@ -9305,57 +9114,11 @@ function useFlowState(initial) {
     setEdges((es) => applyEdgeChanges(changes, es));
   }, []);
   const onConnect = ReactExports.useCallback((connection) => {
-    setEdges((es) => addEdge(connection, es));
+    setEdges((es) => addEdge2(connection, es));
   }, []);
   const toGraph = ReactExports.useCallback(() => ({ nodes, edges }), [nodes, edges]);
   return { nodes, edges, setNodes, setEdges, onNodesChange, onEdgesChange, onConnect, toGraph };
 }
-/*! Bundled license information:
-
-use-sync-external-store/cjs/use-sync-external-store-shim.production.js:
-  (**
-   * @license React
-   * use-sync-external-store-shim.production.js
-   *
-   * Copyright (c) Meta Platforms, Inc. and affiliates.
-   *
-   * This source code is licensed under the MIT license found in the
-   * LICENSE file in the root directory of this source tree.
-   *)
-
-use-sync-external-store/cjs/use-sync-external-store-shim.development.js:
-  (**
-   * @license React
-   * use-sync-external-store-shim.development.js
-   *
-   * Copyright (c) Meta Platforms, Inc. and affiliates.
-   *
-   * This source code is licensed under the MIT license found in the
-   * LICENSE file in the root directory of this source tree.
-   *)
-
-use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.production.js:
-  (**
-   * @license React
-   * use-sync-external-store-shim/with-selector.production.js
-   *
-   * Copyright (c) Meta Platforms, Inc. and affiliates.
-   *
-   * This source code is licensed under the MIT license found in the
-   * LICENSE file in the root directory of this source tree.
-   *)
-
-use-sync-external-store/cjs/use-sync-external-store-shim/with-selector.development.js:
-  (**
-   * @license React
-   * use-sync-external-store-shim/with-selector.development.js
-   *
-   * Copyright (c) Meta Platforms, Inc. and affiliates.
-   *
-   * This source code is licensed under the MIT license found in the
-   * LICENSE file in the root directory of this source tree.
-   *)
-*/
 
 exports.applyStatusesToNodes = applyStatusesToNodes;
 exports.runFlow = runFlow;