@mui/x-date-pickers-pro 8.0.0-alpha.5 → 8.0.0-alpha.7

package/modern/internals/hooks/useMobileRangePicker/useMobileRangePicker.js

@@ -11,6 +11,7 @@ import useId from '@mui/utils/useId';
 import { useEnrichedRangePickerFieldProps } from "../useEnrichedRangePickerFieldProps.js";
 import { getReleaseInfo } from "../../utils/releaseInfo.js";
 import { useRangePosition } from "../useRangePosition.js";
+import { PickerRangePositionContext } from "../../../hooks/usePickerRangePositionContext.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const releaseInfo = getReleaseInfo();
 export const useMobileRangePicker = _ref => {
@@ -42,24 +43,18 @@ export const useMobileRangePicker = _ref => {
   const endFieldRef = React.useRef(null);
   const singleInputFieldRef = React.useRef(null);
   const fieldType = slots.field.fieldType ?? 'multi-input';
-  const {
-    rangePosition,
-    onRangePositionChange
-  } = useRangePosition(props, fieldType === 'single-input' ? singleInputFieldRef : undefined);
+  const rangePositionResponse = useRangePosition(props, fieldType === 'single-input' ? singleInputFieldRef : undefined);
   const labelId = useId();
   const contextTranslations = usePickerTranslations();
   let fieldRef;
   if (fieldType === 'single-input') {
     fieldRef = singleInputFieldRef;
-  } else if (rangePosition === 'start') {
+  } else if (rangePositionResponse.rangePosition === 'start') {
     fieldRef = startFieldRef;
   } else {
     fieldRef = endFieldRef;
   }
   const {
-    open,
-    actions,
-    layoutProps,
     providerProps,
     renderCurrentView,
     fieldProps: pickerFieldProps,
@@ -69,11 +64,7 @@ export const useMobileRangePicker = _ref => {
     variant: 'mobile',
     autoFocusView: true,
     fieldRef,
-    localeText,
-    additionalViewProps: {
-      rangePosition,
-      onRangePositionChange
-    }
+    localeText
   }));
   const Field = slots.field;
   const fieldProps = useSlotProps({
@@ -103,36 +94,24 @@ export const useMobileRangePicker = _ref => {
     ownerState
   });
   const isToolbarHidden = innerSlotProps?.toolbar?.hidden ?? false;
-  const enrichedFieldProps = useEnrichedRangePickerFieldProps({
+  const enrichedFieldProps = useEnrichedRangePickerFieldProps(_extends({
     variant: 'mobile',
     fieldType,
-    open,
-    actions,
+    // These direct access to `providerProps` will go away once the range fields handle the picker opening
+    open: providerProps.contextValue.open,
+    setOpen: providerProps.contextValue.setOpen,
     readOnly,
     labelId,
     disableOpenPicker,
     label,
     localeText,
-    rangePosition,
-    onRangePositionChange,
     pickerSlots: slots,
     pickerSlotProps: innerSlotProps,
     fieldProps,
     startFieldRef,
     endFieldRef,
     singleInputFieldRef
-  });
-  const slotPropsForLayout = _extends({}, innerSlotProps, {
-    tabs: _extends({}, innerSlotProps?.tabs, {
-      rangePosition,
-      onRangePositionChange
-    }),
-    toolbar: _extends({}, innerSlotProps?.toolbar, {
-      titleId: labelId,
-      rangePosition,
-      onRangePositionChange
-    })
-  });
+  }, rangePositionResponse));
   const Layout = slots?.layout ?? PickersLayout;
   const finalLocaleText = _extends({}, contextTranslations, localeText);
   let labelledById = pickerParams.valueType === 'date-time' ? `${labelId}-start-toolbar ${labelId}-end-toolbar` : labelId;
@@ -151,21 +130,26 @@ export const useMobileRangePicker = _ref => {
     labelledById = labels.length > 0 ? labels.join(' ') : undefined;
   }
   const slotProps = _extends({}, innerSlotProps, {
+    toolbar: _extends({}, innerSlotProps?.toolbar, {
+      titleId: labelId
+    }),
     mobilePaper: _extends({
       'aria-labelledby': labelledById
     }, innerSlotProps?.mobilePaper)
   });
-  const renderPicker = () => /*#__PURE__*/_jsxs(PickerProvider, _extends({}, providerProps, {
-    children: [/*#__PURE__*/_jsx(Field, _extends({}, enrichedFieldProps)), /*#__PURE__*/_jsx(PickersModalDialog, _extends({}, actions, {
-      open: open,
-      slots: slots,
-      slotProps: slotProps,
-      children: /*#__PURE__*/_jsx(Layout, _extends({}, layoutProps, slotProps?.layout, {
+  const renderPicker = () => /*#__PURE__*/_jsx(PickerProvider, _extends({}, providerProps, {
+    children: /*#__PURE__*/_jsxs(PickerRangePositionContext.Provider, {
+      value: rangePositionResponse,
+      children: [/*#__PURE__*/_jsx(Field, _extends({}, enrichedFieldProps)), /*#__PURE__*/_jsx(PickersModalDialog, {
         slots: slots,
-        slotProps: slotPropsForLayout,
-        children: renderCurrentView()
-      }))
-    }))]
+        slotProps: slotProps,
+        children: /*#__PURE__*/_jsx(Layout, _extends({}, slotProps?.layout, {
+          slots: slots,
+          slotProps: slotProps,
+          children: renderCurrentView()
+        }))
+      })]
+    })
   }));
   return {
     renderPicker

package/modern/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.js

@@ -1,20 +1,25 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import useEventCallback from '@mui/utils/useEventCallback';
 import { unstable_useDateField as useDateField } from '@mui/x-date-pickers/DateField';
-import { useControlledValueWithTimezone, useDefaultizedDateField } from '@mui/x-date-pickers/internals';
+import { useControlledValueWithTimezone, useFieldInternalPropsWithDefaults } from '@mui/x-date-pickers/internals';
 import { useValidation } from '@mui/x-date-pickers/validation';
 import { validateDateRange } from "../../../validation/index.js";
 import { rangeValueManager } from "../../utils/valueManagers.js";
 import { excludeProps } from "./shared.js";
 import { useMultiInputFieldSelectedSections } from "../useMultiInputFieldSelectedSections.js";
+import { useDateRangeManager } from "../../../managers/index.js";
 export const useMultiInputDateRangeField = ({
-  sharedProps: inSharedProps,
+  sharedProps,
   startTextFieldProps,
   unstableStartFieldRef,
   endTextFieldProps,
   unstableEndFieldRef
 }) => {
-  const sharedProps = useDefaultizedDateField(inSharedProps);
+  const manager = useDateRangeManager(sharedProps);
+  const sharedPropsWithDefaults = useFieldInternalPropsWithDefaults({
+    manager,
+    internalProps: sharedProps
+  });
   const {
     value: valueProp,
     defaultValue,
@@ -30,7 +35,7 @@ export const useMultiInputDateRangeField = ({
     timezone: timezoneProp,
     enableAccessibleFieldDOMStructure,
     autoFocus
-  } = sharedProps;
+  } = sharedPropsWithDefaults;
   const {
     value,
     handleValueChange,
@@ -48,11 +53,11 @@ export const useMultiInputDateRangeField = ({
     validationError,
     getValidationErrorForNewValue
   } = useValidation({
-    props: sharedProps,
+    props: sharedPropsWithDefaults,
     value,
     timezone,
     validator: validateDateRange,
-    onError: sharedProps.onError
+    onError: sharedPropsWithDefaults.onError
   });
 
   // TODO: Maybe export utility from `useField` instead of copy/pasting the logic

package/modern/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.js

@@ -1,20 +1,25 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import useEventCallback from '@mui/utils/useEventCallback';
 import { unstable_useDateTimeField as useDateTimeField } from '@mui/x-date-pickers/DateTimeField';
-import { useControlledValueWithTimezone, useDefaultizedDateTimeField } from '@mui/x-date-pickers/internals';
+import { useControlledValueWithTimezone, useFieldInternalPropsWithDefaults } from '@mui/x-date-pickers/internals';
 import { useValidation } from '@mui/x-date-pickers/validation';
 import { validateDateTimeRange } from "../../../validation/index.js";
 import { rangeValueManager } from "../../utils/valueManagers.js";
 import { excludeProps } from "./shared.js";
 import { useMultiInputFieldSelectedSections } from "../useMultiInputFieldSelectedSections.js";
+import { useDateTimeRangeManager } from "../../../managers/index.js";
 export const useMultiInputDateTimeRangeField = ({
-  sharedProps: inSharedProps,
+  sharedProps,
   startTextFieldProps,
   unstableStartFieldRef,
   endTextFieldProps,
   unstableEndFieldRef
 }) => {
-  const sharedProps = useDefaultizedDateTimeField(inSharedProps);
+  const manager = useDateTimeRangeManager(sharedProps);
+  const sharedPropsWithDefaults = useFieldInternalPropsWithDefaults({
+    manager,
+    internalProps: sharedProps
+  });
   const {
     value: valueProp,
     defaultValue,
@@ -30,13 +35,13 @@ export const useMultiInputDateTimeRangeField = ({
     timezone: timezoneProp,
     enableAccessibleFieldDOMStructure,
     autoFocus
-  } = sharedProps;
+  } = sharedPropsWithDefaults;
   const {
     value,
     handleValueChange,
     timezone
   } = useControlledValueWithTimezone({
-    name: 'useMultiInputDateRangeField',
+    name: 'useMultiInputDateTimeRangeField',
     timezone: timezoneProp,
     value: valueProp,
     defaultValue,
@@ -48,11 +53,11 @@ export const useMultiInputDateTimeRangeField = ({
     validationError,
     getValidationErrorForNewValue
   } = useValidation({
-    props: sharedProps,
+    props: sharedPropsWithDefaults,
     value,
     timezone,
     validator: validateDateTimeRange,
-    onError: sharedProps.onError
+    onError: sharedPropsWithDefaults.onError
   });
 
   // TODO: Maybe export utility from `useField` instead of copy/pasting the logic

package/modern/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.js

@@ -1,20 +1,25 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import useEventCallback from '@mui/utils/useEventCallback';
 import { unstable_useTimeField as useTimeField } from '@mui/x-date-pickers/TimeField';
-import { useControlledValueWithTimezone, useDefaultizedTimeField } from '@mui/x-date-pickers/internals';
+import { useControlledValueWithTimezone, useFieldInternalPropsWithDefaults } from '@mui/x-date-pickers/internals';
 import { useValidation } from '@mui/x-date-pickers/validation';
 import { validateTimeRange } from "../../../validation/index.js";
 import { rangeValueManager } from "../../utils/valueManagers.js";
 import { excludeProps } from "./shared.js";
 import { useMultiInputFieldSelectedSections } from "../useMultiInputFieldSelectedSections.js";
+import { useTimeRangeManager } from "../../../managers/index.js";
 export const useMultiInputTimeRangeField = ({
-  sharedProps: inSharedProps,
+  sharedProps,
   startTextFieldProps,
   unstableStartFieldRef,
   endTextFieldProps,
   unstableEndFieldRef
 }) => {
-  const sharedProps = useDefaultizedTimeField(inSharedProps);
+  const manager = useTimeRangeManager(sharedProps);
+  const sharedPropsWithDefaults = useFieldInternalPropsWithDefaults({
+    manager,
+    internalProps: sharedProps
+  });
   const {
     value: valueProp,
     defaultValue,
@@ -30,13 +35,13 @@ export const useMultiInputTimeRangeField = ({
     timezone: timezoneProp,
     enableAccessibleFieldDOMStructure,
     autoFocus
-  } = sharedProps;
+  } = sharedPropsWithDefaults;
   const {
     value,
     handleValueChange,
     timezone
   } = useControlledValueWithTimezone({
-    name: 'useMultiInputDateRangeField',
+    name: 'useMultiInputTimeRangeField',
     timezone: timezoneProp,
     value: valueProp,
     defaultValue,
@@ -48,11 +53,11 @@ export const useMultiInputTimeRangeField = ({
     validationError,
     getValidationErrorForNewValue
   } = useValidation({
-    props: sharedProps,
-    validator: validateTimeRange,
+    props: sharedPropsWithDefaults,
     value,
     timezone,
-    onError: sharedProps.onError
+    validator: validateTimeRange,
+    onError: sharedPropsWithDefaults.onError
   });
 
   // TODO: Maybe export utility from `useField` instead of copy/pasting the logic

package/modern/internals/hooks/useNullablePickerRangePositionContext.js

@@ -0,0 +1,10 @@
+import * as React from 'react';
+import { PickerRangePositionContext } from "../../hooks/usePickerRangePositionContext.js";
+
+/**
+ * Returns information about the range position of the picker that wraps the current component.
+ * If no picker wraps the current component, returns `null`.
+ */
+export function useNullablePickerRangePositionContext() {
+  return React.useContext(PickerRangePositionContext);
+}

package/modern/internals/hooks/useStaticRangePicker/useStaticRangePicker.js

@@ -7,6 +7,7 @@ import { styled } from '@mui/material/styles';
 import { PickersLayout } from '@mui/x-date-pickers/PickersLayout';
 import { usePicker, DIALOG_WIDTH, PickerProvider } from '@mui/x-date-pickers/internals';
 import { useRangePosition } from "../useRangePosition.js";
+import { PickerRangePositionContext } from "../../../hooks/usePickerRangePositionContext.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const PickerStaticLayout = styled(PickersLayout)(({
   theme
@@ -35,12 +36,8 @@ export const useStaticRangePicker = _ref => {
     displayStaticWrapperAs,
     autoFocus
   } = props;
+  const rangePositionResponse = useRangePosition(props);
   const {
-    rangePosition,
-    onRangePositionChange
-  } = useRangePosition(props);
-  const {
-    layoutProps,
     providerProps,
     renderCurrentView
   } = usePicker(_extends({}, pickerParams, {
@@ -48,29 +45,22 @@ export const useStaticRangePicker = _ref => {
     autoFocusView: autoFocus ?? false,
     fieldRef: undefined,
     localeText,
-    additionalViewProps: {
-      rangePosition,
-      onRangePositionChange
-    },
     variant: displayStaticWrapperAs
   }));
   const Layout = slots?.layout ?? PickerStaticLayout;
-  const slotPropsForLayout = _extends({}, slotProps, {
-    toolbar: _extends({}, slotProps?.toolbar, {
-      rangePosition,
-      onRangePositionChange
-    })
-  });
-  const renderPicker = () => /*#__PURE__*/_jsx(PickerProvider, _extends({}, providerProps, {
-    children: /*#__PURE__*/_jsx(Layout, _extends({}, layoutProps, slotProps?.layout, {
-      slots: slots,
-      slotProps: slotPropsForLayout,
-      sx: [...(Array.isArray(sx) ? sx : [sx]), ...(Array.isArray(slotProps?.layout?.sx) ? slotProps.layout.sx : [slotProps?.layout?.sx])],
-      className: clsx(className, slotProps?.layout?.className),
-      ref: ref,
-      children: renderCurrentView()
+  const renderPicker = () => /*#__PURE__*/_jsx(PickerRangePositionContext.Provider, {
+    value: rangePositionResponse,
+    children: /*#__PURE__*/_jsx(PickerProvider, _extends({}, providerProps, {
+      children: /*#__PURE__*/_jsx(Layout, _extends({}, slotProps?.layout, {
+        slots: slots,
+        slotProps: slotProps,
+        sx: [...(Array.isArray(sx) ? sx : [sx]), ...(Array.isArray(slotProps?.layout?.sx) ? slotProps.layout.sx : [slotProps?.layout?.sx])],
+        className: clsx(className, slotProps?.layout?.className),
+        ref: ref,
+        children: renderCurrentView()
+      }))
     }))
-  }));
+  });
   return {
     renderPicker
   };

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

@@ -8,7 +8,8 @@ export function calculateRangeChange({
   shouldMergeDateAndTime = false,
   referenceDate
 }) {
-  const [start, end] = range;
+  const start = !utils.isValid(range[0]) ? null : range[0];
+  const end = !utils.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') {

package/modern/internals/utils/releaseInfo.js

@@ -1,6 +1,6 @@
 import { ponyfillGlobal } from '@mui/utils';
 export const getReleaseInfo = () => {
-  const releaseInfo = "MTczNDU2NjQwMDAwMA==";
+  const releaseInfo = "MTczNjM3NzIwMDAwMA==";
   if (process.env.NODE_ENV !== 'production') {
     // A simple hack to set the value in the test environment (has no build step).
     // eslint-disable-next-line no-useless-concat

package/modern/internals/utils/valueManagers.js

@@ -12,8 +12,8 @@ export const rangeValueManager = {
         referenceDate: referenceDateProp
       } = _ref,
       params = _objectWithoutPropertiesLoose(_ref, _excluded);
-    const shouldKeepStartDate = value[0] != null && params.utils.isValid(value[0]);
-    const shouldKeepEndDate = value[1] != null && params.utils.isValid(value[1]);
+    const shouldKeepStartDate = params.utils.isValid(value[0]);
+    const shouldKeepEndDate = params.utils.isValid(value[1]);
     if (shouldKeepStartDate && shouldKeepEndDate) {
       return value;
     }
@@ -26,8 +26,8 @@ export const rangeValueManager = {
   hasError: error => error[0] != null || error[1] != null,
   defaultErrorState: [null, null],
   getTimezone: (utils, value) => {
-    const timezoneStart = value[0] == null || !utils.isValid(value[0]) ? null : utils.getTimezone(value[0]);
-    const timezoneEnd = value[1] == null || !utils.isValid(value[1]) ? null : utils.getTimezone(value[1]);
+    const timezoneStart = utils.isValid(value[0]) ? utils.getTimezone(value[0]) : null;
+    const timezoneEnd = utils.isValid(value[1]) ? utils.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.');
     }
@@ -39,8 +39,8 @@ export const getRangeFieldValueManager = ({
   dateSeparator = '–'
 }) => ({
   updateReferenceValue: (utils, value, prevReferenceValue) => {
-    const shouldKeepStartDate = value[0] != null && utils.isValid(value[0]);
-    const shouldKeepEndDate = value[1] != null && utils.isValid(value[1]);
+    const shouldKeepStartDate = utils.isValid(value[0]);
+    const shouldKeepEndDate = utils.isValid(value[1]);
     if (!shouldKeepStartDate && !shouldKeepEndDate) {
       return prevReferenceValue;
     }
@@ -111,7 +111,7 @@ export const getRangeFieldValueManager = ({
       },
       getNewValuesFromNewActiveDate: newActiveDate => ({
         value: updateDateInRange(newActiveDate, state.value),
-        referenceValue: newActiveDate == null || !utils.isValid(newActiveDate) ? state.referenceValue : updateDateInRange(newActiveDate, state.referenceValue)
+        referenceValue: !utils.isValid(newActiveDate) ? state.referenceValue : updateDateInRange(newActiveDate, state.referenceValue)
       })
     };
   }

package/modern/managers/index.js

@@ -0,0 +1,3 @@
+export { useDateRangeManager } from "./useDateRangeManager.js";
+export { useTimeRangeManager } from "./useTimeRangeManager.js";
+export { useDateTimeRangeManager } from "./useDateTimeRangeManager.js";

package/modern/managers/useDateRangeManager.js

@@ -0,0 +1,31 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { getDateFieldInternalPropsDefaults } from '@mui/x-date-pickers/internals';
+import { getRangeFieldValueManager, rangeValueManager } from "../internals/utils/valueManagers.js";
+import { validateDateRange } from "../validation/index.js";
+export function useDateRangeManager(parameters = {}) {
+  const {
+    enableAccessibleFieldDOMStructure = true,
+    dateSeparator
+  } = parameters;
+  return React.useMemo(() => ({
+    valueType: 'date',
+    validator: validateDateRange,
+    internal_valueManager: rangeValueManager,
+    internal_fieldValueManager: getRangeFieldValueManager({
+      dateSeparator
+    }),
+    internal_enableAccessibleFieldDOMStructure: enableAccessibleFieldDOMStructure,
+    internal_applyDefaultsToFieldInternalProps: ({
+      internalProps,
+      utils,
+      defaultDates
+    }) => _extends({}, internalProps, getDateFieldInternalPropsDefaults({
+      defaultDates,
+      utils,
+      internalProps
+    }))
+  }), [enableAccessibleFieldDOMStructure, dateSeparator]);
+}

package/modern/managers/useDateTimeRangeManager.js

@@ -0,0 +1,31 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { getDateTimeFieldInternalPropsDefaults } from '@mui/x-date-pickers/internals';
+import { getRangeFieldValueManager, rangeValueManager } from "../internals/utils/valueManagers.js";
+import { validateDateTimeRange } from "../validation/index.js";
+export function useDateTimeRangeManager(parameters = {}) {
+  const {
+    enableAccessibleFieldDOMStructure = true,
+    dateSeparator
+  } = parameters;
+  return React.useMemo(() => ({
+    valueType: 'date-time',
+    validator: validateDateTimeRange,
+    internal_valueManager: rangeValueManager,
+    internal_fieldValueManager: getRangeFieldValueManager({
+      dateSeparator
+    }),
+    internal_enableAccessibleFieldDOMStructure: enableAccessibleFieldDOMStructure,
+    internal_applyDefaultsToFieldInternalProps: ({
+      internalProps,
+      utils,
+      defaultDates
+    }) => _extends({}, internalProps, getDateTimeFieldInternalPropsDefaults({
+      internalProps,
+      utils,
+      defaultDates
+    }))
+  }), [enableAccessibleFieldDOMStructure, dateSeparator]);
+}

package/modern/managers/useTimeRangeManager.js

@@ -0,0 +1,29 @@
+'use client';
+
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { getTimeFieldInternalPropsDefaults } from '@mui/x-date-pickers/internals';
+import { getRangeFieldValueManager, rangeValueManager } from "../internals/utils/valueManagers.js";
+import { validateTimeRange } from "../validation/index.js";
+export function useTimeRangeManager(parameters = {}) {
+  const {
+    enableAccessibleFieldDOMStructure = true,
+    dateSeparator
+  } = parameters;
+  return React.useMemo(() => ({
+    valueType: 'time',
+    validator: validateTimeRange,
+    internal_valueManager: rangeValueManager,
+    internal_fieldValueManager: getRangeFieldValueManager({
+      dateSeparator
+    }),
+    internal_enableAccessibleFieldDOMStructure: enableAccessibleFieldDOMStructure,
+    internal_applyDefaultsToFieldInternalProps: ({
+      internalProps,
+      utils
+    }) => _extends({}, internalProps, getTimeFieldInternalPropsDefaults({
+      utils,
+      internalProps
+    }))
+  }), [enableAccessibleFieldDOMStructure, dateSeparator]);
+}

package/node/{AdapterDateFnsJalaliV3 → AdapterDateFnsJalaliV2}/index.js

@@ -9,4 +9,4 @@ Object.defineProperty(exports, "AdapterDateFnsJalali", {
     return _AdapterDateFnsJalaliV.AdapterDateFnsJalali;
   }
 });
-var _AdapterDateFnsJalaliV = require("@mui/x-date-pickers/AdapterDateFnsJalaliV3");
+var _AdapterDateFnsJalaliV = require("@mui/x-date-pickers/AdapterDateFnsJalaliV2");

package/node/{AdapterDateFnsV3 → AdapterDateFnsV2}/index.js

@@ -9,4 +9,4 @@ Object.defineProperty(exports, "AdapterDateFns", {
     return _AdapterDateFnsV.AdapterDateFns;
   }
 });
-var _AdapterDateFnsV = require("@mui/x-date-pickers/AdapterDateFnsV3");
+var _AdapterDateFnsV = require("@mui/x-date-pickers/AdapterDateFnsV2");

package/node/DateRangeCalendar/DateRangeCalendar.js

@@ -32,6 +32,7 @@ var _useDragRange2 = require("./useDragRange");
 var _useRangePosition = require("../internals/hooks/useRangePosition");
 var _dimensions = require("../internals/constants/dimensions");
 var _PickersRangeCalendarHeader = require("../PickersRangeCalendarHeader");
+var _useNullablePickerRangePositionContext = require("../internals/hooks/useNullablePickerRangePositionContext");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["value", "defaultValue", "referenceDate", "onChange", "className", "classes", "disableFuture", "disablePast", "minDate", "maxDate", "shouldDisableDate", "reduceAnimations", "onMonthChange", "rangePosition", "defaultRangePosition", "onRangePositionChange", "calendars", "currentMonthCalendarPosition", "slots", "slotProps", "loading", "renderLoading", "disableHighlightToday", "readOnly", "disabled", "showDaysOutsideCurrentMonth", "dayOfWeekFormatter", "disableAutoMonthSwitching", "autoFocus", "fixedWeekNumber", "disableDragEditing", "displayWeekNumber", "timezone", "availableRangePositions", "views", "view", "openTo", "onViewChange"],
   _excluded2 = ["isDragging", "rangeDragDay", "draggingDatePosition"];
@@ -142,8 +143,8 @@ const DateRangeCalendar = exports.DateRangeCalendar = /*#__PURE__*/React.forward
       reduceAnimations,
       onMonthChange,
       rangePosition: rangePositionProp,
-      defaultRangePosition: inDefaultRangePosition,
-      onRangePositionChange: inOnRangePositionChange,
+      defaultRangePosition: defaultRangePositionProp,
+      onRangePositionChange: onRangePositionChangeProp,
       calendars,
       currentMonthCalendarPosition = 1,
       slots,
@@ -168,6 +169,7 @@ const DateRangeCalendar = exports.DateRangeCalendar = /*#__PURE__*/React.forward
       onViewChange
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const rangePositionContext = (0, _useNullablePickerRangePositionContext.useNullablePickerRangePositionContext)();
   const {
     value,
     handleValueChange,
@@ -199,9 +201,9 @@ const DateRangeCalendar = exports.DateRangeCalendar = /*#__PURE__*/React.forward
     rangePosition,
     onRangePositionChange
   } = (0, _useRangePosition.useRangePosition)({
-    rangePosition: rangePositionProp,
-    defaultRangePosition: inDefaultRangePosition,
-    onRangePositionChange: inOnRangePositionChange
+    rangePosition: rangePositionProp ?? rangePositionContext?.rangePosition,
+    defaultRangePosition: defaultRangePositionProp,
+    onRangePositionChange: onRangePositionChangeProp ?? rangePositionContext?.onRangePositionChange
   });
   const handleDatePositionChange = (0, _useEventCallback.default)(position => {
     if (rangePosition !== position) {
@@ -235,7 +237,7 @@ const DateRangeCalendar = exports.DateRangeCalendar = /*#__PURE__*/React.forward
 
   // Range going for the start of the start day to the end of the end day.
   // This makes sure that `isWithinRange` works with any time in the start and end day.
-  const valueDayRange = React.useMemo(() => [value[0] == null || !utils.isValid(value[0]) ? value[0] : utils.startOfDay(value[0]), value[1] == null || !utils.isValid(value[1]) ? value[1] : utils.endOfDay(value[1])], [value, utils]);
+  const valueDayRange = React.useMemo(() => [!utils.isValid(value[0]) ? value[0] : utils.startOfDay(value[0]), !utils.isValid(value[1]) ? value[1] : utils.endOfDay(value[1])], [value, utils]);
   const _useDragRange = (0, _useDragRange2.useDragRange)({
       disableDragEditing: shouldDisableDragEditing,
       onDrop: handleDrop,
@@ -323,7 +325,7 @@ const DateRangeCalendar = exports.DateRangeCalendar = /*#__PURE__*/React.forward
   const prevValue = React.useRef(null);
   React.useEffect(() => {
     const date = rangePosition === 'start' ? value[0] : value[1];
-    if (!date || !utils.isValid(date)) {
+    if (!utils.isValid(date)) {
       return;
     }
     const prevDate = rangePosition === 'start' ? prevValue.current?.[0] : prevValue.current?.[1];

package/node/DateRangePicker/DateRangePicker.js

@@ -70,7 +70,7 @@ process.env.NODE_ENV !== "production" ? DateRangePicker.propTypes = {
   calendars: _propTypes.default.oneOf([1, 2, 3]),
   className: _propTypes.default.string,
   /**
-   * If `true`, the popover or modal will close after submitting the full date.
+   * If `true`, the Picker will close after submitting the full date.
    * @default `true` for desktop, `false` for mobile (based on the chosen wrapper and `desktopModeMediaQuery` prop).
    */
   closeOnSelect: _propTypes.default.bool,