fix(core): subtract container bounds when getting pointer position (#1829)

* fix(core): subtract container bounds when getting pointer position Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * chore(changeset): add Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> * chore: cleanup Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com> --------- Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>

Author: bcakmakoglu

.changeset/great-jokes-arrive.md

@@ -0,0 +1,5 @@
+---
+"@vue-flow/core": patch
+---
+
+Subtract container bounds when calculating pointer position.

packages/core/src/composables/useGetPointerPosition.ts

@@ -9,17 +9,18 @@ import type { UseDragEvent } from './useDrag'
  * @internal
  */
 export function useGetPointerPosition() {
- const { viewport, snapGrid, snapToGrid } = useVueFlow()
+ const { viewport, snapGrid, snapToGrid, vueFlowRef } = useVueFlow()
 
  // returns the pointer position projected to the VF coordinate system
  return (event: UseDragEvent | MouseTouchEvent) => {
+ const containerBounds = vueFlowRef.value?.getBoundingClientRect() ?? { left: 0, top: 0 }
  const evt = isUseDragEvent(event) ? event.sourceEvent : event
 
- const { x, y } = getEventPosition(evt)
+ const { x, y } = getEventPosition(evt, containerBounds as DOMRect)
  const pointerPos = pointToRendererPoint({ x, y }, viewport.value)
  const { x: xSnapped, y: ySnapped } = snapToGrid.value ? snapPosition(pointerPos, snapGrid.value) : pointerPos
 
- // we need the snapped position in order to be able to skip unnecessary drag events
+ // we need the snapped position to be able to skip unnecessary drag events
  return {
  xSnapped,
  ySnapped,