@mui/x-date-pickers 8.0.0-beta.1 → 8.0.0-beta.3

package/PickersActionBar/PickersActionBar.js

@@ -44,8 +44,10 @@ function PickersActionBarComponent(props) {
     clearValue,
     setValueToToday,
     acceptValueChanges,
-    cancelValueChanges
-  } = (0, _hooks.usePickerActionsContext)();
+    cancelValueChanges,
+    goToNextStep,
+    hasNextStep
+  } = (0, _hooks.usePickerContext)();
   if (actions == null || actions.length === 0) {
     return null;
   }
@@ -71,6 +73,22 @@ function PickersActionBarComponent(props) {
           onClick: setValueToToday,
           children: translations.todayButtonLabel
         }, actionType);
+      case 'next':
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+          onClick: goToNextStep,
+          children: translations.nextStepButtonLabel
+        }, actionType);
+      case 'nextOrAccept':
+        if (hasNextStep) {
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+            onClick: goToNextStep,
+            children: translations.nextStepButtonLabel
+          }, actionType);
+        }
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+          onClick: acceptValueChanges,
+          children: translations.okButtonLabel
+        }, actionType);
       default:
         return null;
     }
@@ -91,7 +109,7 @@ process.env.NODE_ENV !== "production" ? PickersActionBarComponent.propTypes = {
    * - `[]` for Desktop Date Picker and Desktop Date Range Picker
    * - `['cancel', 'accept']` for all other Pickers
    */
-  actions: _propTypes.default.arrayOf(_propTypes.default.oneOf(['accept', 'cancel', 'clear', 'today']).isRequired),
+  actions: _propTypes.default.arrayOf(_propTypes.default.oneOf(['accept', 'cancel', 'clear', 'next', 'nextOrAccept', 'today']).isRequired),
   /**
    * If `true`, the actions do not have additional margin.
    * @default false

package/PickersSectionList/PickersSectionList.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { PickersSectionListProps } from "./PickersSectionList.types.js";
+import type { PickersSectionListProps } from './PickersSectionList.types';
 export declare const PickersSectionListRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const PickersSectionListSection: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, keyof React.ClassAttributes<HTMLSpanElement> | keyof React.HTMLAttributes<HTMLSpanElement>>, {}>;
 export declare const PickersSectionListSectionSeparator: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, keyof React.ClassAttributes<HTMLSpanElement> | keyof React.HTMLAttributes<HTMLSpanElement>>, {}>;

package/PickersSectionList/PickersSectionList.types.d.ts

@@ -2,6 +2,7 @@ import * as React from 'react';
 import { SlotComponentProps } from '@mui/utils';
 import { PickersSectionListClasses } from "./pickersSectionListClasses.js";
 import { PickerOwnerState } from "../models/index.js";
+import type { UseFieldDOMGetters } from '../internals/hooks/useField/useField.types';
 export interface PickersSectionListSlots {
   root: React.ElementType;
   section: React.ElementType;
@@ -28,12 +29,7 @@ export interface PickersSectionElement {
   before: React.HTMLAttributes<HTMLSpanElement>;
   after: React.HTMLAttributes<HTMLSpanElement>;
 }
-export interface PickersSectionListRef {
-  getRoot: () => HTMLElement;
-  getSectionContainer: (sectionIndex: number) => HTMLElement;
-  getSectionContent: (sectionIndex: number) => HTMLElement;
-  getSectionIndexFromDOMElement: (element: Element | null | undefined) => number | null;
-}
+export interface PickersSectionListRef extends Omit<UseFieldDOMGetters, 'isReady'> {}
 export interface ExportedPickersSectionListProps extends Pick<React.HTMLAttributes<HTMLDivElement>, 'tabIndex'> {
   /**
    * The elements to render.

package/StaticDatePicker/StaticDatePicker.js

@@ -52,7 +52,8 @@ const StaticDatePicker = exports.StaticDatePicker = /*#__PURE__*/React.forwardRe
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'date',
-    validator: _validation.validateDate
+    validator: _validation.validateDate,
+    steps: null
   });
   return renderPicker();
 });

