@mui/x-date-pickers 6.10.1 → 6.11.0

package/node/AdapterDayjs/AdapterDayjs.js

@@ -192,9 +192,24 @@ class AdapterDayjs {
       return value.format(comparisonTemplate) === comparingInValueTimezone.format(comparisonTemplate);
     };
     /**
-     * Replace "default" by undefined before passing it to `dayjs
+     * Replaces "default" by undefined and "system" by the system timezone before passing it to `dayjs`.
      */
-    this.cleanTimezone = timezone => timezone === 'default' ? undefined : timezone;
+    this.cleanTimezone = timezone => {
+      switch (timezone) {
+        case 'default':
+          {
+            return undefined;
+          }
+        case 'system':
+          {
+            return _dayjs.default.tz.guess();
+          }
+        default:
+          {
+            return timezone;
+          }
+      }
+    };
     this.createSystemDate = value => {
       // TODO v7: Stop using `this.rawDayJsInstance` (drop the `instance` param on the adapters)
       /* istanbul ignore next */
@@ -243,6 +258,27 @@ class AdapterDayjs {
       }
       return localeObject.formats;
     };
+    /**
+     * If the new day does not have the same offset as the old one (when switching to summer day time for example),
+     * Then dayjs will not automatically adjust the offset (moment does).
+     * We have to parse again the value to make sure the `fixOffset` method is applied.
+     * See https://github.com/iamkun/dayjs/blob/b3624de619d6e734cd0ffdbbd3502185041c1b60/src/plugin/timezone/index.js#L72
+     */
+    this.adjustOffset = value => {
+      if (!this.hasTimezonePlugin()) {
+        return value;
+      }
+      const timezone = this.getTimezone(value);
+      if (timezone !== 'UTC') {
+        const fixedValue = value.tz(this.cleanTimezone(timezone), true);
+        // @ts-ignore
+        if ((fixedValue.$offset ?? 0) === (value.$offset ?? 0)) {
+          return value;
+        }
+        return fixedValue;
+      }
+      return value;
+    };
     this.date = value => {
       if (value === null) {
         return null;
@@ -410,49 +446,49 @@ class AdapterDayjs {
       return value >= start && value <= end;
     };
     this.startOfYear = value => {
-      return value.startOf('year');
+      return this.adjustOffset(value.startOf('year'));
     };
     this.startOfMonth = value => {
-      return value.startOf('month');
+      return this.adjustOffset(value.startOf('month'));
     };
     this.startOfWeek = value => {
-      return value.startOf('week');
+      return this.adjustOffset(value.startOf('week'));
     };
     this.startOfDay = value => {
-      return value.startOf('day');
+      return this.adjustOffset(value.startOf('day'));
     };
     this.endOfYear = value => {
-      return value.endOf('year');
+      return this.adjustOffset(value.endOf('year'));
     };
     this.endOfMonth = value => {
-      return value.endOf('month');
+      return this.adjustOffset(value.endOf('month'));
     };
     this.endOfWeek = value => {
-      return value.endOf('week');
+      return this.adjustOffset(value.endOf('week'));
     };
     this.endOfDay = value => {
-      return value.endOf('day');
+      return this.adjustOffset(value.endOf('day'));
     };
     this.addYears = (value, amount) => {
-      return amount < 0 ? value.subtract(Math.abs(amount), 'year') : value.add(amount, 'year');
+      return this.adjustOffset(amount < 0 ? value.subtract(Math.abs(amount), 'year') : value.add(amount, 'year'));
     };
     this.addMonths = (value, amount) => {
-      return amount < 0 ? value.subtract(Math.abs(amount), 'month') : value.add(amount, 'month');
+      return this.adjustOffset(amount < 0 ? value.subtract(Math.abs(amount), 'month') : value.add(amount, 'month'));
     };
     this.addWeeks = (value, amount) => {
-      return amount < 0 ? value.subtract(Math.abs(amount), 'week') : value.add(amount, 'week');
+      return this.adjustOffset(amount < 0 ? value.subtract(Math.abs(amount), 'week') : value.add(amount, 'week'));
     };
     this.addDays = (value, amount) => {
-      return amount < 0 ? value.subtract(Math.abs(amount), 'day') : value.add(amount, 'day');
+      return this.adjustOffset(amount < 0 ? value.subtract(Math.abs(amount), 'day') : value.add(amount, 'day'));
     };
     this.addHours = (value, amount) => {
-      return amount < 0 ? value.subtract(Math.abs(amount), 'hour') : value.add(amount, 'hour');
+      return this.adjustOffset(amount < 0 ? value.subtract(Math.abs(amount), 'hour') : value.add(amount, 'hour'));
     };
     this.addMinutes = (value, amount) => {
-      return amount < 0 ? value.subtract(Math.abs(amount), 'minute') : value.add(amount, 'minute');
+      return this.adjustOffset(amount < 0 ? value.subtract(Math.abs(amount), 'minute') : value.add(amount, 'minute'));
     };
     this.addSeconds = (value, amount) => {
-      return amount < 0 ? value.subtract(Math.abs(amount), 'second') : value.add(amount, 'second');
+      return this.adjustOffset(amount < 0 ? value.subtract(Math.abs(amount), 'second') : value.add(amount, 'second'));
     };
     this.getYear = value => {
       return value.year();
@@ -476,34 +512,34 @@ class AdapterDayjs {
       return value.millisecond();
     };
     this.setYear = (value, year) => {
-      return value.set('year', year);
+      return this.adjustOffset(value.set('year', year));
     };
     this.setMonth = (value, month) => {
-      return value.set('month', month);
+      return this.adjustOffset(value.set('month', month));
     };
     this.setDate = (value, date) => {
-      return value.set('date', date);
+      return this.adjustOffset(value.set('date', date));
     };
     this.setHours = (value, hours) => {
-      return value.set('hour', hours);
+      return this.adjustOffset(value.set('hour', hours));
     };
     this.setMinutes = (value, minutes) => {
-      return value.set('minute', minutes);
+      return this.adjustOffset(value.set('minute', minutes));
     };
     this.setSeconds = (value, seconds) => {
-      return value.set('second', seconds);
+      return this.adjustOffset(value.set('second', seconds));
     };
     this.setMilliseconds = (value, milliseconds) => {
-      return value.set('millisecond', milliseconds);
+      return this.adjustOffset(value.set('millisecond', milliseconds));
     };
     this.getDaysInMonth = value => {
       return value.daysInMonth();
     };
     this.getNextMonth = value => {
-      return value.add(1, 'month');
+      return this.addMonths(value, 1);
     };
     this.getPreviousMonth = value => {
-      return value.subtract(1, 'month');
+      return this.addMonths(value, -1);
     };
     this.getMonthArray = value => {
       const firstMonth = value.startOf('year');
@@ -519,10 +555,9 @@ class AdapterDayjs {
     };
     this.getWeekdays = () => {
       const start = this.dayjs().startOf('week');
-      return [0, 1, 2, 3, 4, 5, 6].map(diff => this.formatByString(start.add(diff, 'day'), 'dd'));
+      return [0, 1, 2, 3, 4, 5, 6].map(diff => this.formatByString(this.addDays(start, diff), 'dd'));
     };
     this.getWeekArray = value => {
-      const timezone = this.getTimezone(value);
       const cleanValue = this.setLocaleToValue(value);
       const start = cleanValue.startOf('month').startOf('week');
       const end = cleanValue.endOf('month').endOf('week');
@@ -533,15 +568,7 @@ class AdapterDayjs {
         const weekNumber = Math.floor(count / 7);
         nestedWeeks[weekNumber] = nestedWeeks[weekNumber] || [];
         nestedWeeks[weekNumber].push(current);
-        current = current.add(1, 'day');
-
-        // If the new day does not have the same offset as the old one (when switching to summer day time for example),
-        // Then dayjs will not automatically adjust the offset (moment does)
-        // We have to parse again the value to make sure the `fixOffset` method is applied
-        // See https://github.com/iamkun/dayjs/blob/b3624de619d6e734cd0ffdbbd3502185041c1b60/src/plugin/timezone/index.js#L72
-        if (this.hasTimezonePlugin() && timezone !== 'UTC' && timezone !== 'system') {
-          current = current.tz(this.cleanTimezone(timezone), true);
-        }
+        current = this.addDays(current, 1);
         count += 1;
       }
       return nestedWeeks;
@@ -556,7 +583,7 @@ class AdapterDayjs {
       let current = startDate;
       while (current < endDate) {
         years.push(current);
-        current = current.add(1, 'year');
+        current = this.addYears(current, 1);
       }
       return years;
     };

package/node/DateCalendar/DateCalendar.js

@@ -10,8 +10,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
+var _utils = require("@mui/base/utils");
 var _styles = require("@mui/material/styles");
-var _utils = require("@mui/utils");
+var _utils2 = require("@mui/utils");
 var _useCalendarState = require("./useCalendarState");
 var _useUtils = require("../internals/hooks/useUtils");
 var _PickersFadeTransitionGroup = require("./PickersFadeTransitionGroup");
@@ -19,10 +20,10 @@ var _DayCalendar = require("./DayCalendar");
 var _MonthCalendar = require("../MonthCalendar");
 var _YearCalendar = require("../YearCalendar");
 var _useViews = require("../internals/hooks/useViews");
-var _PickersCalendarHeader = require("./PickersCalendarHeader");
+var _PickersCalendarHeader = require("../PickersCalendarHeader");
 var _dateUtils = require("../internals/utils/date-utils");
 var _PickerViewRoot = require("../internals/components/PickerViewRoot");
-var _defaultReduceAnimations = require("../internals/utils/defaultReduceAnimations");
+var _useDefaultReduceAnimations = require("../internals/hooks/useDefaultReduceAnimations");
 var _dateCalendarClasses = require("./dateCalendarClasses");
 var _useValueWithTimezone = require("../internals/hooks/useValueWithTimezone");
 var _valueManagers = require("../internals/utils/valueManagers");
@@ -38,26 +39,26 @@ const useUtilityClasses = ownerState => {
     root: ['root'],
     viewTransitionContainer: ['viewTransitionContainer']
   };
-  return (0, _utils.unstable_composeClasses)(slots, _dateCalendarClasses.getDateCalendarUtilityClass, classes);
+  return (0, _utils2.unstable_composeClasses)(slots, _dateCalendarClasses.getDateCalendarUtilityClass, classes);
 };
 function useDateCalendarDefaultizedProps(props, name) {
   const utils = (0, _useUtils.useUtils)();
   const defaultDates = (0, _useUtils.useDefaultDates)();
+  const defaultReduceAnimations = (0, _useDefaultReduceAnimations.useDefaultReduceAnimations)();
   const themeProps = (0, _styles.useThemeProps)({
     props,
     name
   });
-  return (0, _extends2.default)({
-    loading: false,
-    disablePast: false,
-    disableFuture: false,
-    openTo: 'day',
-    views: ['year', 'day'],
-    reduceAnimations: _defaultReduceAnimations.defaultReduceAnimations,
-    renderLoading: () => /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+  return (0, _extends2.default)({}, themeProps, {
+    loading: themeProps.loading ?? false,
+    disablePast: themeProps.disablePast ?? false,
+    disableFuture: themeProps.disableFuture ?? false,
+    openTo: themeProps.openTo ?? 'day',
+    views: themeProps.views ?? ['year', 'day'],
+    reduceAnimations: themeProps.reduceAnimations ?? defaultReduceAnimations,
+    renderLoading: themeProps.renderLoading ?? (() => /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
       children: "..."
-    })
-  }, themeProps, {
+    })),
     minDate: (0, _dateUtils.applyDefaultDate)(utils, themeProps.minDate, defaultDates.minDate),
     maxDate: (0, _dateUtils.applyDefaultDate)(utils, themeProps.maxDate, defaultDates.maxDate)
   });
@@ -87,7 +88,7 @@ const DateCalendarViewTransitionContainer = (0, _styles.styled)(_PickersFadeTran
  */
 const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(inProps, ref) {
   const utils = (0, _useUtils.useUtils)();
-  const id = (0, _utils.unstable_useId)();
+  const id = (0, _utils2.unstable_useId)();
   const props = useDateCalendarDefaultizedProps(inProps, 'MuiDateCalendar');
   const {
       autoFocus,
@@ -181,7 +182,39 @@ const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(inProps
     disableFuture,
     timezone
   });
-  const handleDateMonthChange = (0, _utils.unstable_useEventCallback)(newDate => {
+
+  // When disabled, limit the view to the selected date
+  const minDateWithDisabled = disabled && value || minDate;
+  const maxDateWithDisabled = disabled && value || maxDate;
+  const gridLabelId = `${id}-grid-label`;
+  const hasFocus = focusedView !== null;
+  const CalendarHeader = slots?.calendarHeader ?? components?.CalendarHeader ?? _PickersCalendarHeader.PickersCalendarHeader;
+  const calendarHeaderProps = (0, _utils.useSlotProps)({
+    elementType: CalendarHeader,
+    externalSlotProps: slotProps?.calendarHeader ?? componentsProps?.calendarHeader,
+    additionalProps: {
+      views,
+      view,
+      currentMonth: calendarState.currentMonth,
+      onViewChange: setView,
+      onMonthChange: (newMonth, direction) => handleChangeMonth({
+        newMonth,
+        direction
+      }),
+      minDate: minDateWithDisabled,
+      maxDate: maxDateWithDisabled,
+      disabled,
+      disablePast,
+      disableFuture,
+      reduceAnimations,
+      timezone,
+      labelId: gridLabelId,
+      slots,
+      slotProps
+    },
+    ownerState: props
+  });
+  const handleDateMonthChange = (0, _utils2.unstable_useEventCallback)(newDate => {
     const startOfMonth = utils.startOfMonth(newDate);
     const endOfMonth = utils.endOfMonth(newDate);
     const closestEnabledDate = isDateDisabled(newDate) ? (0, _dateUtils.findClosestEnabledDate)({
@@ -203,7 +236,7 @@ const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(inProps
     }
     changeFocusedDay(closestEnabledDate, true);
   });
-  const handleDateYearChange = (0, _utils.unstable_useEventCallback)(newDate => {
+  const handleDateYearChange = (0, _utils2.unstable_useEventCallback)(newDate => {
     const startOfYear = utils.startOfYear(newDate);
     const endOfYear = utils.endOfYear(newDate);
     const closestEnabledDate = isDateDisabled(newDate) ? (0, _dateUtils.findClosestEnabledDate)({
@@ -225,7 +258,7 @@ const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(inProps
     }
     changeFocusedDay(closestEnabledDate, true);
   });
-  const handleSelectedDayChange = (0, _utils.unstable_useEventCallback)(day => {
+  const handleSelectedDayChange = (0, _utils2.unstable_useEventCallback)(day => {
     if (day) {
       // If there is a date already selected, then we want to keep its time
       return handleValueChange((0, _dateUtils.mergeDateAndTime)(utils, day, value ?? referenceDate), 'finish');
@@ -246,18 +279,12 @@ const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(inProps
     maxDate,
     minDate
   };
-
-  // When disabled, limit the view to the selected date
-  const minDateWithDisabled = disabled && value || minDate;
-  const maxDateWithDisabled = disabled && value || maxDate;
   const commonViewProps = {
     disableHighlightToday,
     readOnly,
     disabled,
     timezone
   };
-  const gridLabelId = `${id}-grid-label`;
-  const hasFocus = focusedView !== null;
   const prevOpenViewRef = React.useRef(view);
   React.useEffect(() => {
     // If the view change and the focus was on the previous view
@@ -276,26 +303,7 @@ const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(inProps
     className: (0, _clsx.default)(classes.root, className),
     ownerState: ownerState
   }, other, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_PickersCalendarHeader.PickersCalendarHeader, {
-      views: views,
-      view: view,
-      currentMonth: calendarState.currentMonth,
-      onViewChange: setView,
-      onMonthChange: (newMonth, direction) => handleChangeMonth({
-        newMonth,
-        direction
-      }),
-      minDate: minDateWithDisabled,
-      maxDate: maxDateWithDisabled,
-      disabled: disabled,
-      disablePast: disablePast,
-      disableFuture: disableFuture,
-      reduceAnimations: reduceAnimations,
-      labelId: gridLabelId,
-      slots: slots,
-      slotProps: slotProps,
-      timezone: timezone
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(DateCalendarViewTransitionContainer, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(CalendarHeader, (0, _extends2.default)({}, calendarHeaderProps)), /*#__PURE__*/(0, _jsxRuntime.jsx)(DateCalendarViewTransitionContainer, {
       reduceAnimations: reduceAnimations,
       className: classes.viewTransitionContainer,
       transKey: view,

package/node/DateCalendar/index.js

@@ -3,6 +3,14 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+var _exportNames = {
+  DateCalendar: true,
+  getDateCalendarUtilityClass: true,
+  dateCalendarClasses: true,
+  dayPickerClasses: true,
+  pickersFadeTransitionGroupClasses: true,
+  pickersSlideTransitionClasses: true
+};
 Object.defineProperty(exports, "DateCalendar", {
   enumerable: true,
   get: function () {
@@ -27,12 +35,6 @@ Object.defineProperty(exports, "getDateCalendarUtilityClass", {
     return _dateCalendarClasses.getDateCalendarUtilityClass;
   }
 });
-Object.defineProperty(exports, "pickersCalendarHeaderClasses", {
-  enumerable: true,
-  get: function () {
-    return _pickersCalendarHeaderClasses.pickersCalendarHeaderClasses;
-  }
-});
 Object.defineProperty(exports, "pickersFadeTransitionGroupClasses", {
   enumerable: true,
   get: function () {
@@ -48,6 +50,17 @@ Object.defineProperty(exports, "pickersSlideTransitionClasses", {
 var _DateCalendar = require("./DateCalendar");
 var _dateCalendarClasses = require("./dateCalendarClasses");
 var _dayCalendarClasses = require("./dayCalendarClasses");
-var _pickersCalendarHeaderClasses = require("./pickersCalendarHeaderClasses");
 var _pickersFadeTransitionGroupClasses = require("./pickersFadeTransitionGroupClasses");
-var _pickersSlideTransitionClasses = require("./pickersSlideTransitionClasses");
+var _pickersSlideTransitionClasses = require("./pickersSlideTransitionClasses");
+var _PickersCalendarHeader = require("../PickersCalendarHeader");
+Object.keys(_PickersCalendarHeader).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _PickersCalendarHeader[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _PickersCalendarHeader[key];
+    }
+  });
+});

package/node/DateField/DateField.js

@@ -47,8 +47,8 @@ const DateField = /*#__PURE__*/React.forwardRef(function DateField(inProps, ref)
     textFieldProps = (0, _objectWithoutPropertiesLoose2.default)(_useSlotProps, _excluded2);
 
   // TODO: Remove when mui/material-ui#35088 will be merged
-  textFieldProps.inputProps = (0, _extends2.default)({}, textFieldProps.inputProps, inputProps);
-  textFieldProps.InputProps = (0, _extends2.default)({}, textFieldProps.InputProps, InputProps);
+  textFieldProps.inputProps = (0, _extends2.default)({}, inputProps, textFieldProps.inputProps);
+  textFieldProps.InputProps = (0, _extends2.default)({}, InputProps, textFieldProps.InputProps);
   const _useDateField = (0, _useDateField2.useDateField)({
       props: textFieldProps,
       inputRef: externalInputRef

package/node/DateTimeField/DateTimeField.js

@@ -47,8 +47,8 @@ const DateTimeField = /*#__PURE__*/React.forwardRef(function DateTimeField(inPro
     textFieldProps = (0, _objectWithoutPropertiesLoose2.default)(_useSlotProps, _excluded2);
 
   // TODO: Remove when mui/material-ui#35088 will be merged
-  textFieldProps.inputProps = (0, _extends2.default)({}, textFieldProps.inputProps, inputProps);
-  textFieldProps.InputProps = (0, _extends2.default)({}, textFieldProps.InputProps, InputProps);
+  textFieldProps.inputProps = (0, _extends2.default)({}, inputProps, textFieldProps.inputProps);
+  textFieldProps.InputProps = (0, _extends2.default)({}, InputProps, textFieldProps.InputProps);
   const _useDateTimeField = (0, _useDateTimeField2.useDateTimeField)({
       props: textFieldProps,
       inputRef: externalInputRef

package/node/DesktopDatePicker/DesktopDatePicker.js

@@ -56,7 +56,7 @@ const DesktopDatePicker = /*#__PURE__*/React.forwardRef(function DesktopDatePick
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'date',
-    getOpenDialogAriaText: localeText.openDatePickerDialogue,
+    getOpenDialogAriaText: props.localeText?.openDatePickerDialogue ?? localeText.openDatePickerDialogue,
     validator: _internals.validateDate
   });
   return renderPicker();

package/node/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -92,7 +92,7 @@ const DesktopDateTimePicker = /*#__PURE__*/React.forwardRef(function DesktopDate
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'date-time',
-    getOpenDialogAriaText: localeText.openDatePickerDialogue,
+    getOpenDialogAriaText: props.localeText?.openDatePickerDialogue ?? localeText.openDatePickerDialogue,
     validator: _validateDateTime.validateDateTime
   });
   return renderPicker();

package/node/DesktopTimePicker/DesktopTimePicker.js

@@ -79,7 +79,7 @@ const DesktopTimePicker = /*#__PURE__*/React.forwardRef(function DesktopTimePick
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'time',
-    getOpenDialogAriaText: localeText.openTimePickerDialogue,
+    getOpenDialogAriaText: props.localeText?.openTimePickerDialogue ?? localeText.openTimePickerDialogue,
     validator: _validateTime.validateTime
   });
   return renderPicker();

package/node/DigitalClock/DigitalClock.js

@@ -222,7 +222,7 @@ const DigitalClock = /*#__PURE__*/React.forwardRef(function DigitalClock(inProps
     const startOfDay = utils.startOfDay(valueOrReferenceDate);
     return [startOfDay, ...Array.from({
       length: Math.ceil(24 * 60 / timeStep) - 1
-    }, (_, index) => utils.addMinutes(startOfDay, timeStep * (index + 1))), utils.endOfDay(valueOrReferenceDate)];
+    }, (_, index) => utils.addMinutes(startOfDay, timeStep * (index + 1)))];
   }, [valueOrReferenceDate, timeStep, utils]);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(DigitalClockRoot, (0, _extends2.default)({
     ref: handleRef,

package/node/MobileDatePicker/MobileDatePicker.js

@@ -53,7 +53,7 @@ const MobileDatePicker = /*#__PURE__*/React.forwardRef(function MobileDatePicker
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'date',
-    getOpenDialogAriaText: localeText.openDatePickerDialogue,
+    getOpenDialogAriaText: props.localeText?.openDatePickerDialogue ?? localeText.openDatePickerDialogue,
     validator: _internals.validateDate
   });
   return renderPicker();

package/node/MobileDateTimePicker/MobileDateTimePicker.js

@@ -64,7 +64,7 @@ const MobileDateTimePicker = /*#__PURE__*/React.forwardRef(function MobileDateTi
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'date-time',
-    getOpenDialogAriaText: localeText.openDatePickerDialogue,
+    getOpenDialogAriaText: props.localeText?.openDatePickerDialogue ?? localeText.openDatePickerDialogue,
     validator: _validateDateTime.validateDateTime
   });
   return renderPicker();

package/node/MobileTimePicker/MobileTimePicker.js

@@ -57,7 +57,7 @@ const MobileTimePicker = /*#__PURE__*/React.forwardRef(function MobileTimePicker
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'time',
-    getOpenDialogAriaText: localeText.openTimePickerDialogue,
+    getOpenDialogAriaText: props.localeText?.openTimePickerDialogue ?? localeText.openTimePickerDialogue,
     validator: _validateTime.validateTime
   });
   return renderPicker();