@mui/x-date-pickers-pro 8.0.0-alpha.11 → 8.0.0-alpha.13

package/modern/internals/hooks/useRangePosition.d.ts

@@ -0,0 +1,24 @@
+import { RangePosition } from "../../models/index.js";
+export interface UseRangePositionProps {
+  /**
+   * The position in the currently edited date range.
+   * Used when the component position is controlled.
+   */
+  rangePosition?: RangePosition;
+  /**
+   * The initial position in the edited date range.
+   * Used when the component is not controlled.
+   * @default 'start'
+   */
+  defaultRangePosition?: RangePosition;
+  /**
+   * Callback fired when the range position changes.
+   * @param {RangePosition} rangePosition The new range position.
+   */
+  onRangePositionChange?: (rangePosition: RangePosition) => void;
+}
+export interface UseRangePositionResponse {
+  rangePosition: RangePosition;
+  setRangePosition: (newPosition: RangePosition) => void;
+}
+export declare const useRangePosition: (props: UseRangePositionProps) => UseRangePositionResponse;

package/modern/internals/hooks/useRangePosition.js

@@ -1,27 +1,15 @@
 import useControlled from '@mui/utils/useControlled';
 import useEventCallback from '@mui/utils/useEventCallback';
-export const useRangePosition = (props, singleInputFieldRef) => {
+export const useRangePosition = props => {
   const [rangePosition, setRangePosition] = useControlled({
     name: 'useRangePosition',
     state: 'rangePosition',
     controlled: props.rangePosition,
     default: props.defaultRangePosition ?? 'start'
   });
-
-  // When using a single input field,
-  // we want to select the 1st section of the edited date when updating the range position.
-  const syncRangePositionWithSingleInputField = newRangePosition => {
-    if (singleInputFieldRef?.current == null) {
-      return;
-    }
-    const sections = singleInputFieldRef.current.getSections();
-    const targetActiveSectionIndex = newRangePosition === 'start' ? 0 : sections.length / 2;
-    singleInputFieldRef.current.setSelectedSections(targetActiveSectionIndex);
-  };
   const handleRangePositionChange = useEventCallback(newRangePosition => {
     setRangePosition(newRangePosition);
     props.onRangePositionChange?.(newRangePosition);
-    syncRangePositionWithSingleInputField(newRangePosition);
   });
   return {
     rangePosition,

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

@@ -0,0 +1,2 @@
+export { useStaticRangePicker } from "./useStaticRangePicker.js";
+export type { UseStaticRangePickerSlots, UseStaticRangePickerSlotProps, StaticRangeOnlyPickerProps } from './useStaticRangePicker.types';

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

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

package/modern/internals/hooks/useStaticRangePicker/useStaticRangePicker.js

@@ -39,10 +39,10 @@ export const useStaticRangePicker = _ref => {
     renderCurrentView
   } = usePicker(_extends({}, pickerParams, {
     props,
+    variant: displayStaticWrapperAs,
     autoFocusView: autoFocus ?? false,
-    fieldRef: undefined,
-    localeText,
-    variant: displayStaticWrapperAs
+    viewContainerRole: null,
+    localeText
   }));
   const Layout = slots?.layout ?? PickerStaticLayout;
   const renderPicker = () => /*#__PURE__*/_jsx(PickerRangePositionContext.Provider, {

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

@@ -0,0 +1,23 @@
+import { BasePickerProps, UsePickerParams, ExportedBaseToolbarProps, StaticOnlyPickerProps, DateOrTimeViewWithMeridiem, PickerRangeValue } from '@mui/x-date-pickers/internals';
+import { ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps } from '@mui/x-date-pickers/PickersLayout';
+import { UseRangePositionProps } from "../useRangePosition.js";
+export interface UseStaticRangePickerSlots extends ExportedPickersLayoutSlots<PickerRangeValue> {}
+export interface UseStaticRangePickerSlotProps extends ExportedPickersLayoutSlotProps<PickerRangeValue> {
+  toolbar?: ExportedBaseToolbarProps;
+}
+export interface StaticRangeOnlyPickerProps extends StaticOnlyPickerProps, UseRangePositionProps {}
+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;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: UseStaticRangePickerSlotProps;
+}
+export interface UseStaticRangePickerParams<TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseStaticRangePickerProps<TView, any, TExternalProps>> extends Pick<UsePickerParams<PickerRangeValue, TView, TExternalProps>, 'valueManager' | 'valueType' | 'validator' | 'ref'> {
+  props: TExternalProps;
+}

package/modern/internals/models/dateRange.d.ts

@@ -0,0 +1,16 @@
+import { PickerValidDate } from '@mui/x-date-pickers/models';
+/**
+ * Props used to validate a day value in range pickers.
+ */
+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.
+   *
+   * @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: PickerValidDate, position: 'start' | 'end') => boolean;
+}

package/modern/internals/models/dateTimeRange.d.ts

@@ -0,0 +1,3 @@
+import { DateOrTimeViewWithMeridiem } from '@mui/x-date-pickers/internals';
+export type DateTimeRangePickerView = Exclude<DateOrTimeViewWithMeridiem, 'month' | 'year'>;
+export type DateTimeRangePickerViewExternal = Exclude<DateTimeRangePickerView, 'meridiem'>;

package/modern/internals/models/fields.d.ts

@@ -0,0 +1,22 @@
+import { SlotComponentProps } from '@mui/utils';
+import { PickerRangeValue, UseFieldInternalProps } from '@mui/x-date-pickers/internals';
+import { FieldOwnerState } from '@mui/x-date-pickers/models';
+import { PickersTextField } from '@mui/x-date-pickers/PickersTextField';
+import type { MultiInputFieldRefs, MultiInputFieldSlotRootProps, 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 extends Pick<UseFieldInternalProps<PickerRangeValue, boolean, unknown>, 'readOnly' | 'autoFocus'>, MultiInputFieldRefs {
+  slots?: {
+    root?: React.ElementType;
+    separator?: React.ElementType;
+    textField?: React.ElementType;
+  };
+  slotProps?: {
+    root?: SlotComponentProps<React.ElementType<MultiInputFieldSlotRootProps>, {}, FieldOwnerState>;
+    textField?: SlotComponentProps<typeof PickersTextField, {}, FieldOwnerState & {
+      position?: RangePosition;
+    }>;
+  };
+}

package/modern/internals/models/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./dateRange.js";
+export * from "./dateTimeRange.js";
+export * from "./rangePickerProps.js";

package/modern/internals/models/managers.d.ts

@@ -0,0 +1,3 @@
+import { PickerRangeValue } from '@mui/x-date-pickers/internals';
+import { PickerManager } from '@mui/x-date-pickers/models';
+export type PickerAnyRangeManager = PickerManager<PickerRangeValue, any, any, any, any>;

package/modern/internals/models/rangePickerProps.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+/**
+ * Props common to all range non-static pickers.
+ * These props are handled by the headless wrappers.
+ */
+export interface BaseRangeNonStaticPickerProps {
+  /**
+   * The label content.
+   * Ignored if the field has several inputs.
+   */
+  label?: React.ReactNode;
+  /**
+   * Pass a ref to the `input` element.
+   * Ignored if the field has several inputs.
+   */
+  inputRef?: React.Ref<HTMLInputElement>;
+  /**
+   * Name attribute used by the `input` element in the Field.
+   * Ignored if the field has several inputs.
+   */
+  name?: string;
+}

package/modern/internals/utils/createMultiInputRangeField/createMultiInputRangeField.d.ts

@@ -0,0 +1,7 @@
+import { CreateMultiInputRangeFieldParameters, CreateMultiInputRangeFieldReturnValue } from "./createMultiInputRangeField.types.js";
+import { PickerAnyRangeManager } from "../../models/managers.js";
+export declare function createMultiInputRangeField<TManager extends PickerAnyRangeManager>({
+  useManager,
+  name,
+  getUtilityClass
+}: CreateMultiInputRangeFieldParameters<TManager>): CreateMultiInputRangeFieldReturnValue<TManager>;

package/modern/internals/utils/createMultiInputRangeField/createMultiInputRangeField.js

@@ -12,10 +12,11 @@ import { styled, useThemeProps } from '@mui/material/styles';
 import composeClasses from '@mui/utils/composeClasses';
 import useSlotProps from '@mui/utils/useSlotProps';
 import useForkRef from '@mui/utils/useForkRef';
-import { cleanFieldResponse, useFieldOwnerState, useNullablePickerContext } from '@mui/x-date-pickers/internals';
+import { cleanFieldResponse, useFieldOwnerState, PickerFieldUIContext, useNullablePickerContext } from '@mui/x-date-pickers/internals';
 import { useSplitFieldProps } from '@mui/x-date-pickers/hooks';
 import { PickersTextField } from '@mui/x-date-pickers/PickersTextField';
 import { useMultiInputRangeField } from "../../../hooks/useMultiInputRangeField/index.js";
+import { useTextFieldProps } from "./useTextFieldProps.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export function createMultiInputRangeField({
   useManager,
@@ -52,14 +53,19 @@ export function createMultiInputRangeField({
       // eslint-disable-next-line material-ui/mui-name-matches-component-name
       name
     });
+    const pickerFieldUIContext = React.useContext(PickerFieldUIContext);
+    const pickerContext = useNullablePickerContext();
     const manager = useManager({
       enableAccessibleFieldDOMStructure: props.enableAccessibleFieldDOMStructure,
       dateSeparator: props.dateSeparator
     });
     const {
-      internalProps,
+      internalProps: rawInternalProps,
       forwardedProps
     } = useSplitFieldProps(themeProps, manager.valueType);
+    const internalProps = pickerContext?.variant === 'mobile' ? _extends({}, rawInternalProps, {
+      readOnly: true
+    }) : rawInternalProps;
     const {
         slots,
         slotProps,
@@ -69,7 +75,6 @@ export function createMultiInputRangeField({
       otherForwardedProps = _objectWithoutPropertiesLoose(forwardedProps, _excluded);
     const classes = useUtilityClasses(classesProp);
     const ownerState = useFieldOwnerState(internalProps);
-    const pickerContext = useNullablePickerContext();
     const handleRef = useForkRef(ref, pickerContext?.rootRef);
     const Root = slots?.root ?? MultiInputRangeFieldRoot;
     const rootProps = useSlotProps({
@@ -82,29 +87,22 @@ export function createMultiInputRangeField({
       ownerState,
       className: clsx(className, classes.root)
     });
-    const startTextFieldProps = useSlotProps({
-      elementType: PickersTextField,
-      externalSlotProps: slotProps?.textField,
-      ownerState: _extends({}, ownerState, {
-        position: 'start'
-      })
+    const startTextFieldProps = useTextFieldProps({
+      slotProps,
+      ownerState,
+      position: 'start'
     });
-    const endTextFieldProps = useSlotProps({
-      elementType: PickersTextField,
-      externalSlotProps: slotProps?.textField,
-      ownerState: _extends({}, ownerState, {
-        position: 'end'
-      })
+    const endTextFieldProps = useTextFieldProps({
+      slotProps,
+      ownerState,
+      position: 'end'
     });
-    const {
-      startDate,
-      endDate,
-      enableAccessibleFieldDOMStructure
-    } = useMultiInputRangeField({
+    const fieldResponse = useMultiInputRangeField({
       manager,
       internalProps,
-      startForwardedProps: startTextFieldProps,
-      endForwardedProps: endTextFieldProps
+      rootProps,
+      startTextFieldProps,
+      endTextFieldProps
     });
     const Separator = slots?.separator ?? MultiInputRangeFieldSeparator;
     const separatorProps = useSlotProps({
@@ -116,19 +114,15 @@ export function createMultiInputRangeField({
       ownerState,
       className: classes.separator
     });
-    const {
-      textFieldProps: startDateProps
-    } = cleanFieldResponse(startDate);
-    const {
-      textFieldProps: endDateProps
-    } = cleanFieldResponse(endDate);
-    const TextField = slots?.textField ?? (enableAccessibleFieldDOMStructure === false ? MuiTextField : PickersTextField);
-    return /*#__PURE__*/_jsxs(Root, _extends({}, rootProps, {
+    const cleanStartTextFieldResponse = cleanFieldResponse(fieldResponse.startTextField);
+    const cleanEndTextFieldResponse = cleanFieldResponse(fieldResponse.endTextField);
+    const TextField = slots?.textField ?? pickerFieldUIContext.slots.textField ?? (fieldResponse.enableAccessibleFieldDOMStructure === false ? MuiTextField : PickersTextField);
+    return /*#__PURE__*/_jsxs(Root, _extends({}, fieldResponse.root, {
       children: [/*#__PURE__*/_jsx(TextField, _extends({
         fullWidth: true
-      }, startDateProps)), /*#__PURE__*/_jsx(Separator, _extends({}, separatorProps)), /*#__PURE__*/_jsx(TextField, _extends({
+      }, cleanStartTextFieldResponse.textFieldProps)), /*#__PURE__*/_jsx(Separator, _extends({}, separatorProps)), /*#__PURE__*/_jsx(TextField, _extends({
         fullWidth: true
-      }, endDateProps))]
+      }, cleanEndTextFieldResponse.textFieldProps))]
     }));
   });
   MultiInputRangeField.fieldType = 'multi-input';

package/modern/internals/utils/createMultiInputRangeField/createMultiInputRangeField.types.d.ts

@@ -0,0 +1,72 @@
+import type { TypographyProps } from '@mui/material/Typography';
+import type { StackProps } from '@mui/material/Stack';
+import type { TextFieldProps } from '@mui/material/TextField';
+import { SlotComponentPropsFromProps } from '@mui/x-internals/types';
+import { PickersTextFieldProps } from '@mui/x-date-pickers/PickersTextField';
+import { FieldOwnerState } from '@mui/x-date-pickers/models';
+import { PickerManagerEnableAccessibleFieldDOMStructure, PickerManagerFieldInternalProps } from '@mui/x-date-pickers/internals';
+import { FieldType, MultiInputFieldRefs, RangeFieldSeparatorProps, RangePosition } from "../../../models/index.js";
+import { PickerAnyRangeManager } from "../../models/managers.js";
+export type MultiInputRangeFieldProps<TManager extends PickerAnyRangeManager> = MultiInputFieldRefs & RangeFieldSeparatorProps & Omit<PickerManagerFieldInternalProps<TManager>, 'unstableFieldRef' | 'clearable' | 'onClear' | 'focused'> & Omit<StackProps, 'position' | keyof PickerManagerFieldInternalProps<TManager>> & {
+  /**
+   * If `true`, the field is focused during the first mount.
+   * @default false
+   */
+  autoFocus?: boolean;
+  className?: string;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<MultiInputRangeFieldClasses>;
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: MultiInputRangeFieldSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: MultiInputRangeFieldSlotProps;
+};
+export interface MultiInputRangeFieldSlots {
+  /**
+   * Element rendered at the root.
+   * @default MultiInputRangeFieldRoot
+   */
+  root?: React.ElementType;
+  /**
+   * Form control with an input to render a date.
+   * It is rendered twice: once for the start date and once for the end date.
+   * @default <PickersTextField />, or <TextField /> from '@mui/material' if `enableAccessibleFieldDOMStructure` is `false`.
+   */
+  textField?: React.ElementType;
+  /**
+   * Element rendered between the two inputs.
+   * @default MultiInputRangeFieldSeparator
+   */
+  separator?: React.ElementType;
+}
+export interface MultiInputRangeFieldSlotProps {
+  root?: SlotComponentPropsFromProps<StackProps, {}, FieldOwnerState>;
+  textField?: SlotComponentPropsFromProps<PickersTextFieldProps | TextFieldProps, {}, FieldOwnerState & {
+    position: RangePosition;
+  }>;
+  separator?: SlotComponentPropsFromProps<TypographyProps, {}, FieldOwnerState>;
+}
+export interface MultiInputRangeFieldClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the separator element. */
+  separator: string;
+}
+export interface CreateMultiInputRangeFieldParameters<TManager extends PickerAnyRangeManager> {
+  name: string;
+  getUtilityClass: (slot: string) => string;
+  useManager: (params: RangeFieldSeparatorProps & {
+    enableAccessibleFieldDOMStructure: PickerManagerEnableAccessibleFieldDOMStructure<TManager>;
+  }) => TManager;
+}
+export type CreateMultiInputRangeFieldReturnValue<TManager extends PickerAnyRangeManager> = ((props: MultiInputRangeFieldProps<TManager> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+  fieldType?: FieldType;
+};

package/modern/internals/utils/createMultiInputRangeField/index.d.ts

@@ -0,0 +1,3 @@
+export { createMultiInputRangeField } from "./createMultiInputRangeField.js";
+export type { MultiInputRangeFieldProps, MultiInputRangeFieldSlots, MultiInputRangeFieldSlotProps, MultiInputRangeFieldClasses } from './createMultiInputRangeField.types';
+export { useMultiInputRangeField as unstable_useMultiInputRangeField } from "../../../hooks/useMultiInputRangeField/useMultiInputRangeField.js";

package/modern/internals/utils/createMultiInputRangeField/useTextFieldProps.d.ts

@@ -0,0 +1,12 @@
+import { PickersTextFieldProps } from '@mui/x-date-pickers/PickersTextField';
+import { FieldOwnerState } from '@mui/x-date-pickers/models';
+import { MultiInputRangeFieldSlotProps } from "./createMultiInputRangeField.types.js";
+export declare function useTextFieldProps({
+  slotProps,
+  ownerState,
+  position
+}: {
+  slotProps: MultiInputRangeFieldSlotProps | undefined;
+  ownerState: FieldOwnerState;
+  position: 'start' | 'end';
+}): PickersTextFieldProps;

package/modern/internals/utils/createMultiInputRangeField/useTextFieldProps.js

@@ -0,0 +1,36 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import useSlotProps from '@mui/utils/useSlotProps';
+import { PickersTextField } from '@mui/x-date-pickers/PickersTextField';
+import { usePickerTranslations } from '@mui/x-date-pickers/hooks';
+import { PickerFieldUIContext, useNullablePickerContext, mergeSlotProps } from '@mui/x-date-pickers/internals';
+import { useNullablePickerRangePositionContext } from "../../hooks/useNullablePickerRangePositionContext.js";
+export function useTextFieldProps({
+  slotProps,
+  ownerState,
+  position
+}) {
+  const pickerContext = useNullablePickerContext();
+  const translations = usePickerTranslations();
+  const pickerFieldUIContext = React.useContext(PickerFieldUIContext);
+  const rangePositionContext = useNullablePickerRangePositionContext();
+  const textFieldProps = useSlotProps({
+    elementType: PickersTextField,
+    externalSlotProps: mergeSlotProps(pickerFieldUIContext.slotProps.textField, slotProps?.textField),
+    additionalProps: {
+      // TODO: Decide if we also want to set the default labels on standalone fields.
+      label: pickerContext ? translations[position] : undefined,
+      focused: pickerContext?.open ? rangePositionContext?.rangePosition === position : undefined
+    },
+    ownerState: _extends({}, ownerState, {
+      position
+    })
+  });
+  if (!textFieldProps.InputProps) {
+    textFieldProps.InputProps = {};
+  }
+  if (pickerContext && position === 'start') {
+    textFieldProps.InputProps.ref = pickerContext.triggerRef;
+  }
+  return textFieldProps;
+}

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

@@ -0,0 +1,23 @@
+import { FieldRangeSection } from '@mui/x-date-pickers/internals';
+export declare const splitDateRangeSections: (sections: FieldRangeSection[]) => {
+  startDate: FieldRangeSection[];
+  endDate: FieldRangeSection[];
+};
+export declare const removeLastSeparator: (dateSections: FieldRangeSection[]) => (FieldRangeSection | {
+  separator: null;
+  dateName: import("@mui/x-date-pickers/internals").RangePosition;
+  value: string;
+  format: string;
+  maxLength: number | null;
+  placeholder: string;
+  type: import("@mui/x-date-pickers").FieldSectionType;
+  contentType: import("@mui/x-date-pickers").FieldSectionContentType;
+  hasLeadingZerosInFormat: boolean;
+  hasLeadingZerosInInput: boolean;
+  modified: boolean;
+  startSeparator: string;
+  endSeparator: string;
+})[];
+export declare function getRangeFieldType(field: React.ElementType & {
+  fieldType?: 'single-input' | 'multi-input';
+}): "single-input" | "multi-input";

package/modern/internals/utils/date-fields-utils.js

@@ -21,4 +21,8 @@ export const removeLastSeparator = dateSections => dateSections.map((section, se
     });
   }
   return section;
-});
+});
+export function getRangeFieldType(field) {
+  const fieldType = field.fieldType ?? 'multi-input';
+  return fieldType;
+}

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

@@ -0,0 +1,32 @@
+import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models';
+import { PickerRangeValue } from '@mui/x-date-pickers/internals';
+import { RangePosition } from "../../models/index.js";
+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.
+   *
+   * It is used to allow dragging range `start` date past `end` date essentially becoming the new `end` date and vice versa.
+   */
+  allowRangeFlip?: boolean;
+  shouldMergeDateAndTime?: boolean;
+  referenceDate?: PickerValidDate;
+}
+interface CalculateRangeChangeResponse {
+  nextSelection: RangePosition;
+  newRange: PickerRangeValue;
+}
+export declare function calculateRangeChange({
+  utils,
+  range,
+  newDate: selectedDate,
+  rangePosition,
+  allowRangeFlip,
+  shouldMergeDateAndTime,
+  referenceDate
+}: CalculateRangeChangeOptions): CalculateRangeChangeResponse;
+export declare function calculateRangePreview(options: CalculateRangeChangeOptions): PickerRangeValue;
+export {};

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

@@ -0,0 +1,6 @@
+import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models';
+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/modern/internals/utils/releaseInfo.d.ts

@@ -0,0 +1 @@
+export declare const getReleaseInfo: () => any;

package/modern/internals/utils/releaseInfo.js

@@ -1,6 +1,6 @@
 import { ponyfillGlobal } from '@mui/utils';
 export const getReleaseInfo = () => {
-  const releaseInfo = "MTczODg4MjgwMDAwMA==";
+  const releaseInfo = "MTc0MDY5NzIwMDAwMA==";
   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/modern/internals/utils/valueManagers.d.ts

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

package/modern/locales/index.d.ts

@@ -0,0 +1 @@
+export * from '@mui/x-date-pickers/locales';

package/modern/managers/index.d.ts

@@ -0,0 +1,6 @@
+export { useDateRangeManager } from "./useDateRangeManager.js";
+export type { UseDateRangeManagerReturnValue, UseDateRangeManagerParameters, DateRangeManagerFieldInternalProps } from './useDateRangeManager';
+export { useTimeRangeManager } from "./useTimeRangeManager.js";
+export type { UseTimeRangeManagerReturnValue, UseTimeRangeManagerParameters, TimeRangeManagerFieldInternalProps } from './useTimeRangeManager';
+export { useDateTimeRangeManager } from "./useDateTimeRangeManager.js";
+export type { UseDateTimeRangeManagerReturnValue, UseDateTimeRangeManagerParameters, DateTimeRangeManagerFieldInternalProps } from './useDateTimeRangeManager';

package/modern/managers/useDateRangeManager.d.ts

@@ -0,0 +1,13 @@
+import type { MakeOptional } from '@mui/x-internals/types';
+import { PickerManager } from '@mui/x-date-pickers/models';
+import { PickerRangeValue, UseFieldInternalProps } from '@mui/x-date-pickers/internals';
+import { DateRangeValidationError, RangeFieldSeparatorProps } from "../models/index.js";
+import { ExportedValidateDateRangeProps, ValidateDateRangeProps } from "../validation/validateDateRange.js";
+export declare function useDateRangeManager<TEnableAccessibleFieldDOMStructure extends boolean = true>(parameters?: UseDateRangeManagerParameters<TEnableAccessibleFieldDOMStructure>): UseDateRangeManagerReturnValue<TEnableAccessibleFieldDOMStructure>;
+export interface UseDateRangeManagerParameters<TEnableAccessibleFieldDOMStructure extends boolean> extends RangeFieldSeparatorProps {
+  enableAccessibleFieldDOMStructure?: TEnableAccessibleFieldDOMStructure;
+}
+export type UseDateRangeManagerReturnValue<TEnableAccessibleFieldDOMStructure extends boolean> = PickerManager<PickerRangeValue, TEnableAccessibleFieldDOMStructure, DateRangeValidationError, DateRangeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure>, DateRangeManagerFieldInternalPropsWithDefaults<TEnableAccessibleFieldDOMStructure>>;
+export interface DateRangeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<UseFieldInternalProps<PickerRangeValue, TEnableAccessibleFieldDOMStructure, DateRangeValidationError>, 'format'>, RangeFieldSeparatorProps, ExportedValidateDateRangeProps {}
+interface DateRangeManagerFieldInternalPropsWithDefaults<TEnableAccessibleFieldDOMStructure extends boolean> extends UseFieldInternalProps<PickerRangeValue, TEnableAccessibleFieldDOMStructure, DateRangeValidationError>, ValidateDateRangeProps, RangeFieldSeparatorProps {}
+export {};

package/modern/managers/useDateRangeManager.js

@@ -28,6 +28,13 @@ export function useDateRangeManager(parameters = {}) {
       internalProps
     })),
     // TODO v8: Add a real aria label before moving the opening logic to the field on range pickers.
-    internal_getOpenPickerButtonAriaLabel: () => ''
+    internal_getOpenPickerButtonAriaLabel: ({
+      value,
+      utils,
+      localeText
+    }) => {
+      const formattedValue = utils.isValid(value[0]) ? utils.format(value[0], 'fullDate') : null;
+      return localeText.openDatePickerDialogue(formattedValue);
+    }
   }), [enableAccessibleFieldDOMStructure, dateSeparator]);
 }

package/modern/managers/useDateTimeRangeManager.d.ts

@@ -0,0 +1,13 @@
+import type { MakeOptional } from '@mui/x-internals/types';
+import { PickerManager } from '@mui/x-date-pickers/models';
+import { AmPmProps, PickerRangeValue, UseFieldInternalProps } from '@mui/x-date-pickers/internals';
+import { DateTimeRangeValidationError, RangeFieldSeparatorProps } from "../models/index.js";
+import { ExportedValidateDateTimeRangeProps, ValidateDateTimeRangeProps } from "../validation/validateDateTimeRange.js";
+export declare function useDateTimeRangeManager<TEnableAccessibleFieldDOMStructure extends boolean = true>(parameters?: UseDateTimeRangeManagerParameters<TEnableAccessibleFieldDOMStructure>): UseDateTimeRangeManagerReturnValue<TEnableAccessibleFieldDOMStructure>;
+export interface UseDateTimeRangeManagerParameters<TEnableAccessibleFieldDOMStructure extends boolean> extends RangeFieldSeparatorProps {
+  enableAccessibleFieldDOMStructure?: TEnableAccessibleFieldDOMStructure;
+}
+export type UseDateTimeRangeManagerReturnValue<TEnableAccessibleFieldDOMStructure extends boolean> = PickerManager<PickerRangeValue, TEnableAccessibleFieldDOMStructure, DateTimeRangeValidationError, DateTimeRangeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure>, DateTimeRangeManagerFieldInternalPropsWithDefaults<TEnableAccessibleFieldDOMStructure>>;
+export interface DateTimeRangeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<UseFieldInternalProps<PickerRangeValue, TEnableAccessibleFieldDOMStructure, DateTimeRangeValidationError>, 'format'>, ExportedValidateDateTimeRangeProps, AmPmProps, RangeFieldSeparatorProps {}
+interface DateTimeRangeManagerFieldInternalPropsWithDefaults<TEnableAccessibleFieldDOMStructure extends boolean> extends UseFieldInternalProps<PickerRangeValue, TEnableAccessibleFieldDOMStructure, DateTimeRangeValidationError>, ValidateDateTimeRangeProps, RangeFieldSeparatorProps {}
+export {};

package/modern/managers/useDateTimeRangeManager.js

@@ -28,6 +28,13 @@ export function useDateTimeRangeManager(parameters = {}) {
       defaultDates
     })),
     // TODO v8: Add a real aria label before moving the opening logic to the field on range pickers.
