@mui/x-date-pickers 7.16.0 → 7.18.0

package/modern/validation/useValidation.js

@@ -0,0 +1,54 @@
+'use client';
+
+import * as React from 'react';
+import useEventCallback from '@mui/utils/useEventCallback';
+import { useLocalizationContext } from "../internals/hooks/useUtils.js";
+/**
+ * Utility hook to check if a given value is valid based on the provided validation props.
+ * @template TDate
+ * @template TValue The value type. It will be either the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
+ * @template TError The validation error type. It will be either `string` or a `null`. It can be in `[start, end]` format in case of range value.
+ * @param {UseValidationOptions<TValue, TDate, TError, TValidationProps>} options The options to configure the hook.
+ * @param {TValue} options.value The value to validate.
+ * @param {PickersTimezone} options.timezone The timezone to use for the validation.
+ * @param {Validator<TValue, TDate, TError, TValidationProps>} options.validator The validator function to use.
+ * @param {TValidationProps} options.props The validation props, they differ depending on the component.
+ * @param {(error: TError, value: TValue) => void} options.onError Callback fired when the error associated with the current value changes.
+ */
+export function useValidation(options) {
+  const {
+    props,
+    validator,
+    value,
+    timezone,
+    onError
+  } = options;
+  const adapter = useLocalizationContext();
+  const previousValidationErrorRef = React.useRef(validator.valueManager.defaultErrorState);
+  const validationError = validator({
+    adapter,
+    value,
+    timezone,
+    props
+  });
+  const hasValidationError = validator.valueManager.hasError(validationError);
+  React.useEffect(() => {
+    if (onError && !validator.valueManager.isSameError(validationError, previousValidationErrorRef.current)) {
+      onError(validationError, value);
+    }
+    previousValidationErrorRef.current = validationError;
+  }, [validator, onError, validationError, value]);
+  const getValidationErrorForNewValue = useEventCallback(newValue => {
+    return validator({
+      adapter,
+      value: newValue,
+      timezone,
+      props
+    });
+  });
+  return {
+    validationError,
+    hasValidationError,
+    getValidationErrorForNewValue
+  };
+}

package/{internals/utils → modern}/validation/validateDate.js

