Improve touch handling to distinguish taps from scrolls

[steezeburger]

Summary

Improved touch event handling in BlockComponent to properly distinguish between tap gestures and scroll gestures on mobile devices. Previously, touch events were being triggered even during scrolling, causing unintended interactions.

Key Changes

• Added touch tracking state (touchStartX, touchStartY) to record the initial touch position
• Implemented handleTouchStart() method to capture touch start coordinates
• Implemented isTapGesture() method to validate if a touch movement is a tap (movement < 10px threshold) or a scroll
• Replaced direct @touchend.prevent handlers with dedicated methods:
  • handleContentTouchEnd() - triggers edit mode only on valid taps
  • handleTodoTouchEnd() - toggles todo state only on valid taps
• Updated template bindings to use the new touch handlers for both block content and todo bullet elements
• Minor formatting cleanup (whitespace normalization in class bindings)

Implementation Details

• Uses a 10-pixel threshold to distinguish taps from scrolls, preventing accidental interactions during scrolling
• Touch tracking state is reset after each touch end event to prevent state leakage
• Maintains backward compatibility with click handlers for desktop users
• Prevents default behavior only when a valid tap gesture is detected

https://claude.ai/code/session_013bj2xNiCGAm2yCVtwJUidW