reactjs - Fill text area based on CheckBox clicks

Not very proficient in React, I have the following functional component (by the way I know I could populate the Checkbox list below via a .map function, but for now I did it in this way because some things I tried were breaking)

import React from 'react';
import Card from '@material-ui/core/Card';
import CardActionArea from '@material-ui/core/CardActionArea';
import CardActions from '@material-ui/core/CardActions';
import CardContent from '@material-ui/core/CardContent';
import CardMedia from '@material-ui/core/CardMedia';
import Typography from '@material-ui/core/Typography';
import Button from '@material-ui/core/Button';
import FormLabel from '@material-ui/core/FormLabel';
import FormControl from '@material-ui/core/FormControl';
import FormGroup from '@material-ui/core/FormGroup';
import FormControlLabel from '@material-ui/core/FormControlLabel';
import FormHelperText from '@material-ui/core/FormHelperText';
import Checkbox from '@material-ui/core/Checkbox';
import Grid from '@material-ui/core/Grid';
import TextField from '@material-ui/core/TextField';

export default function TicketComponent(props) {

  const [state, setState] = React.useState({
    fluffy_cardigan: false,
    cropped_ls_top: false,
    cropped_jumpsuit: false,
    mama_jeans: false,
    mama_tshirt: false
  });

  const handleChange = (event) => {
    setState({ ...state, [event.target.name]: event.target.checked });

  };

  const { fluffy_cardigan, cropped_ls_top,cropped_jumpsuit, mama_jeans,mama_tshirt  } = state;

  console.log(state)

  return (
    <div>

    <Card>
      <CardActionArea>
        <CardContent>
          <Typography gutterBottom variant="h5" component="h2">
            Ticket Details
          </Typography>
          <Grid container  spacing={8} style=>
            <FormControl component="fieldset" >
              <FormLabel component="legend" style=>Item List</FormLabel>
              <FormGroup>
              <FormControlLabel
                control={<Checkbox name="cropped_ls_top" onChange={handleChange} checked={state.cropped_ls_top} />}
                label="Cropped Long-Sleeved Top"
              />
              <FormControlLabel
                control={<Checkbox name="cropped_jumpsuit" onChange={handleChange} checked={state.cropped_jumpsuit} />}
                label="Cropped Jumpsuit"
              />
              <FormControlLabel
                control={<Checkbox name="fluffy_cardigan" onChange={handleChange} checked={state.fluffy_cardigan} />}
                label="Fluffy Cardigan"
              />
              <FormControlLabel
                control={<Checkbox name="mama_jeans" onChange={handleChange} checked={state.mama_jeans} />}
                label="MAMA Skinny jeans"
              />
              <FormControlLabel
                control={<Checkbox name="mama_tshirt" onChange={handleChange} checked={state.mama_tshirt} />}
                label="MAMA T-Shirt"
              />


              </FormGroup>
            </FormControl>
            <TextField
              id="outlined-multiline-static"
              label="SKU"
              multiline
              defaultValue="test"
              variant="outlined"
            />
          </Grid>
        </CardContent>
      </CardActionArea>
    </Card>

    </div>
  );
}

which produces a checkbox list like shown below

I have added state to capture the various checkbox clicks.

What i want is the following:

1. Upon clicking a checkbox, paste some specific string values (I will take them from the props passed in, this is fine) on a text area component next to it. For now let's assume we paste just the labels of the checkboxes that are clicked. I want to expand this later to essentially paste a row of values on a table when a checkbox is clicked i.e. the text area initially is an empty table and then rows are added/removed
2. Then if I un-click a checkbox, remove those labels that were added
3. I want the text area initially to have the same size as the checkbox list i.e. you can see that the default outline is small, whereas I want to make it seem like there is a big text area waiting to receive all the different strings pasted from the clicks. Perhaps I need a different component, and how could I make the outline have the same size?

If my description is confusing happy to clarify