Hi everyone! 👋
I’m running into a frustrating issue with a multi-step component transition sequence and would love some insight on how to fix it natively.
The Setup:
I’m building a sidebar navigation with 4 component variants to control the opening/closing sequence:
Variant 1: Sidebar Closed (Default/Reset)
Variant 2: Sidebar Sliding In
Variant 3: Sidebar Open (Text & Links Visible)
Variant 4: Sidebar Sliding Out
The Goal:
When closing the menu from Variant 3, it transitions to Variant 4 (a 0.8s slide-out animation). Once Variant 4 finishes sliding out, I want it to wait a fraction of a second and then quietly reset back to Variant 1 (Instant / 0s) so it’s prepped for the next open click.
The Issue:
Even though I matched the After Delay trigger duration on Variant 4 to the exact duration/length of the Variant 3→4 slide-out animation, Framer completely ignores/skips the Variant 3→4 transition.
Instead of playing the slide-out, the component immediately jumps to Variant 1 the moment the close trigger is fired.
Currently practicing multi-step component transitions. Can anyone figure out the issue? I attached the remix link here: