React-transition-group dynamic exit animation for SwitchTransition

Question

I'm trying to make an app with a dynamic exit animation. Exit animation for SwitchTransition is set when the component is rendered and can't be changed later. It can be achieved using childFactory and TransitionGroup like here, but in this way the animation happens simultaneously. I need to make react wait until previous is unmounted - like in SwitchTransition. So the question: is it possible to have something like childFactory for SwitchTransition or make TransitionGroup behave the same way as SwitchTransition mode 'out-in'. Thanks in advance!

export default function App() {
  const [state, setState] = React.useState(true);
  const [direction, setDirection] = React.useState("left");
  return (
      <div className="main">
        <SwitchTransition mode="out-in">
          <CSSTransition
            key={state}
            addEndListener={(node, done) => {
              node.addEventListener("transitionend", done, false);
            }}
            classNames={direction === "left" ? "fade--left" : "fade--right"}
          >
            <div className="button-container">
              <Button
                onClick={() => {
                  setState((state) => !state);
                  const dir = Math.random() > 0.5 ? "right" : "left";
                  setDirection(dir);
                }}
              >
                {direction}
              </Button>
            </div>
          </CSSTransition>
        </SwitchTransition>
      </div>
  );
}