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

package/managers/useDateTimeManager.d.ts

@@ -1,24 +1,15 @@
 import type { MakeOptional } from '@mui/x-internals/types';
 import { PickerManager, DateTimeValidationError } from "../models/index.js";
 import { UseFieldInternalProps } from "../internals/hooks/useField/index.js";
-import { MuiPickersAdapterContextValue } from "../LocalizationProvider/LocalizationProvider.js";
 import { AmPmProps } from "../internals/models/props/time.js";
-import { ExportedValidateDateTimeProps, ValidateDateTimeProps, ValidateDateTimePropsToDefault } from "../validation/validateDateTime.js";
-import { PickerManagerFieldInternalPropsWithDefaults, PickerValue } from "../internals/models/index.js";
+import { ExportedValidateDateTimeProps, ValidateDateTimeProps } from "../validation/validateDateTime.js";
+import { PickerValue } from "../internals/models/index.js";
 export declare function useDateTimeManager<TEnableAccessibleFieldDOMStructure extends boolean = true>(parameters?: UseDateTimeManagerParameters<TEnableAccessibleFieldDOMStructure>): UseDateTimeManagerReturnValue<TEnableAccessibleFieldDOMStructure>;
-/**
- * Private utility function to get the default internal props for the field with date time editing.
- * Is used by the `useDateTimeManager` and `useDateTimeRangeManager` hooks.
- */
-export declare function getDateTimeFieldInternalPropsDefaults(parameters: GetDateTimeFieldInternalPropsDefaultsParameters): GetDateTimeFieldInternalPropsDefaultsReturnValue;
+type SharedDateTimeAndDateTimeRangeValidationProps = 'disablePast' | 'disableFuture' | 'minTime' | 'maxTime' | 'minDate' | 'maxDate';
+export declare function useApplyDefaultValuesToDateTimeValidationProps(props: Pick<ExportedValidateDateTimeProps, SharedDateTimeAndDateTimeRangeValidationProps | 'minDateTime' | 'maxDateTime'>): Pick<ValidateDateTimeProps, SharedDateTimeAndDateTimeRangeValidationProps>;
 export interface UseDateTimeManagerParameters<TEnableAccessibleFieldDOMStructure extends boolean> {
   enableAccessibleFieldDOMStructure?: TEnableAccessibleFieldDOMStructure;
 }
 export type UseDateTimeManagerReturnValue<TEnableAccessibleFieldDOMStructure extends boolean> = PickerManager<PickerValue, TEnableAccessibleFieldDOMStructure, DateTimeValidationError, ValidateDateTimeProps, DateTimeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure>>;
 export interface DateTimeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<UseFieldInternalProps<PickerValue, TEnableAccessibleFieldDOMStructure, DateTimeValidationError>, 'format'>, ExportedValidateDateTimeProps, AmPmProps {}
-type DateTimeManagerFieldPropsToDefault = 'format' | 'minTime' | 'maxTime' | ValidateDateTimePropsToDefault;
-interface GetDateTimeFieldInternalPropsDefaultsParameters extends Pick<MuiPickersAdapterContextValue, 'defaultDates' | 'utils'> {
-  internalProps: Pick<DateTimeManagerFieldInternalProps<true>, DateTimeManagerFieldPropsToDefault | 'minDateTime' | 'maxDateTime' | 'ampm'>;
-}
-interface GetDateTimeFieldInternalPropsDefaultsReturnValue extends Pick<PickerManagerFieldInternalPropsWithDefaults<UseDateTimeManagerReturnValue<true>>, DateTimeManagerFieldPropsToDefault | 'disableIgnoringDatePartForTimeValidation'> {}
 export {};

package/managers/useDateTimeManager.js

@@ -6,7 +6,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getDateTimeFieldInternalPropsDefaults = getDateTimeFieldInternalPropsDefaults;
+exports.useApplyDefaultValuesToDateTimeValidationProps = useApplyDefaultValuesToDateTimeValidationProps;
 exports.useDateTimeManager = useDateTimeManager;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