@@ -1,7 +1,9 @@
-import { applyDefaultDate } from "../date-utils.js";
+import { applyDefaultDate } from "../internals/utils/date-utils.js";
+import { singleItemValueManager } from "../internals/utils/valueManagers.js";
 export const validateDate = ({
   props,
   value,
+  timezone,
   adapter
 }) => {
   if (value === null) {
@@ -12,8 +14,7 @@ export const validateDate = ({
     shouldDisableMonth,
     shouldDisableYear,
     disablePast,
-    disableFuture,
-    timezone
+    disableFuture
   } = props;
   const now = adapter.utils.date(undefined, timezone);
   const minDate = applyDefaultDate(adapter.utils, props.minDate, adapter.defaultDates.minDate);
@@ -38,4 +39,5 @@ export const validateDate = ({
     default:
       return null;
   }
-};
+};
+validateDate.valueManager = singleItemValueManager;

package/modern/{internals/utils/validation → validation}/validateDateTime.js

@@ -1,13 +1,16 @@
 import { validateDate } from "./validateDate.js";
 import { validateTime } from "./validateTime.js";
+import { singleItemValueManager } from "../internals/utils/valueManagers.js";
 export const validateDateTime = ({
-  props,
+  adapter,
   value,
-  adapter
+  timezone,
+  props
 }) => {
   const dateValidationResult = validateDate({
     adapter,
     value,
+    timezone,
     props
   });
   if (dateValidationResult !== null) {
@@ -16,6 +19,8 @@ export const validateDateTime = ({
   return validateTime({
     adapter,
     value,
+    timezone,
     props
   });
-};
+};
+validateDateTime.valueManager = singleItemValueManager;

package/{internals/utils → modern}/validation/validateTime.js

@@ -1,7 +1,9 @@
-import { createIsAfterIgnoreDatePart } from "../time-utils.js";
+import { createIsAfterIgnoreDatePart } from "../internals/utils/time-utils.js";
+import { singleItemValueManager } from "../internals/utils/valueManagers.js";
 export const validateTime = ({
   adapter,
   value,
+  timezone,
   props
 }) => {
   if (value === null) {
@@ -14,8 +16,7 @@ export const validateTime = ({
     shouldDisableTime,
     disableIgnoringDatePartForTimeValidation = false,
     disablePast,
-    disableFuture,
-    timezone
+    disableFuture
   } = props;
   const now = adapter.utils.date(undefined, timezone);
   const isAfter = createIsAfterIgnoreDatePart(disableIgnoringDatePartForTimeValidation, adapter.utils);
@@ -41,4 +42,5 @@ export const validateTime = ({
     default:
       return null;
   }
-};
+};
+validateTime.valueManager = singleItemValueManager;

package/node/AdapterDateFns/AdapterDateFns.js

@@ -87,7 +87,7 @@ class AdapterDateFns extends _AdapterDateFnsBase.AdapterDateFnsBase {
     /* istanbul ignore next */
     if (process.env.NODE_ENV !== 'production') {
       if (typeof _addDays.default !== 'function') {
-        throw new Error(['MUI: The `date-fns` package v3.x is not compatible with this adapter.', 'Please, install v2.x of the package or use the `AdapterDateFnsV3` instead.'].join('\n'));
+        throw new Error(['MUI: This adapter is only compatible with `date-fns` v2.x package versions.', 'Please, install v2.x of the package or use the `AdapterDateFnsV3` instead.'].join('\n'));
       }
     }
     super({

package/node/AdapterDateFnsV3/AdapterDateFnsV3.js

@@ -90,7 +90,7 @@ class AdapterDateFns extends _AdapterDateFnsBase.AdapterDateFnsBase {
     /* istanbul ignore next */
     if (process.env.NODE_ENV !== 'production') {
       if (typeof _addDays.addDays !== 'function') {
-        throw new Error([`MUI: The \`date-fns\` package v2.x is not compatible with this adapter.`, 'Please, install v3.x of the package or use the `AdapterDateFns` instead.'].join('\n'));
+        throw new Error([`MUI: The \`date-fns\` package v2.x is not compatible with this adapter.`, 'Please, install v3.x or v4.x of the package or use the `AdapterDateFns` instead.'].join('\n'));
       }
       if (!_format.longFormatters) {
         throw new Error('MUI: The minimum supported `date-fns` package version compatible with this adapter is `3.2.x`.');

package/node/AdapterDayjs/AdapterDayjs.js

@@ -12,7 +12,7 @@ var _customParseFormat = _interopRequireDefault(require("dayjs/plugin/customPars
 var _localizedFormat = _interopRequireDefault(require("dayjs/plugin/localizedFormat"));
 var _isBetween = _interopRequireDefault(require("dayjs/plugin/isBetween"));
 var _advancedFormat = _interopRequireDefault(require("dayjs/plugin/advancedFormat"));
-var _warning = require("../internals/utils/warning");
+var _warning = require("@mui/x-internals/warning");
 /* eslint-disable class-methods-use-this */
 
 _dayjs.default.extend(_localizedFormat.default);

package/node/DateCalendar/DateCalendar.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
@@ -30,7 +31,7 @@ var _useValueWithTimezone = require("../internals/hooks/useValueWithTimezone");
 var _valueManagers = require("../internals/utils/valueManagers");
 var _dimensions = require("../internals/constants/dimensions");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["autoFocus", "onViewChange", "value", "defaultValue", "referenceDate", "disableFuture", "disablePast", "onChange", "onYearChange", "onMonthChange", "reduceAnimations", "shouldDisableDate", "shouldDisableMonth", "shouldDisableYear", "view", "views", "openTo", "className", "disabled", "readOnly", "minDate", "maxDate", "disableHighlightToday", "focusedView", "onFocusedViewChange", "showDaysOutsideCurrentMonth", "fixedWeekNumber", "dayOfWeekFormatter", "slots", "slotProps", "loading", "renderLoading", "displayWeekNumber", "yearsPerRow", "monthsPerRow", "timezone"];
+const _excluded = ["autoFocus", "onViewChange", "value", "defaultValue", "referenceDate", "disableFuture", "disablePast", "onChange", "onYearChange", "onMonthChange", "reduceAnimations", "shouldDisableDate", "shouldDisableMonth", "shouldDisableYear", "view", "views", "openTo", "className", "disabled", "readOnly", "minDate", "maxDate", "disableHighlightToday", "focusedView", "onFocusedViewChange", "showDaysOutsideCurrentMonth", "fixedWeekNumber", "dayOfWeekFormatter", "slots", "slotProps", "loading", "renderLoading", "displayWeekNumber", "yearsOrder", "yearsPerRow", "monthsPerRow", "timezone"];
 const useUtilityClasses = ownerState => {
   const {
     classes
@@ -126,6 +127,7 @@ const DateCalendar = exports.DateCalendar = /*#__PURE__*/React.forwardRef(functi
       loading,
       renderLoading,
       displayWeekNumber,
+      yearsOrder,
       yearsPerRow,
       monthsPerRow,
       timezone: timezoneProp
@@ -317,6 +319,7 @@ const DateCalendar = exports.DateCalendar = /*#__PURE__*/React.forwardRef(functi
           shouldDisableYear: shouldDisableYear,
           hasFocus: hasFocus,
           onFocusedViewChange: isViewFocused => setFocusedView('year', isViewFocused),
+          yearsOrder: yearsOrder,
           yearsPerRow: yearsPerRow,
           referenceDate: referenceDate
         })), view === 'month' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_MonthCalendar.MonthCalendar, (0, _extends2.default)({}, baseDateValidationProps, commonViewProps, {
@@ -566,6 +569,12 @@ process.env.NODE_ENV !== "production" ? DateCalendar.propTypes = {
    * Available views.
    */
   views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['day', 'month', 'year']).isRequired),
+  /**
+   * Years are displayed in ascending (chronological) order by default.
+   * If `desc`, years are displayed in descending order.
+   * @default 'asc'
+   */
+  yearsOrder: _propTypes.default.oneOf(['asc', 'desc']),
   /**
    * Years rendered per row.
    * @default 3

package/node/DateCalendar/useCalendarState.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;

package/node/DateCalendar/useIsDateDisabled.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
@@ -6,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.useIsDateDisabled = void 0;
 var React = _interopRequireWildcard(require("react"));
-var _validateDate = require("../internals/utils/validation/validateDate");
+var _validation = require("../validation");
 var _useUtils = require("../internals/hooks/useUtils");
 const useIsDateDisabled = ({
   shouldDisableDate,
@@ -19,9 +20,10 @@ const useIsDateDisabled = ({
   timezone
 }) => {
   const adapter = (0, _useUtils.useLocalizationContext)();
-  return React.useCallback(day => (0, _validateDate.validateDate)({
+  return React.useCallback(day => (0, _validation.validateDate)({
     adapter,
     value: day,
+    timezone,
     props: {
       shouldDisableDate,
       shouldDisableMonth,
@@ -29,8 +31,7 @@ const useIsDateDisabled = ({
       minDate,
       maxDate,
       disableFuture,
-      disablePast,
-      timezone
+      disablePast
     }
   }) !== null, [adapter, shouldDisableDate, shouldDisableMonth, shouldDisableYear, minDate, maxDate, disableFuture, disablePast, timezone]);
 };

package/node/DateField/DateField.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;

package/node/DateField/useDateField.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -6,21 +7,21 @@ Object.defineProperty(exports, "__esModule", {
 exports.useDateField = void 0;
 var _valueManagers = require("../internals/utils/valueManagers");
 var _useField = require("../internals/hooks/useField");
-var _validateDate = require("../internals/utils/validation/validateDate");
-var _fields = require("../internals/utils/fields");
+var _validation = require("../validation");
+var _hooks = require("../hooks");
 var _defaultizedFieldProps = require("../internals/hooks/defaultizedFieldProps");
 const useDateField = inProps => {
   const props = (0, _defaultizedFieldProps.useDefaultizedDateField)(inProps);
   const {
     forwardedProps,
     internalProps
-  } = (0, _fields.splitFieldInternalAndForwardedProps)(props, 'date');
+  } = (0, _hooks.useSplitFieldProps)(props, 'date');
   return (0, _useField.useField)({
     forwardedProps,
     internalProps,
     valueManager: _valueManagers.singleItemValueManager,
     fieldValueManager: _valueManagers.singleItemFieldValueManager,
-    validator: _validateDate.validateDate,
+    validator: _validation.validateDate,
     valueType: 'date'
   });
 };

package/node/DatePicker/DatePicker.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
@@ -357,6 +358,12 @@ process.env.NODE_ENV !== "production" ? DatePicker.propTypes = {
    * Available views.
    */
   views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['day', 'month', 'year']).isRequired),
+  /**
+   * Years are displayed in ascending (chronological) order by default.
+   * If `desc`, years are displayed in descending order.
+   * @default 'asc'
+   */
+  yearsOrder: _propTypes.default.oneOf(['asc', 'desc']),
   /**
    * Years rendered per row.
    * @default 4 on desktop, 3 on mobile

package/node/DatePicker/DatePickerToolbar.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;

package/node/DateTimeField/DateTimeField.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;

package/node/DateTimeField/useDateTimeField.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -6,21 +7,21 @@ Object.defineProperty(exports, "__esModule", {
 exports.useDateTimeField = void 0;
 var _valueManagers = require("../internals/utils/valueManagers");
 var _useField = require("../internals/hooks/useField");
-var _validateDateTime = require("../internals/utils/validation/validateDateTime");
-var _fields = require("../internals/utils/fields");
+var _validation = require("../validation");
+var _hooks = require("../hooks");
 var _defaultizedFieldProps = require("../internals/hooks/defaultizedFieldProps");
 const useDateTimeField = inProps => {
   const props = (0, _defaultizedFieldProps.useDefaultizedDateTimeField)(inProps);
   const {
     forwardedProps,
     internalProps
-  } = (0, _fields.splitFieldInternalAndForwardedProps)(props, 'date-time');
+  } = (0, _hooks.useSplitFieldProps)(props, 'date-time');
   return (0, _useField.useField)({
     forwardedProps,
     internalProps,
     valueManager: _valueManagers.singleItemValueManager,
     fieldValueManager: _valueManagers.singleItemFieldValueManager,
-    validator: _validateDateTime.validateDateTime,
+    validator: _validation.validateDateTime,
     valueType: 'date-time'
   });
 };

package/node/DateTimePicker/DateTimePicker.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
@@ -428,6 +429,12 @@ process.env.NODE_ENV !== "production" ? DateTimePicker.propTypes = {
    * Available views.
    */
   views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['day', 'hours', 'minutes', 'month', 'seconds', 'year']).isRequired),
+  /**
+   * Years are displayed in ascending (chronological) order by default.
+   * If `desc`, years are displayed in descending order.
+   * @default 'asc'
+   */
+  yearsOrder: _propTypes.default.oneOf(['asc', 'desc']),
   /**
    * Years rendered per row.
    * @default 4 on desktop, 3 on mobile

package/node/DateTimePicker/DateTimePickerTabs.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;

package/node/DateTimePicker/DateTimePickerToolbar.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;

package/node/DayCalendarSkeleton/DayCalendarSkeleton.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;

package/node/DesktopDatePicker/DesktopDatePicker.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
@@ -15,13 +16,13 @@ var _valueManagers = require("../internals/utils/valueManagers");
 var _shared = require("../DatePicker/shared");
 var _usePickersTranslations = require("../hooks/usePickersTranslations");
 var _useUtils = require("../internals/hooks/useUtils");
-var _validateDate = require("../internals/utils/validation/validateDate");
+var _validation = require("../validation");
 var _useDesktopPicker = require("../internals/hooks/useDesktopPicker");
 var _icons = require("../icons");
 var _DateField = require("../DateField");
-var _extractValidationProps = require("../internals/utils/validation/extractValidationProps");
 var _dateViewRenderers = require("../dateViewRenderers");
 var _dateUtils = require("../internals/utils/date-utils");
+var _getPickersLocalization = require("../locales/utils/getPickersLocalization");
 /**
  * Demos:
  *
@@ -54,7 +55,7 @@ const DesktopDatePicker = exports.DesktopDatePicker = /*#__PURE__*/React.forward
       field: _DateField.DateField
     }, defaultizedProps.slots),
     slotProps: (0, _extends2.default)({}, defaultizedProps.slotProps, {
-      field: ownerState => (0, _extends2.default)({}, (0, _resolveComponentProps.default)(defaultizedProps.slotProps?.field, ownerState), (0, _extractValidationProps.extractValidationProps)(defaultizedProps), {
+      field: ownerState => (0, _extends2.default)({}, (0, _resolveComponentProps.default)(defaultizedProps.slotProps?.field, ownerState), (0, _validation.extractValidationProps)(defaultizedProps), {
         ref
       }),
       toolbar: (0, _extends2.default)({
@@ -68,8 +69,13 @@ const DesktopDatePicker = exports.DesktopDatePicker = /*#__PURE__*/React.forward
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'date',
-    getOpenDialogAriaText: props.localeText?.openDatePickerDialogue ?? translations.openDatePickerDialogue,
-    validator: _validateDate.validateDate
+    getOpenDialogAriaText: (0, _getPickersLocalization.buildGetOpenDialogAriaText)({
+      utils,
+      formatKey: 'fullDate',
+      contextTranslation: translations.openDatePickerDialogue,
+      propsTranslation: props.localeText?.openDatePickerDialogue
+    }),
+    validator: _validation.validateDate
   });
   return renderPicker();
 });
@@ -373,6 +379,12 @@ DesktopDatePicker.propTypes = {
    * Available views.
    */
   views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['day', 'month', 'year']).isRequired),
+  /**
+   * Years are displayed in ascending (chronological) order by default.
+   * If `desc`, years are displayed in descending order.
+   * @default 'asc'
+   */
+  yearsOrder: _propTypes.default.oneOf(['asc', 'desc']),
   /**
    * Years rendered per row.
    * @default 4

package/node/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
@@ -19,10 +20,9 @@ var _shared = require("../DateTimePicker/shared");
 var _dateViewRenderers = require("../dateViewRenderers/dateViewRenderers");
 var _usePickersTranslations = require("../hooks/usePickersTranslations");
 var _useUtils = require("../internals/hooks/useUtils");
-var _validateDateTime = require("../internals/utils/validation/validateDateTime");
+var _validation = require("../validation");
 var _icons = require("../icons");
 var _useDesktopPicker = require("../internals/hooks/useDesktopPicker");
-var _extractValidationProps = require("../internals/utils/validation/extractValidationProps");
 var _dateTimeUtils = require("../internals/utils/date-time-utils");
 var _timeViewRenderers = require("../timeViewRenderers");
 var _MultiSectionDigitalClock = require("../MultiSectionDigitalClock");
@@ -31,6 +31,7 @@ var _DesktopDateTimePickerLayout = require("./DesktopDateTimePickerLayout");
 var _dimensions = require("../internals/constants/dimensions");
 var _timeUtils = require("../internals/utils/time-utils");
 var _dateUtils = require("../internals/utils/date-utils");
+var _getPickersLocalization = require("../locales/utils/getPickersLocalization");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["openTo", "focusedView", "timeViewsCount"];
 const rendererInterceptor = function rendererInterceptor(inViewRenderers, popperView, rendererProps) {
@@ -132,7 +133,7 @@ const DesktopDateTimePicker = exports.DesktopDateTimePicker = /*#__PURE__*/React
       openPickerIcon: _icons.CalendarIcon
     }, defaultizedProps.slots),
     slotProps: (0, _extends2.default)({}, defaultizedProps.slotProps, {
-      field: ownerState => (0, _extends2.default)({}, (0, _resolveComponentProps.default)(defaultizedProps.slotProps?.field, ownerState), (0, _extractValidationProps.extractValidationProps)(defaultizedProps), {
+      field: ownerState => (0, _extends2.default)({}, (0, _resolveComponentProps.default)(defaultizedProps.slotProps?.field, ownerState), (0, _validation.extractValidationProps)(defaultizedProps), {
         ref
       }),
       toolbar: (0, _extends2.default)({
@@ -154,8 +155,13 @@ const DesktopDateTimePicker = exports.DesktopDateTimePicker = /*#__PURE__*/React
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'date-time',
-    getOpenDialogAriaText: props.localeText?.openDatePickerDialogue ?? translations.openDatePickerDialogue,
-    validator: _validateDateTime.validateDateTime,
+    getOpenDialogAriaText: (0, _getPickersLocalization.buildGetOpenDialogAriaText)({
+      utils,
+      formatKey: 'fullDate',
+      contextTranslation: translations.openDatePickerDialogue,
+      propsTranslation: props.localeText?.openDatePickerDialogue
+    }),
+    validator: _validation.validateDateTime,
     rendererInterceptor
   });
   return renderPicker();
@@ -531,6 +537,12 @@ DesktopDateTimePicker.propTypes = {
    * Available views.
    */
   views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['day', 'hours', 'minutes', 'month', 'seconds', 'year']).isRequired),
+  /**
+   * Years are displayed in ascending (chronological) order by default.
+   * If `desc`, years are displayed in descending order.
+   * @default 'asc'
+   */
+  yearsOrder: _propTypes.default.oneOf(['asc', 'desc']),
   /**
    * Years rendered per row.
    * @default 4

package/node/DesktopTimePicker/DesktopTimePicker.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
@@ -16,13 +17,13 @@ var _TimeField = require("../TimeField");
 var _shared = require("../TimePicker/shared");
 var _usePickersTranslations = require("../hooks/usePickersTranslations");
 var _useUtils = require("../internals/hooks/useUtils");
-var _validateTime = require("../internals/utils/validation/validateTime");
+var _validation = require("../validation");
 var _icons = require("../icons");
 var _useDesktopPicker = require("../internals/hooks/useDesktopPicker");
-var _extractValidationProps = require("../internals/utils/validation/extractValidationProps");
 var _timeViewRenderers = require("../timeViewRenderers");
 var _timeUtils = require("../internals/utils/time-utils");
 var _dateTimeUtils = require("../internals/utils/date-time-utils");
+var _getPickersLocalization = require("../locales/utils/getPickersLocalization");
 /**
  * Demos:
  *
@@ -71,7 +72,7 @@ const DesktopTimePicker = exports.DesktopTimePicker = /*#__PURE__*/React.forward
       openPickerIcon: _icons.ClockIcon
     }, defaultizedProps.slots),
     slotProps: (0, _extends2.default)({}, defaultizedProps.slotProps, {
-      field: ownerState => (0, _extends2.default)({}, (0, _resolveComponentProps.default)(defaultizedProps.slotProps?.field, ownerState), (0, _extractValidationProps.extractValidationProps)(defaultizedProps), {
+      field: ownerState => (0, _extends2.default)({}, (0, _resolveComponentProps.default)(defaultizedProps.slotProps?.field, ownerState), (0, _validation.extractValidationProps)(defaultizedProps), {
         ref
       }),
       toolbar: (0, _extends2.default)({
@@ -89,8 +90,13 @@ const DesktopTimePicker = exports.DesktopTimePicker = /*#__PURE__*/React.forward
     props,
     valueManager: _valueManagers.singleItemValueManager,
     valueType: 'time',
-    getOpenDialogAriaText: props.localeText?.openTimePickerDialogue ?? translations.openTimePickerDialogue,
-    validator: _validateTime.validateTime
+    getOpenDialogAriaText: (0, _getPickersLocalization.buildGetOpenDialogAriaText)({
+      utils,
+      formatKey: 'fullTime',
+      contextTranslation: translations.openTimePickerDialogue,
+      propsTranslation: props.localeText?.openTimePickerDialogue
+    }),
+    validator: _validation.validateTime
   });
   return renderPicker();
 });

package/node/DigitalClock/DigitalClock.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;

package/node/LocalizationProvider/LocalizationProvider.js

@@ -1,4 +1,5 @@
 "use strict";
+'use client';
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;