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

package/modern/DesktopDatePicker/DesktopDatePicker.types.d.ts

@@ -0,0 +1,28 @@
+import { MakeOptional } from '@mui/x-internals/types';
+import { UseDesktopPickerSlots, ExportedUseDesktopPickerSlotProps, DesktopOnlyPickerProps } from "../internals/hooks/useDesktopPicker/index.js";
+import { BaseDatePickerProps, BaseDatePickerSlots, BaseDatePickerSlotProps } from "../DatePicker/shared.js";
+import { ExportedYearCalendarProps } from "../YearCalendar/YearCalendar.types.js";
+export interface DesktopDatePickerSlots extends BaseDatePickerSlots, MakeOptional<UseDesktopPickerSlots, 'field' | 'openPickerIcon'> {}
+export interface DesktopDatePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDatePickerSlotProps, ExportedUseDesktopPickerSlotProps<TEnableAccessibleFieldDOMStructure> {}
+export interface DesktopDatePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseDatePickerProps, DesktopOnlyPickerProps, ExportedYearCalendarProps {
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: DesktopDatePickerSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: DesktopDatePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
+  /**
+   * Years rendered per row.
+   * @default 4
+   */
+  yearsPerRow?: 3 | 4;
+  /**
+   * If `true`, the Picker will close after submitting the full date.
+   * @default true
+   */
+  closeOnSelect?: boolean;
+}

package/modern/DesktopDatePicker/index.d.ts

@@ -0,0 +1,2 @@
+export { DesktopDatePicker } from "./DesktopDatePicker.js";
+export type { DesktopDatePickerProps, DesktopDatePickerSlots, DesktopDatePickerSlotProps } from './DesktopDatePicker.types';

package/modern/DesktopDateTimePicker/DesktopDateTimePicker.d.ts

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

package/modern/DesktopDateTimePicker/DesktopDateTimePicker.js

@@ -15,7 +15,7 @@ import { renderDateViewCalendar } from "../dateViewRenderers/dateViewRenderers.j
 import { useUtils } from "../internals/hooks/useUtils.js";
 import { validateDateTime, extractValidationProps } from "../validation/index.js";
 import { useDesktopPicker } from "../internals/hooks/useDesktopPicker/index.js";
-import { resolveDateTimeFormat, resolveTimeViewsResponse } from "../internals/utils/date-time-utils.js";
+import { resolveDateTimeFormat } from "../internals/utils/date-time-utils.js";
 import { renderDigitalClockTimeView, renderMultiSectionDigitalClockTimeView } from "../timeViewRenderers/index.js";
 import { multiSectionDigitalClockClasses, multiSectionDigitalClockSectionClasses } from "../MultiSectionDigitalClock/index.js";
 import { digitalClockClasses } from "../DigitalClock/index.js";