package/StaticDateTimePicker/StaticDateTimePicker.js

@@ -20,6 +20,13 @@ var _utils = require("../internals/utils/utils");
 var _MultiSectionDigitalClock = require("../MultiSectionDigitalClock");
 var _dimensions = require("../internals/constants/dimensions");
 var _DigitalClock = require("../DigitalClock");
+var _dateUtils = require("../internals/utils/date-utils");
+var _timeUtils = require("../internals/utils/time-utils");
+const STEPS = [{
+  views: _dateUtils.DATE_VIEWS
+}, {
+  views: _timeUtils.EXPORTED_TIME_VIEWS
+}];
 /**
  * Demos:
  *
@@ -94,7 +101,8 @@ const StaticDateTimePicker = exports.StaticDateTimePicker = /*#__PURE__*/React.f
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'date-time',
-    validator: _validation.validateDateTime
+    validator: _validation.validateDateTime,
+    steps: STEPS
   });
   return renderPicker();
 });

package/StaticTimePicker/StaticTimePicker.js

@@ -54,7 +54,8 @@ const StaticTimePicker = exports.StaticTimePicker = /*#__PURE__*/React.forwardRe
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'time',
-    validator: _validation.validateTime
+    validator: _validation.validateTime,
+    steps: null
   });
   return renderPicker();
 });

package/TimeField/TimeField.js

