@mui/x-date-pickers-pro 8.5.3 → 8.7.0

package/esm/TimeRangePicker/TimeRangePicker.js

@@ -53,7 +53,7 @@ process.env.NODE_ENV !== "production" ? TimeRangePicker.propTypes = {
   // ----------------------------------------------------------------------
   /**
    * 12h/24h view for hour selection clock.
-   * @default utils.is12HourCycleInCurrentLocale()
+   * @default adapter.is12HourCycleInCurrentLocale()
    */
   ampm: PropTypes.bool,
   /**
@@ -243,7 +243,7 @@ process.env.NODE_ENV !== "production" ? TimeRangePicker.propTypes = {
    * The date used to generate the new value when both `value` and `defaultValue` are empty.
    * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`.
    */
-  referenceDate: PropTypes.object,
+  referenceDate: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.object), PropTypes.object]),
   /**
    * The currently selected sections.
    * This prop accepts four formats:

package/esm/TimeRangePicker/TimeRangePickerTimeWrapper.js

@@ -1,22 +1,23 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["viewRenderer", "value", "onChange", "defaultValue", "onViewChange", "views", "className"];
-import { useUtils } from '@mui/x-date-pickers/internals';
+const _excluded = ["viewRenderer", "value", "onChange", "defaultValue", "onViewChange", "views", "className", "referenceDate"];
+import { usePickerAdapter } from '@mui/x-date-pickers/hooks';
 import { isRangeValid } from "../internals/utils/date-utils.js";
-import { calculateRangeChange } from "../internals/utils/date-range-manager.js";
+import { calculateRangeChange, resolveReferenceDate } from "../internals/utils/date-range-manager.js";
 import { usePickerRangePositionContext } from "../hooks/index.js";
 /**
  * @ignore - internal component.
  */
 function TimeRangePickerTimeWrapper(props) {
-  const utils = useUtils();
+  const adapter = usePickerAdapter();
   const {
       viewRenderer,
       value,
       onChange,
       defaultValue,
       onViewChange,
-      views
+      views,
+      referenceDate: referenceDateProp
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const {
@@ -27,6 +28,7 @@ function TimeRangePickerTimeWrapper(props) {
   }
   const currentValue = (rangePosition === 'start' ? value?.[0] : value?.[1]) ?? null;
   const currentDefaultValue = (rangePosition === 'start' ? defaultValue?.[0] : defaultValue?.[1]) ?? null;
+  const referenceDate = resolveReferenceDate(referenceDateProp, rangePosition);
   const handleOnChange = (newDate, selectionState, selectedView) => {
     if (!onChange || !value) {
       return;
@@ -35,14 +37,15 @@ function TimeRangePickerTimeWrapper(props) {
       newRange
     } = calculateRangeChange({
       newDate,
-      utils,
+      adapter,
       range: value,
       rangePosition
     });
-    const isFullRangeSelected = rangePosition === 'end' && isRangeValid(utils, newRange);
+    const isFullRangeSelected = rangePosition === 'end' && isRangeValid(adapter, newRange);
     onChange(newRange, isFullRangeSelected ? 'finish' : 'partial', selectedView);
   };
   return viewRenderer(_extends({}, other, {
+    referenceDate,
     views,
     onViewChange,
     value: currentValue,

package/esm/TimeRangePicker/TimeRangePickerToolbar.js

@@ -8,8 +8,8 @@ import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { styled, useThemeProps } from '@mui/material/styles';
 import composeClasses from '@mui/utils/composeClasses';
-import { PickersToolbar, PickersToolbarButton, useUtils, PickersToolbarText, getMeridiem, formatMeridiem, pickersToolbarClasses, pickersToolbarTextClasses, MULTI_SECTION_CLOCK_SECTION_WIDTH, useToolbarOwnerState } from '@mui/x-date-pickers/internals';
-import { usePickerContext, usePickerTranslations } from '@mui/x-date-pickers/hooks';
+import { PickersToolbar, PickersToolbarButton, PickersToolbarText, getMeridiem, formatMeridiem, pickersToolbarClasses, pickersToolbarTextClasses, MULTI_SECTION_CLOCK_SECTION_WIDTH, useToolbarOwnerState } from '@mui/x-date-pickers/internals';
+import { usePickerAdapter, usePickerContext, usePickerTranslations } from '@mui/x-date-pickers/hooks';
 import { getTimeRangePickerToolbarUtilityClass } from "./timeRangePickerToolbarClasses.js";
 import { usePickerRangePositionContext } from "../hooks/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -92,13 +92,13 @@ function TimeRangePickerToolbarTimeElement(props) {
     separatorClasses,
     toolbarPlaceholder
   } = props;
-  const utils = useUtils();
+  const adapter = usePickerAdapter();
   const {
     variant,
     views
   } = usePickerContext();
-  const formatHours = time => ampm ? utils.format(time, 'hours12h') : utils.format(time, 'hours24h');
-  const meridiemMode = getMeridiem(value, utils);
+  const formatHours = time => ampm ? adapter.format(time, 'hours12h') : adapter.format(time, 'hours24h');
+  const meridiemMode = getMeridiem(value, adapter);
   const sectionWidth = variant === 'desktop' ? MULTI_SECTION_CLOCK_SECTION_WIDTH : '100%';
   return /*#__PURE__*/_jsxs(TimeRangePickerToolbarTimeContainer, {
     children: [views.includes('hours') && /*#__PURE__*/_jsxs(React.Fragment, {
@@ -107,7 +107,7 @@ function TimeRangePickerToolbarTimeElement(props) {
         width: sectionWidth,
         onClick: () => onViewChange('hours'),
         selected: view === 'hours',
-        value: utils.isValid(value) ? formatHours(value) : toolbarPlaceholder
+        value: adapter.isValid(value) ? formatHours(value) : toolbarPlaceholder
       }), /*#__PURE__*/_jsx(TimeRangePickerToolbarSeparator, {
         variant: "h5",
         value: ":",
@@ -117,7 +117,7 @@ function TimeRangePickerToolbarTimeElement(props) {
         width: sectionWidth,
         onClick: () => onViewChange('minutes'),
         selected: view === 'minutes' || !views.includes('minutes') && view === 'hours',
-        value: utils.isValid(value) ? utils.format(value, 'minutes') : toolbarPlaceholder,
+        value: adapter.isValid(value) ? adapter.format(value, 'minutes') : toolbarPlaceholder,
         disabled: !views.includes('minutes')
       })]
     }), views.includes('seconds') && /*#__PURE__*/_jsxs(React.Fragment, {
@@ -130,13 +130,13 @@ function TimeRangePickerToolbarTimeElement(props) {
         width: sectionWidth,
         onClick: () => onViewChange('seconds'),
         selected: view === 'seconds',
-        value: value ? utils.format(value, 'seconds') : toolbarPlaceholder
+        value: value ? adapter.format(value, 'seconds') : toolbarPlaceholder
       })]
     }), ampm && /*#__PURE__*/_jsx(PickersToolbarButton, {
       variant: "h5",
       onClick: () => onViewChange('meridiem'),
       selected: view === 'meridiem',
-      value: value && meridiemMode ? formatMeridiem(utils, meridiemMode) : toolbarPlaceholder,
+      value: value && meridiemMode ? formatMeridiem(adapter, meridiemMode) : toolbarPlaceholder,
       width: sectionWidth
     })]
   });

package/esm/TimeRangePicker/shared.js

@@ -1,17 +1,18 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { useThemeProps } from '@mui/material/styles';
-import { useUtils, applyDefaultViewProps, resolveTimeViewsResponse, useApplyDefaultValuesToTimeValidationProps } from '@mui/x-date-pickers/internals';
+import { applyDefaultViewProps, resolveTimeViewsResponse, useApplyDefaultValuesToTimeValidationProps } from '@mui/x-date-pickers/internals';
+import { usePickerAdapter } from '@mui/x-date-pickers/hooks';
 import { TimeRangePickerToolbar } from "./TimeRangePickerToolbar.js";
 import { TimeRangePickerTabs } from "./TimeRangePickerTabs.js";
 export function useTimeRangePickerDefaultizedProps(props, name) {
-  const utils = useUtils();
+  const adapter = usePickerAdapter();
   const themeProps = useThemeProps({
     props,
     name
   });
   const validationProps = useApplyDefaultValuesToTimeValidationProps(themeProps);
-  const ampm = themeProps.ampm ?? utils.is12HourCycleInCurrentLocale();
+  const ampm = themeProps.ampm ?? adapter.is12HourCycleInCurrentLocale();
   const {
     openTo,
     views: defaultViews

package/esm/hooks/useMultiInputRangeField/useMultiInputRangeFieldSelectedSections.js

@@ -1,3 +1,5 @@
+'use client';
+
 import * as React from 'react';
 import useForkRef from '@mui/utils/useForkRef';
 import useEventCallback from '@mui/utils/useEventCallback';

package/esm/hooks/useMultiInputRangeField/useTextFieldProps.js

@@ -1,3 +1,5 @@
+'use client';
+
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
 const _excluded = ["clearable", "onClear", "openPickerAriaLabel"];

package/esm/index.js

@@ -1,10 +1,11 @@
 /**
- * @mui/x-date-pickers-pro v8.5.3
+ * @mui/x-date-pickers-pro v8.7.0
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the
  * LICENSE file in the root directory of this source tree.
  */
+// eslint-disable-next-line no-restricted-imports
 export * from '@mui/x-date-pickers';
 export * from "./DateRangePickerDay/index.js";
 export * from "./DateRangePickerDay2/index.js";

package/esm/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js

@@ -19,7 +19,7 @@ export const useDesktopRangePicker = _ref => {
       steps
     } = _ref,
     pickerParams = _objectWithoutPropertiesLoose(_ref, _excluded);
-  useLicenseVerifier('x-date-pickers-pro', "MTc1MDI4NDAwMDAwMA==");
+  useLicenseVerifier('x-date-pickers-pro', "MTc1MTU4MDAwMDAwMA==");
   const {
     slots,
     slotProps,

package/esm/internals/hooks/useMobileRangePicker/useMobileRangePicker.js

@@ -21,7 +21,7 @@ export const useMobileRangePicker = _ref => {
       steps
     } = _ref,
     pickerParams = _objectWithoutPropertiesLoose(_ref, _excluded);
-  useLicenseVerifier('x-date-pickers-pro', "MTc1MDI4NDAwMDAwMA==");
+  useLicenseVerifier('x-date-pickers-pro', "MTc1MTU4MDAwMDAwMA==");
   const {
     slots,
     slotProps: innerSlotProps,

package/esm/internals/utils/date-range-manager.d.ts

@@ -2,7 +2,7 @@ import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models';
 import { PickerRangeValue } from '@mui/x-date-pickers/internals';
 import { RangePosition } from "../../models/index.js";
 interface CalculateRangeChangeOptions {
-  utils: MuiPickersAdapter;
+  adapter: MuiPickersAdapter;
   range: PickerRangeValue;
   newDate: PickerValidDate | null;
   rangePosition: RangePosition;
@@ -13,14 +13,15 @@ interface CalculateRangeChangeOptions {
    */
   allowRangeFlip?: boolean;
   shouldMergeDateAndTime?: boolean;
-  referenceDate?: PickerValidDate;
+  referenceDate?: PickerValidDate | [PickerValidDate, PickerValidDate];
 }
 interface CalculateRangeChangeResponse {
   nextSelection: RangePosition;
   newRange: PickerRangeValue;
 }
+export declare function resolveReferenceDate(referenceDate: PickerValidDate | [PickerValidDate, PickerValidDate] | undefined, rangePosition: RangePosition): PickerValidDate | undefined;
 export declare function calculateRangeChange({
-  utils,
+  adapter,
   range,
   newDate: selectedDate,
   rangePosition,

package/esm/internals/utils/date-range-manager.js

@@ -1,6 +1,12 @@
 import { mergeDateAndTime } from '@mui/x-date-pickers/internals';
+export function resolveReferenceDate(referenceDate, rangePosition) {
+  if (Array.isArray(referenceDate)) {
+    return rangePosition === 'start' ? referenceDate[0] : referenceDate[1];
+  }
+  return referenceDate;
+}
 export function calculateRangeChange({
-  utils,
+  adapter,
   range,
   newDate: selectedDate,
   rangePosition,
@@ -8,18 +14,18 @@ export function calculateRangeChange({
   shouldMergeDateAndTime = false,
   referenceDate
 }) {
-  const start = !utils.isValid(range[0]) ? null : range[0];
-  const end = !utils.isValid(range[1]) ? null : range[1];
+  const start = !adapter.isValid(range[0]) ? null : range[0];
+  const end = !adapter.isValid(range[1]) ? null : range[1];
   if (shouldMergeDateAndTime && selectedDate) {
     // If there is a date already selected, then we want to keep its time
     if (start && rangePosition === 'start') {
-      selectedDate = mergeDateAndTime(utils, selectedDate, start);
+      selectedDate = mergeDateAndTime(adapter, selectedDate, start);
     }
     if (end && rangePosition === 'end') {
-      selectedDate = mergeDateAndTime(utils, selectedDate, end);
+      selectedDate = mergeDateAndTime(adapter, selectedDate, end);
     }
   }
-  const newSelectedDate = referenceDate && selectedDate && shouldMergeDateAndTime ? mergeDateAndTime(utils, selectedDate, referenceDate) : selectedDate;
+  const newSelectedDate = referenceDate && selectedDate && shouldMergeDateAndTime ? mergeDateAndTime(adapter, selectedDate, resolveReferenceDate(referenceDate, rangePosition)) : selectedDate;
   if (rangePosition === 'start') {
     const truthyResult = allowRangeFlip ? {
       nextSelection: 'start',
@@ -28,7 +34,7 @@ export function calculateRangeChange({
       nextSelection: 'end',
       newRange: [newSelectedDate, null]
     };
-    return Boolean(end) && utils.isAfter(newSelectedDate, end) ? truthyResult : {
+    return Boolean(end) && adapter.isAfter(newSelectedDate, end) ? truthyResult : {
       nextSelection: 'end',
       newRange: [newSelectedDate, end]
     };
@@ -40,7 +46,7 @@ export function calculateRangeChange({
     nextSelection: 'end',
     newRange: [newSelectedDate, null]
   };
-  return Boolean(start) && utils.isBeforeDay(newSelectedDate, start) ? truthyResult : {
+  return Boolean(start) && adapter.isBeforeDay(newSelectedDate, start) ? truthyResult : {
     nextSelection: 'start',
     newRange: [start, newSelectedDate]
   };

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

@@ -1,7 +1,7 @@
 import { AdapterFormats, MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models';
 import { PickerNonNullableRangeValue, PickerRangeValue } from '@mui/x-date-pickers/internals';
-export declare const isRangeValid: (utils: MuiPickersAdapter, range: PickerRangeValue) => range is PickerNonNullableRangeValue;
-export declare const isWithinRange: (utils: MuiPickersAdapter, day: PickerValidDate, range: PickerRangeValue) => boolean;
-export declare const isStartOfRange: (utils: MuiPickersAdapter, day: PickerValidDate, range: PickerRangeValue) => boolean;
-export declare const isEndOfRange: (utils: MuiPickersAdapter, day: PickerValidDate, range: PickerRangeValue) => boolean;
-export declare const formatRange: (utils: MuiPickersAdapter, range: PickerRangeValue, formatKey: keyof AdapterFormats) => string | null;
+export declare const isRangeValid: (adapter: MuiPickersAdapter, range: PickerRangeValue) => range is PickerNonNullableRangeValue;
+export declare const isWithinRange: (adapter: MuiPickersAdapter, day: PickerValidDate, range: PickerRangeValue) => boolean;
+export declare const isStartOfRange: (adapter: MuiPickersAdapter, day: PickerValidDate, range: PickerRangeValue) => boolean;
+export declare const isEndOfRange: (adapter: MuiPickersAdapter, day: PickerValidDate, range: PickerRangeValue) => boolean;
+export declare const formatRange: (adapter: MuiPickersAdapter, range: PickerRangeValue, formatKey: keyof AdapterFormats) => string | null;

package/esm/internals/utils/date-utils.js

@@ -1,18 +1,18 @@
-export const isRangeValid = (utils, range) => {
-  return utils.isValid(range[0]) && utils.isValid(range[1]) && !utils.isBefore(range[1], range[0]);
+export const isRangeValid = (adapter, range) => {
+  return adapter.isValid(range[0]) && adapter.isValid(range[1]) && !adapter.isBefore(range[1], range[0]);
 };
-export const isWithinRange = (utils, day, range) => {
-  return isRangeValid(utils, range) && utils.isWithinRange(day, range);
+export const isWithinRange = (adapter, day, range) => {
+  return isRangeValid(adapter, range) && adapter.isWithinRange(day, range);
 };
-export const isStartOfRange = (utils, day, range) => {
-  return isRangeValid(utils, range) && utils.isSameDay(day, range[0]);
+export const isStartOfRange = (adapter, day, range) => {
+  return isRangeValid(adapter, range) && adapter.isSameDay(day, range[0]);
 };
-export const isEndOfRange = (utils, day, range) => {
-  return isRangeValid(utils, range) && utils.isSameDay(day, range[1]);
+export const isEndOfRange = (adapter, day, range) => {
+  return isRangeValid(adapter, range) && adapter.isSameDay(day, range[1]);
 };
-export const formatRange = (utils, range, formatKey) => {
-  if (!isRangeValid(utils, range)) {
+export const formatRange = (adapter, range, formatKey) => {
+  if (!isRangeValid(adapter, range)) {
     return null;
   }
-  return `${utils.format(range[0], formatKey)} - ${utils.format(range[1], formatKey)}`;
+  return `${adapter.format(range[0], formatKey)} - ${adapter.format(range[1], formatKey)}`;
 };

package/esm/internals/utils/valueManagers.js

@@ -12,35 +12,37 @@ export const rangeValueManager = {
         referenceDate: referenceDateProp
       } = _ref,
       params = _objectWithoutPropertiesLoose(_ref, _excluded);
-    const shouldKeepStartDate = params.utils.isValid(value[0]);
-    const shouldKeepEndDate = params.utils.isValid(value[1]);
+    const shouldKeepStartDate = params.adapter.isValid(value[0]);
+    const shouldKeepEndDate = params.adapter.isValid(value[1]);
     if (shouldKeepStartDate && shouldKeepEndDate) {
       return value;
     }
     const referenceDate = referenceDateProp ?? getDefaultReferenceDate(params);
-    return [shouldKeepStartDate ? value[0] : referenceDate, shouldKeepEndDate ? value[1] : referenceDate];
+    const startReferenceDate = Array.isArray(referenceDate) ? referenceDate[0] : referenceDate;
+    const endReferenceDate = Array.isArray(referenceDate) ? referenceDate[1] : referenceDate;
+    return [shouldKeepStartDate ? value[0] : startReferenceDate, shouldKeepEndDate ? value[1] : endReferenceDate];
   },
   cleanValue: (utils, value) => value.map(date => replaceInvalidDateByNull(utils, date)),
   areValuesEqual: (utils, a, b) => areDatesEqual(utils, a[0], b[0]) && areDatesEqual(utils, a[1], b[1]),
   isSameError: (a, b) => b !== null && a[1] === b[1] && a[0] === b[0],
   hasError: error => error[0] != null || error[1] != null,
   defaultErrorState: [null, null],
-  getTimezone: (utils, value) => {
-    const timezoneStart = utils.isValid(value[0]) ? utils.getTimezone(value[0]) : null;
-    const timezoneEnd = utils.isValid(value[1]) ? utils.getTimezone(value[1]) : null;
+  getTimezone: (adapter, value) => {
+    const timezoneStart = adapter.isValid(value[0]) ? adapter.getTimezone(value[0]) : null;
+    const timezoneEnd = adapter.isValid(value[1]) ? adapter.getTimezone(value[1]) : null;
     if (timezoneStart != null && timezoneEnd != null && timezoneStart !== timezoneEnd) {
       throw new Error('MUI X: The timezone of the start and the end date should be the same.');
     }
     return timezoneStart ?? timezoneEnd;
   },
-  setTimezone: (utils, timezone, value) => [value[0] == null ? null : utils.setTimezone(value[0], timezone), value[1] == null ? null : utils.setTimezone(value[1], timezone)]
+  setTimezone: (adapter, timezone, value) => [value[0] == null ? null : adapter.setTimezone(value[0], timezone), value[1] == null ? null : adapter.setTimezone(value[1], timezone)]
 };
 export const getRangeFieldValueManager = ({
   dateSeparator = '–'
 }) => ({
-  updateReferenceValue: (utils, value, prevReferenceValue) => {
-    const shouldKeepStartDate = utils.isValid(value[0]);
-    const shouldKeepEndDate = utils.isValid(value[1]);
+  updateReferenceValue: (adapter, value, prevReferenceValue) => {
+    const shouldKeepStartDate = adapter.isValid(value[0]);
+    const shouldKeepEndDate = adapter.isValid(value[1]);
     if (!shouldKeepStartDate && !shouldKeepEndDate) {
       return prevReferenceValue;
     }

package/esm/managers/useDateRangeManager.js

@@ -2,8 +2,8 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { usePickerTranslations } from '@mui/x-date-pickers/hooks';
-import { useApplyDefaultValuesToDateValidationProps, useUtils } from '@mui/x-date-pickers/internals';
+import { usePickerAdapter, usePickerTranslations } from '@mui/x-date-pickers/hooks';
+import { useApplyDefaultValuesToDateValidationProps } from '@mui/x-date-pickers/internals';
 import { getRangeFieldValueManager, rangeValueManager } from "../internals/utils/valueManagers.js";
 import { validateDateRange } from "../validation/index.js";
 import { formatRange } from "../internals/utils/date-utils.js";
@@ -25,16 +25,16 @@ export function useDateRangeManager(parameters = {}) {
   }), [enableAccessibleFieldDOMStructure, dateSeparator]);
 }
 function useOpenPickerButtonAriaLabel(value) {
-  const utils = useUtils();
+  const adapter = usePickerAdapter();
   const translations = usePickerTranslations();
   return React.useMemo(() => {
-    return translations.openRangePickerDialogue(formatRange(utils, value, 'fullDate'));
-  }, [value, translations, utils]);
+    return translations.openRangePickerDialogue(formatRange(adapter, value, 'fullDate'));
+  }, [value, translations, adapter]);
 }
 function useApplyDefaultValuesToDateRangeFieldInternalProps(internalProps) {
-  const utils = useUtils();
+  const adapter = usePickerAdapter();
   const validationProps = useApplyDefaultValuesToDateValidationProps(internalProps);
   return React.useMemo(() => _extends({}, internalProps, validationProps, {
-    format: internalProps.format ?? utils.formats.keyboardDate
-  }), [internalProps, validationProps, utils]);
+    format: internalProps.format ?? adapter.formats.keyboardDate
+  }), [internalProps, validationProps, adapter]);
 }

package/esm/managers/useDateTimeRangeManager.js

@@ -2,8 +2,8 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { usePickerTranslations } from '@mui/x-date-pickers/hooks';
-import { useApplyDefaultValuesToDateTimeValidationProps, useUtils } from '@mui/x-date-pickers/internals';
+import { usePickerAdapter, usePickerTranslations } from '@mui/x-date-pickers/hooks';
+import { useApplyDefaultValuesToDateTimeValidationProps } from '@mui/x-date-pickers/internals';
 import { getRangeFieldValueManager, rangeValueManager } from "../internals/utils/valueManagers.js";
 import { validateDateTimeRange } from "../validation/index.js";
 import { formatRange } from "../internals/utils/date-utils.js";
@@ -25,17 +25,17 @@ export function useDateTimeRangeManager(parameters = {}) {
   }), [enableAccessibleFieldDOMStructure, dateSeparator]);
 }
 function useOpenPickerButtonAriaLabel(value) {
-  const utils = useUtils();
+  const adapter = usePickerAdapter();
   const translations = usePickerTranslations();
   return React.useMemo(() => {
-    return translations.openRangePickerDialogue(formatRange(utils, value, 'fullDate'));
-  }, [value, translations, utils]);
+    return translations.openRangePickerDialogue(formatRange(adapter, value, 'fullDate'));
+  }, [value, translations, adapter]);
 }
 function useApplyDefaultValuesToDateTimeRangeFieldInternalProps(internalProps) {
-  const utils = useUtils();
+  const adapter = usePickerAdapter();
   const validationProps = useApplyDefaultValuesToDateTimeValidationProps(internalProps);
-  const ampm = React.useMemo(() => internalProps.ampm ?? utils.is12HourCycleInCurrentLocale(), [internalProps.ampm, utils]);
+  const ampm = React.useMemo(() => internalProps.ampm ?? adapter.is12HourCycleInCurrentLocale(), [internalProps.ampm, adapter]);
   return React.useMemo(() => _extends({}, internalProps, validationProps, {
-    format: internalProps.format ?? (ampm ? utils.formats.keyboardDateTime12h : utils.formats.keyboardDateTime24h)
-  }), [internalProps, validationProps, ampm, utils]);
+    format: internalProps.format ?? (ampm ? adapter.formats.keyboardDateTime12h : adapter.formats.keyboardDateTime24h)
+  }), [internalProps, validationProps, ampm, adapter]);
 }

package/esm/managers/useTimeRangeManager.js

@@ -2,8 +2,8 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { usePickerTranslations } from '@mui/x-date-pickers/hooks';
-import { useApplyDefaultValuesToTimeValidationProps, useUtils } from '@mui/x-date-pickers/internals';
+import { usePickerAdapter, usePickerTranslations } from '@mui/x-date-pickers/hooks';
+import { useApplyDefaultValuesToTimeValidationProps } from '@mui/x-date-pickers/internals';
 import { getRangeFieldValueManager, rangeValueManager } from "../internals/utils/valueManagers.js";
 import { validateTimeRange } from "../validation/index.js";
 import { formatRange } from "../internals/utils/date-utils.js";
@@ -27,19 +27,19 @@ export function useTimeRangeManager(parameters = {}) {
 }
 function createUseOpenPickerButtonAriaLabel(ampm) {
   return function useOpenPickerButtonAriaLabel(value) {
-    const utils = useUtils();
+    const adapter = usePickerAdapter();
     const translations = usePickerTranslations();
     return React.useMemo(() => {
-      const formatKey = ampm ?? utils.is12HourCycleInCurrentLocale() ? 'fullTime12h' : 'fullTime24h';
-      return translations.openRangePickerDialogue(formatRange(utils, value, formatKey));
-    }, [value, translations, utils]);
+      const formatKey = ampm ?? adapter.is12HourCycleInCurrentLocale() ? 'fullTime12h' : 'fullTime24h';
+      return translations.openRangePickerDialogue(formatRange(adapter, value, formatKey));
+    }, [value, translations, adapter]);
   };
 }
 function useApplyDefaultValuesToTimeRangeFieldInternalProps(internalProps) {
-  const utils = useUtils();
+  const adapter = usePickerAdapter();
   const validationProps = useApplyDefaultValuesToTimeValidationProps(internalProps);
-  const ampm = React.useMemo(() => internalProps.ampm ?? utils.is12HourCycleInCurrentLocale(), [internalProps.ampm, utils]);
+  const ampm = React.useMemo(() => internalProps.ampm ?? adapter.is12HourCycleInCurrentLocale(), [internalProps.ampm, adapter]);
   return React.useMemo(() => _extends({}, internalProps, validationProps, {
-    format: internalProps.format ?? (ampm ? utils.formats.fullTime12h : utils.formats.fullTime24h)
-  }), [internalProps, validationProps, ampm, utils]);
+    format: internalProps.format ?? (ampm ? adapter.formats.fullTime12h : adapter.formats.fullTime24h)
+  }), [internalProps, validationProps, ampm, adapter]);
 }

package/esm/validation/validateDateRange.js

@@ -51,7 +51,7 @@ export const validateDateRange = ({
   if (start === null || end === null) {
     return [null, null];
   }
-  if (!isRangeValid(adapter.utils, value)) {
+  if (!isRangeValid(adapter, value)) {
     return ['invalidRange', 'invalidRange'];
   }
   return [null, null];

package/esm/validation/validateDateTimeRange.js

@@ -47,7 +47,7 @@ export const validateDateTimeRange = ({
   if (start === null || end === null) {
     return [null, null];
   }
-  if (!isRangeValid(adapter.utils, value)) {
+  if (!isRangeValid(adapter, value)) {
     return ['invalidRange', 'invalidRange'];
   }
   return [null, null];

package/esm/validation/validateTimeRange.js

@@ -40,7 +40,7 @@ export const validateTimeRange = ({
   if (start === null || end === null) {
     return [null, null];
   }
-  if (!isRangeValid(adapter.utils, value)) {
+  if (!isRangeValid(adapter, value)) {
     return ['invalidRange', 'invalidRange'];
   }
   return [null, null];

package/hooks/useMultiInputRangeField/useMultiInputRangeFieldSelectedSections.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;

package/hooks/useMultiInputRangeField/useTextFieldProps.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers-pro v8.5.3
+ * @mui/x-date-pickers-pro v8.7.0
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js

@@ -27,7 +27,7 @@ const useDesktopRangePicker = _ref => {
       steps
     } = _ref,
     pickerParams = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
-  (0, _xLicense.useLicenseVerifier)('x-date-pickers-pro', "MTc1MDI4NDAwMDAwMA==");
+  (0, _xLicense.useLicenseVerifier)('x-date-pickers-pro', "MTc1MTU4MDAwMDAwMA==");
   const {
     slots,
     slotProps,

package/internals/hooks/useMobileRangePicker/useMobileRangePicker.js

@@ -29,7 +29,7 @@ const useMobileRangePicker = _ref => {
       steps
     } = _ref,
     pickerParams = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
-  (0, _xLicense.useLicenseVerifier)('x-date-pickers-pro', "MTc1MDI4NDAwMDAwMA==");
+  (0, _xLicense.useLicenseVerifier)('x-date-pickers-pro', "MTc1MTU4MDAwMDAwMA==");
   const {
     slots,
     slotProps: innerSlotProps,

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

@@ -2,7 +2,7 @@ import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models';
 import { PickerRangeValue } from '@mui/x-date-pickers/internals';
 import { RangePosition } from "../../models/index.js";
 interface CalculateRangeChangeOptions {
-  utils: MuiPickersAdapter;
+  adapter: MuiPickersAdapter;
   range: PickerRangeValue;
   newDate: PickerValidDate | null;
   rangePosition: RangePosition;
@@ -13,14 +13,15 @@ interface CalculateRangeChangeOptions {
    */
   allowRangeFlip?: boolean;
   shouldMergeDateAndTime?: boolean;
-  referenceDate?: PickerValidDate;
+  referenceDate?: PickerValidDate | [PickerValidDate, PickerValidDate];
 }
 interface CalculateRangeChangeResponse {
   nextSelection: RangePosition;
   newRange: PickerRangeValue;
 }
+export declare function resolveReferenceDate(referenceDate: PickerValidDate | [PickerValidDate, PickerValidDate] | undefined, rangePosition: RangePosition): PickerValidDate | undefined;
 export declare function calculateRangeChange({
-  utils,
+  adapter,
   range,
   newDate: selectedDate,
   rangePosition,