[bug]: How to let other element follow the animation to take hided place smoothly?

[sxhuan]

Which react-spring target are you using?

• @react-spring/web
• @react-spring/three
• @react-spring/native
• @react-spring/konva
• @react-spring/zdog

What version of react-spring are you using?

9.7.2

What's Wrong?

I am implementing a drawer, which pushes the content, I make the drawer animated, but the content does not follow smoothly like CSS transition, it has to wait until the animation is finished. is there any way to fix this?

Screen.Recording.2023-06-26.at.1.30.21.AM.mov

To Reproduce

drawer use useSpring, animated with position x, onRest callback to close the drawer

Expected Behaviour

expect content to follow the animation like CSS transition.

Link to repo

N/A

[joshuaellis]

It'll be an issue in your code, but without seeing it I doubt anyone will be able to offer you advice :)

[MUK-Dev]

If you are using flex to layout your drawer and the main body component. You should try giving flex-grow: 1 to your main component.