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

package/node/SingleInputTimeRangeField/useSingleInputTimeRangeField.js

@@ -1,32 +1,30 @@
 "use strict";
 'use client';
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useSingleInputTimeRangeField = void 0;
-var React = _interopRequireWildcard(require("react"));
 var _internals = require("@mui/x-date-pickers/internals");
 var _hooks = require("@mui/x-date-pickers/hooks");
-var _valueManagers = require("../internals/utils/valueManagers");
-var _validation = require("../validation");
-const useSingleInputTimeRangeField = inProps => {
-  const props = (0, _internals.useDefaultizedTimeField)(inProps);
+var _managers = require("../managers");
+const useSingleInputTimeRangeField = props => {
+  const manager = (0, _managers.useTimeRangeManager)(props);
   const {
     forwardedProps,
     internalProps
   } = (0, _hooks.useSplitFieldProps)(props, 'time');
-  const fieldValueManager = React.useMemo(() => (0, _valueManagers.getRangeFieldValueManager)({
-    dateSeparator: internalProps.dateSeparator
-  }), [internalProps.dateSeparator]);
+  const internalPropsWithDefaults = (0, _internals.useFieldInternalPropsWithDefaults)({
+    manager,
+    internalProps
+  });
   return (0, _internals.useField)({
     forwardedProps,
-    internalProps,
-    valueManager: _valueManagers.rangeValueManager,
-    fieldValueManager,
-    validator: _validation.validateTimeRange,
-    valueType: 'time'
+    internalProps: internalPropsWithDefaults,
+    valueManager: manager.internal_valueManager,
+    fieldValueManager: manager.internal_fieldValueManager,
+    validator: manager.validator,
+    valueType: manager.valueType
   });
 };
 exports.useSingleInputTimeRangeField = useSingleInputTimeRangeField;

package/node/dateRangeViewRenderers/dateRangeViewRenderers.js

@@ -26,9 +26,6 @@ const renderDateRangeViewCalendar = ({
   shouldDisableDate,
   reduceAnimations,
   onMonthChange,
-  rangePosition,
-  defaultRangePosition,
-  onRangePositionChange,
   calendars,
   currentMonthCalendarPosition,
   slots,
@@ -65,9 +62,6 @@ const renderDateRangeViewCalendar = ({
   shouldDisableDate: shouldDisableDate,
   reduceAnimations: reduceAnimations,
   onMonthChange: onMonthChange,
-  rangePosition: rangePosition,
-  defaultRangePosition: defaultRangePosition,
-  onRangePositionChange: onRangePositionChange,
   calendars: calendars,
   currentMonthCalendarPosition: currentMonthCalendarPosition,
   slots: slots,

package/node/hooks/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "usePickerRangePositionContext", {
+  enumerable: true,
+  get: function () {
+    return _usePickerRangePositionContext.usePickerRangePositionContext;
+  }
+});
+var _usePickerRangePositionContext = require("./usePickerRangePositionContext");

package/node/hooks/usePickerRangePositionContext.js

@@ -0,0 +1,22 @@
+"use strict";
+'use client';
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PickerRangePositionContext = void 0;
+exports.usePickerRangePositionContext = usePickerRangePositionContext;
+var React = _interopRequireWildcard(require("react"));
+const PickerRangePositionContext = exports.PickerRangePositionContext = /*#__PURE__*/React.createContext(null);
+
+/**
+ * Returns information about the range position of the picker that wraps the current component.
+ */
+function usePickerRangePositionContext() {
+  const value = React.useContext(PickerRangePositionContext);
+  if (value == null) {
+    throw new Error(['MUI X: The `usePickerRangePositionContext` can only be called in components that are used inside a picker component'].join('\n'));
+  }
+  return value;
+}

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers-pro v8.0.0-alpha.6
+ * @mui/x-date-pickers-pro v8.0.0-alpha.7
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the
@@ -219,6 +219,17 @@ Object.keys(_models).forEach(function (key) {
     }
   });
 });
+var _hooks = require("./hooks");
+Object.keys(_hooks).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _hooks[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _hooks[key];
+    }
+  });
+});
 var _validation = require("./validation");
 Object.keys(_validation).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -229,4 +240,15 @@ Object.keys(_validation).forEach(function (key) {
       return _validation[key];
     }
   });
