There is an unexpected space when using typography inside grid item - Material v4.12

There is an unexpected space between last item and second item.

My workaround is just use normal text instead of Typography

Steps to Reproduce 🕹

Here is my code

<Grid container direction="column" spacing={2}>
      <Grid item>
        <Typography variant="h1">Test</Typography>
      </Grid>
      <Grid item>
        <Grid container alignItems="center" style={{ border: '1px solid red' }}>
          <Grid item xs={2}>
            <Typography variant="body1">Testing Column 1</Typography>
          </Grid>
          <Grid item xs={4}>
            <Typography variant="body1">Testing Column 1</Typography>
          </Grid>
          <Grid item xs={6}>
            <Typography variant="body1">Testing Column 1</Typography>
          </Grid>
        </Grid>
      </Grid>
      <Grid item>Issue Here</Grid>
    </Grid>

I would appreciate if you could look into this.

Start with the provided reproduction and inspect how Grid spacing interacts with Typography in the Material UI v4.12 implementation. Confirm whether the extra space is caused by the nested grid or typography styles, and consider the issue resolved when the reproduced layout no longer has the unexpected gap.