diff --git a/src/container/ZoomPane/ZoomPane.vue b/src/container/ZoomPane/ZoomPane.vue
index 9e465c14..222ae432 100644
--- a/src/container/ZoomPane/ZoomPane.vue
+++ b/src/container/ZoomPane/ZoomPane.vue
@@ -205,9 +205,9 @@ onMounted(async () => {
     getEdges: onLoadGetEdges(store),
     toObject: onLoadToObject(store),
   }
-  store.hooks.paneReady.trigger(instance)
   store.instance = instance
   store.fitViewOnInit && instance.fitView()
+  store.hooks.paneReady.trigger(instance)
 })
 </script>
 <script lang="ts">
diff --git a/src/types/flow.ts b/src/types/flow.ts
index d7f1ac81..e0f476c3 100644
--- a/src/types/flow.ts
+++ b/src/types/flow.ts
@@ -179,5 +179,5 @@ export type UseVueFlow<N = any, E = N> = {
   store: FlowStore<N, E>
 } & FlowHooksOn<N, E> &
   ToRefs<State<N, E>> &
-  Getters &
+  Getters<N, E> &
   Actions<N, E>
diff --git a/src/types/store.ts b/src/types/store.ts
index 06d04c1f..64b0bb6e 100644
--- a/src/types/store.ts
+++ b/src/types/store.ts
@@ -10,14 +10,14 @@ import { FlowHooks, FlowHooksOn } from './hooks'
 
 export interface State<N = any, E = N> extends Omit<FlowOptions<N, E>, 'id' | 'modelValue'> {
   hooks: FlowHooks
-  instance?: FlowInstance
+  instance: FlowInstance | undefined
 
   nodes: GraphNode<N>[]
   edges: GraphEdge<E>[]
 
-  d3Zoom?: D3Zoom
-  d3Selection?: D3Selection
-  d3ZoomHandler?: D3ZoomHandler
+  d3Zoom: D3Zoom | undefined
+  d3Selection: D3Selection | undefined
+  d3ZoomHandler: D3ZoomHandler | undefined
   minZoom: number
   maxZoom: number
   defaultZoom: number
@@ -37,9 +37,9 @@ export interface State<N = any, E = N> extends Omit<FlowOptions<N, E>, 'id' | 'm
   multiSelectionKeyCode: KeyCode
   zoomActivationKeyCode: KeyCode
 
-  connectionNodeId?: string
-  connectionHandleId?: string
-  connectionHandleType?: HandleType
+  connectionNodeId: string | undefined
+  connectionHandleId: string | undefined
+  connectionHandleType: HandleType | undefined
   connectionPosition: XYPosition
   connectionMode: ConnectionMode
   connectionLineType: ConnectionLineType