@mui/x-date-pickers 6.0.0 → 6.0.2

package/modern/DateField/DateField.js

@@ -75,7 +75,7 @@ process.env.NODE_ENV !== "production" ? DateField.propTypes = {
    */
   color: PropTypes.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']),
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -259,7 +259,7 @@ process.env.NODE_ENV !== "production" ? DateField.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/DatePicker/DatePicker.js

@@ -54,7 +54,7 @@ process.env.NODE_ENV !== "production" ? DatePicker.propTypes = {
    */
   closeOnSelect: PropTypes.bool,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -296,7 +296,7 @@ process.env.NODE_ENV !== "production" ? DatePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/DateTimeField/DateTimeField.js

@@ -80,7 +80,7 @@ process.env.NODE_ENV !== "production" ? DateTimeField.propTypes = {
    */
   color: PropTypes.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']),
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -307,7 +307,7 @@ process.env.NODE_ENV !== "production" ? DateTimeField.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/DateTimePicker/DateTimePicker.js

@@ -64,7 +64,7 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.propTypes = {
    */
   closeOnSelect: PropTypes.bool,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -349,7 +349,7 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/DesktopDatePicker/DesktopDatePicker.js

@@ -72,7 +72,7 @@ DesktopDatePicker.propTypes = {
    */
   closeOnSelect: PropTypes.bool,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -308,7 +308,7 @@ DesktopDatePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -90,7 +90,7 @@ DesktopDateTimePicker.propTypes = {
    */
   closeOnSelect: PropTypes.bool,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -369,7 +369,7 @@ DesktopDateTimePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/DesktopTimePicker/DesktopTimePicker.js

@@ -82,7 +82,7 @@ DesktopTimePicker.propTypes = {
    */
   closeOnSelect: PropTypes.bool,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -253,7 +253,7 @@ DesktopTimePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/MobileDatePicker/MobileDatePicker.js

@@ -69,7 +69,7 @@ MobileDatePicker.propTypes = {
    */
   closeOnSelect: PropTypes.bool,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -305,7 +305,7 @@ MobileDatePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/MobileDateTimePicker/MobileDateTimePicker.js

@@ -88,7 +88,7 @@ MobileDateTimePicker.propTypes = {
    */
   closeOnSelect: PropTypes.bool,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -367,7 +367,7 @@ MobileDateTimePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/MobileTimePicker/MobileTimePicker.js

@@ -81,7 +81,7 @@ MobileTimePicker.propTypes = {
    */
   closeOnSelect: PropTypes.bool,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -252,7 +252,7 @@ MobileTimePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/PickersLayout/PickersLayout.js

@@ -115,7 +115,7 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
   classes: PropTypes.object,
   className: PropTypes.string,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -149,7 +149,7 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/StaticDatePicker/StaticDatePicker.js

@@ -53,7 +53,7 @@ StaticDatePicker.propTypes = {
    */
   className: PropTypes.string,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -247,7 +247,7 @@ StaticDatePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/StaticDateTimePicker/StaticDateTimePicker.js

@@ -73,7 +73,7 @@ StaticDateTimePicker.propTypes = {
    */
   className: PropTypes.string,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -310,7 +310,7 @@ StaticDateTimePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/StaticTimePicker/StaticTimePicker.js

@@ -65,7 +65,7 @@ StaticTimePicker.propTypes = {
    */
   className: PropTypes.string,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -194,7 +194,7 @@ StaticTimePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/TimeClock/TimeClock.js

@@ -321,7 +321,7 @@ process.env.NODE_ENV !== "production" ? TimeClock.propTypes = {
   classes: PropTypes.object,
   className: PropTypes.string,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -416,7 +416,7 @@ process.env.NODE_ENV !== "production" ? TimeClock.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/TimeField/TimeField.js

@@ -80,7 +80,7 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
    */
   color: PropTypes.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']),
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -270,7 +270,7 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/TimePicker/TimePicker.js

@@ -64,7 +64,7 @@ process.env.NODE_ENV !== "production" ? TimePicker.propTypes = {
    */
   closeOnSelect: PropTypes.bool,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -241,7 +241,7 @@ process.env.NODE_ENV !== "production" ? TimePicker.propTypes = {
    */
   slotProps: PropTypes.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: PropTypes.object,

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers v6.0.0
+ * @mui/x-date-pickers v6.0.2
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/internals/components/PickersArrowSwitcher/PickersArrowSwitcher.js

@@ -94,7 +94,7 @@ export const PickersArrowSwitcher = /*#__PURE__*/React.forwardRef(function Picke
     elementType: PreviousIconButton,
     externalSlotProps: slotProps?.previousIconButton ?? componentsProps?.previousIconButton,
     additionalProps: {
-      size: 'small',
+      size: 'medium',
       title: leftProps.label,
       'aria-label': leftProps.label,
       disabled: leftProps.isDisabled,
@@ -111,7 +111,7 @@ export const PickersArrowSwitcher = /*#__PURE__*/React.forwardRef(function Picke
     elementType: NextIconButton,
     externalSlotProps: slotProps?.nextIconButton ?? componentsProps?.nextIconButton,
     additionalProps: {
-      size: 'small',
+      size: 'medium',
       title: rightProps.label,
       'aria-label': rightProps.label,
       disabled: rightProps.isDisabled,
@@ -128,6 +128,9 @@ export const PickersArrowSwitcher = /*#__PURE__*/React.forwardRef(function Picke
   const _useSlotProps = useSlotProps({
       elementType: LeftArrowIcon,
       externalSlotProps: slotProps?.leftArrowIcon ?? componentsProps?.leftArrowIcon,
+      additionalProps: {
+        fontSize: 'inherit'
+      },
       ownerState: undefined
     }),
     leftArrowIconProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded2);
@@ -136,6 +139,9 @@ export const PickersArrowSwitcher = /*#__PURE__*/React.forwardRef(function Picke
   const _useSlotProps2 = useSlotProps({
       elementType: RightArrowIcon,
       externalSlotProps: slotProps?.rightArrowIcon ?? componentsProps?.rightArrowIcon,
+      additionalProps: {
+        fontSize: 'inherit'
+      },
       ownerState: undefined
     }),
     rightArrowIconProps = _objectWithoutPropertiesLoose(_useSlotProps2, _excluded3);

package/modern/internals/hooks/useDesktopPicker/useDesktopPicker.js

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["ownerState"];
+const _excluded = ["ownerState"],
+  _excluded2 = ["ownerState"];
 import * as React from 'react';
 import { useSlotProps } from '@mui/base/utils';
 import MuiInputAdornment from '@mui/material/InputAdornment';
@@ -62,16 +63,17 @@ export const useDesktopPicker = ({
     wrapperVariant: 'desktop'
   });
   const InputAdornment = slots.inputAdornment ?? MuiInputAdornment;
-  const inputAdornmentProps = useSlotProps({
-    elementType: InputAdornment,
-    externalSlotProps: innerSlotProps?.inputAdornment,
-    additionalProps: {
-      position: 'end'
-    },
-    ownerState: props
-  });
-  const OpenPickerButton = slots.openPickerButton ?? IconButton;
   const _useSlotProps = useSlotProps({
+      elementType: InputAdornment,
+      externalSlotProps: innerSlotProps?.inputAdornment,
+      additionalProps: {
+        position: 'end'
+      },
+      ownerState: props
+    }),
+    inputAdornmentProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded);
+  const OpenPickerButton = slots.openPickerButton ?? IconButton;
+  const _useSlotProps2 = useSlotProps({
       elementType: OpenPickerButton,
       externalSlotProps: innerSlotProps?.openPickerButton,
       additionalProps: {
@@ -82,7 +84,7 @@ export const useDesktopPicker = ({
       },
       ownerState: props
     }),
-    openPickerButtonProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded);
+    openPickerButtonProps = _objectWithoutPropertiesLoose(_useSlotProps2, _excluded2);
   const OpenPickerIcon = slots.openPickerIcon;
   const Field = slots.field;
   const fieldProps = useSlotProps({

package/modern/internals/hooks/useField/useField.js

@@ -10,11 +10,9 @@ import { useUtils } from '../useUtils';
 import { adjustSectionValue, isAndroid, cleanString } from './useField.utils';
 import { useFieldState } from './useFieldState';
 import { useFieldCharacterEditing } from './useFieldCharacterEditing';
+import { getActiveElement } from '../../utils/utils';
 export const useField = params => {
   const utils = useUtils();
-  if (!utils.formatTokenMap) {
-    throw new Error('This adapter is not compatible with the field components');
-  }
   const {
     state,
     selectedSectionIndexes,
@@ -60,6 +58,10 @@ export const useField = params => {
   const handleRef = useForkRef(inputRefProp, inputRef);
   const focusTimeoutRef = React.useRef(undefined);
   const syncSelectionFromDOM = () => {
+    if (readOnly) {
+      setSelectedSections(null);
+      return;
+    }
     const browserStartIndex = inputRef.current.selectionStart ?? 0;
     const nextSectionIndex = browserStartIndex <= state.sections[0].startInInput ? 1 // Special case if browser index is in invisible characters at the beginning.
     : state.sections.findIndex(section => section.startInInput - section.startSeparator.length > browserStartIndex);
@@ -86,7 +88,7 @@ export const useField = params => {
       if (!input || input !== inputRef.current) {
         return;
       }
-      if (selectedSectionIndexes != null) {
+      if (selectedSectionIndexes != null || readOnly) {
         return;
       }
       if (
@@ -257,6 +259,10 @@ export const useField = params => {
   });
   useEnhancedEffect(() => {
     if (selectedSectionIndexes == null) {
+      if (inputRef.current.selectionStart !== 0 || inputRef.current.selectionEnd !== 0) {
+        // Ensure input selection range is in sync with component selection indexes
+        inputRef.current.setSelectionRange(0, 0);
+      }
       return;
     }
     const firstSelectedSection = state.sections[selectedSectionIndexes.startIndex];
@@ -311,7 +317,7 @@ export const useField = params => {
     }
     return 'tel';
   }, [selectedSectionIndexes, state.sections]);
-  const inputHasFocus = inputRef.current && inputRef.current === document.activeElement;
+  const inputHasFocus = inputRef.current && inputRef.current === getActiveElement(document);
   const shouldShowPlaceholder = !inputHasFocus && (!state.value || valueManager.areValuesEqual(utils, state.value, valueManager.emptyValue));
   return _extends({
     placeholder: state.placeholder,

package/modern/internals/hooks/useField/useField.utils.js

@@ -41,19 +41,6 @@ export const getDaysInWeekStr = (utils, format) => {
   }
   return elements.map(weekDay => utils.formatByString(weekDay, format));
 };
-export const cleanLeadingZerosInNumericSectionValue = (utils, format, value) => {
-  const size = utils.formatByString(utils.date(), format).length;
-  let cleanValue = value;
-
-  // We remove the leading zeros
-  cleanValue = Number(cleanValue).toString();
-
-  // We add enough leading zeros to fill the section
-  while (cleanValue.length < size) {
-    cleanValue = `0${cleanValue}`;
-  }
-  return cleanValue;
-};
 export const getLetterEditingOptions = (utils, sectionType, format) => {
   switch (sectionType) {
     case 'month':
@@ -75,42 +62,70 @@ export const getLetterEditingOptions = (utils, sectionType, format) => {
       }
   }
 };
+export const cleanDigitSectionValue = (utils, value, sectionType, format, hasLeadingZeros, sectionBoundaries) => {
+  const hasLetter = () => {
+    const startOfYear = utils.startOfYear(utils.date());
+    const startOfYearStr = utils.formatByString(startOfYear, format);
+    return Number.isNaN(Number(startOfYearStr));
+  };
+  if (process.env.NODE_ENV !== 'production') {
+    if (sectionType !== 'day' && hasLetter()) {
+      throw new Error([`MUI: The token "${format}" is a digit format with letter in it.'
+             This type of format is only supported for 'day' sections`].join('\n'));
+    }
+  }
+  if (sectionType === 'day' && hasLetter()) {
+    const date = utils.setDate(sectionBoundaries.longestMonth, value);
+    return utils.formatByString(date, format);
+  }
+
+  // queryValue without leading `0` (`01` => `1`)
+  const valueStr = value.toString();
+  if (hasLeadingZeros) {
+    const size = utils.formatByString(utils.date(), format).length;
+    let cleanValueStr = valueStr;
+
+    // Remove the leading zeros
+    cleanValueStr = Number(cleanValueStr).toString();
+
+    // Add enough leading zeros to fill the section
+    while (cleanValueStr.length < size) {
+      cleanValueStr = `0${cleanValueStr}`;
+    }
+    return cleanValueStr;
+  }
+  return valueStr;
+};
 export const adjustSectionValue = (utils, section, keyCode, sectionsValueBoundaries, activeDate) => {
   const delta = getDeltaFromKeyCode(keyCode);
   const isStart = keyCode === 'Home';
   const isEnd = keyCode === 'End';
   const shouldSetAbsolute = section.value === '' || isStart || isEnd;
-  const cleanDigitSectionValue = value => {
-    const valueStr = value.toString();
-    if (section.hasLeadingZeros) {
-      return cleanLeadingZerosInNumericSectionValue(utils, section.format, valueStr);
-    }
-    return valueStr;
-  };
   const adjustDigitSection = () => {
     const sectionBoundaries = sectionsValueBoundaries[section.type]({
       currentDate: activeDate,
       format: section.format,
       contentType: section.contentType
     });
+    const getCleanValue = value => cleanDigitSectionValue(utils, value, section.type, section.format, section.hasLeadingZeros, sectionBoundaries);
     if (shouldSetAbsolute) {
       if (section.type === 'year' && !isEnd && !isStart) {
         return utils.formatByString(utils.date(), section.format);
       }
       if (delta > 0 || isStart) {
-        return cleanDigitSectionValue(sectionBoundaries.minimum);
+        return getCleanValue(sectionBoundaries.minimum);
       }
-      return cleanDigitSectionValue(sectionBoundaries.maximum);
+      return getCleanValue(sectionBoundaries.maximum);
     }
-    const currentSectionValue = Number(section.value);
+    const currentSectionValue = parseInt(section.value, 10);
     const newSectionValueNumber = currentSectionValue + delta;
     if (newSectionValueNumber > sectionBoundaries.maximum) {
-      return cleanDigitSectionValue(sectionBoundaries.minimum);
+      return getCleanValue(sectionBoundaries.minimum);
     }
     if (newSectionValueNumber < sectionBoundaries.minimum) {
-      return cleanDigitSectionValue(sectionBoundaries.maximum);
+      return getCleanValue(sectionBoundaries.maximum);
     }
-    return cleanDigitSectionValue(newSectionValueNumber);
+    return getCleanValue(newSectionValueNumber);
   };
   const adjustLetterSection = () => {
     const options = getLetterEditingOptions(utils, section.type, section.format);
@@ -233,7 +248,7 @@ export const changeSectionValueFormat = (utils, valueStr, currentFormat, newForm
   return utils.formatByString(utils.parse(valueStr, currentFormat), newFormat);
 };
 const isFourDigitYearFormat = (utils, format) => utils.formatByString(utils.date(), format).length === 4;
-export const doesSectionHaveTrailingZeros = (utils, contentType, sectionType, format) => {
+export const doesSectionHaveLeadingZeros = (utils, contentType, sectionType, format) => {
   if (contentType !== 'digit') {
     return false;
   }
@@ -307,13 +322,13 @@ export const splitFormatIntoSections = (utils, localeText, format, date) => {
       return expandedToken;
     }
     const sectionConfig = getDateSectionConfigFromFormatToken(utils, token);
-    const sectionValue = date == null ? '' : utils.formatByString(date, token);
-    const hasTrailingZeroes = doesSectionHaveTrailingZeros(utils, sectionConfig.contentType, sectionConfig.type, token);
+    const sectionValue = date == null || !utils.isValid(date) ? '' : utils.formatByString(date, token);
+    const hasLeadingZeros = doesSectionHaveLeadingZeros(utils, sectionConfig.contentType, sectionConfig.type, token);
     sections.push(_extends({}, sectionConfig, {
       format: token,
       value: sectionValue,
       placeholder: getSectionPlaceholder(utils, localeText, sectionConfig, token),
-      hasLeadingZeros: hasTrailingZeroes,
+      hasLeadingZeros,
       startSeparator: sections.length === 0 ? startSeparator : '',
       endSeparator: '',
       modified: false
@@ -406,10 +421,22 @@ export const createDateStrForInputFromSections = sections => {
 export const getSectionsBoundaries = utils => {
   const today = utils.date();
   const endOfYear = utils.endOfYear(today);
-  const maxDaysInMonth = utils.getMonthArray(today).reduce((acc, month) => {
+  const {
+    maxDaysInMonth,
+    longestMonth
+  } = utils.getMonthArray(today).reduce((acc, month) => {
     const daysInMonth = utils.getDaysInMonth(month);
-    return Math.max(acc, daysInMonth);
-  }, 0);
+    if (daysInMonth > acc.maxDaysInMonth) {
+      return {
+        maxDaysInMonth: daysInMonth,
+        longestMonth: month
+      };
+    }
+    return acc;
+  }, {
+    maxDaysInMonth: 0,
+    longestMonth: null
+  });
   return {
     year: ({
       format
@@ -426,7 +453,8 @@ export const getSectionsBoundaries = utils => {
       currentDate
     }) => ({
       minimum: 1,
-      maximum: currentDate != null && utils.isValid(currentDate) ? utils.getDaysInMonth(currentDate) : maxDaysInMonth
+      maximum: currentDate != null && utils.isValid(currentDate) ? utils.getDaysInMonth(currentDate) : maxDaysInMonth,
+      longestMonth: longestMonth
     }),
     weekDay: ({
       format,
@@ -567,7 +595,7 @@ export const clampDaySection = (utils, sections, sectionsValueBoundaries) => {
       contentType: section.contentType
     });
     return _extends({}, section, {
-      value: section.hasLeadingZeros ? cleanLeadingZerosInNumericSectionValue(utils, section.format, dayBoundaries.minimum.toString()) : dayBoundaries.minimum.toString()
+      value: cleanDigitSectionValue(utils, dayBoundaries.minimum, section.type, section.format, section.hasLeadingZeros, dayBoundaries)
     });
   });
   const startOfMonth = getDateFromDateSections(utils, sectionsForStartOfMonth);