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

package/internals/hooks/useMobileRangePicker/useMobileRangePicker.js

@@ -5,8 +5,8 @@ import * as React from 'react';
 import useSlotProps from '@mui/utils/useSlotProps';
 import { useLicenseVerifier } from '@mui/x-license';
 import { PickersLayout } from '@mui/x-date-pickers/PickersLayout';
-import { usePicker, PickersModalDialog, PickersProvider } from '@mui/x-date-pickers/internals';
-import { usePickersTranslations } from '@mui/x-date-pickers/hooks';
+import { usePicker, PickersModalDialog, PickerProvider } from '@mui/x-date-pickers/internals';
+import { usePickerTranslations } from '@mui/x-date-pickers/hooks';
 import useId from '@mui/utils/useId';
 import { useEnrichedRangePickerFieldProps } from "../useEnrichedRangePickerFieldProps.js";
 import { getReleaseInfo } from "../../utils/releaseInfo.js";
@@ -46,19 +46,21 @@ export const useMobileRangePicker = _ref => {
     onRangePositionChange
   } = useRangePosition(props, fieldType === 'single-input' ? startFieldRef : undefined);
   const labelId = useId();
-  const contextTranslations = usePickersTranslations();
+  const contextTranslations = usePickerTranslations();
   const {
     open,
     actions,
     layoutProps,
+    providerProps,
     renderCurrentView,
     fieldProps: pickerFieldProps,
-    contextValue
+    ownerState
   } = usePicker(_extends({}, pickerParams, {
     props,
     wrapperVariant: 'mobile',
     autoFocusView: true,
     fieldRef: rangePosition === 'start' ? startFieldRef : endFieldRef,
+    localeText,
     additionalViewProps: {
       rangePosition,
       onRangePositionChange
@@ -68,22 +70,28 @@ export const useMobileRangePicker = _ref => {
   const fieldProps = useSlotProps({
     elementType: Field,
     externalSlotProps: innerSlotProps?.field,
-    additionalProps: _extends({}, pickerFieldProps, {
+    additionalProps: _extends({
+      // Internal props
       readOnly: readOnly ?? true,
       disabled,
-      className,
-      sx,
       format,
       formatDensity,
       enableAccessibleFieldDOMStructure,
       selectedSections,
       onSelectedSectionsChange,
       timezone
-    }, fieldType === 'single-input' ? {
-      inputRef,
+    }, pickerFieldProps, {
+      // onChange and value
+
+      // Forwarded props
+      className,
+      sx
+    }, fieldType === 'single-input' && !!inputRef && {
+      inputRef
+    }, fieldType === 'single-input' && {
       name
-    } : {}),
-    ownerState: props
+    }),
+    ownerState
   });
   const isToolbarHidden = innerSlotProps?.toolbar?.hidden ?? false;
   const enrichedFieldProps = useEnrichedRangePickerFieldProps({
@@ -137,9 +145,7 @@ export const useMobileRangePicker = _ref => {
       'aria-labelledby': labelledById
     }, innerSlotProps?.mobilePaper)
   });
-  const renderPicker = () => /*#__PURE__*/_jsxs(PickersProvider, {
-    contextValue: contextValue,
-    localeText: localeText,
+  const renderPicker = () => /*#__PURE__*/_jsxs(PickerProvider, _extends({}, providerProps, {
     children: [/*#__PURE__*/_jsx(Field, _extends({}, enrichedFieldProps)), /*#__PURE__*/_jsx(PickersModalDialog, _extends({}, actions, {
       open: open,
       slots: slots,
@@ -150,7 +156,7 @@ export const useMobileRangePicker = _ref => {
         children: renderCurrentView()
       }))
     }))]
-  });
+  }));
   return {
     renderPicker
   };

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

@@ -1,25 +1,24 @@
 import { PickersModalDialogSlots, PickersModalDialogSlotProps, UsePickerViewsProps, DateOrTimeViewWithMeridiem } from '@mui/x-date-pickers/internals';
-import { PickerValidDate } from '@mui/x-date-pickers/models';
 import { RangeOnlyPickerProps, RangePickerAdditionalViewProps, UseRangePickerParams, UseRangePickerProps, UseRangePickerSlotProps, UseRangePickerSlots } from '../models/useRangePicker';
-export interface UseMobileRangePickerSlots<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem> extends UseRangePickerSlots<TDate, TView>, PickersModalDialogSlots {
+export interface UseMobileRangePickerSlots<TView extends DateOrTimeViewWithMeridiem> extends UseRangePickerSlots<TView>, PickersModalDialogSlots {
 }
-export interface UseMobileRangePickerSlotProps<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean> extends UseRangePickerSlotProps<TDate, TView, TEnableAccessibleFieldDOMStructure>, PickersModalDialogSlotProps {
+export interface UseMobileRangePickerSlotProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean> extends UseRangePickerSlotProps<TView, TEnableAccessibleFieldDOMStructure>, PickersModalDialogSlotProps {
 }
 export interface MobileRangeOnlyPickerProps extends RangeOnlyPickerProps {
 }
-export interface UseMobileRangePickerProps<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TError, TExternalProps extends UsePickerViewsProps<any, any, TView, any, any>> extends UseRangePickerProps<TDate, TView, TError, TExternalProps, MobileRangePickerAdditionalViewProps> {
+export interface UseMobileRangePickerProps<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TError, TExternalProps extends UsePickerViewsProps<any, TView, any, any>> extends UseRangePickerProps<TView, TError, TExternalProps, MobileRangePickerAdditionalViewProps> {
     /**
      * Overridable component slots.
      * @default {}
      */
-    slots: UseMobileRangePickerSlots<TDate, TView>;
+    slots: UseMobileRangePickerSlots<TView>;
     /**
      * The props used for each component slot.
      * @default {}
      */
-    slotProps?: UseMobileRangePickerSlotProps<TDate, TView, TEnableAccessibleFieldDOMStructure>;
+    slotProps?: UseMobileRangePickerSlotProps<TView, TEnableAccessibleFieldDOMStructure>;
 }
 export interface MobileRangePickerAdditionalViewProps extends RangePickerAdditionalViewProps {
 }
-export interface UseMobileRangePickerParams<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TExternalProps extends UseMobileRangePickerProps<TDate, TView, TEnableAccessibleFieldDOMStructure, any, TExternalProps>> extends UseRangePickerParams<TDate, TView, TExternalProps, MobileRangePickerAdditionalViewProps> {
+export interface UseMobileRangePickerParams<TView extends DateOrTimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure extends boolean, TExternalProps extends UseMobileRangePickerProps<TView, TEnableAccessibleFieldDOMStructure, any, TExternalProps>> extends UseRangePickerParams<TView, TExternalProps, MobileRangePickerAdditionalViewProps> {
 }

package/internals/hooks/useMultiInputFieldSelectedSections.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { UseFieldInternalProps } from '@mui/x-date-pickers/internals';
 import { FieldRef, FieldSelectedSections } from '@mui/x-date-pickers/models';
 import { RangeFieldSection } from '../../models';
-interface UseMultiInputFieldSelectedSectionsParams extends Pick<UseFieldInternalProps<any, any, RangeFieldSection, any, any>, 'selectedSections' | 'onSelectedSectionsChange'> {
+interface UseMultiInputFieldSelectedSectionsParams extends Pick<UseFieldInternalProps<any, RangeFieldSection, any, any>, 'selectedSections' | 'onSelectedSectionsChange'> {
     unstableStartFieldRef?: React.Ref<FieldRef<RangeFieldSection>>;
     unstableEndFieldRef?: React.Ref<FieldRef<RangeFieldSection>>;
 }

package/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.d.ts

@@ -1,4 +1,3 @@
-import { PickerValidDate } from '@mui/x-date-pickers/models';
 import { UseMultiInputDateRangeFieldParams } from '../../../MultiInputDateRangeField/MultiInputDateRangeField.types';
 import type { UseMultiInputRangeFieldResponse } from './useMultiInputRangeField.types';
-export declare const useMultiInputDateRangeField: <TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, endTextFieldProps, unstableEndFieldRef, }: UseMultiInputDateRangeFieldParams<TDate, TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>) => UseMultiInputRangeFieldResponse<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>;
+export declare const useMultiInputDateRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, endTextFieldProps, unstableEndFieldRef, }: UseMultiInputDateRangeFieldParams<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>) => UseMultiInputRangeFieldResponse<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>;

package/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.d.ts

@@ -1,4 +1,3 @@
-import { PickerValidDate } from '@mui/x-date-pickers/models';
 import type { UseMultiInputDateTimeRangeFieldParams } from '../../../MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types';
 import type { UseMultiInputRangeFieldResponse } from './useMultiInputRangeField.types';
-export declare const useMultiInputDateTimeRangeField: <TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, endTextFieldProps, unstableEndFieldRef, }: UseMultiInputDateTimeRangeFieldParams<TDate, TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>) => UseMultiInputRangeFieldResponse<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>;
+export declare const useMultiInputDateTimeRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, endTextFieldProps, unstableEndFieldRef, }: UseMultiInputDateTimeRangeFieldParams<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>) => UseMultiInputRangeFieldResponse<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>;