@@ -130,7 +130,7 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
   formatDensity: _propTypes.default.oneOf(['dense', 'spacious']),
   /**
    * Props applied to the [`FormHelperText`](https://mui.com/material-ui/api/form-helper-text/) element.
-   * @deprecated Use `slotProps.formHelperText` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.formHelperText` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   FormHelperTextProps: _propTypes.default.object,
   /**
@@ -157,12 +157,12 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
   /**
    * Props applied to the [`InputLabel`](https://mui.com/material-ui/api/input-label/) element.
    * Pointer events like `onClick` are enabled if and only if `shrink` is `true`.
-   * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   InputLabelProps: _propTypes.default.object,
   /**
    * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
-   * @deprecated Use `slotProps.htmlInput` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.htmlInput` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   inputProps: _propTypes.default.object,
   /**
@@ -170,7 +170,7 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
    * It will be a [`FilledInput`](https://mui.com/material-ui/api/filled-input/),
    * [`OutlinedInput`](https://mui.com/material-ui/api/outlined-input/) or [`Input`](https://mui.com/material-ui/api/input/)
    * component depending on the `variant` prop value.
-   * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.input` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   InputProps: _propTypes.default.object,
   /**

package/TimePicker/shared.js

@@ -12,12 +12,14 @@ var _styles = require("@mui/material/styles");
 var _useUtils = require("../internals/hooks/useUtils");
 var _TimePickerToolbar = require("./TimePickerToolbar");
 var _views = require("../internals/utils/views");
+var _useTimeManager = require("../managers/useTimeManager");
 function useTimePickerDefaultizedProps(props, name) {
   const utils = (0, _useUtils.useUtils)();
   const themeProps = (0, _styles.useThemeProps)({
     props,
     name
   });
+  const validationProps = (0, _useTimeManager.useApplyDefaultValuesToTimeValidationProps)(themeProps);
   const ampm = themeProps.ampm ?? utils.is12HourCycleInCurrentLocale();
   const localeText = React.useMemo(() => {
     if (themeProps.localeText?.toolbarTitle == null) {
@@ -27,7 +29,7 @@ function useTimePickerDefaultizedProps(props, name) {
       timePickerToolbarTitle: themeProps.localeText.toolbarTitle
     });
   }, [themeProps.localeText]);
-  return (0, _extends2.default)({}, themeProps, {
+  return (0, _extends2.default)({}, themeProps, validationProps, {
     ampm,
     localeText
   }, (0, _views.applyDefaultViewProps)({
@@ -36,8 +38,6 @@ function useTimePickerDefaultizedProps(props, name) {
     defaultViews: ['hours', 'minutes'],
     defaultOpenTo: 'hours'
   }), {
-    disableFuture: themeProps.disableFuture ?? false,
-    disablePast: themeProps.disablePast ?? false,
     slots: (0, _extends2.default)({
       toolbar: _TimePickerToolbar.TimePickerToolbar
     }, themeProps.slots),

package/YearCalendar/YearCalendar.js

@@ -19,12 +19,12 @@ var _utils = require("@mui/utils");
 var _YearCalendarButton = require("./YearCalendarButton");
 var _useUtils = require("../internals/hooks/useUtils");
 var _yearCalendarClasses = require("./yearCalendarClasses");
-var _dateUtils = require("../internals/utils/date-utils");
 var _valueManagers = require("../internals/utils/valueManagers");
 var _getDefaultReferenceDate = require("../internals/utils/getDefaultReferenceDate");
 var _useControlledValue = require("../internals/hooks/useControlledValue");
 var _dimensions = require("../internals/constants/dimensions");
 var _usePickerPrivateContext = require("../internals/hooks/usePickerPrivateContext");
+var _useDateManager = require("../managers/useDateManager");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["autoFocus", "className", "classes", "value", "defaultValue", "referenceDate", "disabled", "disableFuture", "disablePast", "maxDate", "minDate", "onChange", "readOnly", "shouldDisableYear", "disableHighlightToday", "onYearFocus", "hasFocus", "onFocusedViewChange", "yearsOrder", "yearsPerRow", "timezone", "gridLabelId", "slots", "slotProps"];
 const useUtilityClasses = classes => {
@@ -34,20 +34,14 @@ const useUtilityClasses = classes => {
   return (0, _utils.unstable_composeClasses)(slots, _yearCalendarClasses.getYearCalendarUtilityClass, classes);
 };
 function useYearCalendarDefaultizedProps(props, name) {
-  const utils = (0, _useUtils.useUtils)();
-  const defaultDates = (0, _useUtils.useDefaultDates)();
   const themeProps = (0, _styles.useThemeProps)({
     props,
     name
   });
-  return (0, _extends2.default)({
-    disablePast: false,
-    disableFuture: false
-  }, themeProps, {
+  const validationProps = (0, _useDateManager.useApplyDefaultValuesToDateValidationProps)(themeProps);
+  return (0, _extends2.default)({}, themeProps, validationProps, {
     yearsPerRow: themeProps.yearsPerRow ?? 3,
-    yearsOrder: themeProps.yearsOrder ?? 'asc',
-    minDate: (0, _dateUtils.applyDefaultDate)(utils, themeProps.minDate, defaultDates.minDate),
-    maxDate: (0, _dateUtils.applyDefaultDate)(utils, themeProps.maxDate, defaultDates.maxDate)
+    yearsOrder: themeProps.yearsOrder ?? 'asc'
   });
 }
 const YearCalendarRoot = (0, _styles.styled)('div', {

package/esm/DateCalendar/DateCalendar.js

@@ -10,14 +10,14 @@ import useSlotProps from '@mui/utils/useSlotProps';
 import { styled, useThemeProps } from '@mui/material/styles';
 import { unstable_composeClasses as composeClasses, unstable_useId as useId, unstable_useEventCallback as useEventCallback } from '@mui/utils';
 import { useCalendarState } from "./useCalendarState.js";
-import { useDefaultDates, useUtils } from "../internals/hooks/useUtils.js";
+import { useUtils } from "../internals/hooks/useUtils.js";
 import { PickersFadeTransitionGroup } from "./PickersFadeTransitionGroup.js";
 import { DayCalendar } from "./DayCalendar.js";
 import { MonthCalendar } from "../MonthCalendar/index.js";
 import { YearCalendar } from "../YearCalendar/index.js";
 import { useViews } from "../internals/hooks/useViews.js";
 import { PickersCalendarHeader } from "../PickersCalendarHeader/index.js";
-import { findClosestEnabledDate, applyDefaultDate, mergeDateAndTime } from "../internals/utils/date-utils.js";
+import { findClosestEnabledDate, mergeDateAndTime } from "../internals/utils/date-utils.js";
 import { PickerViewRoot } from "../internals/components/PickerViewRoot/index.js";
 import { useReduceAnimations } from "../internals/hooks/useReduceAnimations.js";
 import { getDateCalendarUtilityClass } from "./dateCalendarClasses.js";
@@ -25,6 +25,7 @@ import { useControlledValue } from "../internals/hooks/useControlledValue.js";
 import { singleItemValueManager } from "../internals/utils/valueManagers.js";
 import { VIEW_HEIGHT } from "../internals/constants/dimensions.js";
 import { usePickerPrivateContext } from "../internals/hooks/usePickerPrivateContext.js";
+import { useApplyDefaultValuesToDateValidationProps } from "../managers/useDateManager.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const useUtilityClasses = classes => {
   const slots = {
@@ -34,25 +35,20 @@ const useUtilityClasses = classes => {
   return composeClasses(slots, getDateCalendarUtilityClass, classes);
 };
 function useDateCalendarDefaultizedProps(props, name) {
-  const utils = useUtils();
-  const defaultDates = useDefaultDates();
   const themeProps = useThemeProps({
     props,
     name
   });
   const reduceAnimations = useReduceAnimations(themeProps.reduceAnimations);
-  return _extends({}, themeProps, {
+  const validationProps = useApplyDefaultValuesToDateValidationProps(themeProps);
+  return _extends({}, themeProps, validationProps, {
     loading: themeProps.loading ?? false,
-    disablePast: themeProps.disablePast ?? false,
-    disableFuture: themeProps.disableFuture ?? false,
     openTo: themeProps.openTo ?? 'day',
     views: themeProps.views ?? ['year', 'day'],
     reduceAnimations,
     renderLoading: themeProps.renderLoading ?? (() => /*#__PURE__*/_jsx("span", {
       children: "..."
-    })),
-    minDate: applyDefaultDate(utils, themeProps.minDate, defaultDates.minDate),
-    maxDate: applyDefaultDate(utils, themeProps.maxDate, defaultDates.maxDate)
+    }))
   });
 }
 const DateCalendarRoot = styled(PickerViewRoot, {

package/esm/DateCalendar/DayCalendar.js

@@ -81,7 +81,7 @@ const PickersCalendarWeekNumberLabel = styled(Typography, {
   display: 'flex',
   justifyContent: 'center',
   alignItems: 'center',
-  color: theme.palette.text.disabled
+  color: (theme.vars || theme).palette.text.disabled
 }));
 const PickersCalendarWeekNumber = styled(Typography, {
   name: 'MuiDayCalendar',
@@ -94,7 +94,7 @@ const PickersCalendarWeekNumber = styled(Typography, {
   height: DAY_SIZE,
   padding: 0,
   margin: `0 ${DAY_MARGIN}px`,
-  color: theme.palette.text.disabled,
+  color: (theme.vars || theme).palette.text.disabled,
   fontSize: '0.75rem',
   alignItems: 'center',
   justifyContent: 'center',

package/esm/DateField/DateField.js

@@ -113,7 +113,7 @@ process.env.NODE_ENV !== "production" ? DateField.propTypes = {
   formatDensity: PropTypes.oneOf(['dense', 'spacious']),
   /**
    * Props applied to the [`FormHelperText`](https://mui.com/material-ui/api/form-helper-text/) element.
-   * @deprecated Use `slotProps.formHelperText` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.formHelperText` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   FormHelperTextProps: PropTypes.object,
   /**
@@ -140,12 +140,12 @@ process.env.NODE_ENV !== "production" ? DateField.propTypes = {
   /**
    * Props applied to the [`InputLabel`](https://mui.com/material-ui/api/input-label/) element.
    * Pointer events like `onClick` are enabled if and only if `shrink` is `true`.
-   * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   InputLabelProps: PropTypes.object,
   /**
    * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
-   * @deprecated Use `slotProps.htmlInput` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.htmlInput` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   inputProps: PropTypes.object,
   /**
@@ -153,7 +153,7 @@ process.env.NODE_ENV !== "production" ? DateField.propTypes = {
    * It will be a [`FilledInput`](https://mui.com/material-ui/api/filled-input/),
    * [`OutlinedInput`](https://mui.com/material-ui/api/outlined-input/) or [`Input`](https://mui.com/material-ui/api/input/)
    * component depending on the `variant` prop value.
-   * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.input` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   InputProps: PropTypes.object,
   /**

package/esm/DatePicker/shared.js

@@ -1,17 +1,15 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { useThemeProps } from '@mui/material/styles';
-import { useDefaultDates, useUtils } from "../internals/hooks/useUtils.js";
 import { applyDefaultViewProps } from "../internals/utils/views.js";
-import { applyDefaultDate } from "../internals/utils/date-utils.js";
 import { DatePickerToolbar } from "./DatePickerToolbar.js";
+import { useApplyDefaultValuesToDateValidationProps } from "../managers/useDateManager.js";
 export function useDatePickerDefaultizedProps(props, name) {
-  const utils = useUtils();
-  const defaultDates = useDefaultDates();
   const themeProps = useThemeProps({
     props,
     name
   });
+  const validationProps = useApplyDefaultValuesToDateValidationProps(themeProps);
   const localeText = React.useMemo(() => {
     if (themeProps.localeText?.toolbarTitle == null) {
       return themeProps.localeText;
@@ -20,7 +18,7 @@ export function useDatePickerDefaultizedProps(props, name) {
       datePickerToolbarTitle: themeProps.localeText.toolbarTitle
     });
   }, [themeProps.localeText]);
-  return _extends({}, themeProps, {
+  return _extends({}, themeProps, validationProps, {
     localeText
   }, applyDefaultViewProps({
     views: themeProps.views,
@@ -28,10 +26,6 @@ export function useDatePickerDefaultizedProps(props, name) {
     defaultViews: ['year', 'day'],
     defaultOpenTo: 'day'
   }), {
-    disableFuture: themeProps.disableFuture ?? false,
-    disablePast: themeProps.disablePast ?? false,
-    minDate: applyDefaultDate(utils, themeProps.minDate, defaultDates.minDate),
-    maxDate: applyDefaultDate(utils, themeProps.maxDate, defaultDates.maxDate),
     slots: _extends({
       toolbar: DatePickerToolbar
     }, themeProps.slots)

package/esm/DateTimeField/DateTimeField.js

@@ -123,7 +123,7 @@ process.env.NODE_ENV !== "production" ? DateTimeField.propTypes = {
   formatDensity: PropTypes.oneOf(['dense', 'spacious']),
   /**
    * Props applied to the [`FormHelperText`](https://mui.com/material-ui/api/form-helper-text/) element.
-   * @deprecated Use `slotProps.formHelperText` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.formHelperText` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   FormHelperTextProps: PropTypes.object,
   /**
@@ -150,12 +150,12 @@ process.env.NODE_ENV !== "production" ? DateTimeField.propTypes = {
   /**
    * Props applied to the [`InputLabel`](https://mui.com/material-ui/api/input-label/) element.
    * Pointer events like `onClick` are enabled if and only if `shrink` is `true`.
-   * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.inputLabel` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   InputLabelProps: PropTypes.object,
   /**
    * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
-   * @deprecated Use `slotProps.htmlInput` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.htmlInput` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   inputProps: PropTypes.object,
   /**
@@ -163,7 +163,7 @@ process.env.NODE_ENV !== "production" ? DateTimeField.propTypes = {
    * It will be a [`FilledInput`](https://mui.com/material-ui/api/filled-input/),
    * [`OutlinedInput`](https://mui.com/material-ui/api/outlined-input/) or [`Input`](https://mui.com/material-ui/api/input/)
    * component depending on the `variant` prop value.
-   * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   * @deprecated Use `slotProps.input` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   InputProps: PropTypes.object,
   /**

package/esm/DateTimePicker/shared.js

@@ -1,19 +1,19 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { useThemeProps } from '@mui/material/styles';
-import { useDefaultDates, useUtils } from "../internals/hooks/useUtils.js";
-import { applyDefaultDate } from "../internals/utils/date-utils.js";
+import { useUtils } from "../internals/hooks/useUtils.js";
 import { DateTimePickerTabs } from "./DateTimePickerTabs.js";
 import { DateTimePickerToolbar } from "./DateTimePickerToolbar.js";
 import { applyDefaultViewProps } from "../internals/utils/views.js";
 import { resolveTimeViewsResponse } from "../internals/utils/date-time-utils.js";
+import { useApplyDefaultValuesToDateTimeValidationProps } from "../managers/useDateTimeManager.js";
 export function useDateTimePickerDefaultizedProps(props, name) {
   const utils = useUtils();
-  const defaultDates = useDefaultDates();
   const themeProps = useThemeProps({
     props,
     name
   });
+  const validationProps = useApplyDefaultValuesToDateTimeValidationProps(themeProps);
   const ampm = themeProps.ampm ?? utils.is12HourCycleInCurrentLocale();
   const localeText = React.useMemo(() => {
     if (themeProps.localeText?.toolbarTitle == null) {
@@ -43,7 +43,7 @@ export function useDateTimePickerDefaultizedProps(props, name) {
     timeSteps: themeProps.timeSteps,
     views: defaultViews
   });
-  return _extends({}, themeProps, {
+  return _extends({}, themeProps, validationProps, {
     timeSteps,
     openTo,
     shouldRenderTimeInASingleColumn,
@@ -52,16 +52,6 @@ export function useDateTimePickerDefaultizedProps(props, name) {
     ampm,
     localeText,
     orientation: themeProps.orientation ?? 'portrait',
-    // TODO: Remove from public API
-    disableIgnoringDatePartForTimeValidation: themeProps.disableIgnoringDatePartForTimeValidation ?? Boolean(themeProps.minDateTime || themeProps.maxDateTime ||
-    // allow time clock to correctly check time validity: https://github.com/mui/mui-x/issues/8520
-    themeProps.disablePast || themeProps.disableFuture),
-    disableFuture: themeProps.disableFuture ?? false,
-    disablePast: themeProps.disablePast ?? false,
-    minDate: applyDefaultDate(utils, themeProps.minDateTime ?? themeProps.minDate, defaultDates.minDate),
-    maxDate: applyDefaultDate(utils, themeProps.maxDateTime ?? themeProps.maxDate, defaultDates.maxDate),
-    minTime: themeProps.minDateTime ?? themeProps.minTime,
-    maxTime: themeProps.maxDateTime ?? themeProps.maxTime,
     slots: _extends({
       toolbar: DateTimePickerToolbar,
       tabs: DateTimePickerTabs

package/esm/DesktopDatePicker/DesktopDatePicker.js

@@ -62,7 +62,8 @@ const DesktopDatePicker = /*#__PURE__*/React.forwardRef(function DesktopDatePick
     props,
     valueManager: singleItemValueManager,
     valueType: 'date',
-    validator: validateDate
+    validator: validateDate,
+    steps: null
   });
   return renderPicker();
 });

package/esm/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -136,7 +136,8 @@ const DesktopDateTimePicker = /*#__PURE__*/React.forwardRef(function DesktopDate
     valueManager: singleItemValueManager,
     valueType: 'date-time',
     validator: validateDateTime,
-    rendererInterceptor
+    rendererInterceptor,
+    steps: null
   });
   return renderPicker();
 });

