From 8852df31323fe6c2edfbb5f507ed1eb751106d52 Mon Sep 17 00:00:00 2001
From: katspaugh <katspaugh@gmail.com>
Date: Sun, 26 Nov 2023 20:35:17 +0100
Subject: [PATCH] Fix: add stopPropagation to draggable

7.4.8

Fix: timeout to prevent clicks
---
 package.json     |  2 +-
 src/draggable.ts | 13 +++++++++++--
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index e76aed7df5..839a1c454e 100644
--- a/package.json
+++ b/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",
diff --git a/src/draggable.ts b/src/draggable.ts
index 5e79f5c13b..a46fd88424 100644
--- a/src/draggable.ts
+++ b/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)
     }
   }