From c1e9ba4b8e48c278efc95b64df956bedfdbb9d54 Mon Sep 17 00:00:00 2001
From: Rene Haas <king-sora@hotmail.de>
Date: Fri, 21 Jun 2024 10:08:04 +0200
Subject: [PATCH] add easign to first iteration of click scroll

---
 .../clickScrollPlugin/clickScrollPlugin.ts    | 19 +++++++++++--------
 1 file changed, 11 insertions(+), 8 deletions(-)

diff --git a/packages/overlayscrollbars/src/plugins/clickScrollPlugin/clickScrollPlugin.ts b/packages/overlayscrollbars/src/plugins/clickScrollPlugin/clickScrollPlugin.ts
index 24e9288a..e14488c3 100644
--- a/packages/overlayscrollbars/src/plugins/clickScrollPlugin/clickScrollPlugin.ts
+++ b/packages/overlayscrollbars/src/plugins/clickScrollPlugin/clickScrollPlugin.ts
@@ -1,4 +1,5 @@
 import { animateNumber, noop, selfClearTimeout } from '~/support';
+import type { EasingFn } from '~/support';
 import type { StaticPlugin } from '~/plugins';
 
 export const clickScrollPluginModuleName = '__osClickScrollPlugin';
@@ -20,17 +21,20 @@ export const ClickScrollPlugin = /* @__PURE__ */ (() => ({
         // The "click" should not be canceled by a "pointerup" event because very fast clicks or taps would cancel it too fast
         // The "click" should only be canceled by a subsequent "pointerdown" event because otherwise 2 animations would run
         // The "press" should be canceld by the next "pointerup" event
-        let iteration = 0;
         let stop = false;
         let stopClickAnimation = noop;
         let stopPressAnimation = noop;
         const [setFirstIterationPauseTimeout, clearFirstIterationPauseTimeout] =
           selfClearTimeout(222);
-        const animateClickScroll = (clickScrollProgress: number) =>
+        const animateClickScroll = (
+          clickScrollProgress: number,
+          iteration: number,
+          easing?: EasingFn | false
+        ) =>
           animateNumber(
             clickScrollProgress,
             clickScrollProgress + handleLength * Math.sign(startOffset),
-            133,
+            iteration ? 133 : 222,
             (animationProgress, _, animationCompleted) => {
               moveHandleRelative(animationProgress);
               const handleStartBound = getHandleOffset();
@@ -39,7 +43,7 @@ export const ClickScrollPlugin = /* @__PURE__ */ (() => ({
                 relativeTrackPointerOffset >= handleStartBound &&
                 relativeTrackPointerOffset <= handleEndBound;
               const animationCompletedAction = () => {
-                stopPressAnimation = animateClickScroll(animationProgress);
+                stopPressAnimation = animateClickScroll(animationProgress, iteration + 1);
               };
 
               if (!stop && animationCompleted && !mouseBetweenHandleBounds) {
@@ -48,13 +52,12 @@ export const ClickScrollPlugin = /* @__PURE__ */ (() => ({
                 } else {
                   setFirstIterationPauseTimeout(animationCompletedAction);
                 }
-
-                iteration++;
               }
-            }
+            },
+            easing
           );
 
-        stopClickAnimation = animateClickScroll(0);
+        stopClickAnimation = animateClickScroll(0, 0, (x) => 1 - (1 - x) * (1 - x));
 
         return (stopClick?: boolean) => {
           stop = true;