@mui/x-date-pickers 7.0.0-beta.2 → 7.0.0-beta.5

package/node/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -185,10 +185,13 @@ DesktopDateTimePicker.propTypes = {
    * If `true`, the week number will be display in the calendar.
    */
   displayWeekNumber: _propTypes.default.bool,
+  /**
+   * @default false
+   */
+  enableAccessibleFieldDOMStructure: _propTypes.default.any,
   /**
    * The day view will show as many weeks as needed after the end of the current month to match this value.
    * Put it to 6 to have a fixed number of weeks in Gregorian calendars
-   * @default undefined
    */
   fixedWeekNumber: _propTypes.default.number,
   /**
@@ -352,17 +355,14 @@ DesktopDateTimePicker.propTypes = {
   renderLoading: _propTypes.default.func,
   /**
    * The currently selected sections.
-   * This prop accept four formats:
+   * This prop accepts four formats:
    * 1. If a number is provided, the section at this index will be selected.
-   * 2. If an object with a `startIndex` and `endIndex` properties are provided, the sections between those two indexes will be selected.
-   * 3. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
-   * 4. If `null` is provided, no section will be selected
+   * 2. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
+   * 3. If `"all"` is provided, all the sections will be selected.
+   * 4. If `null` is provided, no section will be selected.
    * If not provided, the selected sections will be handled internally.
    */
-  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number, _propTypes.default.shape({
-    endIndex: _propTypes.default.number.isRequired,
-    startIndex: _propTypes.default.number.isRequired
-  })]),
+  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number]),
   /**
    * Disable specific date.
    *

package/node/DesktopTimePicker/DesktopTimePicker.js

@@ -152,6 +152,10 @@ DesktopTimePicker.propTypes = {
    * @default false
    */
   disablePast: _propTypes.default.bool,
+  /**
+   * @default false
+   */
+  enableAccessibleFieldDOMStructure: _propTypes.default.any,
   /**
    * Format of the date when rendered in the input(s).
    * Defaults to localized format based on the used `views`.
@@ -268,17 +272,14 @@ DesktopTimePicker.propTypes = {
   referenceDate: _propTypes.default.object,
   /**
    * The currently selected sections.
-   * This prop accept four formats:
+   * This prop accepts four formats:
    * 1. If a number is provided, the section at this index will be selected.
-   * 2. If an object with a `startIndex` and `endIndex` properties are provided, the sections between those two indexes will be selected.
-   * 3. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
-   * 4. If `null` is provided, no section will be selected
+   * 2. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
+   * 3. If `"all"` is provided, all the sections will be selected.
+   * 4. If `null` is provided, no section will be selected.
    * If not provided, the selected sections will be handled internally.
    */
