<TransitionGroup>

The TransitionGroup component manages and coordinates transitions within a group or a single element. It triggers transitions on child elements that have the :transition, :inTransition, or :outTransition directive when a state change occurs.

TransitionGroup doesn’t render an extra DOM element, or show up in the inspected component hierarchy.

const [isVisible, setVisible] = createSignal(true);

<TransitionGroup>
  <Show when={isVisible()}>
    <div use:transition={fade}>fades in and out</div>
  </Show>
</TransitionGroup>;