@xyflow/react 12.0.0-next.2 → 12.0.0-next.21

package/dist/esm/types/store.d.ts

@@ -1,17 +1,18 @@
-import { ConnectionMode, type ConnectionStatus, type CoordinateExtent, type NodeDimensionUpdate, type UpdateNodePositions, type NodeOrigin, type OnConnect, type OnError, type OnViewportChange, type SelectionRect, type SnapGrid, type ConnectingHandle, type Transform, type XYPosition, type PanZoomInstance, type PanBy, type OnConnectStart, type OnConnectEnd, type OnNodeDrag, type OnSelectionDrag, type OnMoveStart, type OnMove, type OnMoveEnd, type IsValidConnection, type UpdateConnection, type EdgeLookup, type ConnectionLookup, type NodeLookup, OnBeforeDelete } from '@xyflow/system';
-import type { Edge, Node, NodeChange, OnNodesChange, OnEdgesChange, DefaultEdgeOptions, FitViewOptions, OnNodesDelete, OnEdgesDelete, OnSelectionChangeFunc, UnselectNodesAndEdgesParams, OnDelete } from '.';
-export type ReactFlowStore = {
+import { ConnectionMode, type ConnectionStatus, type CoordinateExtent, type InternalNodeUpdate, type UpdateNodePositions, type NodeOrigin, type OnConnect, type OnError, type OnViewportChange, type SelectionRect, type SnapGrid, type ConnectingHandle, type Transform, type XYPosition, type PanZoomInstance, type PanBy, type OnConnectStart, type OnConnectEnd, type OnSelectionDrag, type OnMoveStart, type OnMove, type OnMoveEnd, type UpdateConnection, type EdgeLookup, type ConnectionLookup, type NodeLookup, NodeChange, EdgeChange } from '@xyflow/system';
+import type { Edge, Node, OnNodesChange, OnEdgesChange, DefaultEdgeOptions, FitViewOptions, OnNodesDelete, OnEdgesDelete, OnSelectionChangeFunc, UnselectNodesAndEdgesParams, OnDelete, OnNodeDrag, OnBeforeDelete, IsValidConnection, InternalNode } from '.';
+export type ReactFlowStore<NodeType extends Node = Node, EdgeType extends Edge = Edge> = {
     rfId: string;
     width: number;
     height: number;
     transform: Transform;
-    nodes: Node[];
-    nodeLookup: NodeLookup<Node>;
+    nodes: NodeType[];
+    nodeLookup: NodeLookup<InternalNode<NodeType>>;
+    parentLookup: Map<string, InternalNode<NodeType>[]>;
     edges: Edge[];
-    edgeLookup: EdgeLookup<Edge>;
+    edgeLookup: EdgeLookup<EdgeType>;
     connectionLookup: ConnectionLookup;
-    onNodesChange: OnNodesChange | null;
-    onEdgesChange: OnEdgesChange | null;
+    onNodesChange: OnNodesChange<NodeType> | null;
+    onEdgesChange: OnEdgesChange<EdgeType> | null;
     hasDefaultNodes: boolean;
     hasDefaultEdges: boolean;
     domNode: HTMLDivElement | null;
@@ -45,9 +46,9 @@ export type ReactFlowStore = {
     connectionStartHandle: ConnectingHandle | null;
     connectionEndHandle: ConnectingHandle | null;
     connectionClickStartHandle: ConnectingHandle | null;
-    onNodeDragStart?: OnNodeDrag;
-    onNodeDrag?: OnNodeDrag;
-    onNodeDragStop?: OnNodeDrag;
+    onNodeDragStart?: OnNodeDrag<NodeType>;
+    onNodeDrag?: OnNodeDrag<NodeType>;
+    onNodeDragStop?: OnNodeDrag<NodeType>;
     onSelectionDragStart?: OnSelectionDrag;
     onSelectionDrag?: OnSelectionDrag;
     onSelectionDragStop?: OnSelectionDrag;
@@ -64,27 +65,28 @@ export type ReactFlowStore = {
     fitViewOnInit: boolean;
     fitViewDone: boolean;
     fitViewOnInitOptions: FitViewOptions | undefined;
-    onNodesDelete?: OnNodesDelete;
-    onEdgesDelete?: OnEdgesDelete;
+    onNodesDelete?: OnNodesDelete<NodeType>;
+    onEdgesDelete?: OnEdgesDelete<EdgeType>;
     onDelete?: OnDelete;
     onError?: OnError;
     onViewportChangeStart?: OnViewportChange;
     onViewportChange?: OnViewportChange;
     onViewportChangeEnd?: OnViewportChange;
-    onBeforeDelete?: OnBeforeDelete;
+    onBeforeDelete?: OnBeforeDelete<NodeType, EdgeType>;
     onSelectionChangeHandlers: OnSelectionChangeFunc[];
     ariaLiveMessage: string;
     autoPanOnConnect: boolean;
     autoPanOnNodeDrag: boolean;
     connectionRadius: number;
-    isValidConnection?: IsValidConnection;
+    isValidConnection?: IsValidConnection<EdgeType>;
     lib: string;
+    debug: boolean;
 };
-export type ReactFlowActions = {
-    setNodes: (nodes: Node[]) => void;
-    setEdges: (edges: Edge[]) => void;
-    setDefaultNodesAndEdges: (nodes?: Node[], edges?: Edge[]) => void;
-    updateNodeDimensions: (updates: Map<string, NodeDimensionUpdate>) => void;
+export type ReactFlowActions<NodeType extends Node, EdgeType extends Edge> = {
+    setNodes: (nodes: NodeType[]) => void;
+    setEdges: (edges: EdgeType[]) => void;
+    setDefaultNodesAndEdges: (nodes?: NodeType[], edges?: EdgeType[]) => void;
+    updateNodeInternals: (updates: Map<string, InternalNodeUpdate>) => void;
     updateNodePositions: UpdateNodePositions;
     resetSelectedElements: () => void;
     unselectNodesAndEdges: (params?: UnselectNodesAndEdgesParams) => void;
@@ -97,9 +99,10 @@ export type ReactFlowActions = {
     cancelConnection: () => void;
     updateConnection: UpdateConnection;
     reset: () => void;
-    triggerNodeChanges: (changes: NodeChange[]) => void;
+    triggerNodeChanges: (changes: NodeChange<NodeType>[]) => void;
+    triggerEdgeChanges: (changes: EdgeChange<EdgeType>[]) => void;
     panBy: PanBy;
-    fitView: (nodes: Node[], options?: FitViewOptions) => boolean;
+    fitView: (options?: FitViewOptions) => boolean;
 };
-export type ReactFlowState = ReactFlowStore & ReactFlowActions;
+export type ReactFlowState<NodeType extends Node = Node, EdgeType extends Edge = Edge> = ReactFlowStore<NodeType, EdgeType> & ReactFlowActions<NodeType, EdgeType>;
 //# sourceMappingURL=store.d.ts.map

package/dist/esm/types/store.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"store.d.ts","sourceRoot":"","sources":["../../../../packages/react/src/types/store.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"store.d.ts","sourceRoot":"","sources":["../../src/types/store.ts"],"names":[],"mappings":"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"}

package/dist/esm/utils/changes.d.ts

@@ -1,5 +1,5 @@
-import type { Node, Edge, EdgeChange, NodeChange, NodeSelectionChange, EdgeSelectionChange } from '../types';
-export declare function handleParentExpand(res: any[], updateItem: any): void;
+import { EdgeLookup, NodeLookup, EdgeChange, NodeChange, NodeSelectionChange, EdgeSelectionChange, NodeRemoveChange, EdgeRemoveChange } from '@xyflow/system';
+import type { Node, Edge, InternalNode } from '../types';
 /**
  * Drop in function that applies node changes to an array of nodes.
  * @public
@@ -20,7 +20,7 @@ export declare function handleParentExpand(res: any[], updateItem: any): void;
       <ReactFLow nodes={nodes} edges={edges} onNodesChange={onNodesChange} />
     );
  */
-export declare function applyNodeChanges<NodeType extends Node = Node>(changes: NodeChange[], nodes: NodeType[]): NodeType[];
+export declare function applyNodeChanges<NodeType extends Node = Node>(changes: NodeChange<NodeType>[], nodes: NodeType[]): NodeType[];
 /**
  * Drop in function that applies edge changes to an array of edges.
  * @public
@@ -38,10 +38,28 @@ export declare function applyNodeChanges<NodeType extends Node = Node>(changes:
     );
   
     return (
-      <ReactFLow nodes={nodes} edges={edges} onEdgesChange={onEdgesChange} />
+      <ReactFlow nodes={nodes} edges={edges} onEdgesChange={onEdgesChange} />
     );
  */
-export declare function applyEdgeChanges<EdgeType extends Edge = Edge>(changes: EdgeChange[], edges: EdgeType[]): EdgeType[];
-export declare const createSelectionChange: (id: string, selected: boolean) => NodeSelectionChange | EdgeSelectionChange;
-export declare function getSelectionChanges(items: any[], selectedIds?: Set<string>, mutateItem?: boolean): NodeSelectionChange[] | EdgeSelectionChange[];
+export declare function applyEdgeChanges<EdgeType extends Edge = Edge>(changes: EdgeChange<EdgeType>[], edges: EdgeType[]): EdgeType[];
+export declare function createSelectionChange(id: string, selected: boolean): NodeSelectionChange | EdgeSelectionChange;
+export declare function getSelectionChanges(items: Map<string, any>, selectedIds?: Set<string>, mutateItem?: boolean): NodeSelectionChange[] | EdgeSelectionChange[];
+/**
+ * This function is used to find the changes between two sets of elements.
+ * It is used to determine which nodes or edges have been added, removed or replaced.
+ *
+ * @internal
+ * @param params.items = the next set of elements (nodes or edges)
+ * @param params.lookup = a lookup map of the current store elements
+ * @returns an array of changes
+ */
+export declare function getElementsDiffChanges({ items, lookup, }: {
+    items: Node[] | undefined;
+    lookup: NodeLookup<InternalNode<Node>>;
+}): NodeChange[];
+export declare function getElementsDiffChanges({ items, lookup, }: {
+    items: Edge[] | undefined;
+    lookup: EdgeLookup;
+}): EdgeChange[];
+export declare function elementToRemoveChange<T extends Node | Edge>(item: T): NodeRemoveChange | EdgeRemoveChange;
 //# sourceMappingURL=changes.d.ts.map

package/dist/esm/utils/changes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"changes.d.ts","sourceRoot":"","sources":["../../../../packages/react/src/utils/changes.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAE7G,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,GAAG,QA0C7D;AAmGD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,gBAAgB,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,QAAQ,EAAE,CAEnH;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,gBAAgB,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,QAAQ,EAAE,CAEnH;AAED,eAAO,MAAM,qBAAqB,OAAQ,MAAM,YAAY,OAAO,KAAG,mBAAmB,GAAG,mBAI1F,CAAC;AAEH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,GAAG,EAAE,EACZ,WAAW,GAAE,GAAG,CAAC,MAAM,CAAa,EACpC,UAAU,UAAQ,GACjB,mBAAmB,EAAE,GAAG,mBAAmB,EAAE,CAmB/C"}
+{"version":3,"file":"changes.d.ts","sourceRoot":"","sources":["../../src/utils/changes.ts"],"names":[],"mappings":"AACA,OAAO,EACL,UAAU,EACV,UAAU,EACV,UAAU,EACV,UAAU,EACV,mBAAmB,EACnB,mBAAmB,EACnB,gBAAgB,EAChB,gBAAgB,EACjB,MAAM,gBAAgB,CAAC;AACxB,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AA4GzD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,gBAAgB,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAC3D,OAAO,EAAE,UAAU,CAAC,QAAQ,CAAC,EAAE,EAC/B,KAAK,EAAE,QAAQ,EAAE,GAChB,QAAQ,EAAE,CAEZ;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,gBAAgB,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAC3D,OAAO,EAAE,UAAU,CAAC,QAAQ,CAAC,EAAE,EAC/B,KAAK,EAAE,QAAQ,EAAE,GAChB,QAAQ,EAAE,CAEZ;AAED,wBAAgB,qBAAqB,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,mBAAmB,GAAG,mBAAmB,CAM9G;AAED,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,GAAG,CAAC,MAAM,EAAE,GAAG,CAAC,EACvB,WAAW,GAAE,GAAG,CAAC,MAAM,CAAa,EACpC,UAAU,UAAQ,GACjB,mBAAmB,EAAE,GAAG,mBAAmB,EAAE,CAmB/C;AAED;;;;;;;;GAQG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,KAAK,EACL,MAAM,GACP,EAAE;IACD,KAAK,EAAE,IAAI,EAAE,GAAG,SAAS,CAAC;IAC1B,MAAM,EAAE,UAAU,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;CACxC,GAAG,UAAU,EAAE,CAAC;AACjB,wBAAgB,sBAAsB,CAAC,EACrC,KAAK,EACL,MAAM,GACP,EAAE;IACD,KAAK,EAAE,IAAI,EAAE,GAAG,SAAS,CAAC;IAC1B,MAAM,EAAE,UAAU,CAAC;CACpB,GAAG,UAAU,EAAE,CAAC;AAmCjB,wBAAgB,qBAAqB,CAAC,CAAC,SAAS,IAAI,GAAG,IAAI,EAAE,IAAI,EAAE,CAAC,GAAG,gBAAgB,GAAG,gBAAgB,CAKzG"}

package/dist/esm/utils/general.d.ts

@@ -1,3 +1,4 @@
+import { type Ref, type RefAttributes } from 'react';
 import type { Edge, Node } from '../types';
 /**
  * Test whether an object is useable as a Node
@@ -6,7 +7,7 @@ import type { Edge, Node } from '../types';
  * @param element - The element to test
  * @returns A boolean indicating whether the element is an Node
  */
-export declare const isNode: (element: any) => element is Node<any, string | undefined>;
+export declare const isNode: <NodeType extends Node = Node>(element: unknown) => element is NodeType;
 /**
  * Test whether an object is useable as an Edge
  * @public
@@ -14,52 +15,6 @@ export declare const isNode: (element: any) => element is Node<any, string | und
  * @param element - The element to test
  * @returns A boolean indicating whether the element is an Edge
  */
-export declare const isEdge: (element: any) => element is Edge<any>;
-/**
- * Pass in a node, and get connected nodes where edge.source === node.id
- * @public
- * @param node - The node to get the connected nodes from
- * @param nodes - The array of all nodes
- * @param edges - The array of all edges
- * @returns An array of nodes that are connected over eges where the source is the given node
- */
-export declare const getOutgoers: (node: Node<any, string | undefined> | {
-    id: string;
-}, nodes: Node<any, string | undefined>[], edges: Edge<any>[]) => Node<any, string | undefined>[];
-/**
- * Pass in a node, and get connected nodes where edge.target === node.id
- * @public
- * @param node - The node to get the connected nodes from
- * @param nodes - The array of all nodes
- * @param edges - The array of all edges
- * @returns An array of nodes that are connected over eges where the target is the given node
- */
-export declare const getIncomers: (node: Node<any, string | undefined> | {
-    id: string;
-}, nodes: Node<any, string | undefined>[], edges: Edge<any>[]) => Node<any, string | undefined>[];
-/**
- * This util is a convenience function to add a new Edge to an array of edges
- * @remarks It also performs some validation to make sure you don't add an invalid edge or duplicate an existing one.
- * @public
- * @param edgeParams - Either an Edge or a Connection you want to add
- * @param edges -  The array of all current edges
- * @returns A new array of edges with the new edge added
- */
-export declare const addEdge: (edgeParams: Edge<any> | import("@xyflow/system").Connection, edges: Edge<any>[]) => Edge<any>[];
-/**
- * A handy utility to update an existing Edge with new properties
- * @param oldEdge - The edge you want to update
- * @param newConnection - The new connection you want to update the edge with
- * @param edges - The array of all current edges
- * @param options.shouldReplaceId - should the id of the old edge be replaced with the new connection id
- * @returns the updated edges array
- */
-export declare const updateEdge: (oldEdge: Edge<any>, newConnection: import("@xyflow/system").Connection, edges: Edge<any>[], options?: import("@xyflow/system").UpdateEdgeOptions | undefined) => Edge<any>[];
-/**
- * Get all connecting edges for a given set of nodes
- * @param nodes - Nodes you want to get the connected edges for
- * @param edges - All edges
- * @returns Array of edges that connect any of the given nodes with each other
- */
-export declare const getConnectedEdges: (nodes: Node<any, string | undefined>[], edges: Edge<any>[]) => Edge<any>[];
+export declare const isEdge: <EdgeType extends Edge = Edge>(element: unknown) => element is EdgeType;
+export declare function fixedForwardRef<T, P = {}>(render: (props: P, ref: Ref<T>) => JSX.Element): (props: P & RefAttributes<T>) => JSX.Element;
 //# sourceMappingURL=general.d.ts.map

package/dist/esm/utils/general.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"general.d.ts","sourceRoot":"","sources":["../../../../packages/react/src/utils/general.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAE3C;;;;;;GAMG;AACH,eAAO,MAAM,MAAM,4DAAmB,CAAC;AAEvC;;;;;;GAMG;AACH,eAAO,MAAM,MAAM,wCAAmB,CAAC;AAEvC;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW;;iGAA8B,CAAC;AAEvD;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW;;iGAA8B,CAAC;AAEvD;;;;;;;GAOG;AACH,eAAO,MAAM,OAAO,kGAAoB,CAAC;AAEzC;;;;;;;GAOG;AACH,eAAO,MAAM,UAAU,+KAAuB,CAAC;AAE/C;;;;;GAKG;AACH,eAAO,MAAM,iBAAiB,6EAAoC,CAAC"}
+{"version":3,"file":"general.d.ts","sourceRoot":"","sources":["../../src/utils/general.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,GAAG,EAAE,KAAK,aAAa,EAAc,MAAM,OAAO,CAAC;AAGjE,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAE3C;;;;;;GAMG;AACH,eAAO,MAAM,MAAM,0CAA2C,OAAO,wBACtC,CAAC;AAEhC;;;;;;GAMG;AACH,eAAO,MAAM,MAAM,0CAA2C,OAAO,wBACtC,CAAC;AAGhC,wBAAgB,eAAe,CAAC,CAAC,EAAE,CAAC,GAAG,EAAE,EACvC,MAAM,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,OAAO,GAC7C,CAAC,KAAK,EAAE,CAAC,GAAG,aAAa,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,OAAO,CAG9C"}

package/dist/esm/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../packages/react/src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC"}

package/dist/style.css

@@ -1,6 +1,8 @@
 /* this gets exported as style.css and can be used for the default theming */
 /* these are the necessary styles for React/Svelte Flow, they get used by base.css and style.css */
 .react-flow {
+  direction: ltr;
+
   --xy-edge-stroke-default: #b1b1b7;
   --xy-edge-stroke-width-default: 1;
   --xy-edge-stroke-selected-default: #555;
@@ -12,6 +14,8 @@
 
   --xy-minimap-background-color-default: #fff;
   --xy-minimap-mask-background-color-default: rgb(240, 240, 240, 0.6);
+  --xy-minimap-mask-stroke-color-default: transparent;
+  --xy-minimap-mask-stroke-width-default: 1;
   --xy-minimap-node-background-color-default: #e2e2e2;
   --xy-minimap-node-stroke-color-default: transparent;
   --xy-minimap-node-stroke-width-default: 2;
@@ -41,6 +45,10 @@
   --xy-controls-button-color-hover-default: inherit;
   --xy-controls-button-border-color-default: #eee;
   --xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, 0.08);
+
+  --xy-edge-label-background-color-default: #ffffff;
+  --xy-edge-label-color-default: inherit;
+  --xy-resize-background-color-default: #3367d9;
 }
 .react-flow.dark {
   --xy-edge-stroke-default: #3e3e3e;
@@ -54,6 +62,8 @@
 
   --xy-minimap-background-color-default: #141414;
   --xy-minimap-mask-background-color-default: rgb(60, 60, 60, 0.6);
+  --xy-minimap-mask-stroke-color-default: transparent;
+  --xy-minimap-mask-stroke-width-default: 1;
   --xy-minimap-node-background-color-default: #2b2b2b;
   --xy-minimap-node-stroke-color-default: transparent;
   --xy-minimap-node-stroke-width-default: 2;
@@ -81,6 +91,9 @@
   --xy-controls-button-color-hover-default: #fff;
   --xy-controls-button-border-color-default: #5b5b5b;
   --xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, 0.08);
+
+  --xy-edge-label-background-color-default: #141414;
+  --xy-edge-label-color-default: #f8f8f8;
 }
 .react-flow__background {
   background-color: var(--xy-background-color, var(--xy-background-color-props, var(--xy-background-color-default)));
@@ -96,14 +109,16 @@
 }
 .react-flow__pane {
   z-index: 1;
-  cursor: grab;
 }
 .react-flow__pane.selection {
     cursor: pointer;
   }
-.react-flow__pane.dragging {
-    cursor: grabbing;
+.react-flow__pane.draggable {
+    cursor: grab;
   }
+.react-flow__pane.draggable.dragging {
+      cursor: grabbing;
+    }
 .react-flow__viewport {
   transform-origin: 0 0;
   z-index: 2;
@@ -132,10 +147,17 @@
 .react-flow__edges {
   position: absolute;
 }
+.react-flow__edges svg {
+    overflow: visible;
+    position: absolute;
+    pointer-events: none;
+  }
 .react-flow__edge {
   pointer-events: visibleStroke;
-  cursor: pointer;
 }
+.react-flow__edge.selectable {
+    cursor: pointer;
+  }
 .react-flow__edge.animated path {
     stroke-dasharray: 5;
     animation: dashdraw 0.5s linear infinite;
@@ -153,8 +175,8 @@
     outline: none;
   }
 .react-flow__edge.selected .react-flow__edge-path,
-  .react-flow__edge:focus .react-flow__edge-path,
-  .react-flow__edge:focus-visible .react-flow__edge-path {
+  .react-flow__edge.selectable:focus .react-flow__edge-path,
+  .react-flow__edge.selectable:focus-visible .react-flow__edge-path {
     stroke: var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default));
   }
 .react-flow__edge-textwrapper {
@@ -173,7 +195,7 @@
     stroke-dasharray: 5;
     animation: dashdraw 0.5s linear infinite;
   }
-.react-flow__connectionline {
+svg.react-flow__connectionline {
   z-index: 1001;
   overflow: visible;
   position: absolute;
@@ -190,16 +212,18 @@
   pointer-events: all;
   transform-origin: 0 0;
   box-sizing: border-box;
-  cursor: grab;
+  cursor: default;
 }
-.react-flow__node.dragging {
-    cursor: grabbing;
+.react-flow__node.selectable {
+    cursor: pointer;
   }
-/* only used in Svelte Flow, should we remove it here? */
 .react-flow__node.draggable {
     cursor: grab;
     pointer-events: all;
   }
+.react-flow__node.draggable.dragging {
+      cursor: grabbing;
+    }
 .react-flow__nodesselection {
   z-index: 3;
   transform-origin: left top;
@@ -221,6 +245,9 @@
   border: 1px solid var(--xy-handle-border-color, var(--xy-handle-border-color-default));
   border-radius: 100%;
 }
+.react-flow__handle.connectingfrom {
+    pointer-events: all;
+  }
 .react-flow__handle.connectionindicator {
     pointer-events: all;
     cursor: crosshair;
@@ -303,15 +330,32 @@
   height: 100%;
   left: 0;
   top: 0;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
 }
 .react-flow__minimap {
-  background: var(--xy-minimap-background-color, var(--xy-minimap-background-color-default));
+  background: var(
+    --xy-minimap-background-color-props,
+    var(--xy-minimap-background-color, var(--xy-minimap-background-color-default))
+  );
 }
+.react-flow__minimap-svg {
+    display: block;
+  }
 .react-flow__minimap-mask {
     fill: var(
       --xy-minimap-mask-background-color-props,
       var(--xy-minimap-mask-background-color, var(--xy-minimap-mask-background-color-default))
     );
+    stroke: var(
+      --xy-minimap-mask-stroke-color-props,
+      var(--xy-minimap-mask-stroke-color, var(--xy-minimap-mask-stroke-color-default))
+    );
+    stroke-width: var(
+      --xy-minimap-mask-stroke-width-props,
+      var(--xy-minimap-mask-stroke-width, var(--xy-minimap-mask-stroke-width-default))
+    );
   }
 .react-flow__minimap-node {
     fill: var(
@@ -345,6 +389,14 @@
       var(--xy-background-pattern-color, var(--xy-background-pattern-cross-color-default))
     );
   }
+.react-flow__controls {
+  display: flex;
+  flex-direction: column;
+  box-shadow: var(--xy-controls-box-shadow, var(--xy-controls-box-shadow-default));
+}
+.react-flow__controls.horizontal {
+    flex-direction: row;
+  }
 .react-flow__controls-button {
     display: flex;
     justify-content: center;
@@ -374,11 +426,6 @@
       max-height: 12px;
       fill: currentColor;
     }
-.react-flow__edges svg {
-  overflow: visible;
-  position: absolute;
-  pointer-events: none;
-}
 .react-flow__edge.updating .react-flow__edge-path {
       stroke: #777;
     }
@@ -433,9 +480,6 @@
   .react-flow__selection:focus-visible {
     outline: none;
   }
-.react-flow__controls {
-  box-shadow: var(--xy-controls-box-shadow, var(--xy-controls-box-shadow-default));
-}
 .react-flow__controls-button:hover {
       background: var(
         --xy-controls-button-background-color-hover-props,
@@ -480,7 +524,7 @@
   height: 4px;
   border: 1px solid #fff;
   border-radius: 1px;
-  background-color: #3367d9;
+  background-color: var(--xy-resize-background-color, var(--xy-resize-background-color-default));
   transform: translate(-50%, -50%);
 }
 .react-flow__resize-control.handle.left {
@@ -513,7 +557,7 @@
 }
 /* line styles */
 .react-flow__resize-control.line {
-  border-color: #3367d9;
+  border-color: var(--xy-resize-background-color, var(--xy-resize-background-color-default));
   border-width: 0;
   border-style: solid;
 }
@@ -547,17 +591,9 @@
   border-bottom-width: 1px;
   top: 100%;
 }
-.react-flow {
-  --edge-label-background-color-default: #ffffff;
-  --edge-label-color-default: inherit;
-}
-.react-flow.dark {
-  --edge-label-background-color-default: #141414;
-  --edge-label-color-default: #f8f8f8;
-}
 .react-flow__edge-textbg {
-  fill: var(--edge-label-background-color, var(--edge-label-background-color-default));
+  fill: var(--xy-edge-label-background-color, var(--xy-edge-label-background-color-default));
 }
 .react-flow__edge-text {
-  fill: var(--edge-label-color, var(--edge-label-color-default));
+  fill: var(--xy-edge-label-color, var(--xy-edge-label-color-default));
 }

package/dist/umd/additional-components/Background/Background.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import { BackgroundProps } from './types';
-declare function Background({ id, variant, gap, size, lineWidth, offset, color, bgColor, style, className, patternClassName, }: BackgroundProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Background {
+import { type BackgroundProps } from './types';
+declare function BackgroundComponent({ id, variant, gap, size, lineWidth, offset, color, bgColor, style, className, patternClassName, }: BackgroundProps): import("react/jsx-runtime").JSX.Element;
+declare namespace BackgroundComponent {
     var displayName: string;
 }
-declare const _default: import("react").MemoExoticComponent<typeof Background>;
-export default _default;
+export declare const Background: import("react").MemoExoticComponent<typeof BackgroundComponent>;
+export {};
 //# sourceMappingURL=Background.d.ts.map

package/dist/umd/additional-components/Background/Background.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Background.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Background/Background.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,eAAe,EAAqB,MAAM,SAAS,CAAC;AAY7D,iBAAS,UAAU,CAAC,EAClB,EAAE,EACF,OAAgC,EAEhC,GAAQ,EAER,IAAI,EACJ,SAAa,EACb,MAAU,EACV,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAS,EACT,gBAAgB,GACjB,EAAE,eAAe,2CAuDjB;kBArEQ,UAAU;;;;AAyEnB,wBAAgC"}
+{"version":3,"file":"Background.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Background/Background.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,KAAK,eAAe,EAAqB,MAAM,SAAS,CAAC;AAWlE,iBAAS,mBAAmB,CAAC,EAC3B,EAAE,EACF,OAAgC,EAEhC,GAAQ,EAER,IAAI,EACJ,SAAa,EACb,MAAU,EACV,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAS,EACT,gBAAgB,GACjB,EAAE,eAAe,2CAuDjB;kBArEQ,mBAAmB;;;AAyE5B,eAAO,MAAM,UAAU,iEAA4B,CAAC"}

package/dist/umd/additional-components/Background/Patterns.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Patterns.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Background/Patterns.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,KAAK,gBAAgB,GAAG;IACtB,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC7B,OAAO,EAAE,iBAAiB,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAQ1F;AAED,KAAK,eAAe,GAAG;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,eAAe,2CAIhE"}
+{"version":3,"file":"Patterns.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Background/Patterns.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,KAAK,gBAAgB,GAAG;IACtB,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC7B,OAAO,EAAE,iBAAiB,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAQ1F;AAED,KAAK,eAAe,GAAG;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,eAAe,2CAIhE"}

package/dist/umd/additional-components/Background/index.d.ts

@@ -1,3 +1,3 @@
-export { default as Background } from './Background';
-export * from './types';
+export { Background } from './Background';
+export { BackgroundVariant, type BackgroundProps } from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/umd/additional-components/Background/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Background/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Background/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,KAAK,eAAe,EAAE,MAAM,SAAS,CAAC"}

package/dist/umd/additional-components/Background/types.d.ts

@@ -6,15 +6,28 @@ export declare enum BackgroundVariant {
 }
 export type BackgroundProps = {
     id?: string;
+    /** Color of the pattern */
     color?: string;
+    /** Color of the background */
     bgColor?: string;
+    /** Class applied to the container */
     className?: string;
+    /** Class applied to the pattern */
     patternClassName?: string;
+    /** Gap between repetitions of the pattern */
     gap?: number | [number, number];
+    /** Size of a single pattern element */
     size?: number;
+    /** Offset of the pattern */
     offset?: number;
+    /** Line width of the Line pattern */
     lineWidth?: number;
+    /** Variant of the pattern
+     * @example BackgroundVariant.Lines, BackgroundVariant.Dots, BackgroundVariant.Cross
+     * 'lines', 'dots', 'cross'
+     */
     variant?: BackgroundVariant;
+    /** Style applied to the container */
     style?: CSSProperties;
 };
 //# sourceMappingURL=types.d.ts.map

package/dist/umd/additional-components/Background/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Background/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,oBAAY,iBAAiB;IAC3B,KAAK,UAAU;IACf,IAAI,SAAS;IACb,KAAK,UAAU;CAChB;AAED,MAAM,MAAM,eAAe,GAAG;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Background/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,oBAAY,iBAAiB;IAC3B,KAAK,UAAU;IACf,IAAI,SAAS;IACb,KAAK,UAAU;CAChB;AAED,MAAM,MAAM,eAAe,GAAG;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,2BAA2B;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8BAA8B;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mCAAmC;IACnC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,6CAA6C;IAC7C,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,uCAAuC;IACvC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4BAA4B;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,qCAAqC;IACrC,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,CAAC"}

package/dist/umd/additional-components/Controls/ControlButton.d.ts

@@ -1,5 +1,3 @@
-import type { FC, PropsWithChildren } from 'react';
 import type { ControlButtonProps } from './types';
-declare const ControlButton: FC<PropsWithChildren<ControlButtonProps>>;
-export default ControlButton;
+export declare function ControlButton({ children, className, ...rest }: ControlButtonProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ControlButton.d.ts.map

package/dist/umd/additional-components/Controls/ControlButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ControlButton.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Controls/ControlButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAGnD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,iBAAiB,CAAC,kBAAkB,CAAC,CAI5D,CAAC;AAIF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"ControlButton.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Controls/ControlButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,kBAAkB,2CAMjF"}

package/dist/umd/additional-components/Controls/Controls.d.ts

@@ -1,5 +1,9 @@
-import { type PropsWithChildren } from 'react';
+/// <reference types="react" />
 import type { ControlProps } from './types';
-declare const _default: import("react").NamedExoticComponent<PropsWithChildren<ControlProps>>;
-export default _default;
+declare function ControlsComponent({ style, showZoom, showFitView, showInteractive, fitViewOptions, onZoomIn, onZoomOut, onFitView, onInteractiveChange, className, children, position, orientation, 'aria-label': ariaLabel, }: ControlProps): import("react/jsx-runtime").JSX.Element;
+declare namespace ControlsComponent {
+    var displayName: string;
+}
+export declare const Controls: import("react").MemoExoticComponent<typeof ControlsComponent>;
+export {};
 //# sourceMappingURL=Controls.d.ts.map

package/dist/umd/additional-components/Controls/Controls.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Controls.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Controls/Controls.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAgB9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;;AA2G5C,wBAA8B"}
+{"version":3,"file":"Controls.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Controls/Controls.tsx"],"names":[],"mappings":";AAeA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAQ5C,iBAAS,iBAAiB,CAAC,EACzB,KAAK,EACL,QAAe,EACf,WAAkB,EAClB,eAAsB,EACtB,cAAc,EACd,QAAQ,EACR,SAAS,EACT,SAAS,EACT,mBAAmB,EACnB,SAAS,EACT,QAAQ,EACR,QAAwB,EACxB,WAAwB,EACxB,YAAY,EAAE,SAAiC,GAChD,EAAE,YAAY,2CAqFd;kBApGQ,iBAAiB;;;AAwG1B,eAAO,MAAM,QAAQ,+DAA0B,CAAC"}

package/dist/umd/additional-components/Controls/Icons/FitView.d.ts

@@ -1,3 +1,2 @@
-declare function FitViewIcon(): import("react/jsx-runtime").JSX.Element;
-export default FitViewIcon;
+export declare function FitViewIcon(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=FitView.d.ts.map

package/dist/umd/additional-components/Controls/Icons/FitView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FitView.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/additional-components/Controls/Icons/FitView.tsx"],"names":[],"mappings":"AAAA,iBAAS,WAAW,4CAMnB;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"FitView.d.ts","sourceRoot":"","sources":["../../../../src/additional-components/Controls/Icons/FitView.tsx"],"names":[],"mappings":"AAAA,wBAAgB,WAAW,4CAM1B"}

package/dist/umd/additional-components/Controls/Icons/Lock.d.ts

@@ -1,3 +1,2 @@
-declare function LockIcon(): import("react/jsx-runtime").JSX.Element;
-export default LockIcon;
+export declare function LockIcon(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Lock.d.ts.map

package/dist/umd/additional-components/Controls/Icons/Lock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Lock.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/additional-components/Controls/Icons/Lock.tsx"],"names":[],"mappings":"AAAA,iBAAS,QAAQ,4CAMhB;AAED,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Lock.d.ts","sourceRoot":"","sources":["../../../../src/additional-components/Controls/Icons/Lock.tsx"],"names":[],"mappings":"AAAA,wBAAgB,QAAQ,4CAMvB"}