-  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number, _propTypes.default.shape({
-    endIndex: _propTypes.default.number.isRequired,
-    startIndex: _propTypes.default.number.isRequired
-  })]),
+  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number]),
   /**
    * Disable specific time.
    * @template TDate

package/node/LocalizationProvider/LocalizationProvider.js

@@ -115,6 +115,7 @@ process.env.NODE_ENV !== "production" ? LocalizationProvider.propTypes = {
    */
   dateFormats: _propTypes.default.shape({
     dayOfMonth: _propTypes.default.string,
+    dayOfMonthFull: _propTypes.default.string,
     fullDate: _propTypes.default.string,
     fullTime: _propTypes.default.string,
     fullTime12h: _propTypes.default.string,

package/node/MobileDatePicker/MobileDatePicker.js

@@ -129,10 +129,13 @@ MobileDatePicker.propTypes = {
    * If `true`, the week number will be display in the calendar.
    */
   displayWeekNumber: _propTypes.default.bool,
+  /**
+   * @default false
+   */
+  enableAccessibleFieldDOMStructure: _propTypes.default.any,
   /**
    * The day view will show as many weeks as needed after the end of the current month to match this value.
    * Put it to 6 to have a fixed number of weeks in Gregorian calendars
-   * @default undefined
    */
   fixedWeekNumber: _propTypes.default.number,
   /**
@@ -273,17 +276,14 @@ MobileDatePicker.propTypes = {
   renderLoading: _propTypes.default.func,
   /**
    * The currently selected sections.
-   * This prop accept four formats:
+   * This prop accepts four formats:
    * 1. If a number is provided, the section at this index will be selected.
-   * 2. If an object with a `startIndex` and `endIndex` properties are provided, the sections between those two indexes will be selected.
-   * 3. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
-   * 4. If `null` is provided, no section will be selected
+   * 2. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
+   * 3. If `"all"` is provided, all the sections will be selected.
+   * 4. If `null` is provided, no section will be selected.
    * If not provided, the selected sections will be handled internally.
    */
-  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number, _propTypes.default.shape({
-    endIndex: _propTypes.default.number.isRequired,
-    startIndex: _propTypes.default.number.isRequired
-  })]),
+  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number]),
   /**
    * Disable specific date.
    *

package/node/MobileDateTimePicker/MobileDateTimePicker.js

@@ -154,10 +154,13 @@ MobileDateTimePicker.propTypes = {
    * If `true`, the week number will be display in the calendar.
    */
   displayWeekNumber: _propTypes.default.bool,
+  /**
+   * @default false
+   */
+  enableAccessibleFieldDOMStructure: _propTypes.default.any,
   /**
    * The day view will show as many weeks as needed after the end of the current month to match this value.
    * Put it to 6 to have a fixed number of weeks in Gregorian calendars
-   * @default undefined
    */
   fixedWeekNumber: _propTypes.default.number,
   /**
@@ -321,17 +324,14 @@ MobileDateTimePicker.propTypes = {
   renderLoading: _propTypes.default.func,
   /**
    * The currently selected sections.
-   * This prop accept four formats:
+   * This prop accepts four formats:
    * 1. If a number is provided, the section at this index will be selected.
-   * 2. If an object with a `startIndex` and `endIndex` properties are provided, the sections between those two indexes will be selected.
-   * 3. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
-   * 4. If `null` is provided, no section will be selected
+   * 2. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
+   * 3. If `"all"` is provided, all the sections will be selected.
+   * 4. If `null` is provided, no section will be selected.
    * If not provided, the selected sections will be handled internally.
    */
-  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number, _propTypes.default.shape({
-    endIndex: _propTypes.default.number.isRequired,
-    startIndex: _propTypes.default.number.isRequired
-  })]),
+  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number]),
   /**
    * Disable specific date.
    *

package/node/MobileTimePicker/MobileTimePicker.js

@@ -131,6 +131,10 @@ MobileTimePicker.propTypes = {
    * @default false
    */
   disablePast: _propTypes.default.bool,
+  /**
+   * @default false
+   */
+  enableAccessibleFieldDOMStructure: _propTypes.default.any,
   /**
    * Format of the date when rendered in the input(s).
    * Defaults to localized format based on the used `views`.
@@ -247,17 +251,14 @@ MobileTimePicker.propTypes = {
   referenceDate: _propTypes.default.object,
   /**
    * The currently selected sections.
-   * This prop accept four formats:
+   * This prop accepts four formats:
    * 1. If a number is provided, the section at this index will be selected.
-   * 2. If an object with a `startIndex` and `endIndex` properties are provided, the sections between those two indexes will be selected.
-   * 3. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
-   * 4. If `null` is provided, no section will be selected
+   * 2. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
+   * 3. If `"all"` is provided, all the sections will be selected.
+   * 4. If `null` is provided, no section will be selected.
    * If not provided, the selected sections will be handled internally.
    */
