From 3b941869033e0193ab043cdb4a5de2c03c86baf5 Mon Sep 17 00:00:00 2001
From: moklick <info@moritzklack.com>
Date: Tue, 21 Jun 2022 18:06:07 +0200
Subject: [PATCH] fix(subflows): node extent relative to parent closes #2232

---
 example/src/Subflow/index.tsx | 13 +++++++++++--
 src/hooks/useDrag/utils.ts    |  8 ++++++++
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/example/src/Subflow/index.tsx b/example/src/Subflow/index.tsx
index 9ed5ed45..1d7c79d2 100644
--- a/example/src/Subflow/index.tsx
+++ b/example/src/Subflow/index.tsx
@@ -20,7 +20,13 @@ const onNodeClick = (_: MouseEvent, node: Node) => console.log('click', node);
 const onEdgeClick = (_: MouseEvent, edge: Edge) => console.log('click', edge);
 
 const initialNodes: Node[] = [
-  { id: '1', type: 'input', data: { label: 'Node 1' }, position: { x: 250, y: 5 }, className: 'light' },
+  {
+    id: '1',
+    type: 'input',
+    data: { label: 'Node 1' },
+    position: { x: 250, y: 5 },
+    className: 'light',
+  },
   {
     id: '4',
     data: { label: 'Node 4' },
@@ -34,7 +40,10 @@ const initialNodes: Node[] = [
     position: { x: 15, y: 15 },
     className: 'light',
     parentNode: '4',
-    extent: 'parent',
+    extent: [
+      [0, 0],
+      [100, 100],
+    ],
   },
   {
     id: '4b',
diff --git a/src/hooks/useDrag/utils.ts b/src/hooks/useDrag/utils.ts
index 480be034..cd0e0c41 100644
--- a/src/hooks/useDrag/utils.ts
+++ b/src/hooks/useDrag/utils.ts
@@ -84,6 +84,14 @@ export function updatePosition(
       }
       currentExtent = nodeExtent;
     }
+  } else if (dragItem.extent && dragItem.parentNode) {
+    const parent = nodeInternals.get(dragItem.parentNode);
+    const parentX = parent?.positionAbsolute?.x ?? 0;
+    const parentY = parent?.positionAbsolute?.y ?? 0;
+    currentExtent = [
+      [dragItem.extent[0][0] + parentX, dragItem.extent[0][1] + parentY],
+      [dragItem.extent[1][0] + parentX, dragItem.extent[1][1] + parentY],
+    ];
   }
 
   dragItem.position = currentExtent ? clampPosition(nextPosition, currentExtent as CoordinateExtent) : nextPosition;