@mui/x-date-pickers 6.5.0 → 6.7.0

package/node/AdapterMoment/AdapterMoment.js

@@ -101,34 +101,36 @@ const formatTokenMap = {
   ss: 'seconds'
 };
 const defaultFormats = {
-  normalDateWithWeekday: 'ddd, MMM D',
-  normalDate: 'D MMMM',
-  shortDate: 'MMM D',
-  monthAndDate: 'MMMM D',
-  dayOfMonth: 'D',
   year: 'YYYY',
   month: 'MMMM',
   monthShort: 'MMM',
-  monthAndYear: 'MMMM YYYY',
+  dayOfMonth: 'D',
   weekday: 'dddd',
   weekdayShort: 'ddd',
-  minutes: 'mm',
-  hours12h: 'hh',
   hours24h: 'HH',
+  hours12h: 'hh',
+  meridiem: 'A',
+  minutes: 'mm',
   seconds: 'ss',
+  fullDate: 'll',
+  fullDateWithWeekday: 'dddd, LL',
+  keyboardDate: 'L',
+  shortDate: 'MMM D',
+  normalDate: 'D MMMM',
+  normalDateWithWeekday: 'ddd, MMM D',
+  monthAndYear: 'MMMM YYYY',
+  monthAndDate: 'MMMM D',
   fullTime: 'LT',
   fullTime12h: 'hh:mm A',
   fullTime24h: 'HH:mm',
-  fullDate: 'll',
-  fullDateWithWeekday: 'dddd, LL',
   fullDateTime: 'lll',
   fullDateTime12h: 'll hh:mm A',
   fullDateTime24h: 'll HH:mm',
-  keyboardDate: 'L',
   keyboardDateTime: 'L LT',
   keyboardDateTime12h: 'L hh:mm A',
   keyboardDateTime24h: 'L HH:mm'
 };
