fix: rubberband scrolling for uikit vanilla by using milliseconds as …

…delta time
pmndrs · Oct 17, 2024 · cec351a · cec351a
1 parent a1df879
commit cec351a
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 5 deletions.
diff --git a/packages/react/src/root.tsx b/packages/react/src/root.tsx
@@ -78,7 +78,8 @@ export const Root: (
   useFrame((_, delta) => {
     whileOnFrameRef.current = true
     for (const onFrame of onFrameSet) {
-      onFrame(delta)
+      //delta must be provided in milliseconds, therefore multiply by 1000
+      onFrame(delta * 1000)
     }
     whileOnFrameRef.current = false
   })

diff --git a/packages/uikit/src/scroll.ts b/packages/uikit/src/scroll.ts
@@ -154,13 +154,13 @@ export function computedScrollHandlers(
 
     scrollVelocity.multiplyScalar(0.9) //damping scroll factor
 
-    if (Math.abs(scrollVelocity.x) < 10 /** px per second */) {
+    if (Math.abs(scrollVelocity.x) < 0.01 /** 10 px per second */) {
       scrollVelocity.x = 0
     } else {
       root.requestFrame()
     }
 
-    if (Math.abs(scrollVelocity.y) < 10 /** px per second */) {
+    if (Math.abs(scrollVelocity.y) < 0.01 /** 10 px per second */) {
       scrollVelocity.y = 0
     } else {
       root.requestFrame()
@@ -234,7 +234,7 @@ export function computedScrollHandlers(
 
         downPointerMap.set(pointerId, {
           type: 'scroll-panel',
-          timestamp: performance.now() / 1000,
+          timestamp: performance.now(),
           localPoint,
         })
       },
@@ -271,7 +271,7 @@ export function computedScrollHandlers(
           scroll(event, distanceHelper.x, -distanceHelper.y, undefined, false)
           return
         }
-        const timestamp = performance.now() / 1000
+        const timestamp = performance.now()
         const deltaTime = timestamp - prevInteraction.timestamp
         scroll(event, -distanceHelper.x, distanceHelper.y, deltaTime, true)
         prevInteraction.timestamp = timestamp