-    internal_getOpenPickerButtonAriaLabel: () => ''
+    internal_getOpenPickerButtonAriaLabel: ({
+      value,
+      utils,
+      localeText
+    }) => {
+      const formattedValue = utils.isValid(value[0]) ? utils.format(value[0], 'fullDate') : null;
+      return localeText.openDatePickerDialogue(formattedValue);
+    }
   }), [enableAccessibleFieldDOMStructure, dateSeparator]);
 }

package/modern/managers/useTimeRangeManager.d.ts

@@ -0,0 +1,13 @@
+import type { MakeOptional } from '@mui/x-internals/types';
+import { PickerManager } from '@mui/x-date-pickers/models';
+import { AmPmProps, PickerRangeValue, UseFieldInternalProps } from '@mui/x-date-pickers/internals';
+import { TimeRangeValidationError, RangeFieldSeparatorProps } from "../models/index.js";
+import { ExportedValidateTimeRangeProps, ValidateTimeRangeProps } from "../validation/validateTimeRange.js";
+export declare function useTimeRangeManager<TEnableAccessibleFieldDOMStructure extends boolean = true>(parameters?: UseTimeRangeManagerParameters<TEnableAccessibleFieldDOMStructure>): UseTimeRangeManagerReturnValue<TEnableAccessibleFieldDOMStructure>;
+export interface UseTimeRangeManagerParameters<TEnableAccessibleFieldDOMStructure extends boolean> extends RangeFieldSeparatorProps {
+  enableAccessibleFieldDOMStructure?: TEnableAccessibleFieldDOMStructure;
+}
+export type UseTimeRangeManagerReturnValue<TEnableAccessibleFieldDOMStructure extends boolean> = PickerManager<PickerRangeValue, TEnableAccessibleFieldDOMStructure, TimeRangeValidationError, TimeRangeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure>, TimeRangeManagerFieldInternalPropsWithDefaults<TEnableAccessibleFieldDOMStructure>>;
+export interface TimeRangeManagerFieldInternalProps<TEnableAccessibleFieldDOMStructure extends boolean> extends MakeOptional<UseFieldInternalProps<PickerRangeValue, TEnableAccessibleFieldDOMStructure, TimeRangeValidationError>, 'format'>, ExportedValidateTimeRangeProps, AmPmProps, RangeFieldSeparatorProps {}
+interface TimeRangeManagerFieldInternalPropsWithDefaults<TEnableAccessibleFieldDOMStructure extends boolean> extends UseFieldInternalProps<PickerRangeValue, TEnableAccessibleFieldDOMStructure, TimeRangeValidationError>, ValidateTimeRangeProps {}
+export {};