text: import * as React from 'react';
  import { experimentalStyled as styled } from '@material-ui/core/styles';
  import Box from '@material-ui/core/Box';
  import Paper from '@material-ui/core/Paper';
  import Grid from '@material-ui/core/Grid';
  
  const Item = styled(Paper)(({ theme }) => ({
    // TODO withStyles removal
    ...theme.typography.body2,
    padding: theme.spacing(1),
    textAlign: 'center',
    color: theme.palette.text.secondary,
  }));
  
  export default function ColumnsGrid() {
    return (
      <Box sx={{ flexGrow: 1 }}>
        <Grid container spacing={2} columns={16}>
          <Grid item xs={8}>
            <Item>xs=8</Item>
          </Grid>
          <Grid item xs={8}>
            <Item>xs=8</Item>
          </Grid>
        </Grid>
      </Box>
    );
  }
  