+});
+var _managers = require("./managers");
+Object.keys(_managers).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _managers[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _managers[key];
+    }
+  });
 });

package/node/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js

@@ -16,6 +16,7 @@ var _internals = require("@mui/x-date-pickers/internals");
 var _useEnrichedRangePickerFieldProps = require("../useEnrichedRangePickerFieldProps");
 var _releaseInfo = require("../../utils/releaseInfo");
 var _useRangePosition = require("../useRangePosition");
+var _usePickerRangePositionContext = require("../../../hooks/usePickerRangePositionContext");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["props"];
 const releaseInfo = (0, _releaseInfo.getReleaseInfo)();
@@ -54,20 +55,16 @@ const useDesktopRangePicker = _ref => {
   const singleInputFieldRef = React.useRef(null);
   const initialView = React.useRef(props.openTo ?? null);
   const fieldType = slots.field.fieldType ?? 'multi-input';
-  const {
-    rangePosition,
-    onRangePositionChange
-  } = (0, _useRangePosition.useRangePosition)(props, fieldType === 'single-input' ? singleInputFieldRef : undefined);
+  const rangePositionResponse = (0, _useRangePosition.useRangePosition)(props, fieldType === 'single-input' ? singleInputFieldRef : undefined);
   let fieldRef;
   if (fieldType === 'single-input') {
     fieldRef = singleInputFieldRef;
-  } else if (rangePosition === 'start') {
+  } else if (rangePositionResponse.rangePosition === 'start') {
     fieldRef = startFieldRef;
   } else {
     fieldRef = endFieldRef;
   }
   const {
-    layoutProps,
     providerProps,
     renderCurrentView,
     shouldRestoreFocus,
@@ -78,11 +75,7 @@ const useDesktopRangePicker = _ref => {
     variant: 'desktop',
     autoFocusView: false,
     fieldRef,
-    localeText,
-    additionalViewProps: {
-      rangePosition,
-      onRangePositionChange
-    }
+    localeText
   }));
   React.useEffect(() => {
     if (providerProps.contextValue.view) {
@@ -129,7 +122,7 @@ const useDesktopRangePicker = _ref => {
     }),
     ownerState
   });