@@ -25,15 +25,7 @@ function useDateTimeManager(parameters = {}) {
     internal_valueManager: _valueManagers.singleItemValueManager,
     internal_fieldValueManager: _valueManagers.singleItemFieldValueManager,
     internal_enableAccessibleFieldDOMStructure: enableAccessibleFieldDOMStructure,
-    internal_applyDefaultsToFieldInternalProps: ({
-      internalProps,
-      utils,
-      defaultDates
-    }) => (0, _extends2.default)({}, internalProps, getDateTimeFieldInternalPropsDefaults({
-      internalProps,
-      utils,
-      defaultDates
-    })),
+    internal_useApplyDefaultValuesToFieldInternalProps: useApplyDefaultValuesToDateTimeFieldInternalProps,
     internal_useOpenPickerButtonAriaLabel: useOpenPickerButtonAriaLabel
   }), [enableAccessibleFieldDOMStructure]);
 }
@@ -45,27 +37,25 @@ function useOpenPickerButtonAriaLabel(value) {
     return translations.openDatePickerDialogue(formattedValue);
   }, [value, translations, utils]);
 }
-
-/**
- * Private utility function to get the default internal props for the field with date time editing.
- * Is used by the `useDateTimeManager` and `useDateTimeRangeManager` hooks.
- */
-function getDateTimeFieldInternalPropsDefaults(parameters) {
-  const {
-    defaultDates,
-    utils,
-    internalProps
-  } = parameters;
-  const ampm = internalProps.ampm ?? utils.is12HourCycleInCurrentLocale();
-  const defaultFormat = ampm ? utils.formats.keyboardDateTime12h : utils.formats.keyboardDateTime24h;
-  return {
-    disablePast: internalProps.disablePast ?? false,
-    disableFuture: internalProps.disableFuture ?? false,
-    format: internalProps.format ?? defaultFormat,
-    disableIgnoringDatePartForTimeValidation: Boolean(internalProps.minDateTime || internalProps.maxDateTime),
-    minDate: (0, _dateUtils.applyDefaultDate)(utils, internalProps.minDateTime ?? internalProps.minDate, defaultDates.minDate),
-    maxDate: (0, _dateUtils.applyDefaultDate)(utils, internalProps.maxDateTime ?? internalProps.maxDate, defaultDates.maxDate),
-    minTime: internalProps.minDateTime ?? internalProps.minTime,
-    maxTime: internalProps.maxDateTime ?? internalProps.maxTime
-  };
+function useApplyDefaultValuesToDateTimeFieldInternalProps(internalProps) {
+  const utils = (0, _useUtils.useUtils)();
+  const validationProps = useApplyDefaultValuesToDateTimeValidationProps(internalProps);
+  const ampm = React.useMemo(() => internalProps.ampm ?? utils.is12HourCycleInCurrentLocale(), [internalProps.ampm, utils]);
+  return React.useMemo(() => (0, _extends2.default)({}, internalProps, validationProps, {
+    format: internalProps.format ?? (ampm ? utils.formats.keyboardDateTime12h : utils.formats.keyboardDateTime24h)
+  }), [internalProps, validationProps, ampm, utils]);
+}
+function useApplyDefaultValuesToDateTimeValidationProps(props) {
+  const utils = (0, _useUtils.useUtils)();
+  const defaultDates = (0, _useUtils.useDefaultDates)();
+  return React.useMemo(() => ({
+    disablePast: props.disablePast ?? false,
+    disableFuture: props.disableFuture ?? false,
+    // TODO: Explore if we can remove it from the public API
+    disableIgnoringDatePartForTimeValidation: !!props.minDateTime || !!props.maxDateTime || !!props.disableFuture || !!props.disablePast,
+    minDate: (0, _dateUtils.applyDefaultDate)(utils, props.minDateTime ?? props.minDate, defaultDates.minDate),
+    maxDate: (0, _dateUtils.applyDefaultDate)(utils, props.maxDateTime ?? props.maxDate, defaultDates.maxDate),
+    minTime: props.minDateTime ?? props.minTime,
+    maxTime: props.maxDateTime ?? props.maxTime
+  }), [props.minDateTime, props.maxDateTime, props.minTime, props.maxTime, props.minDate, props.maxDate, props.disableFuture, props.disablePast, utils, defaultDates]);
 }

package/managers/useTimeManager.d.ts

@@ -1,24 +1,15 @@
 import type { MakeOptional } from '@mui/x-internals/types';
 import { PickerManager, TimeValidationError } from "../models/index.js";
 import { UseFieldInternalProps } from "../internals/hooks/useField/index.js";
-import { MuiPickersAdapterContextValue } from "../LocalizationProvider/LocalizationProvider.js";
 import { AmPmProps } from "../internals/models/props/time.js";
-import { ExportedValidateTimeProps, ValidateTimeProps, ValidateTimePropsToDefault } from "../validation/validateTime.js";
-import { PickerManagerFieldInternalPropsWithDefaults, PickerValue } from "../internals/models/index.js";
+import { ExportedValidateTimeProps, ValidateTimeProps } from "../validation/validateTime.js";
+import { PickerValue } from "../internals/models/index.js";
 export declare function useTimeManager<TEnableAccessibleFieldDOMStructure extends boolean = true>(parameters?: UseTimeManagerParameters<TEnableAccessibleFieldDOMStructure>): UseTimeManagerReturnValue<TEnableAccessibleFieldDOMStructure>;
-/**
- * Private utility function to get the default internal props for the fields with time editing.
- * Is used by the `useTimeManager` and `useTimeRangeManager` hooks.
- */
-export declare function getTimeFieldInternalPropsDefaults(parameters: GetTimeFieldInternalPropsDefaultsParameters): GetTimeFieldInternalPropsDefaultsReturnValue;
+type SharedTimeAndTimeRangeValidationProps = 'disablePast' | 'disableFuture';
+export declare function useApplyDefaultValuesToTimeValidationProps(props: Pick<ExportedValidateTimeProps, SharedTimeAndTimeRangeValidationProps>): Pick<ValidateTimeProps, SharedTimeAndTimeRangeValidationProps>;
 export interface UseTimeManagerParameters<TEnableAccessibleFieldDOMStructure extends boolean> extends AmPmProps {
   enableAccessibleFieldDOMStructure?: TEnableAccessibleFieldDOMStructure;
 }
 export type UseTimeManagerReturnValue<TEnableAccessibleFieldDOMStructure extends boolean> = PickerManager<PickerValue, TEnableAccessibleFieldDOMStructure, TimeValidationError, ValidateTimeProps, TimeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure>>;
 export interface TimeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<UseFieldInternalProps<PickerValue, TEnableAccessibleFieldDOMStructure, TimeValidationError>, 'format'>, ExportedValidateTimeProps, AmPmProps {}
-type TimeManagerFieldPropsToDefault = 'format' | ValidateTimePropsToDefault;
-interface GetTimeFieldInternalPropsDefaultsParameters extends Pick<MuiPickersAdapterContextValue, 'utils'> {
-  internalProps: Pick<TimeManagerFieldInternalProps<true>, TimeManagerFieldPropsToDefault | 'ampm'>;
-}
-interface GetTimeFieldInternalPropsDefaultsReturnValue extends Pick<PickerManagerFieldInternalPropsWithDefaults<UseTimeManagerReturnValue<true>>, TimeManagerFieldPropsToDefault> {}
 export {};

package/managers/useTimeManager.js

@@ -6,7 +6,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getTimeFieldInternalPropsDefaults = getTimeFieldInternalPropsDefaults;
+exports.useApplyDefaultValuesToTimeValidationProps = useApplyDefaultValuesToTimeValidationProps;
 exports.useTimeManager = useTimeManager;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
@@ -25,13 +25,7 @@ function useTimeManager(parameters = {}) {
     internal_valueManager: _valueManagers.singleItemValueManager,
     internal_fieldValueManager: _valueManagers.singleItemFieldValueManager,
     internal_enableAccessibleFieldDOMStructure: enableAccessibleFieldDOMStructure,
-    internal_applyDefaultsToFieldInternalProps: ({
-      internalProps,
-      utils
-    }) => (0, _extends2.default)({}, internalProps, getTimeFieldInternalPropsDefaults({
-      utils,
-      internalProps
-    })),
+    internal_useApplyDefaultValuesToFieldInternalProps: useApplyDefaultValuesToTimeFieldInternalProps,
     internal_useOpenPickerButtonAriaLabel: createUseOpenPickerButtonAriaLabel(ampm)
   }), [ampm, enableAccessibleFieldDOMStructure]);
 }
