@mui/x-date-pickers 7.22.1 → 8.0.0-alpha.0

package/DateTimePicker/DateTimePickerToolbar.js

@@ -12,7 +12,7 @@ import clsx from 'clsx';
 import { PickersToolbarText } from "../internals/components/PickersToolbarText.js";
 import { PickersToolbar } from "../internals/components/PickersToolbar.js";
 import { PickersToolbarButton } from "../internals/components/PickersToolbarButton.js";
-import { usePickersTranslations } from "../hooks/usePickersTranslations.js";
+import { usePickerTranslations } from "../hooks/usePickerTranslations.js";
 import { useUtils } from "../internals/hooks/useUtils.js";
 import { dateTimePickerToolbarClasses, getDateTimePickerToolbarUtilityClass } from "./dateTimePickerToolbarClasses.js";
 import { useMeridiemMode } from "../internals/hooks/date-helpers-hooks.js";
@@ -244,7 +244,7 @@ function DateTimePickerToolbar(inProps) {
   } = useMeridiemMode(value, ampm, onChange);
   const showAmPmControl = Boolean(ampm && !ampmInClock);
   const isDesktop = toolbarVariant === 'desktop';
-  const translations = usePickersTranslations();
+  const translations = usePickerTranslations();
   const classes = useUtilityClasses(ownerState);
   const toolbarTitle = inToolbarTitle ?? translations.dateTimePickerToolbarTitle;
   const formatHours = time => ampm ? utils.format(time, 'hours12h') : utils.format(time, 'hours24h');
