diff --git a/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md b/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md index 0ad537bd200bf..2709000f7c41f 100644 --- a/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md +++ b/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md @@ -364,7 +364,8 @@ This change causes a few breaking changes: ); ``` -- The component passed to the `layout` slot no longer receives the `value` prop, instead you can use the `usePickerContext` hook: +- The component passed to the `layout` slot no longer receives the `value` prop. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -377,7 +378,8 @@ This change causes a few breaking changes: +const { value } = usePickerContext(); ``` -- The component passed to the `layout` slot no longer receives the `disabled` and `readOnly` props, instead you can use the `usePickerContext` hook: +- The component passed to the `layout` slot no longer receives the `disabled` and `readOnly` props. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -389,7 +391,8 @@ This change causes a few breaking changes: +const { readOnly } = usePickerContext(); ``` -- The component passed to the `layout` slot no longer receives the `isRtl` prop. If you need to access this information, you can use the `useRtl` hook from `@mui/system`: +- The component passed to the `layout` slot no longer receives the `isRtl` prop. + You can use the `useRtl` hook from `@mui/system` instead: ```diff +import { useRtl } from '@mui/system/RtlProvider'; @@ -398,7 +401,8 @@ This change causes a few breaking changes: + const isRtl = useRtl(); ``` -- The component passed to the `layout` slot no longer receives the `orientation` and `isLandscape` props, instead you can use the `usePickerContext` hook: +- The component passed to the `layout` slot no longer receives the `orientation` and `isLandscape` props. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -411,7 +415,8 @@ This change causes a few breaking changes: +const isLandscape = orientation === 'landscape'; ``` -- The component passed to the `layout` slot no longer receives the `wrapperVariant` prop, instead you can use the `usePickerContext` hook: +- The component passed to the `layout` slot no longer receives the `wrapperVariant` prop. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -420,7 +425,8 @@ This change causes a few breaking changes: +const { variant } = usePickerContext(); ``` -- The component passed to the `layout` slot no longer receives the `view`, `views` and `onViewChange` props, instead you can use the `usePickerContext` hook: +- The component passed to the `layout` slot no longer receives the `view`, `views` and `onViewChange` props. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -497,7 +503,8 @@ This change causes a few breaking changes: ### Slot: `toolbar` -- The component passed to the `toolbar` slot no longer receives the `value` prop, instead you can use the `usePickerContext` hook: +- The component passed to the `toolbar` slot no longer receives the `value` prop. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -510,7 +517,8 @@ This change causes a few breaking changes: +const { value } = usePickerContext(); ``` -- The component passed to the `toolbar` slot no longer receives the `disabled` and `readOnly` props, instead you can use the `usePickerContext` hook: +- The component passed to the `toolbar` slot no longer receives the `disabled` and `readOnly` props. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -522,7 +530,8 @@ This change causes a few breaking changes: +const { readOnly } = usePickerContext(); ``` -- The component passed to the `toolbar` slot no longer receives the `isLandscape` prop, instead you can use the `usePickerContext` hook: +- The component passed to the `toolbar` slot no longer receives the `isLandscape` prop. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -532,7 +541,8 @@ This change causes a few breaking changes: +const isLandscape = orientation === 'landscape'; ``` -- The component passed to the `toolbar` slot no longer receives the `view`, `views` and `onViewChange` props, instead you can use the `usePickerContext` hook: +- The component passed to the `toolbar` slot no longer receives the `view`, `views` and `onViewChange` props. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -568,7 +578,8 @@ This change causes a few breaking changes: ### Slot: `tabs` -- The component passed to the `tabs` slot no longer receives the `view`, `views` and `onViewChange` props, instead you can use the `usePickerContext` hook: +- The component passed to the `tabs` slot no longer receives the `view`, `views` and `onViewChange` props. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -611,7 +622,8 @@ This change causes a few breaking changes: ### Slot: `shortcuts` -- The component passed to the `shortcuts` slot no longer receives the `isLandscape` prop, instead you can use the `usePickerContext` hook: +- The component passed to the `shortcuts` slot no longer receives the `isLandscape` prop. + You can use the `usePickerContext` hook instead: ```diff +import { usePickerContext } from '@mui/x-date-pickers/hooks'; @@ -636,7 +648,8 @@ This change causes a few breaking changes: The only difference is that `usePickerActionsContext` only contains variables with stable references that won't cause a re-render of your component. ::: -- The component passed to the `shortcuts` slot no longer receives the `isValid` prop, instead you can use the `useIsValidValue` hook: +- The component passed to the `shortcuts` slot no longer receives the `isValid` prop. + You can use the `useIsValidValue` hook instead: ```diff +import { useIsValidValue } from '@mui/x-date-pickers/hooks';