Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[material-ui][docs] Audit and copyedit the v6 migration doc #43073

Merged
merged 37 commits into from
Aug 16, 2024
Merged
Show file tree
Hide file tree
Changes from 36 commits
Commits
Show all changes
37 commits
Select commit Hold shift + click to select a range
58c3d09
initializing
samuelsycamore Jul 25, 2024
2443fd0
why edits
samuelsycamore Jul 25, 2024
6a61fcf
optional
samuelsycamore Jul 25, 2024
aa7b0da
up to autocomplete
samuelsycamore Jul 26, 2024
45039bd
chip
samuelsycamore Jul 29, 2024
fdcfaf1
rating
samuelsycamore Jul 29, 2024
6afff02
overriding props
samuelsycamore Jul 29, 2024
751d2e5
Merge branch 'next' into v6-migration-edit
samuelsycamore Jul 29, 2024
271b447
completed first pass
samuelsycamore Jul 29, 2024
1f8c674
recalculations
samuelsycamore Jul 29, 2024
4661ff6
stabilizing
samuelsycamore Jul 29, 2024
8e8a050
quick second pass
samuelsycamore Jul 29, 2024
25ab901
restore start section
samuelsycamore Aug 1, 2024
0c38f50
fix accordion headers
samuelsycamore Aug 1, 2024
88eef68
unnecessary header
samuelsycamore Aug 1, 2024
d2e0e25
Merge branch 'next' into v6-migration-edit
samuelsycamore Aug 7, 2024
9e60ae8
nbsps
samuelsycamore Aug 7, 2024
69532c9
once youve upgraded
samuelsycamore Aug 7, 2024
129b7d9
better seo header
samuelsycamore Aug 7, 2024
a0d5b97
x note
samuelsycamore Aug 7, 2024
722e2a3
typo
samuelsycamore Aug 7, 2024
b56f51b
clarify wording
samuelsycamore Aug 7, 2024
6d0c971
nbsps
samuelsycamore Aug 7, 2024
35f2a30
Merge branch 'next' into v6-migration-edit
DiegoAndai Aug 13, 2024
2681eaf
Add testing breaking changes section
DiegoAndai Aug 13, 2024
be37e11
Complete change from "Migrate" to "Upgrade"
DiegoAndai Aug 13, 2024
568beca
Soften the push for adopting Pigment CSS
DiegoAndai Aug 13, 2024
e0909b2
Improve QOL improvements section
DiegoAndai Aug 13, 2024
4ad28e4
Move Grid2 changes to Stabilized section
DiegoAndai Aug 13, 2024
4456d13
Non-breaking space
DiegoAndai Aug 13, 2024
d538e5f
remove the for readability
alelthomas Aug 16, 2024
bc287fc
explain spacing change with CSS gap property
alelthomas Aug 16, 2024
171a071
minor improvements
alelthomas Aug 16, 2024
38ae702
Merge branch 'next' of https://github.com/mui/material-ui into v6-mig…
siriwatknp Aug 16, 2024
3bf11a3
fix non-breaking space
siriwatknp Aug 16, 2024
43dccd0
move all deprecations to its own page
siriwatknp Aug 16, 2024
6053e7c
fix non-breaking space
siriwatknp Aug 16, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/data/material/components/grid/grid.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ The `Grid` component shouldn't be confused with a data grid; it is closer to a l
:::

:::warning
The `Grid` component has been deprecated. Please use the [Grid v2](/material-ui/react-grid2/) instead. See how to migrate in the [Grid v2 migration guide](/material-ui/migration/migration-grid-v2/) and [Material UI v6 migration guide](/material-ui/migration/migrating-to-v6/).
The `Grid` component has been deprecated. Please use [Grid v2](/material-ui/react-grid2/) instead. See how to migrate in the [Grid v2 migration guide](/material-ui/migration/migration-grid-v2/) and [Material UI v6 upgrade guide](/material-ui/migration/upgrade-to-v6/).
:::

## How it works
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,51 @@ The composed CSS classes are going to be deprecated and eventually removed in fa
For example, the `.MuiAccordionSummary-contentGutters` class was deprecated in favor of the `.MuiAccordionSummary-gutters` and `.MuiAccordionSummary-content` classes.
This improves the developer experience by reducing bloat and cognitive load.

### System props

MUI System props (such as `mt={*}`, `bgcolor={*}`, and more) have been deprecated in the Box, Typography, Link, Grid, and Stack components.
Use the codemod below to move all System props to the `sx` prop:

```bash
npx @mui/codemod@next v6.0.0/system-props <path/to/folder>
```

You can also manually update your components as shown in the snippet below:

```diff
-<Button mr={2}>
+<Button sx={{ mr: 2 }}>
```

### Theme component variants

Custom component variants defined in the theme are now merged with the theme style overrides, defined within the `root` slot of the component.

Use this codemod to update your project's theme file:

```bash
npx @mui/codemod@next v6.0.0/theme-v6 <path/to/theme>
```

You can also manually update your theme as shown in the snippet below:

```diff
createTheme({
components: {
MuiButton: {
- variants: [ ... ],
+ styleOverrides: {
+ root: {
+ variants: [ ... ],
+ },
+ },
},
},
});
```

This reduces the API surface and lets you define variants in other slots of the component.

## AccordionSummary

Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#accordion-summary-classes) below to migrate the code as described in the following sections:
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@ The Grid v2 is marked as stable in Material UI v6, so the `Unstable_` prefix is
```

Alongside the stabilization, the API has been improved.
You can see the changes and further details on how to migrate in the [Material UI v6 migration guide](/material-ui/migration/migrating-to-v6/).
You can see the changes and further details on how to migrate in the [Material UI v6 upgrade guide](/material-ui/migration/upgrade-to-v6/).
alelthomas marked this conversation as resolved.
Show resolved Hide resolved

Finally, the original Grid component is deprecated and will be removed in the future, so we highly encourage you to migrate to Grid v2.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

<p class="description">This guide helps you integrate Pigment CSS with Material UI v6.</p>

Before going through this guide, make sure you have [migrated to Material UI v6](/material-ui/migration/migrating-to-v6/).
Before going through this guide, make sure you have [upgraded to Material UI v6](/material-ui/migration/upgrade-to-v6/).

## Introduction

Expand Down
Loading
Loading