Include origin directly in positionAbsolute of node

packages/react/src/additional-components/MiniMap/MiniMapNodes.tsx

@@ -86,7 +86,7 @@ function NodeComponentWrapperInner<NodeType extends Node>({
 }) {
   const { node, x, y } = useStore((s) => {
     const node = s.nodeLookup.get(id) as InternalNode<NodeType>;
-    const { x, y } = getNodePositionWithOrigin(node, nodeOrigin).positionAbsolute;
+    const { x, y } = node.internals.positionAbsolute;
 
     return {
       node,

packages/react/src/additional-components/NodeResizer/NodeResizeControl.tsx

@@ -73,20 +73,25 @@ function ResizeControl({
 
           const node = nodeLookup.get(id);
           if (node && node.expandParent && node.parentId) {
+            const origin = node.origin ?? nodeOrigin;
+            const width = change.width ?? node.measured.width!;
+            const height = change.height ?? node.measured.height!;
+
             const child: ParentExpandChild = {
               id: node.id,
               parentId: node.parentId,
               rect: {
-                width: change.width ?? node.measured.width!,
-                height: change.height ?? node.measured.height!,
+                width,
+                height,
                 ...evaluateAbsolutePosition(
                   {
-                    x: change.x ?? node.position.x,
-                    y: change.y ?? node.position.y,
+                    x: change.x ?? node.internals.positionAbsolute.x,
+                    y: change.y ?? node.internals.positionAbsolute.y,
                   },
+                  { width, height },
                   node.parentId,
                   nodeLookup,
-                  node.origin ?? nodeOrigin
+                  origin
                 ),
               },
             };
@@ -94,9 +99,10 @@ function ResizeControl({
             const parentExpandChanges = handleExpandParent([child], nodeLookup, parentLookup, nodeOrigin);
             changes.push(...parentExpandChanges);
 
-            // when the parent was expanded by the child node, its position will be clamped at 0,0
-            nextPosition.x = change.x ? Math.max(0, change.x) : undefined;
-            nextPosition.y = change.y ? Math.max(0, change.y) : undefined;
+            // when the parent was expanded by the child node, its position will be clamped at
+            // 0,0 when node origin is 0,0 and to width, height if it's 1,1
+            nextPosition.x = change.x ? Math.max(origin[0] * width, change.x) : undefined;
+            nextPosition.y = change.y ? Math.max(origin[1] * height, change.y) : undefined;
           }
 
           if (nextPosition.x !== undefined && nextPosition.y !== undefined) {

packages/react/src/components/NodeWrapper/index.tsx

@@ -6,7 +6,6 @@ import {
   elementSelectionKeys,
   errorMessages,
   getNodeDimensions,
-  getPositionWithOrigin,
   isInputDOMNode,
   nodeHasDimensions,
 } from '@xyflow/system';
@@ -87,15 +86,9 @@ export function NodeWrapper<NodeType extends Node>({
 
   const nodeDimensions = getNodeDimensions(node);
   const inlineDimensions = getNodeInlineStyleDimensions(node);
-  const clampedPosition = nodeExtent
-    ? clampPosition(internals.positionAbsolute, nodeExtent)
-    : internals.positionAbsolute;
+  // TODO: clamping should happen earlier
+  let clampedPosition = nodeExtent ? clampPosition(internals.positionAbsolute, nodeExtent) : internals.positionAbsolute;
 
-  const positionWithOrigin = getPositionWithOrigin({
-    ...clampedPosition,
-    ...nodeDimensions,
-    origin: node.origin || nodeOrigin,
-  });
   const hasPointerEvents = isSelectable || isDraggable || onClick || onMouseEnter || onMouseMove || onMouseLeave;
 
   const onMouseEnterHandler = onMouseEnter
@@ -181,9 +174,9 @@ export function NodeWrapper<NodeType extends Node>({
       ref={nodeRef}
       style={{
         zIndex: internals.z,
-        transform: `translate(${positionWithOrigin.x}px,${positionWithOrigin.y}px)`,
+        transform: `translate(${clampedPosition.x}px,${clampedPosition.y}px)`,
         pointerEvents: hasPointerEvents ? 'all' : 'none',
-        visibility: hasDimensions ? 'visible' : 'hidden',
+        visibility: node.measured.width ? 'visible' : 'hidden',
         ...node.style,
         ...inlineDimensions,
       }}

packages/react/src/hooks/useReactFlow.ts

@@ -46,7 +46,7 @@ export function useReactFlow<NodeType extends Node = Node, EdgeType extends Edge
 
       const nodeToUse = isNode<NodeType>(node) ? node : nodeLookup.get(node.id)!;
       const position = nodeToUse.parentId
-        ? evaluateAbsolutePosition(nodeToUse.position, nodeToUse.parentId, nodeLookup, nodeOrigin)
+        ? evaluateAbsolutePosition(nodeToUse.position, nodeToUse.measured, nodeToUse.parentId, nodeLookup, nodeOrigin)
         : nodeToUse.position;
 
       const nodeWithPosition = {

packages/react/src/store/index.ts

@@ -98,7 +98,7 @@ const createStore = ({
           return;
         }
 
-        updateAbsolutePositions(nodeLookup, { nodeOrigin });
+        updateAbsolutePositions(nodeLookup, parentLookup, { nodeOrigin });
 
         // we call fitView once initially after all dimensions are set
         let nextFitViewDone = fitViewDone;
@@ -155,8 +155,8 @@ const createStore = ({
         }
 
         if (parentExpandChildren.length > 0) {
-          const { nodeLookup, parentLookup } = get();
-          const parentExpandChanges = handleExpandParent(parentExpandChildren, nodeLookup, parentLookup);
+          const { nodeLookup, parentLookup, nodeOrigin } = get();
+          const parentExpandChanges = handleExpandParent(parentExpandChildren, nodeLookup, parentLookup, nodeOrigin);
           changes.push(...parentExpandChanges);
         }