From 35ac1313ee180659e77b87d3d1faf0988c32e370 Mon Sep 17 00:00:00 2001
From: Rene Haas <king-sora@hotmail.de>
Date: Mon, 27 Mar 2023 18:26:36 +0200
Subject: [PATCH] improve pointer capture release code

---
 .../scrollbarsSetup/scrollbarsSetup.events.ts  | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/packages/overlayscrollbars/src/setups/scrollbarsSetup/scrollbarsSetup.events.ts b/packages/overlayscrollbars/src/setups/scrollbarsSetup/scrollbarsSetup.events.ts
index 400d2d7..bce46c6 100644
--- a/packages/overlayscrollbars/src/setups/scrollbarsSetup/scrollbarsSetup.events.ts
+++ b/packages/overlayscrollbars/src/setups/scrollbarsSetup/scrollbarsSetup.events.ts
@@ -67,6 +67,8 @@ const createRootClickStopPropagationEvents = (scrollbar: HTMLElement, documentEl
     on.bind(0, documentElm, 'click', stopPropagation, { _once: true, _capture: true }),
     { _capture: true }
   );
+const releasePointerCaptureEvents = 'pointerup pointerleave pointercancel lostpointercapture';
+
 const createInteractiveScrollEvents = (
   options: ReadonlyOptions,
   doc: Document,
@@ -119,11 +121,18 @@ const createInteractiveScrollEvents = (
       const handleCenter = getHandleOffset(handleRect, trackRect) + handleLength / 2;
       const relativeTrackPointerOffset = pointerDownOffset - trackRect[leftTopKey];
       const startOffset = isDragScroll ? 0 : relativeTrackPointerOffset - handleCenter;
+      const releasePointerCapture = (pointerUpEvent: PointerEvent) => {
+        // eslint-disable-next-line @typescript-eslint/no-use-before-define
+        runEachAndClear(offFns);
+        pointerCaptureElement.releasePointerCapture(pointerUpEvent.pointerId);
+      };
 
       const offFns = [
+        on(doc, releasePointerCaptureEvents, releasePointerCapture),
         on(doc, 'selectstart', (event: Event) => preventDefault(event), {
           _passive: false,
         }),
+        on(_track, releasePointerCaptureEvents, releasePointerCapture),
         on(_track, 'pointermove', (pointerMoveEvent: PointerEvent) => {
           const relativeMovement = pointerMoveEvent[clientXYKey] - pointerDownOffset;
 
@@ -154,15 +163,6 @@ const createInteractiveScrollEvents = (
         }
       }
 
-      on(
-        _track,
-        'pointerup',
-        (pointerUpEvent: PointerEvent) => {
-          runEachAndClear(offFns);
-          pointerCaptureElement.releasePointerCapture(pointerUpEvent.pointerId);
-        },
-        { _once: true }
-      );
       pointerCaptureElement.setPointerCapture(pointerDownEvent.pointerId);
     }
   });