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

package/managers/useTimeRangeManager.js

@@ -1,31 +1,47 @@
+"use strict";
 'use client';
 
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import { getTimeFieldInternalPropsDefaults } from '@mui/x-date-pickers/internals';
-import { getRangeFieldValueManager, rangeValueManager } from "../internals/utils/valueManagers.js";
-import { validateTimeRange } from "../validation/index.js";
-export function useTimeRangeManager(parameters = {}) {
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useTimeRangeManager = useTimeRangeManager;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var React = _interopRequireWildcard(require("react"));
+var _internals = require("@mui/x-date-pickers/internals");
+var _valueManagers = require("../internals/utils/valueManagers");
+var _validation = require("../validation");
+function useTimeRangeManager(parameters = {}) {
   const {
     enableAccessibleFieldDOMStructure = true,
     dateSeparator
   } = parameters;
   return React.useMemo(() => ({
     valueType: 'time',
-    validator: validateTimeRange,
-    internal_valueManager: rangeValueManager,
-    internal_fieldValueManager: getRangeFieldValueManager({
+    validator: _validation.validateTimeRange,
+    internal_valueManager: _valueManagers.rangeValueManager,
+    internal_fieldValueManager: (0, _valueManagers.getRangeFieldValueManager)({
       dateSeparator
     }),
     internal_enableAccessibleFieldDOMStructure: enableAccessibleFieldDOMStructure,
     internal_applyDefaultsToFieldInternalProps: ({
       internalProps,
       utils
-    }) => _extends({}, internalProps, getTimeFieldInternalPropsDefaults({
+    }) => (0, _extends2.default)({}, internalProps, (0, _internals.getTimeFieldInternalPropsDefaults)({
       utils,
       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
+    }) => {
+      // TODO: Use ampm prop?
+      const ampm = utils.is12HourCycleInCurrentLocale();
+      const formattedValue = utils.isValid(value[0]) ? utils.format(value[0], ampm ? 'fullTime12h' : 'fullTime24h') : null;
+      return localeText.openTimePickerDialogue(formattedValue);
+    }
   }), [enableAccessibleFieldDOMStructure, dateSeparator]);
 }

package/models/fields.d.ts

@@ -1,47 +1,34 @@
 import * as React from 'react';
-import { UseFieldResponse, FormProps, PickerValue, PickerRangeValue } from '@mui/x-date-pickers/internals';
+import { PickerValue, PickerRangeValue } from '@mui/x-date-pickers/internals';
 import { FieldRef, PickerFieldSlotProps } from '@mui/x-date-pickers/models';
+import type { UseMultiInputRangeFieldTextFieldProps } from '../hooks/useMultiInputRangeField';
 export type { FieldRangeSection } from '@mui/x-date-pickers/internals';
 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 extends FormProps {
-    label?: React.ReactNode;
-    id?: string;
-    onKeyDown?: React.KeyboardEventHandler;
-    onClick?: React.MouseEventHandler;
-    onFocus?: React.FocusEventHandler;
-    focused?: boolean;
-    InputProps?: {
-        ref?: React.Ref<any>;
-        endAdornment?: React.ReactNode;
-        startAdornment?: React.ReactNode;
-    };
-}
+export type MultiInputFieldSlotTextFieldProps<TEnableAccessibleFieldDOMStructure extends boolean = true> = UseMultiInputRangeFieldTextFieldProps<TEnableAccessibleFieldDOMStructure, {
+  label?: React.ReactNode;
+  focused?: boolean;
+}>;
 /**
  * Props the `root` slot of the multi input field can receive when used inside a picker.
  */
 export interface MultiInputFieldSlotRootProps {
-    onBlur?: React.FocusEventHandler;
+  onBlur?: React.FocusEventHandler;
 }
 export interface MultiInputFieldRefs {
-    unstableStartFieldRef?: React.Ref<FieldRef<PickerValue>>;
-    unstableEndFieldRef?: React.Ref<FieldRef<PickerValue>>;
+  unstableStartFieldRef?: React.Ref<FieldRef<PickerValue>>;
+  unstableEndFieldRef?: React.Ref<FieldRef<PickerValue>>;
 }
 export interface RangeFieldSeparatorProps {
-    /**
-     * String displayed between the start and the end dates.
-     * @default "–"
-     */
-    dateSeparator?: string;
+  /**
+   * String displayed between the start and the end dates.
+   * @default "–"
+   */
+  dateSeparator?: string;
 }
 /**
  * Props the `slotProps.field` of a range picker component can receive.
  */
-export type PickerRangeFieldSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> = PickerFieldSlotProps<PickerRangeValue, 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> = Omit<UseFieldResponse<TEnableAccessibleFieldDOMStructure, MultiInputFieldSlotTextFieldProps>, 'slots' | 'slotProps' | 'clearable' | 'onClear' | 'openPickerButtonPosition' | 'clearButtonPosition' | 'openPickerAriaLabel'>;
+export type PickerRangeFieldSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> = PickerFieldSlotProps<PickerRangeValue, TEnableAccessibleFieldDOMStructure> & RangeFieldSeparatorProps;

package/models/fields.js

@@ -1 +1,5 @@
-export {};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/models/index.d.ts

@@ -1,4 +1,4 @@
-export * from './fields';
-export * from './range';
-export * from './validation';
-export type { RangePosition } from '@mui/x-date-pickers/internals';
+export * from "./fields.js";
+export * from "./range.js";
+export * from "./validation.js";
+export type { RangePosition } from '@mui/x-date-pickers/internals';

package/models/index.js

@@ -1,4 +1,38 @@
-export * from "./fields.js";
-export * from "./range.js";
-export * from "./validation.js";
-export {};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _fields = require("./fields");
+Object.keys(_fields).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _fields[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _fields[key];
+    }
+  });
+});
+var _range = require("./range");
+Object.keys(_range).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _range[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _range[key];
+    }
+  });
+});
+var _validation = require("./validation");
+Object.keys(_validation).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _validation[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _validation[key];
+    }
+  });
+});