@@ -46,21 +40,17 @@ function createUseOpenPickerButtonAriaLabel(ampm) {
     }, [value, translations, utils]);
   };
 }
-
-/**
- * Private utility function to get the default internal props for the fields with time editing.
- * Is used by the `useTimeManager` and `useTimeRangeManager` hooks.
- */
-function getTimeFieldInternalPropsDefaults(parameters) {
-  const {
-    utils,
-    internalProps
-  } = parameters;
-  const ampm = internalProps.ampm ?? utils.is12HourCycleInCurrentLocale();
-  const defaultFormat = ampm ? utils.formats.fullTime12h : utils.formats.fullTime24h;
-  return {
-    disablePast: internalProps.disablePast ?? false,
-    disableFuture: internalProps.disableFuture ?? false,
-    format: internalProps.format ?? defaultFormat
-  };
+function useApplyDefaultValuesToTimeFieldInternalProps(internalProps) {
+  const utils = (0, _useUtils.useUtils)();
+  const validationProps = useApplyDefaultValuesToTimeValidationProps(internalProps);
+  const ampm = React.useMemo(() => internalProps.ampm ?? utils.is12HourCycleInCurrentLocale(), [internalProps.ampm, utils]);
+  return React.useMemo(() => (0, _extends2.default)({}, internalProps, validationProps, {
+    format: internalProps.format ?? (ampm ? utils.formats.fullTime12h : utils.formats.fullTime24h)
+  }), [internalProps, validationProps, ampm, utils]);
+}
+function useApplyDefaultValuesToTimeValidationProps(props) {
+  return React.useMemo(() => ({
+    disablePast: props.disablePast ?? false,
+    disableFuture: props.disableFuture ?? false
+  }), [props.disablePast, props.disableFuture]);
 }

package/models/manager.d.ts

@@ -1,5 +1,4 @@
 import type { FieldValueManager, UseFieldInternalProps } from '../internals/hooks/useField';
-import type { UseLocalizationContextReturnValue } from '../internals/hooks/useUtils';
 import type { PickerValidValue, PickerValueManager } from '../internals/models';
 import type { Validator } from '../validation';
 import type { PickerValueType } from './common';
@@ -66,18 +65,14 @@ export interface PickerManager<TValue extends PickerValidValue, TEnableAccessibl
    * - a default format to display the value in the field
    * - some default validation props that are needed to validate the value (e.g: minDate, maxDate)
    * This property is not part of the public API and should not be used directly.
-   * @param {ApplyDefaultsToFieldInternalPropsParameters<TFieldInternalProps>} parameters The parameters to apply the defaults.
+   * @param {TFieldInternalProps<TFieldInternalProps>} internalProps The field internal props to apply the defaults to.
    * @returns {TFieldInternalPropsWithDefaults} The field internal props with the defaults applied.
    */
-  internal_applyDefaultsToFieldInternalProps: (parameters: ApplyDefaultsToFieldInternalPropsParameters<TFieldInternalProps>) => UseFieldInternalProps<TValue, TEnableAccessibleFieldDOMStructure, TError> & TValidationProps;
+  internal_useApplyDefaultValuesToFieldInternalProps: (internalProps: TFieldInternalProps) => UseFieldInternalProps<TValue, TEnableAccessibleFieldDOMStructure, TError> & TValidationProps;
   /**
    * Returns a hook that creates the aria-label to apply on the button that opens the Picker.
    * @param {TValue} value The value of the Picker.
    * @returns {string} The aria-label to apply on the button that opens the Picker.
    */
   internal_useOpenPickerButtonAriaLabel: (value: TValue) => string;
-}
-interface ApplyDefaultsToFieldInternalPropsParameters<TFieldInternalProps extends {}> extends UseLocalizationContextReturnValue {
-  internalProps: TFieldInternalProps;
-}
-export {};
+}

