I'd like for an exit animation to run in parallel with the incoming entry animation. For example, when the currentItem() here changes:
<Presence {/* exitBeforeEnter */} initial={false}>
<Show when={currentItem()} keyed>
{(item) => (
<Motion.div
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0}}
transition={{ duration: 0.3 }}
>
{item.title}
</Motion.div>
)}
</Show>
</Presence>
Right now when I do this, the current item's exit is immediate and only the incoming item's entry is animated. If I add exitBeforeEnter then I do get both animations, but not in parallel.
I'd like for an exit animation to run in parallel with the incoming entry animation. For example, when the
currentItem()here changes:Right now when I do this, the current item's exit is immediate and only the incoming item's entry is animated. If I add
exitBeforeEnterthen I do get both animations, but not in parallel.