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

package/internals/hooks/useDesktopPicker/useDesktopPicker.types.d.ts

@@ -1,19 +1,19 @@
 import * as React from 'react';
-import IconButton, { IconButtonProps } from '@mui/material/IconButton';
-import { InputAdornmentProps } from '@mui/material/InputAdornment';
-import TextField from '@mui/material/TextField';
-import { SlotComponentProps } from '@mui/utils';
+import type { IconButtonProps } from '@mui/material/IconButton';
+import type { InputAdornmentProps } from '@mui/material/InputAdornment';
+import type { TextFieldProps } from '@mui/material/TextField';
 import { MakeRequired, SlotComponentPropsFromProps } from '@mui/x-internals/types';
 import { BaseNonStaticPickerProps, BasePickerProps, BaseNonRangeNonStaticPickerProps } from '../../models/props/basePickerProps';
 import { PickersPopperSlots, PickersPopperSlotProps } from '../../components/PickersPopper';
 import { UsePickerParams } from '../usePicker';
-import { FieldSection, PickerFieldSlotProps, PickerOwnerState, PickerValidDate } from '../../../models';
+import { FieldOwnerState, PickerFieldSlotProps, PickerOwnerState, PickerValidDate } from '../../../models';
 import { ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps, PickersLayoutSlotProps } from '../../../PickersLayout/PickersLayout.types';
 import { UsePickerValueNonStaticProps } from '../usePicker/usePickerValue.types';
 import { UsePickerViewsNonStaticProps, UsePickerViewsProps } from '../usePicker/usePickerViews';
-import { DateOrTimeViewWithMeridiem } from '../../models';
+import { DateOrTimeViewWithMeridiem, PickerValue } from '../../models';
 import { UseClearableFieldSlots, UseClearableFieldSlotProps } from '../../../hooks/useClearableField';
