Is there a way to ensure that the entering element is not displayed until after the leaving element has completely disappeared? I'm facing an issue where the container needs to expand in height to accommodate both elements at once. However, I have chosen the out-in mode to prevent this type of overlap.
<div class="transition-wrapper">
<transition-group mode="out-in" name="left-right-slide">
<div class="panel-slot" key="left" v-if="slot === 'left'">
<slot :name="slot"></slot>
</div>
<div class="panel-slot" key="right" v-else>
<slot :name="slot"></slot>
</div>
</transition-group>
</div>