@mui/x-date-pickers 7.0.0-beta.7 → 7.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (145) hide show
  1. package/AdapterDateFns/AdapterDateFns.js +1 -1
  2. package/AdapterDateFnsBase/AdapterDateFnsBase.js +1 -2
  3. package/AdapterDateFnsJalali/AdapterDateFnsJalali.js +2 -4
  4. package/AdapterDateFnsV3/AdapterDateFnsV3.js +1 -1
  5. package/AdapterDayjs/AdapterDayjs.js +2 -4
  6. package/AdapterLuxon/AdapterLuxon.js +12 -9
  7. package/AdapterMoment/AdapterMoment.js +5 -6
  8. package/CHANGELOG.md +195 -12
  9. package/DateCalendar/DateCalendar.js +14 -16
  10. package/DateCalendar/DayCalendar.js +5 -6
  11. package/DateField/DateField.js +3 -4
  12. package/DatePicker/DatePicker.js +1 -1
  13. package/DatePicker/shared.d.ts +2 -1
  14. package/DatePicker/shared.js +3 -5
  15. package/DateTimeField/DateTimeField.js +3 -4
  16. package/DateTimePicker/DateTimePicker.js +1 -1
  17. package/DateTimePicker/DateTimePickerToolbar.js +1 -1
  18. package/DateTimePicker/shared.d.ts +2 -1
  19. package/DateTimePicker/shared.js +11 -13
  20. package/DesktopDatePicker/DesktopDatePicker.js +7 -11
  21. package/DesktopDateTimePicker/DesktopDateTimePicker.js +72 -37
  22. package/DesktopDateTimePicker/DesktopDateTimePickerLayout.d.ts +12 -0
  23. package/DesktopDateTimePicker/DesktopDateTimePickerLayout.js +101 -0
  24. package/DesktopDateTimePicker/index.d.ts +1 -0
  25. package/DesktopDateTimePicker/index.js +2 -1
  26. package/DesktopTimePicker/DesktopTimePicker.js +8 -12
  27. package/DigitalClock/DigitalClock.js +2 -3
  28. package/LocalizationProvider/LocalizationProvider.js +1 -2
  29. package/MobileDatePicker/MobileDatePicker.js +6 -10
  30. package/MobileDateTimePicker/MobileDateTimePicker.js +8 -12
  31. package/MobileTimePicker/MobileTimePicker.js +6 -10
  32. package/MonthCalendar/MonthCalendar.js +4 -4
  33. package/MonthCalendar/PickersMonth.js +1 -2
  34. package/MultiSectionDigitalClock/MultiSectionDigitalClock.js +1 -1
  35. package/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.js +1 -1
  36. package/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js +3 -5
  37. package/PickersActionBar/PickersActionBar.js +1 -1
  38. package/PickersCalendarHeader/PickersCalendarHeader.js +4 -5
  39. package/PickersLayout/usePickerLayout.js +8 -9
  40. package/PickersSectionList/PickersSectionList.js +9 -11
  41. package/PickersTextField/PickersFilledInput/PickersFilledInput.js +2 -3
  42. package/PickersTextField/PickersInput/PickersInput.js +1 -1
  43. package/PickersTextField/PickersInputBase/PickersInputBase.js +4 -5
  44. package/PickersTextField/PickersOutlinedInput/PickersOutlinedInput.js +2 -2
  45. package/README.md +1 -1
  46. package/StaticDatePicker/StaticDatePicker.js +4 -5
  47. package/StaticDateTimePicker/StaticDateTimePicker.js +6 -7
  48. package/StaticTimePicker/StaticTimePicker.js +3 -4
  49. package/TimeClock/TimeClock.js +1 -1
  50. package/TimeField/TimeField.js +2 -3
  51. package/TimePicker/shared.d.ts +2 -1
  52. package/TimePicker/shared.js +5 -7
  53. package/YearCalendar/YearCalendar.js +5 -6
  54. package/hooks/useClearableField.js +6 -7
  55. package/index.js +1 -1
  56. package/internals/components/PickersArrowSwitcher/PickersArrowSwitcher.js +8 -9
  57. package/internals/components/PickersModalDialog.js +6 -7
  58. package/internals/components/PickersPopper.js +13 -16
  59. package/internals/components/PickersToolbar.js +9 -12
  60. package/internals/hooks/date-helpers-hooks.js +1 -1
  61. package/internals/hooks/defaultizedFieldProps.js +15 -18
  62. package/internals/hooks/useClockReferenceDate.js +1 -1
  63. package/internals/hooks/useDesktopPicker/index.d.ts +1 -1
  64. package/internals/hooks/useDesktopPicker/useDesktopPicker.js +11 -12
  65. package/internals/hooks/useDesktopPicker/useDesktopPicker.types.d.ts +2 -2
  66. package/internals/hooks/useField/buildSectionsFromFormat.js +35 -31
  67. package/internals/hooks/useField/useField.js +2 -2
  68. package/internals/hooks/useField/useField.utils.js +4 -7
  69. package/internals/hooks/useField/useFieldCharacterEditing.js +1 -2
  70. package/internals/hooks/useField/useFieldState.js +1 -1
  71. package/internals/hooks/useField/useFieldV6TextField.js +9 -15
  72. package/internals/hooks/useField/useFieldV7TextField.js +9 -11
  73. package/internals/hooks/useMobilePicker/useMobilePicker.js +7 -8
  74. package/internals/hooks/useOpenState.js +1 -1
  75. package/internals/hooks/usePicker/index.d.ts +1 -0
  76. package/internals/hooks/usePicker/usePickerViews.d.ts +4 -2
  77. package/internals/hooks/usePicker/usePickerViews.js +1 -2
  78. package/internals/hooks/useStaticPicker/useStaticPicker.js +13 -17
  79. package/internals/hooks/useValueWithTimezone.js +5 -6
  80. package/internals/hooks/useViews.js +3 -4
  81. package/internals/index.d.ts +1 -1
  82. package/internals/models/validation.d.ts +1 -1
  83. package/internals/utils/convertFieldResponseIntoMuiTextFieldProps.js +3 -3
  84. package/internals/utils/date-time-utils.js +2 -5
  85. package/internals/utils/fields.js +1 -1
  86. package/internals/utils/getDefaultReferenceDate.js +2 -6
  87. package/internals/utils/views.js +1 -1
  88. package/locales/csCZ.js +1 -4
  89. package/locales/daDK.js +1 -4
  90. package/locales/deDE.js +1 -4
  91. package/locales/huHU.js +1 -4
  92. package/locales/jaJP.js +1 -4
  93. package/locales/roRO.js +1 -4
  94. package/locales/skSK.js +1 -4
  95. package/modern/AdapterLuxon/AdapterLuxon.js +9 -4
  96. package/modern/DateCalendar/DateCalendar.js +1 -1
  97. package/modern/DateField/DateField.js +1 -1
  98. package/modern/DatePicker/DatePicker.js +1 -1
  99. package/modern/DateTimeField/DateTimeField.js +1 -1
  100. package/modern/DateTimePicker/DateTimePicker.js +1 -1
  101. package/modern/DesktopDatePicker/DesktopDatePicker.js +1 -1
  102. package/modern/DesktopDateTimePicker/DesktopDateTimePicker.js +64 -25
  103. package/modern/DesktopDateTimePicker/DesktopDateTimePickerLayout.js +101 -0
  104. package/modern/DesktopDateTimePicker/index.js +2 -1
  105. package/modern/MobileDatePicker/MobileDatePicker.js +1 -1
  106. package/modern/MobileDateTimePicker/MobileDateTimePicker.js +1 -1
  107. package/modern/StaticDatePicker/StaticDatePicker.js +1 -1
  108. package/modern/StaticDateTimePicker/StaticDateTimePicker.js +1 -1
  109. package/modern/index.js +1 -1
  110. package/modern/internals/components/PickersPopper.js +1 -1
  111. package/modern/internals/hooks/useField/buildSectionsFromFormat.js +34 -30
  112. package/modern/internals/hooks/useField/useFieldV7TextField.js +1 -1
  113. package/modern/internals/hooks/useOpenState.js +1 -1
  114. package/modern/internals/utils/fields.js +1 -1
  115. package/node/AdapterLuxon/AdapterLuxon.js +9 -4
  116. package/node/DateCalendar/DateCalendar.js +1 -1
  117. package/node/DateField/DateField.js +1 -1
  118. package/node/DatePicker/DatePicker.js +1 -1
  119. package/node/DateTimeField/DateTimeField.js +1 -1
  120. package/node/DateTimePicker/DateTimePicker.js +1 -1
  121. package/node/DesktopDatePicker/DesktopDatePicker.js +1 -1
  122. package/node/DesktopDateTimePicker/DesktopDateTimePicker.js +63 -25
  123. package/node/DesktopDateTimePicker/DesktopDateTimePickerLayout.js +108 -0
  124. package/node/DesktopDateTimePicker/index.js +8 -1
  125. package/node/MobileDatePicker/MobileDatePicker.js +1 -1
  126. package/node/MobileDateTimePicker/MobileDateTimePicker.js +1 -1
  127. package/node/StaticDatePicker/StaticDatePicker.js +1 -1
  128. package/node/StaticDateTimePicker/StaticDateTimePicker.js +1 -1
  129. package/node/index.js +1 -1
  130. package/node/internals/components/PickersPopper.js +1 -1
  131. package/node/internals/hooks/useField/buildSectionsFromFormat.js +34 -30
  132. package/node/internals/hooks/useField/useFieldV7TextField.js +1 -1
  133. package/node/internals/hooks/useOpenState.js +1 -1
  134. package/node/internals/utils/fields.js +1 -1
  135. package/package.json +5 -5
  136. package/timeViewRenderers/timeViewRenderers.js +1 -1
  137. package/dateTimeViewRenderers/dateTimeViewRenderers.d.ts +0 -15
  138. package/dateTimeViewRenderers/dateTimeViewRenderers.js +0 -163
  139. package/dateTimeViewRenderers/index.d.ts +0 -2
  140. package/dateTimeViewRenderers/index.js +0 -1
  141. package/dateTimeViewRenderers/package.json +0 -6
  142. package/modern/dateTimeViewRenderers/dateTimeViewRenderers.js +0 -162
  143. package/modern/dateTimeViewRenderers/index.js +0 -1
  144. package/node/dateTimeViewRenderers/dateTimeViewRenderers.js +0 -171
  145. package/node/dateTimeViewRenderers/index.js +0 -12
