@mui/x-date-pickers 7.22.3 → 8.0.0-alpha.1

package/MonthCalendar/MonthCalendar.types.d.ts

@@ -1,11 +1,15 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
 import { Theme } from '@mui/material/styles';
+import { SlotComponentPropsFromProps } from '@mui/x-internals/types';
 import { MonthCalendarClasses } from './monthCalendarClasses';
 import { BaseDateValidationProps, MonthValidationProps } from '../internals/models/validation';
-import { PickerValidDate, TimezoneProps } from '../models';
-import type { PickersMonthProps } from './PickersMonth';
-import { SlotComponentPropsFromProps } from '../internals/models/helpers';
+import { PickerOwnerState, PickerValidDate, TimezoneProps } from '../models';
+import { FormProps } from '../internals/models/formProps';
+export interface PickerMonthOwnerState extends PickerOwnerState {
+    isMonthSelected: boolean;
+    isMonthDisabled: boolean;
+}
 export interface MonthCalendarSlots {
     /**
      * Button displayed to render a single month in the `month` view.
@@ -16,7 +20,7 @@ export interface MonthCalendarSlots {
 export interface MonthCalendarSlotProps {
     monthButton?: SlotComponentPropsFromProps<React.HTMLAttributes<HTMLButtonElement> & {
         sx: SxProps;
-    }, {}, PickersMonthProps>;
+    }, {}, PickerMonthOwnerState>;
 }
 export interface ExportedMonthCalendarProps {
     /**
@@ -25,7 +29,7 @@ export interface ExportedMonthCalendarProps {
      */
     monthsPerRow?: 3 | 4;
 }
