@strategies/target-animate NPM

Summary

Extremely simple state-based animation

Using a TargetWrapper for any property's getter/setter, we can delay the resolution of the object to that display state.

Because this is not true animation - objects always simply approach their target state - it is not only very simple, but it effortlessly handles situations where regular timing-based animation get tricky (state changing before animation is complete).

Once set, objects can be updated based on stateful calculations.

Implementation

This is implemented in two ways:

This implementation is defining a react Hook: and exports useTarget, only depending on react for state management,
The second implementation depends on mobx for state management, and is more tailored to our internal setup.