@@ -91,13 +91,7 @@ const DesktopDateTimePicker = /*#__PURE__*/React.forwardRef(function DesktopDate
 
   // Props with the default values common to all date time pickers
   const defaultizedProps = useDateTimePickerDefaultizedProps(inProps, 'MuiDesktopDateTimePicker');
-  const {
-    shouldRenderTimeInASingleColumn,
-    thresholdToRenderTimeInASingleColumn,
-    views: resolvedViews,
-    timeSteps
-  } = resolveTimeViewsResponse(defaultizedProps);
-  const renderTimeView = shouldRenderTimeInASingleColumn ? renderDigitalClockTimeView : renderMultiSectionDigitalClockTimeView;
+  const renderTimeView = defaultizedProps.shouldRenderTimeInASingleColumn ? renderDigitalClockTimeView : renderMultiSectionDigitalClockTimeView;
   const viewRenderers = _extends({
     day: renderDateViewCalendar,
     month: renderDateViewCalendar,
@@ -110,7 +104,7 @@ const DesktopDateTimePicker = /*#__PURE__*/React.forwardRef(function DesktopDate
   const ampmInClock = defaultizedProps.ampmInClock ?? true;
   // Need to avoid adding the `meridiem` view when unexpected renderer is specified
   const shouldHoursRendererContainMeridiemView = viewRenderers.hours?.name === renderMultiSectionDigitalClockTimeView.name;
-  const views = !shouldHoursRendererContainMeridiemView ? resolvedViews.filter(view => view !== 'meridiem') : resolvedViews;
+  const views = !shouldHoursRendererContainMeridiemView ? defaultizedProps.views.filter(view => view !== 'meridiem') : defaultizedProps.views;
 
   // Props with the default values specific to the desktop variant
   const props = _extends({}, defaultizedProps, {
@@ -119,17 +113,12 @@ const DesktopDateTimePicker = /*#__PURE__*/React.forwardRef(function DesktopDate
     views,
     yearsPerRow: defaultizedProps.yearsPerRow ?? 4,
     ampmInClock,
-    timeSteps,
-    thresholdToRenderTimeInASingleColumn,
-    shouldRenderTimeInASingleColumn,
     slots: _extends({
       field: DateTimeField,
       layout: DesktopDateTimePickerLayout
     }, defaultizedProps.slots),
     slotProps: _extends({}, defaultizedProps.slotProps, {
-      field: ownerState => _extends({}, resolveComponentProps(defaultizedProps.slotProps?.field, ownerState), extractValidationProps(defaultizedProps), {
-        ref
-      }),
+      field: ownerState => _extends({}, resolveComponentProps(defaultizedProps.slotProps?.field, ownerState), extractValidationProps(defaultizedProps)),
       toolbar: _extends({
         hidden: true,
         ampmInClock
@@ -142,6 +131,7 @@ const DesktopDateTimePicker = /*#__PURE__*/React.forwardRef(function DesktopDate
   const {
     renderPicker
   } = useDesktopPicker({
+    ref,
     props,
     valueManager: singleItemValueManager,
     valueType: 'date-time',
@@ -212,7 +202,7 @@ DesktopDateTimePicker.propTypes = {
    */
   disableIgnoringDatePartForTimeValidation: PropTypes.bool,
   /**
-   * If `true`, the open picker button will not be rendered (renders only the field).
+   * If `true`, the button to open the Picker will not be rendered (it will only render the field).
    * @default false
    */
   disableOpenPicker: PropTypes.bool,

package/modern/DesktopDateTimePicker/DesktopDateTimePicker.types.d.ts

@@ -0,0 +1,29 @@
+import { MakeOptional } from '@mui/x-internals/types';
+import { UseDesktopPickerSlots, ExportedUseDesktopPickerSlotProps, DesktopOnlyPickerProps } from "../internals/hooks/useDesktopPicker/index.js";
+import { BaseDateTimePickerProps, BaseDateTimePickerSlots, BaseDateTimePickerSlotProps } from "../DateTimePicker/shared.js";
+import { DateOrTimeView } from "../models/index.js";
+import { DigitalTimePickerProps } from "../internals/models/props/time.js";
+import { ExportedYearCalendarProps } from "../YearCalendar/YearCalendar.types.js";
+export interface DesktopDateTimePickerSlots extends BaseDateTimePickerSlots, MakeOptional<UseDesktopPickerSlots, 'field' | 'openPickerIcon'> {}
+export interface DesktopDateTimePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDateTimePickerSlotProps, ExportedUseDesktopPickerSlotProps<TEnableAccessibleFieldDOMStructure> {}
+export interface DesktopDateTimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseDateTimePickerProps, DesktopOnlyPickerProps, DigitalTimePickerProps, ExportedYearCalendarProps {
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: DesktopDateTimePickerSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: DesktopDateTimePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
+  /**
+   * Available views.
+   */
+  views?: readonly DateOrTimeView[];
+  /**
+   * Years rendered per row.
+   * @default 4
+   */
+  yearsPerRow?: 3 | 4;
+}

package/modern/DesktopDateTimePicker/DesktopDateTimePickerLayout.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { PickersLayoutProps } from "../PickersLayout/index.js";
+import { PickerValidValue } from "../internals/models/index.js";
+type DesktopDateTimePickerLayoutComponent = (<TValue extends PickerValidValue>(props: PickersLayoutProps<TValue> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+  propTypes?: any;
+};
+/**
+ * @ignore - internal component.
+ */
+declare const DesktopDateTimePickerLayout: DesktopDateTimePickerLayoutComponent;
+export { DesktopDateTimePickerLayout };

package/modern/DesktopDateTimePicker/index.d.ts

@@ -0,0 +1,3 @@
+export { DesktopDateTimePicker } from "./DesktopDateTimePicker.js";
+export { DesktopDateTimePickerLayout } from "./DesktopDateTimePickerLayout.js";
+export type { DesktopDateTimePickerProps, DesktopDateTimePickerSlots, DesktopDateTimePickerSlotProps } from './DesktopDateTimePicker.types';

package/modern/DesktopTimePicker/DesktopTimePicker.d.ts

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

package/modern/DesktopTimePicker/DesktopTimePicker.js

@@ -59,9 +59,7 @@ const DesktopTimePicker = /*#__PURE__*/React.forwardRef(function DesktopTimePick
       field: TimeField
     }, defaultizedProps.slots),
     slotProps: _extends({}, defaultizedProps.slotProps, {
-      field: ownerState => _extends({}, resolveComponentProps(defaultizedProps.slotProps?.field, ownerState), extractValidationProps(defaultizedProps), {
-        ref
-      }),
+      field: ownerState => _extends({}, resolveComponentProps(defaultizedProps.slotProps?.field, ownerState), extractValidationProps(defaultizedProps)),
       toolbar: _extends({
         hidden: true,
         ampmInClock
@@ -71,6 +69,7 @@ const DesktopTimePicker = /*#__PURE__*/React.forwardRef(function DesktopTimePick
   const {
     renderPicker
   } = useDesktopPicker({
+    ref,
     props,
     valueManager: singleItemValueManager,
     valueType: 'time',
@@ -128,7 +127,7 @@ DesktopTimePicker.propTypes = {
    */
   disableIgnoringDatePartForTimeValidation: PropTypes.bool,
   /**
-   * If `true`, the open picker button will not be rendered (renders only the field).
+   * If `true`, the button to open the Picker will not be rendered (it will only render the field).
    * @default false
    */
   disableOpenPicker: PropTypes.bool,

package/modern/DesktopTimePicker/DesktopTimePicker.types.d.ts

@@ -0,0 +1,26 @@
+import { MakeOptional } from '@mui/x-internals/types';
+import { UseDesktopPickerSlots, ExportedUseDesktopPickerSlotProps, DesktopOnlyPickerProps } from "../internals/hooks/useDesktopPicker/index.js";
+import { BaseTimePickerProps, BaseTimePickerSlots, BaseTimePickerSlotProps } from "../TimePicker/shared.js";
+import { TimeViewWithMeridiem } from "../internals/models/index.js";
+import { DigitalTimePickerProps } from "../internals/models/props/time.js";
+import { DigitalClockSlots, DigitalClockSlotProps } from "../DigitalClock/index.js";
+import { MultiSectionDigitalClockSlots, MultiSectionDigitalClockSlotProps } from "../MultiSectionDigitalClock/index.js";
+import { TimeView } from "../models/index.js";
+export interface DesktopTimePickerSlots extends BaseTimePickerSlots, MakeOptional<UseDesktopPickerSlots, 'field' | 'openPickerIcon'>, DigitalClockSlots, MultiSectionDigitalClockSlots {}
+export interface DesktopTimePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseTimePickerSlotProps, ExportedUseDesktopPickerSlotProps<TEnableAccessibleFieldDOMStructure>, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps {}
+export interface DesktopTimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseTimePickerProps<TimeViewWithMeridiem>, DesktopOnlyPickerProps, DigitalTimePickerProps {
+  /**
+   * Available views.
+   */
+  views?: readonly TimeView[];
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: DesktopTimePickerSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: DesktopTimePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
+}

package/modern/DesktopTimePicker/index.d.ts

@@ -0,0 +1,2 @@
+export { DesktopTimePicker } from "./DesktopTimePicker.js";
+export type { DesktopTimePickerProps, DesktopTimePickerSlots, DesktopTimePickerSlotProps } from './DesktopTimePicker.types';

package/modern/DigitalClock/DigitalClock.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { DigitalClockProps } from "./DigitalClock.types.js";
+export declare const DigitalClockItem: import("@emotion/styled").StyledComponent<import("@mui/material").MenuItemOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "style" | "dense" | "disabled" | "action" | "selected" | "autoFocus" | "className" | "tabIndex" | "children" | "sx" | "classes" | "disableGutters" | "divider" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+type DigitalClockComponent = ((props: DigitalClockProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+  propTypes?: any;
+};
+/**
+ * Demos:
+ *
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
+ * - [DigitalClock](https://mui.com/x/react-date-pickers/digital-clock/)
+ *
+ * API:
+ *
+ * - [DigitalClock API](https://mui.com/x/api/date-pickers/digital-clock/)
+ */
+export declare const DigitalClock: DigitalClockComponent;
+export {};

package/modern/DigitalClock/DigitalClock.js

@@ -20,7 +20,7 @@ import { PickerViewRoot } from "../internals/components/PickerViewRoot/index.js"
 import { getDigitalClockUtilityClass } from "./digitalClockClasses.js";
 import { useViews } from "../internals/hooks/useViews.js";
 import { DIGITAL_CLOCK_VIEW_HEIGHT } from "../internals/constants/dimensions.js";
-import { useControlledValueWithTimezone } from "../internals/hooks/useValueWithTimezone.js";
+import { useControlledValue } from "../internals/hooks/useControlledValue.js";
 import { singleItemValueManager } from "../internals/utils/valueManagers.js";
 import { useClockReferenceDate } from "../internals/hooks/useClockReferenceDate.js";
 import { getFocusedListItemIndex } from "../internals/utils/utils.js";
@@ -63,9 +63,10 @@ const DigitalClockList = styled(MenuList, {
 })({
   padding: 0
 });
-const DigitalClockItem = styled(MenuItem, {
+export const DigitalClockItem = styled(MenuItem, {
   name: 'MuiDigitalClock',
   slot: 'Item',
+  shouldForwardProp: prop => prop !== 'itemValue' && prop !== 'formattedValue',
   overridesResolver: (props, styles) => styles.item
 })(({
   theme
@@ -143,7 +144,7 @@ export const DigitalClock = /*#__PURE__*/React.forwardRef(function DigitalClock(
     value,
     handleValueChange: handleRawValueChange,
     timezone
-  } = useControlledValueWithTimezone({
+  } = useControlledValue({
     name: 'DigitalClock',
     timezone: timezoneProp,
     value: valueProp,
@@ -286,23 +287,27 @@ export const DigitalClock = /*#__PURE__*/React.forwardRef(function DigitalClock(
       className: classes.list,
       onKeyDown: handleKeyDown,
       children: timeOptions.map((option, index) => {
-        if (skipDisabled && isTimeDisabled(option)) {
+        const optionDisabled = isTimeDisabled(option);
+        if (skipDisabled && optionDisabled) {
           return null;
         }
         const isSelected = utils.isEqual(option, value);
         const formattedValue = utils.format(option, ampm ? 'fullTime12h' : 'fullTime24h');
-        const tabIndex = focusedOptionIndex === index || focusedOptionIndex === -1 && index === 0 ? 0 : -1;
+        const isFocused = focusedOptionIndex === index || focusedOptionIndex === -1 && index === 0;
+        const tabIndex = isFocused ? 0 : -1;
         return /*#__PURE__*/_jsx(ClockItem, _extends({
           onClick: () => !readOnly && handleItemSelect(option),
           selected: isSelected,
-          disabled: disabled || isTimeDisabled(option),
+          disabled: disabled || optionDisabled,
           disableRipple: readOnly,
           role: "option"
           // aria-readonly is not supported here and does not have any effect
           ,
           "aria-disabled": readOnly,
           "aria-selected": isSelected,
-          tabIndex: tabIndex
+          tabIndex: tabIndex,
+          itemValue: option,
+          formattedValue: formattedValue
         }, clockItemProps, {
           children: formattedValue
         }), `${option.valueOf()}-${formattedValue}`);

package/modern/DigitalClock/DigitalClock.types.d.ts

@@ -0,0 +1,54 @@
+import * as React from 'react';
+import { SlotComponentProps } from '@mui/utils';
+import MenuItem from '@mui/material/MenuItem';
+import { DigitalClockClasses } from "./digitalClockClasses.js";
+import { BaseClockProps, DigitalClockOnlyProps, ExportedBaseClockProps } from "../internals/models/props/time.js";
+import { PickerOwnerState, TimeView, PickerValidDate } from "../models/index.js";
+export interface ExportedDigitalClockProps extends ExportedBaseClockProps, DigitalClockOnlyProps {}
+export interface DigitalClockSlots {
+  /**
+   * Component responsible for rendering a single digital clock item.
+   * @default MenuItem from '@mui/material'
+   */
+  digitalClockItem?: React.JSXElementConstructor<DigitalClockItemProps>;
+}
+export interface DigitalClockSlotProps {
+  digitalClockItem?: SlotComponentProps<typeof MenuItem, {}, DigitalClockOwnerState>;
+}
+export interface DigitalClockProps extends ExportedDigitalClockProps, BaseClockProps<Extract<TimeView, 'hours'>> {
+  /**
+   * Available views.
+   * @default ['hours']
+   */
+  views?: readonly 'hours'[];
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<DigitalClockClasses>;
+  /**
+   * Overrideable component slots.
+   * @default {}
+   */
+  slots?: DigitalClockSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: DigitalClockSlotProps;
+}
+export interface DigitalClockOwnerState extends PickerOwnerState {
+  /**
+   * `true` if this is not the initial render of the digital clock.
+   */
+  hasDigitalClockAlreadyBeenRendered: boolean;
+}
+export interface DigitalClockItemProps {
+  itemValue: PickerValidDate;
+  formattedValue: string;
+  onClick: () => void;
+  selected: boolean;
+  disabled: boolean;
+  readOnly?: boolean;
+  tabIndex: number;
+  [x: `data-${string}`]: string;
+}

package/modern/DigitalClock/digitalClockClasses.d.ts

@@ -0,0 +1,11 @@
+export interface DigitalClockClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the list (by default: MenuList) element. */
+  list: string;
+  /** Styles applied to the list item (by default: MenuItem) element. */
+  item: string;
+}
+export type DigitalClockClassKey = keyof DigitalClockClasses;
+export declare function getDigitalClockUtilityClass(slot: string): string;
+export declare const digitalClockClasses: DigitalClockClasses;

package/modern/DigitalClock/index.d.ts

@@ -0,0 +1,4 @@
+export { DigitalClock, DigitalClockItem } from "./DigitalClock.js";
+export type { DigitalClockProps, DigitalClockSlots, DigitalClockSlotProps, ExportedDigitalClockProps, DigitalClockItemProps } from './DigitalClock.types';
+export { digitalClockClasses, getDigitalClockUtilityClass } from "./digitalClockClasses.js";
+export type { DigitalClockClasses, DigitalClockClassKey } from './digitalClockClasses';

package/modern/DigitalClock/index.js

@@ -1,2 +1,2 @@
-export { DigitalClock } from "./DigitalClock.js";
+export { DigitalClock, DigitalClockItem } from "./DigitalClock.js";
 export { digitalClockClasses, getDigitalClockUtilityClass } from "./digitalClockClasses.js";

package/modern/LocalizationProvider/LocalizationProvider.d.ts

@@ -0,0 +1,55 @@
+import * as React from 'react';
+import { AdapterFormats, MuiPickersAdapter, PickerValidDate } from "../models/index.js";
+import { PickersInputLocaleText } from "../locales/index.js";
+export interface MuiPickersAdapterContextValue {
+  defaultDates: {
+    minDate: PickerValidDate;
+    maxDate: PickerValidDate;
+  };
+  utils: MuiPickersAdapter;
+  localeText: PickersInputLocaleText | undefined;
+}
+export type MuiPickersAdapterContextNullableValue = { [K in keyof MuiPickersAdapterContextValue]: MuiPickersAdapterContextValue[K] | null };
+export declare const MuiPickersAdapterContext: React.Context<MuiPickersAdapterContextNullableValue | null>;
+export interface LocalizationProviderProps<TLocale> {
+  children?: React.ReactNode;
+  /**
+   * Date library adapter class function.
+   * @see See the localization provider {@link https://mui.com/x/react-date-pickers/getting-started/#setup-your-date-library-adapter date adapter setup section} for more details.
+   */
+  dateAdapter?: new (...args: any) => MuiPickersAdapter<TLocale>;
+  /** Formats that are used for any child pickers */
+  dateFormats?: Partial<AdapterFormats>;
+  /**
+   * Date library instance you are using, if it has some global overrides
+   * ```jsx
+   * dateLibInstance={momentTimeZone}
+   * ```
+   */
+  dateLibInstance?: any;
+  /**
+   * Locale for the date library you are using
+   */
+  adapterLocale?: TLocale;
+  /**
+   * Locale for components texts
+   */
+  localeText?: PickersInputLocaleText;
+}
+type LocalizationProviderComponent = (<TLocale>(props: LocalizationProviderProps<TLocale>) => React.JSX.Element) & {
+  propTypes?: any;
+};
+/**
+ * Demos:
+ *
+ * - [Date format and localization](https://mui.com/x/react-date-pickers/adapters-locale/)
+ * - [Calendar systems](https://mui.com/x/react-date-pickers/calendar-systems/)
+ * - [Translated components](https://mui.com/x/react-date-pickers/localization/)
+ * - [UTC and timezones](https://mui.com/x/react-date-pickers/timezone/)
+ *
+ * API:
+ *
+ * - [LocalizationProvider API](https://mui.com/x/api/date-pickers/localization-provider/)
+ */
+export declare const LocalizationProvider: LocalizationProviderComponent;
+export {};

package/modern/LocalizationProvider/LocalizationProvider.js

@@ -110,13 +110,11 @@ process.env.NODE_ENV !== "production" ? LocalizationProvider.propTypes = {
     dayOfMonth: PropTypes.string,
     dayOfMonthFull: PropTypes.string,
     fullDate: PropTypes.string,
-    fullTime: PropTypes.string,
     fullTime12h: PropTypes.string,
     fullTime24h: PropTypes.string,
     hours12h: PropTypes.string,
     hours24h: PropTypes.string,
     keyboardDate: PropTypes.string,
-    keyboardDateTime: PropTypes.string,
     keyboardDateTime12h: PropTypes.string,
     keyboardDateTime24h: PropTypes.string,
     meridiem: PropTypes.string,

package/modern/LocalizationProvider/index.d.ts

@@ -0,0 +1,2 @@
+export { LocalizationProvider, MuiPickersAdapterContext } from "./LocalizationProvider.js";
+export type { LocalizationProviderProps } from './LocalizationProvider';

package/modern/MobileDatePicker/MobileDatePicker.d.ts

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

package/modern/MobileDatePicker/MobileDatePicker.js

@@ -42,9 +42,7 @@ const MobileDatePicker = /*#__PURE__*/React.forwardRef(function MobileDatePicker
       field: DateField
     }, defaultizedProps.slots),
     slotProps: _extends({}, defaultizedProps.slotProps, {
-      field: ownerState => _extends({}, resolveComponentProps(defaultizedProps.slotProps?.field, ownerState), extractValidationProps(defaultizedProps), {
-        ref
-      }),
+      field: ownerState => _extends({}, resolveComponentProps(defaultizedProps.slotProps?.field, ownerState), extractValidationProps(defaultizedProps)),
       toolbar: _extends({
         hidden: false
       }, defaultizedProps.slotProps?.toolbar)
@@ -53,6 +51,7 @@ const MobileDatePicker = /*#__PURE__*/React.forwardRef(function MobileDatePicker
   const {
     renderPicker
   } = useMobilePicker({
+    ref,
     props,
     valueManager: singleItemValueManager,
     valueType: 'date',
@@ -107,7 +106,7 @@ MobileDatePicker.propTypes = {
    */
   disableHighlightToday: PropTypes.bool,
   /**
-   * If `true`, the open picker button will not be rendered (renders only the field).
+   * If `true`, the button to open the Picker will not be rendered (it will only render the field).
    * @default false
    */
   disableOpenPicker: PropTypes.bool,

package/modern/MobileDatePicker/MobileDatePicker.types.d.ts

@@ -0,0 +1,22 @@
+import { MakeOptional } from '@mui/x-internals/types';
+import { UseMobilePickerSlots, MobileOnlyPickerProps, ExportedUseMobilePickerSlotProps } from "../internals/hooks/useMobilePicker/index.js";
+import { BaseDatePickerProps, BaseDatePickerSlots, BaseDatePickerSlotProps } from "../DatePicker/shared.js";
+export interface MobileDatePickerSlots extends BaseDatePickerSlots, MakeOptional<UseMobilePickerSlots, 'field'> {}
+export interface MobileDatePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDatePickerSlotProps, ExportedUseMobilePickerSlotProps<TEnableAccessibleFieldDOMStructure> {}
+export interface MobileDatePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseDatePickerProps, MobileOnlyPickerProps {
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: MobileDatePickerSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: MobileDatePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
+  /**
+   * Years rendered per row.
+   * @default 3
+   */
+  yearsPerRow?: 3 | 4;
+}

package/modern/MobileDatePicker/index.d.ts

@@ -0,0 +1,2 @@
+export { MobileDatePicker } from "./MobileDatePicker.js";
+export type { MobileDatePickerProps, MobileDatePickerSlots, MobileDatePickerSlotProps } from './MobileDatePicker.types';

package/modern/MobileDateTimePicker/MobileDateTimePicker.d.ts

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