frontend

frontend/src/desktop/useDocumentDrag.js

@@ -3,6 +3,9 @@ import { useDesktopContext } from './context';
 import { preventAll } from './events';
 import { clamp, formatTransform } from './math';
 
+const DRAG_HYSTERESIS_PX = 4;
+const DRAG_HYSTERESIS_SQUARED = DRAG_HYSTERESIS_PX * DRAG_HYSTERESIS_PX;
+
 const useDocumentDrag = () => {
   const {
     layoutRef,
@@ -59,7 +62,6 @@ const useDocumentDrag = () => {
         );
       }
       preventAll(event);
-      const entry = layoutRef.current.get(docId) || null;
       const docKey = docId != null ? String(docId) : null;
       const doc = docKey ? documentLookup.get(docKey) : null;
       const { width: docWidth, height: docHeight } = ensureDocumentSize(doc);
@@ -68,6 +70,7 @@ const useDocumentDrag = () => {
         Number.isFinite(baseScale) && baseScale > 0 ? baseScale : 1;
       const defaultCenterX = canvasPadding + docWidth / 2;
       const defaultCenterY = canvasPadding + docHeight / 2;
+      const entry = layoutRef.current.get(docId) || null;
       const centerX = typeof entry?.centerX === 'number' ? entry.centerX : defaultCenterX;
       const centerY = typeof entry?.centerY === 'number' ? entry.centerY : defaultCenterY;
 
@@ -99,7 +102,6 @@ const useDocumentDrag = () => {
         dragScale: 1,
         baseScale: normalizedBaseScale,
         capturedTarget,
-        raised: false,
       };
       setDraggingId(docId);
     },
@@ -166,18 +168,13 @@ const useDocumentDrag = () => {
       const clampedCenterX = clamp(nextCenterX, minCenterX, maxCenterX);
       const clampedCenterY = clamp(nextCenterY, minCenterY, maxCenterY);
 
-      const prevCenterX = typeof entry.centerX === 'number' ? entry.centerX : state.originCenterX;
-      const prevCenterY = typeof entry.centerY === 'number' ? entry.centerY : state.originCenterY;
-      if (Math.abs(clampedCenterX - prevCenterX) < 0.5 && Math.abs(clampedCenterY - prevCenterY) < 0.5) {
-        if (debugDrag) {
-          console.log('[skeuo] handlePointerMove: movement under threshold for doc', state.docId);
+      if (!state.moved) {
+        const distanceSquared = deltaX * deltaX + deltaY * deltaY;
+        if (distanceSquared < DRAG_HYSTERESIS_SQUARED) {
+          return;
         }
-        return;
-      }
-
-      if (!state.raised) {
         bringToFront(state.docId);
-        state.raised = true;
+        state.moved = true;
       }
 
       const updated = { ...entry, centerX: clampedCenterX, centerY: clampedCenterY };
@@ -192,7 +189,6 @@ const useDocumentDrag = () => {
           state.dragScale || 1,
         );
       }
-      state.moved = true;
       if (debugDrag) {
         console.log('[skeuo] handlePointerMove: moved doc', state.docId, 'to', clampedCenterX, clampedCenterY);
       }