@mui/x-date-pickers 8.0.0-alpha.12 → 8.0.0-alpha.14

package/modern/AdapterDateFnsJalaliV2/AdapterDateFnsJalaliV2.d.ts

@@ -1,4 +1,4 @@
-import { Locale as DateFnsLocale } from 'date-fns-jalali/locale';
+import type { Locale as DateFnsLocale } from 'date-fns-jalali';
 import { AdapterFormats, AdapterOptions, MuiPickersAdapter } from "../models/index.js";
 import { AdapterDateFnsBase } from "../AdapterDateFnsBase/index.js";
 declare module '@mui/x-date-pickers/models' {

package/modern/AdapterDateFnsJalaliV2/AdapterDateFnsJalaliV2.js

@@ -1,50 +1,52 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-/* eslint-disable class-methods-use-this */
+// date-fns-jalali@<3 has no exports field defined
+// See https://github.com/date-fns/date-fns/issues/1781
+/* eslint-disable import/extensions, class-methods-use-this */
 // @ts-nocheck
-import addSeconds from 'date-fns-jalali/addSeconds';
-import addMinutes from 'date-fns-jalali/addMinutes';
-import addHours from 'date-fns-jalali/addHours';
-import addDays from 'date-fns-jalali/addDays';
-import addWeeks from 'date-fns-jalali/addWeeks';
-import addMonths from 'date-fns-jalali/addMonths';
-import addYears from 'date-fns-jalali/addYears';
-import endOfDay from 'date-fns-jalali/endOfDay';
-import endOfWeek from 'date-fns-jalali/endOfWeek';
-import endOfYear from 'date-fns-jalali/endOfYear';
-import dateFnsFormat from 'date-fns-jalali/format';
-import getHours from 'date-fns-jalali/getHours';
-import getSeconds from 'date-fns-jalali/getSeconds';
-import getMilliseconds from 'date-fns-jalali/getMilliseconds';
-import getWeek from 'date-fns-jalali/getWeek';
-import getYear from 'date-fns-jalali/getYear';
-import getMonth from 'date-fns-jalali/getMonth';
-import getDate from 'date-fns-jalali/getDate';
-import getDaysInMonth from 'date-fns-jalali/getDaysInMonth';
-import getMinutes from 'date-fns-jalali/getMinutes';
-import isAfter from 'date-fns-jalali/isAfter';
-import isBefore from 'date-fns-jalali/isBefore';
-import isEqual from 'date-fns-jalali/isEqual';
-import isSameDay from 'date-fns-jalali/isSameDay';
-import isSameYear from 'date-fns-jalali/isSameYear';
-import isSameMonth from 'date-fns-jalali/isSameMonth';
-import isSameHour from 'date-fns-jalali/isSameHour';
-import isValid from 'date-fns-jalali/isValid';
-import dateFnsParse from 'date-fns-jalali/parse';
-import setDate from 'date-fns-jalali/setDate';
-import setHours from 'date-fns-jalali/setHours';
-import setMinutes from 'date-fns-jalali/setMinutes';
-import setMonth from 'date-fns-jalali/setMonth';
-import setSeconds from 'date-fns-jalali/setSeconds';
-import setMilliseconds from 'date-fns-jalali/setMilliseconds';
-import setYear from 'date-fns-jalali/setYear';
-import startOfDay from 'date-fns-jalali/startOfDay';
-import startOfMonth from 'date-fns-jalali/startOfMonth';
-import endOfMonth from 'date-fns-jalali/endOfMonth';
-import startOfWeek from 'date-fns-jalali/startOfWeek';
-import startOfYear from 'date-fns-jalali/startOfYear';
-import isWithinInterval from 'date-fns-jalali/isWithinInterval';
-import defaultLocale from 'date-fns-jalali/locale/fa-IR';
-import longFormatters from 'date-fns-jalali/_lib/format/longFormatters';
+import addSeconds from 'date-fns-jalali/addSeconds/index.js';
+import addMinutes from 'date-fns-jalali/addMinutes/index.js';
+import addHours from 'date-fns-jalali/addHours/index.js';
+import addDays from 'date-fns-jalali/addDays/index.js';
+import addWeeks from 'date-fns-jalali/addWeeks/index.js';
+import addMonths from 'date-fns-jalali/addMonths/index.js';
+import addYears from 'date-fns-jalali/addYears/index.js';
+import endOfDay from 'date-fns-jalali/endOfDay/index.js';
+import endOfWeek from 'date-fns-jalali/endOfWeek/index.js';
+import endOfYear from 'date-fns-jalali/endOfYear/index.js';
+import dateFnsFormat from 'date-fns-jalali/format/index.js';
+import getHours from 'date-fns-jalali/getHours/index.js';
+import getSeconds from 'date-fns-jalali/getSeconds/index.js';
+import getMilliseconds from 'date-fns-jalali/getMilliseconds/index.js';
+import getWeek from 'date-fns-jalali/getWeek/index.js';
+import getYear from 'date-fns-jalali/getYear/index.js';
+import getMonth from 'date-fns-jalali/getMonth/index.js';
+import getDate from 'date-fns-jalali/getDate/index.js';
+import getDaysInMonth from 'date-fns-jalali/getDaysInMonth/index.js';
+import getMinutes from 'date-fns-jalali/getMinutes/index.js';
+import isAfter from 'date-fns-jalali/isAfter/index.js';
+import isBefore from 'date-fns-jalali/isBefore/index.js';
+import isEqual from 'date-fns-jalali/isEqual/index.js';
+import isSameDay from 'date-fns-jalali/isSameDay/index.js';
+import isSameYear from 'date-fns-jalali/isSameYear/index.js';
+import isSameMonth from 'date-fns-jalali/isSameMonth/index.js';
+import isSameHour from 'date-fns-jalali/isSameHour/index.js';
+import isValid from 'date-fns-jalali/isValid/index.js';
+import dateFnsParse from 'date-fns-jalali/parse/index.js';
+import setDate from 'date-fns-jalali/setDate/index.js';
+import setHours from 'date-fns-jalali/setHours/index.js';
+import setMinutes from 'date-fns-jalali/setMinutes/index.js';
+import setMonth from 'date-fns-jalali/setMonth/index.js';
+import setSeconds from 'date-fns-jalali/setSeconds/index.js';
+import setMilliseconds from 'date-fns-jalali/setMilliseconds/index.js';
+import setYear from 'date-fns-jalali/setYear/index.js';
+import startOfDay from 'date-fns-jalali/startOfDay/index.js';
+import startOfMonth from 'date-fns-jalali/startOfMonth/index.js';
+import endOfMonth from 'date-fns-jalali/endOfMonth/index.js';
+import startOfWeek from 'date-fns-jalali/startOfWeek/index.js';
+import startOfYear from 'date-fns-jalali/startOfYear/index.js';
+import isWithinInterval from 'date-fns-jalali/isWithinInterval/index.js';
+import defaultLocale from 'date-fns-jalali/locale/fa-IR/index.js';
+import longFormatters from 'date-fns-jalali/_lib/format/longFormatters/index.js';
 import { AdapterDateFnsBase } from "../AdapterDateFnsBase/index.js";
 const defaultFormats = {
   year: 'yyyy',

package/modern/AdapterDateFnsV2/AdapterDateFnsV2.d.ts

@@ -1,4 +1,4 @@
-import { Locale as DateFnsLocale } from 'date-fns/locale';
+import type { Locale as DateFnsLocale } from 'date-fns';
 import { AdapterFormats, AdapterOptions, MuiPickersAdapter } from "../models/index.js";
 import { AdapterDateFnsBase } from "../AdapterDateFnsBase/index.js";
 declare module '@mui/x-date-pickers/models' {

package/modern/AdapterDateFnsV2/AdapterDateFnsV2.js

@@ -1,49 +1,51 @@
-/* eslint-disable class-methods-use-this */
+// date-fns@<3 has no exports field defined
+// See https://github.com/date-fns/date-fns/issues/1781
+/* eslint-disable import/extensions, class-methods-use-this */
 // @ts-nocheck
-import addDays from 'date-fns/addDays';
-import addSeconds from 'date-fns/addSeconds';
-import addMinutes from 'date-fns/addMinutes';
-import addHours from 'date-fns/addHours';
-import addWeeks from 'date-fns/addWeeks';
-import addMonths from 'date-fns/addMonths';
-import addYears from 'date-fns/addYears';
-import endOfDay from 'date-fns/endOfDay';
-import endOfWeek from 'date-fns/endOfWeek';
-import endOfYear from 'date-fns/endOfYear';
-import dateFnsFormat from 'date-fns/format';
-import getDate from 'date-fns/getDate';
-import getDaysInMonth from 'date-fns/getDaysInMonth';
-import getHours from 'date-fns/getHours';
-import getMinutes from 'date-fns/getMinutes';
-import getMonth from 'date-fns/getMonth';
-import getSeconds from 'date-fns/getSeconds';
-import getMilliseconds from 'date-fns/getMilliseconds';
-import getWeek from 'date-fns/getWeek';
-import getYear from 'date-fns/getYear';
-import isAfter from 'date-fns/isAfter';
-import isBefore from 'date-fns/isBefore';
-import isEqual from 'date-fns/isEqual';
-import isSameDay from 'date-fns/isSameDay';
-import isSameYear from 'date-fns/isSameYear';
-import isSameMonth from 'date-fns/isSameMonth';
-import isSameHour from 'date-fns/isSameHour';
-import isValid from 'date-fns/isValid';
-import dateFnsParse from 'date-fns/parse';
-import setDate from 'date-fns/setDate';
-import setHours from 'date-fns/setHours';
-import setMinutes from 'date-fns/setMinutes';
-import setMonth from 'date-fns/setMonth';
-import setSeconds from 'date-fns/setSeconds';
-import setMilliseconds from 'date-fns/setMilliseconds';
-import setYear from 'date-fns/setYear';
-import startOfDay from 'date-fns/startOfDay';
-import startOfMonth from 'date-fns/startOfMonth';
-import endOfMonth from 'date-fns/endOfMonth';
-import startOfWeek from 'date-fns/startOfWeek';
-import startOfYear from 'date-fns/startOfYear';
-import isWithinInterval from 'date-fns/isWithinInterval';
-import defaultLocale from 'date-fns/locale/en-US';
-import longFormatters from 'date-fns/_lib/format/longFormatters';
+import addDays from 'date-fns/addDays/index.js';
+import addSeconds from 'date-fns/addSeconds/index.js';
+import addMinutes from 'date-fns/addMinutes/index.js';
+import addHours from 'date-fns/addHours/index.js';
+import addWeeks from 'date-fns/addWeeks/index.js';
+import addMonths from 'date-fns/addMonths/index.js';
+import addYears from 'date-fns/addYears/index.js';
+import endOfDay from 'date-fns/endOfDay/index.js';
+import endOfWeek from 'date-fns/endOfWeek/index.js';
+import endOfYear from 'date-fns/endOfYear/index.js';
+import dateFnsFormat from 'date-fns/format/index.js';
+import getDate from 'date-fns/getDate/index.js';
+import getDaysInMonth from 'date-fns/getDaysInMonth/index.js';
+import getHours from 'date-fns/getHours/index.js';
+import getMinutes from 'date-fns/getMinutes/index.js';
+import getMonth from 'date-fns/getMonth/index.js';
+import getSeconds from 'date-fns/getSeconds/index.js';
+import getMilliseconds from 'date-fns/getMilliseconds/index.js';
+import getWeek from 'date-fns/getWeek/index.js';
+import getYear from 'date-fns/getYear/index.js';
+import isAfter from 'date-fns/isAfter/index.js';
+import isBefore from 'date-fns/isBefore/index.js';
+import isEqual from 'date-fns/isEqual/index.js';
+import isSameDay from 'date-fns/isSameDay/index.js';
+import isSameYear from 'date-fns/isSameYear/index.js';
+import isSameMonth from 'date-fns/isSameMonth/index.js';
+import isSameHour from 'date-fns/isSameHour/index.js';
+import isValid from 'date-fns/isValid/index.js';
+import dateFnsParse from 'date-fns/parse/index.js';
+import setDate from 'date-fns/setDate/index.js';
+import setHours from 'date-fns/setHours/index.js';
+import setMinutes from 'date-fns/setMinutes/index.js';
+import setMonth from 'date-fns/setMonth/index.js';
+import setSeconds from 'date-fns/setSeconds/index.js';
+import setMilliseconds from 'date-fns/setMilliseconds/index.js';
+import setYear from 'date-fns/setYear/index.js';
+import startOfDay from 'date-fns/startOfDay/index.js';
+import startOfMonth from 'date-fns/startOfMonth/index.js';
+import endOfMonth from 'date-fns/endOfMonth/index.js';
+import startOfWeek from 'date-fns/startOfWeek/index.js';
+import startOfYear from 'date-fns/startOfYear/index.js';
+import isWithinInterval from 'date-fns/isWithinInterval/index.js';
+import defaultLocale from 'date-fns/locale/en-US/index.js';
+import longFormatters from 'date-fns/_lib/format/longFormatters/index.js';
 import { AdapterDateFnsBase } from "../AdapterDateFnsBase/index.js";
 /**
  * Based on `@date-io/date-fns`

package/modern/AdapterDayjs/AdapterDayjs.js

@@ -1,11 +1,15 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 /* eslint-disable class-methods-use-this */
 import defaultDayjs from 'dayjs';
-import weekOfYearPlugin from 'dayjs/plugin/weekOfYear';
-import customParseFormatPlugin from 'dayjs/plugin/customParseFormat';
-import localizedFormatPlugin from 'dayjs/plugin/localizedFormat';
-import isBetweenPlugin from 'dayjs/plugin/isBetween';
-import advancedFormatPlugin from 'dayjs/plugin/advancedFormat';
+// dayjs has no exports field defined
+// See https://github.com/iamkun/dayjs/issues/2562
+/* eslint-disable import/extensions */
+import weekOfYearPlugin from 'dayjs/plugin/weekOfYear.js';
+import customParseFormatPlugin from 'dayjs/plugin/customParseFormat.js';
+import localizedFormatPlugin from 'dayjs/plugin/localizedFormat.js';
+import isBetweenPlugin from 'dayjs/plugin/isBetween.js';
+import advancedFormatPlugin from 'dayjs/plugin/advancedFormat.js';
+/* eslint-enable import/extensions */
 import { warnOnce } from '@mui/x-internals/warning';
 defaultDayjs.extend(localizedFormatPlugin);
 defaultDayjs.extend(weekOfYearPlugin);

package/modern/DateCalendar/DateCalendar.js

@@ -344,6 +344,7 @@ export const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(
           referenceDate: referenceDate
         })), view === 'day' && /*#__PURE__*/_jsx(DayCalendar, _extends({}, calendarState, baseDateValidationProps, commonViewProps, {
           onMonthSwitchingAnimationEnd: onMonthSwitchingAnimationEnd,
+          hasFocus: hasFocus,
           onFocusedDayChange: focusedDate => setVisibleDate({
             target: focusedDate,
             reason: 'cell-interaction'
@@ -354,7 +355,6 @@ export const DateCalendar = /*#__PURE__*/React.forwardRef(function DateCalendar(
           shouldDisableDate: shouldDisableDate,
           shouldDisableMonth: shouldDisableMonth,
           shouldDisableYear: shouldDisableYear,
-          hasFocus: hasFocus,
           onFocusedViewChange: isViewFocused => setFocusedView('day', isViewFocused),
           showDaysOutsideCurrentMonth: showDaysOutsideCurrentMonth,
           fixedWeekNumber: fixedWeekNumber,

package/modern/DateField/useDateField.d.ts

@@ -1,2 +1,2 @@
 import { UseDateFieldProps } from "./DateField.types.js";
-export declare const useDateField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseDateFieldProps<TEnableAccessibleFieldDOMStructure>>(props: TAllProps) => import("../internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps, "disabled" | "readOnly" | "value" | "defaultValue" | "autoFocus" | "onChange" | "onError" | "format" | "timezone" | keyof import("../internals").BaseDateValidationProps | "shouldDisableYear" | "shouldDisableMonth" | "shouldDisableDate" | "referenceDate" | "formatDensity" | "shouldRespectLeadingZeros" | "selectedSections" | "onSelectedSectionsChange" | "unstableFieldRef" | "unstableStartFieldRef" | "unstableEndFieldRef" | "enableAccessibleFieldDOMStructure" | "dateSeparator">>;
+export declare const useDateField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseDateFieldProps<TEnableAccessibleFieldDOMStructure>>(props: TAllProps) => import("../internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps, "disabled" | "readOnly" | "value" | "defaultValue" | "autoFocus" | "onChange" | "onError" | "format" | "focused" | keyof import("../internals").BaseDateValidationProps | "shouldDisableYear" | "shouldDisableMonth" | "shouldDisableDate" | "referenceDate" | "formatDensity" | "timezone" | "shouldRespectLeadingZeros" | "selectedSections" | "onSelectedSectionsChange" | "unstableFieldRef" | "unstableStartFieldRef" | "unstableEndFieldRef" | "enableAccessibleFieldDOMStructure" | "dateSeparator">>;

package/modern/DatePicker/DatePicker.types.d.ts

@@ -1,5 +1,5 @@
 import { DesktopDatePickerProps, DesktopDatePickerSlots, DesktopDatePickerSlotProps } from "../DesktopDatePicker/index.js";
-import { BaseSingleInputFieldProps, PickerValue } from "../internals/models/index.js";
+import { BaseSingleInputFieldProps } from "../internals/models/index.js";
 import { MobileDatePickerProps, MobileDatePickerSlots, MobileDatePickerSlotProps } from "../MobileDatePicker/index.js";
 import { ValidateDateProps } from "../validation/validateDate.js";
 export interface DatePickerSlots extends DesktopDatePickerSlots, MobileDatePickerSlots {}
@@ -35,4 +35,4 @@ export interface DatePickerProps<TEnableAccessibleFieldDOMStructure extends bool
 /**
  * Props the field can receive when used inside a date picker (<DatePicker />, <DesktopDatePicker /> or <MobileDatePicker /> component).
  */
-export type DatePickerFieldProps = ValidateDateProps & BaseSingleInputFieldProps<PickerValue>;
+export type DatePickerFieldProps = ValidateDateProps & BaseSingleInputFieldProps;

package/modern/DatePicker/shared.d.ts

@@ -5,7 +5,7 @@ import { DateValidationError, DateView } from "../models/index.js";
 import { BasePickerInputProps } from "../internals/models/props/basePickerProps.js";
 import { LocalizedComponent } from "../locales/utils/pickersLocaleTextApi.js";
 import { DatePickerToolbarProps, ExportedDatePickerToolbarProps } from "./DatePickerToolbar.js";
-import { PickerViewRendererLookup } from "../internals/hooks/usePicker/usePickerViews.js";
+import { PickerViewRendererLookup } from "../internals/hooks/usePicker/index.js";
 import { DateViewRendererProps } from "../dateViewRenderers/index.js";
 import { PickerValue } from "../internals/models/index.js";
 import { ValidateDatePropsToDefault } from "../validation/validateDate.js";

package/modern/DateTimeField/useDateTimeField.d.ts

@@ -1,2 +1,2 @@
 import { UseDateTimeFieldProps } from "./DateTimeField.types.js";
-export declare const useDateTimeField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseDateTimeFieldProps<TEnableAccessibleFieldDOMStructure>>(props: TAllProps) => import("../internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps, "disabled" | "readOnly" | "value" | "defaultValue" | "autoFocus" | "onChange" | "onError" | "format" | "ampm" | "disableFuture" | "disablePast" | "maxDate" | "minDate" | "timezone" | "shouldDisableYear" | "shouldDisableMonth" | "shouldDisableDate" | "minTime" | "maxTime" | "minutesStep" | "shouldDisableTime" | "disableIgnoringDatePartForTimeValidation" | "minDateTime" | "maxDateTime" | "referenceDate" | "formatDensity" | "shouldRespectLeadingZeros" | "selectedSections" | "onSelectedSectionsChange" | "unstableFieldRef" | "unstableStartFieldRef" | "unstableEndFieldRef" | "enableAccessibleFieldDOMStructure" | "dateSeparator">>;
+export declare const useDateTimeField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseDateTimeFieldProps<TEnableAccessibleFieldDOMStructure>>(props: TAllProps) => import("../internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps, "disabled" | "readOnly" | "value" | "defaultValue" | "autoFocus" | "onChange" | "onError" | "format" | "focused" | "maxDate" | "minDate" | "disablePast" | "disableFuture" | "shouldDisableYear" | "shouldDisableMonth" | "shouldDisableDate" | "minTime" | "maxTime" | "minutesStep" | "shouldDisableTime" | "disableIgnoringDatePartForTimeValidation" | "ampm" | "minDateTime" | "maxDateTime" | "referenceDate" | "formatDensity" | "timezone" | "shouldRespectLeadingZeros" | "selectedSections" | "onSelectedSectionsChange" | "unstableFieldRef" | "unstableStartFieldRef" | "unstableEndFieldRef" | "enableAccessibleFieldDOMStructure" | "dateSeparator">>;

package/modern/DateTimePicker/DateTimePicker.types.d.ts

@@ -1,11 +1,11 @@
 import { DesktopDateTimePickerProps, DesktopDateTimePickerSlots, DesktopDateTimePickerSlotProps } from "../DesktopDateTimePicker/index.js";
-import { BaseSingleInputFieldProps, DateOrTimeViewWithMeridiem, PickerValue } from "../internals/models/index.js";
+import { BaseSingleInputFieldProps } from "../internals/models/index.js";
 import { MobileDateTimePickerProps, MobileDateTimePickerSlots, MobileDateTimePickerSlotProps } from "../MobileDateTimePicker/index.js";
 import { ValidateDateTimeProps } from "../validation/index.js";
 import { ExportedYearCalendarProps } from "../YearCalendar/YearCalendar.types.js";
 export interface DateTimePickerSlots extends DesktopDateTimePickerSlots, MobileDateTimePickerSlots {}
 export interface DateTimePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends DesktopDateTimePickerSlotProps<TEnableAccessibleFieldDOMStructure>, MobileDateTimePickerSlotProps<TEnableAccessibleFieldDOMStructure> {}
-export interface DateTimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends DesktopDateTimePickerProps<TEnableAccessibleFieldDOMStructure>, ExportedYearCalendarProps, Omit<MobileDateTimePickerProps<DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure>, 'views'> {
+export interface DateTimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends DesktopDateTimePickerProps<TEnableAccessibleFieldDOMStructure>, ExportedYearCalendarProps, Omit<MobileDateTimePickerProps<TEnableAccessibleFieldDOMStructure>, 'views'> {
   /**
    * CSS media query when `Mobile` mode will be changed to `Desktop`.
    * @default '@media (pointer: fine)'
@@ -31,4 +31,4 @@ export interface DateTimePickerProps<TEnableAccessibleFieldDOMStructure extends
 /**
  * Props the field can receive when used inside a date time picker (<DateTimePicker />, <DesktopDateTimePicker /> or <MobileDateTimePicker /> component).
  */
-export type DateTimePickerFieldProps = ValidateDateTimeProps & BaseSingleInputFieldProps<PickerValue>;
+export type DateTimePickerFieldProps = ValidateDateTimeProps & BaseSingleInputFieldProps;

package/modern/DateTimePicker/DateTimePickerToolbar.d.ts

@@ -3,7 +3,7 @@ import { BaseToolbarProps, ExportedBaseToolbarProps } from "../internals/models/
 import { DateTimePickerToolbarClasses } from "./dateTimePickerToolbarClasses.js";
 import { DateOrTimeViewWithMeridiem, PickerValue } from "../internals/models/index.js";
 import { DateTimeValidationError } from "../models/index.js";
-import { SetValueActionOptions } from "../internals/hooks/usePicker/usePickerValue.types.js";
+import { SetValueActionOptions } from "../internals/components/PickerProvider.js";
 export interface ExportedDateTimePickerToolbarProps extends ExportedBaseToolbarProps {
   /**
    * Override or extend the styles applied to the component.

package/modern/DateTimePicker/DateTimePickerToolbar.js

@@ -57,7 +57,7 @@ const DateTimePickerToolbarRoot = styled(PickersToolbar, {
     },
     style: {
       borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`,
-      [`& .${pickersToolbarClasses.content} .${pickersToolbarTextClasses.selected}`]: {
+      [`& .${pickersToolbarClasses.content} .${pickersToolbarTextClasses.root}[data-selected]`]: {
         color: (theme.vars || theme).palette.primary.main,
         fontWeight: theme.typography.fontWeightBold
       }

package/modern/DateTimePicker/shared.d.ts

@@ -1,19 +1,20 @@
 import * as React from 'react';
 import { DefaultizedProps } from '@mui/x-internals/types';
-import { DateTimeValidationError } from "../models/index.js";
+import { DateOrTimeView, DateTimeValidationError } from "../models/index.js";
 import { DateCalendarSlots, DateCalendarSlotProps, ExportedDateCalendarProps } from "../DateCalendar/DateCalendar.types.js";
-import { TimeClockSlots, TimeClockSlotProps } from "../TimeClock/TimeClock.types.js";
 import { BasePickerInputProps } from "../internals/models/props/basePickerProps.js";
 import { DateTimePickerTabsProps } from "./DateTimePickerTabs.js";
 import { LocalizedComponent } from "../locales/utils/pickersLocaleTextApi.js";
 import { DateTimePickerToolbarProps, ExportedDateTimePickerToolbarProps } from "./DateTimePickerToolbar.js";
-import { PickerViewRendererLookup } from "../internals/hooks/usePicker/usePickerViews.js";
+import { PickerViewRendererLookup } from "../internals/hooks/usePicker/index.js";
 import { DateViewRendererProps } from "../dateViewRenderers/index.js";
 import { TimeViewRendererProps } from "../timeViewRenderers/index.js";
-import { BaseClockProps, ExportedBaseClockProps } from "../internals/models/props/time.js";
+import { BaseClockProps, DigitalTimePickerProps } from "../internals/models/props/time.js";
 import { DateOrTimeViewWithMeridiem, PickerValue, TimeViewWithMeridiem } from "../internals/models/index.js";
 import { ExportedValidateDateTimeProps, ValidateDateTimePropsToDefault } from "../validation/validateDateTime.js";
-export interface BaseDateTimePickerSlots extends DateCalendarSlots, TimeClockSlots {
+import { DigitalClockSlotProps, DigitalClockSlots } from "../DigitalClock/index.js";
+import { MultiSectionDigitalClockSlotProps, MultiSectionDigitalClockSlots } from "../MultiSectionDigitalClock/index.js";
+export interface BaseDateTimePickerSlots extends DateCalendarSlots, DigitalClockSlots, MultiSectionDigitalClockSlots {
   /**
    * Tabs enabling toggling between date and time pickers.
    * @default DateTimePickerTabs
@@ -25,7 +26,7 @@ export interface BaseDateTimePickerSlots extends DateCalendarSlots, TimeClockSlo
    */
   toolbar?: React.JSXElementConstructor<DateTimePickerToolbarProps>;
 }
-export interface BaseDateTimePickerSlotProps extends DateCalendarSlotProps, TimeClockSlotProps {
+export interface BaseDateTimePickerSlotProps extends DateCalendarSlotProps, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps {
   /**
    * Props passed down to the tabs component.
    */
@@ -36,7 +37,7 @@ export interface BaseDateTimePickerSlotProps extends DateCalendarSlotProps, Time
   toolbar?: ExportedDateTimePickerToolbarProps;
 }
 export type DateTimePickerViewRenderers<TView extends DateOrTimeViewWithMeridiem> = PickerViewRendererLookup<PickerValue, TView, Omit<DateViewRendererProps<TView>, 'slots' | 'slotProps'> & Omit<TimeViewRendererProps<TimeViewWithMeridiem, BaseClockProps<TimeViewWithMeridiem>>, 'slots' | 'slotProps'>>;
-export interface BaseDateTimePickerProps<TView extends DateOrTimeViewWithMeridiem> extends BasePickerInputProps<PickerValue, TView, DateTimeValidationError>, Omit<ExportedDateCalendarProps, 'onViewChange'>, ExportedBaseClockProps, ExportedValidateDateTimeProps {
+export interface BaseDateTimePickerProps extends Omit<BasePickerInputProps<PickerValue, DateOrTimeViewWithMeridiem, DateTimeValidationError>, 'views'>, Omit<ExportedDateCalendarProps, 'onViewChange' | 'views'>, DigitalTimePickerProps, ExportedValidateDateTimeProps {
   /**
    * Display ampm controls under the clock (instead of in the toolbar).
    * @default true on desktop, false on mobile
@@ -57,8 +58,15 @@ export interface BaseDateTimePickerProps<TView extends DateOrTimeViewWithMeridie
    * If `null`, the section will only have field editing.
    * If `undefined`, internally defined view will be used.
    */
-  viewRenderers?: Partial<DateTimePickerViewRenderers<TView>>;
+  viewRenderers?: Partial<DateTimePickerViewRenderers<DateOrTimeViewWithMeridiem>>;
+  /**
+   * Available views.
+   */
+  views?: readonly DateOrTimeView[];
 }
-type UseDateTimePickerDefaultizedProps<TView extends DateOrTimeViewWithMeridiem, Props extends BaseDateTimePickerProps<TView>> = LocalizedComponent<DefaultizedProps<Props, 'views' | 'openTo' | 'orientation' | 'ampm' | ValidateDateTimePropsToDefault>>;
-export declare function useDateTimePickerDefaultizedProps<TView extends DateOrTimeViewWithMeridiem, Props extends BaseDateTimePickerProps<TView>>(props: Props, name: string): UseDateTimePickerDefaultizedProps<TView, Props>;
+type UseDateTimePickerDefaultizedProps<Props extends BaseDateTimePickerProps> = LocalizedComponent<Omit<DefaultizedProps<Props, 'openTo' | 'orientation' | 'ampm' | ValidateDateTimePropsToDefault>, 'views'>> & {
+  shouldRenderTimeInASingleColumn: boolean;
+  views: readonly DateOrTimeViewWithMeridiem[];
+};
+export declare function useDateTimePickerDefaultizedProps<Props extends BaseDateTimePickerProps>(props: Props, name: string): UseDateTimePickerDefaultizedProps<Props>;
 export {};

package/modern/DateTimePicker/shared.js

@@ -6,6 +6,7 @@ import { applyDefaultDate } from "../internals/utils/date-utils.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";
 export function useDateTimePickerDefaultizedProps(props, name) {
   const utils = useUtils();
   const defaultDates = useDefaultDates();
@@ -22,12 +23,32 @@ export function useDateTimePickerDefaultizedProps(props, name) {
       dateTimePickerToolbarTitle: themeProps.localeText.toolbarTitle
     });
   }, [themeProps.localeText]);
-  return _extends({}, themeProps, applyDefaultViewProps({
+  const {
+    openTo,
+    views: defaultViews
+  } = applyDefaultViewProps({
     views: themeProps.views,
     openTo: themeProps.openTo,
     defaultViews: ['year', 'day', 'hours', 'minutes'],
     defaultOpenTo: 'day'
-  }), {
+  });
+  const {
+    shouldRenderTimeInASingleColumn,
+    thresholdToRenderTimeInASingleColumn,
+    views,
+    timeSteps
+  } = resolveTimeViewsResponse({
+    thresholdToRenderTimeInASingleColumn: themeProps.thresholdToRenderTimeInASingleColumn,
+    ampm,
+    timeSteps: themeProps.timeSteps,
+    views: defaultViews
+  });
+  return _extends({}, themeProps, {
+    timeSteps,
+    openTo,
+    shouldRenderTimeInASingleColumn,
+    thresholdToRenderTimeInASingleColumn,
+    views,
     ampm,
     localeText,
     orientation: themeProps.orientation ?? 'portrait',

package/modern/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -15,7 +15,7 @@ import { renderDateViewCalendar } from "../dateViewRenderers/dateViewRenderers.j
 import { useUtils } from "../internals/hooks/useUtils.js";
 import { validateDateTime, extractValidationProps } from "../validation/index.js";
 import { useDesktopPicker } from "../internals/hooks/useDesktopPicker/index.js";
-import { resolveDateTimeFormat, resolveTimeViewsResponse } from "../internals/utils/date-time-utils.js";
+import { resolveDateTimeFormat } from "../internals/utils/date-time-utils.js";
 import { renderDigitalClockTimeView, renderMultiSectionDigitalClockTimeView } from "../timeViewRenderers/index.js";
 import { multiSectionDigitalClockClasses, multiSectionDigitalClockSectionClasses } from "../MultiSectionDigitalClock/index.js";
 import { digitalClockClasses } from "../DigitalClock/index.js";
@@ -91,13 +91,7 @@ const DesktopDateTimePicker = /*#__PURE__*/React.forwardRef(function DesktopDate
 
   // Props with the default values common to all date time pickers
   const defaultizedProps = useDateTimePickerDefaultizedProps(inProps, 'MuiDesktopDateTimePicker');
-  const {
-    shouldRenderTimeInASingleColumn,
-    thresholdToRenderTimeInASingleColumn,
-    views: resolvedViews,
-    timeSteps
-  } = resolveTimeViewsResponse(defaultizedProps);
-  const renderTimeView = shouldRenderTimeInASingleColumn ? renderDigitalClockTimeView : renderMultiSectionDigitalClockTimeView;
+  const renderTimeView = defaultizedProps.shouldRenderTimeInASingleColumn ? renderDigitalClockTimeView : renderMultiSectionDigitalClockTimeView;
   const viewRenderers = _extends({
     day: renderDateViewCalendar,
     month: renderDateViewCalendar,
@@ -110,7 +104,7 @@ const DesktopDateTimePicker = /*#__PURE__*/React.forwardRef(function DesktopDate
   const ampmInClock = defaultizedProps.ampmInClock ?? true;
   // Need to avoid adding the `meridiem` view when unexpected renderer is specified
   const shouldHoursRendererContainMeridiemView = viewRenderers.hours?.name === renderMultiSectionDigitalClockTimeView.name;
-  const views = !shouldHoursRendererContainMeridiemView ? resolvedViews.filter(view => view !== 'meridiem') : resolvedViews;
+  const views = !shouldHoursRendererContainMeridiemView ? defaultizedProps.views.filter(view => view !== 'meridiem') : defaultizedProps.views;
 
   // Props with the default values specific to the desktop variant
   const props = _extends({}, defaultizedProps, {
@@ -119,9 +113,6 @@ const DesktopDateTimePicker = /*#__PURE__*/React.forwardRef(function DesktopDate
     views,
     yearsPerRow: defaultizedProps.yearsPerRow ?? 4,
     ampmInClock,
-    timeSteps,
-    thresholdToRenderTimeInASingleColumn,
-    shouldRenderTimeInASingleColumn,
     slots: _extends({
       field: DateTimeField,
       layout: DesktopDateTimePickerLayout

package/modern/DesktopDateTimePicker/DesktopDateTimePicker.types.d.ts

@@ -2,14 +2,11 @@ import { MakeOptional } from '@mui/x-internals/types';
 import { UseDesktopPickerSlots, ExportedUseDesktopPickerSlotProps, DesktopOnlyPickerProps } from "../internals/hooks/useDesktopPicker/index.js";
 import { BaseDateTimePickerProps, BaseDateTimePickerSlots, BaseDateTimePickerSlotProps } from "../DateTimePicker/shared.js";
 import { DateOrTimeView } from "../models/index.js";
-import { DesktopOnlyTimePickerProps } from "../internals/models/props/time.js";
-import { DateOrTimeViewWithMeridiem } from "../internals/models/index.js";
-import { MultiSectionDigitalClockSlots, MultiSectionDigitalClockSlotProps } from "../MultiSectionDigitalClock/index.js";
-import { DigitalClockSlots, DigitalClockSlotProps } from "../DigitalClock/index.js";
+import { DigitalTimePickerProps } from "../internals/models/props/time.js";
 import { ExportedYearCalendarProps } from "../YearCalendar/YearCalendar.types.js";
-export interface DesktopDateTimePickerSlots extends BaseDateTimePickerSlots, MakeOptional<UseDesktopPickerSlots, 'field' | 'openPickerIcon'>, DigitalClockSlots, MultiSectionDigitalClockSlots {}
-export interface DesktopDateTimePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDateTimePickerSlotProps, ExportedUseDesktopPickerSlotProps<TEnableAccessibleFieldDOMStructure>, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps {}
-export interface DesktopDateTimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseDateTimePickerProps<DateOrTimeViewWithMeridiem>, DesktopOnlyPickerProps, DesktopOnlyTimePickerProps, ExportedYearCalendarProps {
+export interface DesktopDateTimePickerSlots extends BaseDateTimePickerSlots, MakeOptional<UseDesktopPickerSlots, 'field' | 'openPickerIcon'> {}
+export interface DesktopDateTimePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDateTimePickerSlotProps, ExportedUseDesktopPickerSlotProps<TEnableAccessibleFieldDOMStructure> {}
+export interface DesktopDateTimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseDateTimePickerProps, DesktopOnlyPickerProps, DigitalTimePickerProps, ExportedYearCalendarProps {
   /**
    * Overridable component slots.
    * @default {}

package/modern/DesktopTimePicker/DesktopTimePicker.types.d.ts

@@ -2,13 +2,13 @@ import { MakeOptional } from '@mui/x-internals/types';
 import { UseDesktopPickerSlots, ExportedUseDesktopPickerSlotProps, DesktopOnlyPickerProps } from "../internals/hooks/useDesktopPicker/index.js";
 import { BaseTimePickerProps, BaseTimePickerSlots, BaseTimePickerSlotProps } from "../TimePicker/shared.js";
 import { TimeViewWithMeridiem } from "../internals/models/index.js";
-import { DesktopOnlyTimePickerProps } from "../internals/models/props/time.js";
+import { DigitalTimePickerProps } from "../internals/models/props/time.js";
 import { DigitalClockSlots, DigitalClockSlotProps } from "../DigitalClock/index.js";
 import { MultiSectionDigitalClockSlots, MultiSectionDigitalClockSlotProps } from "../MultiSectionDigitalClock/index.js";
 import { TimeView } from "../models/index.js";
 export interface DesktopTimePickerSlots extends BaseTimePickerSlots, MakeOptional<UseDesktopPickerSlots, 'field' | 'openPickerIcon'>, DigitalClockSlots, MultiSectionDigitalClockSlots {}
 export interface DesktopTimePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseTimePickerSlotProps, ExportedUseDesktopPickerSlotProps<TEnableAccessibleFieldDOMStructure>, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps {}
-export interface DesktopTimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseTimePickerProps<TimeViewWithMeridiem>, DesktopOnlyPickerProps, DesktopOnlyTimePickerProps {
+export interface DesktopTimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseTimePickerProps<TimeViewWithMeridiem>, DesktopOnlyPickerProps, DigitalTimePickerProps {
   /**
    * Available views.
    */

package/modern/MobileDateTimePicker/MobileDateTimePicker.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { MobileDateTimePickerProps } from "./MobileDateTimePicker.types.js";
-import { DateOrTimeView } from "../models/index.js";
-type MobileDateTimePickerComponent = (<TEnableAccessibleFieldDOMStructure extends boolean = true>(props: MobileDateTimePickerProps<DateOrTimeView, TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+type MobileDateTimePickerComponent = (<TEnableAccessibleFieldDOMStructure extends boolean = true>(props: MobileDateTimePickerProps<TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
   propTypes?: any;
 };
 /**