Skip to content

Commit aaeabab

Browse files
mj12albertmj12albert
authored
Merge branch 'master' into chore/linear-progress-deprecations
2 parents d836d96 + 1da1624 commit aaeabab

44 files changed

Lines changed: 358 additions & 547 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎docs/data/material/getting-started/templates/blog/components/AppAppBar.js‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -97,9 +97,11 @@ export default function AppAppBar() {
9797
anchor="top"
9898
open={open}
9999
onClose={toggleDrawer(false)}
100-
PaperProps={{
101-
sx: {
102-
top: 'var(--template-frame-height, 0px)',
100+
slotProps={{
101+
paper: {
102+
sx: {
103+
top: 'var(--template-frame-height, 0px)',
104+
},
103105
},
104106
}}
105107
>

‎docs/data/material/getting-started/templates/blog/components/AppAppBar.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -97,9 +97,11 @@ export default function AppAppBar() {
9797
anchor="top"
9898
open={open}
9999
onClose={toggleDrawer(false)}
100-
PaperProps={{
101-
sx: {
102-
top: 'var(--template-frame-height, 0px)',
100+
slotProps={{
101+
paper: {
102+
sx: {
103+
top: 'var(--template-frame-height, 0px)',
104+
},
103105
},
104106
}}
105107
>

‎docs/data/material/getting-started/templates/checkout/components/InfoMobile.js‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -40,11 +40,13 @@ function InfoMobile({ totalPrice }) {
4040
open={open}
4141
anchor="top"
4242
onClose={toggleDrawer(false)}
43-
PaperProps={{
44-
sx: {
45-
top: 'var(--template-frame-height, 0px)',
46-
backgroundImage: 'none',
47-
backgroundColor: 'background.paper',
43+
slotProps={{
44+
paper: {
45+
sx: {
46+
top: 'var(--template-frame-height, 0px)',
47+
backgroundImage: 'none',
48+
backgroundColor: 'background.paper',
49+
},
4850
},
4951
}}
5052
>

‎docs/data/material/getting-started/templates/checkout/components/InfoMobile.tsx‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -43,11 +43,13 @@ export default function InfoMobile({ totalPrice }: InfoProps) {
4343
open={open}
4444
anchor="top"
4545
onClose={toggleDrawer(false)}
46-
PaperProps={{
47-
sx: {
48-
top: 'var(--template-frame-height, 0px)',
49-
backgroundImage: 'none',
50-
backgroundColor: 'background.paper',
46+
slotProps={{
47+
paper: {
48+
sx: {
49+
top: 'var(--template-frame-height, 0px)',
50+
backgroundImage: 'none',
51+
backgroundColor: 'background.paper',
52+
},
5153
},
5254
}}
5355
>

‎docs/data/material/getting-started/templates/marketing-page/components/AppAppBar.js‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -97,9 +97,11 @@ export default function AppAppBar() {
9797
anchor="top"
9898
open={open}
9999
onClose={toggleDrawer(false)}
100-
PaperProps={{
101-
sx: {
102-
top: 'var(--template-frame-height, 0px)',
100+
slotProps={{
101+
paper: {
102+
sx: {
103+
top: 'var(--template-frame-height, 0px)',
104+
},
103105
},
104106
}}
105107
>

‎docs/data/material/getting-started/templates/marketing-page/components/AppAppBar.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -97,9 +97,11 @@ export default function AppAppBar() {
9797
anchor="top"
9898
open={open}
9999
onClose={toggleDrawer(false)}
100-
PaperProps={{
101-
sx: {
102-
top: 'var(--template-frame-height, 0px)',
100+
slotProps={{
101+
paper: {
102+
sx: {
103+
top: 'var(--template-frame-height, 0px)',
104+
},
103105
},
104106
}}
105107
>

‎docs/data/material/migration/upgrade-to-v9/upgrade-to-v9.md‎

Lines changed: 154 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -894,6 +894,110 @@ If you were using these deprecated class names as `styleOverrides` keys in your
894894
});
895895
```
896896

897+
#### Dialog deprecated CSS classes removed
898+
899+
Use the [dialog-classes codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#dialog-classes) below to migrate the code as described in the following section:
900+
901+
```bash
902+
npx @mui/codemod@latest deprecations/dialog-classes <path>
903+
```
904+
905+
The following deprecated `Dialog` CSS classes have been removed:
906+
907+
- `paperScrollPaper` → use `.MuiDialog-scrollPaper > .MuiDialog-paper`
908+
- `paperScrollBody` → use `.MuiDialog-scrollBody > .MuiDialog-paper`
909+
910+
If you were using these classes in `styleOverrides`, use the `variants` array in the `paper` slot instead:
911+
912+
```diff
913+
const theme = createTheme({
914+
components: {
915+
MuiDialog: {
916+
styleOverrides: {
917+
- paperScrollPaper: {
918+
- maxHeight: '80vh',
919+
- },
920+
- paperScrollBody: {
921+
- verticalAlign: 'bottom',
922+
- },
923+
+ paper: {
924+
+ variants: [
925+
+ {
926+
+ props: { scroll: 'paper' },
927+
+ style: {
928+
+ maxHeight: '80vh',
929+
+ },
930+
+ },
931+
+ {
932+
+ props: { scroll: 'body' },
933+
+ style: {
934+
+ verticalAlign: 'bottom',
935+
+ },
936+
+ },
937+
+ ],
938+
+ },
939+
},
940+
},
941+
},
942+
});
943+
```
944+
945+
#### Dialog deprecated props removed
946+
947+
Use the [dialog-props codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#dialog-props) below to migrate the code as described in the following section:
948+
949+
```bash
950+
npx @mui/codemod@latest deprecations/dialog-props <path>
951+
```
952+
953+
The following deprecated props have been removed from the `Dialog` component:
954+
955+
- `BackdropComponent` → use `slots.backdrop`
956+
- `BackdropProps` → use `slotProps.backdrop`
957+
- `PaperProps` → use `slotProps.paper`
958+
- `TransitionComponent` → use `slots.transition`
959+
- `TransitionProps` → use `slotProps.transition`
960+
961+
```diff
962+
<Dialog
963+
- BackdropComponent={CustomBackdrop}
964+
- BackdropProps={{ invisible: true }}
965+
- PaperProps={{ elevation: 3 }}
966+
- TransitionComponent={CustomTransition}
967+
- TransitionProps={{ timeout: 500 }}
968+
+ slots={{ backdrop: CustomBackdrop, transition: CustomTransition }}
969+
+ slotProps={{ backdrop: { invisible: true }, paper: { elevation: 3 }, transition: { timeout: 500 } }}
970+
/>
971+
```
972+
973+
#### Drawer deprecated props removed
974+
975+
Use the [drawer-props codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#drawer-props) below to migrate the code as described in the following section:
976+
977+
```bash
978+
npx @mui/codemod@latest deprecations/drawer-props <path>
979+
```
980+
981+
The following deprecated props have been removed from the `Drawer` component:
982+
983+
- `BackdropComponent` → use `slots.backdrop`
984+
- `BackdropProps` → use `slotProps.backdrop`
985+
- `PaperProps` → use `slotProps.paper`
986+
- `SlideProps` → use `slotProps.transition`
987+
- `TransitionComponent` → use `slots.transition`
988+
989+
```diff
990+
<Drawer
991+
- BackdropComponent={CustomBackdrop}
992+
- BackdropProps={{ invisible: true }}
993+
- PaperProps={{ elevation: 2 }}
994+
- SlideProps={{ timeout: 500 }}
995+
- TransitionComponent={CustomTransition}
996+
+ slots={{ backdrop: CustomBackdrop, transition: CustomTransition }}
997+
+ slotProps={{ backdrop: { invisible: true }, paper: { elevation: 2 }, transition: { timeout: 500 } }}
998+
/>
999+
```
1000+
8971001
#### Divider deprecated props removed
8981002

8991003
Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#divider-props) below to migrate the code as described in the following sections:
@@ -1423,6 +1527,32 @@ The following deprecated props have been removed:
14231527
/>
14241528
```
14251529

1530+
#### Modal deprecated props removed
1531+
1532+
Use the [modal-props codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#modal-props) below to migrate the code as described in the following section:
1533+
1534+
```bash
1535+
npx @mui/codemod@latest deprecations/modal-props <path>
1536+
```
1537+
1538+
The following deprecated props have been removed from the `Modal` component:
1539+
1540+
- `BackdropComponent` → use `slots.backdrop`
1541+
- `BackdropProps` → use `slotProps.backdrop`
1542+
- `components` → use `slots`
1543+
- `componentsProps` → use `slotProps`
1544+
1545+
```diff
1546+
<Modal
1547+
- BackdropComponent={CustomBackdrop}
1548+
- BackdropProps={{ invisible: true }}
1549+
- components={{ Root: CustomRoot }}
1550+
- componentsProps={{ root: { className: 'custom' } }}
1551+
+ slots={{ backdrop: CustomBackdrop, root: CustomRoot }}
1552+
+ slotProps={{ backdrop: { invisible: true }, root: { className: 'custom' } }}
1553+
/>
1554+
```
1555+
14261556
#### Popover deprecated props removed
14271557

14281558
The following deprecated props have been removed:
@@ -1489,6 +1619,30 @@ The following deprecated `Switch` props have been removed:
14891619
/>
14901620
```
14911621

1622+
#### SwipeableDrawer deprecated props removed
1623+
1624+
Use the [drawer-props codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#drawer-props) below to migrate the code as described in the following section:
1625+
1626+
```bash
1627+
npx @mui/codemod@latest deprecations/drawer-props <path>
1628+
```
1629+
1630+
The following deprecated props have been removed from the `SwipeableDrawer` component:
1631+
1632+
- `BackdropComponent` → use `slots.backdrop`
1633+
- `BackdropProps` → use `slotProps.backdrop`
1634+
- `SwipeAreaProps` → use `slotProps.swipeArea`
1635+
1636+
```diff
1637+
<SwipeableDrawer
1638+
- BackdropComponent={CustomBackdrop}
1639+
- BackdropProps={{ invisible: true }}
1640+
- SwipeAreaProps={{ className: 'custom' }}
1641+
+ slots={{ backdrop: CustomBackdrop }}
1642+
+ slotProps={{ backdrop: { invisible: true }, swipeArea: { className: 'custom' } }}
1643+
/>
1644+
```
1645+
14921646
#### Tabs deprecated props removed
14931647

14941648
Use the [tabs-props codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#tabs-props) below to migrate the code as described in the following section:

‎docs/pages/material-ui/api/dialog.json‎

Lines changed: 0 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,6 @@
1010
},
1111
"default": "true"
1212
},
13-
"BackdropComponent": {
14-
"type": { "name": "elementType" },
15-
"default": "styled(Backdrop, {\n name: 'MuiModal',\n slot: 'Backdrop',\n})({\n zIndex: -1,\n})",
16-
"deprecated": true,
17-
"deprecationInfo": "Use <code>slots.backdrop</code> instead. While this prop currently works, it will be removed in the next major version."
18-
},
1913
"children": { "type": { "name": "node" } },
2014
"classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } },
2115
"fullScreen": { "type": { "name": "bool" }, "default": "false" },
@@ -35,12 +29,6 @@
3529
}
3630
},
3731
"PaperComponent": { "type": { "name": "elementType" }, "default": "Paper" },
38-
"PaperProps": {
39-
"type": { "name": "object" },
40-
"default": "{}",
41-
"deprecated": true,
42-
"deprecationInfo": "Use <code>slotProps.paper</code> instead. This prop will be removed in a future major release. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details."
43-
},
4432
"scroll": {
4533
"type": { "name": "enum", "description": "'body'<br>&#124;&nbsp;'paper'" },
4634
"default": "'paper'"
@@ -66,23 +54,12 @@
6654
},
6755
"additionalInfo": { "sx": true }
6856
},
69-
"TransitionComponent": {
70-
"type": { "name": "elementType" },
71-
"default": "Fade",
72-
"deprecated": true,
73-
"deprecationInfo": "Use <code>slots.transition</code> instead. This prop will be removed in a future major release. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details."
74-
},
7557
"transitionDuration": {
7658
"type": {
7759
"name": "union",
7860
"description": "number<br>&#124;&nbsp;{ appear?: number, enter?: number, exit?: number }"
7961
},
8062
"default": "{\n enter: theme.transitions.duration.enteringScreen,\n exit: theme.transitions.duration.leavingScreen,\n}"
81-
},
82-
"TransitionProps": {
83-
"type": { "name": "object" },
84-
"deprecated": true,
85-
"deprecationInfo": "Use <code>slotProps.transition</code> instead. This prop will be removed in a future major release. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details."
8663
}
8764
},
8865
"name": "Dialog",
@@ -132,20 +109,6 @@
132109
"description": "Styles applied to the Paper component if `fullWidth={true}`.",
133110
"isGlobal": false
134111
},
135-
{
136-
"key": "paperScrollBody",
137-
"className": "MuiDialog-paperScrollBody",
138-
"description": "Styles applied to the Paper component if `scroll=\"body\"`.",
139-
"isGlobal": false,
140-
"isDeprecated": true
141-
},
142-
{
143-
"key": "paperScrollPaper",
144-
"className": "MuiDialog-paperScrollPaper",
145-
"description": "Styles applied to the Paper component if `scroll=\"paper\"`.",
146-
"isGlobal": false,
147-
"isDeprecated": true
148-
},
149112
{
150113
"key": "paperWidthFalse",
151114
"className": "MuiDialog-paperWidthFalse",

‎docs/pages/material-ui/api/drawer.json‎

Lines changed: 0 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -20,17 +20,6 @@
2020
}
2121
},
2222
"open": { "type": { "name": "bool" }, "default": "false" },
23-
"PaperProps": {
24-
"type": { "name": "object" },
25-
"default": "{}",
26-
"deprecated": true,
27-
"deprecationInfo": "use the <code>slotProps.paper</code> prop instead. This prop will be removed in a future major release. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details."
28-
},
29-
"SlideProps": {
30-
"type": { "name": "object" },
31-
"deprecated": true,
32-
"deprecationInfo": "use the <code>slotProps.transition</code> prop instead. This prop will be removed in a future major release. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details."
33-
},
3423
"slotProps": {
3524
"type": {
3625
"name": "shape",

‎docs/pages/material-ui/api/modal.json‎

Lines changed: 0 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -2,35 +2,9 @@
22
"props": {
33
"children": { "type": { "name": "custom", "description": "element" }, "required": true },
44
"open": { "type": { "name": "bool" }, "required": true },
5-
"BackdropComponent": {
6-
"type": { "name": "elementType" },
7-
"default": "styled(Backdrop, {\n name: 'MuiModal',\n slot: 'Backdrop',\n})({\n zIndex: -1,\n})",
8-
"deprecated": true,
9-
"deprecationInfo": "Use <code>slots.backdrop</code> instead. While this prop currently works, it will be removed in the next major version."
10-
},
11-
"BackdropProps": {
12-
"type": { "name": "object" },
13-
"deprecated": true,
14-
"deprecationInfo": "Use <code>slotProps.backdrop</code> instead."
15-
},
165
"classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } },
176
"closeAfterTransition": { "type": { "name": "bool" }, "default": "false" },
187
"component": { "type": { "name": "elementType" } },
19-
"components": {
20-
"type": { "name": "shape", "description": "{ Backdrop?: elementType, Root?: elementType }" },
21-
"default": "{}",
22-
"deprecated": true,
23-
"deprecationInfo": "Use the <code>slots</code> prop instead. This prop will be removed in a future major release. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details."
24-
},
25-
"componentsProps": {
26-
"type": {
27-
"name": "shape",
28-
"description": "{ backdrop?: func<br>&#124;&nbsp;object, root?: func<br>&#124;&nbsp;object }"
29-
},
30-
"default": "{}",
31-
"deprecated": true,
32-
"deprecationInfo": "Use the <code>slotProps</code> prop instead. This prop will be removed in a future major release. See <a href=\"https://mui.com/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details."
33-
},
348
"container": { "type": { "name": "union", "description": "HTML element<br>&#124;&nbsp;func" } },
359
"disableAutoFocus": { "type": { "name": "bool" }, "default": "false" },
3610
"disableEnforceFocus": { "type": { "name": "bool" }, "default": "false" },

0 commit comments

Comments
 (0)