+const MISSING_TIMEZONE_PLUGIN = ['Missing timezone plugin', 'To be able to use timezones, you have to pass the default export from `moment-timezone` to the `dateLibInstance` prop of `LocalizationProvider`', 'Find more information on https://mui.com/x/react-date-pickers/timezone/#moment-and-timezone'].join('\n');
 
 /**
  * Based on `@date-io/moment`
@@ -162,6 +164,7 @@ class AdapterMoment {
     instance
   } = {}) {
     this.isMUIAdapter = true;
+    this.isTimezoneCompatible = true;
     this.lib = 'moment';
     this.moment = void 0;
     this.locale = void 0;
@@ -171,6 +174,39 @@ class AdapterMoment {
       end: ']'
     };
     this.formatTokenMap = formatTokenMap;
+    this.setLocaleToValue = value => {
+      const expectedLocale = this.getCurrentLocaleCode();
+      if (expectedLocale === value.locale()) {
+        return value;
+      }
+      return value.locale(expectedLocale);
+    };
+    this.hasTimezonePlugin = () => typeof this.moment.tz !== 'undefined';
+    this.createSystemDate = value => {
+      const parsedValue = this.moment(value).local();
+      if (this.locale === undefined) {
+        return parsedValue;
+      }
+      return parsedValue.locale(this.locale);
+    };
+    this.createUTCDate = value => {
+      const parsedValue = this.moment.utc(value);
+      if (this.locale === undefined) {
+        return parsedValue;
+      }
+      return parsedValue.locale(this.locale);
+    };
+    this.createTZDate = (value, timezone) => {
+      /* istanbul ignore next */
+      if (!this.hasTimezonePlugin()) {
+        throw new Error(MISSING_TIMEZONE_PLUGIN);
+      }
+      const parsedValue = timezone === 'default' ? this.moment(value) : this.moment.tz(value, timezone);
+      if (this.locale === undefined) {
+        return parsedValue;
+      }
+      return parsedValue.locale(this.locale);
+    };
     this.date = value => {
       if (value === null) {
         return null;
@@ -179,6 +215,52 @@ class AdapterMoment {
       moment.locale(this.getCurrentLocaleCode());
       return moment;
     };
+    this.dateWithTimezone = (value, timezone) => {
+      if (value === null) {
+        return null;
+      }
+      if (timezone === 'UTC') {
+        return this.createUTCDate(value);
+      }
+      if (timezone === 'system' || timezone === 'default' && !this.hasTimezonePlugin()) {
+        return this.createSystemDate(value);
+      }
+      return this.createTZDate(value, timezone);
+    };
+    this.getTimezone = value => {
+      if (value.isUTC()) {
+        return 'UTC';
+      }
+
+      // @ts-ignore
+      // eslint-disable-next-line no-underscore-dangle
+      const zone = value._z?.name;
+
+      // @ts-ignore
+      return zone ?? this.moment.defaultZone?.name ?? 'system';
+    };
+    this.setTimezone = (value, timezone) => {
+      if (timezone === 'UTC') {
+        return value.clone().utc();
+      }
+      if (timezone === 'system') {
+        return value.clone().local();
+      }
+      if (!this.hasTimezonePlugin()) {
+        if (timezone === 'default') {
+          return value;
+        }
+
+        /* istanbul ignore next */
+        throw new Error(MISSING_TIMEZONE_PLUGIN);
+      }
+      const cleanZone = timezone === 'default' ?
+      // @ts-ignore
+      this.moment.defaultZone?.name ?? 'system' : timezone;
+      const newValue = value.clone();
+      newValue.tz(cleanZone);
+      return newValue;
+    };
     this.toJsDate = value => {
       return value.toDate();
     };
@@ -339,6 +421,9 @@ class AdapterMoment {
     this.getSeconds = value => {
       return value.get('seconds');
     };
+    this.getMilliseconds = value => {
+      return value.get('milliseconds');
+    };
     this.setYear = (value, year) => {
       return value.clone().year(year);
     };
@@ -357,6 +442,9 @@ class AdapterMoment {
     this.setSeconds = (value, seconds) => {
       return value.clone().seconds(seconds);
     };
+    this.setMilliseconds = (value, milliseconds) => {
+      return value.clone().milliseconds(milliseconds);
+    };
     this.getDaysInMonth = value => {
       return value.daysInMonth();
     };
@@ -382,8 +470,9 @@ class AdapterMoment {
       return _moment.default.weekdaysShort(true);
     };
     this.getWeekArray = value => {
-      const start = value.clone().startOf('month').startOf('week');
-      const end = value.clone().endOf('month').endOf('week');
+      const cleanLocale = this.setLocaleToValue(value);
+      const start = cleanLocale.clone().startOf('month').startOf('week');
+      const end = cleanLocale.clone().endOf('month').endOf('week');
       let count = 0;
       let current = start;
       const nestedWeeks = [];

package/node/AdapterMomentHijri/AdapterMomentHijri.js

@@ -75,33 +75,34 @@ const formatTokenMap = {
   ss: 'seconds'
 };
 const defaultFormats = {
+  year: 'iYYYY',
+  month: 'iMMMM',
+  monthShort: 'iMMM',
   dayOfMonth: 'iD',
+  weekday: 'dddd',
+  weekdayShort: 'ddd',
+  hours24h: 'HH',
+  hours12h: 'hh',
+  meridiem: 'A',
+  minutes: 'mm',
+  seconds: 'ss',
   fullDate: 'iYYYY, iMMMM Do',
   fullDateWithWeekday: 'iYYYY, iMMMM Do, dddd',
-  fullDateTime: 'iYYYY, iMMMM Do, hh:mm A',
-  fullDateTime12h: 'iD iMMMM hh:mm A',
-  fullDateTime24h: 'iD iMMMM HH:mm',
+  keyboardDateTime: 'iYYYY/iMM/iDD LT',
+  shortDate: 'iD iMMM',
+  normalDate: 'dddd, iD iMMM',
+  normalDateWithWeekday: 'DD iMMMM',
+  monthAndYear: 'iMMMM iYYYY',
+  monthAndDate: 'iD iMMMM',
   fullTime: 'LT',
   fullTime12h: 'hh:mm A',
   fullTime24h: 'HH:mm',
-  hours12h: 'hh',
-  hours24h: 'HH',
+  fullDateTime: 'iYYYY, iMMMM Do, hh:mm A',
+  fullDateTime12h: 'iD iMMMM hh:mm A',
+  fullDateTime24h: 'iD iMMMM HH:mm',
   keyboardDate: 'iYYYY/iMM/iDD',
-  keyboardDateTime: 'iYYYY/iMM/iDD LT',
   keyboardDateTime12h: 'iYYYY/iMM/iDD hh:mm A',
-  keyboardDateTime24h: 'iYYYY/iMM/iDD HH:mm',
-  minutes: 'mm',
-  month: 'iMMMM',
-  monthAndDate: 'iD iMMMM',
-  monthAndYear: 'iMMMM iYYYY',
-  monthShort: 'iMMM',
-  weekday: 'dddd',
-  weekdayShort: 'ddd',
-  normalDate: 'dddd, iD iMMM',
-  normalDateWithWeekday: 'DD iMMMM',
-  seconds: 'ss',
-  shortDate: 'iD iMMM',
-  year: 'iYYYY'
+  keyboardDateTime24h: 'iYYYY/iMM/iDD HH:mm'
 };
 const NUMBER_SYMBOL_MAP = {
   '1': '١',
@@ -152,6 +153,7 @@ class AdapterMomentHijri extends _AdapterMoment.AdapterMoment {
     });
     this.lib = 'moment-hijri';
     this.moment = void 0;
+    this.isTimezoneCompatible = false;
     this.formatTokenMap = formatTokenMap;
     this.date = value => {
       if (value === null) {
@@ -159,6 +161,15 @@ class AdapterMomentHijri extends _AdapterMoment.AdapterMoment {
       }
       return this.moment(value).locale('ar-SA');
     };
+    this.dateWithTimezone = value => {
+      return this.date(value);
+    };
+    this.getTimezone = () => {
+      return 'default';
+    };
+    this.setTimezone = value => {
+      return value;
+    };
     this.parse = (value, format) => {
       if (value === '') {
         return null;

package/node/AdapterMomentJalaali/AdapterMomentJalaali.js

@@ -73,33 +73,34 @@ const formatTokenMap = {
   ss: 'seconds'
 };
 const defaultFormats = {
+  year: 'jYYYY',
+  month: 'jMMMM',
+  monthShort: 'jMMM',
   dayOfMonth: 'jD',
+  weekday: 'dddd',
+  weekdayShort: 'ddd',
+  hours24h: 'HH',
+  hours12h: 'hh',
+  meridiem: 'A',
+  minutes: 'mm',
+  seconds: 'ss',
   fullDate: 'jYYYY, jMMMM Do',
   fullDateWithWeekday: 'dddd Do jMMMM jYYYY',
-  fullDateTime: 'jYYYY, jMMMM Do, hh:mm A',
-  fullDateTime12h: 'jD jMMMM hh:mm A',
-  fullDateTime24h: 'jD jMMMM HH:mm',
+  keyboardDate: 'jYYYY/jMM/jDD',
+  shortDate: 'jD jMMM',
+  normalDate: 'dddd, jD jMMM',
+  normalDateWithWeekday: 'DD MMMM',
+  monthAndYear: 'jMMMM jYYYY',
+  monthAndDate: 'jD jMMMM',
   fullTime: 'LT',
   fullTime12h: 'hh:mm A',
   fullTime24h: 'HH:mm',
-  hours12h: 'hh',
-  hours24h: 'HH',
-  keyboardDate: 'jYYYY/jMM/jDD',
+  fullDateTime: 'jYYYY, jMMMM Do, hh:mm A',
+  fullDateTime12h: 'jD jMMMM hh:mm A',
+  fullDateTime24h: 'jD jMMMM HH:mm',
   keyboardDateTime: 'jYYYY/jMM/jDD LT',
   keyboardDateTime12h: 'jYYYY/jMM/jDD hh:mm A',
-  keyboardDateTime24h: 'jYYYY/jMM/jDD HH:mm',
-  minutes: 'mm',
-  month: 'jMMMM',
-  monthAndDate: 'jD jMMMM',
-  monthAndYear: 'jMMMM jYYYY',
-  monthShort: 'jMMM',
-  weekday: 'dddd',
-  weekdayShort: 'ddd',
-  normalDate: 'dddd, jD jMMM',
-  normalDateWithWeekday: 'DD MMMM',
-  seconds: 'ss',
-  shortDate: 'jD jMMM',
-  year: 'jYYYY'
+  keyboardDateTime24h: 'jYYYY/jMM/jDD HH:mm'
 };
 const NUMBER_SYMBOL_MAP = {
   '1': '۱',
@@ -148,6 +149,7 @@ class AdapterMomentJalaali extends _AdapterMoment.AdapterMoment {
       locale: 'fa',
       instance
     });
+    this.isTimezoneCompatible = false;
     this.lib = 'moment-jalaali';
     this.moment = void 0;
     this.formatTokenMap = formatTokenMap;
@@ -157,6 +159,15 @@ class AdapterMomentJalaali extends _AdapterMoment.AdapterMoment {
       }
       return this.moment(value).locale('fa');
     };
+    this.dateWithTimezone = value => {
+      return this.date(value);
+    };
+    this.getTimezone = () => {
+      return 'default';
+    };
+    this.setTimezone = value => {
+      return value;
+    };
     this.parseISO = isoString => {
       return this.moment(isoString).locale('fa');
     };

package/node/DateCalendar/DateCalendar.js

@@ -217,9 +217,9 @@ const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(inProps
   const handleSelectedDayChange = (0, _utils.unstable_useEventCallback)(day => {
     if (value && day) {
       // If there is a date already selected, then we want to keep its time
-      return setValueAndGoToNextView((0, _dateUtils.mergeDateAndTime)(utils, day, value), 'finish');
+      return handleValueChange((0, _dateUtils.mergeDateAndTime)(utils, day, value), 'finish');
     }
-    return setValueAndGoToNextView(day, 'finish');
+    return handleValueChange(day, 'finish');
   });
   React.useEffect(() => {
     if (value != null && utils.isValid(value)) {

package/node/DateCalendar/PickersCalendarHeader.js

@@ -15,7 +15,7 @@ var _utils2 = require("@mui/utils");
 var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _useUtils = require("../internals/hooks/useUtils");
 var _PickersFadeTransitionGroup = require("./PickersFadeTransitionGroup");
-var _icons = require("../internals/components/icons");
+var _icons = require("../icons");
 var _PickersArrowSwitcher = require("../internals/components/PickersArrowSwitcher");
 var _dateHelpersHooks = require("../internals/hooks/date-helpers-hooks");
 var _pickersCalendarHeaderClasses = require("./pickersCalendarHeaderClasses");
@@ -86,7 +86,7 @@ const PickersCalendarHeaderSwitchViewButton = (0, _styles.styled)(_IconButton.de
     transform: 'rotate(180deg)'
   }
 }));
-const PickersCalendarHeaderSwitchViewIcon = (0, _styles.styled)(_icons.ArrowDropDown, {
+const PickersCalendarHeaderSwitchViewIcon = (0, _styles.styled)(_icons.ArrowDropDownIcon, {
   name: 'MuiPickersCalendarHeader',
   slot: 'SwitchViewIcon',
   overridesResolver: (_, styles) => styles.switchViewIcon

package/node/DateField/DateField.js

@@ -238,6 +238,12 @@ process.env.NODE_ENV !== "production" ? DateField.propTypes = {
    * @default false
    */
   readOnly: _propTypes.default.bool,
+  /**
+   * The date used to generate a part of the date-time that is not present in the format when both `value` and `defaultValue` are not present.
+   * For example, on time fields it will be used to determine the date to set.
+   * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used.
+   */
+  referenceDate: _propTypes.default.any,
   /**
    * If `true`, the label is displayed as required and the `input` element is required.
    * @default false

package/node/DatePicker/DatePickerToolbar.js

@@ -14,8 +14,8 @@ var _styles = require("@mui/material/styles");
 var _utils = require("@mui/utils");
 var _PickersToolbar = require("../internals/components/PickersToolbar");
 var _useUtils = require("../internals/hooks/useUtils");
-var _views = require("../internals/utils/views");
 var _datePickerToolbarClasses = require("./datePickerToolbarClasses");
+var _dateUtils = require("../internals/utils/date-utils");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["value", "isLandscape", "onChange", "toolbarFormat", "toolbarPlaceholder", "views"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -68,20 +68,11 @@ const DatePickerToolbar = /*#__PURE__*/React.forwardRef(function DatePickerToolb
     if (!value) {
       return toolbarPlaceholder;
     }
-    if (toolbarFormat) {
-      return utils.formatByString(value, toolbarFormat);
-    }
-    if ((0, _views.isYearOnlyView)(views)) {
-      return utils.format(value, 'year');
-    }
-    if ((0, _views.isYearAndMonthViews)(views)) {
-      return utils.format(value, 'month');
-    }
-
-    // Little localization hack (Google is doing the same for android native pickers):
-    // For english localization it is convenient to include weekday into the date "Mon, Jun 1".
-    // For other locales using strings like "June 1", without weekday.
-    return /en/.test(utils.getCurrentLocaleCode()) ? utils.format(value, 'normalDateWithWeekday') : utils.format(value, 'normalDate');
+    const formatFromViews = (0, _dateUtils.resolveDateFormat)(utils, {
+      format: toolbarFormat,
+      views
+    }, true);
+    return utils.formatByString(value, formatFromViews);
   }, [value, toolbarFormat, toolbarPlaceholder, utils, views]);
   const ownerState = props;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(DatePickerToolbarRoot, (0, _extends2.default)({

package/node/DatePicker/shared.js

@@ -4,7 +4,6 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getDatePickerFieldFormat = void 0;
 exports.useDatePickerDefaultizedProps = useDatePickerDefaultizedProps;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
@@ -16,22 +15,6 @@ var _DatePickerToolbar = require("./DatePickerToolbar");
 var _slotsMigration = require("../internals/utils/slots-migration");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const getDatePickerFieldFormat = (utils, {
-  format,
-  views
-}) => {
-  if (format != null) {
-    return format;
-  }
-  if ((0, _views.isYearOnlyView)(views)) {
-    return utils.formats.year;
-  }
-  if ((0, _views.isYearAndMonthViews)(views)) {
-    return utils.formats.monthAndYear;
-  }
-  return undefined;
-};
-exports.getDatePickerFieldFormat = getDatePickerFieldFormat;
 function useDatePickerDefaultizedProps(props, name) {
   const utils = (0, _useUtils.useUtils)();
   const defaultDates = (0, _useUtils.useDefaultDates)();

package/node/DateTimeField/DateTimeField.js

@@ -271,6 +271,12 @@ process.env.NODE_ENV !== "production" ? DateTimeField.propTypes = {
    * @default false
    */
   readOnly: _propTypes.default.bool,
+  /**
+   * The date used to generate a part of the date-time that is not present in the format when both `value` and `defaultValue` are not present.
+   * For example, on time fields it will be used to determine the date to set.
+   * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used.
+   */
+  referenceDate: _propTypes.default.any,
   /**
    * If `true`, the label is displayed as required and the `input` element is required.
    * @default false

package/node/DateTimePicker/DateTimePicker.js

@@ -282,7 +282,7 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.propTypes = {
    * Used when the component view is not controlled.
    * Must be a valid option from `views` list.
    */
-  openTo: _propTypes.default.oneOf(['day', 'hours', 'minutes', 'month', 'seconds', 'year']),
+  openTo: _propTypes.default.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']),
   /**
    * Force rendering in particular orientation.
    */
@@ -360,6 +360,11 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.propTypes = {
    * @default false
    */
   showDaysOutsideCurrentMonth: _propTypes.default.bool,
+  /**
+   * If `true`, disabled digital clock items will not be rendered.
+   * @default false
+   */
+  skipDisabled: _propTypes.default.bool,
   /**
    * The props used for each component slot.
    * @default {}
@@ -374,6 +379,17 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.propTypes = {
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
   sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
+  /**
+   * The time steps between two time unit options.
+   * For example, if `timeStep.minutes = 8`, then the available minute options will be `[0, 8, 16, 24, 32, 40, 48, 56]`.
+   * When single column time renderer is used, only `timeStep.minutes` will be used.
+   * @default{ hours: 1, minutes: 5, seconds: 5 }
+   */
+  timeSteps: _propTypes.default.shape({
+    hours: _propTypes.default.number,
+    minutes: _propTypes.default.number,
+    seconds: _propTypes.default.number
+  }),
   /**
    * The selected value.
    * Used when the component is controlled.
@@ -384,7 +400,7 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.propTypes = {
    * Used when the component view is controlled.
    * Must be a valid option from `views` list.
    */
-  view: _propTypes.default.oneOf(['day', 'hours', 'minutes', 'month', 'seconds', 'year']),
+  view: _propTypes.default.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']),
   /**
    * Define custom view renderers for each section.
    * If `null`, the section will only have field editing.
@@ -393,6 +409,7 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.propTypes = {
   viewRenderers: _propTypes.default.shape({
     day: _propTypes.default.func,
     hours: _propTypes.default.func,
+    meridiem: _propTypes.default.func,
     minutes: _propTypes.default.func,
     month: _propTypes.default.func,
     seconds: _propTypes.default.func,

package/node/DateTimePicker/DateTimePickerTabs.js

@@ -11,14 +11,15 @@ var _Tab = _interopRequireDefault(require("@mui/material/Tab"));
 var _Tabs = _interopRequireWildcard(require("@mui/material/Tabs"));
 var _styles = require("@mui/material/styles");
 var _utils = require("@mui/utils");
-var _icons = require("../internals/components/icons");
+var _icons = require("../icons");
 var _useUtils = require("../internals/hooks/useUtils");
 var _dateTimePickerTabsClasses = require("./dateTimePickerTabsClasses");
+var _dateUtils = require("../internals/utils/date-utils");
 var _jsxRuntime = require("react/jsx-runtime");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 const viewToTab = view => {
-  if (['day', 'month', 'year'].includes(view)) {
+  if ((0, _dateUtils.isDatePickerView)(view)) {
     return 'date';
   }
   return 'time';
@@ -60,9 +61,9 @@ const DateTimePickerTabs = function DateTimePickerTabs(inProps) {
     name: 'MuiDateTimePickerTabs'
   });
   const {
-    dateIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.DateRange, {}),
+    dateIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.DateRangeIcon, {}),
     onViewChange,
-    timeIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.Time, {}),
+    timeIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.TimeIcon, {}),
     view,
     hidden = typeof window === 'undefined' || window.innerHeight < 667
   } = props;
@@ -129,5 +130,5 @@ process.env.NODE_ENV !== "production" ? DateTimePickerTabs.propTypes = {
   /**
    * Currently visible picker view.
    */
-  view: _propTypes.default.oneOf(['day', 'hours', 'minutes', 'month', 'seconds', 'year']).isRequired
+  view: _propTypes.default.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']).isRequired
 } : void 0;