@mui/x-date-pickers 6.4.0 → 6.6.0

package/internals/hooks/useViews.js

@@ -45,20 +45,13 @@ export function useViews({
     // Update the current view when `openTo` or `views` props change
     if (previousOpenTo.current && previousOpenTo.current !== openTo || previousViews.current && previousViews.current.some(previousView => !views.includes(previousView))) {
       setView(views.includes(openTo) ? openTo : views[0]);
+      previousViews.current = views;
+      previousOpenTo.current = openTo;
     }
   }, [openTo, setView, view, views]);
   const viewIndex = views.indexOf(view);
   const previousView = (_views = views[viewIndex - 1]) != null ? _views : null;
   const nextView = (_views2 = views[viewIndex + 1]) != null ? _views2 : null;
-  const handleChangeView = useEventCallback(newView => {
-    if (newView === view) {
-      return;
-    }
-    setView(newView);
-    if (onViewChange) {
-      onViewChange(newView);
-    }
-  });
   const handleFocusedViewChange = useEventCallback((viewToFocus, hasFocus) => {
     if (hasFocus) {
       // Focus event
@@ -71,6 +64,16 @@ export function useViews({
 
     onFocusedViewChange == null ? void 0 : onFocusedViewChange(viewToFocus, hasFocus);
   });
+  const handleChangeView = useEventCallback(newView => {
+    if (newView === view) {
+      return;
+    }
+    setView(newView);
+    handleFocusedViewChange(newView, true);
+    if (onViewChange) {
+      onViewChange(newView);
+    }
+  });
   const goToNextView = useEventCallback(() => {
     if (nextView) {
       handleChangeView(nextView);

package/internals/index.d.ts

@@ -42,14 +42,16 @@ export type { BaseToolbarProps, ExportedBaseToolbarProps } from './models/props/
 export type { DefaultizedProps, MakeOptional } from './models/helpers';
 export type { WrapperVariant } from './models/common';
 export type { BaseDateValidationProps, BaseTimeValidationProps, TimeValidationProps, MonthValidationProps, YearValidationProps, DayValidationProps, DateTimeValidationProps, } from './models/validation';
-export { applyDefaultDate, replaceInvalidDateByNull, areDatesEqual } from './utils/date-utils';
+export { applyDefaultDate, replaceInvalidDateByNull, areDatesEqual, getTodayDate, } from './utils/date-utils';
+export { splitFieldInternalAndForwardedProps } from './utils/fields';
+export { getDefaultReferenceDate } from './utils/getDefaultReferenceDate';
 export { executeInTheNextEventLoopTick, getActiveElement, onSpaceOrEnter, DEFAULT_DESKTOP_MODE_MEDIA_QUERY, } from './utils/utils';
 export { defaultReduceAnimations } from './utils/defaultReduceAnimations';
 export { extractValidationProps } from './utils/validation/extractValidationProps';
 export { validateDate } from './utils/validation/validateDate';
 export { validateDateTime } from './utils/validation/validateDateTime';
 export { validateTime } from './utils/validation/validateTime';
-export { buildDeprecatedPropsWarning } from './utils/warning';
+export { buildDeprecatedPropsWarning, buildWarning } from './utils/warning';
 export { uncapitalizeObjectKeys } from './utils/slots-migration';
 export type { UncapitalizeObjectKeys, SlotsAndSlotProps } from './utils/slots-migration';
 export { PickersCalendarHeader } from '../DateCalendar/PickersCalendarHeader';

package/internals/index.js

@@ -15,14 +15,16 @@ export { useStaticPicker } from './hooks/useStaticPicker';
 export { useLocalizationContext, useDefaultDates, useUtils, useLocaleText, useNow } from './hooks/useUtils';
 export { useValidation } from './hooks/useValidation';
 export { usePreviousMonthDisabled, useNextMonthDisabled } from './hooks/date-helpers-hooks';
-export { applyDefaultDate, replaceInvalidDateByNull, areDatesEqual } from './utils/date-utils';
+export { applyDefaultDate, replaceInvalidDateByNull, areDatesEqual, getTodayDate } from './utils/date-utils';
+export { splitFieldInternalAndForwardedProps } from './utils/fields';
+export { getDefaultReferenceDate } from './utils/getDefaultReferenceDate';
 export { executeInTheNextEventLoopTick, getActiveElement, onSpaceOrEnter, DEFAULT_DESKTOP_MODE_MEDIA_QUERY } from './utils/utils';
 export { defaultReduceAnimations } from './utils/defaultReduceAnimations';
 export { extractValidationProps } from './utils/validation/extractValidationProps';
 export { validateDate } from './utils/validation/validateDate';
 export { validateDateTime } from './utils/validation/validateDateTime';
 export { validateTime } from './utils/validation/validateTime';
-export { buildDeprecatedPropsWarning } from './utils/warning';
+export { buildDeprecatedPropsWarning, buildWarning } from './utils/warning';
 export { uncapitalizeObjectKeys } from './utils/slots-migration';
 export { PickersCalendarHeader } from '../DateCalendar/PickersCalendarHeader';
 export { DayCalendar } from '../DateCalendar/DayCalendar';

package/internals/models/fields.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { TextFieldProps } from '@mui/material/TextField';
 import type { UseFieldInternalProps } from '../hooks/useField';
 import type { FieldSection } from '../../models';
-export interface BaseFieldProps<TValue, TSection extends FieldSection, TError> extends Omit<UseFieldInternalProps<TValue, TSection, TError>, 'format'> {
+export interface BaseFieldProps<TValue, TDate, TSection extends FieldSection, TError> extends Omit<UseFieldInternalProps<TValue, TDate, TSection, TError>, 'format'> {
     className?: string;
     format?: string;
     disabled?: boolean;

package/internals/utils/date-utils.d.ts

@@ -1,4 +1,5 @@
-import { MuiPickersAdapter } from '../../models';
+import { DateView, FieldValueType, MuiPickersAdapter } from '../../models';
+import { DateOrTimeViewWithMeridiem } from '../models';
 interface FindClosestDateParams<TDate> {
     date: TDate;
     disableFuture?: boolean;
@@ -15,4 +16,6 @@ export declare const applyDefaultDate: <TDate>(utils: MuiPickersAdapter<TDate, a
 export declare const areDatesEqual: <TDate>(utils: MuiPickersAdapter<TDate, any>, a: TDate, b: TDate) => boolean;
 export declare const getMonthsInYear: <TDate>(utils: MuiPickersAdapter<TDate, any>, year: TDate) => TDate[];
 export declare const mergeDateAndTime: <TDate>(utils: MuiPickersAdapter<TDate, any>, dateParam: TDate, timeParam: TDate) => TDate;
+export declare const getTodayDate: <TDate>(utils: MuiPickersAdapter<TDate, any>, valueType: FieldValueType) => TDate;
+export declare const isDatePickerView: (view: DateOrTimeViewWithMeridiem) => view is DateView;
 export {};

package/internals/utils/date-utils.js

@@ -85,4 +85,7 @@ export const mergeDateAndTime = (utils, dateParam, timeParam) => {
   mergedDate = utils.setMinutes(mergedDate, utils.getMinutes(timeParam));
   mergedDate = utils.setSeconds(mergedDate, utils.getSeconds(timeParam));
   return mergedDate;
-};
+};
+export const getTodayDate = (utils, valueType) => valueType === 'date' ? utils.startOfDay(utils.date()) : utils.date();
+const dateViews = ['year', 'month', 'day'];
+export const isDatePickerView = view => dateViews.includes(view);

package/internals/utils/fields.d.ts

@@ -0,0 +1,5 @@
+import { FieldValueType } from '../../models';
+export declare const splitFieldInternalAndForwardedProps: <TProps extends {}, TInternalPropNames extends keyof TProps>(props: TProps, valueType: FieldValueType) => {
+    forwardedProps: Omit<TProps, TInternalPropNames>;
+    internalProps: Pick<TProps, TInternalPropNames>;
+};

package/internals/utils/fields.js

@@ -0,0 +1,28 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { DATE_TIME_VALIDATION_PROP_NAMES, DATE_VALIDATION_PROP_NAMES, TIME_VALIDATION_PROP_NAMES } from './validation/extractValidationProps';
+const SHARED_FIELD_INTERNAL_PROP_NAMES = ['value', 'defaultValue', 'referenceDate', 'format', 'formatDensity', 'onChange', 'readOnly', 'onError', 'shouldRespectLeadingZeros', 'selectedSections', 'onSelectedSectionsChange', 'unstableFieldRef'];
+export const splitFieldInternalAndForwardedProps = (props, valueType) => {
+  const forwardedProps = _extends({}, props);
+  const internalProps = {};
+  const extractProp = propName => {
+    if (forwardedProps.hasOwnProperty(propName)) {
+      // @ts-ignore
+      internalProps[propName] = forwardedProps[propName];
+      delete forwardedProps[propName];
+    }
+  };
+  SHARED_FIELD_INTERNAL_PROP_NAMES.forEach(extractProp);
+  if (valueType === 'date') {
+    DATE_VALIDATION_PROP_NAMES.forEach(extractProp);
+  } else if (valueType === 'time') {
+    TIME_VALIDATION_PROP_NAMES.forEach(extractProp);
+  } else if (valueType === 'date-time') {
+    DATE_VALIDATION_PROP_NAMES.forEach(extractProp);
+    TIME_VALIDATION_PROP_NAMES.forEach(extractProp);
+    DATE_TIME_VALIDATION_PROP_NAMES.forEach(extractProp);
+  }
+  return {
+    forwardedProps,
+    internalProps
+  };
+};

package/internals/utils/getDefaultReferenceDate.d.ts

@@ -0,0 +1,15 @@
+import { FieldSection, FieldValueType, MuiPickersAdapter } from '../../models';
+export interface GetDefaultReferenceDateProps<TDate> {
+    maxDate?: TDate;
+    minDate?: TDate;
+    minTime?: TDate;
+    maxTime?: TDate;
+    disableIgnoringDatePartForTimeValidation?: boolean;
+}
+export declare const getSectionTypeGranularity: (sections: FieldSection[]) => number;
+export declare const getDefaultReferenceDate: <TDate>({ props, utils, valueType, granularity, }: {
+    props: GetDefaultReferenceDateProps<TDate>;
+    utils: MuiPickersAdapter<TDate, any>;
+    valueType: FieldValueType;
+    granularity: number;
+}) => TDate;

package/internals/utils/getDefaultReferenceDate.js

@@ -0,0 +1,62 @@
+import { createIsAfterIgnoreDatePart } from './time-utils';
+import { mergeDateAndTime, getTodayDate } from './date-utils';
+const SECTION_TYPE_GRANULARITY = {
+  year: 1,
+  month: 2,
+  day: 3,
+  hours: 4,
+  minutes: 5,
+  seconds: 6,
+  milliseconds: 7
+};
+export const getSectionTypeGranularity = sections => Math.max(...sections.map(section => {
+  var _SECTION_TYPE_GRANULA;
+  return (_SECTION_TYPE_GRANULA = SECTION_TYPE_GRANULARITY[section.type]) != null ? _SECTION_TYPE_GRANULA : 1;
+}));
+const roundDate = (utils, granularity, date) => {
+  if (granularity === SECTION_TYPE_GRANULARITY.year) {
+    return utils.startOfYear(date);
+  }
+  if (granularity === SECTION_TYPE_GRANULARITY.month) {
+    return utils.startOfMonth(date);
+  }
+  if (granularity === SECTION_TYPE_GRANULARITY.day) {
+    return utils.startOfDay(date);
+  }
+
+  // We don't have startOfHour / startOfMinute / startOfSecond
+  let roundedDate = date;
+  if (granularity < SECTION_TYPE_GRANULARITY.minutes) {
+    roundedDate = utils.setMinutes(roundedDate, 0);
+  }
+  if (granularity < SECTION_TYPE_GRANULARITY.seconds) {
+    roundedDate = utils.setSeconds(roundedDate, 0);
+  }
+  if (granularity < SECTION_TYPE_GRANULARITY.milliseconds) {
+    roundedDate = utils.setMilliseconds(roundedDate, 0);
+  }
+  return roundedDate;
+};
+export const getDefaultReferenceDate = ({
+  props,
+  utils,
+  valueType,
+  granularity
+}) => {
+  var _props$disableIgnorin;
+  let referenceDate = roundDate(utils, granularity, getTodayDate(utils, valueType));
+  if (props.minDate != null && utils.isAfterDay(props.minDate, referenceDate)) {
+    referenceDate = roundDate(utils, granularity, props.minDate);
+  }
+  if (props.maxDate != null && utils.isBeforeDay(props.maxDate, referenceDate)) {
+    referenceDate = roundDate(utils, granularity, props.maxDate);
+  }
+  const isAfter = createIsAfterIgnoreDatePart((_props$disableIgnorin = props.disableIgnoringDatePartForTimeValidation) != null ? _props$disableIgnorin : false, utils);
+  if (props.minTime != null && isAfter(props.minTime, referenceDate)) {
+    referenceDate = roundDate(utils, granularity, props.disableIgnoringDatePartForTimeValidation ? props.minTime : mergeDateAndTime(utils, referenceDate, props.minTime));
+  }
+  if (props.maxTime != null && isAfter(referenceDate, props.maxTime)) {
+    referenceDate = roundDate(utils, granularity, props.disableIgnoringDatePartForTimeValidation ? props.maxTime : mergeDateAndTime(utils, referenceDate, props.maxTime));
+  }
+  return referenceDate;
+};

package/internals/utils/time-utils.d.ts

@@ -1,6 +1,7 @@
 import { MuiPickersAdapter } from '../../models';
-import { DateOrTimeViewWithMeridiem } from '../models';
+import { DateOrTimeViewWithMeridiem, TimeViewWithMeridiem } from '../models';
 export declare const isTimeView: (view: DateOrTimeViewWithMeridiem) => boolean;
+export declare const isInternalTimeView: (view: DateOrTimeViewWithMeridiem) => view is TimeViewWithMeridiem;
 export type Meridiem = 'am' | 'pm';
 export declare const getMeridiem: <TDate>(date: TDate | null, utils: MuiPickersAdapter<TDate, any>) => Meridiem | null;
 export declare const convertValueToMeridiem: (value: number, meridiem: Meridiem | null, ampm: boolean) => number;

package/internals/utils/time-utils.js

@@ -1,5 +1,6 @@
 const timeViews = ['hours', 'minutes', 'seconds'];
 export const isTimeView = view => timeViews.includes(view);
+export const isInternalTimeView = view => timeViews.includes(view) || view === 'meridiem';
 export const getMeridiem = (date, utils) => {
   if (!date) {
     return null;

package/internals/utils/validation/extractValidationProps.d.ts

@@ -1,7 +1,11 @@
+import { BaseDateValidationProps, BaseTimeValidationProps, DateTimeValidationProps, DayValidationProps, MonthValidationProps, TimeValidationProps, YearValidationProps } from '../../models/validation';
+export declare const DATE_VALIDATION_PROP_NAMES: (keyof BaseDateValidationProps<any> | keyof YearValidationProps<any> | keyof MonthValidationProps<any> | keyof DayValidationProps<any>)[];
+export declare const TIME_VALIDATION_PROP_NAMES: (keyof BaseTimeValidationProps | keyof TimeValidationProps<any> | 'ampm')[];
+export declare const DATE_TIME_VALIDATION_PROP_NAMES: (keyof DateTimeValidationProps<any>)[];
 /**
  * Extract the validation props for the props received by a component.
  * Limit the risk of forgetting some of them and reduce the bundle size.
  */
 export declare const extractValidationProps: <Props extends {
     [key: string]: any;
-}>(props: Props) => Pick<Props, "disableFuture" | "disablePast" | "maxDate" | "minDate" | "shouldDisableDate" | "shouldDisableMonth" | "shouldDisableYear" | "minutesStep" | "minTime" | "maxTime" | "shouldDisableTime" | "shouldDisableClock" | "disableIgnoringDatePartForTimeValidation" | "minDateTime" | "maxDateTime">;
+}>(props: Props) => Pick<Props, "disableFuture" | "disablePast" | "maxDate" | "minDate" | "shouldDisableDate" | "shouldDisableMonth" | "shouldDisableYear" | "minutesStep" | "minTime" | "maxTime" | "ampm" | "shouldDisableTime" | "shouldDisableClock" | "disableIgnoringDatePartForTimeValidation" | "minDateTime" | "maxDateTime">;

package/internals/utils/validation/extractValidationProps.js

@@ -1,4 +1,7 @@
-const VALIDATION_PROP_NAMES = ['disablePast', 'disableFuture', 'minDate', 'maxDate', 'minTime', 'maxTime', 'minDateTime', 'maxDateTime', 'shouldDisableDate', 'shouldDisableMonth', 'shouldDisableYear', 'shouldDisableClock', 'shouldDisableTime', 'minutesStep'];
+export const DATE_VALIDATION_PROP_NAMES = ['disablePast', 'disableFuture', 'minDate', 'maxDate', 'shouldDisableDate', 'shouldDisableMonth', 'shouldDisableYear'];
+export const TIME_VALIDATION_PROP_NAMES = ['disablePast', 'disableFuture', 'minTime', 'maxTime', 'shouldDisableClock', 'shouldDisableTime', 'minutesStep', 'ampm', 'disableIgnoringDatePartForTimeValidation'];
+export const DATE_TIME_VALIDATION_PROP_NAMES = ['minDateTime', 'maxDateTime'];
+const VALIDATION_PROP_NAMES = [...DATE_VALIDATION_PROP_NAMES, ...TIME_VALIDATION_PROP_NAMES, ...DATE_TIME_VALIDATION_PROP_NAMES];
 /**
  * Extract the validation props for the props received by a component.
  * Limit the risk of forgetting some of them and reduce the bundle size.

package/internals/utils/valueManagers.js

@@ -1,13 +1,31 @@
-import { areDatesEqual, replaceInvalidDateByNull } from './date-utils';
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["value", "referenceDate"];
+import { areDatesEqual, getTodayDate, replaceInvalidDateByNull } from './date-utils';
+import { getDefaultReferenceDate } from './getDefaultReferenceDate';
 import { addPositionPropertiesToSections, createDateStrForInputFromSections } from '../hooks/useField/useField.utils';
 export const singleItemValueManager = {
   emptyValue: null,
-  getTodayValue: (utils, valueType) => valueType === 'date' ? utils.startOfDay(utils.date()) : utils.date(),
+  getTodayValue: getTodayDate,
+  getInitialReferenceValue: _ref => {
+    let {
+        value,
+        referenceDate
+      } = _ref,
+      params = _objectWithoutPropertiesLoose(_ref, _excluded);
+    if (value != null && params.utils.isValid(value)) {
+      return value;
+    }
+    if (referenceDate != null) {
+      return referenceDate;
+    }
+    return getDefaultReferenceDate(params);
+  },
   cleanValue: replaceInvalidDateByNull,
   areValuesEqual: areDatesEqual,
   isSameError: (a, b) => a === b,
   hasError: error => error != null,
-  defaultErrorState: null
+  defaultErrorState: null,
+  getTimezone: (utils, value) => value == null ? null : utils.getTimezone(value)
 };
 export const singleItemFieldValueManager = {
   updateReferenceValue: (utils, value, prevReferenceValue) => value == null || !utils.isValid(value) ? prevReferenceValue : value,

package/legacy/AdapterDateFns/AdapterDateFns.js

@@ -30,6 +30,7 @@ import getHours from 'date-fns/getHours';
 import getMinutes from 'date-fns/getMinutes';
 import getMonth from 'date-fns/getMonth';
 import getSeconds from 'date-fns/getSeconds';
+import getMilliseconds from 'date-fns/getMilliseconds';
 import getWeek from 'date-fns/getWeek';
 import getYear from 'date-fns/getYear';
 import isAfter from 'date-fns/isAfter';
@@ -46,6 +47,7 @@ import setHours from 'date-fns/setHours';
 import setMinutes from 'date-fns/setMinutes';
 import setMonth from 'date-fns/setMonth';
 import setSeconds from 'date-fns/setSeconds';
+import setMilliseconds from 'date-fns/setMilliseconds';
 import setYear from 'date-fns/setYear';
 import startOfDay from 'date-fns/startOfDay';
 import startOfMonth from 'date-fns/startOfMonth';
@@ -285,6 +287,7 @@ export var AdapterDateFns = /*#__PURE__*/_createClass(function AdapterDateFns()
     formats = _ref.formats;
   _classCallCheck(this, AdapterDateFns);
   this.isMUIAdapter = true;
+  this.isTimezoneCompatible = false;
   this.lib = 'date-fns';
   this.locale = void 0;
   this.formats = void 0;
@@ -302,6 +305,15 @@ export var AdapterDateFns = /*#__PURE__*/_createClass(function AdapterDateFns()
     }
     return new Date(value);
   };
+  this.dateWithTimezone = function (value) {
+    return _this.date(value);
+  };
+  this.getTimezone = function () {
+    return 'default';
+  };
+  this.setTimezone = function (value) {
+    return value;
+  };
   this.toJsDate = function (value) {
     return value;
   };
@@ -505,6 +517,9 @@ export var AdapterDateFns = /*#__PURE__*/_createClass(function AdapterDateFns()
   this.getSeconds = function (value) {
     return getSeconds(value);
   };
+  this.getMilliseconds = function (value) {
+    return getMilliseconds(value);
+  };
   this.setYear = function (value, year) {
     return setYear(value, year);
   };
@@ -523,6 +538,9 @@ export var AdapterDateFns = /*#__PURE__*/_createClass(function AdapterDateFns()
   this.setSeconds = function (value, seconds) {
     return setSeconds(value, seconds);
   };
+  this.setMilliseconds = function (value, milliseconds) {
+    return setMilliseconds(value, milliseconds);
+  };
   this.getDaysInMonth = function (value) {
     return getDaysInMonth(value);
   };

package/legacy/AdapterDateFnsJalali/AdapterDateFnsJalali.js

@@ -27,6 +27,7 @@ import dateFnsFormat from 'date-fns-jalali/format';
 import formatISO from 'date-fns-jalali/formatISO';
 import getHours from 'date-fns-jalali/getHours';
 import getSeconds from 'date-fns-jalali/getSeconds';
+import getMilliseconds from 'date-fns-jalali/getMilliseconds';
 import getWeek from 'date-fns-jalali/getWeek';
 import getYear from 'date-fns-jalali/getYear';
 import getMonth from 'date-fns-jalali/getMonth';
@@ -48,6 +49,7 @@ import setHours from 'date-fns-jalali/setHours';
 import setMinutes from 'date-fns-jalali/setMinutes';
 import setMonth from 'date-fns-jalali/setMonth';
 import setSeconds from 'date-fns-jalali/setSeconds';
+import setMilliseconds from 'date-fns-jalali/setMilliseconds';
 import setYear from 'date-fns-jalali/setYear';
 import startOfDay from 'date-fns-jalali/startOfDay';
 import startOfMonth from 'date-fns-jalali/startOfMonth';
@@ -297,6 +299,7 @@ export var AdapterDateFnsJalali = /*#__PURE__*/_createClass(function AdapterDate
     formats = _ref.formats;
   _classCallCheck(this, AdapterDateFnsJalali);
   this.isMUIAdapter = true;
+  this.isTimezoneCompatible = false;
   this.lib = 'date-fns-jalali';
   this.locale = void 0;
   this.formats = void 0;
@@ -314,6 +317,15 @@ export var AdapterDateFnsJalali = /*#__PURE__*/_createClass(function AdapterDate
     }
     return new Date(value);
   };
+  this.dateWithTimezone = function (value) {
+    return _this.date(value);
+  };
+  this.getTimezone = function () {
+    return 'default';
+  };
+  this.setTimezone = function (value) {
+    return value;
+  };
   this.toJsDate = function (value) {
     return value;
   };
@@ -519,6 +531,9 @@ export var AdapterDateFnsJalali = /*#__PURE__*/_createClass(function AdapterDate
   this.getSeconds = function (value) {
     return getSeconds(value);
   };
+  this.getMilliseconds = function (value) {
+    return getMilliseconds(value);
+  };
   this.setYear = function (value, year) {
     return setYear(value, year);
   };
@@ -537,6 +552,9 @@ export var AdapterDateFnsJalali = /*#__PURE__*/_createClass(function AdapterDate
   this.setSeconds = function (value, seconds) {
     return setSeconds(value, seconds);
   };
+  this.setMilliseconds = function (value, milliseconds) {
+    return setMilliseconds(value, milliseconds);
+  };
   this.getDaysInMonth = function (value) {
     return getDaysInMonth(value);
   };