package/esm/DesktopTimePicker/DesktopTimePicker.js

@@ -73,7 +73,8 @@ const DesktopTimePicker = /*#__PURE__*/React.forwardRef(function DesktopTimePick
     props,
     valueManager: singleItemValueManager,
     valueType: 'time',
-    validator: validateTime
+    validator: validateTime,
+    steps: null
   });
   return renderPicker();
 });

package/esm/DigitalClock/DigitalClock.js

@@ -41,6 +41,7 @@ const DigitalClockRoot = styled(PickerViewRoot, {
 })({
   overflowY: 'auto',
   width: '100%',
+  scrollbarWidth: 'thin',
   '@media (prefers-reduced-motion: no-preference)': {
     scrollBehavior: 'auto'
   },

package/esm/LocalizationProvider/LocalizationProvider.d.ts

@@ -15,7 +15,7 @@ export interface LocalizationProviderProps<TLocale> {
   children?: React.ReactNode;
   /**
    * Date library adapter class function.
-   * @see See the localization provider {@link https://mui.com/x/react-date-pickers/getting-started/#setup-your-date-library-adapter date adapter setup section} for more details.
+   * @see See the localization provider {@link https://next.mui.com/x/react-date-pickers/quickstart/#integrate-provider-and-adapter date adapter setup section} for more details.
    */
   dateAdapter?: new (...args: any) => MuiPickersAdapter<TLocale>;
   /** Formats that are used for any child pickers */

package/esm/LocalizationProvider/LocalizationProvider.js

@@ -63,7 +63,7 @@ export const LocalizationProvider = function LocalizationProvider(inProps) {
       instance: dateLibInstance
     });
     if (!adapter.isMUIAdapter) {
-      throw new Error(['MUI X: The date adapter should be imported from `@mui/x-date-pickers` or `@mui/x-date-pickers-pro`, not from `@date-io`', "For example, `import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'` instead of `import AdapterDayjs from '@date-io/dayjs'`", 'More information on the installation documentation: https://mui.com/x/react-date-pickers/getting-started/#installation'].join(`\n`));
+      throw new Error(['MUI X: The date adapter should be imported from `@mui/x-date-pickers` or `@mui/x-date-pickers-pro`, not from `@date-io`', "For example, `import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'` instead of `import AdapterDayjs from '@date-io/dayjs'`", 'More information on the installation documentation: https://mui.com/x/react-date-pickers/quickstart/#installation'].join(`\n`));
     }
     return adapter;
   }, [DateAdapter, adapterLocale, dateFormats, dateLibInstance, parentUtils]);