-  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number, _propTypes.default.shape({
-    endIndex: _propTypes.default.number.isRequired,
-    startIndex: _propTypes.default.number.isRequired
-  })]),
+  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number]),
   /**
    * Disable specific time.
    * @template TDate

package/node/MultiSectionDigitalClock/MultiSectionDigitalClock.js

@@ -238,7 +238,7 @@ const MultiSectionDigitalClock = exports.MultiSectionDigitalClock = /*#__PURE__*
               value,
               ampm,
               utils,
-              isDisabled: hours => disabled || isTimeDisabled(hours, 'hours'),
+              isDisabled: hours => isTimeDisabled(hours, 'hours'),
               timeStep: timeSteps.hours,
               resolveAriaLabel: localeText.hoursClockNumberText,
               valueOrReferenceDate
@@ -254,7 +254,7 @@ const MultiSectionDigitalClock = exports.MultiSectionDigitalClock = /*#__PURE__*
             items: (0, _MultiSectionDigitalClock.getTimeSectionOptions)({
               value: utils.getMinutes(valueOrReferenceDate),
               utils,
-              isDisabled: minutes => disabled || isTimeDisabled(minutes, 'minutes'),
+              isDisabled: minutes => isTimeDisabled(minutes, 'minutes'),
               resolveLabel: minutes => utils.format(utils.setMinutes(now, minutes), 'minutes'),
               timeStep: timeSteps.minutes,
               hasValue: !!value,
@@ -271,7 +271,7 @@ const MultiSectionDigitalClock = exports.MultiSectionDigitalClock = /*#__PURE__*
             items: (0, _MultiSectionDigitalClock.getTimeSectionOptions)({
               value: utils.getSeconds(valueOrReferenceDate),
               utils,
-              isDisabled: seconds => disabled || isTimeDisabled(seconds, 'seconds'),
+              isDisabled: seconds => isTimeDisabled(seconds, 'seconds'),
               resolveLabel: seconds => utils.format(utils.setSeconds(now, seconds), 'seconds'),
               timeStep: timeSteps.seconds,
               hasValue: !!value,
@@ -303,7 +303,7 @@ const MultiSectionDigitalClock = exports.MultiSectionDigitalClock = /*#__PURE__*
       default:
         throw new Error(`Unknown view: ${viewToBuild} found.`);
     }
-  }, [now, value, ampm, utils, timeSteps.hours, timeSteps.minutes, timeSteps.seconds, localeText.hoursClockNumberText, localeText.minutesClockNumberText, localeText.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, disabled, isTimeDisabled, handleMeridiemChange]);
+  }, [now, value, ampm, utils, timeSteps.hours, timeSteps.minutes, timeSteps.seconds, localeText.hoursClockNumberText, localeText.minutesClockNumberText, localeText.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, isTimeDisabled, handleMeridiemChange]);
   const viewTimeOptions = React.useMemo(() => {
     return views.reduce((result, currentView) => {
       return (0, _extends2.default)({}, result, {

package/node/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js

@@ -146,7 +146,9 @@ const MultiSectionDigitalClockSection = exports.MultiSectionDigitalClockSection
     role: "listbox"
   }, other, {
     children: items.map((option, index) => {
-      if (skipDisabled && option.isDisabled?.(option.value)) {
+      const isItemDisabled = option.isDisabled?.(option.value);
+      const isDisabled = disabled || isItemDisabled;
+      if (skipDisabled && isDisabled) {
         return null;
       }
       const isSelected = option.isSelected(option.value);
@@ -154,12 +156,12 @@ const MultiSectionDigitalClockSection = exports.MultiSectionDigitalClockSection
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(DigitalClockSectionItem, (0, _extends2.default)({
         onClick: () => !readOnly && onChange(option.value),
         selected: isSelected,
-        disabled: disabled || option.isDisabled?.(option.value),
+        disabled: isDisabled,
         disableRipple: readOnly,
         role: "option"
         // aria-readonly is not supported here and does not have any effect
         ,
-        "aria-disabled": readOnly,
+        "aria-disabled": readOnly || isDisabled || undefined,
         "aria-label": option.ariaLabel,
         "aria-selected": isSelected,
         tabIndex: tabIndex,

package/node/PickersLayout/PickersLayout.js

@@ -129,6 +129,9 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
   children: _propTypes.default.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: _propTypes.default.object,
   className: _propTypes.default.string,
   disabled: _propTypes.default.bool,
@@ -159,6 +162,9 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
    * @default {}
    */
   slots: _propTypes.default.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
   value: _propTypes.default.any,
   view: _propTypes.default.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']),

