Fix: add stopPropagation to draggable

7.4.8

Fix: timeout to prevent clicks

package.json

@@ -1,6 +1,6 @@
 {
   "name": "wavesurfer.js",
-  "version": "7.4.7",
+  "version": "7.4.8",
   "license": "BSD-3-Clause",
   "author": "katspaugh",
   "description": "Navigable audio waveform player",

src/draggable.ts

@@ -4,19 +4,26 @@ export function makeDraggable(
   onStart?: (x: number, y: number) => void,
   onEnd?: () => void,
   threshold = 5,
+  mouseButton = 0,
 ): () => void {
   if (!element) return () => void 0
 
   let unsubscribeDocument = () => void 0
 
   const onPointerDown = (event: PointerEvent) => {
-    if (event.button !== 0) return
+    if (event.button !== mouseButton) return
+
+    event.preventDefault()
+    event.stopPropagation()
 
     let startX = event.clientX
     let startY = event.clientY
     let isDragging = false
 
     const onPointerMove = (event: PointerEvent) => {
+      event.preventDefault()
+      event.stopPropagation()
+
       const x = event.clientX
       const y = event.clientY
       const dx = x - startX
@@ -67,7 +74,9 @@ export function makeDraggable(
       document.removeEventListener('pointerup', onPointerUp)
       document.removeEventListener('pointercancel', onPointerUp)
       document.removeEventListener('touchmove', onTouchMove)
-      element.removeEventListener('click', onClick, { capture: true })
+      setTimeout(() => {
+        element.removeEventListener('click', onClick, { capture: true })
+      }, 10)
     }
   }