@@ -23,7 +23,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
23
23
  * - [TimeField API](https://mui.com/x/api/date-pickers/time-field/)
24
24
  */
25
25
  const TimeField = /*#__PURE__*/React.forwardRef(function TimeField(inProps, inRef) {
26
- var _slots$textField;
27
26
  const themeProps = useThemeProps({
28
27
  props: inProps,
29
28
  name: 'MuiTimeField'
@@ -36,10 +35,10 @@ const TimeField = /*#__PURE__*/React.forwardRef(function TimeField(inProps, inRe
36
35
  } = themeProps,
37
36
  other = _objectWithoutPropertiesLoose(themeProps, _excluded);
38
37
  const ownerState = themeProps;
39
- const TextField = (_slots$textField = slots == null ? void 0 : slots.textField) != null ? _slots$textField : inProps.enableAccessibleFieldDOMStructure ? PickersTextField : MuiTextField;
38
+ const TextField = slots?.textField ?? (inProps.enableAccessibleFieldDOMStructure ? PickersTextField : MuiTextField);
40
39
  const textFieldProps = useSlotProps({
41
40
  elementType: TextField,
42
- externalSlotProps: slotProps == null ? void 0 : slotProps.textField,
41
+ externalSlotProps: slotProps?.textField,
43
42
  externalForwardedProps: other,
44
43
  ownerState,
45
44
  additionalProps: {
@@ -20,6 +20,7 @@ export interface BaseTimePickerSlots<TDate extends PickerValidDate> extends Time
20
20
  export interface BaseTimePickerSlotProps extends TimeClockSlotProps {
21
21
  toolbar?: ExportedTimePickerToolbarProps;
22
22
  }
23
+ export type TimePickerViewRenderers<TDate extends PickerValidDate, TView extends TimeViewWithMeridiem, TAdditionalProps extends {} = {}> = PickerViewRendererLookup<TDate | null, TView, TimeViewRendererProps<TView, BaseClockProps<TDate, TView>>, TAdditionalProps>;
23
24
  export interface BaseTimePickerProps<TDate extends PickerValidDate, TView extends TimeViewWithMeridiem> extends BasePickerInputProps<TDate | null, TDate, TView, TimeValidationError>, ExportedBaseClockProps<TDate> {
24
25
  /**
25
26
  * Display ampm controls under the clock (instead of in the toolbar).
@@ -41,7 +42,7 @@ export interface BaseTimePickerProps<TDate extends PickerValidDate, TView extend
41
42
  * If `null`, the section will only have field editing.
42
43
  * If `undefined`, internally defined view will be the used.
43
44
  */
44
- viewRenderers?: Partial<PickerViewRendererLookup<TDate | null, TView, TimeViewRendererProps<TView, BaseClockProps<TDate, TView>>, {}>>;
45
+ viewRenderers?: Partial<TimePickerViewRenderers<TDate, TView>>;
45
46
  }
46
47
  type UseTimePickerDefaultizedProps<TDate extends PickerValidDate, TView extends TimeViewWithMeridiem, Props extends BaseTimePickerProps<TDate, TView>> = LocalizedComponent<TDate, DefaultizedProps<Props, 'views' | 'openTo' | 'ampm' | keyof BaseTimeValidationProps>>;
47
48
  export declare function useTimePickerDefaultizedProps<TDate extends PickerValidDate, TView extends TimeViewWithMeridiem, Props extends BaseTimePickerProps<TDate, TView>>(props: Props, name: string): UseTimePickerDefaultizedProps<TDate, TView, Props>;
@@ -5,16 +5,14 @@ import { useUtils } from '../internals/hooks/useUtils';
5
5
  import { TimePickerToolbar } from './TimePickerToolbar';
6
6
  import { applyDefaultViewProps } from '../internals/utils/views';
7
7
  export function useTimePickerDefaultizedProps(props, name) {
8
- var _themeProps$ampm, _themeProps$disableFu, _themeProps$disablePa, _themeProps$slotProps;
9
8
  const utils = useUtils();
10
9
  const themeProps = useThemeProps({
11
10
  props,
12
11
  name
13
12
  });
14
- const ampm = (_themeProps$ampm = themeProps.ampm) != null ? _themeProps$ampm : utils.is12HourCycleInCurrentLocale();
13
+ const ampm = themeProps.ampm ?? utils.is12HourCycleInCurrentLocale();
15
14
  const localeText = React.useMemo(() => {
16
- var _themeProps$localeTex;
17
- if (((_themeProps$localeTex = themeProps.localeText) == null ? void 0 : _themeProps$localeTex.toolbarTitle) == null) {
15
+ if (themeProps.localeText?.toolbarTitle == null) {
18
16
  return themeProps.localeText;
19
17
  }
20
18
  return _extends({}, themeProps.localeText, {
@@ -30,8 +28,8 @@ export function useTimePickerDefaultizedProps(props, name) {
30
28
  defaultViews: ['hours', 'minutes'],
31
29
  defaultOpenTo: 'hours'
32
30
  }), {
33
- disableFuture: (_themeProps$disableFu = themeProps.disableFuture) != null ? _themeProps$disableFu : false,
34
- disablePast: (_themeProps$disablePa = themeProps.disablePast) != null ? _themeProps$disablePa : false,
31
+ disableFuture: themeProps.disableFuture ?? false,
32
+ disablePast: themeProps.disablePast ?? false,
35
33
  slots: _extends({
36
34
  toolbar: TimePickerToolbar
37
35
  }, themeProps.slots),
@@ -39,7 +37,7 @@ export function useTimePickerDefaultizedProps(props, name) {
39
37
  toolbar: _extends({
40
38
  ampm,
41
39
  ampmInClock: themeProps.ampmInClock
42
- }, (_themeProps$slotProps = themeProps.slotProps) == null ? void 0 : _themeProps$slotProps.toolbar)
40
+ }, themeProps.slotProps?.toolbar)
43
41
  })
44
42
  });
45
43
  }
@@ -26,7 +26,6 @@ const useUtilityClasses = ownerState => {
26
26
  return composeClasses(slots, getYearCalendarUtilityClass, classes);
27
27
  };
28
28
  function useYearCalendarDefaultizedProps(props, name) {
29
- var _themeProps$yearsPerR;
30
29
  const utils = useUtils();
31
30
  const defaultDates = useDefaultDates();
32
31
  const themeProps = useThemeProps({
@@ -37,7 +36,7 @@ function useYearCalendarDefaultizedProps(props, name) {
37
36
  disablePast: false,
38
37
  disableFuture: false
39
38
  }, themeProps, {
40
- yearsPerRow: (_themeProps$yearsPerR = themeProps.yearsPerRow) != null ? _themeProps$yearsPerR : 3,
39
+ yearsPerRow: themeProps.yearsPerRow ?? 3,
41
40
  minDate: applyDefaultDate(utils, themeProps.minDate, defaultDates.minDate),
42
41
  maxDate: applyDefaultDate(utils, themeProps.maxDate, defaultDates.maxDate)
43
42
  });
@@ -130,7 +129,7 @@ export const YearCalendar = /*#__PURE__*/React.forwardRef(function YearCalendar(
130
129
  name: 'YearCalendar',
131
130
  state: 'hasFocus',
132
131
  controlled: hasFocus,
133
- default: autoFocus != null ? autoFocus : false
132
+ default: autoFocus ?? false
134
133
  });
135
134
  const changeHasFocus = useEventCallback(newHasFocus => {
136
135
  setInternalHasFocus(newHasFocus);
@@ -161,14 +160,14 @@ export const YearCalendar = /*#__PURE__*/React.forwardRef(function YearCalendar(
161
160
  if (readOnly) {
162
161
  return;
163
162
  }
164
- const newDate = utils.setYear(value != null ? value : referenceDate, year);
163
+ const newDate = utils.setYear(value ?? referenceDate, year);
165
164
  handleValueChange(newDate);
166
165
  });
167
166
  const focusYear = useEventCallback(year => {
168
- if (!isYearDisabled(utils.setYear(value != null ? value : referenceDate, year))) {
167
+ if (!isYearDisabled(utils.setYear(value ?? referenceDate, year))) {
169
168
  setFocusedYear(year);
170
169
  changeHasFocus(true);
171
- onYearFocus == null || onYearFocus(year);
170
+ onYearFocus?.(year);
172
171
  }
173
172
  });
174
173
  React.useEffect(() => {
@@ -11,7 +11,6 @@ import { useLocaleText } from '../internals/hooks/useUtils';
11
11
  import { jsx as _jsx } from "react/jsx-runtime";
12
12
  import { jsxs as _jsxs } from "react/jsx-runtime";
13
13
  export const useClearableField = props => {
14
- var _slots$clearButton, _slots$clearIcon;
15
14
  const localeText = useLocaleText();
16
15
  const {
17
16
  clearable,
@@ -22,11 +21,11 @@ export const useClearableField = props => {
22
21
  slotProps
23
22
  } = props,
24
23
  other = _objectWithoutPropertiesLoose(props, _excluded);
25
- const IconButton = (_slots$clearButton = slots == null ? void 0 : slots.clearButton) != null ? _slots$clearButton : MuiIconButton;
24
+ const IconButton = slots?.clearButton ?? MuiIconButton;
26
25
  // The spread is here to avoid this bug mui/material-ui#34056
27
26
  const _useSlotProps = useSlotProps({
28
27
  elementType: IconButton,
29
- externalSlotProps: slotProps == null ? void 0 : slotProps.clearButton,
28
+ externalSlotProps: slotProps?.clearButton,
30
29
  ownerState: {},
31
30
  className: 'clearButton',
32
31
  additionalProps: {
@@ -34,10 +33,10 @@ export const useClearableField = props => {
34
33
  }
35
34
  }),
36
35
  iconButtonProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded2);
37
- const EndClearIcon = (_slots$clearIcon = slots == null ? void 0 : slots.clearIcon) != null ? _slots$clearIcon : ClearIcon;
36
+ const EndClearIcon = slots?.clearIcon ?? ClearIcon;
38
37
  const endClearIconProps = useSlotProps({
39
38
  elementType: EndClearIcon,
40
- externalSlotProps: slotProps == null ? void 0 : slotProps.clearIcon,
39
+ externalSlotProps: slotProps?.clearIcon,
41
40
  ownerState: {}
42
41
  });
43
42
  return _extends({}, other, {
@@ -46,7 +45,7 @@ export const useClearableField = props => {
46
45
  children: [clearable && /*#__PURE__*/_jsx(InputAdornment, {
47
46
  position: "end",
48
47
  sx: {
49
- marginRight: InputProps != null && InputProps.endAdornment ? -1 : -1.5
48
+ marginRight: InputProps?.endAdornment ? -1 : -1.5
50
49
  },
51
50
  children: /*#__PURE__*/_jsx(IconButton, _extends({}, iconButtonProps, {
52
51
  onClick: onClear,
@@ -54,7 +53,7 @@ export const useClearableField = props => {
54
53
  fontSize: "small"
55
54
  }, endClearIconProps))
56
55
  }))
57
- }), InputProps == null ? void 0 : InputProps.endAdornment]
56
+ }), InputProps?.endAdornment]
58
57
  })
59
58
  }),
60
59
  sx: [{
package/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/x-date-pickers v7.0.0-beta.7
2
+ * @mui/x-date-pickers v7.0.0
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -51,7 +51,6 @@ const useUtilityClasses = ownerState => {
51
51
  return composeClasses(slots, getPickersArrowSwitcherUtilityClass, classes);
52
52
  };
53
53
  export const PickersArrowSwitcher = /*#__PURE__*/React.forwardRef(function PickersArrowSwitcher(inProps, ref) {
54
- var _slots$previousIconBu, _slots$nextIconButton, _slots$leftArrowIcon, _slots$rightArrowIcon;
55
54
  const theme = useTheme();
56
55
  const isRTL = theme.direction === 'rtl';
57
56
  const props = useThemeProps({
@@ -87,10 +86,10 @@ export const PickersArrowSwitcher = /*#__PURE__*/React.forwardRef(function Picke
87
86
  goTo: onGoToPrevious,
88
87
  label: previousLabel
89
88
  };
90
- const PreviousIconButton = (_slots$previousIconBu = slots == null ? void 0 : slots.previousIconButton) != null ? _slots$previousIconBu : PickersArrowSwitcherButton;
89
+ const PreviousIconButton = slots?.previousIconButton ?? PickersArrowSwitcherButton;
91
90
  const previousIconButtonProps = useSlotProps({
92
91
  elementType: PreviousIconButton,
93
- externalSlotProps: slotProps == null ? void 0 : slotProps.previousIconButton,
92
+ externalSlotProps: slotProps?.previousIconButton,
94
93
  additionalProps: {
95
94
  size: 'medium',
96
95
  title: previousProps.label,
@@ -104,10 +103,10 @@ export const PickersArrowSwitcher = /*#__PURE__*/React.forwardRef(function Picke
104
103
  }),
105
104
  className: classes.button
106
105
  });
107
- const NextIconButton = (_slots$nextIconButton = slots == null ? void 0 : slots.nextIconButton) != null ? _slots$nextIconButton : PickersArrowSwitcherButton;
106
+ const NextIconButton = slots?.nextIconButton ?? PickersArrowSwitcherButton;
108
107
  const nextIconButtonProps = useSlotProps({
109
108
  elementType: NextIconButton,
110
- externalSlotProps: slotProps == null ? void 0 : slotProps.nextIconButton,
109
+ externalSlotProps: slotProps?.nextIconButton,
111
110
  additionalProps: {
112
111
  size: 'medium',
113
112
  title: nextProps.label,
@@ -121,22 +120,22 @@ export const PickersArrowSwitcher = /*#__PURE__*/React.forwardRef(function Picke
121
120
  }),
122
121
  className: classes.button
123
122
  });
124
- const LeftArrowIcon = (_slots$leftArrowIcon = slots == null ? void 0 : slots.leftArrowIcon) != null ? _slots$leftArrowIcon : ArrowLeftIcon;
123
+ const LeftArrowIcon = slots?.leftArrowIcon ?? ArrowLeftIcon;
125
124
  // The spread is here to avoid this bug mui/material-ui#34056
126
125
  const _useSlotProps = useSlotProps({
127
126
  elementType: LeftArrowIcon,
128
- externalSlotProps: slotProps == null ? void 0 : slotProps.leftArrowIcon,
127
+ externalSlotProps: slotProps?.leftArrowIcon,
129
128
  additionalProps: {
130
129
  fontSize: 'inherit'
131
130
  },
132
131
  ownerState: undefined
133
132
  }),
134
133
  leftArrowIconProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded2);
135
- const RightArrowIcon = (_slots$rightArrowIcon = slots == null ? void 0 : slots.rightArrowIcon) != null ? _slots$rightArrowIcon : ArrowRightIcon;
134
+ const RightArrowIcon = slots?.rightArrowIcon ?? ArrowRightIcon;
136
135
  // The spread is here to avoid this bug mui/material-ui#34056
137
136
  const _useSlotProps2 = useSlotProps({
138
137
  elementType: RightArrowIcon,
139
- externalSlotProps: slotProps == null ? void 0 : slotProps.rightArrowIcon,
138
+ externalSlotProps: slotProps?.rightArrowIcon,
140
139
  additionalProps: {
141
140
  fontSize: 'inherit'
142
141
  },
@@ -21,7 +21,6 @@ const PickersModalDialogContent = styled(DialogContent)({
21
21
  }
22
22
  });
23
23
  export function PickersModalDialog(props) {
24
- var _slots$dialog, _slots$mobileTransiti;
25
24
  const {
26
25
  children,
27
26
  onDismiss,
@@ -29,16 +28,16 @@ export function PickersModalDialog(props) {
29
28
  slots,
30
29
  slotProps
31
30
  } = props;
32
- const Dialog = (_slots$dialog = slots == null ? void 0 : slots.dialog) != null ? _slots$dialog : PickersModalDialogRoot;
33
- const Transition = (_slots$mobileTransiti = slots == null ? void 0 : slots.mobileTransition) != null ? _slots$mobileTransiti : Fade;
31
+ const Dialog = slots?.dialog ?? PickersModalDialogRoot;
32
+ const Transition = slots?.mobileTransition ?? Fade;
34
33
  return /*#__PURE__*/_jsx(Dialog, _extends({
35
34
  open: open,
36
35
  onClose: onDismiss
37
- }, slotProps == null ? void 0 : slotProps.dialog, {
36
+ }, slotProps?.dialog, {
38
37
  TransitionComponent: Transition,
39
- TransitionProps: slotProps == null ? void 0 : slotProps.mobileTransition,
40
- PaperComponent: slots == null ? void 0 : slots.mobilePaper,
41
- PaperProps: slotProps == null ? void 0 : slotProps.mobilePaper,
38
+ TransitionProps: slotProps?.mobileTransition,
39
+ PaperComponent: slots?.mobilePaper,
40
+ PaperProps: slotProps?.mobilePaper,
42
41
  children: /*#__PURE__*/_jsx(PickersModalDialogContent, {
43
42
  children: children
44
43
  })
@@ -146,7 +146,7 @@ function useClickAwayListener(active, onClickAway) {
146
146
  // TODO This behavior is not tested automatically
147
147
  // It's unclear whether this is due to different update semantics in test (batched in act() vs discrete on click).
148
148
  // Or if this is a timing related issues due to different Transition components
149
- // Once we get rid of all the manual scheduling (e.g. setTimeout(update, 0)) we can revisit this code+test.
149
+ // Once we get rid of all the manual scheduling (for example setTimeout(update, 0)) we can revisit this code+test.
150
150
  if (active) {
151
151
  const doc = ownerDocument(nodeRef.current);
152
152
  doc.addEventListener('click', handleClickAway);
@@ -190,21 +190,18 @@ const PickersPopperPaperWrapper = /*#__PURE__*/React.forwardRef((props, ref) =>
190
190
  });
191
191
  return /*#__PURE__*/_jsx(PaperComponent, _extends({}, other, paperProps, {
192
192
  onClick: event => {
193
- var _paperProps$onClick;
194
193
  onPaperClick(event);
195
- (_paperProps$onClick = paperProps.onClick) == null || _paperProps$onClick.call(paperProps, event);
194
+ paperProps.onClick?.(event);
196
195
  },
197
196
  onTouchStart: event => {
198
- var _paperProps$onTouchSt;
199
197
  onPaperTouchStart(event);
200
- (_paperProps$onTouchSt = paperProps.onTouchStart) == null || _paperProps$onTouchSt.call(paperProps, event);
198
+ paperProps.onTouchStart?.(event);
201
199
  },
202
200
  ownerState: ownerState,
203
201
  children: children
204
202
  }));
205
203
  });
206
204
  export function PickersPopper(inProps) {
207
- var _slots$desktopTransit, _slots$desktopTrapFoc, _slots$desktopPaper, _slots$popper;
208
205
  const props = useThemeProps({
209
206
  props: inProps,
210
207
  name: 'MuiPickersPopper'
@@ -251,14 +248,14 @@ export function PickersPopper(inProps) {
251
248
  });
252
249
  }
253
250
  }, [open, role, shouldRestoreFocus]);
254
- const [clickAwayRef, onPaperClick, onPaperTouchStart] = useClickAwayListener(open, onBlur != null ? onBlur : onDismiss);
251
+ const [clickAwayRef, onPaperClick, onPaperTouchStart] = useClickAwayListener(open, onBlur ?? onDismiss);
255
252
  const paperRef = React.useRef(null);
256
253
  const handleRef = useForkRef(paperRef, containerRef);
257
254
  const handlePaperRef = useForkRef(handleRef, clickAwayRef);
258
255
  const ownerState = props;
259
256
  const classes = useUtilityClasses(ownerState);
260
257
  const defaultReduceAnimations = useDefaultReduceAnimations();
261
- const reduceAnimations = inReduceAnimations != null ? inReduceAnimations : defaultReduceAnimations;
258
+ const reduceAnimations = inReduceAnimations ?? defaultReduceAnimations;
262
259
  const handleKeyDown = event => {
263
260
  if (event.key === 'Escape') {
264
261
  // stop the propagation to avoid closing parent modal
@@ -266,13 +263,13 @@ export function PickersPopper(inProps) {
266
263
  onDismiss();
267
264
  }
268
265
  };
269
- const Transition = ((_slots$desktopTransit = slots == null ? void 0 : slots.desktopTransition) != null ? _slots$desktopTransit : reduceAnimations) ? Fade : Grow;
270
- const FocusTrap = (_slots$desktopTrapFoc = slots == null ? void 0 : slots.desktopTrapFocus) != null ? _slots$desktopTrapFoc : BaseFocusTrap;
271
- const Paper = (_slots$desktopPaper = slots == null ? void 0 : slots.desktopPaper) != null ? _slots$desktopPaper : PickersPopperPaper;
272
- const Popper = (_slots$popper = slots == null ? void 0 : slots.popper) != null ? _slots$popper : PickersPopperRoot;
266
+ const Transition = slots?.desktopTransition ?? reduceAnimations ? Fade : Grow;
267
+ const FocusTrap = slots?.desktopTrapFocus ?? BaseFocusTrap;
268
+ const Paper = slots?.desktopPaper ?? PickersPopperPaper;
269
+ const Popper = slots?.popper ?? PickersPopperRoot;
273
270
  const popperProps = useSlotProps({
274
271
  elementType: Popper,
275
- externalSlotProps: slotProps == null ? void 0 : slotProps.popper,
272
+ externalSlotProps: slotProps?.popper,
276
273
  additionalProps: {
277
274
  transition: true,
278
275
  role,
@@ -298,8 +295,8 @@ export function PickersPopper(inProps) {
298
295
  disableRestoreFocus: true,
299
296
  disableEnforceFocus: role === 'tooltip',
300
297
  isEnabled: () => true
301
- }, slotProps == null ? void 0 : slotProps.desktopTrapFocus, {
302
- children: /*#__PURE__*/_jsx(Transition, _extends({}, TransitionProps, slotProps == null ? void 0 : slotProps.desktopTransition, {
298
+ }, slotProps?.desktopTrapFocus, {
299
+ children: /*#__PURE__*/_jsx(Transition, _extends({}, TransitionProps, slotProps?.desktopTransition, {
303
300
  children: /*#__PURE__*/_jsx(PickersPopperPaperWrapper, {
304
301
  PaperComponent: Paper,
305
302
  ownerState: ownerState,
@@ -308,7 +305,7 @@ export function PickersPopper(inProps) {
308
305
  onPaperClick: onPaperClick,
309
306
  onPaperTouchStart: onPaperTouchStart,
310
307
  paperClasses: classes.paper,
311
- paperSlotProps: slotProps == null ? void 0 : slotProps.desktopPaper,
308
+ paperSlotProps: slotProps?.desktopPaper,
312
309
  children: children
313
310
  })
314
311
  }))
@@ -47,18 +47,15 @@ const PickersToolbarContent = styled('div', {
47
47
  overridesResolver: (props, styles) => styles.content
48
48
  })(({
49
49
  ownerState
50
- }) => {
51
- var _ownerState$landscape;
52
- return {
53
- display: 'flex',
54
- flexWrap: 'wrap',
55
- width: '100%',
56
- justifyContent: ownerState.isLandscape ? 'flex-start' : 'space-between',
57
- flexDirection: ownerState.isLandscape ? (_ownerState$landscape = ownerState.landscapeDirection) != null ? _ownerState$landscape : 'column' : 'row',
58
- flex: 1,
59
- alignItems: ownerState.isLandscape ? 'flex-start' : 'center'
60
- };
61
- });
50
+ }) => ({
51
+ display: 'flex',
52
+ flexWrap: 'wrap',
53
+ width: '100%',
54
+ justifyContent: ownerState.isLandscape ? 'flex-start' : 'space-between',
55
+ flexDirection: ownerState.isLandscape ? ownerState.landscapeDirection ?? 'column' : 'row',
56
+ flex: 1,
57
+ alignItems: ownerState.isLandscape ? 'flex-start' : 'center'
58
+ }));
62
59
  export const PickersToolbar = /*#__PURE__*/React.forwardRef(function PickersToolbar(inProps, ref) {
63
60
  const props = useThemeProps({
64
61
  props: inProps,
@@ -30,7 +30,7 @@ export function useMeridiemMode(date, ampm, onChange, selectionState) {
30
30
  const meridiemMode = getMeridiem(date, utils);
31
31
  const handleMeridiemChange = React.useCallback(mode => {
32
32
  const timeWithMeridiem = date == null ? null : convertToMeridiem(date, mode, Boolean(ampm), utils);
33
- onChange(timeWithMeridiem, selectionState != null ? selectionState : 'partial');
33
+ onChange(timeWithMeridiem, selectionState ?? 'partial');
34
34
  }, [ampm, date, onChange, selectionState, utils]);
35
35
  return {
36
36
  meridiemMode,
@@ -2,42 +2,39 @@ import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import { applyDefaultDate } from '../utils/date-utils';
3
3
  import { useUtils, useDefaultDates } from './useUtils';
4
4
  export const useDefaultizedDateField = props => {
5
- var _props$disablePast, _props$disableFuture, _props$format;
6
5
  const utils = useUtils();
7
6
  const defaultDates = useDefaultDates();
8
7
  return _extends({}, props, {
9
- disablePast: (_props$disablePast = props.disablePast) != null ? _props$disablePast : false,
10
- disableFuture: (_props$disableFuture = props.disableFuture) != null ? _props$disableFuture : false,
11
- format: (_props$format = props.format) != null ? _props$format : utils.formats.keyboardDate,
8
+ disablePast: props.disablePast ?? false,
9
+ disableFuture: props.disableFuture ?? false,
10
+ format: props.format ?? utils.formats.keyboardDate,
12
11
  minDate: applyDefaultDate(utils, props.minDate, defaultDates.minDate),
13
12
  maxDate: applyDefaultDate(utils, props.maxDate, defaultDates.maxDate)
14
13
  });
15
14
  };
16
15
  export const useDefaultizedTimeField = props => {
17
- var _props$ampm, _props$disablePast2, _props$disableFuture2, _props$format2;
18
16
  const utils = useUtils();
19
- const ampm = (_props$ampm = props.ampm) != null ? _props$ampm : utils.is12HourCycleInCurrentLocale();
17
+ const ampm = props.ampm ?? utils.is12HourCycleInCurrentLocale();
20
18
  const defaultFormat = ampm ? utils.formats.fullTime12h : utils.formats.fullTime24h;
21
19
  return _extends({}, props, {
22
- disablePast: (_props$disablePast2 = props.disablePast) != null ? _props$disablePast2 : false,
23
- disableFuture: (_props$disableFuture2 = props.disableFuture) != null ? _props$disableFuture2 : false,
24
- format: (_props$format2 = props.format) != null ? _props$format2 : defaultFormat
20
+ disablePast: props.disablePast ?? false,
21
+ disableFuture: props.disableFuture ?? false,
22
+ format: props.format ?? defaultFormat
25
23
  });
26
24
  };
27
25
  export const useDefaultizedDateTimeField = props => {
28
- var _props$ampm2, _props$disablePast3, _props$disableFuture3, _props$format3, _props$minDateTime, _props$maxDateTime, _props$minDateTime2, _props$maxDateTime2;
29
26
  const utils = useUtils();
30
27
  const defaultDates = useDefaultDates();
31
- const ampm = (_props$ampm2 = props.ampm) != null ? _props$ampm2 : utils.is12HourCycleInCurrentLocale();
28
+ const ampm = props.ampm ?? utils.is12HourCycleInCurrentLocale();
32
29
  const defaultFormat = ampm ? utils.formats.keyboardDateTime12h : utils.formats.keyboardDateTime24h;
33
30
  return _extends({}, props, {
34
- disablePast: (_props$disablePast3 = props.disablePast) != null ? _props$disablePast3 : false,
35
- disableFuture: (_props$disableFuture3 = props.disableFuture) != null ? _props$disableFuture3 : false,
36
- format: (_props$format3 = props.format) != null ? _props$format3 : defaultFormat,
31
+ disablePast: props.disablePast ?? false,
32
+ disableFuture: props.disableFuture ?? false,
33
+ format: props.format ?? defaultFormat,
37
34
  disableIgnoringDatePartForTimeValidation: Boolean(props.minDateTime || props.maxDateTime),
38
- minDate: applyDefaultDate(utils, (_props$minDateTime = props.minDateTime) != null ? _props$minDateTime : props.minDate, defaultDates.minDate),
39
- maxDate: applyDefaultDate(utils, (_props$maxDateTime = props.maxDateTime) != null ? _props$maxDateTime : props.maxDate, defaultDates.maxDate),
40
- minTime: (_props$minDateTime2 = props.minDateTime) != null ? _props$minDateTime2 : props.minTime,
41
- maxTime: (_props$maxDateTime2 = props.maxDateTime) != null ? _props$maxDateTime2 : props.maxTime
35
+ minDate: applyDefaultDate(utils, props.minDateTime ?? props.minDate, defaultDates.minDate),
36
+ maxDate: applyDefaultDate(utils, props.maxDateTime ?? props.maxDate, defaultDates.maxDate),
37
+ minTime: props.minDateTime ?? props.minTime,
38
+ maxTime: props.maxDateTime ?? props.maxTime
42
39
  });
43
40
  };
@@ -21,5 +21,5 @@ export const useClockReferenceDate = ({
21
21
  // We only want to compute the reference date on mount.
22
22
  [] // eslint-disable-line react-hooks/exhaustive-deps
23
23
  );
24
- return value != null ? value : referenceDate;
24
+ return value ?? referenceDate;
25
25
  };
@@ -1,2 +1,2 @@
1
1
  export { useDesktopPicker } from './useDesktopPicker';
2
- export type { UseDesktopPickerSlots, UseDesktopPickerSlotProps, ExportedUseDesktopPickerSlotProps, DesktopOnlyPickerProps, } from './useDesktopPicker.types';
2
+ export type { UseDesktopPickerSlots, UseDesktopPickerSlotProps, ExportedUseDesktopPickerSlotProps, DesktopOnlyPickerProps, UseDesktopPickerProps, } from './useDesktopPicker.types';
@@ -23,7 +23,6 @@ import { jsxs as _jsxs } from "react/jsx-runtime";
23
23
  * - DesktopTimePicker
24
24
  */
25
25
  export const useDesktopPicker = _ref => {
26
- var _innerSlotProps$toolb, _innerSlotProps$toolb2, _slots$inputAdornment, _slots$openPickerButt, _slots$layout;
27
26
  let {
28
27
  props,
29
28
  getOpenDialogAriaText
@@ -53,7 +52,7 @@ export const useDesktopPicker = _ref => {
53
52
  const containerRef = React.useRef(null);
54
53
  const fieldRef = React.useRef(null);
55
54
  const labelId = useId();
56
- const isToolbarHidden = (_innerSlotProps$toolb = innerSlotProps == null || (_innerSlotProps$toolb2 = innerSlotProps.toolbar) == null ? void 0 : _innerSlotProps$toolb2.hidden) != null ? _innerSlotProps$toolb : false;
55
+ const isToolbarHidden = innerSlotProps?.toolbar?.hidden ?? false;
57
56
  const {
58
57
  open,
59
58
  actions,
@@ -69,20 +68,20 @@ export const useDesktopPicker = _ref => {
69
68
  additionalViewProps: {},
70
69
  wrapperVariant: 'desktop'
71
70
  }));
72
- const InputAdornment = (_slots$inputAdornment = slots.inputAdornment) != null ? _slots$inputAdornment : MuiInputAdornment;
71
+ const InputAdornment = slots.inputAdornment ?? MuiInputAdornment;
73
72
  const _useSlotProps = useSlotProps({
74
73
  elementType: InputAdornment,
75
- externalSlotProps: innerSlotProps == null ? void 0 : innerSlotProps.inputAdornment,
74
+ externalSlotProps: innerSlotProps?.inputAdornment,
76
75
  additionalProps: {
77
76
  position: 'end'
78
77
  },
79
78
  ownerState: props
80
79
  }),
81
80
  inputAdornmentProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded2);
82
- const OpenPickerButton = (_slots$openPickerButt = slots.openPickerButton) != null ? _slots$openPickerButt : IconButton;
81
+ const OpenPickerButton = slots.openPickerButton ?? IconButton;
83
82
  const _useSlotProps2 = useSlotProps({
84
83
  elementType: OpenPickerButton,
85
- externalSlotProps: innerSlotProps == null ? void 0 : innerSlotProps.openPickerButton,
84
+ externalSlotProps: innerSlotProps?.openPickerButton,
86
85
  additionalProps: {
87
86
  disabled: disabled || readOnly,
88
87
  onClick: open ? actions.onClose : actions.onOpen,
@@ -96,7 +95,7 @@ export const useDesktopPicker = _ref => {
96
95
  const Field = slots.field;
97
96
  const fieldProps = useSlotProps({
98
97
  elementType: Field,
99
- externalSlotProps: innerSlotProps == null ? void 0 : innerSlotProps.field,
98
+ externalSlotProps: innerSlotProps?.field,
100
99
  additionalProps: _extends({}, pickerFieldProps, isToolbarHidden && {
101
100
  id: labelId
102
101
  }, {
@@ -126,7 +125,7 @@ export const useDesktopPicker = _ref => {
126
125
  ref: containerRef,
127
126
  [`${inputAdornmentProps.position}Adornment`]: /*#__PURE__*/_jsx(InputAdornment, _extends({}, inputAdornmentProps, {
128
127
  children: /*#__PURE__*/_jsx(OpenPickerButton, _extends({}, openPickerButtonProps, {
129
- children: /*#__PURE__*/_jsx(OpenPickerIcon, _extends({}, innerSlotProps == null ? void 0 : innerSlotProps.openPickerIcon))
128
+ children: /*#__PURE__*/_jsx(OpenPickerIcon, _extends({}, innerSlotProps?.openPickerIcon))
130
129
  }))
131
130
  }))
132
131
  });
@@ -136,7 +135,7 @@ export const useDesktopPicker = _ref => {
136
135
  clearIcon: slots.clearIcon,
137
136
  clearButton: slots.clearButton
138
137
  }, fieldProps.slots);
139
- const Layout = (_slots$layout = slots.layout) != null ? _slots$layout : PickersLayout;
138
+ const Layout = slots.layout ?? PickersLayout;
140
139
  let labelledById = labelId;
141
140
  if (isToolbarHidden) {
142
141
  if (label) {
@@ -146,12 +145,12 @@ export const useDesktopPicker = _ref => {
146
145
  }
147
146
  }
148
147
  const slotProps = _extends({}, innerSlotProps, {
149
- toolbar: _extends({}, innerSlotProps == null ? void 0 : innerSlotProps.toolbar, {
148
+ toolbar: _extends({}, innerSlotProps?.toolbar, {
150
149
  titleId: labelId
151
150
  }),
152
151
  popper: _extends({
153
152
  'aria-labelledby': labelledById
154
- }, innerSlotProps == null ? void 0 : innerSlotProps.popper)
153
+ }, innerSlotProps?.popper)
155
154
  });
156
155
  const handleFieldRef = useForkRef(fieldRef, fieldProps.unstableFieldRef);
157
156
  const renderPicker = () => /*#__PURE__*/_jsxs(LocalizationProvider, {
@@ -170,7 +169,7 @@ export const useDesktopPicker = _ref => {
170
169
  slotProps: slotProps,
171
170
  shouldRestoreFocus: shouldRestoreFocus,
172
171
  reduceAnimations: reduceAnimations,
173
- children: /*#__PURE__*/_jsx(Layout, _extends({}, layoutProps, slotProps == null ? void 0 : slotProps.layout, {
172
+ children: /*#__PURE__*/_jsx(Layout, _extends({}, layoutProps, slotProps?.layout, {
174
173
  slots: slots,
175
174
  slotProps: slotProps,
176
175
  children: renderCurrentView()
@@ -54,7 +54,7 @@ export interface DesktopOnlyPickerProps extends BaseNonStaticPickerProps, BaseNo
54
54
  */
55
55
  autoFocus?: boolean;
56
56
  }
57
- export interface UseDesktopPickerProps<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TError, TExternalProps extends UsePickerViewsProps<any, any, TView, any, any>> extends BasePickerProps<TDate | null, TDate, TView, TError, TExternalProps, {}>, DesktopOnlyPickerProps {
57
+ export interface UseDesktopPickerProps<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TError, TExternalProps extends UsePickerViewsProps<TDate | null, TDate, TView, any, {}>> extends BasePickerProps<TDate | null, TDate, TView, TError, TExternalProps, {}>, DesktopOnlyPickerProps {
58
58
  /**
59
59
  * Overridable component slots.
60
60
  * @default {}
@@ -66,7 +66,7 @@ export interface UseDesktopPickerProps<TDate extends PickerValidDate, TView exte
66
66
  */
67
67
  slotProps?: UseDesktopPickerSlotProps<TDate, TView, TEnableAccessibleFieldDOMStructure>;
68
68
  }
69
- export interface UseDesktopPickerParams<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TExternalProps extends UseDesktopPickerProps<TDate, TView, TEnableAccessibleFieldDOMStructure, any, TExternalProps>> extends Pick<UsePickerParams<TDate | null, TDate, TView, FieldSection, TExternalProps, {}>, 'valueManager' | 'valueType' | 'validator'> {
69
+ export interface UseDesktopPickerParams<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TExternalProps extends UseDesktopPickerProps<TDate, TView, TEnableAccessibleFieldDOMStructure, any, TExternalProps>> extends Pick<UsePickerParams<TDate | null, TDate, TView, FieldSection, TExternalProps, {}>, 'valueManager' | 'valueType' | 'validator' | 'rendererInterceptor'> {
70
70
  props: TExternalProps;
71
71
  getOpenDialogAriaText: (date: TDate | null, utils: MuiPickersAdapter<TDate>) => string;
72
72
  }