package/node/PickersSectionList/PickersSectionList.js

@@ -8,7 +8,6 @@ exports.PickersSectionListSectionSeparator = exports.PickersSectionListSectionCo
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
-var _styled = _interopRequireDefault(require("@mui/system/styled"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _utils = require("@mui/base/utils");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
@@ -19,7 +18,7 @@ var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["slots", "slotProps", "elements", "sectionListRef"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const PickersSectionListRoot = exports.PickersSectionListRoot = (0, _styled.default)('div', {
+const PickersSectionListRoot = exports.PickersSectionListRoot = (0, _styles.styled)('div', {
   name: 'MuiPickersSectionList',
   slot: 'Root',
   overridesResolver: (props, styles) => styles.root
@@ -27,19 +26,19 @@ const PickersSectionListRoot = exports.PickersSectionListRoot = (0, _styled.defa
   direction: 'ltr /*! @noflip */',
   outline: 'none'
 });
-const PickersSectionListSection = exports.PickersSectionListSection = (0, _styled.default)('span', {
+const PickersSectionListSection = exports.PickersSectionListSection = (0, _styles.styled)('span', {
   name: 'MuiPickersSectionList',
   slot: 'Section',
   overridesResolver: (props, styles) => styles.section
 })({});
-const PickersSectionListSectionSeparator = exports.PickersSectionListSectionSeparator = (0, _styled.default)('span', {
+const PickersSectionListSectionSeparator = exports.PickersSectionListSectionSeparator = (0, _styles.styled)('span', {
   name: 'MuiPickersSectionList',
   slot: 'SectionSeparator',
   overridesResolver: (props, styles) => styles.sectionSeparator
 })({
   whiteSpace: 'pre'
 });
-const PickersSectionListSectionContent = exports.PickersSectionListSectionContent = (0, _styled.default)('span', {
+const PickersSectionListSectionContent = exports.PickersSectionListSectionContent = (0, _styles.styled)('span', {
   name: 'MuiPickersSectionList',
   slot: 'SectionContent',
   overridesResolver: (props, styles) => styles.sectionContent

package/node/PickersTextField/PickersFilledInput/PickersFilledInput.js

@@ -11,6 +11,7 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _FormControl = require("@mui/material/FormControl");
 var _styles = require("@mui/material/styles");
+var _utils = require("@mui/utils");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _pickersFilledInputClasses = require("./pickersFilledInputClasses");
 var _PickersInputBase = require("../PickersInputBase");
@@ -208,11 +209,10 @@ process.env.NODE_ENV !== "production" ? PickersFilledInput.propTypes = {
   hiddenLabel: _propTypes.default.bool,
   id: _propTypes.default.string,
   inputProps: _propTypes.default.object,
-  inputRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
-    current: _propTypes.default.object
-  })]),
+  inputRef: _utils.refType,
   label: _propTypes.default.node,
   margin: _propTypes.default.oneOf(['dense', 'none', 'normal']),
+  name: _propTypes.default.string,
   onChange: _propTypes.default.func.isRequired,
   onClick: _propTypes.default.func.isRequired,
   onInput: _propTypes.default.func.isRequired,

package/node/PickersTextField/PickersInput/PickersInput.js

@@ -11,6 +11,7 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _FormControl = require("@mui/material/FormControl");
 var _styles = require("@mui/material/styles");
+var _utils = require("@mui/utils");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _pickersInputClasses = require("./pickersInputClasses");
 var _PickersInputBase = require("../PickersInputBase");
@@ -166,11 +167,10 @@ process.env.NODE_ENV !== "production" ? PickersInput.propTypes = {
   fullWidth: _propTypes.default.bool,
   id: _propTypes.default.string,
   inputProps: _propTypes.default.object,
-  inputRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
-    current: _propTypes.default.object
-  })]),
+  inputRef: _utils.refType,
   label: _propTypes.default.node,
   margin: _propTypes.default.oneOf(['dense', 'none', 'normal']),
+  name: _propTypes.default.string,
   onChange: _propTypes.default.func.isRequired,
   onClick: _propTypes.default.func.isRequired,
   onInput: _propTypes.default.func.isRequired,

package/node/PickersTextField/PickersInputBase/PickersInputBase.js

@@ -12,13 +12,14 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _FormControl = require("@mui/material/FormControl");
 var _styles = require("@mui/material/styles");
 var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
+var _utils = require("@mui/utils");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _capitalize = _interopRequireDefault(require("@mui/utils/capitalize"));
 var _visuallyHidden = _interopRequireDefault(require("@mui/utils/visuallyHidden"));
 var _pickersInputBaseClasses = require("./pickersInputBaseClasses");
 var _PickersSectionList = require("../../PickersSectionList");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["elements", "areAllSectionsEmpty", "defaultValue", "label", "value", "onChange", "id", "autoFocus", "endAdornment", "startAdornment", "renderSuffix", "slots", "contentEditable", "tabIndex", "onInput", "onPaste", "onKeyDown", "fullWidth", "inputProps", "inputRef", "sectionListRef"];
+const _excluded = ["elements", "areAllSectionsEmpty", "defaultValue", "label", "value", "onChange", "id", "autoFocus", "endAdornment", "startAdornment", "renderSuffix", "slots", "contentEditable", "tabIndex", "onInput", "onPaste", "onKeyDown", "fullWidth", "name", "readOnly", "inputProps", "inputRef", "sectionListRef"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const round = value => Math.round(value * 1e5) / 1e5;
@@ -165,6 +166,8 @@ const PickersInputBase = exports.PickersInputBase = /*#__PURE__*/React.forwardRe
       onInput,
       onPaste,
       onKeyDown,
+      name,
+      readOnly,
       inputProps,
       inputRef,
       sectionListRef
@@ -241,12 +244,16 @@ const PickersInputBase = exports.PickersInputBase = /*#__PURE__*/React.forwardRe
         })
       }
     }), endAdornment, renderSuffix ? renderSuffix((0, _extends2.default)({}, muiFormControl)) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(PickersInputBaseInput, (0, _extends2.default)({
+      name: name,
       className: classes.input,
       value: value,
       onChange: onChange,
       id: id,
       "aria-hidden": "true",
-      tabIndex: -1
+      tabIndex: -1,
+      readOnly: readOnly,
+      required: muiFormControl.required,
+      disabled: muiFormControl.disabled
     }, inputProps, {
       ref: handleInputRef
     }))]
@@ -288,11 +295,10 @@ process.env.NODE_ENV !== "production" ? PickersInputBase.propTypes = {
   fullWidth: _propTypes.default.bool,
   id: _propTypes.default.string,
   inputProps: _propTypes.default.object,
-  inputRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
-    current: _propTypes.default.object
-  })]),
+  inputRef: _utils.refType,
   label: _propTypes.default.node,
   margin: _propTypes.default.oneOf(['dense', 'none', 'normal']),
