Is your feature request related to a problem? Please describe.
Refer Issue #1193
In light of React 19 and the push for Streaming, it seems right to reconsider adding this a feature.
Describe the solution you'd like
I just had a spike on this. My general approach, if anyone wants to take a stab, is to have a component with the same sig as Suspense i.e
<AnimateSuspense fallback={fallback}>{children}</AnimateSuspense>
Originally posted by @mattgperry in #1193
I have managed to make a simple solution which works along those lines and would love to contribute if this is a feature the motion team is willing to consider.
Describe alternatives you've considered
- One alternative could be to just add an example/guide for users to the docs as a basic implementation is not too complex and can easily be replicated, however considering React's (and Next's with the App Router) intention to make Streaming (i.e. Suspense) a vital part of their framework, it seems like a cruitial aspect to cover within the motion library.
- Second alternative is to create a
<motion.suspense> element, but considering that suspense is not an instrisic HTML element, the <AnimateSuspence> approach seems more suitable.
Additional context
Inspiration: A great solution by @lpic10 posted in the referenced thread -> CodeSandbox
Is your feature request related to a problem? Please describe.
Refer Issue #1193
In light of React 19 and the push for Streaming, it seems right to reconsider adding this a feature.
Describe the solution you'd like
Originally posted by @mattgperry in #1193
I have managed to make a simple solution which works along those lines and would love to contribute if this is a feature the motion team is willing to consider.
Describe alternatives you've considered
<motion.suspense>element, but considering that suspense is not an instrisic HTML element, the<AnimateSuspence>approach seems more suitable.Additional context
Inspiration: A great solution by @lpic10 posted in the referenced thread -> CodeSandbox