@@ -359,6 +359,11 @@ process.env.NODE_ENV !== "production" ? DateTimePickerToolbar.propTypes = {
    */
   classes: PropTypes.object,
   className: PropTypes.string,
+  /**
+   * If `true`, the component is disabled.
+   * When disabled, the value cannot be changed and no interaction is possible.
+   * @default false
+   */
   disabled: PropTypes.bool,
   /**
    * If `true`, show the toolbar even in desktop mode.
@@ -373,6 +378,11 @@ process.env.NODE_ENV !== "production" ? DateTimePickerToolbar.propTypes = {
    * @param {TView} view The view to open
    */
   onViewChange: PropTypes.func.isRequired,
+  /**
+   * If `true`, the component is read-only.
+   * When read-only, the value cannot be changed but the user can interact with the interface.
+   * @default false
+   */
   readOnly: PropTypes.bool,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.

package/DateTimePicker/shared.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { DefaultizedProps } from '../internals/models/helpers';
+import { DefaultizedProps } from '@mui/x-internals/types';
 import { DateTimeValidationError, PickerValidDate } from '../models';
 import { DateCalendarSlots, DateCalendarSlotProps, ExportedDateCalendarProps } from '../DateCalendar/DateCalendar.types';
 import { TimeClockSlots, TimeClockSlotProps } from '../TimeClock/TimeClock.types';
@@ -11,9 +11,9 @@ import { DateTimePickerToolbarProps, ExportedDateTimePickerToolbarProps } from '
 import { PickerViewRendererLookup } from '../internals/hooks/usePicker/usePickerViews';
 import { DateViewRendererProps } from '../dateViewRenderers';
 import { TimeViewRendererProps } from '../timeViewRenderers';
-import { BaseClockProps, ExportedBaseClockProps } from '../internals/models/props/clock';
+import { BaseClockProps, ExportedBaseClockProps } from '../internals/models/props/time';
 import { DateOrTimeViewWithMeridiem, TimeViewWithMeridiem } from '../internals/models';
-export interface BaseDateTimePickerSlots<TDate extends PickerValidDate> extends DateCalendarSlots<TDate>, TimeClockSlots {
+export interface BaseDateTimePickerSlots extends DateCalendarSlots, TimeClockSlots {
     /**
      * Tabs enabling toggling between date and time pickers.
      * @default DateTimePickerTabs
@@ -23,9 +23,9 @@ export interface BaseDateTimePickerSlots<TDate extends PickerValidDate> extends
      * Custom component for the toolbar rendered above the views.
      * @default DateTimePickerToolbar
      */
-    toolbar?: React.JSXElementConstructor<DateTimePickerToolbarProps<TDate>>;
+    toolbar?: React.JSXElementConstructor<DateTimePickerToolbarProps>;
 }
-export interface BaseDateTimePickerSlotProps<TDate extends PickerValidDate> extends DateCalendarSlotProps<TDate>, TimeClockSlotProps {
+export interface BaseDateTimePickerSlotProps extends DateCalendarSlotProps, TimeClockSlotProps {
     /**
      * Props passed down to the tabs component.
      */
@@ -35,8 +35,8 @@ export interface BaseDateTimePickerSlotProps<TDate extends PickerValidDate> exte
      */
     toolbar?: ExportedDateTimePickerToolbarProps;
 }
-export type DateTimePickerViewRenderers<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TAdditionalProps extends {} = {}> = PickerViewRendererLookup<TDate | null, TView, Omit<DateViewRendererProps<TDate, TView>, 'slots' | 'slotProps'> & Omit<TimeViewRendererProps<TimeViewWithMeridiem, BaseClockProps<TDate, TimeViewWithMeridiem>>, 'slots' | 'slotProps'>, TAdditionalProps>;
-export interface BaseDateTimePickerProps<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem> extends BasePickerInputProps<TDate | null, TDate, TView, DateTimeValidationError>, Omit<ExportedDateCalendarProps<TDate>, 'onViewChange'>, ExportedBaseClockProps<TDate>, DateTimeValidationProps<TDate> {
+export type DateTimePickerViewRenderers<TView extends DateOrTimeViewWithMeridiem, TAdditionalProps extends {} = {}> = PickerViewRendererLookup<PickerValidDate | null, TView, Omit<DateViewRendererProps<TView>, 'slots' | 'slotProps'> & Omit<TimeViewRendererProps<TimeViewWithMeridiem, BaseClockProps<TimeViewWithMeridiem>>, 'slots' | 'slotProps'>, TAdditionalProps>;
+export interface BaseDateTimePickerProps<TView extends DateOrTimeViewWithMeridiem> extends BasePickerInputProps<PickerValidDate | null, TView, DateTimeValidationError>, Omit<ExportedDateCalendarProps, 'onViewChange'>, ExportedBaseClockProps, DateTimeValidationProps {
     /**
      * Display ampm controls under the clock (instead of in the toolbar).
      * @default true on desktop, false on mobile
@@ -46,19 +46,19 @@ export interface BaseDateTimePickerProps<TDate extends PickerValidDate, TView ex
      * Overridable component slots.
      * @default {}
      */
-    slots?: BaseDateTimePickerSlots<TDate>;
+    slots?: BaseDateTimePickerSlots;
     /**
      * The props used for each component slot.
      * @default {}
      */
-    slotProps?: BaseDateTimePickerSlotProps<TDate>;
+    slotProps?: BaseDateTimePickerSlotProps;
     /**
      * Define custom view renderers for each section.
      * If `null`, the section will only have field editing.
      * If `undefined`, internally defined view will be used.
      */
-    viewRenderers?: Partial<DateTimePickerViewRenderers<TDate, TView>>;
+    viewRenderers?: Partial<DateTimePickerViewRenderers<TView>>;
 }
-type UseDateTimePickerDefaultizedProps<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, Props extends BaseDateTimePickerProps<TDate, TView>> = LocalizedComponent<TDate, DefaultizedProps<Props, 'views' | 'openTo' | 'orientation' | 'ampm' | keyof BaseDateValidationProps<TDate> | keyof BaseTimeValidationProps>>;
-export declare function useDateTimePickerDefaultizedProps<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, Props extends BaseDateTimePickerProps<TDate, TView>>(props: Props, name: string): UseDateTimePickerDefaultizedProps<TDate, TView, Props>;
+type UseDateTimePickerDefaultizedProps<TView extends DateOrTimeViewWithMeridiem, Props extends BaseDateTimePickerProps<TView>> = LocalizedComponent<DefaultizedProps<Props, 'views' | 'openTo' | 'orientation' | 'ampm' | keyof BaseDateValidationProps | keyof BaseTimeValidationProps>>;
+export declare function useDateTimePickerDefaultizedProps<TView extends DateOrTimeViewWithMeridiem, Props extends BaseDateTimePickerProps<TView>>(props: Props, name: string): UseDateTimePickerDefaultizedProps<TView, Props>;
 export {};

package/DesktopDatePicker/DesktopDatePicker.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { DesktopDatePickerProps } from './DesktopDatePicker.types';
-import { PickerValidDate } from '../models';
-type DesktopDatePickerComponent = (<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false>(props: DesktopDatePickerProps<TDate, TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+type DesktopDatePickerComponent = (<TEnableAccessibleFieldDOMStructure extends boolean = true>(props: DesktopDatePickerProps<TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
     propTypes?: any;
 };
 /**

package/DesktopDatePicker/DesktopDatePicker.js

@@ -7,7 +7,7 @@ import resolveComponentProps from '@mui/utils/resolveComponentProps';
 import { refType } from '@mui/utils';
 import { singleItemValueManager } from "../internals/utils/valueManagers.js";
 import { useDatePickerDefaultizedProps } from "../DatePicker/shared.js";
-import { usePickersTranslations } from "../hooks/usePickersTranslations.js";
+import { usePickerTranslations } from "../hooks/usePickerTranslations.js";
 import { useUtils } from "../internals/hooks/useUtils.js";
 import { validateDate, extractValidationProps } from "../validation/index.js";
 import { useDesktopPicker } from "../internals/hooks/useDesktopPicker/index.js";
@@ -27,7 +27,7 @@ import { buildGetOpenDialogAriaText } from "../locales/utils/getPickersLocalizat
  * - [DesktopDatePicker API](https://mui.com/x/api/date-pickers/desktop-date-picker/)
  */
 const DesktopDatePicker = /*#__PURE__*/React.forwardRef(function DesktopDatePicker(inProps, ref) {
-  const translations = usePickersTranslations();
+  const translations = usePickerTranslations();
   const utils = useUtils();
 
   // Props with the default values common to all date pickers
@@ -92,9 +92,9 @@ DesktopDatePicker.propTypes = {
   closeOnSelect: PropTypes.bool,
   /**
    * Formats the day of week displayed in the calendar header.
-   * @param {TDate} date The date of the day of week provided by the adapter.
+   * @param {PickerValidDate} date The date of the day of week provided by the adapter.
    * @returns {string} The name to display.
-   * @default (date: TDate) => adapter.format(date, 'weekdayShort').charAt(0).toUpperCase()
+   * @default (date: PickerValidDate) => adapter.format(date, 'weekdayShort').charAt(0).toUpperCase()
    */
   dayOfWeekFormatter: PropTypes.func,
   /**
@@ -103,7 +103,8 @@ DesktopDatePicker.propTypes = {
    */
   defaultValue: PropTypes.object,
   /**
-   * If `true`, the picker and text field are disabled.
+   * If `true`, the component is disabled.
+   * When disabled, the value cannot be changed and no interaction is possible.
    * @default false
    */
   disabled: PropTypes.bool,
@@ -132,7 +133,7 @@ DesktopDatePicker.propTypes = {
    */
   displayWeekNumber: PropTypes.bool,
   /**
-   * @default false
+   * @default true
    */
   enableAccessibleFieldDOMStructure: PropTypes.any,
   /**
@@ -222,8 +223,7 @@ DesktopDatePicker.propTypes = {
   onError: PropTypes.func,
   /**
    * Callback fired on month change.
-   * @template TDate
-   * @param {TDate} month The new month.
+   * @param {PickerValidDate} month The new month.
    */
   onMonthChange: PropTypes.func,
   /**
@@ -244,8 +244,7 @@ DesktopDatePicker.propTypes = {
   onViewChange: PropTypes.func,
   /**
    * Callback fired on year change.
-   * @template TDate
-   * @param {TDate} year The new year.
+   * @param {PickerValidDate} year The new year.
    */
   onYearChange: PropTypes.func,
   /**
@@ -263,6 +262,11 @@ DesktopDatePicker.propTypes = {
    * Force rendering in particular orientation.
    */
   orientation: PropTypes.oneOf(['landscape', 'portrait']),
+  /**
+   * If `true`, the component is read-only.
+   * When read-only, the value cannot be changed but the user can interact with the interface.
+   * @default false
+   */
   readOnly: PropTypes.bool,
   /**
    * If `true`, disable heavy animations.
@@ -295,22 +299,19 @@ DesktopDatePicker.propTypes = {
    *
    * Warning: This function can be called multiple times (for example when rendering date calendar, checking if focus can be moved to a certain date, etc.). Expensive computations can impact performance.
    *
-   * @template TDate
-   * @param {TDate} day The date to test.
+   * @param {PickerValidDate} day The date to test.
    * @returns {boolean} If `true` the date will be disabled.
    */
   shouldDisableDate: PropTypes.func,
   /**
    * Disable specific month.
-   * @template TDate
-   * @param {TDate} month The month to test.
+   * @param {PickerValidDate} month The month to test.
    * @returns {boolean} If `true`, the month will be disabled.
    */
   shouldDisableMonth: PropTypes.func,
   /**
    * Disable specific year.
-   * @template TDate
-   * @param {TDate} year The year to test.
+   * @param {PickerValidDate} year The year to test.
    * @returns {boolean} If `true`, the year will be disabled.
    */
   shouldDisableYear: PropTypes.func,

package/DesktopDatePicker/DesktopDatePicker.types.d.ts

@@ -1,23 +1,23 @@
+import { MakeOptional } from '@mui/x-internals/types';
 import { UseDesktopPickerSlots, ExportedUseDesktopPickerSlotProps, DesktopOnlyPickerProps } from '../internals/hooks/useDesktopPicker';
 import { BaseDatePickerProps, BaseDatePickerSlots, BaseDatePickerSlotProps } from '../DatePicker/shared';
-import { MakeOptional } from '../internals/models/helpers';
-import { DateView, PickerValidDate } from '../models';
+import { DateView } from '../models';
 import { ExportedYearCalendarProps } from '../YearCalendar/YearCalendar.types';
-export interface DesktopDatePickerSlots<TDate extends PickerValidDate> extends BaseDatePickerSlots<TDate>, MakeOptional<UseDesktopPickerSlots<TDate, DateView>, 'field' | 'openPickerIcon'> {
+export interface DesktopDatePickerSlots extends BaseDatePickerSlots, MakeOptional<UseDesktopPickerSlots<DateView>, 'field' | 'openPickerIcon'> {
 }
-export interface DesktopDatePickerSlotProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDatePickerSlotProps<TDate>, ExportedUseDesktopPickerSlotProps<TDate, DateView, TEnableAccessibleFieldDOMStructure> {
+export interface DesktopDatePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDatePickerSlotProps, ExportedUseDesktopPickerSlotProps<DateView, TEnableAccessibleFieldDOMStructure> {
 }
-export interface DesktopDatePickerProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false> extends BaseDatePickerProps<TDate>, DesktopOnlyPickerProps, ExportedYearCalendarProps {
+export interface DesktopDatePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseDatePickerProps, DesktopOnlyPickerProps, ExportedYearCalendarProps {
     /**
      * Overridable component slots.
      * @default {}
      */
-    slots?: DesktopDatePickerSlots<TDate>;
+    slots?: DesktopDatePickerSlots;
     /**
      * The props used for each component slot.
      * @default {}
      */
-    slotProps?: DesktopDatePickerSlotProps<TDate, TEnableAccessibleFieldDOMStructure>;
+    slotProps?: DesktopDatePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
     /**
      * Years rendered per row.
      * @default 4

package/DesktopDateTimePicker/DesktopDateTimePicker.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { DesktopDateTimePickerProps } from './DesktopDateTimePicker.types';
-import { PickerValidDate } from '../models';
-type DesktopDateTimePickerComponent = (<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false>(props: DesktopDateTimePickerProps<TDate, TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+type DesktopDateTimePickerComponent = (<TEnableAccessibleFieldDOMStructure extends boolean = true>(props: DesktopDateTimePickerProps<TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
     propTypes?: any;
 };
 /**

package/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -12,7 +12,7 @@ import { singleItemValueManager } from "../internals/utils/valueManagers.js";
 import { DateTimeField } from "../DateTimeField/index.js";
 import { useDateTimePickerDefaultizedProps } from "../DateTimePicker/shared.js";
 import { renderDateViewCalendar } from "../dateViewRenderers/dateViewRenderers.js";
-import { usePickersTranslations } from "../hooks/usePickersTranslations.js";
+import { usePickerTranslations } from "../hooks/usePickerTranslations.js";
 import { useUtils } from "../internals/hooks/useUtils.js";
 import { validateDateTime, extractValidationProps } from "../validation/index.js";
 import { CalendarIcon } from "../icons/index.js";
@@ -83,7 +83,7 @@ const rendererInterceptor = function rendererInterceptor(inViewRenderers, popper
  * - [DesktopDateTimePicker API](https://mui.com/x/api/date-pickers/desktop-date-time-picker/)
  */
 const DesktopDateTimePicker = /*#__PURE__*/React.forwardRef(function DesktopDateTimePicker(inProps, ref) {
-  const translations = usePickersTranslations();
+  const translations = usePickerTranslations();
   const utils = useUtils();
 
   // Props with the default values common to all date time pickers
@@ -189,9 +189,9 @@ DesktopDateTimePicker.propTypes = {
   closeOnSelect: PropTypes.bool,
   /**
    * Formats the day of week displayed in the calendar header.
-   * @param {TDate} date The date of the day of week provided by the adapter.
+   * @param {PickerValidDate} date The date of the day of week provided by the adapter.
    * @returns {string} The name to display.
-   * @default (date: TDate) => adapter.format(date, 'weekdayShort').charAt(0).toUpperCase()
+   * @default (date: PickerValidDate) => adapter.format(date, 'weekdayShort').charAt(0).toUpperCase()
    */
   dayOfWeekFormatter: PropTypes.func,
   /**
@@ -200,7 +200,8 @@ DesktopDateTimePicker.propTypes = {
    */
   defaultValue: PropTypes.object,
   /**
-   * If `true`, the picker and text field are disabled.
+   * If `true`, the component is disabled.
+   * When disabled, the value cannot be changed and no interaction is possible.
    * @default false
    */
   disabled: PropTypes.bool,
@@ -234,7 +235,7 @@ DesktopDateTimePicker.propTypes = {
    */
   displayWeekNumber: PropTypes.bool,
   /**
-   * @default false
+   * @default true
    */
   enableAccessibleFieldDOMStructure: PropTypes.any,
   /**
@@ -347,8 +348,7 @@ DesktopDateTimePicker.propTypes = {
   onError: PropTypes.func,
   /**
    * Callback fired on month change.
-   * @template TDate
-   * @param {TDate} month The new month.
+   * @param {PickerValidDate} month The new month.
    */
   onMonthChange: PropTypes.func,
   /**
@@ -369,8 +369,7 @@ DesktopDateTimePicker.propTypes = {
   onViewChange: PropTypes.func,
   /**
    * Callback fired on year change.
-   * @template TDate
-   * @param {TDate} year The new year.
+   * @param {PickerValidDate} year The new year.
    */
   onYearChange: PropTypes.func,
   /**
@@ -388,6 +387,11 @@ DesktopDateTimePicker.propTypes = {
    * Force rendering in particular orientation.
    */
   orientation: PropTypes.oneOf(['landscape', 'portrait']),
+  /**
+   * If `true`, the component is read-only.
+   * When read-only, the value cannot be changed but the user can interact with the interface.
+   * @default false
+   */
   readOnly: PropTypes.bool,
   /**
    * If `true`, disable heavy animations.
@@ -420,30 +424,26 @@ DesktopDateTimePicker.propTypes = {
    *
    * Warning: This function can be called multiple times (for example when rendering date calendar, checking if focus can be moved to a certain date, etc.). Expensive computations can impact performance.
    *
-   * @template TDate
-   * @param {TDate} day The date to test.
+   * @param {PickerValidDate} day The date to test.
    * @returns {boolean} If `true` the date will be disabled.
    */
   shouldDisableDate: PropTypes.func,
   /**
    * Disable specific month.
-   * @template TDate
-   * @param {TDate} month The month to test.
+   * @param {PickerValidDate} month The month to test.
    * @returns {boolean} If `true`, the month will be disabled.
    */
   shouldDisableMonth: PropTypes.func,
   /**
    * Disable specific time.
-   * @template TDate
-   * @param {TDate} value The value to check.
+   * @param {PickerValidDate} value The value to check.
    * @param {TimeView} view The clock type of the timeValue.
    * @returns {boolean} If `true` the time will be disabled.
    */
   shouldDisableTime: PropTypes.func,
   /**
    * Disable specific year.
-   * @template TDate
-   * @param {TDate} year The year to test.
+   * @param {PickerValidDate} year The year to test.
    * @returns {boolean} If `true`, the year will be disabled.
    */
   shouldDisableYear: PropTypes.func,

package/DesktopDateTimePicker/DesktopDateTimePicker.types.d.ts

@@ -1,27 +1,27 @@
+import { MakeOptional } from '@mui/x-internals/types';
 import { UseDesktopPickerSlots, ExportedUseDesktopPickerSlotProps, DesktopOnlyPickerProps } from '../internals/hooks/useDesktopPicker';
 import { BaseDateTimePickerProps, BaseDateTimePickerSlots, BaseDateTimePickerSlotProps } from '../DateTimePicker/shared';
-import { MakeOptional } from '../internals/models/helpers';
-import { DateOrTimeView, PickerValidDate } from '../models';
-import { DesktopOnlyTimePickerProps } from '../internals/models/props/clock';
+import { DateOrTimeView } from '../models';
+import { DesktopOnlyTimePickerProps } from '../internals/models/props/time';
 import { DateOrTimeViewWithMeridiem } from '../internals/models';
 import { MultiSectionDigitalClockSlots, MultiSectionDigitalClockSlotProps } from '../MultiSectionDigitalClock';
 import { DigitalClockSlots, DigitalClockSlotProps } from '../DigitalClock';
 import { ExportedYearCalendarProps } from '../YearCalendar/YearCalendar.types';
-export interface DesktopDateTimePickerSlots<TDate extends PickerValidDate> extends BaseDateTimePickerSlots<TDate>, MakeOptional<UseDesktopPickerSlots<TDate, DateOrTimeViewWithMeridiem>, 'field' | 'openPickerIcon'>, DigitalClockSlots, MultiSectionDigitalClockSlots {
+export interface DesktopDateTimePickerSlots extends BaseDateTimePickerSlots, MakeOptional<UseDesktopPickerSlots<DateOrTimeViewWithMeridiem>, 'field' | 'openPickerIcon'>, DigitalClockSlots, MultiSectionDigitalClockSlots {
 }
-export interface DesktopDateTimePickerSlotProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDateTimePickerSlotProps<TDate>, ExportedUseDesktopPickerSlotProps<TDate, DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure>, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps {
+export interface DesktopDateTimePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDateTimePickerSlotProps, ExportedUseDesktopPickerSlotProps<DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure>, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps {
 }
-export interface DesktopDateTimePickerProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false> extends BaseDateTimePickerProps<TDate, DateOrTimeViewWithMeridiem>, DesktopOnlyPickerProps, DesktopOnlyTimePickerProps<TDate>, ExportedYearCalendarProps {
+export interface DesktopDateTimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseDateTimePickerProps<DateOrTimeViewWithMeridiem>, DesktopOnlyPickerProps, DesktopOnlyTimePickerProps, ExportedYearCalendarProps {
     /**
      * Overridable component slots.
      * @default {}
      */
-    slots?: DesktopDateTimePickerSlots<TDate>;
+    slots?: DesktopDateTimePickerSlots;
     /**
      * The props used for each component slot.
      * @default {}
      */
-    slotProps?: DesktopDateTimePickerSlotProps<TDate, TEnableAccessibleFieldDOMStructure>;
+    slotProps?: DesktopDateTimePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
     /**
      * Available views.
      */

package/DesktopDateTimePicker/DesktopDateTimePickerLayout.d.ts

@@ -1,8 +1,7 @@
 import * as React from 'react';
 import { PickersLayoutProps } from '../PickersLayout';
-import { PickerValidDate } from '../models';
 import { DateOrTimeViewWithMeridiem } from '../internals/models/common';
-type DesktopDateTimePickerLayoutComponent = (<TValue, TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem>(props: PickersLayoutProps<TValue, TDate, TView> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+type DesktopDateTimePickerLayoutComponent = (<TValue, TView extends DateOrTimeViewWithMeridiem>(props: PickersLayoutProps<TValue, TView> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
     propTypes?: any;
 };
 /**

package/DesktopDateTimePicker/DesktopDateTimePickerLayout.js

@@ -66,6 +66,11 @@ process.env.NODE_ENV !== "production" ? DesktopDateTimePickerLayout.propTypes =
    */
   classes: PropTypes.object,
   className: PropTypes.string,
+  /**
+   * If `true`, the component is disabled.
+   * When disabled, the value cannot be changed and no interaction is possible.
+   * @default false
+   */
   disabled: PropTypes.bool,
   isLandscape: PropTypes.bool.isRequired,
   /**
@@ -87,6 +92,11 @@ process.env.NODE_ENV !== "production" ? DesktopDateTimePickerLayout.propTypes =
    * Force rendering in particular orientation.
    */
   orientation: PropTypes.oneOf(['landscape', 'portrait']),
+  /**
+   * If `true`, the component is read-only.
+   * When read-only, the value cannot be changed but the user can interact with the interface.
+   * @default false
+   */
   readOnly: PropTypes.bool,
   /**
    * The props used for each component slot.

package/DesktopTimePicker/DesktopTimePicker.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { DesktopTimePickerProps } from './DesktopTimePicker.types';
-import { PickerValidDate } from '../models';
-type DesktopTimePickerComponent = (<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false>(props: DesktopTimePickerProps<TDate, TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+type DesktopTimePickerComponent = (<TEnableAccessibleFieldDOMStructure extends boolean = true>(props: DesktopTimePickerProps<TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
     propTypes?: any;
 };
 /**

package/DesktopTimePicker/DesktopTimePicker.js

@@ -8,7 +8,7 @@ import { refType } from '@mui/utils';
 import { singleItemValueManager } from "../internals/utils/valueManagers.js";
 import { TimeField } from "../TimeField/index.js";
 import { useTimePickerDefaultizedProps } from "../TimePicker/shared.js";
-import { usePickersTranslations } from "../hooks/usePickersTranslations.js";
+import { usePickerTranslations } from "../hooks/usePickerTranslations.js";
 import { useUtils } from "../internals/hooks/useUtils.js";
 import { extractValidationProps, validateTime } from "../validation/index.js";
 import { ClockIcon } from "../icons/index.js";
@@ -28,7 +28,7 @@ import { buildGetOpenDialogAriaText } from "../locales/utils/getPickersLocalizat
  * - [DesktopTimePicker API](https://mui.com/x/api/date-pickers/desktop-time-picker/)
  */
 const DesktopTimePicker = /*#__PURE__*/React.forwardRef(function DesktopTimePicker(inProps, ref) {
-  const translations = usePickersTranslations();
+  const translations = usePickerTranslations();
   const utils = useUtils();
 
   // Props with the default values common to all time pickers
@@ -127,7 +127,8 @@ DesktopTimePicker.propTypes = {
    */
   defaultValue: PropTypes.object,
   /**
-   * If `true`, the picker and text field are disabled.
+   * If `true`, the component is disabled.
+   * When disabled, the value cannot be changed and no interaction is possible.
    * @default false
    */
   disabled: PropTypes.bool,
@@ -152,7 +153,7 @@ DesktopTimePicker.propTypes = {
    */
   disablePast: PropTypes.bool,
   /**
-   * @default false
+   * @default true
    */
   enableAccessibleFieldDOMStructure: PropTypes.any,
   /**
@@ -260,6 +261,11 @@ DesktopTimePicker.propTypes = {
    * Force rendering in particular orientation.
    */
   orientation: PropTypes.oneOf(['landscape', 'portrait']),
+  /**
+   * If `true`, the component is read-only.
+   * When read-only, the value cannot be changed but the user can interact with the interface.
+   * @default false
+   */
   readOnly: PropTypes.bool,
   /**
    * If `true`, disable heavy animations.
@@ -283,8 +289,7 @@ DesktopTimePicker.propTypes = {
   selectedSections: PropTypes.oneOfType([PropTypes.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), PropTypes.number]),
   /**
    * Disable specific time.
-   * @template TDate
-   * @param {TDate} value The value to check.
+   * @param {PickerValidDate} value The value to check.
    * @param {TimeView} view The clock type of the timeValue.
    * @returns {boolean} If `true` the time will be disabled.
    */

package/DesktopTimePicker/DesktopTimePicker.types.d.ts

@@ -1,16 +1,16 @@
+import { MakeOptional } from '@mui/x-internals/types';
 import { UseDesktopPickerSlots, ExportedUseDesktopPickerSlotProps, DesktopOnlyPickerProps } from '../internals/hooks/useDesktopPicker';
 import { BaseTimePickerProps, BaseTimePickerSlots, BaseTimePickerSlotProps } from '../TimePicker/shared';
-import { MakeOptional } from '../internals/models/helpers';
 import { TimeViewWithMeridiem } from '../internals/models';
-import { DesktopOnlyTimePickerProps } from '../internals/models/props/clock';
+import { DesktopOnlyTimePickerProps } from '../internals/models/props/time';
 import { DigitalClockSlots, DigitalClockSlotProps } from '../DigitalClock';
 import { MultiSectionDigitalClockSlots, MultiSectionDigitalClockSlotProps } from '../MultiSectionDigitalClock';
-import { PickerValidDate, TimeView } from '../models';
-export interface DesktopTimePickerSlots<TDate extends PickerValidDate> extends BaseTimePickerSlots<TDate>, MakeOptional<UseDesktopPickerSlots<TDate, TimeViewWithMeridiem>, 'field' | 'openPickerIcon'>, DigitalClockSlots, MultiSectionDigitalClockSlots {
+import { TimeView } from '../models';
+export interface DesktopTimePickerSlots extends BaseTimePickerSlots, MakeOptional<UseDesktopPickerSlots<TimeViewWithMeridiem>, 'field' | 'openPickerIcon'>, DigitalClockSlots, MultiSectionDigitalClockSlots {
 }
-export interface DesktopTimePickerSlotProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean> extends BaseTimePickerSlotProps, ExportedUseDesktopPickerSlotProps<TDate, TimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure>, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps {
+export interface DesktopTimePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseTimePickerSlotProps, ExportedUseDesktopPickerSlotProps<TimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure>, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps {
 }
-export interface DesktopTimePickerProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean = false> extends BaseTimePickerProps<TDate, TimeViewWithMeridiem>, DesktopOnlyPickerProps, DesktopOnlyTimePickerProps<TDate> {
+export interface DesktopTimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseTimePickerProps<TimeViewWithMeridiem>, DesktopOnlyPickerProps, DesktopOnlyTimePickerProps {
     /**
      * Available views.
      */
@@ -19,10 +19,10 @@ export interface DesktopTimePickerProps<TDate extends PickerValidDate, TEnableAc
      * Overridable component slots.
      * @default {}
      */
-    slots?: DesktopTimePickerSlots<TDate>;
+    slots?: DesktopTimePickerSlots;
     /**
      * The props used for each component slot.
      * @default {}
      */
-    slotProps?: DesktopTimePickerSlotProps<TDate, TEnableAccessibleFieldDOMStructure>;
+    slotProps?: DesktopTimePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
 }

package/DigitalClock/DigitalClock.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { DigitalClockProps } from './DigitalClock.types';
-import { PickerValidDate } from '../models';
-type DigitalClockComponent = (<TDate extends PickerValidDate>(props: DigitalClockProps<TDate> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+type DigitalClockComponent = ((props: DigitalClockProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
     propTypes?: any;
 };
 /**

package/DigitalClock/DigitalClock.js

@@ -13,7 +13,7 @@ import composeClasses from '@mui/utils/composeClasses';
 import MenuItem from '@mui/material/MenuItem';
 import MenuList from '@mui/material/MenuList';
 import useForkRef from '@mui/utils/useForkRef';
-import { usePickersTranslations } from "../hooks/usePickersTranslations.js";
+import { usePickerTranslations } from "../hooks/usePickerTranslations.js";
 import { useUtils, useNow } from "../internals/hooks/useUtils.js";
 import { createIsAfterIgnoreDatePart } from "../internals/utils/time-utils.js";
 import { PickerViewRoot } from "../internals/components/PickerViewRoot/index.js";
@@ -152,7 +152,7 @@ export const DigitalClock = /*#__PURE__*/React.forwardRef(function DigitalClock(
     onChange,
     valueManager: singleItemValueManager
   });
-  const translations = usePickersTranslations();
+  const translations = usePickerTranslations();
   const now = useNow(timezone);
   const ownerState = React.useMemo(() => _extends({}, props, {
     alreadyRendered: !!containerRef.current
@@ -335,7 +335,8 @@ process.env.NODE_ENV !== "production" ? DigitalClock.propTypes = {
    */
   defaultValue: PropTypes.object,
   /**
-   * If `true`, the picker views and text field are disabled.
+   * If `true`, the component is disabled.
+   * When disabled, the value cannot be changed and no interaction is possible.
    * @default false
    */
   disabled: PropTypes.bool,
@@ -402,7 +403,8 @@ process.env.NODE_ENV !== "production" ? DigitalClock.propTypes = {
    */
   openTo: PropTypes.oneOf(['hours']),
   /**
-   * If `true`, the picker views and text field are read-only.
+   * If `true`, the component is read-only.
+   * When read-only, the value cannot be changed but the user can interact with the interface.
    * @default false
    */
   readOnly: PropTypes.bool,
@@ -413,8 +415,7 @@ process.env.NODE_ENV !== "production" ? DigitalClock.propTypes = {
   referenceDate: PropTypes.object,
   /**
    * Disable specific time.
-   * @template TDate
-   * @param {TDate} value The value to check.
+   * @param {PickerValidDate} value The value to check.
    * @param {TimeView} view The clock type of the timeValue.
    * @returns {boolean} If `true` the time will be disabled.
    */