package/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.d.ts

@@ -1,4 +1,3 @@
-import { PickerValidDate } from '@mui/x-date-pickers/models';
 import type { UseMultiInputTimeRangeFieldParams } from '../../../MultiInputTimeRangeField/MultiInputTimeRangeField.types';
 import type { UseMultiInputRangeFieldResponse } from './useMultiInputRangeField.types';
-export declare const useMultiInputTimeRangeField: <TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, endTextFieldProps, unstableEndFieldRef, }: UseMultiInputTimeRangeFieldParams<TDate, TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>) => UseMultiInputRangeFieldResponse<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>;
+export declare const useMultiInputTimeRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TTextFieldSlotProps extends {}>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, endTextFieldProps, unstableEndFieldRef, }: UseMultiInputTimeRangeFieldParams<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>) => UseMultiInputRangeFieldResponse<TEnableAccessibleFieldDOMStructure, TTextFieldSlotProps>;

package/internals/hooks/useStaticRangePicker/useStaticRangePicker.d.ts

@@ -1,11 +1,10 @@
 import * as React from 'react';
 import { DateOrTimeViewWithMeridiem } from '@mui/x-date-pickers/internals';
-import { PickerValidDate } from '@mui/x-date-pickers/models';
 import { UseStaticRangePickerParams, UseStaticRangePickerProps } from './useStaticRangePicker.types';
 /**
  * Hook managing all the range static pickers:
  * - StaticDateRangePicker
  */