-export interface UseDesktopPickerSlots<TView extends DateOrTimeViewWithMeridiem> extends Pick<PickersPopperSlots, 'desktopPaper' | 'desktopTransition' | 'desktopTrapFocus' | 'popper'>, ExportedPickersLayoutSlots<PickerValidDate | null, TView>, UseClearableFieldSlots {
+import { PickersTextFieldProps } from '../../../PickersTextField';
+export interface UseDesktopPickerSlots<TView extends DateOrTimeViewWithMeridiem> extends Pick<PickersPopperSlots, 'desktopPaper' | 'desktopTransition' | 'desktopTrapFocus' | 'popper'>, ExportedPickersLayoutSlots<PickerValue, TView>, UseClearableFieldSlots {
     /**
      * Component used to enter the date with the keyboard.
      */
@@ -38,13 +38,13 @@ export interface UseDesktopPickerSlots<TView extends DateOrTimeViewWithMeridiem>
      */
     openPickerIcon: React.ElementType;
 }
-export interface UseDesktopPickerSlotProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean> extends ExportedUseDesktopPickerSlotProps<TView, TEnableAccessibleFieldDOMStructure>, Pick<PickersLayoutSlotProps<PickerValidDate | null, TView>, 'toolbar'> {
+export interface UseDesktopPickerSlotProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean> extends ExportedUseDesktopPickerSlotProps<TView, TEnableAccessibleFieldDOMStructure>, Pick<PickersLayoutSlotProps<PickerValue, TView>, 'toolbar'> {
 }
-export interface ExportedUseDesktopPickerSlotProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean> extends PickersPopperSlotProps, ExportedPickersLayoutSlotProps<PickerValidDate | null, TView>, UseClearableFieldSlotProps {
-    field?: SlotComponentPropsFromProps<PickerFieldSlotProps<PickerValidDate | null, FieldSection, TEnableAccessibleFieldDOMStructure>, {}, PickerOwnerState>;
-    textField?: SlotComponentProps<typeof TextField, {}, Record<string, any>>;
+export interface ExportedUseDesktopPickerSlotProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean> extends PickersPopperSlotProps, ExportedPickersLayoutSlotProps<PickerValue, TView>, UseClearableFieldSlotProps {
+    field?: SlotComponentPropsFromProps<PickerFieldSlotProps<PickerValue, TEnableAccessibleFieldDOMStructure>, {}, PickerOwnerState>;
+    textField?: SlotComponentPropsFromProps<PickersTextFieldProps | TextFieldProps, {}, FieldOwnerState>;
     inputAdornment?: SlotComponentPropsFromProps<InputAdornmentProps, {}, PickerOwnerState>;
-    openPickerButton?: SlotComponentProps<typeof IconButton, {}, PickerOwnerState>;
+    openPickerButton?: SlotComponentPropsFromProps<IconButtonProps, {}, PickerOwnerState>;
     openPickerIcon?: SlotComponentPropsFromProps<Record<string, any>, {}, PickerOwnerState>;
 }
 export interface DesktopOnlyPickerProps extends BaseNonStaticPickerProps, BaseNonRangeNonStaticPickerProps, UsePickerValueNonStaticProps, UsePickerViewsNonStaticProps {
@@ -54,7 +54,7 @@ export interface DesktopOnlyPickerProps extends BaseNonStaticPickerProps, BaseNo
      */
     autoFocus?: boolean;
 }
-export interface UseDesktopPickerProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TError, TExternalProps extends UsePickerViewsProps<PickerValidDate | null, TView, any, {}>> extends BasePickerProps<PickerValidDate | null, TView, TError, TExternalProps, {}>, MakeRequired<DesktopOnlyPickerProps, 'format'> {
+export interface UseDesktopPickerProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TError, TExternalProps extends UsePickerViewsProps<PickerValue, TView, any, {}>> extends BasePickerProps<PickerValue, TView, TError, TExternalProps, {}>, MakeRequired<DesktopOnlyPickerProps, 'format'> {
     /**
      * Overridable component slots.
      * @default {}
@@ -66,7 +66,7 @@ export interface UseDesktopPickerProps<TView extends DateOrTimeViewWithMeridiem,
      */
     slotProps?: UseDesktopPickerSlotProps<TView, TEnableAccessibleFieldDOMStructure>;
 }
-export interface UseDesktopPickerParams<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TExternalProps extends UseDesktopPickerProps<TView, TEnableAccessibleFieldDOMStructure, any, TExternalProps>> extends Pick<UsePickerParams<PickerValidDate | null, TView, FieldSection, TExternalProps, {}>, 'valueManager' | 'valueType' | 'validator' | 'rendererInterceptor'> {
+export interface UseDesktopPickerParams<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TExternalProps extends UseDesktopPickerProps<TView, TEnableAccessibleFieldDOMStructure, any, TExternalProps>> extends Pick<UsePickerParams<PickerValue, TView, TExternalProps, {}>, 'valueManager' | 'valueType' | 'validator' | 'rendererInterceptor'> {
     props: TExternalProps;
     getOpenDialogAriaText: (date: PickerValidDate | null) => string;
 }

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

@@ -1,5 +1,5 @@
 import { UseFieldParams, UseFieldResponse, UseFieldCommonForwardedProps, UseFieldInternalProps, UseFieldForwardedProps } from './useField.types';
-import { FieldSection } from '../../../models';
-export declare const useField: <TValue, TSection extends FieldSection, TEnableAccessibleFieldDOMStructure extends boolean, TForwardedProps extends UseFieldCommonForwardedProps & UseFieldForwardedProps<TEnableAccessibleFieldDOMStructure>, TInternalProps extends UseFieldInternalProps<any, any, TEnableAccessibleFieldDOMStructure, any> & {
+import { PickerValidValue } from '../../models';
+export declare const useField: <TValue extends PickerValidValue, TEnableAccessibleFieldDOMStructure extends boolean, TForwardedProps extends UseFieldCommonForwardedProps & UseFieldForwardedProps<TEnableAccessibleFieldDOMStructure>, TInternalProps extends UseFieldInternalProps<TValue, TEnableAccessibleFieldDOMStructure, any> & {
     minutesStep?: number;
-}>(params: UseFieldParams<TValue, TSection, TEnableAccessibleFieldDOMStructure, TForwardedProps, TInternalProps>) => UseFieldResponse<TEnableAccessibleFieldDOMStructure, TForwardedProps>;
+}>(params: UseFieldParams<TValue, TEnableAccessibleFieldDOMStructure, TForwardedProps, TInternalProps>) => UseFieldResponse<TEnableAccessibleFieldDOMStructure, TForwardedProps>;

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

@@ -1,21 +1,21 @@
 import * as React from 'react';
-import { FieldSectionType, FieldSection, FieldSelectedSections, MuiPickersAdapter, TimezoneProps, FieldSectionContentType, FieldValueType, PickerValidDate, FieldRef, OnErrorProps, InferError } from '../../../models';
+import { FieldSectionType, FieldSection, FieldSelectedSections, MuiPickersAdapter, TimezoneProps, FieldSectionContentType, PickerValidDate, FieldRef, OnErrorProps, InferError, InferFieldSection, PickerValueType } from '../../../models';
 import type { PickerValueManager } from '../usePicker';
 import type { Validator } from '../../../validation';
 import type { UseFieldStateResponse } from './useFieldState';
 import type { UseFieldCharacterEditingResponse } from './useFieldCharacterEditing';
 import { PickersSectionElement, PickersSectionListRef } from '../../../PickersSectionList';
 import { ExportedUseClearableFieldProps } from '../../../hooks/useClearableField';
-import { FormProps } from '../../models';
-export interface UseFieldParams<TValue, TSection extends FieldSection, TEnableAccessibleFieldDOMStructure extends boolean, TForwardedProps extends UseFieldCommonForwardedProps & UseFieldForwardedProps<TEnableAccessibleFieldDOMStructure>, TInternalProps extends UseFieldInternalProps<any, any, TEnableAccessibleFieldDOMStructure, any>> {
+import { FormProps, InferNonNullablePickerValue, PickerValidValue } from '../../models';
+export interface UseFieldParams<TValue extends PickerValidValue, TEnableAccessibleFieldDOMStructure extends boolean, TForwardedProps extends UseFieldCommonForwardedProps & UseFieldForwardedProps<TEnableAccessibleFieldDOMStructure>, TInternalProps extends UseFieldInternalProps<TValue, TEnableAccessibleFieldDOMStructure, any>> {
     forwardedProps: TForwardedProps;
     internalProps: TInternalProps;
     valueManager: PickerValueManager<TValue, InferError<TInternalProps>>;
-    fieldValueManager: FieldValueManager<TValue, TSection>;
+    fieldValueManager: FieldValueManager<TValue>;
     validator: Validator<TValue, InferError<TInternalProps>, TInternalProps>;
-    valueType: FieldValueType;
+    valueType: PickerValueType;
 }
-export interface UseFieldInternalProps<TValue, TSection extends FieldSection, TEnableAccessibleFieldDOMStructure extends boolean, TError> extends TimezoneProps, FormProps, OnErrorProps<TValue, TError> {
+export interface UseFieldInternalProps<TValue extends PickerValidValue, TEnableAccessibleFieldDOMStructure extends boolean, TError> extends TimezoneProps, FormProps, OnErrorProps<TValue, TError> {
     /**
      * The selected value.
      * Used when the component is controlled.
@@ -50,10 +50,10 @@ export interface UseFieldInternalProps<TValue, TSection extends FieldSection, TE
      */
     formatDensity?: 'dense' | 'spacious';
     /**
-     * If `true`, the format will respect the leading zeroes (e.g: on dayjs, the format `M/D/YYYY` will render `8/16/2018`)
-     * If `false`, the format will always add leading zeroes (e.g: on dayjs, the format `M/D/YYYY` will render `08/16/2018`)
+     * If `true`, the format will respect the leading zeroes (for example on dayjs, the format `M/D/YYYY` will render `8/16/2018`)
+     * If `false`, the format will always add leading zeroes (for example on dayjs, the format `M/D/YYYY` will render `08/16/2018`)
      *
-     * Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (e.g: "DD"), so `shouldRespectLeadingZeros={true}` might lead to inconsistencies when using `AdapterLuxon`.
+     * Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (for example "DD"), so `shouldRespectLeadingZeros={true}` might lead to inconsistencies when using `AdapterLuxon`.
      *
      * Warning n°2: When `shouldRespectLeadingZeros={true}`, the field will add an invisible character on the sections containing a single digit to make sure `onChange` is fired.
      * If you need to get the clean value from the input, you can remove this character using `input.value.replace(/\u200e/g, '')`.
@@ -82,7 +82,7 @@ export interface UseFieldInternalProps<TValue, TSection extends FieldSection, TE
     /**
      * The ref object used to imperatively interact with the field.
      */
-    unstableFieldRef?: React.Ref<FieldRef<TSection>>;
+    unstableFieldRef?: React.Ref<FieldRef<TValue>>;
     /**
      * @default true
      */
@@ -93,7 +93,7 @@ export interface UseFieldInternalProps<TValue, TSection extends FieldSection, TE
      */
     autoFocus?: boolean;
 }
-export interface UseFieldCommonAdditionalProps extends Required<Pick<UseFieldInternalProps<any, any, any, any>, 'disabled' | 'readOnly'>> {
+export interface UseFieldCommonAdditionalProps extends Required<Pick<UseFieldInternalProps<any, any, any>, 'disabled' | 'readOnly'>> {
 }
 export interface UseFieldCommonForwardedProps extends ExportedUseClearableFieldProps {
     onKeyDown?: React.KeyboardEventHandler;
@@ -152,7 +152,7 @@ export type FieldSectionsBoundaries = {
         maximum: number;
     };
 };
-export type FieldChangeHandler<TValue, TError> = (value: TValue, context: FieldChangeHandlerContext<TError>) => void;
+export type FieldChangeHandler<TValue extends PickerValidValue, TError> = (value: TValue, context: FieldChangeHandlerContext<TError>) => void;
 export interface FieldChangeHandlerContext<TError> {
     validationError: TError;
 }
@@ -160,7 +160,7 @@ export interface FieldChangeHandlerContext<TError> {
  * Object used to access and update the active date (i.e: the date containing the active section).
  * Mainly useful in the range fields where we need to update the date containing the active section without impacting the other one.
  */
-interface FieldActiveDateManager<TValue, TSection extends FieldSection> {
+interface FieldActiveDateManager<TValue extends PickerValidValue> {
     /**
      * Active date from `state.value`.
      */
@@ -170,87 +170,87 @@ interface FieldActiveDateManager<TValue, TSection extends FieldSection> {
      */
     referenceDate: PickerValidDate;
     /**
-     * @template TSection
-     * @param  {TSection[]} sections The sections of the full value.
-     * @returns {TSection[]} The sections of the active date.
+     * @template TValue The value type. It will be the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
+     * @param  {InferFieldSection<TValue>[]} sections The sections of the full value.
+     * @returns {InferFieldSection<TValue>[]} The sections of the active date.
      * Get the sections of the active date.
      */
-    getSections: (sections: TSection[]) => TSection[];
+    getSections: (sections: InferFieldSection<TValue>[]) => InferFieldSection<TValue>[];
     /**
      * Creates the new value and reference value based on the new active date and the current state.
-     * @template TValue
+     * @template TValue The value type. It will be the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
      * @param {PickerValidDate | null} newActiveDate The new value of the date containing the active section.
-     * @returns {Pick<UseFieldState<TValue, any>, 'value' | 'referenceValue'>} The new value and reference value to publish and store in the state.
+     * @returns {Pick<UseFieldState<TValue>, 'value' | 'referenceValue'>} The new value and reference value to publish and store in the state.
      */
-    getNewValuesFromNewActiveDate: (newActiveDate: PickerValidDate | null) => Pick<UseFieldState<TValue, any>, 'value' | 'referenceValue'>;
+    getNewValuesFromNewActiveDate: (newActiveDate: PickerValidDate | null) => Pick<UseFieldState<TValue>, 'value' | 'referenceValue'>;
 }
 export type FieldParsedSelectedSections = number | 'all' | null;
-export interface FieldValueManager<TValue, TSection extends FieldSection> {
+export interface FieldValueManager<TValue extends PickerValidValue> {
     /**
      * Creates the section list from the current value.
      * The `prevSections` are used on the range fields to avoid losing the sections of a partially filled date when editing the other date.
-     * @template TValue, TSection
+     * @template TValue The value type. It will be the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
      * @param {MuiPickersAdapter} utils The utils to manipulate the date.
      * @param {TValue} value The current value to generate sections from.
-     * @param {TSection[] | null} fallbackSections The sections to use as a fallback if a date is null or invalid.
+     * @param {InferFieldSection<TValue>[] | null} fallbackSections The sections to use as a fallback if a date is null or invalid.
      * @param {(date: PickerValidDate) => FieldSection[]} getSectionsFromDate Returns the sections of the given date.
-     * @returns {TSection[]}  The new section list.
+     * @returns {InferFieldSection<TValue>[]}  The new section list.
      */
-    getSectionsFromValue: (utils: MuiPickersAdapter, value: TValue, fallbackSections: TSection[] | null, getSectionsFromDate: (date: PickerValidDate) => FieldSection[]) => TSection[];
+    getSectionsFromValue: (utils: MuiPickersAdapter, value: TValue, fallbackSections: InferFieldSection<TValue>[] | null, getSectionsFromDate: (date: PickerValidDate) => FieldSection[]) => InferFieldSection<TValue>[];
     /**
      * Creates the string value to render in the input based on the current section list.
-     * @template TSection
-     * @param {TSection[]} sections The current section list.
+     * @template TValue The value type. It will be the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
+     * @param {InferFieldSection<TValue>[]} sections The current section list.
      * @param {string} localizedDigits The conversion table from localized to 0-9 digits.
      * @param {boolean} isRtl `true` if the current orientation is "right to left"
      * @returns {string} The string value to render in the input.
      */
-    getV6InputValueFromSections: (sections: TSection[], localizedDigits: string[], isRtl: boolean) => string;
+    getV6InputValueFromSections: (sections: InferFieldSection<TValue>[], localizedDigits: string[], isRtl: boolean) => string;
     /**
      * Creates the string value to render in the input based on the current section list.
-     * @template TSection
-     * @param {TSection[]} sections The current section list.
+     * @template TValue The value type. It will be the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
+     * @param {InferFieldSection<TValue>[]} sections The current section list.
      * @returns {string} The string value to render in the input.
      */
-    getV7HiddenInputValueFromSections: (sections: TSection[]) => string;
+    getV7HiddenInputValueFromSections: (sections: InferFieldSection<TValue>[]) => string;
     /**
      * Returns the manager of the active date.
-     * @template TValue, TSection
+     * @template TValue The value type. It will be the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
      * @param {MuiPickersAdapter} utils The utils to manipulate the date.
-     * @param {UseFieldState<TValue, TSection>} state The current state of the field.
-     * @param {TSection} activeSection The active section.
-     * @returns {FieldActiveDateManager<TValue, TSection>} The manager of the active date.
+     * @param {UseFieldState<TValue>} state The current state of the field.
+     * @param {InferFieldSection<TValue>} activeSection The active section.
+     * @returns {FieldActiveDateManager<TValue>} The manager of the active date.
      */
-    getActiveDateManager: (utils: MuiPickersAdapter, state: UseFieldState<TValue, TSection>, activeSection: TSection) => FieldActiveDateManager<TValue, TSection>;
+    getActiveDateManager: (utils: MuiPickersAdapter, state: UseFieldState<TValue>, activeSection: InferFieldSection<TValue>) => FieldActiveDateManager<TValue>;
     /**
      * Parses a string version (most of the time coming from the input).
      * This method should only be used when the change does not come from a single section.
-     * @template TValue
+     * @template TValue The value type. It will be the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
      * @param {string} valueStr The string value to parse.
      * @param {TValue} referenceValue The reference value currently stored in state.
      * @param {(dateStr: string, referenceDate: PickerValidDate) => PickerValidDate | null} parseDate A method to convert a string date into a parsed one.
      * @returns {TValue} The new parsed value.
      */
-    parseValueStr: (valueStr: string, referenceValue: TValue, parseDate: (dateStr: string, referenceDate: PickerValidDate) => PickerValidDate | null) => TValue;
+    parseValueStr: (valueStr: string, referenceValue: InferNonNullablePickerValue<TValue>, parseDate: (dateStr: string, referenceDate: PickerValidDate) => PickerValidDate | null) => TValue;
     /**
      * Update the reference value with the new value.
      * This method must make sure that no date inside the returned `referenceValue` is invalid.
-     * @template TValue
+     * @template TValue The value type. It will be the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
      * @param {MuiPickersAdapter} utils The utils to manipulate the date.
      * @param {TValue} value The new value from which we want to take all valid dates in the `referenceValue` state.
      * @param {TValue} prevReferenceValue The previous reference value. It is used as a fallback for invalid dates in the new value.
      * @returns {TValue} The new reference value with no invalid date.
      */
-    updateReferenceValue: (utils: MuiPickersAdapter, value: TValue, prevReferenceValue: TValue) => TValue;
+    updateReferenceValue: (utils: MuiPickersAdapter, value: TValue, prevReferenceValue: InferNonNullablePickerValue<TValue>) => InferNonNullablePickerValue<TValue>;
 }
-export interface UseFieldState<TValue, TSection extends FieldSection> {
+export interface UseFieldState<TValue extends PickerValidValue> {
     value: TValue;
     /**
      * Non-nullable value used to keep trace of the timezone and the date parts not present in the format.
      * It is updated whenever we have a valid date (for the range picker we update only the portion of the range that is valid).
      */
-    referenceValue: TValue;
-    sections: TSection[];
+    referenceValue: InferNonNullablePickerValue<TValue>;
+    sections: InferFieldSection<TValue>[];
     /**
      * Android `onChange` behavior when the input selection is not empty is quite different from a desktop behavior.
      * There are two `onChange` calls:
@@ -317,13 +317,13 @@ export interface UseFieldTextFieldInteractions {
     setSelectedSections: (newSelectedSections: FieldSelectedSections) => void;
     isFieldFocused: () => boolean;
 }
-export type UseFieldTextField<TEnableAccessibleFieldDOMStructure extends boolean> = <TValue, TSection extends FieldSection, TForwardedProps extends TEnableAccessibleFieldDOMStructure extends false ? UseFieldV6ForwardedProps : UseFieldV7ForwardedProps, TInternalProps extends UseFieldInternalProps<any, any, TEnableAccessibleFieldDOMStructure, any> & {
+export type UseFieldTextField<TEnableAccessibleFieldDOMStructure extends boolean> = <TValue extends PickerValidValue, TForwardedProps extends TEnableAccessibleFieldDOMStructure extends false ? UseFieldV6ForwardedProps : UseFieldV7ForwardedProps, TInternalProps extends UseFieldInternalProps<TValue, TEnableAccessibleFieldDOMStructure, any> & {
     minutesStep?: number;
-}>(params: UseFieldTextFieldParams<TValue, TSection, TEnableAccessibleFieldDOMStructure, TForwardedProps, TInternalProps>) => {
+}>(params: UseFieldTextFieldParams<TValue, TEnableAccessibleFieldDOMStructure, TForwardedProps, TInternalProps>) => {
     interactions: UseFieldTextFieldInteractions;
     returnedValue: TEnableAccessibleFieldDOMStructure extends false ? UseFieldV6AdditionalProps & Required<UseFieldV6ForwardedProps> : UseFieldV7AdditionalProps & Required<UseFieldV7ForwardedProps>;
 };
-interface UseFieldTextFieldParams<TValue, TSection extends FieldSection, TEnableAccessibleFieldDOMStructure extends boolean, TForwardedProps extends TEnableAccessibleFieldDOMStructure extends false ? UseFieldV6ForwardedProps : UseFieldV7ForwardedProps, TInternalProps extends UseFieldInternalProps<any, any, TEnableAccessibleFieldDOMStructure, any>> extends UseFieldParams<TValue, TSection, TEnableAccessibleFieldDOMStructure, TForwardedProps, TInternalProps>, UseFieldStateResponse<TValue, TSection>, UseFieldCharacterEditingResponse {
+interface UseFieldTextFieldParams<TValue extends PickerValidValue, TEnableAccessibleFieldDOMStructure extends boolean, TForwardedProps extends TEnableAccessibleFieldDOMStructure extends false ? UseFieldV6ForwardedProps : UseFieldV7ForwardedProps, TInternalProps extends UseFieldInternalProps<TValue, TEnableAccessibleFieldDOMStructure, any>> extends UseFieldParams<TValue, TEnableAccessibleFieldDOMStructure, TForwardedProps, TInternalProps>, UseFieldStateResponse<TValue>, UseFieldCharacterEditingResponse {
     areAllSectionsEmpty: boolean;
     sectionOrder: SectionOrdering;
 }

package/internals/hooks/useField/useField.utils.d.ts

@@ -1,5 +1,6 @@
 import { AvailableAdjustKeyCode, FieldSectionsValueBoundaries, SectionOrdering, FieldSectionValueBoundaries, FieldParsedSelectedSections } from './useField.types';
-import { FieldSectionType, FieldValueType, FieldSection, MuiPickersAdapter, FieldSectionContentType, PickersTimezone, PickerValidDate, FieldSelectedSections } from '../../../models';
+import { FieldSectionType, FieldSection, MuiPickersAdapter, FieldSectionContentType, PickersTimezone, PickerValidDate, FieldSelectedSections, PickerValueType, InferFieldSection } from '../../../models';
+import { PickerValidValue } from '../../models';
 export declare const getDateSectionConfigFromFormatToken: (utils: MuiPickersAdapter, formatToken: string) => Pick<FieldSection, "type" | "contentType"> & {
     maxLength: number | undefined;
 };
@@ -17,7 +18,7 @@ export declare const isStringNumber: (valueStr: string, localizedDigits: string[
  */
 export declare const cleanLeadingZeros: (valueStr: string, size: number) => string;
 export declare const cleanDigitSectionValue: (utils: MuiPickersAdapter, value: number, sectionBoundaries: FieldSectionValueBoundaries<any>, localizedDigits: string[], section: Pick<FieldSection, "format" | "type" | "contentType" | "hasLeadingZerosInFormat" | "hasLeadingZerosInInput" | "maxLength">) => string;
-export declare const adjustSectionValue: <TSection extends FieldSection>(utils: MuiPickersAdapter, timezone: PickersTimezone, section: TSection, keyCode: AvailableAdjustKeyCode, sectionsValueBoundaries: FieldSectionsValueBoundaries, localizedDigits: string[], activeDate: PickerValidDate | null, stepsAttributes?: {
+export declare const adjustSectionValue: <TValue extends PickerValidValue>(utils: MuiPickersAdapter, timezone: PickersTimezone, section: InferFieldSection<TValue>, keyCode: AvailableAdjustKeyCode, sectionsValueBoundaries: FieldSectionsValueBoundaries, localizedDigits: string[], activeDate: PickerValidDate | null, stepsAttributes?: {
     minutesStep?: number;
 }) => string;
 export declare const getSectionVisibleValue: (section: FieldSection, target: "input-rtl" | "input-ltr" | "non-input", localizedDigits: string[]) => string;
@@ -31,7 +32,7 @@ export declare const getDateFromDateSections: (utils: MuiPickersAdapter, section
 export declare const createDateStrForV7HiddenInputFromSections: (sections: FieldSection[]) => string;
 export declare const createDateStrForV6InputFromSections: (sections: FieldSection[], localizedDigits: string[], isRtl: boolean) => string;
 export declare const getSectionsBoundaries: (utils: MuiPickersAdapter, localizedDigits: string[], timezone: PickersTimezone) => FieldSectionsValueBoundaries;
-export declare const validateSections: <TSection extends FieldSection>(sections: TSection[], valueType: FieldValueType) => void;
+export declare const validateSections: <TValue extends PickerValidValue>(sections: InferFieldSection<TValue>[], valueType: PickerValueType) => void;
 export declare const mergeDateIntoReferenceDate: (utils: MuiPickersAdapter, dateToTransferFrom: PickerValidDate, sections: FieldSection[], referenceDate: PickerValidDate, shouldLimitToEditedSections: boolean) => PickerValidDate;
 export declare const isAndroid: () => boolean;
 export declare const getSectionOrder: (sections: FieldSection[], shouldApplyRTL: boolean) => SectionOrdering;

package/internals/hooks/useField/useFieldCharacterEditing.d.ts

@@ -1,13 +1,14 @@
-import { FieldSection, PickersTimezone } from '../../../models';
+import { PickersTimezone, InferFieldSection } from '../../../models';
 import { FieldSectionsValueBoundaries } from './useField.types';
 import { UpdateSectionValueParams } from './useFieldState';
+import { PickerValidValue } from '../../models';
 export interface ApplyCharacterEditingParams {
     keyPressed: string;
     sectionIndex: number;
 }
-interface UseFieldCharacterEditingParams<TSection extends FieldSection> {
-    sections: TSection[];
-    updateSectionValue: (params: UpdateSectionValueParams<TSection>) => void;
+interface UseFieldCharacterEditingParams<TValue extends PickerValidValue> {
+    sections: InferFieldSection<TValue>[];
+    updateSectionValue: (params: UpdateSectionValueParams<TValue>) => void;
     sectionsValueBoundaries: FieldSectionsValueBoundaries;
     localizedDigits: string[];
     setTempAndroidValueStr: (newValue: string | null) => void;
@@ -24,5 +25,5 @@ export interface UseFieldCharacterEditingResponse {
  * 1. The numeric editing when the user presses a digit
  * 2. The letter editing when the user presses another key
  */
-export declare const useFieldCharacterEditing: <TSection extends FieldSection>({ sections, updateSectionValue, sectionsValueBoundaries, localizedDigits, setTempAndroidValueStr, timezone, }: UseFieldCharacterEditingParams<TSection>) => UseFieldCharacterEditingResponse;
+export declare const useFieldCharacterEditing: <TValue extends PickerValidValue>({ sections, updateSectionValue, sectionsValueBoundaries, localizedDigits, setTempAndroidValueStr, timezone, }: UseFieldCharacterEditingParams<TValue>) => UseFieldCharacterEditingResponse;
 export {};

package/internals/hooks/useField/useFieldState.d.ts

@@ -1,10 +1,11 @@
 import { UseFieldInternalProps, UseFieldParams, UseFieldState, FieldParsedSelectedSections, FieldSectionsValueBoundaries, UseFieldForwardedProps } from './useField.types';
-import { FieldSection, FieldSelectedSections, PickersTimezone } from '../../../models';
-export interface UpdateSectionValueParams<TSection extends FieldSection> {
+import { FieldSelectedSections, PickersTimezone, InferFieldSection } from '../../../models';
+import { PickerValidValue } from '../../models';
+export interface UpdateSectionValueParams<TValue extends PickerValidValue> {
     /**
      * The section on which we want to apply the new value.
      */
-    activeSection: TSection;
+    activeSection: InferFieldSection<TValue>;
     /**
      * Value to apply to the active section.
      */
@@ -14,19 +15,19 @@ export interface UpdateSectionValueParams<TSection extends FieldSection> {
      */
     shouldGoToNextSection: boolean;
 }
-export interface UseFieldStateResponse<TValue, TSection extends FieldSection> {
-    state: UseFieldState<TValue, TSection>;
+export interface UseFieldStateResponse<TValue extends PickerValidValue> {
+    state: UseFieldState<TValue>;
     activeSectionIndex: number | null;
     parsedSelectedSections: FieldParsedSelectedSections;
     setSelectedSections: (sections: FieldSelectedSections) => void;
     clearValue: () => void;
     clearActiveSection: () => void;
-    updateSectionValue: (params: UpdateSectionValueParams<TSection>) => void;
+    updateSectionValue: (params: UpdateSectionValueParams<TValue>) => void;
     updateValueFromValueStr: (valueStr: string) => void;
     setTempAndroidValueStr: (tempAndroidValueStr: string | null) => void;
     sectionsValueBoundaries: FieldSectionsValueBoundaries;
-    getSectionsFromValue: (value: TValue, fallbackSections?: TSection[] | null) => TSection[];
+    getSectionsFromValue: (value: TValue, fallbackSections?: InferFieldSection<TValue>[] | null) => InferFieldSection<TValue>[];
     localizedDigits: string[];
     timezone: PickersTimezone;
 }
-export declare const useFieldState: <TValue, TSection extends FieldSection, TEnableAccessibleFieldDOMStructure extends boolean, TForwardedProps extends UseFieldForwardedProps<TEnableAccessibleFieldDOMStructure>, TInternalProps extends UseFieldInternalProps<any, any, any, any>>(params: UseFieldParams<TValue, TSection, TEnableAccessibleFieldDOMStructure, TForwardedProps, TInternalProps>) => UseFieldStateResponse<TValue, TSection>;
+export declare const useFieldState: <TValue extends PickerValidValue, TEnableAccessibleFieldDOMStructure extends boolean, TForwardedProps extends UseFieldForwardedProps<TEnableAccessibleFieldDOMStructure>, TInternalProps extends UseFieldInternalProps<TValue, TEnableAccessibleFieldDOMStructure, any>>(params: UseFieldParams<TValue, TEnableAccessibleFieldDOMStructure, TForwardedProps, TInternalProps>) => UseFieldStateResponse<TValue>;

package/internals/hooks/useField/useFieldState.js

@@ -41,6 +41,7 @@ export const useFieldState = params => {
     timezone: timezoneProp,
     value: valueProp,
     defaultValue,
+    referenceDate: referenceDateProp,
     onChange,
     valueManager
   });
@@ -63,7 +64,6 @@ export const useFieldState = params => {
     const stateWithoutReferenceDate = {
       sections,
       value: valueFromTheOutside,
-      referenceValue: valueManager.emptyValue,
       tempValueStrAndroid: null
     };
     const granularity = getSectionTypeGranularity(sections);

package/internals/hooks/useField/useFieldV6TextField.d.ts

@@ -1,6 +1,7 @@
 import { UseFieldTextField } from './useField.types';
-import { FieldSection } from '../../../models';
-type FieldSectionWithPositions<TSection> = TSection & {
+import { InferFieldSection } from '../../../models';
+import { PickerValidValue } from '../../models';
+type FieldSectionWithPositions<TValue extends PickerValidValue> = InferFieldSection<TValue> & {
     /**
      * Start index of the section in the format
      */
@@ -20,6 +21,6 @@ type FieldSectionWithPositions<TSection> = TSection & {
      */
     endInInput: number;
 };
-export declare const addPositionPropertiesToSections: <TSection extends FieldSection>(sections: TSection[], localizedDigits: string[], isRtl: boolean) => FieldSectionWithPositions<TSection>[];
+export declare const addPositionPropertiesToSections: <TValue extends PickerValidValue>(sections: InferFieldSection<TValue>[], localizedDigits: string[], isRtl: boolean) => FieldSectionWithPositions<TValue>[];
 export declare const useFieldV6TextField: UseFieldTextField<false>;
 export {};

package/internals/hooks/useField/useFieldV7TextField.js

@@ -198,8 +198,9 @@ export const useFieldV7TextField = params => {
     if (focused || !sectionListRef.current) {
       return;
     }
+    const activeElement = getActiveElement(document);
     setFocused(true);
-    const isFocusInsideASection = sectionListRef.current.getSectionIndexFromDOMElement(getActiveElement(document)) != null;
+    const isFocusInsideASection = sectionListRef.current.getSectionIndexFromDOMElement(activeElement) != null;
     if (!isFocusInsideASection) {
       setSelectedSections(sectionOrder.startIndex);
     }

package/internals/hooks/useFieldOwnerState.d.ts

@@ -0,0 +1,6 @@
+import { FieldOwnerState } from '../../models';
+import { FormProps } from '../models';
+export declare function useFieldOwnerState(parameters: UseFieldOwnerStateParameters): FieldOwnerState;
+interface UseFieldOwnerStateParameters extends FormProps {
+}
+export {};

package/internals/hooks/useFieldOwnerState.js

@@ -0,0 +1,12 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { usePickerPrivateContext } from "./usePickerPrivateContext.js";
+export function useFieldOwnerState(parameters) {
+  const {
+    ownerState: pickerOwnerState
+  } = usePickerPrivateContext();
+  return React.useMemo(() => _extends({}, pickerOwnerState, {
+    isFieldDisabled: parameters.disabled ?? false,
+    isFieldReadOnly: parameters.readOnly ?? false
+  }), [pickerOwnerState, parameters.disabled, parameters.readOnly]);
+}

package/internals/hooks/useMobilePicker/useMobilePicker.js

@@ -59,7 +59,7 @@ export const useMobilePicker = _ref => {
     localeText,
     autoFocusView: true,
     additionalViewProps: {},
-    wrapperVariant: 'mobile'
+    variant: 'mobile'
   }));
   const Field = slots.field;
   const fieldProps = useSlotProps({

package/internals/hooks/useMobilePicker/useMobilePicker.types.d.ts

@@ -1,16 +1,16 @@
 import * as React from 'react';
-import TextField from '@mui/material/TextField';
-import { SlotComponentProps } from '@mui/utils';
+import type { TextFieldProps } from '@mui/material/TextField';
 import { MakeRequired, SlotComponentPropsFromProps } from '@mui/x-internals/types';
 import { BaseNonStaticPickerProps, BasePickerProps, BaseNonRangeNonStaticPickerProps } from '../../models/props/basePickerProps';
 import { PickersModalDialogSlots, PickersModalDialogSlotProps } from '../../components/PickersModalDialog';
 import { UsePickerParams } from '../usePicker';
-import { FieldSection, PickerFieldSlotProps, PickerOwnerState, PickerValidDate } from '../../../models';
+import { FieldOwnerState, PickerFieldSlotProps, PickerOwnerState, PickerValidDate } from '../../../models';
 import { ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps, PickersLayoutSlotProps } from '../../../PickersLayout/PickersLayout.types';
 import { UsePickerValueNonStaticProps } from '../usePicker/usePickerValue.types';
 import { UsePickerViewsNonStaticProps, UsePickerViewsProps } from '../usePicker/usePickerViews';
-import { DateOrTimeViewWithMeridiem } from '../../models';
-export interface UseMobilePickerSlots<TView extends DateOrTimeViewWithMeridiem> extends PickersModalDialogSlots, ExportedPickersLayoutSlots<PickerValidDate | null, TView> {
+import { DateOrTimeViewWithMeridiem, PickerValue } from '../../models';
+import { PickersTextFieldProps } from '../../../PickersTextField';
+export interface UseMobilePickerSlots<TView extends DateOrTimeViewWithMeridiem> extends PickersModalDialogSlots, ExportedPickersLayoutSlots<PickerValue, TView> {
     /**
      * Component used to enter the date with the keyboard.
      */
@@ -21,15 +21,15 @@ export interface UseMobilePickerSlots<TView extends DateOrTimeViewWithMeridiem>
      */
     textField?: React.ElementType;
 }
-export interface ExportedUseMobilePickerSlotProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean> extends PickersModalDialogSlotProps, ExportedPickersLayoutSlotProps<PickerValidDate | null, TView> {
-    field?: SlotComponentPropsFromProps<PickerFieldSlotProps<PickerValidDate | null, FieldSection, TEnableAccessibleFieldDOMStructure>, {}, PickerOwnerState>;
-    textField?: SlotComponentProps<typeof TextField, {}, Record<string, any>>;
+export interface ExportedUseMobilePickerSlotProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean> extends PickersModalDialogSlotProps, ExportedPickersLayoutSlotProps<PickerValue, TView> {
+    field?: SlotComponentPropsFromProps<PickerFieldSlotProps<PickerValue, TEnableAccessibleFieldDOMStructure>, {}, PickerOwnerState>;
+    textField?: SlotComponentPropsFromProps<PickersTextFieldProps | TextFieldProps, {}, FieldOwnerState>;
 }
-export interface UseMobilePickerSlotProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean> extends ExportedUseMobilePickerSlotProps<TView, TEnableAccessibleFieldDOMStructure>, Pick<PickersLayoutSlotProps<PickerValidDate | null, TView>, 'toolbar'> {
+export interface UseMobilePickerSlotProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean> extends ExportedUseMobilePickerSlotProps<TView, TEnableAccessibleFieldDOMStructure>, Pick<PickersLayoutSlotProps<PickerValue, TView>, 'toolbar'> {
 }
 export interface MobileOnlyPickerProps extends BaseNonStaticPickerProps, BaseNonRangeNonStaticPickerProps, UsePickerValueNonStaticProps, UsePickerViewsNonStaticProps {
 }
-export interface UseMobilePickerProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TError, TExternalProps extends UsePickerViewsProps<any, TView, any, any>> extends BasePickerProps<PickerValidDate | null, TView, TError, TExternalProps, {}>, MakeRequired<MobileOnlyPickerProps, 'format'> {
+export interface UseMobilePickerProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TError, TExternalProps extends UsePickerViewsProps<any, TView, any, any>> extends BasePickerProps<PickerValue, TView, TError, TExternalProps, {}>, MakeRequired<MobileOnlyPickerProps, 'format'> {
     /**
      * Overridable component slots.
      * @default {}
@@ -41,7 +41,7 @@ export interface UseMobilePickerProps<TView extends DateOrTimeViewWithMeridiem,
      */
     slotProps?: UseMobilePickerSlotProps<TView, TEnableAccessibleFieldDOMStructure>;
 }
-export interface UseMobilePickerParams<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TExternalProps extends UseMobilePickerProps<TView, TEnableAccessibleFieldDOMStructure, any, TExternalProps>> extends Pick<UsePickerParams<PickerValidDate | null, TView, FieldSection, TExternalProps, {}>, 'valueManager' | 'valueType' | 'validator'> {
+export interface UseMobilePickerParams<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TExternalProps extends UseMobilePickerProps<TView, TEnableAccessibleFieldDOMStructure, any, TExternalProps>> extends Pick<UsePickerParams<PickerValue, TView, TExternalProps, {}>, 'valueManager' | 'valueType' | 'validator'> {
     props: TExternalProps;
     getOpenDialogAriaText: (date: PickerValidDate | null) => string;
 }

package/internals/hooks/usePicker/usePicker.d.ts

@@ -1,4 +1,4 @@
 import { UsePickerParams, UsePickerProps, UsePickerResponse } from './usePicker.types';
-import { FieldSection, InferError } from '../../../models';
-import { DateOrTimeViewWithMeridiem } from '../../models';
-export declare const usePicker: <TValue, TView extends DateOrTimeViewWithMeridiem, TSection extends FieldSection, TExternalProps extends UsePickerProps<TValue, TView, any, any, any>, TAdditionalProps extends {}>({ props, valueManager, valueType, wrapperVariant, additionalViewProps, validator, autoFocusView, rendererInterceptor, fieldRef, localeText, }: UsePickerParams<TValue, TView, TSection, TExternalProps, TAdditionalProps>) => UsePickerResponse<TValue, TView, TSection, InferError<TExternalProps>>;
+import { InferError } from '../../../models';
+import { DateOrTimeViewWithMeridiem, PickerValidValue } from '../../models';
+export declare const usePicker: <TValue extends PickerValidValue, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UsePickerProps<TValue, TView, any, any, any>, TAdditionalProps extends {}>({ props, valueManager, valueType, variant, additionalViewProps, validator, autoFocusView, rendererInterceptor, fieldRef, localeText, }: UsePickerParams<TValue, TView, TExternalProps, TAdditionalProps>) => UsePickerResponse<TValue, TView, InferError<TExternalProps>>;

package/internals/hooks/usePicker/usePicker.js

@@ -1,14 +1,13 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import { warnOnce } from '@mui/x-internals/warning';
 import { usePickerValue } from "./usePickerValue.js";
 import { usePickerViews } from "./usePickerViews.js";
-import { usePickerLayoutProps } from "./usePickerLayoutProps.js";
-import { usePickerOwnerState } from "./usePickerOwnerState.js";
 import { usePickerProvider } from "./usePickerProvider.js";
 export const usePicker = ({
   props,
   valueManager,
   valueType,
-  wrapperVariant,
+  variant,
   additionalViewProps,
   validator,
   autoFocusView,
@@ -25,7 +24,7 @@ export const usePicker = ({
     props,
     valueManager,
     valueType,
-    wrapperVariant,
+    variant,
     validator
   });
   const pickerViewsResponse = usePickerViews({
@@ -36,21 +35,13 @@ export const usePicker = ({
     propsFromPickerValue: pickerValueResponse.viewProps,
     rendererInterceptor
   });
-  const pickerLayoutResponse = usePickerLayoutProps({
-    props,
-    wrapperVariant,
-    propsFromPickerValue: pickerValueResponse.layoutProps,
-    propsFromPickerViews: pickerViewsResponse.layoutProps
-  });
-  const pickerOwnerState = usePickerOwnerState({
-    props,
-    pickerValueResponse,
-    valueManager
-  });
   const providerProps = usePickerProvider({
+    props,
     pickerValueResponse,
-    ownerState: pickerOwnerState,
-    localeText
+    localeText,
+    valueManager,
+    variant,
+    views: pickerViewsResponse.views
   });
   return {
     // Picker value
@@ -62,10 +53,10 @@ export const usePicker = ({
     hasUIView: pickerViewsResponse.hasUIView,
     shouldRestoreFocus: pickerViewsResponse.shouldRestoreFocus,
     // Picker layout
-    layoutProps: pickerLayoutResponse.layoutProps,
+    layoutProps: _extends({}, pickerViewsResponse.layoutProps, pickerValueResponse.layoutProps),
     // Picker provider
     providerProps,
     // Picker owner state
-    ownerState: pickerOwnerState
+    ownerState: providerProps.privateContextValue.ownerState
   };
 };