Multiline secondary text for list react component - reactjs

Question

I am trying to add a second line of the secondary text of a list react material ui component.
How can I modify it? See live demo here.
<ListItemText primary="Photos" secondary="first row" secondary="second row"/>

Answer 1

I edited on file demo.js of (demo link)
import React from "react";
import PropTypes from "prop-types";
import { withStyles } from "#material-ui/core/styles";
import List from "#material-ui/core/List";
import ListItem from "#material-ui/core/ListItem";
import ListItemText from "#material-ui/core/ListItemText";
import Avatar from "#material-ui/core/Avatar";
import ImageIcon from "#material-ui/icons/Image";
import WorkIcon from "#material-ui/icons/Work";
import BeachAccessIcon from "#material-ui/icons/BeachAccess";
const styles = theme => ({
root: {
width: "100%",
maxWidth: 360,
backgroundColor: theme.palette.background.paper
}
});
function FolderList(props) {
const { classes } = props;
return (
<div className={classes.root}>
<List>
<ListItem>
<Avatar>
<ImageIcon />
</Avatar>
<ListItemText
primary="Photos"
secondary={
<div>
<div>line 1</div>
<div>line 2</div>
</div>
}
/>
</ListItem>
<ListItem>
<Avatar>
<WorkIcon />
</Avatar>
<ListItemText primary="Work" secondary="Jan 7, 2014" />
</ListItem>
<ListItem>
<Avatar>
<BeachAccessIcon />
</Avatar>
<ListItemText primary="Vacation" secondary="July 20, 2014" />
</ListItem>
</List>
</div>
);
}
FolderList.propTypes = {
classes: PropTypes.object.isRequired
};
export default withStyles(styles)(FolderList);
secondary props is node type, You can pass props as:
secondary={
<div>
<div>line 1</div>
<div>line 2</div>
</div>
}