fix: node selection instability by using client coordinates for drag threshold

This commit is contained in:
Ze-Zheng Wu
2025-09-01 20:04:21 +08:00
parent cf4a3692c8
commit 2a35c65a02
2 changed files with 9 additions and 2 deletions
+5
View File
@@ -0,0 +1,5 @@
---
'@xyflow/system': patch
---
Fix node drag threshold behavior across different zoom levels. The drag threshold calculation now uses client coordinates instead of transformed coordinates, ensuring consistent behavior regardless of zoom level.
+4 -2
View File
@@ -334,8 +334,10 @@ export function XYDrag<OnNodeDrag extends (e: any, nodes: any, node: any) => voi
} }
if (!dragStarted) { if (!dragStarted) {
const x = pointerPos.xSnapped - (lastPos.x ?? 0); // Calculate distance in client coordinates for consistent drag threshold behavior across zoom levels
const y = pointerPos.ySnapped - (lastPos.y ?? 0); const currentMousePosition = getEventPosition(event.sourceEvent, containerBounds!);
const x = currentMousePosition.x - (mousePosition.x ?? 0);
const y = currentMousePosition.y - (mousePosition.y ?? 0);
const distance = Math.sqrt(x * x + y * y); const distance = Math.sqrt(x * x + y * y);
if (distance > nodeDragThreshold) { if (distance > nodeDragThreshold) {