Improve drag and drop interactions by adjusting activation constraints
Adjusts drag activation constraints for pointer and touch sensors, enabling instant drag initiation in edit mode with a lower activation distance and no delay, while maintaining a higher threshold and delay outside of edit mode. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 77cfe984-2c65-4152-bb7a-0df28274fe66 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: 1b66c87b-bec3-4f9e-b161-b4789c48a6fa Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/c3c252e4-c83d-40ca-9fff-99a3ea60701e/77cfe984-2c65-4152-bb7a-0df28274fe66/qrzw3bH Replit-Helium-Checkpoint-Created: true
This commit is contained in:
@@ -254,13 +254,23 @@ export default function ServicesPage() {
|
|||||||
return rows;
|
return rows;
|
||||||
}, [services, orderedIds]);
|
}, [services, orderedIds]);
|
||||||
|
|
||||||
// Touch sensor uses delay so a tap-to-open isn't misread as a drag;
|
// Drag activation is tuned per-mode:
|
||||||
// pointer sensor needs only the tiny activation distance so mouse
|
// * Outside edit mode we never want a drag (cards are only tappable
|
||||||
// drags feel responsive on the desktop preview.
|
// to place an order), so a slightly higher distance threshold
|
||||||
|
// keeps the long-press-to-enter-edit gesture clean.
|
||||||
|
// * Inside edit mode the user has already opted into reordering, so
|
||||||
|
// drags should start instantly with no touch delay — matching the
|
||||||
|
// iOS home-screen "jiggle" feel. A tiny `distance: 2` activation
|
||||||
|
// still tolerates the natural finger jitter that happens before
|
||||||
|
// intentional movement, without making drags feel sluggish.
|
||||||
const sensors = useSensors(
|
const sensors = useSensors(
|
||||||
useSensor(PointerSensor, { activationConstraint: { distance: 6 } }),
|
useSensor(PointerSensor, {
|
||||||
|
activationConstraint: { distance: editMode ? 2 : 6 },
|
||||||
|
}),
|
||||||
useSensor(TouchSensor, {
|
useSensor(TouchSensor, {
|
||||||
activationConstraint: { delay: 150, tolerance: 8 },
|
activationConstraint: editMode
|
||||||
|
? { distance: 2 }
|
||||||
|
: { delay: 150, tolerance: 8 },
|
||||||
}),
|
}),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user