Nested Flex components don't fill correctly #1348
Description
Bug Report
Steps
When rendering a Flex within another Flex, the inner flex does not fill the parent when the fill property is passed.
In my use case, I have a component passing a JSX.Element (A) as a prop to another component (B) to render somewhere in its tree. B renders A inside of a Flex, since it's part of a complex layout. However, A is itself a Flex, since it has its own complex layout. When I try to make A fill the available space in B by setting the fill property, it does not correctly fill the available space.
Because A is being created elsewhere and passed into B, I cannot make clever assumption about the parent and replace the Flex in A with Flex.Items. It's possible that A may need to be rendered somewhere else where it is not wrapped in a Flex, and so if it was just a collection of Flex.Item elements, then it would render incorrectly in those cases.
Expected Result
The inner Flex fills the available space in the parent Flex
Actual Result
The inner Flex doe not fill the available space in the outer Flex. 💣
Version
0.27.0