Merge pull request #5394 from xyflow/fix/get-node-intersections

`getNodeIntersections`: calculate overlapping area correctly

.changeset/popular-apples-invent.md

@@ -0,0 +1,6 @@
+---
+'@xyflow/react': patch
+'@xyflow/svelte': patch
+---
+
+Return intersections correctly of passed node is bigger than intersecting nodes

packages/react/src/hooks/useReactFlow.ts

@@ -222,7 +222,11 @@ export function useReactFlow<NodeType extends Node = Node, EdgeType extends Edge
           const overlappingArea = getOverlappingArea(currNodeRect, nodeRect);
           const partiallyVisible = partially && overlappingArea > 0;
 
-          return partiallyVisible || overlappingArea >= nodeRect.width * nodeRect.height;
+          return (
+            partiallyVisible ||
+            overlappingArea >= currNodeRect.width * currNodeRect.height ||
+            overlappingArea >= nodeRect.width * nodeRect.height
+          );
         }) as NodeType[];
       },
       isNodeIntersecting: (nodeOrRect, area, partially = true) => {

packages/react/src/types/instance.ts

@@ -105,7 +105,7 @@ export type GeneralHelpers<NodeType extends Node = Node, EdgeType extends Edge =
    * parameter can be set to `true` to include nodes that are only partially intersecting.
    *
    * @param node - the node or rect to check for intersections
-   * @param partially - if true, the node is considered to be intersecting if it partially overlaps with the passed node or rect
+   * @param partially - true by default, if set to false, only nodes that are fully intersecting will be returned
    * @param nodes - optional nodes array to check for intersections
    *
    * @returns an array of intersecting nodes
@@ -252,10 +252,10 @@ export type ReactFlowInstance<NodeType extends Node = Node, EdgeType extends Edg
   NodeType,
   EdgeType
 > &
-   ViewportHelperFunctions & {
+  ViewportHelperFunctions & {
-  /**
+    /**
-   * React Flow needs to mount the viewport to the DOM and initialize its zoom and pan behavior.
+     * React Flow needs to mount the viewport to the DOM and initialize its zoom and pan behavior.
-   * This property tells you when viewport is initialized.
+     * This property tells you when viewport is initialized.
-   */
+     */
     viewportInitialized: boolean;
   };

packages/svelte/src/lib/hooks/useSvelteFlow.svelte.ts

@@ -125,7 +125,7 @@ export function useSvelteFlow<NodeType extends Node = Node, EdgeType extends Edg
    * Returns all nodes that intersect with the given node or rect.
    *
    * @param node - the node or rect to check for intersections
-   * @param partially - if true, the node is considered to be intersecting if it partially overlaps with the passed node or rect
+   * @param partially - true by default, if set to false, only nodes that are fully intersecting will be returned
    * @param nodes - optional nodes array to check for intersections
    *
    * @returns an array of intersecting nodes
@@ -412,7 +412,11 @@ export function useSvelteFlow<NodeType extends Node = Node, EdgeType extends Edg
         const overlappingArea = getOverlappingArea(currNodeRect, nodeRect);
         const partiallyVisible = partially && overlappingArea > 0;
 
-        return partiallyVisible || overlappingArea >= nodeRect.width * nodeRect.height;
+        return (
+          partiallyVisible ||
+          overlappingArea >= currNodeRect.width * currNodeRect.height ||
+          overlappingArea >= nodeRect.width * nodeRect.height
+        );
       });
     },
     isNodeIntersecting: (