chore(core): cleanup

packages/core/src/composables/useViewportHelper.ts

@@ -1,6 +1,6 @@
 import { zoomIdentity } from 'd3-zoom'
 import { computed } from 'vue'
-import type { ComputedGetters, D3Selection, GraphNode, Project, State, ViewportFunctions } from '../types'
+import type { D3Selection, GraphNode, Project, State, ViewportFunctions } from '../types'
 import { clampPosition, getRectOfNodes, getTransformForBounds, pointToRendererPoint, rendererPointToPoint, warn } from '../utils'
 
 export interface ViewportHelper extends ViewportFunctions {
@@ -41,9 +41,7 @@ const initialViewportHelper: ViewportHelper = {
  * @param state
  * @param getters
  */
-export function useViewportHelper(state: State, getters: ComputedGetters) {
+export function useViewportHelper(state: State) {
-  const { getNodes } = getters
-
   function zoom(scale: number, duration?: number) {
     return new Promise<boolean>((resolve) => {
       if (state.d3Selection && state.d3Zoom) {

packages/core/src/composables/useVueFlow.ts

@@ -56,7 +56,7 @@ export class Storage {
 
     const getters = useGetters(reactiveState, nodeIds, edgeIds)
 
-    const actions = useActions(id, reactiveState, getters, nodeIds, edgeIds)
+    const actions = useActions(id, reactiveState, nodeIds, edgeIds)
 
     actions.setState({ ...reactiveState, ...preloadedState })
 

packages/core/src/composables/useZoomPanHelper.ts

@@ -1,4 +1,5 @@
-import type { ComputedGetters, State, ViewportFunctions } from '../types'
+import { toReactive } from '@vueuse/core'
+import type { ViewportFunctions } from '../types'
 import { useVueFlow } from './useVueFlow'
 import { useViewportHelper } from './useViewportHelper'
 
@@ -6,9 +7,9 @@ import { useViewportHelper } from './useViewportHelper'
  * @deprecated use {@link useVueFlow} instead (all viewport functions are also available in {@link useVueFlow})
  */
 export function useZoomPanHelper(vueFlowId?: string): ViewportFunctions {
-  const state = $(useVueFlow({ id: vueFlowId }))
+  const state = useVueFlow({ id: vueFlowId })
 
-  const viewportHelper = useViewportHelper(state as State, state as unknown as ComputedGetters)
+  const viewportHelper = useViewportHelper(toReactive(state))
 
   return {
     fitView: (params) => viewportHelper.value.fitView(params),

packages/core/src/store/actions.ts

@@ -4,7 +4,6 @@ import { nextTick } from 'vue'
 import { until } from '@vueuse/core'
 import type {
   Actions,
-  ComputedGetters,
   CoordinateExtent,
   EdgeChange,
   EdgeRemoveChange,
@@ -56,13 +55,12 @@ import { storeOptionsToSkip, useState } from './state'
 export function useActions(
   id: string,
   state: State,
-  getters: ComputedGetters,
   // todo: change to a Set
   nodeIds: ComputedRef<string[]>,
   // todo: change to a Set
   edgeIds: ComputedRef<string[]>,
 ): Actions {
-  const viewportHelper = useViewportHelper(state, getters)
+  const viewportHelper = useViewportHelper(state)
 
   const updateNodeInternals: Actions['updateNodeInternals'] = (ids) => {
     const updateIds = ids ?? nodeIds.value ?? []