Merge pull request #4670 from xyflow/fix-fit-view-origin

Update absolute positions before initial fitView

.changeset/curly-cows-repeat.md

@@ -0,0 +1,7 @@
+---
+'@xyflow/svelte': patch
+'@xyflow/system': patch
+'@xyflow/react': patch
+---
+
+Fix initial `fitView` not working correctly for `nodeOrigin` other than [0,0]

.changeset/cyan-frogs-lick.md

@@ -0,0 +1,6 @@
+---
+'@xyflow/svelte': patch
+'@xyflow/react': patch
+---
+
+Improve `fitView` to respect clamped node positions based on `nodeExtent`

packages/svelte/src/lib/store/index.ts

@@ -20,6 +20,7 @@ import {
   type ConnectionState,
   type NodeOrigin,
   getFitViewNodes,
+  updateAbsolutePositions,
   getDimensions
 } from '@xyflow/system';
 
@@ -97,6 +98,7 @@ export function createStore({
 
   function updateNodeInternals(updates: Map<string, InternalNodeUpdate>) {
     const nodeLookup = get(store.nodeLookup);
+    const parentLookup = get(store.parentLookup);
     const { changes, updatedInternals } = updateNodeInternalsSystem(
       updates,
       nodeLookup,
@@ -109,6 +111,8 @@ export function createStore({
       return;
     }
 
+    updateAbsolutePositions(nodeLookup, parentLookup, { nodeOrigin, nodeExtent });
+
     if (!get(store.fitViewOnInitDone) && get(store.fitViewOnInit)) {
       const fitViewOptions = get(store.fitViewOptions);
       const fitViewOnInitDone = fitViewSync({

packages/system/src/utils/store.ts

@@ -61,11 +61,14 @@ export function updateAbsolutePositions<NodeType extends NodeBase>(
 ) {
   const _options = mergeObjects(defaultOptions, options);
   for (const node of nodeLookup.values()) {
-    if (!node.parentId) {
-      continue;
+    if (node.parentId) {
+      updateChildNode(node, nodeLookup, parentLookup, _options);
+    } else {
+      const positionWithOrigin = getNodePositionWithOrigin(node, _options.nodeOrigin);
+      const extent = isCoordinateExtent(node.extent) ? node.extent : _options.nodeExtent;
+      const clampedPosition = clampPosition(positionWithOrigin, extent, getNodeDimensions(node));
+      node.internals.positionAbsolute = clampedPosition;
     }
-
-    updateChildNode(node, nodeLookup, parentLookup, _options);
   }
 }