Animated number

animatedNumber.ts

function animatedNumber({
  from = 0,
  to = 0,
  duration = 0,
  onUpdate,
  onFinish,
}) {
  const startTime = performance.now()
  ;(function tick() {
    const current = performance.now()
    const elapsedTime = Math.min(current - startTime, duration)
    const currentValue = from + (to - from) * easeOut(elapsedTime / duration)
    if (elapsedTime === duration) {
      onFinish?.(to)
      return
    }
    onUpdate?.(currentValue)
    requestAnimationFrame(tick)
  })()
}
function easeOut(t: number) {
  return 1 - Math.pow(1 - t, 5)
}