@@ -100,7 +100,7 @@ process.env.NODE_ENV !== "production" ? LocalizationProvider.propTypes = {
   children: PropTypes.node,
   /**
    * Date library adapter class function.
-   * @see See the localization provider {@link https://mui.com/x/react-date-pickers/getting-started/#setup-your-date-library-adapter date adapter setup section} for more details.
+   * @see See the localization provider {@link https://next.mui.com/x/react-date-pickers/quickstart/#integrate-provider-and-adapter date adapter setup section} for more details.
    */
   dateAdapter: PropTypes.func,
   /**

package/esm/MobileDatePicker/MobileDatePicker.js

@@ -55,7 +55,8 @@ const MobileDatePicker = /*#__PURE__*/React.forwardRef(function MobileDatePicker
     props,
     valueManager: singleItemValueManager,
     valueType: 'date',
-    validator: validateDate
+    validator: validateDate,
+    steps: null
   });
   return renderPicker();
 });

package/esm/MobileDateTimePicker/MobileDateTimePicker.js

@@ -18,6 +18,13 @@ import { DIALOG_WIDTH, VIEW_HEIGHT } from "../internals/constants/dimensions.js"
 import { multiSectionDigitalClockClasses, multiSectionDigitalClockSectionClasses } from "../MultiSectionDigitalClock/index.js";
 import { mergeSx } from "../internals/utils/utils.js";
 import { digitalClockClasses } from "../DigitalClock/index.js";