+  name: _propTypes.default.string,
   onChange: _propTypes.default.func.isRequired,
   onClick: _propTypes.default.func.isRequired,
   onInput: _propTypes.default.func.isRequired,

package/node/PickersTextField/PickersOutlinedInput/PickersOutlinedInput.js

@@ -11,6 +11,7 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _FormControl = require("@mui/material/FormControl");
 var _styles = require("@mui/material/styles");
+var _utils = require("@mui/utils");
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _pickersOutlinedInputClasses = require("./pickersOutlinedInputClasses");
 var _Outline = _interopRequireDefault(require("./Outline"));
@@ -158,11 +159,10 @@ process.env.NODE_ENV !== "production" ? PickersOutlinedInput.propTypes = {
   fullWidth: _propTypes.default.bool,
   id: _propTypes.default.string,
   inputProps: _propTypes.default.object,
-  inputRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
-    current: _propTypes.default.object
-  })]),
+  inputRef: _utils.refType,
   label: _propTypes.default.node,
   margin: _propTypes.default.oneOf(['dense', 'none', 'normal']),
+  name: _propTypes.default.string,
   notched: _propTypes.default.bool,
   onChange: _propTypes.default.func.isRequired,
   onClick: _propTypes.default.func.isRequired,

package/node/PickersTextField/PickersTextField.js

