How to Pause/Suspend animation of a Spring (and or Transition)

[lfpil]

Is there a simple way to pause the animation of a Spring?

I've tried to put an infinite friction, but bringing friction back to default would not resume the animation.

Super thanks

[drcmda]

Do you have the option to use hooks? This would make it easier. A Spring is a declaration of intent, to pause would essentially conflict with the props-declaration. You can do it, but only through reaching into internals <Spring ref={r => r && r.controller.cancel()} ... />

[lfpil]

Thank you for the quick reply.

I'd like to pause an ongoing animation, and be able to resume.

With your indication I tried to used the controller, as in this pen
https://codepen.io/anon/pen/OrwYaL

I couldn't find a cancel method, but stop and start.
Clicking stop would stop the animation at the end.
Clicking start would stop immediatly.

Reclicking start (after first start, or stop) would not resume the animation.

[lfpil]

I gave it a try with hooks, but am only partially happy with it.

https://codepen.io/anon/pen/vvVbNZ?editors=0011

Is that what you had in mind when saying hook would make it easier?

Also, the drawback with this approach is that duration seems to be reset.

[aleclarson]

The pause and cancel props are available in v9. #985