[docs] System props in MUI 9

[joshkel]

Related page

https://mui.com/material-ui/migration/upgrade-to-v9/#system-props, https://mui.com/material-ui/api/box/, https://mui.com/material-ui/api/grid/

Kind of issue

Unclear explanations

Issue description

If I understand https://mui.com/material-ui/migration/upgrade-to-v9/#system-props correctly, the removal of system props means that code like <Box display="flex" gap={1}> and <Grid container alignItems="flex-start" spacing={1}>. Instead, I should write <Grid container sx={{alignItems: 'flex-start'}} spacing={1}>

If I understand the following paragraph from https://mui.com/material-ui/api/grid/ and https://mui.com/material-ui/api/grid/ correctly:

As a CSS utility, the Grid component also supports all system properties. You can use them as props directly on the component.

then code like <Grid container alignItems="flex-start" spacing={1}> does work (or ought to work).

Stack and Typography have similar text.

Context

No response

Search keywords: system props

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

---

@joshkel Thanks again for creating this issue! If you have a moment, we would love to hear your thoughts on how we handled it with this short feedback form.