nandorojo/moti

Animation reset or stop when component is rerendered

oliviercperrier opened this issue · 5 comments

oliviercperrier commented

Is there an existing issue for this?

  • I have searched the existing issues

Do you want this issue prioritized?

  • Yes, I have sponsored
  • Not urgent

Current Behavior

I have a button component with a Spinner (using moti animation). This spinner shows up when the loading props is set to true. The button opacity also change when the button is hovered. When the button is loading and hovered (in/out), the spinner animation reset or stop because de MotiView is rerendered.

Expected Behavior

The spinner animation should not stop or be reset when the MotiView is rerendered

Steps To Reproduce

See reproduction

Versions

see reproduction

Screenshots

No response

Reproduction

https://stackblitz.com/edit/nextjs-e2vcnq?file=pages%2Findex.tsx

oliviercperrier commented

@nandorojo This is blocking for us, if its possible to fix or if there is an alternative it would be appreciated. Thanks

nandorojo commented

If it's urgent for you, you can check the "I've sponsored" box in the original post.

Otherwise, I will take a look when I have time.

Consider memoizing the spinner.

oliviercperrier commented

@nandorojo Thanks for the quick response. In fact, memoizing works for use case! Thanks

i would still let this issue open (not urgent)

nandorojo commented

Glad it helped.

This is blocking for us, if it's possible to fix or if there is an alternative it would be appreciated. Thanks

For future reference, please consider sponsoring before tagging me.