@@ -11,6 +11,7 @@ var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
 var _styles = require("@mui/material/styles");
+var _utils = require("@mui/utils");
 var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _useId = _interopRequireDefault(require("@mui/utils/useId"));
@@ -22,7 +23,7 @@ var _PickersOutlinedInput = require("./PickersOutlinedInput");
 var _PickersFilledInput = require("./PickersFilledInput");
 var _PickersInput = require("./PickersInput");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["onFocus", "onBlur", "className", "color", "disabled", "error", "variant", "required", "InputProps", "inputProps", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "helperText", "FormHelperTextProps", "label", "InputLabelProps"];
+const _excluded = ["onFocus", "onBlur", "className", "color", "disabled", "error", "variant", "required", "InputProps", "inputProps", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "FormHelperTextProps", "label", "InputLabelProps"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const VARIANT_COMPONENT = {
@@ -82,6 +83,7 @@ const PickersTextField = exports.PickersTextField = /*#__PURE__*/React.forwardRe
       onChange,
       fullWidth,
       id: idProp,
+      name,
       // Props used by FormHelperText
       helperText,
       FormHelperTextProps,
@@ -142,7 +144,10 @@ const PickersTextField = exports.PickersTextField = /*#__PURE__*/React.forwardRe
       inputProps: inputProps,
       inputRef: inputRef,
       sectionListRef: sectionListRef,
-      label: label
+      label: label,
+      name: name,
+      role: "group",
+      "aria-labelledby": inputLabelId
     }, InputProps)), helperText && /*#__PURE__*/(0, _jsxRuntime.jsx)(_FormHelperText.default, (0, _extends2.default)({
       id: helperTextId
     }, FormHelperTextProps, {
@@ -215,15 +220,14 @@ process.env.NODE_ENV !== "production" ? PickersTextField.propTypes = {
    * component depending on the `variant` prop value.
    */
   InputProps: _propTypes.default.object,
-  inputRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
-    current: _propTypes.default.object
-  })]),
+  inputRef: _utils.refType,
   label: _propTypes.default.node,
   /**
    * If `dense` or `normal`, will adjust vertical spacing of this and contained components.
    * @default 'none'
    */
   margin: _propTypes.default.oneOf(['dense', 'none', 'normal']),
+  name: _propTypes.default.string,
   onBlur: _propTypes.default.func.isRequired,
   onChange: _propTypes.default.func.isRequired,
   onClick: _propTypes.default.func.isRequired,

package/node/StaticDatePicker/StaticDatePicker.js

