[material-ui][docs] Confusion about custom component in Grid demos

Related page

https://mui.com/material-ui/react-grid/

Kind of issue

[Added by Sam: When looking at the Grid demos that use the styled() utility to define custom components, it's not immediately clear that those are not actually built-in Material UI components.]

Issue description

Your page is for Paper, but the demo code is for Box and Item. Item does not seem to work in Vite or is Item deprecated?

With

import { Grid, Item } from "@mui/material";
...
    <Grid container spacing={2}>
 <Grid item xs={3}>
        <Item>Work</Item>
    </Grid> 
...
</Grid>

I get the following error message:
The requested module '/node_modules/.vite/deps/@mui_material.js?v=b5e471c3' does not provide an export named 'Item'

Not import Item doesn't work either.

Context

I am trying to create a series of boxes in a grid for a calendar as an assignment, but Item does not work. Trying out Paper instead but them page does not explain how to increase the height of each Paper.

Search keywords: Item

Start with the Grid documentation page at https://mui.com/material-ui/react-grid/ and inspect the demos that use styled() to define Box and Item. Update the documentation so readers can distinguish custom demo components from Material UI exports and understand the relevant Paper sizing example; confirm the shown imports and examples are consistent.