-  const enrichedFieldProps = (0, _useEnrichedRangePickerFieldProps.useEnrichedRangePickerFieldProps)({
+  const enrichedFieldProps = (0, _useEnrichedRangePickerFieldProps.useEnrichedRangePickerFieldProps)((0, _extends2.default)({
     variant: 'desktop',
     fieldType,
     // These direct access to `providerProps` will go away once the range fields handle the picker opening
@@ -140,8 +133,6 @@ const useDesktopRangePicker = _ref => {
     label,
     localeText,
     onBlur: handleBlur,
-    rangePosition,
-    onRangePositionChange,
     pickerSlotProps: slotProps,
     pickerSlots: slots,
     fieldProps,
@@ -150,37 +141,29 @@ const useDesktopRangePicker = _ref => {
     endFieldRef,
     singleInputFieldRef,
     currentView: providerProps.contextValue.view !== props.openTo ? providerProps.contextValue.view : undefined,
-    initialView: initialView.current ?? undefined,
-    onViewChange: providerProps.contextValue.onViewChange
-  });
-  const slotPropsForLayout = (0, _extends2.default)({}, slotProps, {
-    tabs: (0, _extends2.default)({}, slotProps?.tabs, {
-      rangePosition,
-      onRangePositionChange
-    }),
-    toolbar: (0, _extends2.default)({}, slotProps?.toolbar, {
-      rangePosition,
-      onRangePositionChange
-    })
-  });
+    initialView: initialView.current ?? undefined
+  }, rangePositionResponse));
   const Layout = slots?.layout ?? _PickersLayout.PickersLayout;
-  const renderPicker = () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_internals.PickerProvider, (0, _extends2.default)({}, providerProps, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Field, (0, _extends2.default)({}, enrichedFieldProps)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_internals.PickersPopper, {
-      role: "tooltip",
-      placement: "bottom-start",
-      containerRef: popperRef,
-      anchorEl: anchorRef.current,
-      onBlur: handleBlur,
-      slots: slots,
-      slotProps: slotProps,
-      shouldRestoreFocus: shouldRestoreFocus,
-      reduceAnimations: reduceAnimations,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Layout, (0, _extends2.default)({}, layoutProps, slotProps?.layout, {
+  const renderPicker = () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_internals.PickerProvider, (0, _extends2.default)({}, providerProps, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_usePickerRangePositionContext.PickerRangePositionContext.Provider, {
+      value: rangePositionResponse,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Field, (0, _extends2.default)({}, enrichedFieldProps)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_internals.PickersPopper, {
+        role: "tooltip",
+        placement: "bottom-start",
+        containerRef: popperRef,
+        anchorEl: anchorRef.current,
+        onBlur: handleBlur,
         slots: slots,
-        slotProps: slotPropsForLayout,
-        children: renderCurrentView()
-      }))
-    })]
+        slotProps: slotProps,
+        shouldRestoreFocus: shouldRestoreFocus,
+        reduceAnimations: reduceAnimations,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Layout, (0, _extends2.default)({}, slotProps?.layout, {
+          slots: slots,
+          slotProps: slotProps,
+          children: renderCurrentView()
+        }))
+      })]
+    })
   }));
   return {
     renderPicker

package/node/internals/hooks/useEnrichedRangePickerFieldProps.js

@@ -32,7 +32,7 @@ const useMultiInputFieldSlotProps = ({
   anchorRef,
   currentView,
   initialView,
-  onViewChange,
+  setView,
   startFieldRef,
   endFieldRef
 }) => {
@@ -78,7 +78,7 @@ const useMultiInputFieldSlotProps = ({
     if (open) {
       onRangePositionChange('start');
       if (previousRangePosition.current !== 'start' && initialView) {
-        onViewChange?.(initialView);
+        setView?.(initialView);
       }
     }
   };
@@ -86,7 +86,7 @@ const useMultiInputFieldSlotProps = ({
     if (open) {
       onRangePositionChange('end');
       if (previousRangePosition.current !== 'end' && initialView) {
-        onViewChange?.(initialView);
+        setView?.(initialView);
       }
     }
   };

package/node/internals/hooks/useMobileRangePicker/useMobileRangePicker.js

@@ -18,6 +18,7 @@ var _useId = _interopRequireDefault(require("@mui/utils/useId"));
 var _useEnrichedRangePickerFieldProps = require("../useEnrichedRangePickerFieldProps");
 var _releaseInfo = require("../../utils/releaseInfo");
 var _useRangePosition = require("../useRangePosition");
+var _usePickerRangePositionContext = require("../../../hooks/usePickerRangePositionContext");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["props"];
 const releaseInfo = (0, _releaseInfo.getReleaseInfo)();
@@ -50,22 +51,18 @@ const useMobileRangePicker = _ref => {
   const endFieldRef = React.useRef(null);
   const singleInputFieldRef = React.useRef(null);
   const fieldType = slots.field.fieldType ?? 'multi-input';
-  const {
-    rangePosition,
-    onRangePositionChange
-  } = (0, _useRangePosition.useRangePosition)(props, fieldType === 'single-input' ? singleInputFieldRef : undefined);
+  const rangePositionResponse = (0, _useRangePosition.useRangePosition)(props, fieldType === 'single-input' ? singleInputFieldRef : undefined);
   const labelId = (0, _useId.default)();
   const contextTranslations = (0, _hooks.usePickerTranslations)();
   let fieldRef;
   if (fieldType === 'single-input') {
     fieldRef = singleInputFieldRef;
-  } else if (rangePosition === 'start') {
+  } else if (rangePositionResponse.rangePosition === 'start') {
     fieldRef = startFieldRef;
   } else {
     fieldRef = endFieldRef;
   }
   const {
-    layoutProps,
     providerProps,
     renderCurrentView,
     fieldProps: pickerFieldProps,
@@ -75,11 +72,7 @@ const useMobileRangePicker = _ref => {
     variant: 'mobile',
     autoFocusView: true,
     fieldRef,
-    localeText,
-    additionalViewProps: {
-      rangePosition,
-      onRangePositionChange
-    }
+    localeText
   }));
   const Field = slots.field;
   const fieldProps = (0, _useSlotProps.default)({
@@ -109,7 +102,7 @@ const useMobileRangePicker = _ref => {
     ownerState
   });
   const isToolbarHidden = innerSlotProps?.toolbar?.hidden ?? false;
-  const enrichedFieldProps = (0, _useEnrichedRangePickerFieldProps.useEnrichedRangePickerFieldProps)({
+  const enrichedFieldProps = (0, _useEnrichedRangePickerFieldProps.useEnrichedRangePickerFieldProps)((0, _extends2.default)({
     variant: 'mobile',
     fieldType,
     // These direct access to `providerProps` will go away once the range fields handle the picker opening
@@ -120,26 +113,13 @@ const useMobileRangePicker = _ref => {
     disableOpenPicker,
     label,
     localeText,
-    rangePosition,
-    onRangePositionChange,
     pickerSlots: slots,
     pickerSlotProps: innerSlotProps,
     fieldProps,
     startFieldRef,
     endFieldRef,
     singleInputFieldRef
-  });
-  const slotPropsForLayout = (0, _extends2.default)({}, innerSlotProps, {
-    tabs: (0, _extends2.default)({}, innerSlotProps?.tabs, {
-      rangePosition,
-      onRangePositionChange
-    }),
-    toolbar: (0, _extends2.default)({}, innerSlotProps?.toolbar, {
-      titleId: labelId,
-      rangePosition,
-      onRangePositionChange
-    })
-  });
+  }, rangePositionResponse));
   const Layout = slots?.layout ?? _PickersLayout.PickersLayout;
   const finalLocaleText = (0, _extends2.default)({}, contextTranslations, localeText);
   let labelledById = pickerParams.valueType === 'date-time' ? `${labelId}-start-toolbar ${labelId}-end-toolbar` : labelId;
@@ -158,20 +138,26 @@ const useMobileRangePicker = _ref => {
     labelledById = labels.length > 0 ? labels.join(' ') : undefined;
   }
   const slotProps = (0, _extends2.default)({}, innerSlotProps, {
+    toolbar: (0, _extends2.default)({}, innerSlotProps?.toolbar, {
+      titleId: labelId
+    }),
     mobilePaper: (0, _extends2.default)({
       'aria-labelledby': labelledById
     }, innerSlotProps?.mobilePaper)
   });
-  const renderPicker = () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_internals.PickerProvider, (0, _extends2.default)({}, providerProps, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Field, (0, _extends2.default)({}, enrichedFieldProps)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_internals.PickersModalDialog, {
-      slots: slots,
-      slotProps: slotProps,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Layout, (0, _extends2.default)({}, layoutProps, slotProps?.layout, {
+  const renderPicker = () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_internals.PickerProvider, (0, _extends2.default)({}, providerProps, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_usePickerRangePositionContext.PickerRangePositionContext.Provider, {
+      value: rangePositionResponse,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Field, (0, _extends2.default)({}, enrichedFieldProps)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_internals.PickersModalDialog, {
         slots: slots,
-        slotProps: slotPropsForLayout,
-        children: renderCurrentView()
-      }))
-    })]
+        slotProps: slotProps,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Layout, (0, _extends2.default)({}, slotProps?.layout, {
+          slots: slots,
+          slotProps: slotProps,
+          children: renderCurrentView()
+        }))
+      })]
+    })
   }));
   return {
     renderPicker

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

@@ -14,14 +14,19 @@ var _validation2 = require("../../../validation");
 var _valueManagers = require("../../utils/valueManagers");
 var _shared = require("./shared");
 var _useMultiInputFieldSelectedSections = require("../useMultiInputFieldSelectedSections");
+var _managers = require("../../../managers");
 const useMultiInputDateRangeField = ({
-  sharedProps: inSharedProps,
+  sharedProps,
   startTextFieldProps,
   unstableStartFieldRef,
   endTextFieldProps,
   unstableEndFieldRef
 }) => {
-  const sharedProps = (0, _internals.useDefaultizedDateField)(inSharedProps);
+  const manager = (0, _managers.useDateRangeManager)(sharedProps);
+  const sharedPropsWithDefaults = (0, _internals.useFieldInternalPropsWithDefaults)({
+    manager,
+    internalProps: sharedProps
+  });
   const {
     value: valueProp,
     defaultValue,
@@ -37,7 +42,7 @@ const useMultiInputDateRangeField = ({
     timezone: timezoneProp,
     enableAccessibleFieldDOMStructure,
     autoFocus
-  } = sharedProps;
+  } = sharedPropsWithDefaults;
   const {
     value,
     handleValueChange,
@@ -55,11 +60,11 @@ const useMultiInputDateRangeField = ({
     validationError,
     getValidationErrorForNewValue
   } = (0, _validation.useValidation)({
-    props: sharedProps,
+    props: sharedPropsWithDefaults,
     value,
     timezone,
     validator: _validation2.validateDateRange,
-    onError: sharedProps.onError
+    onError: sharedPropsWithDefaults.onError
   });
 
   // TODO: Maybe export utility from `useField` instead of copy/pasting the logic

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

@@ -14,14 +14,19 @@ var _validation2 = require("../../../validation");
 var _valueManagers = require("../../utils/valueManagers");
 var _shared = require("./shared");
 var _useMultiInputFieldSelectedSections = require("../useMultiInputFieldSelectedSections");
+var _managers = require("../../../managers");
 const useMultiInputDateTimeRangeField = ({
-  sharedProps: inSharedProps,
+  sharedProps,
   startTextFieldProps,
   unstableStartFieldRef,
   endTextFieldProps,
   unstableEndFieldRef
 }) => {
-  const sharedProps = (0, _internals.useDefaultizedDateTimeField)(inSharedProps);
+  const manager = (0, _managers.useDateTimeRangeManager)(sharedProps);
+  const sharedPropsWithDefaults = (0, _internals.useFieldInternalPropsWithDefaults)({
+    manager,
+    internalProps: sharedProps
+  });
   const {
     value: valueProp,
     defaultValue,
@@ -37,13 +42,13 @@ const useMultiInputDateTimeRangeField = ({
     timezone: timezoneProp,
     enableAccessibleFieldDOMStructure,
     autoFocus
-  } = sharedProps;
+  } = sharedPropsWithDefaults;
   const {
     value,
     handleValueChange,
     timezone
   } = (0, _internals.useControlledValueWithTimezone)({
-    name: 'useMultiInputDateRangeField',
+    name: 'useMultiInputDateTimeRangeField',
     timezone: timezoneProp,
     value: valueProp,
     defaultValue,
@@ -55,11 +60,11 @@ const useMultiInputDateTimeRangeField = ({
     validationError,
     getValidationErrorForNewValue
   } = (0, _validation.useValidation)({
-    props: sharedProps,
+    props: sharedPropsWithDefaults,
     value,
     timezone,
     validator: _validation2.validateDateTimeRange,
-    onError: sharedProps.onError
+    onError: sharedPropsWithDefaults.onError
   });
 
   // TODO: Maybe export utility from `useField` instead of copy/pasting the logic

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

@@ -14,14 +14,19 @@ var _validation2 = require("../../../validation");
 var _valueManagers = require("../../utils/valueManagers");
 var _shared = require("./shared");
 var _useMultiInputFieldSelectedSections = require("../useMultiInputFieldSelectedSections");
+var _managers = require("../../../managers");
 const useMultiInputTimeRangeField = ({
-  sharedProps: inSharedProps,
+  sharedProps,
   startTextFieldProps,
   unstableStartFieldRef,
   endTextFieldProps,
   unstableEndFieldRef
 }) => {
-  const sharedProps = (0, _internals.useDefaultizedTimeField)(inSharedProps);
+  const manager = (0, _managers.useTimeRangeManager)(sharedProps);
+  const sharedPropsWithDefaults = (0, _internals.useFieldInternalPropsWithDefaults)({
+    manager,
+    internalProps: sharedProps
+  });
   const {
     value: valueProp,
     defaultValue,
@@ -37,13 +42,13 @@ const useMultiInputTimeRangeField = ({
     timezone: timezoneProp,
     enableAccessibleFieldDOMStructure,
     autoFocus
-  } = sharedProps;
+  } = sharedPropsWithDefaults;
   const {
     value,
     handleValueChange,
     timezone
   } = (0, _internals.useControlledValueWithTimezone)({
-    name: 'useMultiInputDateRangeField',
+    name: 'useMultiInputTimeRangeField',
     timezone: timezoneProp,
     value: valueProp,
     defaultValue,
@@ -55,11 +60,11 @@ const useMultiInputTimeRangeField = ({
     validationError,
     getValidationErrorForNewValue
   } = (0, _validation.useValidation)({
-    props: sharedProps,
-    validator: _validation2.validateTimeRange,
+    props: sharedPropsWithDefaults,
     value,
     timezone,
-    onError: sharedProps.onError
+    validator: _validation2.validateTimeRange,
+    onError: sharedPropsWithDefaults.onError
   });
 
   // TODO: Maybe export utility from `useField` instead of copy/pasting the logic

package/node/internals/hooks/useNullablePickerRangePositionContext.js

@@ -0,0 +1,16 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useNullablePickerRangePositionContext = useNullablePickerRangePositionContext;
+var React = _interopRequireWildcard(require("react"));
+var _usePickerRangePositionContext = require("../../hooks/usePickerRangePositionContext");
+/**
+ * Returns information about the range position of the picker that wraps the current component.
+ * If no picker wraps the current component, returns `null`.
+ */
+function useNullablePickerRangePositionContext() {
+  return React.useContext(_usePickerRangePositionContext.PickerRangePositionContext);
+}

package/node/internals/hooks/useStaticRangePicker/useStaticRangePicker.js

@@ -14,6 +14,7 @@ var _styles = require("@mui/material/styles");
 var _PickersLayout = require("@mui/x-date-pickers/PickersLayout");
 var _internals = require("@mui/x-date-pickers/internals");
 var _useRangePosition = require("../useRangePosition");
+var _usePickerRangePositionContext = require("../../../hooks/usePickerRangePositionContext");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["props", "ref"];
 const PickerStaticLayout = (0, _styles.styled)(_PickersLayout.PickersLayout)(({
@@ -43,12 +44,8 @@ const useStaticRangePicker = _ref => {
     displayStaticWrapperAs,
     autoFocus
   } = props;
+  const rangePositionResponse = (0, _useRangePosition.useRangePosition)(props);
   const {
-    rangePosition,
-    onRangePositionChange
-  } = (0, _useRangePosition.useRangePosition)(props);
-  const {
-    layoutProps,
     providerProps,
     renderCurrentView
   } = (0, _internals.usePicker)((0, _extends2.default)({}, pickerParams, {
@@ -56,29 +53,22 @@ const useStaticRangePicker = _ref => {
     autoFocusView: autoFocus ?? false,
     fieldRef: undefined,
     localeText,
-    additionalViewProps: {
-      rangePosition,
-      onRangePositionChange
-    },
     variant: displayStaticWrapperAs
   }));
   const Layout = slots?.layout ?? PickerStaticLayout;
-  const slotPropsForLayout = (0, _extends2.default)({}, slotProps, {
-    toolbar: (0, _extends2.default)({}, slotProps?.toolbar, {
-      rangePosition,
-      onRangePositionChange
-    })
-  });
-  const renderPicker = () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_internals.PickerProvider, (0, _extends2.default)({}, providerProps, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Layout, (0, _extends2.default)({}, 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: (0, _clsx.default)(className, slotProps?.layout?.className),
-      ref: ref,
-      children: renderCurrentView()
+  const renderPicker = () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_usePickerRangePositionContext.PickerRangePositionContext.Provider, {
+    value: rangePositionResponse,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_internals.PickerProvider, (0, _extends2.default)({}, providerProps, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Layout, (0, _extends2.default)({}, slotProps?.layout, {
+        slots: slots,
+        slotProps: slotProps,
+        sx: [...(Array.isArray(sx) ? sx : [sx]), ...(Array.isArray(slotProps?.layout?.sx) ? slotProps.layout.sx : [slotProps?.layout?.sx])],
+        className: (0, _clsx.default)(className, slotProps?.layout?.className),
+        ref: ref,
+        children: renderCurrentView()
+      }))
     }))
-  }));
+  });
   return {
     renderPicker
   };

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

@@ -15,7 +15,8 @@ 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/node/internals/utils/releaseInfo.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.getReleaseInfo = void 0;
 var _utils = require("@mui/utils");
 const getReleaseInfo = () => {
-  const releaseInfo = "MTczNTE2NDAwMDAwMA==";
+  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