From 08064cb77b665e1c503e7861841cd53e46d21974 Mon Sep 17 00:00:00 2001 From: Lucas Hilgert Date: Thu, 9 May 2024 13:14:57 +0200 Subject: [PATCH 1/5] deprecate componentsProps --- docs/pages/material-ui/api/autocomplete.json | 3 ++- packages/mui-material/src/Autocomplete/Autocomplete.d.ts | 2 +- packages/mui-material/src/Autocomplete/Autocomplete.js | 4 ++-- 3 files changed, 5 insertions(+), 4 deletions(-) diff --git a/docs/pages/material-ui/api/autocomplete.json b/docs/pages/material-ui/api/autocomplete.json index fcb754234fd1ba..a351cf39d96bd8 100644 --- a/docs/pages/material-ui/api/autocomplete.json +++ b/docs/pages/material-ui/api/autocomplete.json @@ -32,7 +32,8 @@ "name": "shape", "description": "{ clearIndicator?: object, paper?: object, popper?: object, popupIndicator?: object }" }, - "default": "{}" + "deprecated": true, + "deprecationInfo": "Use the slotProps prop instead. This prop will be removed in v7. See Migrating from deprecated APIs for more details." }, "defaultValue": { "type": { "name": "custom", "description": "any" }, diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.d.ts b/packages/mui-material/src/Autocomplete/Autocomplete.d.ts index 70772d58b3756e..cfc564954e847c 100644 --- a/packages/mui-material/src/Autocomplete/Autocomplete.d.ts +++ b/packages/mui-material/src/Autocomplete/Autocomplete.d.ts @@ -193,7 +193,7 @@ export interface AutocompleteProps< closeText?: string; /** * The props used for each slot inside. - * @default {} + * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ componentsProps?: { clearIndicator?: Partial; diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.js b/packages/mui-material/src/Autocomplete/Autocomplete.js index 701c779625cb52..b82b5b202155f8 100644 --- a/packages/mui-material/src/Autocomplete/Autocomplete.js +++ b/packages/mui-material/src/Autocomplete/Autocomplete.js @@ -434,7 +434,7 @@ const Autocomplete = React.forwardRef(function Autocomplete(inProps, ref) { clearOnEscape = false, clearText = 'Clear', closeText = 'Close', - componentsProps = {}, + componentsProps, defaultValue = props.multiple ? [] : null, disableClearable = false, disableCloseOnSelect = false, @@ -867,7 +867,7 @@ Autocomplete.propTypes /* remove-proptypes */ = { closeText: PropTypes.string, /** * The props used for each slot inside. - * @default {} + * @deprecated Use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details. */ componentsProps: PropTypes.shape({ clearIndicator: PropTypes.object, From 336d16e46f05aebebb8916a23106a144389c02f1 Mon Sep 17 00:00:00 2001 From: Lucas Hilgert Date: Thu, 9 May 2024 13:22:08 +0200 Subject: [PATCH 2/5] add codemod --- .../autocomplete-props/autocomplete-props.js | 3 +++ .../autocomplete-props/test-cases/actual.js | 18 +++++++++++++++ .../autocomplete-props/test-cases/expected.js | 23 +++++++++++++++---- .../test-cases/theme.actual.js | 12 ++++++++++ .../test-cases/theme.expected.js | 14 ++++++++++- 5 files changed, 65 insertions(+), 5 deletions(-) diff --git a/packages/mui-codemod/src/deprecations/autocomplete-props/autocomplete-props.js b/packages/mui-codemod/src/deprecations/autocomplete-props/autocomplete-props.js index 3b5204f0bd642d..9e9099616050d1 100644 --- a/packages/mui-codemod/src/deprecations/autocomplete-props/autocomplete-props.js +++ b/packages/mui-codemod/src/deprecations/autocomplete-props/autocomplete-props.js @@ -1,5 +1,6 @@ import movePropIntoSlots from '../utils/movePropIntoSlots'; import movePropIntoSlotProps from '../utils/movePropIntoSlotProps'; +import replaceComponentsWithSlots from '../utils/replaceComponentsWithSlots'; /** * @param {import('jscodeshift').FileInfo} file @@ -45,5 +46,7 @@ export default function transformer(file, api, options) { slotName: 'chip', }); + replaceComponentsWithSlots(j, { root, componentName: 'Autocomplete' }); + return root.toSource(printOptions); } diff --git a/packages/mui-codemod/src/deprecations/autocomplete-props/test-cases/actual.js b/packages/mui-codemod/src/deprecations/autocomplete-props/test-cases/actual.js index 8003251b598cf3..e8cbd448f45d9f 100644 --- a/packages/mui-codemod/src/deprecations/autocomplete-props/test-cases/actual.js +++ b/packages/mui-codemod/src/deprecations/autocomplete-props/test-cases/actual.js @@ -7,6 +7,12 @@ import {Autocomplete as MyAutocomplete} from '@mui/material'; PopperComponent={CustomPopper} ListboxComponent={CustomListbox} ListboxProps={{ height: 12 }} + componentsProps={{ + clearIndicator: { width: 10 }, + paper: { width: 12 }, + popper: { width: 14 }, + popupIndicator: { width: 16 }, + }} />; ; ; ; ; Date: Thu, 9 May 2024 13:22:19 +0200 Subject: [PATCH 3/5] add documentation --- .../migrating-from-deprecated-apis.md | 20 +++++++++++++++++++ packages/mui-codemod/README.md | 20 +++++++++++++++++++ 2 files changed, 40 insertions(+) diff --git a/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md index 0e34e999e9c5ee..c82743194a89ef 100644 --- a/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md +++ b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md @@ -267,6 +267,26 @@ All of the Autocomplete's slot props (`*Props`) props were deprecated in favor o /> ``` +### componentsProps + +The Alert's `componentsProps` was deprecated in favor of `slotProps`: + +```diff + +``` + ## Avatar Use the [codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#avatar-props) below to migrate the code as described in the following sections: diff --git a/packages/mui-codemod/README.md b/packages/mui-codemod/README.md index 20cda885755eed..954cb42810be90 100644 --- a/packages/mui-codemod/README.md +++ b/packages/mui-codemod/README.md @@ -268,6 +268,12 @@ npx @mui/codemod@next deprecations/alert-props - PopperComponent={CustomPopper} - ListboxComponent={CustomListbox} - ListboxProps={{ height: 12 }} +- componentsProps={{ +- clearIndicator: { width: 10 }, +- paper: { width: 12 }, +- popper: { width: 14 }, +- popupIndicator: { width: 16 }, +- }} + slots={{ + paper: CustomPaper, + popper: CustomPopper, @@ -276,6 +282,10 @@ npx @mui/codemod@next deprecations/alert-props + slotProps={{ + chip: { height: 10 }, + listbox: { height: 12 }, ++ clearIndicator: { width: 10 }, ++ paper: { width: 12 }, ++ popper: { width: 14 }, ++ popupIndicator: { width: 16 }, + }} /> ``` @@ -288,6 +298,12 @@ npx @mui/codemod@next deprecations/alert-props - PopperComponent: CustomPopper, - ListboxComponent: CustomListbox, - ListboxProps: { height: 12 }, +- componentsProps: { +- clearIndicator: { width: 10 }, +- paper: { width: 12 }, +- popper: { width: 14 }, +- popupIndicator: { width: 16 }, +- } + slots: { + paper: CustomPaper, + popper: CustomPopper, @@ -296,6 +312,10 @@ npx @mui/codemod@next deprecations/alert-props + slotProps: { + chip: { height: 10 }, + listbox: { height: 12 }, ++ clearIndicator: { width: 10 }, ++ paper: { width: 12 }, ++ popper: { width: 14 }, ++ popupIndicator: { width: 16 }, + }, }, }, From 3500f56aacd29b3be3ecb4689948675a234ca990 Mon Sep 17 00:00:00 2001 From: Lucas Hilgert <77863078+lhilgert9@users.noreply.github.com> Date: Sat, 11 May 2024 09:34:40 +0200 Subject: [PATCH 4/5] migrating-from-deprecated-apis.md Co-authored-by: sai chand <60743144+sai6855@users.noreply.github.com> Signed-off-by: Lucas Hilgert <77863078+lhilgert9@users.noreply.github.com> --- .../migrating-from-deprecated-apis.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md index c82743194a89ef..4ca6927dd4a189 100644 --- a/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md +++ b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md @@ -269,7 +269,7 @@ All of the Autocomplete's slot props (`*Props`) props were deprecated in favor o ### componentsProps -The Alert's `componentsProps` was deprecated in favor of `slotProps`: +The Autocomplete's `componentsProps` was deprecated in favor of `slotProps`: ```diff Date: Tue, 14 May 2024 13:20:31 -0400 Subject: [PATCH 5/5] Small migration guide fix Signed-off-by: Diego Andai --- .../migrating-from-deprecated-apis.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md index 4ca6927dd4a189..1a3d0834fdfa11 100644 --- a/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md +++ b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md @@ -269,7 +269,7 @@ All of the Autocomplete's slot props (`*Props`) props were deprecated in favor o ### componentsProps -The Autocomplete's `componentsProps` was deprecated in favor of `slotProps`: +The Autocomplete's `componentsProps` prop was deprecated in favor of `slotProps`: ```diff