Right now subcomponents are passed as a list of special objects to some specific prop, like there:
menuItems = [
{ route: 'get-started', text: 'Get Started' },
{ route: 'css-framework', text: 'CSS Framework' },
{ route: 'components', text: 'Components' },
{ type: MenuItem.Types.SUBHEADER, text: 'Resources' },
{
type: MenuItem.Types.LINK,
payload: 'https://github.com/callemall/material-ui',
text: 'GitHub'
},
];
//Docked Left Nav
<LeftNav menuItems={menuItems} />
I'd argue it would be much more composable and extensible to reworking API to have something like this:
<LeftNav>
<MenuItem><Route to="get-started">Get Started</Route></MenuItem>
<Subheader>Resources</Subheader>
<MenuItem><a href="...">GitHub</a></MenuItem>
</LeftNav>
The same for all menus.