State easing

While I’m in here, would you mind if I added one more util to the library? This one would be for transitioning state along cubic bezier curves. Below is an example of what I’m proposing…

<template>
  <div>
    <input v-model.number="baseNumber" /> {{ number }}
  </div>
</template>

<script>
export default {
  setup() {
    const baseNumber = ref(0)

    const number = useStateTransition(baseNumber, {
      duration: 1000,
      steps: 30, // probably a reasonable default, but allows for custom framerates
      transition: [0.77, 0, 0.175, 1] // maybe have aliases like 'easeInOutQuart'?
    })

    return { baseNumber, number }
  }
}
</script>

[scottbedard]

Awesome, thanks for letting me wedge those two utils into this library 😄

[scottbedard]

I don’t think it’s necessary to pull in additional libraries. I’ve thrown together a proof of concept that I can push up in just a few minutes, just cleaning some things up right now. If you look at it and decide you’d rather use a library like Tween, no worries, just go ahead and close the PR when I open it 🙂