+import { EXPORTED_TIME_VIEWS } from "../internals/utils/time-utils.js";
+import { DATE_VIEWS } from "../internals/utils/date-utils.js";
+const STEPS = [{
+  views: DATE_VIEWS
+}, {
+  views: EXPORTED_TIME_VIEWS
+}];
 /**
  * Demos:
  *
@@ -98,7 +105,8 @@ const MobileDateTimePicker = /*#__PURE__*/React.forwardRef(function MobileDateTi
     props,
     valueManager: singleItemValueManager,
     valueType: 'date-time',
-    validator: validateDateTime
+    validator: validateDateTime,
+    steps: STEPS
   });
   return renderPicker();
 });

package/esm/MobileTimePicker/MobileTimePicker.js

@@ -58,7 +58,8 @@ const MobileTimePicker = /*#__PURE__*/React.forwardRef(function MobileTimePicker
     props,
     valueManager: singleItemValueManager,
     valueType: 'time',
-    validator: validateTime
+    validator: validateTime,
+    steps: null
   });
   return renderPicker();
 });

package/esm/MonthCalendar/MonthCalendar.js

@@ -11,14 +11,15 @@ import { shouldForwardProp } from '@mui/system/createStyled';
 import { styled, useThemeProps } from '@mui/material/styles';
 import { unstable_useControlled as useControlled, unstable_composeClasses as composeClasses, unstable_useEventCallback as useEventCallback } from '@mui/utils';
 import { MonthCalendarButton } from "./MonthCalendarButton.js";
