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 new file mode 100644 index 00000000000000..e583aaa31d0fda --- /dev/null +++ b/docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md @@ -0,0 +1,51 @@ +# Migrating from deprecated APIs + +

Learn how to migrate away from recently deprecated APIs before they become breaking changes.

+ +## Why you should migrate + +Features become deprecated over time as maintainers make improvements to the APIs. +Migrating to these improved APIs results in a better developer experience, so it's in your best interest to stay up to date. +Deprecated APIs often become breaking changes in subsequent major versions, so the sooner you migrate, the smoother the next major update will be. + +## Migrating + +MaterialĀ UI provides the `deprecations/all` codemod to help you stay up to date with minimal effort. + +```bash +npx @mui/codemod@latest deprecations/all +``` + +This command runs all the current [deprecations codemods](https://github.com/mui/material-ui/tree/master/packages/mui-codemod#deprecations), automatically migrating to the updated API. +You can run this codemod as often as necessary to keep up with the latest changes. + +:::info + +If you need to manually migrate from a deprecated API, you can find examples below for all deprecations that have been added in MaterialĀ UI v5. +If you need to run a specific codemod, those are also linked below. + +::: + +## Accordion + +### TransitionComponent + +The Accordion's `TransitionComponent` was deprecated in favor of `slots.transition` ([Codemod](https://github.com/mui/material-ui/tree/master/packages/mui-codemod#accordion-props)): + +```diff + +``` + +### TransitionProps + +The Accordion's `TransitionProps` was deprecated in favor of `slotProps.transition` ([Codemod](https://github.com/mui/material-ui/tree/master/packages/mui-codemod#accordion-props)): + +```diff + +``` diff --git a/docs/data/material/pages.ts b/docs/data/material/pages.ts index 1279434c9744ff..944b114eeb0102 100644 --- a/docs/data/material/pages.ts +++ b/docs/data/material/pages.ts @@ -257,6 +257,10 @@ const pages: MuiPage[] = [ pathname: '/material-ui/migration', title: 'Migration', children: [ + { + pathname: '/material-ui/migration/migrating-from-deprecated-apis', + title: 'Migrating from deprecated APIs', + }, { pathname: '/material-ui/migration/migration-grid-v2', title: 'Migrating to Grid v2', diff --git a/docs/pages/material-ui/api/accordion.json b/docs/pages/material-ui/api/accordion.json index c648b2abdff691..5a034bc834124a 100644 --- a/docs/pages/material-ui/api/accordion.json +++ b/docs/pages/material-ui/api/accordion.json @@ -32,12 +32,12 @@ "TransitionComponent": { "type": { "name": "elementType" }, "deprecated": true, - "deprecationInfo": "Use slots.transition instead. This prop will be removed in v7." + "deprecationInfo": "Use slots.transition instead. This prop will be removed in v7. How to migrate." }, "TransitionProps": { "type": { "name": "object" }, "deprecated": true, - "deprecationInfo": "Use slotProps.transition instead. This prop will be removed in v7." + "deprecationInfo": "Use slotProps.transition instead. This prop will be removed in v7. How to migrate." } }, "name": "Accordion", diff --git a/docs/pages/material-ui/migration/migrating-from-deprecated-APIs.js b/docs/pages/material-ui/migration/migrating-from-deprecated-APIs.js new file mode 100644 index 00000000000000..dfba929b2b1aff --- /dev/null +++ b/docs/pages/material-ui/migration/migrating-from-deprecated-APIs.js @@ -0,0 +1,7 @@ +import * as React from 'react'; +import MarkdownDocs from 'docs/src/modules/components/MarkdownDocs'; +import * as pageProps from 'docs/data/material/migration/migrating-from-deprecated-apis/migrating-from-deprecated-apis.md?@mui/markdown'; + +export default function Page() { + return ; +} diff --git a/docs/translations/translations.json b/docs/translations/translations.json index 235068f3aebe15..d1a58baacbd347 100644 --- a/docs/translations/translations.json +++ b/docs/translations/translations.json @@ -473,6 +473,7 @@ "/material-ui/discover-more/vision": "Vision", "/material-ui/discover-more/changelog": "Changelog", "/material-ui/migration": "Migration", + "/material-ui/migration/migrating-from-deprecated-apis": "Migrating from deprecated APIs", "/material-ui/migration/migration-grid-v2": "Migrating to Grid v2", "Upgrade to v5": "Upgrade to v5", "/material-ui/migration/migration-v4": "Migrating to v5: getting started", diff --git a/packages/mui-material/src/Accordion/Accordion.d.ts b/packages/mui-material/src/Accordion/Accordion.d.ts index 2b6a15fbc26a37..a84a42c563d7fb 100644 --- a/packages/mui-material/src/Accordion/Accordion.d.ts +++ b/packages/mui-material/src/Accordion/Accordion.d.ts @@ -79,7 +79,7 @@ export type AccordionTypeMap< /** * The component used for the transition. * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. - * @deprecated Use `slots.transition` instead. This prop will be removed in v7. + * @deprecated Use `slots.transition` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/). */ TransitionComponent?: React.JSXElementConstructor< TransitionProps & { children?: React.ReactElement } @@ -87,7 +87,7 @@ export type AccordionTypeMap< /** * Props applied to the transition element. * By default, the element is based on this [`Transition`](http://reactcommunity.org/react-transition-group/transition/) component. - * @deprecated Use `slotProps.transition` instead. This prop will be removed in v7. + * @deprecated Use `slotProps.transition` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/). */ TransitionProps?: TransitionProps; } & AccordionSlotsAndSlotProps; diff --git a/packages/mui-material/src/Accordion/Accordion.js b/packages/mui-material/src/Accordion/Accordion.js index e890d2f7ad7768..5483c88ad1f670 100644 --- a/packages/mui-material/src/Accordion/Accordion.js +++ b/packages/mui-material/src/Accordion/Accordion.js @@ -293,13 +293,13 @@ Accordion.propTypes /* remove-proptypes */ = { /** * The component used for the transition. * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component. - * @deprecated Use `slots.transition` instead. This prop will be removed in v7. + * @deprecated Use `slots.transition` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/). */ TransitionComponent: PropTypes.elementType, /** * Props applied to the transition element. * By default, the element is based on this [`Transition`](http://reactcommunity.org/react-transition-group/transition/) component. - * @deprecated Use `slotProps.transition` instead. This prop will be removed in v7. + * @deprecated Use `slotProps.transition` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/). */ TransitionProps: PropTypes.object, };