package/models/range.d.ts

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

package/models/range.js

@@ -1 +1,5 @@
-export {};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/models/validation.d.ts

@@ -1,9 +1,6 @@
 import { DateTimeValidationError, DateValidationError, TimeValidationError } from '@mui/x-date-pickers/models';
-type RangeValidation<ItemError extends string | null> = [
-    ItemError | 'invalidRange',
-    ItemError | 'invalidRange'
-];
+type RangeValidation<ItemError extends string | null> = [ItemError | 'invalidRange', ItemError | 'invalidRange'];
 export type DateRangeValidationError = RangeValidation<DateValidationError>;
 export type TimeRangeValidationError = RangeValidation<TimeValidationError>;
 export type DateTimeRangeValidationError = RangeValidation<DateTimeValidationError>;
-export {};
+export {};

package/models/validation.js

@@ -1 +1,5 @@
-export {};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/modern/AdapterDateFns/index.d.ts

@@ -0,0 +1 @@
+export { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';

package/modern/AdapterDateFnsJalali/index.d.ts

@@ -0,0 +1 @@
+export { AdapterDateFnsJalali } from '@mui/x-date-pickers/AdapterDateFnsJalali';

package/modern/AdapterDateFnsJalaliV2/index.d.ts

@@ -0,0 +1 @@
+export { AdapterDateFnsJalali } from '@mui/x-date-pickers/AdapterDateFnsJalaliV2';

package/modern/AdapterDateFnsV2/index.d.ts

@@ -0,0 +1 @@
+export { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFnsV2';

package/modern/AdapterDayjs/index.d.ts

@@ -0,0 +1 @@
+export { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';

package/modern/AdapterLuxon/index.d.ts

@@ -0,0 +1 @@
+export { AdapterLuxon } from '@mui/x-date-pickers/AdapterLuxon';

package/modern/AdapterMoment/index.d.ts

@@ -0,0 +1 @@
+export { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment';

package/modern/AdapterMomentHijri/index.d.ts

@@ -0,0 +1 @@
+export { AdapterMomentHijri } from '@mui/x-date-pickers/AdapterMomentHijri';

package/modern/AdapterMomentJalaali/index.d.ts

@@ -0,0 +1 @@
+export { AdapterMomentJalaali } from '@mui/x-date-pickers/AdapterMomentJalaali';

package/modern/DateRangeCalendar/DateRangeCalendar.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { DateRangeCalendarProps } from "./DateRangeCalendar.types.js";
+type DateRangeCalendarComponent = ((props: DateRangeCalendarProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+  propTypes?: any;
+};
+/**
+ * Demos:
+ *
+ * - [DateRangePicker](https://mui.com/x/react-date-pickers/date-range-picker/)
+ * - [DateRangeCalendar](https://mui.com/x/react-date-pickers/date-range-calendar/)
+ *
+ * API:
+ *
+ * - [DateRangeCalendar API](https://mui.com/x/api/date-pickers/date-range-calendar/)
+ */
+declare const DateRangeCalendar: DateRangeCalendarComponent;
+export { DateRangeCalendar };

package/modern/DateRangeCalendar/DateRangeCalendar.types.d.ts

@@ -0,0 +1,113 @@
+import * as React from 'react';
+import { SxProps } from '@mui/system';
+import { SlotComponentProps } from '@mui/utils';
+import { Theme } from '@mui/material/styles';
+import { DefaultizedProps } from '@mui/x-internals/types';
+import { PickerOwnerState, PickerValidDate, TimezoneProps } from '@mui/x-date-pickers/models';
+import { PickersCalendarHeader, PickersCalendarHeaderSlots, PickersCalendarHeaderSlotProps } from '@mui/x-date-pickers/PickersCalendarHeader';
+import { PickerDayOwnerState } from '@mui/x-date-pickers/DateCalendar';
+import { BaseDateValidationProps, ExportedDayCalendarProps, DayCalendarSlots, DayCalendarSlotProps, PickersArrowSwitcherSlots, PickersArrowSwitcherSlotProps, ExportedUseViewsOptions, PickerRangeValue, FormProps } from '@mui/x-date-pickers/internals';
+import { RangePosition } from "../models/index.js";
+import { DateRangeCalendarClasses } from "./dateRangeCalendarClasses.js";
+import { DateRangePickerDay, DateRangePickerDayProps } from "../DateRangePickerDay/index.js";
+import { UseRangePositionProps } from "../internals/hooks/useRangePosition.js";
+import { PickersRangeCalendarHeaderProps } from "../PickersRangeCalendarHeader/index.js";
+import { ExportedValidateDateRangeProps } from "../validation/validateDateRange.js";
+export interface DateRangeCalendarSlots extends PickersArrowSwitcherSlots, Omit<DayCalendarSlots, 'day'>, PickersCalendarHeaderSlots {
+  /**
+   * Custom component for calendar header.
+   * Check the [PickersCalendarHeader](https://mui.com/x/api/date-pickers/pickers-calendar-header/) component.
+   * @default PickersCalendarHeader
+   */
+  calendarHeader?: React.ElementType<PickersRangeCalendarHeaderProps>;
+  /**
+   * Custom component for day in range pickers.
+   * Check the [DateRangePickersDay](https://mui.com/x/api/date-pickers/date-range-picker-day/) component.
+   * @default DateRangePickersDay
+   */
+  day?: React.ElementType<DateRangePickerDayProps>;
+}
+export interface DateRangeCalendarSlotProps extends PickersArrowSwitcherSlotProps, Omit<DayCalendarSlotProps, 'day'>, PickersCalendarHeaderSlotProps {
+  calendarHeader?: SlotComponentProps<typeof PickersCalendarHeader, {}, DateRangeCalendarOwnerState>;
+  day?: SlotComponentProps<typeof DateRangePickerDay, {}, PickerDayOwnerState>;
+}
+export interface ExportedDateRangeCalendarProps extends ExportedDayCalendarProps, ExportedValidateDateRangeProps, TimezoneProps, FormProps {
+  /**
+   * If `true`, after selecting `start` date calendar will not automatically switch to the month of `end` date.
+   * @default false
+   */
+  disableAutoMonthSwitching?: boolean;
+  /**
+   * If `true`, disable heavy animations.
+   * @default `@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13
+   */
+  reduceAnimations?: boolean;
+  /**
+   * Callback fired on month change.
+   * @param {PickerValidDate} month The new month.
+   */
+  onMonthChange?: (month: PickerValidDate) => void;
+  /**
+   * Position the current month is rendered in.
+   * @default 1
+   */
+  currentMonthCalendarPosition?: 1 | 2 | 3;
+  /**
+   * If `true`, editing dates by dragging is disabled.
+   * @default false
+   */
+  disableDragEditing?: boolean;
+}
+export interface DateRangeCalendarProps extends ExportedDateRangeCalendarProps, UseRangePositionProps, ExportedUseViewsOptions<PickerRangeValue, 'day'> {
+  /**
+   * The selected value.
+   * Used when the component is controlled.
+   */
+  value?: PickerRangeValue;
+  /**
+   * The default selected value.
+   * Used when the component is not controlled.
+   */
+  defaultValue?: PickerRangeValue;
+  /**
+   * The date used to generate the new value when both `value` and `defaultValue` are empty.
+   * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`.
+   */
+  referenceDate?: PickerValidDate;
+  /**
+   * The number of calendars to render.
+   * @default 2
+   */
+  calendars?: 1 | 2 | 3;
+  className?: string;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<DateRangeCalendarClasses>;
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx?: SxProps<Theme>;
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: DateRangeCalendarSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: DateRangeCalendarSlotProps;
+  /**
+   * Range positions available for selection.
+   * This list is checked against when checking if a next range position can be selected.
+   *
+   * Used on Date Time Range pickers with current `rangePosition` to force a `finish` selection after just one range position selection.
+   * @default ['start', 'end']
+   */
+  availableRangePositions?: RangePosition[];
+}
+export interface DateRangeCalendarOwnerState extends PickerOwnerState {
+  isDraggingDay: boolean;
+}
+export type DateRangeCalendarDefaultizedProps = DefaultizedProps<DateRangeCalendarProps, 'views' | 'openTo' | 'reduceAnimations' | 'calendars' | 'disableDragEditing' | 'availableRangePositions' | keyof BaseDateValidationProps>;

package/modern/DateRangeCalendar/dateRangeCalendarClasses.d.ts

@@ -0,0 +1,11 @@
+export interface DateRangeCalendarClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the container of a month. */
+  monthContainer: string;
+  /** Styles applied to the day calendar container when dragging */
+  dayDragging: string;
+}
+export type DateRangeCalendarClassKey = keyof DateRangeCalendarClasses;
+export declare const getDateRangeCalendarUtilityClass: (slot: string) => string;
+export declare const dateRangeCalendarClasses: DateRangeCalendarClasses;

package/modern/DateRangeCalendar/index.d.ts

@@ -0,0 +1,4 @@
+export { DateRangeCalendar } from "./DateRangeCalendar.js";
+export type { DateRangeCalendarProps, DateRangeCalendarSlots, DateRangeCalendarSlotProps, ExportedDateRangeCalendarProps } from './DateRangeCalendar.types';
+export { getDateRangeCalendarUtilityClass, dateRangeCalendarClasses } from "./dateRangeCalendarClasses.js";
+export type { DateRangeCalendarClassKey, DateRangeCalendarClasses } from './dateRangeCalendarClasses';

package/modern/DateRangeCalendar/useDragRange.d.ts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { MuiPickersAdapter, PickersTimezone, PickerValidDate } from '@mui/x-date-pickers/models';
+import { PickerRangeValue } from '@mui/x-date-pickers/internals';
+import { RangePosition } from "../models/index.js";
+interface UseDragRangeParams {
+  disableDragEditing?: boolean;
+  utils: MuiPickersAdapter;
+  setRangeDragDay: (value: PickerValidDate | null) => void;
+  setIsDragging: (value: boolean) => void;
+  isDragging: boolean;
+  onDatePositionChange: (position: RangePosition) => void;
+  onDrop: (newDate: PickerValidDate) => void;
+  dateRange: PickerRangeValue;
+  timezone: PickersTimezone;
+}
+interface UseDragRangeEvents {
+  onDragStart?: React.DragEventHandler<HTMLButtonElement>;
+  onDragEnter?: React.DragEventHandler<HTMLButtonElement>;
+  onDragLeave?: React.DragEventHandler<HTMLButtonElement>;
+  onDragOver?: React.DragEventHandler<HTMLButtonElement>;
+  onDragEnd?: React.DragEventHandler<HTMLButtonElement>;
+  onDrop?: React.DragEventHandler<HTMLButtonElement>;
+  onTouchStart?: React.TouchEventHandler<HTMLButtonElement>;
+  onTouchMove?: React.TouchEventHandler<HTMLButtonElement>;
+  onTouchEnd?: React.TouchEventHandler<HTMLButtonElement>;
+}
+interface UseDragRangeResponse extends UseDragRangeEvents {
+  isDragging: boolean;
+  rangeDragDay: PickerValidDate | null;
+  draggingDatePosition: RangePosition | null;
+}
+export declare const useDragRange: ({
+  disableDragEditing,
+  utils,
+  onDatePositionChange,
+  onDrop,
+  dateRange,
+  timezone
+}: Omit<UseDragRangeParams, "setRangeDragDay" | "setIsDragging" | "isDragging">) => UseDragRangeResponse;
+export {};

package/modern/DateRangePicker/DateRangePicker.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { DateRangePickerProps } from "./DateRangePicker.types.js";
+type DatePickerComponent = (<TEnableAccessibleFieldDOMStructure extends boolean = true>(props: DateRangePickerProps<TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+  propTypes?: any;
+};
+/**
+ * Demos:
+ *
+ * - [DateRangePicker](https://mui.com/x/react-date-pickers/date-range-picker/)
+ * - [Validation](https://mui.com/x/react-date-pickers/validation/)
+ *
+ * API:
+ *
+ * - [DateRangePicker API](https://mui.com/x/api/date-pickers/date-range-picker/)
+ */
+declare const DateRangePicker: DatePickerComponent;
+export { DateRangePicker };

package/modern/DateRangePicker/DateRangePicker.types.d.ts

@@ -0,0 +1,33 @@
+import { BaseSingleInputFieldProps } from '@mui/x-date-pickers/internals';
+import { DesktopDateRangePickerProps, DesktopDateRangePickerSlots, DesktopDateRangePickerSlotProps } from "../DesktopDateRangePicker/index.js";
+import { MobileDateRangePickerProps, MobileDateRangePickerSlots, MobileDateRangePickerSlotProps } from "../MobileDateRangePicker/index.js";
+import { ValidateDateRangeProps } from "../validation/index.js";
+export interface DateRangePickerSlots extends DesktopDateRangePickerSlots, MobileDateRangePickerSlots {}
+export interface DateRangePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends DesktopDateRangePickerSlotProps<TEnableAccessibleFieldDOMStructure>, MobileDateRangePickerSlotProps<TEnableAccessibleFieldDOMStructure> {}
+export interface DateRangePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends DesktopDateRangePickerProps<TEnableAccessibleFieldDOMStructure>, MobileDateRangePickerProps<TEnableAccessibleFieldDOMStructure> {
+  /**
+   * CSS media query when `Mobile` mode will be changed to `Desktop`.
+   * @default '@media (pointer: fine)'
+   * @example '@media (min-width: 720px)' or theme.breakpoints.up("sm")
+   */
+  desktopModeMediaQuery?: string;
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: DateRangePickerSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: DateRangePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
+  /**
+   * If `true`, the Picker will close after submitting the full date.
+   * @default `true` for desktop, `false` for mobile (based on the chosen wrapper and `desktopModeMediaQuery` prop).
+   */
+  closeOnSelect?: boolean;
+}
+/**
+ * Props the field can receive when used inside a date range picker (<DateRangePicker />, <DesktopDateRangePicker /> or <MobileDateRangePicker /> component).
+ */
+export type DateRangePickerFieldProps = ValidateDateRangeProps & BaseSingleInputFieldProps;

package/modern/DateRangePicker/DateRangePickerToolbar.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import { BaseToolbarProps, ExportedBaseToolbarProps } from '@mui/x-date-pickers/internals';
+import { DateRangePickerToolbarClasses } from "./dateRangePickerToolbarClasses.js";
+export interface DateRangePickerToolbarProps extends ExportedDateRangePickerToolbarProps, Omit<BaseToolbarProps, 'onChange' | 'isLandscape'> {}
+export interface ExportedDateRangePickerToolbarProps extends ExportedBaseToolbarProps {
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<DateRangePickerToolbarClasses>;
+}
+type DateRangePickerToolbarComponent = ((props: DateRangePickerToolbarProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+  propTypes?: any;
+};
+/**
+ * Demos:
+ *
+ * - [DateRangePicker](https://mui.com/x/react-date-pickers/date-range-picker/)
+ * - [Custom components](https://mui.com/x/react-date-pickers/custom-components/)
+ *
+ * API:
+ *
+ * - [DateRangePickerToolbar API](https://mui.com/x/api/date-pickers/date-range-picker-toolbar/)
+ */
+declare const DateRangePickerToolbar: DateRangePickerToolbarComponent;
+export { DateRangePickerToolbar };

package/modern/DateRangePicker/dateRangePickerToolbarClasses.d.ts

@@ -0,0 +1,9 @@
+export interface DateRangePickerToolbarClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the container element. */
+  container: string;
+}
+export type DateRangePickerToolbarClassKey = keyof DateRangePickerToolbarClasses;
+export declare function getDateRangePickerToolbarUtilityClass(slot: string): string;
+export declare const dateRangePickerToolbarClasses: DateRangePickerToolbarClasses;

package/modern/DateRangePicker/index.d.ts

@@ -0,0 +1,6 @@
+export { DateRangePicker } from "./DateRangePicker.js";
+export type { DateRangePickerProps, DateRangePickerSlots, DateRangePickerSlotProps, DateRangePickerFieldProps } from './DateRangePicker.types';
+export { DateRangePickerToolbar } from "./DateRangePickerToolbar.js";
+export type { DateRangePickerToolbarProps } from './DateRangePickerToolbar';
+export { getDateRangePickerToolbarUtilityClass, dateRangePickerToolbarClasses } from "./dateRangePickerToolbarClasses.js";
+export type { DateRangePickerToolbarClasses, DateRangePickerToolbarClassKey } from './dateRangePickerToolbarClasses';

package/modern/DateRangePicker/shared.d.ts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { DefaultizedProps } from '@mui/x-internals/types';
+import { LocalizedComponent } from '@mui/x-date-pickers/locales';
+import { BasePickerInputProps, PickerViewRendererLookup, PickerRangeValue } from '@mui/x-date-pickers/internals';
+import { DateRangeValidationError } from "../models/index.js";
+import { DateRangeCalendarSlots, DateRangeCalendarSlotProps, ExportedDateRangeCalendarProps } from "../DateRangeCalendar/index.js";
+import { DateRangePickerToolbarProps, ExportedDateRangePickerToolbarProps } from "./DateRangePickerToolbar.js";
+import { DateRangeViewRendererProps } from "../dateRangeViewRenderers/index.js";
+import { ValidateDateRangePropsToDefault } from "../validation/validateDateRange.js";
+export interface BaseDateRangePickerSlots extends DateRangeCalendarSlots {
+  /**
+   * Custom component for the toolbar rendered above the views.
+   * @default DateTimePickerToolbar
+   */
+  toolbar?: React.JSXElementConstructor<DateRangePickerToolbarProps>;
+}
+export interface BaseDateRangePickerSlotProps extends DateRangeCalendarSlotProps {
+  toolbar?: ExportedDateRangePickerToolbarProps;
+}
+export interface BaseDateRangePickerProps extends Omit<BasePickerInputProps<PickerRangeValue, 'day', DateRangeValidationError>, 'view' | 'views' | 'openTo' | 'onViewChange' | 'orientation'>, ExportedDateRangeCalendarProps {
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: BaseDateRangePickerSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: BaseDateRangePickerSlotProps;
+  /**
+   * Define custom view renderers for each section.
+   * If `null`, the section will only have field editing.
+   * If `undefined`, internally defined view will be used.
+   */
+  viewRenderers?: Partial<PickerViewRendererLookup<PickerRangeValue, 'day', DateRangeViewRendererProps<'day'>>>;
+}
+type UseDateRangePickerDefaultizedProps<Props extends BaseDateRangePickerProps> = LocalizedComponent<DefaultizedProps<Props, ValidateDateRangePropsToDefault>>;
+export declare function useDateRangePickerDefaultizedProps<Props extends BaseDateRangePickerProps>(props: Props, name: string): UseDateRangePickerDefaultizedProps<Props>;
+export {};

package/modern/DateRangePickerDay/DateRangePickerDay.d.ts

@@ -0,0 +1,54 @@
+import * as React from 'react';
+import { PickersDayProps } from '@mui/x-date-pickers/PickersDay';
+import { DateRangePickerDayClasses } from "./dateRangePickerDayClasses.js";
+export interface DateRangePickerDayProps extends Omit<PickersDayProps, 'classes' | 'onBlur' | 'onFocus' | 'onKeyDown'> {
+  /**
+   * Set to `true` if the `day` is in a highlighted date range.
+   */
+  isHighlighting: boolean;
+  /**
+   * Set to `true` if the `day` is the end of a highlighted date range.
+   */
+  isEndOfHighlighting: boolean;
+  /**
+   * Set to `true` if the `day` is the start of a highlighted date range.
+   */
+  isStartOfHighlighting: boolean;
+  /**
+   * Set to `true` if the `day` is in a preview date range.
+   */
+  isPreviewing: boolean;
+  /**
+   * Set to `true` if the `day` is the end of a previewing date range.
+   */
+  isEndOfPreviewing: boolean;
+  /**
+   * Set to `true` if the `day` is the start of a previewing date range.
+   */
+  isStartOfPreviewing: boolean;
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<DateRangePickerDayClasses>;
+  /**
+   * Indicates if the day should be visually selected.
+   */
+  isVisuallySelected?: boolean;
+  /**
+   * If `true`, the day can be dragged to change the current date range.
+   * @default false
+   */
+  draggable?: boolean;
+}
+type DateRangePickerDayComponent = (props: DateRangePickerDayProps & React.RefAttributes<HTMLButtonElement>) => React.JSX.Element;
+/**
+ * Demos:
+ *
+ * - [DateRangePicker](https://mui.com/x/react-date-pickers/date-range-picker/)
+ *
+ * API:
+ *
+ * - [DateRangePickerDay API](https://mui.com/x/api/date-pickers/date-range-picker-day/)
+ */
+export declare const DateRangePickerDay: DateRangePickerDayComponent;
+export {};