-import { useUtils, useNow, useDefaultDates } from "../internals/hooks/useUtils.js";
+import { useUtils, useNow } from "../internals/hooks/useUtils.js";
 import { getMonthCalendarUtilityClass } from "./monthCalendarClasses.js";
-import { applyDefaultDate, getMonthsInYear } from "../internals/utils/date-utils.js";
+import { getMonthsInYear } from "../internals/utils/date-utils.js";
 import { singleItemValueManager } from "../internals/utils/valueManagers.js";
 import { SECTION_TYPE_GRANULARITY } from "../internals/utils/getDefaultReferenceDate.js";
 import { useControlledValue } from "../internals/hooks/useControlledValue.js";
 import { DIALOG_WIDTH } from "../internals/constants/dimensions.js";
 import { usePickerPrivateContext } from "../internals/hooks/usePickerPrivateContext.js";
+import { useApplyDefaultValuesToDateValidationProps } from "../managers/useDateManager.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = classes => {
   const slots = {
@@ -27,19 +28,13 @@ const useUtilityClasses = classes => {
   return composeClasses(slots, getMonthCalendarUtilityClass, classes);
 };
 export function useMonthCalendarDefaultizedProps(props, name) {
-  const utils = useUtils();
-  const defaultDates = useDefaultDates();
   const themeProps = useThemeProps({
     props,
     name
   });
-  return _extends({
-    disableFuture: false,
-    disablePast: false
-  }, themeProps, {
-    monthsPerRow: themeProps.monthsPerRow ?? 3,
-    minDate: applyDefaultDate(utils, themeProps.minDate, defaultDates.minDate),
-    maxDate: applyDefaultDate(utils, themeProps.maxDate, defaultDates.maxDate)
+  const validationProps = useApplyDefaultValuesToDateValidationProps(themeProps);
+  return _extends({}, themeProps, validationProps, {
+    monthsPerRow: themeProps.monthsPerRow ?? 3
   });
 }
 const MonthCalendarRoot = styled('div', {

package/esm/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js

@@ -33,6 +33,7 @@ const MultiSectionDigitalClockSectionRoot = styled(MenuList, {
   width: 56,
   padding: 0,
   overflow: 'hidden',
+  scrollbarWidth: 'thin',
   '@media (prefers-reduced-motion: no-preference)': {
     scrollBehavior: 'auto'
   },