You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/data/migration/migration-pickers-v7/migration-pickers-v7.md
+26-13Lines changed: 26 additions & 13 deletions
Original file line number
Diff line number
Diff line change
@@ -364,7 +364,8 @@ This change causes a few breaking changes:
364
364
);
365
365
```
366
366
367
-
- The component passed to the `layout` slot no longer receives the `value` prop, instead you can use the `usePickerContext` hook:
367
+
- The component passed to the `layout` slot no longer receives the `value` prop.
368
+
You can use the `usePickerContext` hook instead:
368
369
369
370
```diff
370
371
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -377,7 +378,8 @@ This change causes a few breaking changes:
377
378
+const { value } = usePickerContext();
378
379
```
379
380
380
-
- The component passed to the `layout` slot no longer receives the `disabled` and `readOnly` props, instead you can use the `usePickerContext` hook:
381
+
- The component passed to the `layout` slot no longer receives the `disabled` and `readOnly` props.
382
+
You can use the `usePickerContext` hook instead:
381
383
382
384
```diff
383
385
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -389,7 +391,8 @@ This change causes a few breaking changes:
389
391
+const { readOnly } = usePickerContext();
390
392
```
391
393
392
-
- 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`:
394
+
- The component passed to the `layout` slot no longer receives the `isRtl` prop.
395
+
You can use the `useRtl` hook from `@mui/system` instead:
393
396
394
397
```diff
395
398
+import { useRtl } from '@mui/system/RtlProvider';
@@ -398,7 +401,8 @@ This change causes a few breaking changes:
398
401
+ const isRtl = useRtl();
399
402
```
400
403
401
-
- The component passed to the `layout` slot no longer receives the `orientation` and `isLandscape` props, instead you can use the `usePickerContext` hook:
404
+
- The component passed to the `layout` slot no longer receives the `orientation` and `isLandscape` props.
405
+
You can use the `usePickerContext` hook instead:
402
406
403
407
```diff
404
408
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -411,7 +415,8 @@ This change causes a few breaking changes:
411
415
+const isLandscape = orientation === 'landscape';
412
416
```
413
417
414
-
- The component passed to the `layout` slot no longer receives the `wrapperVariant` prop, instead you can use the `usePickerContext` hook:
418
+
- The component passed to the `layout` slot no longer receives the `wrapperVariant` prop.
419
+
You can use the `usePickerContext` hook instead:
415
420
416
421
```diff
417
422
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -420,7 +425,8 @@ This change causes a few breaking changes:
420
425
+const { variant } = usePickerContext();
421
426
```
422
427
423
-
- The component passed to the `layout` slot no longer receives the `view`, `views` and `onViewChange` props, instead you can use the `usePickerContext` hook:
428
+
- The component passed to the `layout` slot no longer receives the `view`, `views` and `onViewChange` props.
429
+
You can use the `usePickerContext` hook instead:
424
430
425
431
```diff
426
432
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -497,7 +503,8 @@ This change causes a few breaking changes:
497
503
498
504
### Slot: `toolbar`
499
505
500
-
- The component passed to the `toolbar` slot no longer receives the `value` prop, instead you can use the `usePickerContext` hook:
506
+
- The component passed to the `toolbar` slot no longer receives the `value` prop.
507
+
You can use the `usePickerContext` hook instead:
501
508
502
509
```diff
503
510
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -510,7 +517,8 @@ This change causes a few breaking changes:
510
517
+const { value } = usePickerContext();
511
518
```
512
519
513
-
- The component passed to the `toolbar` slot no longer receives the `disabled` and `readOnly` props, instead you can use the `usePickerContext` hook:
520
+
- The component passed to the `toolbar` slot no longer receives the `disabled` and `readOnly` props.
521
+
You can use the `usePickerContext` hook instead:
514
522
515
523
```diff
516
524
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -522,7 +530,8 @@ This change causes a few breaking changes:
522
530
+const { readOnly } = usePickerContext();
523
531
```
524
532
525
-
- The component passed to the `toolbar` slot no longer receives the `isLandscape` prop, instead you can use the `usePickerContext` hook:
533
+
- The component passed to the `toolbar` slot no longer receives the `isLandscape` prop.
534
+
You can use the `usePickerContext` hook instead:
526
535
527
536
```diff
528
537
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -532,7 +541,8 @@ This change causes a few breaking changes:
532
541
+const isLandscape = orientation === 'landscape';
533
542
```
534
543
535
-
- The component passed to the `toolbar` slot no longer receives the `view`, `views` and `onViewChange` props, instead you can use the `usePickerContext` hook:
544
+
- The component passed to the `toolbar` slot no longer receives the `view`, `views` and `onViewChange` props.
545
+
You can use the `usePickerContext` hook instead:
536
546
537
547
```diff
538
548
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -568,7 +578,8 @@ This change causes a few breaking changes:
568
578
569
579
### Slot: `tabs`
570
580
571
-
- The component passed to the `tabs` slot no longer receives the `view`, `views` and `onViewChange` props, instead you can use the `usePickerContext` hook:
581
+
- The component passed to the `tabs` slot no longer receives the `view`, `views` and `onViewChange` props.
582
+
You can use the `usePickerContext` hook instead:
572
583
573
584
```diff
574
585
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -611,7 +622,8 @@ This change causes a few breaking changes:
611
622
612
623
### Slot: `shortcuts`
613
624
614
-
- The component passed to the `shortcuts` slot no longer receives the `isLandscape` prop, instead you can use the `usePickerContext` hook:
625
+
- The component passed to the `shortcuts` slot no longer receives the `isLandscape` prop.
626
+
You can use the `usePickerContext` hook instead:
615
627
616
628
```diff
617
629
+import { usePickerContext } from '@mui/x-date-pickers/hooks';
@@ -636,7 +648,8 @@ This change causes a few breaking changes:
636
648
The only difference is that `usePickerActionsContext` only contains variables with stable references that won't cause a re-render of your component.
637
649
:::
638
650
639
-
- The component passed to the `shortcuts` slot no longer receives the `isValid` prop, instead you can use the `useIsValidValue` hook:
651
+
- The component passed to the `shortcuts` slot no longer receives the `isValid` prop.
652
+
You can use the `useIsValidValue` hook instead:
640
653
641
654
```diff
642
655
+import { useIsValidValue } from '@mui/x-date-pickers/hooks';
0 commit comments