fix(react,svelte): calculate viewport dimensions inside of fitView action

packages/react/src/hooks/useViewportHelper.ts

@@ -6,6 +6,7 @@ import {
   fitView,
   type XYPosition,
   rendererPointToPoint,
+  getDimensions,
 } from '@xyflow/system';
 
 import { useStoreApi } from '../hooks/useStore';
@@ -64,9 +65,11 @@ const useViewportHelper = (): ViewportHelperFunctions => {
         return { x, y, zoom };
       },
       fitView: (options) => {
-        const { nodeLookup, width, height, minZoom, maxZoom, panZoom } = store.getState();
+        const { nodeLookup, minZoom, maxZoom, panZoom, domNode } = store.getState();
         const fitViewNodes = getFitViewNodes(nodeLookup, options);
 
+        const { width, height } = getDimensions(domNode!);
+
         return panZoom
           ? fitView(
               {

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

@@ -19,7 +19,8 @@ import {
   type UpdateConnection,
   type ConnectionState,
   type NodeOrigin,
-  getFitViewNodes
+  getFitViewNodes,
+  getDimensions
 } from '@xyflow/system';
 
 import type { EdgeTypes, NodeTypes, Node, Edge, FitViewOptions } from '$lib/types';
@@ -152,18 +153,21 @@ export function createStore({
 
   function fitView(options?: FitViewOptions) {
     const panZoom = get(store.panZoom);
+    const domNode = get(store.domNode);
 
-    if (!panZoom) {
+    if (!panZoom || !domNode) {
       return Promise.resolve(false);
     }
 
+    const { width, height } = getDimensions(domNode);
+
     const fitViewNodes = getFitViewNodes(get(store.nodeLookup), options);
 
     return fitViewSystem(
       {
         nodes: fitViewNodes,
-        width: get(store.width),
-        height: get(store.height),
+        width,
+        height,
         minZoom: get(store.minZoom),
         maxZoom: get(store.maxZoom),
         panZoom