State easing about vueuse HOT 6 CLOSED

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 🙂

from vueuse.

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

from vueuse.

This looks very useful, but my concern is that this can be over complicated to implement well and may surpass the goal of VueUse. Libraries like tween.js are much more mature and flexible to this, maybe we could add a wrapper addon for that?

from vueuse.

@antfu ok I've pushed up what I've done. This is the only complicated bit, it creates a function that we can use to get the corresponding value at various points in the transition. Let me know if you're ok with this amount of complexity in this library, because if so there are a couple changes I want to make before merging.

It's mostly just cleanup, but I'd also like to refactor it to use an raf loop instead of timeouts for smoother transitioning and getting rid of the "steps" concept. Also I'm not sure if I like the name useStateEasing and the object properties, do you have any thoughts on these? I hate naming things lol

from vueuse.

@antfu ok, we should be good to go now. I've made the refactor to a raf loop. I'm pleased with how it came out, the transition is much smoother now.

I made a couple other changes, let me know if you have any opinions on these...

1. Renamed "easing" to "transition", I think it's a bit more descriptive of what this utility is for
2. If the base number changes while state is still transitioning, the new transition will just start from wherever the previous one left off
3. It no longer rounds transitioned value. It occurred to me that people will likely want to use this with monetary values, so we should let them decide how to round things

Let me know if there is anything else you need from me 🙂

from vueuse.

Shipped in v0.0.23. Thanks :)

from vueuse.