Merge pull request #4569 from xyflow/fix-intersections

Fix intersections in Svelte Flow

.changeset/rare-gorillas-repair.md

@@ -0,0 +1,5 @@
+---
+'@xyflow/svelte': patch
+---
+
+Fix getIntersectingNodes for subflows in Svelte Flow

examples/svelte/src/routes/examples/intersections/Flow.svelte

@@ -13,12 +13,14 @@
 	const { getIntersectingNodes } = useSvelteFlow();
 
 	function onNodeDrag({ detail: { targetNode } }) {
-		const intersections = getIntersectingNodes(targetNode).map((n) => n.id);
+		if (targetNode) {
+			const intersections = getIntersectingNodes(targetNode).map((n) => n.id);
 
-		$nodes.forEach((n) => {
+			$nodes.forEach((n) => {
-			n.class = intersections.includes(n.id) ? 'highlight' : '';
+				n.class = intersections.includes(n.id) ? 'highlight' : '';
-		});
+			});
-		$nodes = $nodes;
+			$nodes = $nodes;
+		}
 	}
 </script>
 

examples/svelte/src/routes/examples/intersections/nodes-and-edges.ts

@@ -10,7 +10,8 @@ export const initialNodes: Node[] = [
 	{
 		id: '2',
 		data: { label: 'Node 2' },
-		position: { x: 0, y: 150 }
+		position: { x: 0, y: 150 },
+		parentId: '1'
 	},
 	{
 		id: '3',

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

@@ -14,7 +14,7 @@ import {
   getViewportForBounds,
   getElementsToRemove,
   rendererPointToPoint,
-  nodeHasDimensions
+  evaluateAbsolutePosition
 } from '@xyflow/system';
 
 import { useStore } from '$lib/store';
@@ -247,15 +247,32 @@ export function useSvelteFlow(): {
     edges,
     domNode,
     nodeLookup,
-    edgeLookup
+    edgeLookup,
+    nodeOrigin
   } = useStore();
 
-  const getNodeRect = (nodeOrRect: Node | { id: Node['id'] }): Rect | null => {
+  const getNodeRect = (node: Node | { id: Node['id'] }): Rect | null => {
-    const node =
+    const $nodeLookup = get(nodeLookup);
-      isNode(nodeOrRect) && nodeHasDimensions(nodeOrRect)
+    const nodeToUse = isNode(node) ? node : $nodeLookup.get(node.id)!;
-        ? nodeOrRect
+    const position = nodeToUse.parentId
-        : get(nodeLookup).get(nodeOrRect.id);
+      ? evaluateAbsolutePosition(
-    return node ? nodeToRect(node) : null;
+          nodeToUse.position,
+          nodeToUse.measured,
+          nodeToUse.parentId,
+          $nodeLookup,
+          get(nodeOrigin)
+        )
+      : nodeToUse.position;
+
+    const nodeWithPosition = {
+      id: nodeToUse.id,
+      position,
+      width: nodeToUse.measured?.width ?? nodeToUse.width,
+      height: nodeToUse.measured?.height ?? nodeToUse.height,
+      data: nodeToUse.data
+    };
+
+    return nodeToRect(nodeWithPosition);
   };
 
   const updateNode = (