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>
This commit is contained in:
Braks
2025-04-23 20:39:08 +02:00
parent 7d9ffe3f35
commit 265f928f13
2 changed files with 9 additions and 3 deletions
+5
View File
@@ -0,0 +1,5 @@
---
"@vue-flow/core": patch
---
Subtract container bounds when calculating pointer position.
@@ -9,17 +9,18 @@ import type { UseDragEvent } from './useDrag'
* @internal * @internal
*/ */
export function useGetPointerPosition() { export function useGetPointerPosition() {
const { viewport, snapGrid, snapToGrid } = useVueFlow() const { viewport, snapGrid, snapToGrid, vueFlowRef } = useVueFlow()
// returns the pointer position projected to the VF coordinate system // returns the pointer position projected to the VF coordinate system
return (event: UseDragEvent | MouseTouchEvent) => { return (event: UseDragEvent | MouseTouchEvent) => {
const containerBounds = vueFlowRef.value?.getBoundingClientRect() ?? { left: 0, top: 0 }
const evt = isUseDragEvent(event) ? event.sourceEvent : event 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 pointerPos = pointToRendererPoint({ x, y }, viewport.value)
const { x: xSnapped, y: ySnapped } = snapToGrid.value ? snapPosition(pointerPos, snapGrid.value) : pointerPos 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 { return {
xSnapped, xSnapped,
ySnapped, ySnapped,