chore: trigger fitViewOnInit after paneReady

packages/vue-flow/src/composables/useVueFlow.ts

@@ -38,7 +38,7 @@ export class Storage {
 
     const getters = useGetters(reactiveState)
 
-    const actions = useActions(reactiveState, getters, id)
+    const actions = useActions(reactiveState, getters)
 
     const hooksOn = <any>{}
     Object.entries(reactiveState.hooks).forEach(([n, h]) => {

packages/vue-flow/src/container/Viewport/Transform.vue

@@ -27,7 +27,6 @@ onMounted(async () => {
   // hide graph until dimensions are ready, so we don't have jumping graphs (ssr for example)
   ready = true
 
-  fitViewOnInit?.value && fitView()
   emits.paneReady({
     id,
     nodes,
@@ -42,6 +41,8 @@ onMounted(async () => {
     emits,
     ...rest,
   })
+
+  fitViewOnInit?.value && fitView()
 })
 </script>
 

packages/vue-flow/src/store/actions.ts

@@ -36,7 +36,7 @@ import {
 } from '~/utils'
 import { useZoomPanHelper } from '~/composables'
 
-export default (state: State, getters: ComputedGetters, id: string): Actions => {
+export default (state: State, getters: ComputedGetters): Actions => {
   const updateNodePositions: Actions['updateNodePositions'] = (dragItems, changed, dragging) => {
     const changes: NodePositionChange[] = []
 
@@ -341,12 +341,12 @@ export default (state: State, getters: ComputedGetters, id: string): Actions =>
 
   let zoomPanHelper: ReturnType<typeof useZoomPanHelper>
 
-  state.hooks.paneReady.on(() => {
+  state.hooks.paneReady.on(({ id }) => {
     zoomPanHelper = useZoomPanHelper(id)
   })
 
   const paneReady = async () => {
-    return new Promise<ReturnType<typeof useZoomPanHelper>>((resolve) => {
+    return new Promise<typeof zoomPanHelper>((resolve) => {
       if (!zoomPanHelper) {
         until(() => zoomPanHelper)
           .toBeTruthy()