Easily animate an arbitrary property

animate.js

const noop = () => {}

const animate = function(options = {}) {
  const defaultOptions = { from: 0, to: 1, duration: 1000, callback: noop, ease: t => t }
  const { from, to, duration, callback, ease } = {...defaultOptions, ...options}
  
  const delta = to - from

  let start

  return new Promise(resolve => {
    const tick = time => {
      if (!start) start = time

      const progress = (time - start) / duration

      if (progress >= 1) {
        callback(to)
        resolve()
        return
      }

      callback(from + ease(progress * delta))

      window.requestAnimationFrame(tick)
    }

    window.requestAnimationFrame(tick)
  })
}

export default animate