@@ -113,7 +113,6 @@ StaticDatePicker.propTypes = {
   /**
    * The day view will show as many weeks as needed after the end of the current month to match this value.
    * Put it to 6 to have a fixed number of weeks in Gregorian calendars
-   * @default undefined
    */
   fixedWeekNumber: _propTypes.default.number,
   /**

package/node/StaticDateTimePicker/StaticDateTimePicker.js

@@ -138,7 +138,6 @@ StaticDateTimePicker.propTypes = {
   /**
    * The day view will show as many weeks as needed after the end of the current month to match this value.
    * Put it to 6 to have a fixed number of weeks in Gregorian calendars
-   * @default undefined
    */
   fixedWeekNumber: _propTypes.default.number,
   /**

package/node/TimeField/TimeField.js

@@ -15,6 +15,7 @@ var _utils = require("@mui/base/utils");
 var _utils2 = require("@mui/utils");
 var _useTimeField = require("./useTimeField");
 var _hooks = require("../hooks");
+var _PickersTextField = require("../PickersTextField");
 var _convertFieldResponseIntoMuiTextFieldProps = require("../internals/utils/convertFieldResponseIntoMuiTextFieldProps");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["slots", "slotProps", "InputProps", "inputProps"];
@@ -43,7 +44,7 @@ const TimeField = exports.TimeField = /*#__PURE__*/React.forwardRef(function Tim
     } = themeProps,
     other = (0, _objectWithoutPropertiesLoose2.default)(themeProps, _excluded);
   const ownerState = themeProps;
-  const TextField = slots?.textField ?? _TextField.default;
+  const TextField = slots?.textField ?? (inProps.enableAccessibleFieldDOMStructure ? _PickersTextField.PickersTextField : _TextField.default);
   const textFieldProps = (0, _utils.useSlotProps)({
     elementType: TextField,
     externalSlotProps: slotProps?.textField,
@@ -118,6 +119,10 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
    * @default false
    */
   disablePast: _propTypes.default.bool,
+  /**
+   * @default false
+   */
+  enableAccessibleFieldDOMStructure: _propTypes.default.bool,
   /**
    * If `true`, the component is displayed in focused state.
    */
@@ -251,17 +256,14 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
   required: _propTypes.default.bool,
   /**
    * The currently selected sections.
-   * This prop accept four formats:
+   * This prop accepts four formats:
    * 1. If a number is provided, the section at this index will be selected.
-   * 2. If an object with a `startIndex` and `endIndex` properties are provided, the sections between those two indexes will be selected.
-   * 3. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
-   * 4. If `null` is provided, no section will be selected
+   * 2. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
+   * 3. If `"all"` is provided, all the sections will be selected.
+   * 4. If `null` is provided, no section will be selected.
    * If not provided, the selected sections will be handled internally.
    */
-  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number, _propTypes.default.shape({
-    endIndex: _propTypes.default.number.isRequired,
-    startIndex: _propTypes.default.number.isRequired
-  })]),
+  selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number]),
   /**
    * Disable specific time.
    * @template TDate

package/node/TimeField/useTimeField.js

@@ -1,28 +1,16 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useTimeField = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _valueManagers = require("../internals/utils/valueManagers");
 var _useField = require("../internals/hooks/useField");
 var _validateTime = require("../internals/utils/validation/validateTime");
-var _useUtils = require("../internals/hooks/useUtils");
 var _fields = require("../internals/utils/fields");
-const useDefaultizedTimeField = props => {
-  const utils = (0, _useUtils.useUtils)();
-  const ampm = props.ampm ?? utils.is12HourCycleInCurrentLocale();
-  const defaultFormat = ampm ? utils.formats.fullTime12h : utils.formats.fullTime24h;
-  return (0, _extends2.default)({}, props, {
-    disablePast: props.disablePast ?? false,
-    disableFuture: props.disableFuture ?? false,
-    format: props.format ?? defaultFormat
-  });
-};
+var _defaultizedFieldProps = require("../internals/hooks/defaultizedFieldProps");
 const useTimeField = inProps => {
-  const props = useDefaultizedTimeField(inProps);
+  const props = (0, _defaultizedFieldProps.useDefaultizedTimeField)(inProps);
   const {
     forwardedProps,
     internalProps