[Stepper] Abstracting Step into a component break display

[ghost]

Hello everyone!

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

I created a component that contains Steps. While trying to add this component to the Stepper, I noticed that the Steps lose their states. Here is an example:

Expected Behavior 🤔

Here is a screenshot of what I would like to get :

Steps to Reproduce 🕹

Link to the Sandbox.

Context 🔦

I'm want to conditionally add Steps to a Stepper.

Your Environment 🌎

Tech	Version
Material-UI	v5.0.0-alpha.16
React	17.0.1
Browser	Firefox Browser Developer 83.0b10 (64 bits)

[oliviertassinari]

The problem was solved in #21326, at least a large chunk of it.

If you are not allowing the cloneElement logic to kick-in, you need to provide the index and last props: https://codesandbox.io/s/adding-steps-that-are-in-another-component-to-a-stepper-does-not-work-forked-92lzi.

AFAIK, we can't do more about it without overengineering it. This issue will serve as documentation for the next developer facing the issue.