Fix: use interaction state instead of device capability for drag guard

isTouchDevice() blocked mouse/trackpad drag on touch-capable laptops
(e.g. Windows with touchscreen). Now checks if a touch interaction is
actually in progress instead.

Also adds touchcancel binding to clean up hold timer state when the
OS interrupts a touch (notifications, palm rejection, etc).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
juan
2026-03-23 17:07:12 -07:00
parent 1b06a2f46b
commit a9e1c221a5
2 changed files with 5 additions and 6 deletions

View File

@@ -22,8 +22,10 @@ export default class extends Controller {
// ===== Mouse Drag Events =====
dragStart(event) {
// On touch devices, cancel native drag — use touch events with hold delay instead
if (this.isTouchDevice()) {
// If a touch interaction is in progress, cancel native drag —
// use touch events with hold delay instead.
// This avoids blocking mouse/trackpad drag on touch-capable laptops.
if (this.isTouching || this.pendingSection) {
event.preventDefault();
return;
}
@@ -34,10 +36,6 @@ export default class extends Controller {
event.dataTransfer.effectAllowed = "move";
}
isTouchDevice() {
return "ontouchstart" in window || navigator.maxTouchPoints > 0;
}
dragEnd(event) {
event.currentTarget.classList.remove("opacity-50");
event.currentTarget.setAttribute("aria-grabbed", "false");