package/modern/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/modern/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/modern/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/modern/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/modern/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/modern/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/modern/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/modern/TimePicker/shared.js

@@ -4,12 +4,14 @@ import { useThemeProps } from '@mui/material/styles';
 import { useUtils } from "../internals/hooks/useUtils.js";
 import { TimePickerToolbar } from "./TimePickerToolbar.js";
 import { applyDefaultViewProps } from "../internals/utils/views.js";
+import { useApplyDefaultValuesToTimeValidationProps } from "../managers/useTimeManager.js";
 export function useTimePickerDefaultizedProps(props, name) {
   const utils = useUtils();
   const themeProps = useThemeProps({
     props,
     name
   });
+  const validationProps = useApplyDefaultValuesToTimeValidationProps(themeProps);
   const ampm = themeProps.ampm ?? utils.is12HourCycleInCurrentLocale();
   const localeText = React.useMemo(() => {
     if (themeProps.localeText?.toolbarTitle == null) {
@@ -19,7 +21,7 @@ export function useTimePickerDefaultizedProps(props, name) {
       timePickerToolbarTitle: themeProps.localeText.toolbarTitle
     });
   }, [themeProps.localeText]);
-  return _extends({}, themeProps, {
+  return _extends({}, themeProps, validationProps, {
     ampm,
     localeText
   }, applyDefaultViewProps({
@@ -28,8 +30,6 @@ export function useTimePickerDefaultizedProps(props, name) {
     defaultViews: ['hours', 'minutes'],
     defaultOpenTo: 'hours'
   }), {
-    disableFuture: themeProps.disableFuture ?? false,
-    disablePast: themeProps.disablePast ?? false,
     slots: _extends({
       toolbar: TimePickerToolbar
     }, themeProps.slots),

package/modern/YearCalendar/YearCalendar.js

@@ -11,14 +11,14 @@ import { shouldForwardProp } from '@mui/system/createStyled';
 import { styled, useThemeProps } from '@mui/material/styles';
 import { unstable_useForkRef as useForkRef, unstable_composeClasses as composeClasses, unstable_useControlled as useControlled, unstable_useEventCallback as useEventCallback } from '@mui/utils';
 import { YearCalendarButton } from "./YearCalendarButton.js";
-import { useUtils, useNow, useDefaultDates } from "../internals/hooks/useUtils.js";
+import { useUtils, useNow } from "../internals/hooks/useUtils.js";
 import { getYearCalendarUtilityClass } from "./yearCalendarClasses.js";
-import { applyDefaultDate } 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, MAX_CALENDAR_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 = {
@@ -27,20 +27,14 @@ const useUtilityClasses = classes => {
   return composeClasses(slots, getYearCalendarUtilityClass, classes);
 };
 function useYearCalendarDefaultizedProps(props, name) {
-  const utils = useUtils();
-  const defaultDates = useDefaultDates();
   const themeProps = useThemeProps({
     props,
     name
   });
-  return _extends({
-    disablePast: false,
-    disableFuture: false
-  }, themeProps, {
+  const validationProps = useApplyDefaultValuesToDateValidationProps(themeProps);
+  return _extends({}, themeProps, validationProps, {
     yearsPerRow: themeProps.yearsPerRow ?? 3,
-    yearsOrder: themeProps.yearsOrder ?? 'asc',
-    minDate: applyDefaultDate(utils, themeProps.minDate, defaultDates.minDate),
-    maxDate: applyDefaultDate(utils, themeProps.maxDate, defaultDates.maxDate)
+    yearsOrder: themeProps.yearsOrder ?? 'asc'
   });
 }
 const YearCalendarRoot = styled('div', {

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers v8.0.0-beta.1
+ * @mui/x-date-pickers v8.0.0-beta.2
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/internals/hooks/useField/syncSelectionToDOM.d.ts

@@ -0,0 +1,9 @@
+import { PickerValidValue } from "../../models/index.js";
+import { UseFieldDOMGetters } from "./useField.types.js";
+import { UseFieldStateReturnValue } from "./useFieldState.js";
+export declare function syncSelectionToDOM<TValue extends PickerValidValue>(parameters: SyncSelectionToDOMParameters<TValue>): void;
+export interface SyncSelectionToDOMParameters<TValue extends PickerValidValue> {
+  domGetters: UseFieldDOMGetters;
+  stateResponse: UseFieldStateReturnValue<TValue>;
+  focused: boolean;
+}

package/modern/internals/hooks/useField/syncSelectionToDOM.js

@@ -0,0 +1,50 @@
+import { getActiveElement } from "../../utils/utils.js";
+export function syncSelectionToDOM(parameters) {
+  const {
+    focused,
+    domGetters,
+    stateResponse: {
+      // States and derived states
+      parsedSelectedSections,
+      state
+    }
+  } = parameters;
+  if (!domGetters.isReady()) {
+    return;
+  }
+  const selection = document.getSelection();
+  if (!selection) {
+    return;
+  }
+  if (parsedSelectedSections == null) {
+    // If the selection contains an element inside the field, we reset it.
+    if (selection.rangeCount > 0 && domGetters.getRoot().contains(selection.getRangeAt(0).startContainer)) {
+      selection.removeAllRanges();
+    }
+    if (focused) {
+      domGetters.getRoot().blur();
+    }
+    return;
+  }
+
+  // On multi input range pickers we want to update selection range only for the active input
+  if (!domGetters.getRoot().contains(getActiveElement(document))) {
+    return;
+  }
+  const range = new window.Range();
+  let target;
+  if (parsedSelectedSections === 'all') {
+    target = domGetters.getRoot();
+  } else {
+    const section = state.sections[parsedSelectedSections];
+    if (section.type === 'empty') {
+      target = domGetters.getSectionContainer(parsedSelectedSections);
+    } else {
+      target = domGetters.getSectionContent(parsedSelectedSections);
+    }
+  }
+  range.selectNodeContents(target);
+  target.focus();
+  selection.removeAllRanges();
+  selection.addRange(range);
+}

package/modern/internals/hooks/useField/useField.types.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { FieldSectionType, FieldSection, FieldSelectedSections, MuiPickersAdapter, TimezoneProps, FieldSectionContentType, PickerValidDate, FieldRef, OnErrorProps, InferFieldSection, PickerManager, PickerValueType } from "../../../models/index.js";
 import { InternalPropNames } from "../../../hooks/useSplitFieldProps.js";
-import { PickersSectionElement, PickersSectionListRef } from "../../../PickersSectionList/index.js";
+import type { PickersSectionElement, PickersSectionListRef } from '../../../PickersSectionList';
 import { FormProps, InferNonNullablePickerValue, PickerValidValue } from "../../models/index.js";
 export interface UseFieldParameters<TValue extends PickerValidValue, TEnableAccessibleFieldDOMStructure extends boolean, TError, TValidationProps extends {}, TProps extends UseFieldProps<TEnableAccessibleFieldDOMStructure>> {
   manager: PickerManager<TValue, TEnableAccessibleFieldDOMStructure, TError, TValidationProps, any>;
@@ -319,4 +319,11 @@ export interface CharacterEditingQuery {
 export type UseFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> = UseFieldForwardedProps<TEnableAccessibleFieldDOMStructure> & {
   enableAccessibleFieldDOMStructure?: boolean;
 };
+export interface UseFieldDOMGetters {
+  isReady: () => boolean;
+  getRoot: () => HTMLElement;
+  getSectionContainer: (sectionIndex: number) => HTMLElement;
+  getSectionContent: (sectionIndex: number) => HTMLElement;
+  getSectionIndexFromDOMElement: (element: Element | null | undefined) => number | null;
+}
 export {};