-export declare const useStaticRangePicker: <TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseStaticRangePickerProps<TDate, TView, any, TExternalProps>>({ props, ref, ...pickerParams }: UseStaticRangePickerParams<TDate, TView, TExternalProps>) => {
+export declare const useStaticRangePicker: <TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseStaticRangePickerProps<TView, any, TExternalProps>>({ props, ref, ...pickerParams }: UseStaticRangePickerParams<TView, TExternalProps>) => {
     renderPicker: () => React.JSX.Element;
 };

package/internals/hooks/useStaticRangePicker/useStaticRangePicker.js

@@ -4,9 +4,8 @@ const _excluded = ["props", "ref"];
 import * as React from 'react';
 import clsx from 'clsx';
 import { styled } from '@mui/material/styles';
-import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
 import { PickersLayout } from '@mui/x-date-pickers/PickersLayout';
-import { usePicker, DIALOG_WIDTH } from '@mui/x-date-pickers/internals';
+import { usePicker, DIALOG_WIDTH, PickerProvider } from '@mui/x-date-pickers/internals';
 import { useRangePosition } from "../useRangePosition.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const PickerStaticLayout = styled(PickersLayout)(({
@@ -42,11 +41,13 @@ export const useStaticRangePicker = _ref => {
   } = useRangePosition(props);
   const {
     layoutProps,
+    providerProps,
     renderCurrentView
   } = usePicker(_extends({}, pickerParams, {
     props,
     autoFocusView: autoFocus ?? false,
     fieldRef: undefined,
+    localeText,
     additionalViewProps: {
       rangePosition,
       onRangePositionChange
@@ -60,8 +61,7 @@ export const useStaticRangePicker = _ref => {
       onRangePositionChange
     })
   });
-  const renderPicker = () => /*#__PURE__*/_jsx(LocalizationProvider, {
-    localeText: localeText,
+  const renderPicker = () => /*#__PURE__*/_jsx(PickerProvider, _extends({}, providerProps, {
     children: /*#__PURE__*/_jsx(Layout, _extends({}, layoutProps, slotProps?.layout, {
       slots: slots,
       slotProps: slotPropsForLayout,
@@ -70,7 +70,7 @@ export const useStaticRangePicker = _ref => {
       ref: ref,
       children: renderCurrentView()
     }))
-  });
+  }));
   return {
     renderPicker
   };

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

@@ -1,29 +1,28 @@
 import * as React from 'react';
-import { BasePickerProps, UsePickerParams, ExportedBaseToolbarProps, StaticOnlyPickerProps, DateOrTimeViewWithMeridiem } from '@mui/x-date-pickers/internals';
-import { PickerValidDate } from '@mui/x-date-pickers/models';
+import { BasePickerProps, UsePickerParams, ExportedBaseToolbarProps, StaticOnlyPickerProps, DateOrTimeViewWithMeridiem, PickerRangeValue } from '@mui/x-date-pickers/internals';
 import { ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps } from '@mui/x-date-pickers/PickersLayout';
-import { RangeFieldSection, DateRange } from '../../../models';
+import { RangeFieldSection } from '../../../models';
 import { UseRangePositionProps } from '../useRangePosition';
-export interface UseStaticRangePickerSlots<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem> extends ExportedPickersLayoutSlots<DateRange<TDate>, TDate, TView> {
+export interface UseStaticRangePickerSlots<TView extends DateOrTimeViewWithMeridiem> extends ExportedPickersLayoutSlots<PickerRangeValue, TView> {
 }
-export interface UseStaticRangePickerSlotProps<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem> extends ExportedPickersLayoutSlotProps<DateRange<TDate>, TDate, TView> {
+export interface UseStaticRangePickerSlotProps<TView extends DateOrTimeViewWithMeridiem> extends ExportedPickersLayoutSlotProps<PickerRangeValue, TView> {
     toolbar?: ExportedBaseToolbarProps;
 }
 export interface StaticRangeOnlyPickerProps extends StaticOnlyPickerProps, UseRangePositionProps {
 }
-export interface UseStaticRangePickerProps<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UseStaticRangePickerProps<TDate, TView, any, TExternalProps>> extends BasePickerProps<DateRange<TDate>, TDate, TView, TError, TExternalProps, {}>, StaticRangeOnlyPickerProps {
+export interface UseStaticRangePickerProps<TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UseStaticRangePickerProps<TView, any, TExternalProps>> extends BasePickerProps<PickerRangeValue, TView, TError, TExternalProps, {}>, StaticRangeOnlyPickerProps {
     /**
      * Overridable components.
      * @default {}
      */
-    slots?: UseStaticRangePickerSlots<TDate, TView>;
+    slots?: UseStaticRangePickerSlots<TView>;
     /**
      * The props used for each component slot.
      * @default {}
      */
-    slotProps?: UseStaticRangePickerSlotProps<TDate, TView>;
+    slotProps?: UseStaticRangePickerSlotProps<TView>;
 }
-export interface UseStaticRangePickerParams<TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseStaticRangePickerProps<TDate, TView, any, TExternalProps>> extends Pick<UsePickerParams<DateRange<TDate>, TDate, TView, RangeFieldSection, TExternalProps, {}>, 'valueManager' | 'valueType' | 'validator'> {
+export interface UseStaticRangePickerParams<TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseStaticRangePickerProps<TView, any, TExternalProps>> extends Pick<UsePickerParams<PickerRangeValue, TView, RangeFieldSection, TExternalProps, {}>, 'valueManager' | 'valueType' | 'validator'> {
     props: TExternalProps;
     /**
      * Ref to pass to the root element

package/internals/models/dateRange.d.ts

@@ -2,16 +2,15 @@ import { PickerValidDate } from '@mui/x-date-pickers/models';
 /**
  * Props used to validate a day value in range pickers.
  */
-export interface DayRangeValidationProps<TDate extends PickerValidDate> {
+export interface DayRangeValidationProps {
     /**
      * Disable specific date.
      *
      * 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.
      * @param {string} position The date to test, 'start' or 'end'.
      * @returns {boolean} Returns `true` if the date should be disabled.
      */
-    shouldDisableDate?: (day: TDate, position: 'start' | 'end') => boolean;
+    shouldDisableDate?: (day: PickerValidDate, position: 'start' | 'end') => boolean;
 }

package/internals/models/dateTimeRange.d.ts

@@ -1,13 +1,8 @@
-import { BaseDateValidationProps, TimeValidationProps, MakeOptional, UseFieldInternalProps, DateTimeValidationProps, DateOrTimeViewWithMeridiem } from '@mui/x-date-pickers/internals';
-import { PickerValidDate } from '@mui/x-date-pickers/models';
-import { DayRangeValidationProps } from './dateRange';
-import { DateTimeRangeValidationError, RangeFieldSection, DateRange, RangeFieldSeparatorProps } from '../../models';
-export interface UseDateTimeRangeFieldProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<Omit<UseFieldInternalProps<DateRange<TDate>, TDate, RangeFieldSection, TEnableAccessibleFieldDOMStructure, DateTimeRangeValidationError>, 'unstableFieldRef'>, 'format'>, RangeFieldSeparatorProps, DayRangeValidationProps<TDate>, TimeValidationProps<TDate>, BaseDateValidationProps<TDate>, DateTimeValidationProps<TDate> {
-    /**
-     * 12h/24h view for hour selection clock.
-     * @default utils.is12HourCycleInCurrentLocale()
-     */
-    ampm?: boolean;
+import { MakeOptional } from '@mui/x-internals/types';
+import { UseFieldInternalProps, DateOrTimeViewWithMeridiem, AmPmProps, PickerRangeValue } from '@mui/x-date-pickers/internals';
+import { DateTimeRangeValidationError, RangeFieldSection, RangeFieldSeparatorProps } from '../../models';
+import { ExportedValidateDateTimeRangeProps } from '../../validation/validateDateTimeRange';
+export interface UseDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<Omit<UseFieldInternalProps<PickerRangeValue, RangeFieldSection, TEnableAccessibleFieldDOMStructure, DateTimeRangeValidationError>, 'unstableFieldRef'>, 'format'>, RangeFieldSeparatorProps, ExportedValidateDateTimeRangeProps, AmPmProps {
 }
 export type DateTimeRangePickerView = Exclude<DateOrTimeViewWithMeridiem, 'month' | 'year'>;
 export type DateTimeRangePickerViewExternal = Exclude<DateTimeRangePickerView, 'meridiem'>;

package/internals/models/fields.d.ts

@@ -0,0 +1,26 @@
+import { SxProps } from '@mui/material/styles';
+import { SlotComponentProps } from '@mui/utils';
+import { MakeRequired } from '@mui/x-internals/types';
+import { UseFieldInternalProps } from '@mui/x-date-pickers/internals';
+import { FieldSection } from '@mui/x-date-pickers/models';
+import { PickersTextField } from '@mui/x-date-pickers/PickersTextField';
+import type { MultiInputFieldRefs, MultiInputFieldSlotRootProps, RangeFieldSeparatorProps, RangePosition } from '../../models';
+/**
+ * Props the multi input field can receive when used inside a picker.
+ * Only contains what the MUI components are passing to the field, not what users can pass using the `props.slotProps.field`.
+ */
+export interface BaseMultiInputFieldProps<TValue, TSection extends FieldSection, TEnableAccessibleFieldDOMStructure extends boolean, TError> extends MakeRequired<Pick<UseFieldInternalProps<TValue, TSection, TEnableAccessibleFieldDOMStructure, TError>, 'readOnly' | 'disabled' | 'format' | 'formatDensity' | 'enableAccessibleFieldDOMStructure' | 'selectedSections' | 'onSelectedSectionsChange' | 'timezone' | 'autoFocus' | 'value' | 'onChange'>, 'format' | 'value' | 'onChange' | 'timezone'>, RangeFieldSeparatorProps, MultiInputFieldRefs {
+    className: string | undefined;
+    sx: SxProps<any> | undefined;
+    slots?: {
+        root?: React.ElementType;
+        separator?: React.ElementType;
+        textField?: React.ElementType;
+    };
+    slotProps?: {
+        root?: SlotComponentProps<React.ElementType<MultiInputFieldSlotRootProps>, {}, Record<string, any>>;
+        textField?: SlotComponentProps<typeof PickersTextField, {}, {
+            position?: RangePosition;
+        } & Record<string, any>>;
+    };
+}

package/internals/models/fields.js

@@ -0,0 +1 @@
+export {};

package/internals/models/timeRange.d.ts

@@ -1,10 +1,6 @@
-import { BaseTimeValidationProps, TimeValidationProps, MakeOptional, UseFieldInternalProps } from '@mui/x-date-pickers/internals';
-import { PickerValidDate } from '@mui/x-date-pickers/models';
-import { TimeRangeValidationError, RangeFieldSection, DateRange, RangeFieldSeparatorProps } from '../../models';
-export interface UseTimeRangeFieldProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<Omit<UseFieldInternalProps<DateRange<TDate>, TDate, RangeFieldSection, TEnableAccessibleFieldDOMStructure, TimeRangeValidationError>, 'unstableFieldRef'>, 'format'>, RangeFieldSeparatorProps, TimeValidationProps<TDate>, BaseTimeValidationProps {
-    /**
-     * 12h/24h view for hour selection clock.
-     * @default utils.is12HourCycleInCurrentLocale()
-     */
-    ampm?: boolean;
+import { MakeOptional } from '@mui/x-internals/types';
+import { UseFieldInternalProps, AmPmProps, PickerRangeValue } from '@mui/x-date-pickers/internals';
+import { TimeRangeValidationError, RangeFieldSection, RangeFieldSeparatorProps } from '../../models';
+import type { ExportedValidateTimeRangeProps } from '../../validation/validateTimeRange';
+export interface UseTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<Omit<UseFieldInternalProps<PickerRangeValue, RangeFieldSection, TEnableAccessibleFieldDOMStructure, TimeRangeValidationError>, 'unstableFieldRef'>, 'format'>, RangeFieldSeparatorProps, ExportedValidateTimeRangeProps, AmPmProps {
 }

package/internals/utils/date-range-manager.d.ts

@@ -1,9 +1,10 @@
 import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models';
-import { DateRange, RangePosition } from '../../models';
-interface CalculateRangeChangeOptions<TDate extends PickerValidDate> {
-    utils: MuiPickersAdapter<TDate>;
-    range: DateRange<TDate>;
-    newDate: TDate | null;
+import { PickerRangeValue } from '@mui/x-date-pickers/internals';
+import { RangePosition } from '../../models';
+interface CalculateRangeChangeOptions {
+    utils: MuiPickersAdapter;
+    range: PickerRangeValue;
+    newDate: PickerValidDate | null;
     rangePosition: RangePosition;
     /**
      * Should allow flipping range `start` and `end` dates if the `newDate` would result in a new range creation.
@@ -13,10 +14,10 @@ interface CalculateRangeChangeOptions<TDate extends PickerValidDate> {
     allowRangeFlip?: boolean;
     shouldMergeDateAndTime?: boolean;
 }
-interface CalculateRangeChangeResponse<TDate extends PickerValidDate> {
+interface CalculateRangeChangeResponse {
     nextSelection: RangePosition;
-    newRange: DateRange<TDate>;
+    newRange: PickerRangeValue;
 }
-export declare function calculateRangeChange<TDate extends PickerValidDate>({ utils, range, newDate: selectedDate, rangePosition, allowRangeFlip, shouldMergeDateAndTime, }: CalculateRangeChangeOptions<TDate>): CalculateRangeChangeResponse<TDate>;
-export declare function calculateRangePreview<TDate extends PickerValidDate>(options: CalculateRangeChangeOptions<TDate>): DateRange<TDate>;
+export declare function calculateRangeChange({ utils, range, newDate: selectedDate, rangePosition, allowRangeFlip, shouldMergeDateAndTime, }: CalculateRangeChangeOptions): CalculateRangeChangeResponse;
+export declare function calculateRangePreview(options: CalculateRangeChangeOptions): PickerRangeValue;
 export {};

package/internals/utils/date-utils.d.ts

@@ -1,6 +1,6 @@
 import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models';
-import { DateRange, NonEmptyDateRange } from '../../models';
-export declare const isRangeValid: <TDate extends PickerValidDate>(utils: MuiPickersAdapter<TDate>, range: DateRange<TDate> | null) => range is NonEmptyDateRange<TDate>;
-export declare const isWithinRange: <TDate extends PickerValidDate>(utils: MuiPickersAdapter<TDate>, day: TDate, range: DateRange<TDate> | null) => boolean;
-export declare const isStartOfRange: <TDate extends PickerValidDate>(utils: MuiPickersAdapter<TDate>, day: TDate, range: DateRange<TDate> | null) => boolean;
-export declare const isEndOfRange: <TDate extends PickerValidDate>(utils: MuiPickersAdapter<TDate>, day: TDate, range: DateRange<TDate> | null) => boolean;
+import { PickerRangeValue } from '@mui/x-date-pickers/internals';
+export declare const isRangeValid: (utils: MuiPickersAdapter, range: PickerRangeValue | null) => range is [PickerValidDate, PickerValidDate];
+export declare const isWithinRange: (utils: MuiPickersAdapter, day: PickerValidDate, range: PickerRangeValue | null) => boolean;
+export declare const isStartOfRange: (utils: MuiPickersAdapter, day: PickerValidDate, range: PickerRangeValue | null) => boolean;
+export declare const isEndOfRange: (utils: MuiPickersAdapter, day: PickerValidDate, range: PickerRangeValue | null) => boolean;

package/internals/utils/releaseInfo.js

@@ -1,6 +1,6 @@
 import { ponyfillGlobal } from '@mui/utils';
 export const getReleaseInfo = () => {
-  const releaseInfo = "MTczMTAyMDQwMDAwMA==";
+  const releaseInfo = "MTczMTUzODgwMDAwMA==";
   if (process.env.NODE_ENV !== 'production') {
     // A simple hack to set the value in the test environment (has no build step).
     // eslint-disable-next-line no-useless-concat

package/internals/utils/valueManagers.d.ts

@@ -1,8 +1,7 @@
-import { PickerValueManager, FieldValueManager } from '@mui/x-date-pickers/internals';
-import { PickerValidDate } from '@mui/x-date-pickers/models';
-import type { DateRangeValidationError, DateTimeRangeValidationError, TimeRangeValidationError, RangeFieldSection, DateRange } from '../../models';
-export type RangePickerValueManager<TValue = [any, any], TDate extends PickerValidDate = any, TError extends DateRangeValidationError | TimeRangeValidationError | DateTimeRangeValidationError = any> = PickerValueManager<TValue, TDate, TError>;
+import { PickerValueManager, FieldValueManager, PickerRangeValue } from '@mui/x-date-pickers/internals';
+import type { DateRangeValidationError, DateTimeRangeValidationError, TimeRangeValidationError, RangeFieldSection } from '../../models';
+export type RangePickerValueManager<TValue = [any, any], TError extends DateRangeValidationError | TimeRangeValidationError | DateTimeRangeValidationError = any> = PickerValueManager<TValue, TError>;
 export declare const rangeValueManager: RangePickerValueManager;
-export declare const getRangeFieldValueManager: <TDate extends PickerValidDate>({ dateSeparator, }: {
+export declare const getRangeFieldValueManager: ({ dateSeparator, }: {
     dateSeparator: string | undefined;
-}) => FieldValueManager<DateRange<TDate>, TDate, RangeFieldSection>;
+}) => FieldValueManager<PickerRangeValue, RangeFieldSection>;

package/models/dateRange.d.ts

@@ -1,8 +1,7 @@
-import { BaseDateValidationProps, MakeOptional, UseFieldInternalProps } from '@mui/x-date-pickers/internals';
-import { PickerValidDate } from '@mui/x-date-pickers/models';
+import { MakeOptional } from '@mui/x-internals/types';
+import { UseFieldInternalProps, PickerRangeValue } from '@mui/x-date-pickers/internals';
 import { RangeFieldSection, RangeFieldSeparatorProps } from './fields';
 import { DateRangeValidationError } from './validation';
-import { DateRange } from './range';
-import { DayRangeValidationProps } from '../internals/models/dateRange';
-export interface UseDateRangeFieldProps<TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<Omit<UseFieldInternalProps<DateRange<TDate>, TDate, RangeFieldSection, TEnableAccessibleFieldDOMStructure, DateRangeValidationError>, 'unstableFieldRef'>, 'format'>, RangeFieldSeparatorProps, DayRangeValidationProps<TDate>, BaseDateValidationProps<TDate> {
+import type { ExportedValidateDateRangeProps } from '../validation/validateDateRange';
+export interface UseDateRangeFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<Omit<UseFieldInternalProps<PickerRangeValue, RangeFieldSection, TEnableAccessibleFieldDOMStructure, DateRangeValidationError>, 'unstableFieldRef'>, 'format'>, RangeFieldSeparatorProps, ExportedValidateDateRangeProps {
 }

package/models/fields.d.ts

@@ -1,10 +1,7 @@
 import * as React from 'react';
-import { SlotComponentProps } from '@mui/utils';
-import { BaseFieldProps, UseFieldResponse } from '@mui/x-date-pickers/internals';
-import { BaseSingleInputPickersTextFieldProps, FieldRef, FieldSection, PickerValidDate } from '@mui/x-date-pickers/models';
+import { UseFieldResponse, FormProps } from '@mui/x-date-pickers/internals';
+import { FieldRef, FieldSection, PickerFieldSlotProps } from '@mui/x-date-pickers/models';
 import { UseClearableFieldResponse } from '@mui/x-date-pickers/hooks';
-import { SxProps } from '@mui/material/styles';
-import TextField from '@mui/material/TextField';
 import { RangePosition } from './range';
 export interface RangeFieldSection extends FieldSection {
     dateName: RangePosition;
@@ -13,11 +10,9 @@ export type FieldType = 'single-input' | 'multi-input';
 /**
  * Props the `textField` slot of the multi input field can receive when used inside a picker.
  */
-export interface MultiInputFieldSlotTextFieldProps {
+export interface MultiInputFieldSlotTextFieldProps extends FormProps {
     label?: React.ReactNode;
     id?: string;
-    disabled?: boolean;
-    readOnly?: boolean;
     onKeyDown?: React.KeyboardEventHandler;
     onClick?: React.MouseEventHandler;
     onFocus?: React.FocusEventHandler;
@@ -46,33 +41,11 @@ export interface RangeFieldSeparatorProps {
     dateSeparator?: string;
 }
 /**
- * Props the multi input field can receive when used inside a picker.
- * Only contains what the MUI components are passing to the field,
- * not what users can pass using the `props.slotProps.field`.
+ * Props the `slotProps.field` of a range picker component can receive.
  */
-export interface BaseMultiInputFieldProps<TValue, TDate extends PickerValidDate, TSection extends FieldSection, TEnableAccessibleFieldDOMStructure extends boolean, TError> extends Omit<BaseFieldProps<TValue, TDate, TSection, TEnableAccessibleFieldDOMStructure, TError>, 'unstableFieldRef'>, RangeFieldSeparatorProps {
-    sx?: SxProps<any>;
-    unstableStartFieldRef?: React.Ref<FieldRef<RangeFieldSection>>;
-    unstableEndFieldRef?: React.Ref<FieldRef<RangeFieldSection>>;
-    slots?: {
-        root?: React.ElementType;
-        separator?: React.ElementType;
-        textField?: React.ElementType;
-    };
-    slotProps?: {
-        root?: SlotComponentProps<React.ElementType<MultiInputFieldSlotRootProps>, {}, Record<string, any>>;
-        textField?: SlotComponentProps<typeof TextField, {}, {
-            position?: RangePosition;
-        } & Record<string, any>>;
-    };
-}
+export type PickerRangeFieldSlotProps<TValue, TSection extends FieldSection, TEnableAccessibleFieldDOMStructure extends boolean> = PickerFieldSlotProps<TValue, TSection, TEnableAccessibleFieldDOMStructure> & RangeFieldSeparatorProps;
 /**
  * Props the text field receives when used with a multi input picker.
  * Only contains what the MUI components are passing to the text field, not what users can pass using the `props.slotProps.textField`.
  */
 export type BaseMultiInputPickersTextFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> = UseClearableFieldResponse<UseFieldResponse<TEnableAccessibleFieldDOMStructure, MultiInputFieldSlotTextFieldProps>>;
-/**
- * Props the text field receives when used with a single or multi input picker.
- * Only contains what the MUI components are passing to the text field, not what users can pass using the `props.slotProps.field` or `props.slotProps.textField`.
- */
-export type BasePickersTextFieldProps<TEnableAccessibleFieldDOMStructure extends boolean> = BaseSingleInputPickersTextFieldProps<TEnableAccessibleFieldDOMStructure> & BaseMultiInputPickersTextFieldProps<TEnableAccessibleFieldDOMStructure>;

package/models/range.d.ts

@@ -1,4 +1,4 @@
 import { PickerValidDate } from '@mui/x-date-pickers/models';
 export type DateRange<TDate extends PickerValidDate> = [TDate | null, TDate | null];
-export type NonEmptyDateRange<TDate extends PickerValidDate> = [TDate, TDate];
+export type NonEmptyDateRange = [PickerValidDate, PickerValidDate];
 export type RangePosition = 'start' | 'end';