diff --git a/lib/use-tween-array.js b/lib/use-tween-array.js index 98638e0f..b77cfa99 100644 --- a/lib/use-tween-array.js +++ b/lib/use-tween-array.js @@ -10,12 +10,12 @@ export const isCloseEnough = (a = 0, b = 0) => Math.abs(a - b) < 0.1, }), [tween, setTween] = useState(target), animate = useCallback(() => { - state.current.request = requestAnimationFrame(animate); - if (!state.current.running) { return; } + state.current.request = requestAnimationFrame(animate); + setTween((tween) => { const target = state.current.target; @@ -28,7 +28,7 @@ export const isCloseEnough = (a = 0, b = 0) => Math.abs(a - b) < 0.1, isCloseEnough(tween[idx], t) ? t : (tween[idx] ?? 0) + - ((t ?? 0) - (tween[idx] ?? 0)) / speedFactor || 0 + ((t ?? 0) - (tween[idx] ?? 0)) / speedFactor || 0, ); }); }, []); @@ -42,8 +42,13 @@ export const isCloseEnough = (a = 0, b = 0) => Math.abs(a - b) < 0.1, if (state.current.target.length === 0 && target.length > 0) { setTween(target); } + state.current.target = target; + + if (state.current.running) return; + state.current.running = true; + state.current.request = requestAnimationFrame(animate); }, [target]); return tween;