[material-ui][Stack] Not accepting a React Fragment when using it with a divider

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Steps to reproduce 🕹

Link to live example:

Steps:

1. Use the Stack component
2. Wrap the children elements inside a React Fragment. (in my particular scenario I am sending this as a prop that is why I send it wrapped in a fragment)
3. Add a prop to the Stack component to add "dividers" (divider={<div>xxx</div>})
4. The component generates the spacing between each element but it doesn't add the dividers

Sandbox example:
https://codesandbox.io/s/stack-divider-fragment-bug-lnypq9

Current behavior 😯

There is no divider between each children element.

<Stack>
  <div>one</div>
  // space
  <div>two</div>
  // space
  <div>three</div>
</Stack>

Expected behavior 🤔

Should add between each children element a divider

<Stack>
  <div>one</div>
  // space
  <divider/>
  // space
  <div>two</div>
  // space
  <divider/>
  // space
  <div>three</div>
</Stack>

Context 🔦

I created an extended version of the Stack component. It's almost the same but with some additions. If you send the children elements as a React Fragment is where you get the bug. I need to accept those because it's a valid JSX code and also because my component accepts the children prop.

Your environment 🌎

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