refactor(core): return boolean from panBy

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>

packages/core/src/composables/useDrag.ts

@@ -55,7 +55,6 @@ function useDrag(params: UseDragParams) {
 
   let autoPanId = $ref(0)
   let autoPanStarted = $ref(false)
-  let previousTransform = $ref<XYPosition>({ x: 0, y: 0 })
 
   const getPointerPosition = useGetPointerPosition()
 
@@ -120,16 +119,9 @@ function useDrag(params: UseDragParams) {
         y: (lastPos.y ?? 0) - yMovement / viewport.zoom,
       }
 
-      panBy({ x: xMovement, y: yMovement }, (transform) => {
+      if (panBy({ x: xMovement, y: yMovement })) {
-        if (
+        updateNodes(nextPos)
-          Math.round(transform.x) !== Math.round(previousTransform.x) ||
+      }
-          Math.round(transform.y) !== Math.round(previousTransform.y)
-        ) {
-          updateNodes(nextPos)
-          previousTransform = transform
-          lastPos = nextPos
-        }
-      })
     }
 
     autoPanId = requestAnimationFrame(autoPan)

packages/core/src/store/actions.ts

@@ -629,11 +629,11 @@ export function useActions(
     return partiallyVisible || overlappingArea >= Number(nodeOrRect.width) * Number(nodeOrRect.height)
   }
 
-  const panBy: Actions['panBy'] = (delta, onBeforeTransform) => {
+  const panBy: Actions['panBy'] = (delta) => {
     const { viewport, dimensions, d3Zoom, d3Selection, translateExtent } = state
 
     if (!d3Zoom || !d3Selection || (!delta.x && !delta.y)) {
-      return
+      return false
     }
 
     const nextTransform = zoomIdentity.translate(viewport.x + delta.x, viewport.y + delta.y).scale(viewport.zoom)
@@ -645,9 +645,13 @@ export function useActions(
 
     const constrainedTransform = d3Zoom.constrain()(nextTransform, extent, translateExtent)
 
-    onBeforeTransform?.(constrainedTransform)
-
     d3Zoom.transform(d3Selection, constrainedTransform)
+
+    return (
+      state.viewport.x !== constrainedTransform.x ||
+      state.viewport.y !== constrainedTransform.y ||
+      state.viewport.zoom !== constrainedTransform.k
+    )
   }
 
   const setState: Actions['setState'] = (options) => {

packages/core/src/types/store.ts

@@ -1,6 +1,5 @@
 import type { CSSProperties, ComputedRef, ToRefs } from 'vue'
 import type { KeyFilter } from '@vueuse/core'
-import type { ZoomTransform } from 'd3-zoom'
 import type {
   Dimensions,
   ElementData,
@@ -266,8 +265,8 @@ export interface Actions extends ViewportFunctions {
   getIntersectingNodes: GetIntersectingNodes
   /** check if a node is intersecting with a defined area */
   isNodeIntersecting: IsNodeIntersecting
-  /** pan the viewport */
+  /** pan the viewport; return indicates if a transform has happened or not */
-  panBy: (delta: XYPosition, onBeforeTransform?: (transform: ZoomTransform) => void) => void
+  panBy: (delta: XYPosition) => boolean
 
   /** reset state to defaults */
   $reset: () => void