Horizontal Collapse is twitching

[tomashauser]

Steps to reproduce

Steps:

1. Open this link to live example: https://codesandbox.io/p/sandbox/transition-group-with-horizontal-collapse-2frjrp
2. Click on the "Add" button several times

Current behavior

In some instances a strange twitching happens. This event stretches the page, hence why there is a scrollbar for a brief moment. The card has a full width for a split second, and then it goes back to 0 width and expands slowly.

Expected behavior

The animation is smooth. There is no twitching, it starts from 0 width and expands as expected.

Context

I'm trying to achieve this exact scenario from the documentation but in a horizontal manner.

Your environment

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: horizontal, collapse, twitching, transition-group