@xyflow/react 12.0.0-next.0 → 12.0.0-next.10

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

@@ -1,5 +1,6 @@
+import { EdgeLookup, NodeLookup } from '@xyflow/system';
 import type { Node, Edge, EdgeChange, NodeChange, NodeSelectionChange, EdgeSelectionChange } from '../types';
-export declare function handleParentExpand(res: any[], updateItem: any): void;
+export declare function handleParentExpand(updatedElements: any[], updateItem: any): void;
 /**
  * Drop in function that applies node changes to an array of nodes.
  * @public
@@ -20,7 +21,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 +39,27 @@ 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 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: 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<Node>;
+}): NodeChange[];
+export declare function getElementsDiffChanges({ items, lookup, }: {
+    items: Edge[] | undefined;
+    lookup: EdgeLookup;
+}): EdgeChange[];
 //# sourceMappingURL=changes.d.ts.map

package/dist/umd/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":["../../../../packages/react/src/utils/changes.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAE7G,wBAAgB,kBAAkB,CAAC,eAAe,EAAE,GAAG,EAAE,EAAE,UAAU,EAAE,GAAG,QA2CzE;AAwHD;;;;;;;;;;;;;;;;;;;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,EAAE,EACZ,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,IAAI,CAAC,CAAC;CAC1B,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"}

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

@@ -6,7 +6,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<Record<string, unknown>, string | undefined> = Node<Record<string, unknown>, string | undefined>>(element: unknown) => element is NodeType;
 /**
  * Test whether an object is useable as an Edge
  * @public
@@ -14,52 +14,5 @@ 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<Record<string, unknown>, string | undefined> = Edge<Record<string, unknown>, string | undefined>>(element: unknown) => element is EdgeType;
 //# sourceMappingURL=general.d.ts.map

package/dist/umd/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":["../../../../packages/react/src/utils/general.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAE3C;;;;;;GAMG;AACH,eAAO,MAAM,MAAM,oIAA2C,OAAO,wBACtC,CAAC;AAEhC;;;;;;GAMG;AACH,eAAO,MAAM,MAAM,oIAA2C,OAAO,wBACtC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xyflow/react",
-  "version": "12.0.0-next.0",
+  "version": "12.0.0-next.10",
   "description": "React Flow - A highly customizable React library for building node-based editors and interactive flow charts.",
   "keywords": [
     "react",
@@ -40,14 +40,9 @@
     "directory": "packages/react"
   },
   "dependencies": {
-    "@types/d3": "^7.4.0",
-    "@types/d3-drag": "^3.0.1",
-    "@types/d3-selection": "^3.0.3",
     "classcat": "^5.0.3",
-    "d3-drag": "^3.0.0",
-    "d3-selection": "^3.0.0",
     "zustand": "^4.4.0",
-    "@xyflow/system": "0.0.13"
+    "@xyflow/system": "0.0.18"
   },
   "peerDependencies": {
     "react": ">=17",
@@ -67,15 +62,13 @@
     "postcss-rename": "^0.6.1",
     "react": "^18.2.0",
     "typescript": "5.1.3",
-    "@xyflow/rollup-config": "0.0.0",
     "@xyflow/tsconfig": "0.0.0",
+    "@xyflow/rollup-config": "0.0.0",
     "@xyflow/eslint-config": "0.0.0"
   },
   "rollup": {
     "globals": {
       "classcat": "cc",
-      "d3-selection": "d3Selection",
-      "d3-drag": "d3Drag",
       "zustand": "zustand",
       "zustand/shallow": "zustandShallow"
     },