@mui/x-date-pickers 8.5.3 → 8.6.0

package/TimeClock/TimeClock.js

@@ -15,7 +15,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _styles = require("@mui/material/styles");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _useId = _interopRequireDefault(require("@mui/utils/useId"));
-var _usePickerTranslations = require("../hooks/usePickerTranslations");
+var _hooks = require("../hooks");
 var _useUtils = require("../internals/hooks/useUtils");
 var _PickersArrowSwitcher = require("../internals/components/PickersArrowSwitcher");
 var _timeUtils = require("../internals/utils/time-utils");
@@ -67,13 +67,13 @@ const TIME_CLOCK_DEFAULT_VIEWS = ['hours', 'minutes'];
  * - [TimeClock API](https://mui.com/x/api/date-pickers/time-clock/)
  */
 const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function TimeClock(inProps, ref) {
-  const utils = (0, _useUtils.useUtils)();
+  const adapter = (0, _hooks.usePickerAdapter)();
   const props = (0, _styles.useThemeProps)({
     props: inProps,
     name: 'MuiTimeClock'
   });
   const {
-      ampm = utils.is12HourCycleInCurrentLocale(),
+      ampm = adapter.is12HourCycleInCurrentLocale(),
       ampmInClock = false,
       autoFocus,
       slots,
@@ -119,11 +119,11 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
   const valueOrReferenceDate = (0, _useClockReferenceDate.useClockReferenceDate)({
     value,
     referenceDate: referenceDateProp,
-    utils,
+    adapter,
     props,
     timezone
   });
-  const translations = (0, _usePickerTranslations.usePickerTranslations)();
+  const translations = (0, _hooks.usePickerTranslations)();
   const now = (0, _useUtils.useNow)(timezone);
   const selectedId = (0, _useId.default)();
   const {
@@ -149,7 +149,7 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
     handleMeridiemChange
   } = (0, _dateHelpersHooks.useMeridiemMode)(valueOrReferenceDate, ampm, setValueAndGoToNextView);
   const isTimeDisabled = React.useCallback((rawValue, viewType) => {
-    const isAfter = (0, _timeUtils.createIsAfterIgnoreDatePart)(disableIgnoringDatePartForTimeValidation, utils);
+    const isAfter = (0, _timeUtils.createIsAfterIgnoreDatePart)(disableIgnoringDatePartForTimeValidation, adapter);
     const shouldCheckPastEnd = viewType === 'hours' || viewType === 'minutes' && views.includes('seconds');
     const containsValidTime = ({
       start,
@@ -176,11 +176,11 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
       if (shouldDisableTime) {
         switch (viewType) {
           case 'hours':
-            return !shouldDisableTime(utils.setHours(valueOrReferenceDate, timeValue), 'hours');
+            return !shouldDisableTime(adapter.setHours(valueOrReferenceDate, timeValue), 'hours');
           case 'minutes':
-            return !shouldDisableTime(utils.setMinutes(valueOrReferenceDate, timeValue), 'minutes');
+            return !shouldDisableTime(adapter.setMinutes(valueOrReferenceDate, timeValue), 'minutes');
           case 'seconds':
-            return !shouldDisableTime(utils.setSeconds(valueOrReferenceDate, timeValue), 'seconds');
+            return !shouldDisableTime(adapter.setSeconds(valueOrReferenceDate, timeValue), 'seconds');
           default:
             return false;
         }
@@ -191,12 +191,12 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
       case 'hours':
         {
           const valueWithMeridiem = (0, _timeUtils.convertValueToMeridiem)(rawValue, meridiemMode, ampm);
-          const dateWithNewHours = utils.setHours(valueOrReferenceDate, valueWithMeridiem);
-          if (utils.getHours(dateWithNewHours) !== valueWithMeridiem) {
+          const dateWithNewHours = adapter.setHours(valueOrReferenceDate, valueWithMeridiem);
+          if (adapter.getHours(dateWithNewHours) !== valueWithMeridiem) {
             return true;
           }
-          const start = utils.setSeconds(utils.setMinutes(dateWithNewHours, 0), 0);
-          const end = utils.setSeconds(utils.setMinutes(dateWithNewHours, 59), 59);
+          const start = adapter.setSeconds(adapter.setMinutes(dateWithNewHours, 0), 0);
+          const end = adapter.setSeconds(adapter.setMinutes(dateWithNewHours, 59), 59);
           return !containsValidTime({
             start,
             end
@@ -204,9 +204,9 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
         }
       case 'minutes':
         {
-          const dateWithNewMinutes = utils.setMinutes(valueOrReferenceDate, rawValue);
-          const start = utils.setSeconds(dateWithNewMinutes, 0);
-          const end = utils.setSeconds(dateWithNewMinutes, 59);
+          const dateWithNewMinutes = adapter.setMinutes(valueOrReferenceDate, rawValue);
+          const start = adapter.setSeconds(dateWithNewMinutes, 0);
+          const end = adapter.setSeconds(dateWithNewMinutes, 59);
           return !containsValidTime({
             start,
             end
@@ -214,7 +214,7 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
         }
       case 'seconds':
         {
-          const dateWithNewSeconds = utils.setSeconds(valueOrReferenceDate, rawValue);
+          const dateWithNewSeconds = adapter.setSeconds(valueOrReferenceDate, rawValue);
           const start = dateWithNewSeconds;
           const end = dateWithNewSeconds;
           return !containsValidTime({
@@ -225,16 +225,16 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
       default:
         throw new Error('not supported');
     }
-  }, [ampm, valueOrReferenceDate, disableIgnoringDatePartForTimeValidation, maxTime, meridiemMode, minTime, minutesStep, shouldDisableTime, utils, disableFuture, disablePast, now, views]);
+  }, [ampm, valueOrReferenceDate, disableIgnoringDatePartForTimeValidation, maxTime, meridiemMode, minTime, minutesStep, shouldDisableTime, adapter, disableFuture, disablePast, now, views]);
   const viewProps = React.useMemo(() => {
     switch (view) {
       case 'hours':
         {
           const handleHoursChange = (hourValue, isFinish) => {
             const valueWithMeridiem = (0, _timeUtils.convertValueToMeridiem)(hourValue, meridiemMode, ampm);
-            setValueAndGoToNextView(utils.setHours(valueOrReferenceDate, valueWithMeridiem), isFinish, 'hours');
+            setValueAndGoToNextView(adapter.setHours(valueOrReferenceDate, valueWithMeridiem), isFinish, 'hours');
           };
-          const viewValue = utils.getHours(valueOrReferenceDate);
+          const viewValue = adapter.getHours(valueOrReferenceDate);
           let viewRange;
           if (ampm) {
             if (viewValue > 12) {
@@ -250,7 +250,7 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
             viewValue,
             children: (0, _ClockNumbers.getHourNumbers)({
               value,
-              utils,
+              adapter,
               ampm,
               onChange: handleHoursChange,
               getClockNumberText: translations.hoursClockNumberText,
@@ -262,15 +262,15 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
         }
       case 'minutes':
         {
-          const minutesValue = utils.getMinutes(valueOrReferenceDate);
+          const minutesValue = adapter.getMinutes(valueOrReferenceDate);
           const handleMinutesChange = (minuteValue, isFinish) => {
-            setValueAndGoToNextView(utils.setMinutes(valueOrReferenceDate, minuteValue), isFinish, 'minutes');
+            setValueAndGoToNextView(adapter.setMinutes(valueOrReferenceDate, minuteValue), isFinish, 'minutes');
           };
           return {
             viewValue: minutesValue,
             onChange: handleMinutesChange,
             children: (0, _ClockNumbers.getMinutesNumbers)({
-              utils,
+              adapter,
               value: minutesValue,
               onChange: handleMinutesChange,
               getClockNumberText: translations.minutesClockNumberText,
@@ -282,15 +282,15 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
         }
       case 'seconds':
         {
-          const secondsValue = utils.getSeconds(valueOrReferenceDate);
+          const secondsValue = adapter.getSeconds(valueOrReferenceDate);
           const handleSecondsChange = (secondValue, isFinish) => {
-            setValueAndGoToNextView(utils.setSeconds(valueOrReferenceDate, secondValue), isFinish, 'seconds');
+            setValueAndGoToNextView(adapter.setSeconds(valueOrReferenceDate, secondValue), isFinish, 'seconds');
           };
           return {
             viewValue: secondsValue,
             onChange: handleSecondsChange,
             children: (0, _ClockNumbers.getMinutesNumbers)({
-              utils,
+              adapter,
               value: secondsValue,
               onChange: handleSecondsChange,
               getClockNumberText: translations.secondsClockNumberText,
@@ -303,7 +303,7 @@ const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function Tim
       default:
         throw new Error('You must provide the type for ClockView');
     }
-  }, [view, utils, value, ampm, translations.hoursClockNumberText, translations.minutesClockNumberText, translations.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, isTimeDisabled, selectedId, disabled]);
+  }, [view, adapter, value, ampm, translations.hoursClockNumberText, translations.minutesClockNumberText, translations.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, isTimeDisabled, selectedId, disabled]);
   const classes = useUtilityClasses(classesProp);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(TimeClockRoot, (0, _extends2.default)({
     ref: ref,
@@ -345,7 +345,7 @@ process.env.NODE_ENV !== "production" ? TimeClock.propTypes = {
   // ----------------------------------------------------------------------
   /**
    * 12h/24h view for hour selection clock.
-   * @default utils.is12HourCycleInCurrentLocale()
+   * @default adapter.is12HourCycleInCurrentLocale()
    */
   ampm: _propTypes.default.bool,
   /**

package/TimeField/TimeField.js

@@ -58,7 +58,7 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
   // ----------------------------------------------------------------------
   /**
    * 12h/24h view for hour selection clock.
-   * @default utils.is12HourCycleInCurrentLocale()
+   * @default adapter.is12HourCycleInCurrentLocale()
    */
   ampm: _propTypes.default.bool,
   /**

package/TimePicker/TimePicker.js

@@ -60,7 +60,7 @@ process.env.NODE_ENV !== "production" ? TimePicker.propTypes = {
   // ----------------------------------------------------------------------
   /**
    * 12h/24h view for hour selection clock.
-   * @default utils.is12HourCycleInCurrentLocale()
+   * @default adapter.is12HourCycleInCurrentLocale()
    */
   ampm: _propTypes.default.bool,
   /**

package/TimePicker/TimePickerToolbar.js

@@ -18,12 +18,10 @@ var _PickersToolbarText = require("../internals/components/PickersToolbarText");
 var _PickersToolbarButton = require("../internals/components/PickersToolbarButton");
 var _PickersToolbar = require("../internals/components/PickersToolbar");
 var _utils = require("../internals/utils/utils");
-var _usePickerTranslations = require("../hooks/usePickerTranslations");
-var _useUtils = require("../internals/hooks/useUtils");
+var _hooks = require("../hooks");
 var _dateHelpersHooks = require("../internals/hooks/date-helpers-hooks");
 var _timePickerToolbarClasses = require("./timePickerToolbarClasses");
 var _dateUtils = require("../internals/utils/date-utils");
-var _hooks = require("../hooks");
 var _useToolbarOwnerState = require("../internals/hooks/useToolbarOwnerState");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["ampm", "ampmInClock", "className", "classes"];
@@ -131,8 +129,8 @@ function TimePickerToolbar(inProps) {
       classes: classesProp
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  const utils = (0, _useUtils.useUtils)();
-  const translations = (0, _usePickerTranslations.usePickerTranslations)();
+  const adapter = (0, _hooks.usePickerAdapter)();
+  const translations = (0, _hooks.usePickerTranslations)();
   const ownerState = (0, _useToolbarOwnerState.useToolbarOwnerState)();
   const classes = useUtilityClasses(classesProp, ownerState);
   const {
@@ -152,10 +150,10 @@ function TimePickerToolbar(inProps) {
     changeImportance: 'set'
   }));
   const formatSection = format => {
-    if (!utils.isValid(value)) {
+    if (!adapter.isValid(value)) {
       return '--';
     }
-    return utils.format(value, format);
+    return adapter.format(value, format);
   };
   const separator = /*#__PURE__*/(0, _jsxRuntime.jsx)(TimePickerToolbarSeparator, {
     tabIndex: -1,
@@ -199,7 +197,7 @@ function TimePickerToolbar(inProps) {
         variant: "subtitle2",
         selected: meridiemMode === 'am',
         typographyClassName: classes.ampmLabel,
-        value: (0, _dateUtils.formatMeridiem)(utils, 'am'),
+        value: (0, _dateUtils.formatMeridiem)(adapter, 'am'),
         onClick: readOnly ? undefined : () => handleMeridiemChange('am'),
         disabled: disabled
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_PickersToolbarButton.PickersToolbarButton, {
@@ -207,7 +205,7 @@ function TimePickerToolbar(inProps) {
         variant: "subtitle2",
         selected: meridiemMode === 'pm',
         typographyClassName: classes.ampmLabel,
-        value: (0, _dateUtils.formatMeridiem)(utils, 'pm'),
+        value: (0, _dateUtils.formatMeridiem)(adapter, 'pm'),
         onClick: readOnly ? undefined : () => handleMeridiemChange('pm'),
         disabled: disabled
       })]

package/TimePicker/shared.js

@@ -9,18 +9,18 @@ exports.useTimePickerDefaultizedProps = useTimePickerDefaultizedProps;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _styles = require("@mui/material/styles");
-var _useUtils = require("../internals/hooks/useUtils");
 var _TimePickerToolbar = require("./TimePickerToolbar");
 var _views = require("../internals/utils/views");
 var _useTimeManager = require("../managers/useTimeManager");
+var _usePickerAdapter = require("../hooks/usePickerAdapter");
 function useTimePickerDefaultizedProps(props, name) {
-  const utils = (0, _useUtils.useUtils)();
+  const adapter = (0, _usePickerAdapter.usePickerAdapter)();
   const themeProps = (0, _styles.useThemeProps)({
     props,
     name
   });
   const validationProps = (0, _useTimeManager.useApplyDefaultValuesToTimeValidationProps)(themeProps);
-  const ampm = themeProps.ampm ?? utils.is12HourCycleInCurrentLocale();
+  const ampm = themeProps.ampm ?? adapter.is12HourCycleInCurrentLocale();
   const localeText = React.useMemo(() => {
     if (themeProps.localeText?.toolbarTitle == null) {
       return themeProps.localeText;

package/YearCalendar/YearCalendar.js

@@ -28,6 +28,7 @@ var _useControlledValue = require("../internals/hooks/useControlledValue");
 var _dimensions = require("../internals/constants/dimensions");
 var _usePickerPrivateContext = require("../internals/hooks/usePickerPrivateContext");
 var _useDateManager = require("../managers/useDateManager");
+var _usePickerAdapter = require("../hooks/usePickerAdapter");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["autoFocus", "className", "classes", "value", "defaultValue", "referenceDate", "disabled", "disableFuture", "disablePast", "maxDate", "minDate", "onChange", "readOnly", "shouldDisableYear", "disableHighlightToday", "onYearFocus", "hasFocus", "onFocusedViewChange", "yearsOrder", "yearsPerRow", "timezone", "gridLabelId", "slots", "slotProps"];
 const useUtilityClasses = classes => {
@@ -140,13 +141,13 @@ const YearCalendar = exports.YearCalendar = /*#__PURE__*/React.forwardRef(functi
   });
   const now = (0, _useUtils.useNow)(timezone);
   const isRtl = (0, _RtlProvider.useRtl)();
-  const utils = (0, _useUtils.useUtils)();
+  const adapter = (0, _usePickerAdapter.usePickerAdapter)();
   const {
     ownerState
   } = (0, _usePickerPrivateContext.usePickerPrivateContext)();
   const referenceDate = React.useMemo(() => _valueManagers.singleItemValueManager.getInitialReferenceValue({
     value,
-    utils,
+    adapter,
     props,
     timezone,
     referenceDate: referenceDateProp,
@@ -154,14 +155,14 @@ const YearCalendar = exports.YearCalendar = /*#__PURE__*/React.forwardRef(functi
   }), [] // eslint-disable-line react-hooks/exhaustive-deps
   );
   const classes = useUtilityClasses(classesProp);
-  const todayYear = React.useMemo(() => utils.getYear(now), [utils, now]);
+  const todayYear = React.useMemo(() => adapter.getYear(now), [adapter, now]);
   const selectedYear = React.useMemo(() => {
     if (value != null) {
-      return utils.getYear(value);
+      return adapter.getYear(value);
     }
     return null;
-  }, [value, utils]);
-  const [focusedYear, setFocusedYear] = React.useState(() => selectedYear || utils.getYear(referenceDate));
+  }, [value, adapter]);
+  const [focusedYear, setFocusedYear] = React.useState(() => selectedYear || adapter.getYear(referenceDate));
   const [internalHasFocus, setInternalHasFocus] = (0, _useControlled.default)({
     name: 'YearCalendar',
     state: 'hasFocus',
@@ -175,33 +176,33 @@ const YearCalendar = exports.YearCalendar = /*#__PURE__*/React.forwardRef(functi
     }
   });
   const isYearDisabled = React.useCallback(dateToValidate => {
-    if (disablePast && utils.isBeforeYear(dateToValidate, now)) {
+    if (disablePast && adapter.isBeforeYear(dateToValidate, now)) {
       return true;
     }
-    if (disableFuture && utils.isAfterYear(dateToValidate, now)) {
+    if (disableFuture && adapter.isAfterYear(dateToValidate, now)) {
       return true;
     }
-    if (minDate && utils.isBeforeYear(dateToValidate, minDate)) {
+    if (minDate && adapter.isBeforeYear(dateToValidate, minDate)) {
       return true;
     }
-    if (maxDate && utils.isAfterYear(dateToValidate, maxDate)) {
+    if (maxDate && adapter.isAfterYear(dateToValidate, maxDate)) {
       return true;
     }
     if (!shouldDisableYear) {
       return false;
     }
-    const yearToValidate = utils.startOfYear(dateToValidate);
+    const yearToValidate = adapter.startOfYear(dateToValidate);
     return shouldDisableYear(yearToValidate);
-  }, [disableFuture, disablePast, maxDate, minDate, now, shouldDisableYear, utils]);
+  }, [disableFuture, disablePast, maxDate, minDate, now, shouldDisableYear, adapter]);
   const handleYearSelection = (0, _useEventCallback.default)((event, year) => {
     if (readOnly) {
       return;
     }
-    const newDate = utils.setYear(value ?? referenceDate, year);
+    const newDate = adapter.setYear(value ?? referenceDate, year);
     handleValueChange(newDate);
   });
   const focusYear = (0, _useEventCallback.default)(year => {
-    if (!isYearDisabled(utils.setYear(value ?? referenceDate, year))) {
+    if (!isYearDisabled(adapter.setYear(value ?? referenceDate, year))) {
       setFocusedYear(year);
       changeHasFocus(true);
       onYearFocus?.(year);
@@ -265,7 +266,7 @@ const YearCalendar = exports.YearCalendar = /*#__PURE__*/React.forwardRef(functi
     }
     scrollerRef.current.scrollTop = elementBottom - clientHeight / 2 - offsetHeight / 2;
   }, [autoFocus]);
-  const yearRange = utils.getYearRange([minDate, maxDate]);
+  const yearRange = adapter.getYearRange([minDate, maxDate]);
   if (yearsOrder === 'desc') {
     yearRange.reverse();
   }
@@ -282,7 +283,7 @@ const YearCalendar = exports.YearCalendar = /*#__PURE__*/React.forwardRef(functi
     yearsPerRow: yearsPerRow
   }, other, {
     children: [yearRange.map(year => {
-      const yearNumber = utils.getYear(year);
+      const yearNumber = adapter.getYear(year);
       const isSelected = yearNumber === selectedYear;
       const isDisabled = disabled || isYearDisabled(year);
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_YearCalendarButton.YearCalendarButton, {
@@ -299,8 +300,8 @@ const YearCalendar = exports.YearCalendar = /*#__PURE__*/React.forwardRef(functi
         slots: slots,
         slotProps: slotProps,
         classes: classesProp,
-        children: utils.format(year, 'year')
-      }, utils.format(year, 'year'));
+        children: adapter.format(year, 'year')
+      }, adapter.format(year, 'year'));
     }), Array.from({
       length: fillerAmount
     }, (_, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(YearCalendarButtonFiller, {}, index))]

package/esm/DateCalendar/DateCalendar.js

@@ -12,7 +12,6 @@ import composeClasses from '@mui/utils/composeClasses';
 import useId from '@mui/utils/useId';
 import useEventCallback from '@mui/utils/useEventCallback';
 import { useCalendarState } from "./useCalendarState.js";
-import { useUtils } from "../internals/hooks/useUtils.js";
 import { PickersFadeTransitionGroup } from "./PickersFadeTransitionGroup.js";
 import { DayCalendar } from "./DayCalendar.js";
 import { MonthCalendar } from "../MonthCalendar/index.js";
@@ -28,6 +27,7 @@ import { singleItemValueManager } from "../internals/utils/valueManagers.js";
 import { VIEW_HEIGHT } from "../internals/constants/dimensions.js";
 import { usePickerPrivateContext } from "../internals/hooks/usePickerPrivateContext.js";
 import { useApplyDefaultValuesToDateValidationProps } from "../managers/useDateManager.js";
+import { usePickerAdapter } from "../hooks/usePickerAdapter.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const useUtilityClasses = classes => {
   const slots = {
@@ -77,7 +77,7 @@ const DateCalendarViewTransitionContainer = styled(PickersFadeTransitionGroup, {
  * - [DateCalendar API](https://mui.com/x/api/date-pickers/date-calendar/)
  */
 export const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(inProps, ref) {
-  const utils = useUtils();
+  const adapter = usePickerAdapter();
   const {
     ownerState
   } = usePickerPrivateContext();
@@ -171,10 +171,10 @@ export const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(
     disableFuture,
     timezone,
     getCurrentMonthFromVisibleDate: (visibleDate, prevMonth) => {
-      if (utils.isSameMonth(visibleDate, prevMonth)) {
+      if (adapter.isSameMonth(visibleDate, prevMonth)) {
         return prevMonth;
       }
-      return utils.startOfMonth(visibleDate);
+      return adapter.startOfMonth(visibleDate);
     }
   });
 
@@ -208,13 +208,13 @@ export const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(
     ownerState
   });
   const handleDateMonthChange = useEventCallback(newDate => {
-    const startOfMonth = utils.startOfMonth(newDate);
-    const endOfMonth = utils.endOfMonth(newDate);
+    const startOfMonth = adapter.startOfMonth(newDate);
+    const endOfMonth = adapter.endOfMonth(newDate);
     const closestEnabledDate = isDateDisabled(newDate) ? findClosestEnabledDate({
-      utils,
+      adapter,
       date: newDate,
-      minDate: utils.isBefore(minDate, startOfMonth) ? startOfMonth : minDate,
-      maxDate: utils.isAfter(maxDate, endOfMonth) ? endOfMonth : maxDate,
+      minDate: adapter.isBefore(minDate, startOfMonth) ? startOfMonth : minDate,
+      maxDate: adapter.isAfter(maxDate, endOfMonth) ? endOfMonth : maxDate,
       disablePast,
       disableFuture,
       isDateDisabled,
@@ -235,13 +235,13 @@ export const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(
     }
   });
   const handleDateYearChange = useEventCallback(newDate => {
-    const startOfYear = utils.startOfYear(newDate);
-    const endOfYear = utils.endOfYear(newDate);
+    const startOfYear = adapter.startOfYear(newDate);
+    const endOfYear = adapter.endOfYear(newDate);
     const closestEnabledDate = isDateDisabled(newDate) ? findClosestEnabledDate({
-      utils,
+      adapter,
       date: newDate,
-      minDate: utils.isBefore(minDate, startOfYear) ? startOfYear : minDate,
-      maxDate: utils.isAfter(maxDate, endOfYear) ? endOfYear : maxDate,
+      minDate: adapter.isBefore(minDate, startOfYear) ? startOfYear : minDate,
+      maxDate: adapter.isAfter(maxDate, endOfYear) ? endOfYear : maxDate,
       disablePast,
       disableFuture,
       isDateDisabled,
@@ -264,12 +264,12 @@ export const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(
   const handleSelectedDayChange = useEventCallback(day => {
     if (day) {
       // If there is a date already selected, then we want to keep its time
-      return handleValueChange(mergeDateAndTime(utils, day, value ?? referenceDate), 'finish', view);
+      return handleValueChange(mergeDateAndTime(adapter, day, value ?? referenceDate), 'finish', view);
     }
     return handleValueChange(day, 'finish', view);
   });
   React.useEffect(() => {
-    if (utils.isValid(value)) {
+    if (adapter.isValid(value)) {
       setVisibleDate({
         target: value,
         reason: 'controlled-value-change'