@mui/x-date-pickers 7.19.0 → 7.21.0

package/node/internals/hooks/useField/useFieldCharacterEditing.js

@@ -206,7 +206,7 @@ const useFieldCharacterEditing = ({
       // When editing a letter-format month and the user presses a digit,
       // We can support the numeric editing by using the digit-format month and re-formatting the result.
       if (activeSection.type === 'month') {
-        const hasLeadingZerosInFormat = (0, _useField.doesSectionFormatHaveLeadingZeros)(utils, timezone, 'digit', 'month', 'MM');
+        const hasLeadingZerosInFormat = (0, _useField.doesSectionFormatHaveLeadingZeros)(utils, 'digit', 'month', 'MM');
         const response = getNewSectionValue(queryValue, {
           type: activeSection.type,
           format: 'MM',
@@ -231,7 +231,7 @@ const useFieldCharacterEditing = ({
         if (isQueryResponseWithoutValue(response)) {
           return response;
         }
-        const formattedValue = (0, _useField.getDaysInWeekStr)(utils, timezone, activeSection.format)[Number(response.sectionValue) - 1];
+        const formattedValue = (0, _useField.getDaysInWeekStr)(utils, activeSection.format)[Number(response.sectionValue) - 1];
         return (0, _extends2.default)({}, response, {
           sectionValue: formattedValue
         });

package/node/internals/hooks/useField/useFieldState.js

@@ -56,7 +56,6 @@ const useFieldState = params => {
   const sectionsValueBoundaries = React.useMemo(() => (0, _useField.getSectionsBoundaries)(utils, localizedDigits, timezone), [utils, localizedDigits, timezone]);
   const getSectionsFromValue = React.useCallback((value, fallbackSections = null) => fieldValueManager.getSectionsFromValue(utils, value, fallbackSections, date => (0, _buildSectionsFromFormat.buildSectionsFromFormat)({
     utils,
-    timezone,
     localeText: translations,
     localizedDigits,
     format,
@@ -65,7 +64,7 @@ const useFieldState = params => {
     shouldRespectLeadingZeros,
     enableAccessibleFieldDOMStructure,
     isRtl
-  })), [fieldValueManager, format, translations, localizedDigits, isRtl, shouldRespectLeadingZeros, utils, formatDensity, timezone, enableAccessibleFieldDOMStructure]);
+  })), [fieldValueManager, format, translations, localizedDigits, isRtl, shouldRespectLeadingZeros, utils, formatDensity, enableAccessibleFieldDOMStructure]);
   const [state, setState] = React.useState(() => {
     const sections = getSectionsFromValue(valueFromTheOutside);
     (0, _useField.validateSections)(sections, valueType);
@@ -162,7 +161,6 @@ const useFieldState = params => {
       }
       const sections = (0, _buildSectionsFromFormat.buildSectionsFromFormat)({
         utils,
-        timezone,
         localeText: translations,
         localizedDigits,
         format,
@@ -172,7 +170,7 @@ const useFieldState = params => {
         enableAccessibleFieldDOMStructure,
         isRtl
       });
-      return (0, _useField.mergeDateIntoReferenceDate)(utils, timezone, date, sections, referenceDate, false);
+      return (0, _useField.mergeDateIntoReferenceDate)(utils, date, sections, referenceDate, false);
     };
     const newValue = fieldValueManager.parseValueStr(valueStr, state.referenceValue, parseDateStr);
     const newReferenceValue = fieldValueManager.updateReferenceValue(utils, newValue, state.referenceValue);
@@ -210,7 +208,7 @@ const useFieldState = params => {
      * This makes sure that we don't lose some information of the initial date (like the time on a date field).
      */
     if (newActiveDate != null && utils.isValid(newActiveDate)) {
-      const mergedDate = (0, _useField.mergeDateIntoReferenceDate)(utils, timezone, newActiveDate, newActiveDateSections, activeDateManager.referenceDate, true);
+      const mergedDate = (0, _useField.mergeDateIntoReferenceDate)(utils, newActiveDate, newActiveDateSections, activeDateManager.referenceDate, true);
       values = activeDateManager.getNewValuesFromNewActiveDate(mergedDate);
       shouldPublish = true;
     } else {

package/node/internals/hooks/useMobilePicker/useMobilePicker.js

@@ -15,8 +15,8 @@ var _useId = _interopRequireDefault(require("@mui/utils/useId"));
 var _PickersModalDialog = require("../../components/PickersModalDialog");
 var _usePicker = require("../usePicker");
 var _utils = require("../../utils/utils");
-var _LocalizationProvider = require("../../../LocalizationProvider");
 var _PickersLayout = require("../../../PickersLayout");
+var _PickersProvider = require("../../components/PickersProvider");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["props", "getOpenDialogAriaText"];
 /**
@@ -57,7 +57,8 @@ const useMobilePicker = _ref => {
     actions,
     layoutProps,
     renderCurrentView,
-    fieldProps: pickerFieldProps
+    fieldProps: pickerFieldProps,
+    contextValue
   } = (0, _usePicker.usePicker)((0, _extends2.default)({}, pickerParams, {
     props,
     fieldRef,
@@ -118,7 +119,8 @@ const useMobilePicker = _ref => {
     }, innerSlotProps?.mobilePaper)
   });
   const handleFieldRef = (0, _useForkRef.default)(fieldRef, fieldProps.unstableFieldRef);
-  const renderPicker = () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_LocalizationProvider.LocalizationProvider, {
+  const renderPicker = () => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_PickersProvider.PickersProvider, {
+    contextValue: contextValue,
     localeText: localeText,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Field, (0, _extends2.default)({}, fieldProps, {
       slots: slotsForField,

package/node/internals/hooks/usePicker/usePicker.js

@@ -8,6 +8,7 @@ var _warning = require("@mui/x-internals/warning");
 var _usePickerValue = require("./usePickerValue");
 var _usePickerViews = require("./usePickerViews");
 var _usePickerLayoutProps = require("./usePickerLayoutProps");
+var _usePickerOwnerState = require("./usePickerOwnerState");
 const usePicker = ({
   props,
   valueManager,
@@ -45,6 +46,10 @@ const usePicker = ({
     propsFromPickerValue: pickerValueResponse.layoutProps,
     propsFromPickerViews: pickerViewsResponse.layoutProps
   });
+  const pickerOwnerState = (0, _usePickerOwnerState.usePickerOwnerState)({
+    props,
+    pickerValueResponse
+  });
   return {
     // Picker value
     open: pickerValueResponse.open,
@@ -55,7 +60,11 @@ const usePicker = ({
     hasUIView: pickerViewsResponse.hasUIView,
     shouldRestoreFocus: pickerViewsResponse.shouldRestoreFocus,
     // Picker layout
-    layoutProps: pickerLayoutResponse.layoutProps
+    layoutProps: pickerLayoutResponse.layoutProps,
+    // Picker context
+    contextValue: pickerValueResponse.contextValue,
+    // Picker owner state
+    ownerState: pickerOwnerState
   };
 };
 exports.usePicker = usePicker;

package/node/internals/hooks/usePicker/usePickerOwnerState.js

@@ -0,0 +1,20 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.usePickerOwnerState = usePickerOwnerState;
+var React = _interopRequireWildcard(require("react"));
+function usePickerOwnerState(parameters) {
+  const {
+    props,
+    pickerValueResponse
+  } = parameters;
+  return React.useMemo(() => ({
+    value: pickerValueResponse.viewProps.value,
+    open: pickerValueResponse.open,
+    disabled: props.disabled ?? false,
+    readOnly: props.readOnly ?? false
+  }), [pickerValueResponse.viewProps.value, pickerValueResponse.open, props.disabled, props.readOnly]);
+}

package/node/internals/hooks/usePicker/usePickerValue.js

@@ -341,12 +341,18 @@ const usePickerValue = ({
     onSelectShortcut: handleSelectShortcut,
     isValid
   });
+  const contextValue = React.useMemo(() => ({
+    onOpen: handleOpen,
+    onClose: handleClose,
+    open: isOpen
+  }), [isOpen, handleClose, handleOpen]);
   return {
     open: isOpen,
     fieldProps: fieldResponse,
     viewProps: viewResponse,
     layoutProps: layoutResponse,
-    actions
+    actions,
+    contextValue
   };
 };
 exports.usePickerValue = usePickerValue;

package/node/internals/index.js

@@ -45,6 +45,12 @@ Object.defineProperty(exports, "PickersPopper", {
     return _PickersPopper.PickersPopper;
   }
 });
+Object.defineProperty(exports, "PickersProvider", {
+  enumerable: true,
+  get: function () {
+    return _PickersProvider.PickersProvider;
+  }
+});
 Object.defineProperty(exports, "PickersToolbar", {
   enumerable: true,
   get: function () {
@@ -304,6 +310,7 @@ Object.defineProperty(exports, "useViews", {
   }
 });
 var _PickersArrowSwitcher = require("./components/PickersArrowSwitcher/PickersArrowSwitcher");
+var _PickersProvider = require("./components/PickersProvider");
 var _PickersModalDialog = require("./components/PickersModalDialog");
 var _PickersPopper = require("./components/PickersPopper");
 var _PickersToolbar = require("./components/PickersToolbar");

package/node/internals/utils/utils.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.DEFAULT_DESKTOP_MODE_MEDIA_QUERY = void 0;
 exports.arrayIncludes = arrayIncludes;
-exports.onSpaceOrEnter = exports.getActiveElement = exports.executeInTheNextEventLoopTick = void 0;
+exports.onSpaceOrEnter = exports.getFocusedListItemIndex = exports.getActiveElement = exports.executeInTheNextEventLoopTick = void 0;
 /* Use it instead of .includes method for IE support */
 function arrayIncludes(array, itemOrItems) {
   if (Array.isArray(itemOrItems)) {
@@ -42,5 +42,17 @@ const getActiveElement = (root = document) => {
   }
   return activeEl;
 };
+
+/**
+ * Gets the index of the focused list item in a given ul list element.
+ *
+ * @param {HTMLUListElement} listElement - The list element to search within.
+ * @returns {number} The index of the focused list item, or -1 if none is focused.
+ */
 exports.getActiveElement = getActiveElement;
+const getFocusedListItemIndex = listElement => {
+  const children = Array.from(listElement.children);
+  return children.indexOf(getActiveElement(document));
+};
+exports.getFocusedListItemIndex = getFocusedListItemIndex;
 const DEFAULT_DESKTOP_MODE_MEDIA_QUERY = exports.DEFAULT_DESKTOP_MODE_MEDIA_QUERY = '@media (pointer: fine)';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-date-pickers",
-  "version": "7.19.0",
+  "version": "7.21.0",
   "description": "The community edition of the Date and Time Picker components (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -35,13 +35,13 @@
     "directory": "packages/x-date-pickers"
   },
   "dependencies": {
-    "@babel/runtime": "^7.25.6",
-    "@mui/utils": "^5.16.6",
+    "@babel/runtime": "^7.25.7",
+    "@mui/utils": "^5.16.6 || ^6.0.0",
     "@types/react-transition-group": "^4.4.11",
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "react-transition-group": "^4.4.5",
-    "@mui/x-internals": "7.18.0"
+    "@mui/x-internals": "7.21.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",