-export interface MonthCalendarProps<TDate extends PickerValidDate> extends ExportedMonthCalendarProps, MonthValidationProps<TDate>, BaseDateValidationProps<TDate>, TimezoneProps {
+export interface MonthCalendarProps extends ExportedMonthCalendarProps, MonthValidationProps, BaseDateValidationProps, TimezoneProps, FormProps {
     autoFocus?: boolean;
     className?: string;
     /**
@@ -46,31 +50,26 @@ export interface MonthCalendarProps<TDate extends PickerValidDate> extends Expor
      * The system prop that allows defining system overrides as well as additional CSS styles.
      */
     sx?: SxProps<Theme>;
-    /** If `true` picker is disabled */
-    disabled?: boolean;
     /**
      * The selected value.
      * Used when the component is controlled.
      */
-    value?: TDate | null;
+    value?: PickerValidDate | null;
     /**
      * The default selected value.
      * Used when the component is not controlled.
      */
-    defaultValue?: TDate | null;
+    defaultValue?: PickerValidDate | null;
     /**
      * The date used to generate the new value when both `value` and `defaultValue` are empty.
      * @default The closest valid month using the validation props, except callbacks such as `shouldDisableMonth`.
      */
-    referenceDate?: TDate;
+    referenceDate?: PickerValidDate;
     /**
      * Callback fired when the value changes.
-     * @template TDate
-     * @param {TDate} value The new value.
+     * @param {PickerValidDate} value The new value.
      */
-    onChange?: (value: TDate) => void;
-    /** If `true` picker is readonly */
-    readOnly?: boolean;
+    onChange?: (value: PickerValidDate) => void;
     /**
      * If `true`, today's date is rendering without highlighting with circle.
      * @default false

package/MonthCalendar/PickersMonth.js

@@ -1,6 +1,6 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["autoFocus", "className", "children", "disabled", "selected", "value", "tabIndex", "onClick", "onKeyDown", "onFocus", "onBlur", "aria-current", "aria-label", "monthsPerRow", "slots", "slotProps"];
+const _excluded = ["autoFocus", "className", "classes", "children", "disabled", "selected", "value", "tabIndex", "onClick", "onKeyDown", "onFocus", "onBlur", "aria-current", "aria-label", "monthsPerRow", "slots", "slotProps"];
 import * as React from 'react';
 import clsx from 'clsx';
 import { styled, alpha, useThemeProps } from '@mui/material/styles';
@@ -8,16 +8,12 @@ import useSlotProps from '@mui/utils/useSlotProps';
 import composeClasses from '@mui/utils/composeClasses';
 import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
 import { getPickersMonthUtilityClass, pickersMonthClasses } from "./pickersMonthClasses.js";
+import { usePickerPrivateContext } from "../internals/hooks/usePickerPrivateContext.js";
 import { jsx as _jsx } from "react/jsx-runtime";
-const useUtilityClasses = ownerState => {
-  const {
-    disabled,
-    selected,
-    classes
-  } = ownerState;
+const useUtilityClasses = (classes, ownerState) => {
   const slots = {
     root: ['root'],
-    monthButton: ['monthButton', disabled && 'disabled', selected && 'selected']
+    monthButton: ['monthButton', ownerState.isMonthDisabled && 'disabled', ownerState.isMonthSelected && 'selected']
   };
   return composeClasses(slots, getPickersMonthUtilityClass, classes);
 };
@@ -93,9 +89,10 @@ export const PickersMonth = /*#__PURE__*/React.memo(function PickersMonth(inProp
   const {
       autoFocus,
       className,
+      classes: classesProp,
       children,
-      disabled,
-      selected,
+      disabled = false,
+      selected = false,
       value,
       tabIndex,
       onClick,
@@ -112,7 +109,14 @@ export const PickersMonth = /*#__PURE__*/React.memo(function PickersMonth(inProp
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const ref = React.useRef(null);
-  const classes = useUtilityClasses(props);
+  const {
+    ownerState: pickerOwnerState
+  } = usePickerPrivateContext();
+  const ownerState = _extends({}, pickerOwnerState, {
+    isMonthDisabled: disabled,
+    isMonthSelected: selected
+  });
+  const classes = useUtilityClasses(classesProp, ownerState);
 
   // We can't forward the `autoFocus` to the button because it is a native button, not a MUI Button
   useEnhancedEffect(() => {
@@ -140,12 +144,12 @@ export const PickersMonth = /*#__PURE__*/React.memo(function PickersMonth(inProp
       onFocus: event => onFocus(event, value),
       onBlur: event => onBlur(event, value)
     },
-    ownerState: props,
+    ownerState,
     className: classes.monthButton
   });
   return /*#__PURE__*/_jsx(PickersMonthRoot, _extends({
     className: clsx(classes.root, className),
-    ownerState: props
+    ownerState: ownerState
   }, other, {
     children: /*#__PURE__*/_jsx(MonthButton, _extends({}, monthButtonProps))
   }));

package/MultiSectionDigitalClock/MultiSectionDigitalClock.d.ts

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

package/MultiSectionDigitalClock/MultiSectionDigitalClock.js

@@ -10,7 +10,7 @@ import { useRtl } from '@mui/system/RtlProvider';
 import { styled, useThemeProps } from '@mui/material/styles';
 import useEventCallback from '@mui/utils/useEventCallback';
 import composeClasses from '@mui/utils/composeClasses';
-import { usePickersTranslations } from "../hooks/usePickersTranslations.js";
+import { usePickerTranslations } from "../hooks/usePickerTranslations.js";
 import { useUtils, useNow } from "../internals/hooks/useUtils.js";
 import { convertValueToMeridiem, createIsAfterIgnoreDatePart } from "../internals/utils/time-utils.js";
 import { useViews } from "../internals/hooks/useViews.js";
@@ -101,10 +101,11 @@ export const MultiSectionDigitalClock = /*#__PURE__*/React.forwardRef(function M
     timezone: timezoneProp,
     value: valueProp,
     defaultValue,
+    referenceDate: referenceDateProp,
     onChange,
     valueManager: singleItemValueManager
   });
-  const translations = usePickersTranslations();
+  const translations = usePickerTranslations();
   const now = useNow(timezone);
   const timeSteps = React.useMemo(() => _extends({
     hours: 1,
@@ -368,7 +369,8 @@ process.env.NODE_ENV !== "production" ? MultiSectionDigitalClock.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,
@@ -435,7 +437,8 @@ process.env.NODE_ENV !== "production" ? MultiSectionDigitalClock.propTypes = {
    */
   openTo: PropTypes.oneOf(['hours', 'meridiem', 'minutes', 'seconds']),
   /**
-   * 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,
@@ -446,8 +449,7 @@ process.env.NODE_ENV !== "production" ? MultiSectionDigitalClock.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.
    */

package/MultiSectionDigitalClock/MultiSectionDigitalClock.types.d.ts

@@ -2,10 +2,9 @@ import * as React from 'react';
 import { SlotComponentProps } from '@mui/utils';
 import MenuItem from '@mui/material/MenuItem';
 import { MultiSectionDigitalClockClasses } from './multiSectionDigitalClockClasses';
-import { BaseClockProps, ExportedBaseClockProps, MultiSectionDigitalClockOnlyProps } from '../internals/models/props/clock';
+import { BaseClockProps, ExportedBaseClockProps, MultiSectionDigitalClockOnlyProps } from '../internals/models/props/time';
 import { MultiSectionDigitalClockSectionProps } from './MultiSectionDigitalClockSection';
 import { TimeViewWithMeridiem } from '../internals/models';
-import { PickerValidDate } from '../models';
 export interface MultiSectionDigitalClockOption<TValue> {
     isDisabled?: (value: TValue) => boolean;
     isSelected: (value: TValue) => boolean;
@@ -14,7 +13,7 @@ export interface MultiSectionDigitalClockOption<TValue> {
     value: TValue;
     ariaLabel: string;
 }
-export interface ExportedMultiSectionDigitalClockProps<TDate extends PickerValidDate> extends ExportedBaseClockProps<TDate>, MultiSectionDigitalClockOnlyProps {
+export interface ExportedMultiSectionDigitalClockProps extends ExportedBaseClockProps, MultiSectionDigitalClockOnlyProps {
 }
 export interface MultiSectionDigitalClockViewProps<TValue> extends Pick<MultiSectionDigitalClockSectionProps<TValue>, 'onChange' | 'items'> {
 }
@@ -28,7 +27,7 @@ export interface MultiSectionDigitalClockSlots {
 export interface MultiSectionDigitalClockSlotProps {
     digitalClockSectionItem?: SlotComponentProps<typeof MenuItem, {}, Record<string, any>>;
 }
-export interface MultiSectionDigitalClockProps<TDate extends PickerValidDate> extends ExportedMultiSectionDigitalClockProps<TDate>, BaseClockProps<TDate, TimeViewWithMeridiem> {
+export interface MultiSectionDigitalClockProps extends ExportedMultiSectionDigitalClockProps, BaseClockProps<TimeViewWithMeridiem> {
     /**
      * Available views.
      * @default ['hours', 'minutes']

package/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.d.ts

@@ -1,24 +1,24 @@
 import { MuiPickersAdapter, PickerValidDate } from '../models';
 import { MultiSectionDigitalClockOption } from './MultiSectionDigitalClock.types';
-interface IGetHoursSectionOptions<TDate extends PickerValidDate> {
-    now: TDate;
-    value: TDate | null;
-    utils: MuiPickersAdapter<TDate>;
+interface GetHoursSectionOptionsParameters {
+    now: PickerValidDate;
+    value: PickerValidDate | null;
+    utils: MuiPickersAdapter;
     ampm: boolean;
     isDisabled: (value: number) => boolean;
     timeStep: number;
     resolveAriaLabel: (value: string) => string;
-    valueOrReferenceDate: TDate;
+    valueOrReferenceDate: PickerValidDate;
 }
-export declare const getHourSectionOptions: <TDate extends PickerValidDate>({ now, value, utils, ampm, isDisabled, resolveAriaLabel, timeStep, valueOrReferenceDate, }: IGetHoursSectionOptions<TDate>) => MultiSectionDigitalClockOption<number>[];
-interface IGetTimeSectionOptions<TDate extends PickerValidDate> {
+export declare const getHourSectionOptions: ({ now, value, utils, ampm, isDisabled, resolveAriaLabel, timeStep, valueOrReferenceDate, }: GetHoursSectionOptionsParameters) => MultiSectionDigitalClockOption<number>[];
+interface GetTimeSectionOptionsParameters {
     value: number | null;
-    utils: MuiPickersAdapter<TDate>;
+    utils: MuiPickersAdapter;
     isDisabled: (value: number) => boolean;
     timeStep: number;
     resolveLabel: (value: number) => string;
     hasValue?: boolean;
     resolveAriaLabel: (value: string) => string;
 }
-export declare const getTimeSectionOptions: <TDate extends PickerValidDate>({ value, utils, isDisabled, timeStep, resolveLabel, resolveAriaLabel, hasValue, }: IGetTimeSectionOptions<TDate>) => MultiSectionDigitalClockOption<number>[];
+export declare const getTimeSectionOptions: ({ value, utils, isDisabled, timeStep, resolveLabel, resolveAriaLabel, hasValue, }: GetTimeSectionOptionsParameters) => MultiSectionDigitalClockOption<number>[];
 export {};

package/MultiSectionDigitalClock/MultiSectionDigitalClockSection.d.ts

@@ -1,16 +1,15 @@
 import * as React from 'react';
 import { MultiSectionDigitalClockSectionClasses } from './multiSectionDigitalClockSectionClasses';
 import type { MultiSectionDigitalClockOption, MultiSectionDigitalClockSlots, MultiSectionDigitalClockSlotProps } from './MultiSectionDigitalClock.types';
+import { FormProps } from '../internals/models/formProps';
 export interface ExportedMultiSectionDigitalClockSectionProps {
     className?: string;
     classes?: Partial<MultiSectionDigitalClockSectionClasses>;
     slots?: MultiSectionDigitalClockSlots;
     slotProps?: MultiSectionDigitalClockSlotProps;
 }
-export interface MultiSectionDigitalClockSectionProps<TValue> extends ExportedMultiSectionDigitalClockSectionProps {
+export interface MultiSectionDigitalClockSectionProps<TValue> extends FormProps, ExportedMultiSectionDigitalClockSectionProps {
     autoFocus?: boolean;
-    disabled?: boolean;
-    readOnly?: boolean;
     items: MultiSectionDigitalClockOption<TValue>[];
     onChange: (value: TValue) => void;
     active?: boolean;

package/PickersActionBar/PickersActionBar.js

@@ -7,7 +7,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import Button from '@mui/material/Button';
 import DialogActions from '@mui/material/DialogActions';
-import { usePickersTranslations } from "../hooks/usePickersTranslations.js";
+import { usePickerTranslations } from "../hooks/usePickerTranslations.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * Demos:
@@ -28,7 +28,7 @@ function PickersActionBar(props) {
       actions
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
-  const translations = usePickersTranslations();
+  const translations = usePickerTranslations();
   if (actions == null || actions.length === 0) {
     return null;
   }

package/PickersCalendarHeader/PickersCalendarHeader.d.ts

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

package/PickersCalendarHeader/PickersCalendarHeader.js

@@ -12,7 +12,7 @@ import { styled, useThemeProps } from '@mui/material/styles';
 import useSlotProps from '@mui/utils/useSlotProps';
 import composeClasses from '@mui/utils/composeClasses';
 import IconButton from '@mui/material/IconButton';
-import { usePickersTranslations } from "../hooks/usePickersTranslations.js";
+import { usePickerTranslations } from "../hooks/usePickerTranslations.js";
 import { useUtils } from "../internals/hooks/useUtils.js";
 import { PickersFadeTransitionGroup } from "../DateCalendar/PickersFadeTransitionGroup.js";
 import { ArrowDropDownIcon } from "../icons/index.js";
@@ -110,7 +110,7 @@ const PickersCalendarHeaderSwitchViewIcon = styled(ArrowDropDownIcon, {
  * - [PickersCalendarHeader API](https://mui.com/x/api/date-pickers/pickers-calendar-header/)
  */
 const PickersCalendarHeader = /*#__PURE__*/React.forwardRef(function PickersCalendarHeader(inProps, ref) {
-  const translations = usePickersTranslations();
+  const translations = usePickerTranslations();
   const utils = useUtils();
   const props = useThemeProps({
     props: inProps,

package/PickersCalendarHeader/PickersCalendarHeader.types.d.ts

@@ -22,12 +22,12 @@ export interface PickersCalendarHeaderSlots extends PickersArrowSwitcherSlots {
 }
 export interface PickersCalendarHeaderSlotPropsOverrides {
 }
-export type PickersCalendarHeaderOwnerState<TDate extends PickerValidDate> = PickersCalendarHeaderProps<TDate>;
-export interface PickersCalendarHeaderSlotProps<TDate extends PickerValidDate> extends PickersArrowSwitcherSlotProps {
-    switchViewButton?: SlotComponentProps<typeof IconButton, PickersCalendarHeaderSlotPropsOverrides, PickersCalendarHeaderOwnerState<TDate>>;
-    switchViewIcon?: SlotComponentProps<typeof SvgIcon, PickersCalendarHeaderSlotPropsOverrides, PickersCalendarHeaderOwnerState<TDate>>;
+export type PickersCalendarHeaderOwnerState = PickersCalendarHeaderProps;
+export interface PickersCalendarHeaderSlotProps extends PickersArrowSwitcherSlotProps {
+    switchViewButton?: SlotComponentProps<typeof IconButton, PickersCalendarHeaderSlotPropsOverrides, PickersCalendarHeaderOwnerState>;
+    switchViewIcon?: SlotComponentProps<typeof SvgIcon, PickersCalendarHeaderSlotPropsOverrides, PickersCalendarHeaderOwnerState>;
 }
-export interface PickersCalendarHeaderProps<TDate extends PickerValidDate> extends ExportedPickersArrowSwitcherProps, MonthValidationOptions<TDate> {
+export interface PickersCalendarHeaderProps extends ExportedPickersArrowSwitcherProps, MonthValidationOptions {
     /**
      * Overridable component slots.
      * @default {}
@@ -37,11 +37,11 @@ export interface PickersCalendarHeaderProps<TDate extends PickerValidDate> exten
      * The props used for each component slot.
      * @default {}
      */
-    slotProps?: PickersCalendarHeaderSlotProps<TDate>;
-    currentMonth: TDate;
+    slotProps?: PickersCalendarHeaderSlotProps;
+    currentMonth: PickerValidDate;
     disabled?: boolean;
     views: readonly DateView[];
-    onMonthChange: (date: TDate, slideDirection: SlideDirection) => void;
+    onMonthChange: (date: PickerValidDate, slideDirection: SlideDirection) => void;
     view: DateView;
     reduceAnimations: boolean;
     onViewChange?: (view: DateView) => void;
@@ -60,4 +60,4 @@ export interface PickersCalendarHeaderProps<TDate extends PickerValidDate> exten
      */
     sx?: SxProps<Theme>;
 }
-export type ExportedPickersCalendarHeaderProps<TDate extends PickerValidDate> = Pick<PickersCalendarHeaderProps<TDate>, 'classes' | 'slots' | 'slotProps'>;
+export type ExportedPickersCalendarHeaderProps = Pick<PickersCalendarHeaderProps, 'classes' | 'slots' | 'slotProps'>;

package/PickersDay/PickersDay.d.ts

@@ -21,7 +21,7 @@ export interface ExportedPickersDayProps {
      */
     showDaysOutsideCurrentMonth?: boolean;
 }
-export interface PickersDayProps<TDate extends PickerValidDate> extends ExportedPickersDayProps, Omit<ExtendMui<ButtonBaseProps>, 'onKeyDown' | 'onFocus' | 'onBlur' | 'onMouseEnter' | 'LinkComponent'> {
+export interface PickersDayProps extends ExportedPickersDayProps, Omit<ExtendMui<ButtonBaseProps>, 'onKeyDown' | 'onFocus' | 'onBlur' | 'onMouseEnter' | 'LinkComponent'> {
     /**
      * Override or extend the styles applied to the component.
      */
@@ -29,7 +29,7 @@ export interface PickersDayProps<TDate extends PickerValidDate> extends Exported
     /**
      * The date to show.
      */
-    day: TDate;
+    day: PickerValidDate;
     /**
      * If `true`, renders as disabled.
      * @default false
@@ -41,11 +41,11 @@ export interface PickersDayProps<TDate extends PickerValidDate> extends Exported
      */
     disableMargin?: boolean;
     isAnimating?: boolean;
-    onFocus?: (event: React.FocusEvent<HTMLButtonElement>, day: TDate) => void;
-    onBlur?: (event: React.FocusEvent<HTMLButtonElement>, day: TDate) => void;
-    onKeyDown?: (event: React.KeyboardEvent<HTMLButtonElement>, day: TDate) => void;
-    onMouseEnter?: (event: React.MouseEvent<HTMLButtonElement>, day: TDate) => void;
-    onDaySelect: (day: TDate) => void;
+    onFocus?: (event: React.FocusEvent<HTMLButtonElement>, day: PickerValidDate) => void;
+    onBlur?: (event: React.FocusEvent<HTMLButtonElement>, day: PickerValidDate) => void;
+    onKeyDown?: (event: React.KeyboardEvent<HTMLButtonElement>, day: PickerValidDate) => void;
+    onMouseEnter?: (event: React.MouseEvent<HTMLButtonElement>, day: PickerValidDate) => void;
+    onDaySelect: (day: PickerValidDate) => void;
     /**
      * If `true`, day is outside of month and will be hidden.
      */
@@ -71,7 +71,7 @@ export interface PickersDayProps<TDate extends PickerValidDate> extends Exported
      */
     today?: boolean;
 }
-type PickersDayComponent = (<TDate extends PickerValidDate>(props: PickersDayProps<TDate> & React.RefAttributes<HTMLButtonElement>) => React.JSX.Element) & {
+type PickersDayComponent = ((props: PickersDayProps & React.RefAttributes<HTMLButtonElement>) => React.JSX.Element) & {
     propTypes?: any;
 };
 /**

package/PickersLayout/PickersLayout.d.ts

@@ -1,12 +1,11 @@
 import * as React from 'react';
 import { PickersLayoutProps } from './PickersLayout.types';
 import { DateOrTimeViewWithMeridiem } from '../internals/models';
-import { PickerValidDate } from '../models';
 export declare const PickersLayoutRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
-    ownerState: PickersLayoutProps<any, any, any>;
+    ownerState: PickersLayoutProps<any, any>;
 }, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}>;
 export declare const PickersLayoutContentWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}>;
-type PickersLayoutComponent = (<TValue, TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem>(props: PickersLayoutProps<TValue, TDate, TView> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+type PickersLayoutComponent = (<TValue, TView extends DateOrTimeViewWithMeridiem>(props: PickersLayoutProps<TValue, TView> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
     propTypes?: any;
 };
 /**

package/PickersLayout/PickersLayout.js

@@ -145,7 +145,6 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
    */
   classes: PropTypes.object,
   className: PropTypes.string,
-  disabled: PropTypes.bool,
   isLandscape: PropTypes.bool.isRequired,
   /**
    * `true` if the application is in right-to-left direction.
@@ -166,7 +165,6 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
    * Force rendering in particular orientation.
    */
   orientation: PropTypes.oneOf(['landscape', 'portrait']),
-  readOnly: PropTypes.bool,
   /**
    * The props used for each component slot.
    * @default {}

package/PickersLayout/PickersLayout.types.d.ts

@@ -6,11 +6,11 @@ import { BaseToolbarProps, ExportedBaseToolbarProps } from '../internals/models/
 import { BaseTabsProps, ExportedBaseTabsProps } from '../internals/models/props/tabs';
 import { UsePickerLayoutPropsResponseLayoutProps } from '../internals/hooks/usePicker/usePickerLayoutProps';
 import { PickersLayoutClasses } from './pickersLayoutClasses';
-import { DateOrTimeViewWithMeridiem, WrapperVariant } from '../internals/models/common';
+import { DateOrTimeViewWithMeridiem, PickerVariant } from '../internals/models/common';
 import { PickersShortcutsProps } from '../PickersShortcuts';
 import { ExportedPickersShortcutProps, PickersShortcuts } from '../PickersShortcuts/PickersShortcuts';
-import { PickerValidDate } from '../models';
-export interface ExportedPickersLayoutSlots<TValue, TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem> {
+import { PickerOwnerState } from '../models';
+export interface ExportedPickersLayoutSlots<TValue, TView extends DateOrTimeViewWithMeridiem> {
     /**
      * Custom component for the action bar, it is placed below the picker views.
      * @default PickersActionBar
@@ -25,29 +25,27 @@ export interface ExportedPickersLayoutSlots<TValue, TDate extends PickerValidDat
      * Custom component for wrapping the layout.
      * It wraps the toolbar, views, action bar, and shortcuts.
      */
-    layout?: React.JSXElementConstructor<PickersLayoutProps<TValue, TDate, TView> & React.RefAttributes<HTMLDivElement>>;
+    layout?: React.JSXElementConstructor<PickersLayoutProps<TValue, TView> & React.RefAttributes<HTMLDivElement>>;
 }
-interface PickersLayoutActionBarOwnerState<TValue, TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem> extends PickersLayoutProps<TValue, TDate, TView> {
-    wrapperVariant: WrapperVariant;
+export interface PickerLayoutOwnerState extends PickerOwnerState {
+    wrapperVariant: PickerVariant;
+    isLandscape: boolean;
 }
-interface PickersShortcutsOwnerState<TValue> extends PickersShortcutsProps<TValue> {
-    wrapperVariant: WrapperVariant;
-}
-export interface ExportedPickersLayoutSlotProps<TValue, TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem> {
+export interface ExportedPickersLayoutSlotProps<TValue, TView extends DateOrTimeViewWithMeridiem> {
     /**
      * Props passed down to the action bar component.
      */
-    actionBar?: SlotComponentProps<typeof PickersActionBar, {}, PickersLayoutActionBarOwnerState<TValue, TDate, TView>>;
+    actionBar?: SlotComponentProps<typeof PickersActionBar, {}, PickerLayoutOwnerState>;
     /**
      * Props passed down to the shortcuts component.
      */
-    shortcuts?: SlotComponentProps<typeof PickersShortcuts, {}, PickersShortcutsOwnerState<TValue>>;
+    shortcuts?: SlotComponentProps<typeof PickersShortcuts, {}, PickerLayoutOwnerState>;
     /**
      * Props passed down to the layoutRoot component.
      */
-    layout?: Partial<PickersLayoutProps<TValue, TDate, TView>>;
+    layout?: Partial<PickersLayoutProps<TValue, TView>>;
 }
-export interface PickersLayoutSlots<TValue, TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem> extends ExportedPickersLayoutSlots<TValue, TDate, TView> {
+export interface PickersLayoutSlots<TValue, TView extends DateOrTimeViewWithMeridiem> extends ExportedPickersLayoutSlots<TValue, TView> {
     /**
      * Tabs enabling toggling between views.
      */
@@ -58,7 +56,7 @@ export interface PickersLayoutSlots<TValue, TDate extends PickerValidDate, TView
      */
     toolbar?: React.JSXElementConstructor<BaseToolbarProps<TValue, TView>>;
 }
-export interface PickersLayoutSlotProps<TValue, TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem> extends ExportedPickersLayoutSlotProps<TValue, TDate, TView> {
+export interface PickersLayoutSlotProps<TValue, TView extends DateOrTimeViewWithMeridiem> extends ExportedPickersLayoutSlotProps<TValue, TView> {
     /**
      * Props passed down to the tabs component.
      */
@@ -68,7 +66,7 @@ export interface PickersLayoutSlotProps<TValue, TDate extends PickerValidDate, T
      */
     toolbar?: ExportedBaseToolbarProps;
 }
-export interface PickersLayoutProps<TValue, TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem> extends Omit<UsePickerLayoutPropsResponseLayoutProps<TValue, TView>, 'value'> {
+export interface PickersLayoutProps<TValue, TView extends DateOrTimeViewWithMeridiem> extends Omit<UsePickerLayoutPropsResponseLayoutProps<TValue, TView>, 'value'> {
     value?: TValue;
     className?: string;
     children?: React.ReactNode;
@@ -84,12 +82,12 @@ export interface PickersLayoutProps<TValue, TDate extends PickerValidDate, TView
      * Overridable component slots.
      * @default {}
      */
-    slots?: PickersLayoutSlots<TValue, TDate, TView>;
+    slots?: PickersLayoutSlots<TValue, TView>;
     /**
      * The props used for each component slot.
      * @default {}
      */
-    slotProps?: PickersLayoutSlotProps<TValue, TDate, TView>;
+    slotProps?: PickersLayoutSlotProps<TValue, TView>;
     /**
      * `true` if the application is in right-to-left direction.
      */
@@ -102,4 +100,3 @@ export interface SubComponents<TValue> {
     actionBar: React.ReactElement<PickersActionBarProps>;
     shortcuts: React.ReactElement<ExportedPickersShortcutProps<TValue>> | null;
 }
-export {};

package/PickersLayout/index.d.ts

@@ -1,5 +1,5 @@
 export { PickersLayout, PickersLayoutRoot, PickersLayoutContentWrapper } from './PickersLayout';
-export type { PickersLayoutProps, PickersLayoutSlots, PickersLayoutSlotProps, ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps, } from './PickersLayout.types';
+export type { PickersLayoutProps, PickersLayoutSlots, PickersLayoutSlotProps, ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps, PickerLayoutOwnerState, } from './PickersLayout.types';
 export { default as usePickerLayout } from './usePickerLayout';
 export { pickersLayoutClasses } from './pickersLayoutClasses';
 export type { PickersLayoutClassKey } from './pickersLayoutClasses';

package/PickersLayout/usePickerLayout.d.ts

@@ -1,7 +1,6 @@
 import { PickersLayoutProps, SubComponents } from './PickersLayout.types';
 import { DateOrTimeViewWithMeridiem } from '../internals/models';
-import { PickerValidDate } from '../models';
 interface UsePickerLayoutResponse<TValue> extends SubComponents<TValue> {
 }
-declare const usePickerLayout: <TValue, TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem>(props: PickersLayoutProps<TValue, TDate, TView>) => UsePickerLayoutResponse<TValue>;
+declare const usePickerLayout: <TValue, TView extends DateOrTimeViewWithMeridiem>(props: PickersLayoutProps<TValue, TView>) => UsePickerLayoutResponse<TValue>;
 export default usePickerLayout;