Sequencing user interaction animations with static animations.

[sgneo]

Hi everybody,

First of all thanks for developing react-spring, is definitely a great step in achieving mobile-like animations on web.

I would like to discuss the following 2 topics:

1. Chaining animations with useChain in which one animation is a user drag, and when the user drops the item another animation follows..the tricky part here is that the second animation would follow based on where the drop animation was. As example, if the user drags a card to x = -40, and drops, the second animation starts from x = -40, and finishes at x = - 800. How would you guys do something like this? I had to kind of manually chain them without useChain in order to work on the speed I wanted.

2. In the v9, the "set" from useSpring is a promise, but When trying to use that promise to chain an event, is seems that it's resolved very delayed, after about 1 second that the animation actually ended.

Thanks again for developing this tool.

[aleclarson]

I recommend making a minimal sandbox so others can understand your issue better.

For point 2, you might want to try setting the config.precision prop to a higher value (eg: 0.1) so it stops animating once close enough to the goal value. This will resolve the promise faster.

[sgneo]

Thank you, this is enough to solve my issue.