@mui/x-date-pickers-pro 8.0.0-alpha.9 → 8.0.0-beta.1

package/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.types.d.ts

@@ -1,24 +1,22 @@
 import { MakeOptional } from '@mui/x-internals/types';
-import { UseDesktopRangePickerSlots, UseDesktopRangePickerSlotProps, DesktopRangeOnlyPickerProps } from '../internals/hooks/useDesktopRangePicker';
-import { BaseDateTimeRangePickerProps, BaseDateTimeRangePickerSlots, BaseDateTimeRangePickerSlotProps } from '../DateTimeRangePicker/shared';
-export interface DesktopDateTimeRangePickerSlots extends BaseDateTimeRangePickerSlots, MakeOptional<UseDesktopRangePickerSlots, 'field'> {
-}
-export interface DesktopDateTimeRangePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDateTimeRangePickerSlotProps, Omit<UseDesktopRangePickerSlotProps<TEnableAccessibleFieldDOMStructure>, 'tabs' | 'toolbar'> {
-}
+import { UseDesktopRangePickerSlots, UseDesktopRangePickerSlotProps, DesktopRangeOnlyPickerProps } from "../internals/hooks/useDesktopRangePicker/index.js";
+import { BaseDateTimeRangePickerProps, BaseDateTimeRangePickerSlots, BaseDateTimeRangePickerSlotProps } from "../DateTimeRangePicker/shared.js";
+export interface DesktopDateTimeRangePickerSlots extends BaseDateTimeRangePickerSlots, MakeOptional<UseDesktopRangePickerSlots, 'field'> {}
+export interface DesktopDateTimeRangePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseDateTimeRangePickerSlotProps, Omit<UseDesktopRangePickerSlotProps<TEnableAccessibleFieldDOMStructure>, 'tabs' | 'toolbar'> {}
 export interface DesktopDateTimeRangePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseDateTimeRangePickerProps, DesktopRangeOnlyPickerProps {
-    /**
-     * The number of calendars to render on **desktop**.
-     * @default 1
-     */
-    calendars?: 1 | 2 | 3;
-    /**
-     * Overridable component slots.
-     * @default {}
-     */
-    slots?: DesktopDateTimeRangePickerSlots;
-    /**
-     * The props used for each component slot.
-     * @default {}
-     */
-    slotProps?: DesktopDateTimeRangePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
-}
+  /**
+   * The number of calendars to render on **desktop**.
+   * @default 1
+   */
+  calendars?: 1 | 2 | 3;
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: DesktopDateTimeRangePickerSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: DesktopDateTimeRangePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
+}

package/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.types.js

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

package/DesktopDateTimeRangePicker/index.d.ts

@@ -1,2 +1,2 @@
-export { DesktopDateTimeRangePicker } from './DesktopDateTimeRangePicker';
-export type { DesktopDateTimeRangePickerProps, DesktopDateTimeRangePickerSlots, DesktopDateTimeRangePickerSlotProps, } from './DesktopDateTimeRangePicker.types';
+export { DesktopDateTimeRangePicker } from "./DesktopDateTimeRangePicker.js";
+export type { DesktopDateTimeRangePickerProps, DesktopDateTimeRangePickerSlots, DesktopDateTimeRangePickerSlotProps } from './DesktopDateTimeRangePicker.types';

package/DesktopDateTimeRangePicker/index.js

@@ -1 +1,12 @@
-export { DesktopDateTimeRangePicker } from "./DesktopDateTimeRangePicker.js";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "DesktopDateTimeRangePicker", {
+  enumerable: true,
+  get: function () {
+    return _DesktopDateTimeRangePicker.DesktopDateTimeRangePicker;
+  }
+});
+var _DesktopDateTimeRangePicker = require("./DesktopDateTimeRangePicker");

package/DesktopTimeRangePicker/DesktopTimeRangePicker.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { DesktopTimeRangePickerProps } from "./DesktopTimeRangePicker.types.js";
+type DesktopTimeRangePickerComponent = (<TEnableAccessibleFieldDOMStructure extends boolean = true>(props: DesktopTimeRangePickerProps<TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+  propTypes?: any;
+};
+declare const DesktopTimeRangePicker: DesktopTimeRangePickerComponent;
+export { DesktopTimeRangePicker };

package/{node/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.js → DesktopTimeRangePicker/DesktopTimeRangePicker.js}

@@ -6,29 +6,25 @@ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWild
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DesktopDateTimeRangePicker = void 0;
+exports.DesktopTimeRangePicker = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
+var _resolveComponentProps = _interopRequireDefault(require("@mui/utils/resolveComponentProps"));
 var _internals = require("@mui/x-date-pickers/internals");
 var _validation = require("@mui/x-date-pickers/validation");
-var _resolveComponentProps = _interopRequireDefault(require("@mui/utils/resolveComponentProps"));
-var _utils = require("@mui/utils");
-var _timeViewRenderers = require("@mui/x-date-pickers/timeViewRenderers");
 var _MultiSectionDigitalClock = require("@mui/x-date-pickers/MultiSectionDigitalClock");
-var _Divider = _interopRequireDefault(require("@mui/material/Divider"));
 var _DigitalClock = require("@mui/x-date-pickers/DigitalClock");
-var _DesktopDateTimePicker = require("@mui/x-date-pickers/DesktopDateTimePicker");
+var _timeViewRenderers = require("@mui/x-date-pickers/timeViewRenderers");
+var _PickersLayout = require("@mui/x-date-pickers/PickersLayout");
 var _valueManagers = require("../internals/utils/valueManagers");
-var _dateRangeViewRenderers = require("../dateRangeViewRenderers");
+var _shared = require("../TimeRangePicker/shared");
+var _SingleInputTimeRangeField = require("../SingleInputTimeRangeField");
 var _useDesktopRangePicker = require("../internals/hooks/useDesktopRangePicker");
-var _validation2 = require("../validation");
-var _shared = require("../DateTimeRangePicker/shared");
-var _MultiInputDateTimeRangeField = require("../MultiInputDateTimeRangeField");
-var _DateTimeRangePickerTimeWrapper = require("../DateTimeRangePicker/DateTimeRangePickerTimeWrapper");
+var _validateTimeRange = require("../validation/validateTimeRange");
 var _dimensions = require("../internals/constants/dimensions");
-var _hooks = require("../hooks");
+var _TimeRangePickerTimeWrapper = require("../TimeRangePicker/TimeRangePickerTimeWrapper");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["openTo"];
 const rendererInterceptor = function RendererInterceptor(props) {
@@ -37,110 +33,86 @@ const rendererInterceptor = function RendererInterceptor(props) {
     popperView,
     rendererProps
   } = props;
-  const {
-      openTo
-    } = rendererProps,
-    otherProps = (0, _objectWithoutPropertiesLoose2.default)(rendererProps, _excluded);
-  const {
-    rangePosition
-  } = (0, _hooks.usePickerRangePositionContext)();
+  const otherProps = (0, _objectWithoutPropertiesLoose2.default)(rendererProps, _excluded);
   const finalProps = (0, _extends2.default)({}, otherProps, {
-    focusedView: null,
     sx: [{
       [`&.${_MultiSectionDigitalClock.multiSectionDigitalClockClasses.root}`]: {
-        borderBottom: 0
+        [`.${_MultiSectionDigitalClock.multiSectionDigitalClockSectionClasses.root}`]: {
+          flex: 1
+        },
+        [`.${_MultiSectionDigitalClock.multiSectionDigitalClockSectionClasses.item}`]: {
+          width: 'auto',
+          // avoid layout shift when hovering over a section with default width
+          minWidth: _internals.MULTI_SECTION_CLOCK_SECTION_WIDTH
+        }
+      },
+      [`&.${_DigitalClock.digitalClockClasses.root} .${_DigitalClock.digitalClockClasses.item}`]: {
+        justifyContent: 'center'
       },
       [`&.${_MultiSectionDigitalClock.multiSectionDigitalClockClasses.root}, .${_MultiSectionDigitalClock.multiSectionDigitalClockSectionClasses.root}, &.${_DigitalClock.digitalClockClasses.root}`]: {
         maxHeight: _dimensions.RANGE_VIEW_HEIGHT
       }
     }]
   });
-  const isTimeViewActive = (0, _internals.isInternalTimeView)(popperView);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
-    children: [viewRenderers.day?.((0, _extends2.default)({}, rendererProps, {
-      availableRangePositions: [rangePosition],
-      view: !isTimeViewActive ? popperView : 'day',
-      views: rendererProps.views.filter(_internals.isDatePickerView),
-      sx: [{
-        gridColumn: 1
-      }, ...finalProps.sx]
-    })), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Divider.default, {
-      orientation: "vertical",
-      sx: {
-        gridColumn: 2
-      }
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_DateTimeRangePickerTimeWrapper.DateTimeRangePickerTimeWrapper, (0, _extends2.default)({}, finalProps, {
-      view: isTimeViewActive ? popperView : 'hours',
-      views: finalProps.views.filter(_internals.isInternalTimeView),
-      openTo: (0, _internals.isInternalTimeView)(openTo) ? openTo : 'hours',
-      viewRenderer: viewRenderers[isTimeViewActive ? popperView : 'hours'],
-      sx: [{
-        gridColumn: 3
-      }, ...finalProps.sx]
-    }))]
-  });
+  const viewRenderer = viewRenderers[popperView];
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TimeRangePickerTimeWrapper.TimeRangePickerTimeWrapper, (0, _extends2.default)({}, finalProps, {
+    view: popperView,
+    viewRenderer: viewRenderer
+  }));
 };
-/**
- * Demos:
- *
- * - [DateTimeRangePicker](https://mui.com/x/react-date-pickers/date-time-range-picker/)
- * - [Validation](https://mui.com/x/react-date-pickers/validation/)
- *
- * API:
- *
- * - [DesktopDateTimeRangePicker API](https://mui.com/x/api/date-pickers/desktop-date-time-range-picker/)
- */
-const DesktopDateTimeRangePicker = exports.DesktopDateTimeRangePicker = /*#__PURE__*/React.forwardRef(function DesktopDateTimeRangePicker(inProps, ref) {
+const DesktopTimeRangePicker = exports.DesktopTimeRangePicker = /*#__PURE__*/React.forwardRef(function DesktopTimeRangePicker(inProps, ref) {
   const utils = (0, _internals.useUtils)();
-  // Props with the default values common to all date time range pickers
-  const defaultizedProps = (0, _shared.useDateTimeRangePickerDefaultizedProps)(inProps, 'MuiDesktopDateTimeRangePicker');
+
+  // Props with the default values common to all time range pickers
+  const defaultizedProps = (0, _shared.useTimeRangePickerDefaultizedProps)(inProps, 'MuiDesktopTimeRangePicker');
   const renderTimeView = defaultizedProps.shouldRenderTimeInASingleColumn ? _timeViewRenderers.renderDigitalClockTimeView : _timeViewRenderers.renderMultiSectionDigitalClockTimeView;
   const viewRenderers = (0, _extends2.default)({
-    day: _dateRangeViewRenderers.renderDateRangeViewCalendar,
     hours: renderTimeView,
     minutes: renderTimeView,
     seconds: renderTimeView,
     meridiem: renderTimeView
   }, defaultizedProps.viewRenderers);
-
-  // Need to avoid adding the `meridiem` view when unexpected renderer is specified
   const shouldHoursRendererContainMeridiemView = viewRenderers.hours?.name === _timeViewRenderers.renderMultiSectionDigitalClockTimeView.name;
   const views = !shouldHoursRendererContainMeridiemView ? defaultizedProps.views.filter(view => view !== 'meridiem') : defaultizedProps.views;
   const props = (0, _extends2.default)({}, defaultizedProps, {
     views,
     viewRenderers,
-    format: (0, _internals.resolveDateTimeFormat)(utils, defaultizedProps, true),
-    // force true to correctly handle `renderTimeViewClock` as a renderer
     ampmInClock: true,
-    calendars: defaultizedProps.calendars ?? 1,
+    format: (0, _internals.resolveTimeFormat)(utils, defaultizedProps),
     slots: (0, _extends2.default)({
-      field: _MultiInputDateTimeRangeField.MultiInputDateTimeRangeField,
-      layout: _DesktopDateTimePicker.DesktopDateTimePickerLayout
+      field: _SingleInputTimeRangeField.SingleInputTimeRangeField
     }, defaultizedProps.slots),
     slotProps: (0, _extends2.default)({}, defaultizedProps.slotProps, {
-      field: ownerState => (0, _extends2.default)({}, (0, _resolveComponentProps.default)(defaultizedProps.slotProps?.field, ownerState), (0, _validation.extractValidationProps)(defaultizedProps), {
-        ref
-      }),
+      field: ownerState => (0, _extends2.default)({}, (0, _resolveComponentProps.default)(defaultizedProps.slotProps?.field, ownerState), (0, _validation.extractValidationProps)(defaultizedProps)),
       tabs: (0, _extends2.default)({
         hidden: true
       }, defaultizedProps.slotProps?.tabs),
       toolbar: (0, _extends2.default)({
         hidden: true
-      }, defaultizedProps.slotProps?.toolbar)
+      }, defaultizedProps.slotProps?.toolbar),
+      layout: (0, _extends2.default)({}, defaultizedProps.slotProps?.layout, {
+        sx: (0, _internals.mergeSx)(defaultizedProps.slotProps?.layout?.sx, {
+          // Allow content wrapper to take full width when shortcuts are not present
+          [`&:not(:has(.${_PickersLayout.pickersLayoutClasses.shortcuts})) .${_PickersLayout.pickersLayoutClasses.contentWrapper}`]: {
+            gridColumn: '1 /4'
+          }
+        })
+      })
     })
   });
   const {
     renderPicker
   } = (0, _useDesktopRangePicker.useDesktopRangePicker)({
+    ref,
     props,
     valueManager: _valueManagers.rangeValueManager,
-    valueType: 'date-time',
-    validator: _validation2.validateDateTimeRange,
+    valueType: 'time',
+    validator: _validateTimeRange.validateTimeRange,
     rendererInterceptor
   });
   return renderPicker();
 });
-DesktopDateTimeRangePicker.propTypes = {
+DesktopTimeRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "pnpm proptypes"  |
@@ -157,29 +129,12 @@ DesktopDateTimeRangePicker.propTypes = {
    * - the `input` element if there is a field rendered.
    */
   autoFocus: _propTypes.default.bool,
-  /**
-   * The number of calendars to render on **desktop**.
-   * @default 1
-   */
-  calendars: _propTypes.default.oneOf([1, 2, 3]),
   className: _propTypes.default.string,
   /**
    * If `true`, the Picker will close after submitting the full date.
    * @default false
    */
   closeOnSelect: _propTypes.default.bool,
-  /**
-   * Position the current month is rendered in.
-   * @default 1
-   */
-  currentMonthCalendarPosition: _propTypes.default.oneOf([1, 2, 3]),
-  /**
-   * Formats the day of week displayed in the calendar header.
-   * @param {PickerValidDate} date The date of the day of week provided by the adapter.
-   * @returns {string} The name to display.
-   * @default (date: PickerValidDate) => adapter.format(date, 'weekdayShort').charAt(0).toUpperCase()
-   */
-  dayOfWeekFormatter: _propTypes.default.func,
   /**
    * The initial position in the edited date range.
    * Used when the component is not controlled.
@@ -191,39 +146,25 @@ DesktopDateTimeRangePicker.propTypes = {
    * Used when the component is not controlled.
    */
   defaultValue: _propTypes.default.arrayOf(_propTypes.default.object),
-  /**
-   * If `true`, after selecting `start` date calendar will not automatically switch to the month of `end` date.
-   * @default false
-   */
-  disableAutoMonthSwitching: _propTypes.default.bool,
   /**
    * If `true`, the component is disabled.
    * When disabled, the value cannot be changed and no interaction is possible.
    * @default false
    */
   disabled: _propTypes.default.bool,
-  /**
-   * If `true`, editing dates by dragging is disabled.
-   * @default false
-   */
-  disableDragEditing: _propTypes.default.bool,
   /**
    * If `true`, disable values after the current date for date components, time for time components and both for date time components.
    * @default false
    */
   disableFuture: _propTypes.default.bool,
-  /**
-   * If `true`, today's date is rendering without highlighting with circle.
-   * @default false
-   */
-  disableHighlightToday: _propTypes.default.bool,
   /**
    * Do not ignore date part when validating min/max time.
    * @default false
    */
   disableIgnoringDatePartForTimeValidation: _propTypes.default.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).
+   * @deprecated Use the [field component](https://next.mui.com/x/react-date-pickers/fields/) instead.
    * @default false
    */
   disableOpenPicker: _propTypes.default.bool,
@@ -232,19 +173,10 @@ DesktopDateTimeRangePicker.propTypes = {
    * @default false
    */
   disablePast: _propTypes.default.bool,
-  /**
-   * If `true`, the week number will be display in the calendar.
-   */
-  displayWeekNumber: _propTypes.default.bool,
   /**
    * @default true
    */
   enableAccessibleFieldDOMStructure: _propTypes.default.any,
-  /**
-   * The day view will show as many weeks as needed after the end of the current month to match this value.
-   * Put it to 6 to have a fixed number of weeks in Gregorian calendars
-   */
-  fixedWeekNumber: _propTypes.default.number,
   /**
    * Format of the date when rendered in the input(s).
    * Defaults to localized format based on the used `views`.
@@ -258,48 +190,24 @@ DesktopDateTimeRangePicker.propTypes = {
   formatDensity: _propTypes.default.oneOf(['dense', 'spacious']),
   /**
    * Pass a ref to the `input` element.
-   * Ignored if the field has several inputs.
    */
-  inputRef: _utils.refType,
+  inputRef: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.shape({
+    current: _propTypes.default.object
+  })]),
   /**
    * The label content.
-   * Ignored if the field has several inputs.
    */
   label: _propTypes.default.node,
-  /**
-   * If `true`, calls `renderLoading` instead of rendering the day calendar.
-   * Can be used to preload information and show it in calendar.
-   * @default false
-   */
-  loading: _propTypes.default.bool,
   /**
    * Locale for components texts.
    * Allows overriding texts coming from `LocalizationProvider` and `theme`.
    */
   localeText: _propTypes.default.object,
-  /**
-   * Maximal selectable date.
-   * @default 2099-12-31
-   */
-  maxDate: _propTypes.default.object,
-  /**
-   * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`.
-   */
-  maxDateTime: _propTypes.default.object,
   /**
    * Maximal selectable time.
    * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
    */
   maxTime: _propTypes.default.object,
-  /**
-   * Minimal selectable date.
-   * @default 1900-01-01
-   */
-  minDate: _propTypes.default.object,
-  /**
-   * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`.
-   */
-  minDateTime: _propTypes.default.object,
   /**
    * Minimal selectable time.
    * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
@@ -312,7 +220,6 @@ DesktopDateTimeRangePicker.propTypes = {
   minutesStep: _propTypes.default.number,
   /**
    * Name attribute used by the `input` element in the Field.
-   * Ignored if the field has several inputs.
    */
   name: _propTypes.default.string,
   /**
@@ -346,11 +253,6 @@ DesktopDateTimeRangePicker.propTypes = {
    * @param {TValue} value The value associated with the error.
    */
   onError: _propTypes.default.func,
-  /**
-   * Callback fired on month change.
-   * @param {PickerValidDate} month The new month.
-   */
-  onMonthChange: _propTypes.default.func,
   /**
    * Callback fired when the popup requests to be opened.
    * Use in controlled mode (see `open`).
@@ -382,7 +284,7 @@ DesktopDateTimeRangePicker.propTypes = {
    * Used when the component view is not controlled.
    * Must be a valid option from `views` list.
    */
-  openTo: _propTypes.default.oneOf(['day', 'hours', 'minutes', 'seconds']),
+  openTo: _propTypes.default.oneOf(['hours', 'minutes', 'seconds']),
   /**
    * The position in the currently edited date range.
    * Used when the component position is controlled.
@@ -404,12 +306,6 @@ DesktopDateTimeRangePicker.propTypes = {
    * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`.
    */
   referenceDate: _propTypes.default.object,
-  /**
-   * Component rendered on the "day" view when `props.loading` is true.
-   * @returns {React.ReactNode} The node to render when loading.
-   * @default () => "..."
-   */
-  renderLoading: _propTypes.default.func,
   /**
    * The currently selected sections.
    * This prop accepts four formats:
@@ -420,16 +316,6 @@ DesktopDateTimeRangePicker.propTypes = {
    * If not provided, the selected sections will be handled internally.
    */
   selectedSections: _propTypes.default.oneOfType([_propTypes.default.oneOf(['all', 'day', 'empty', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'weekDay', 'year']), _propTypes.default.number]),
-  /**
-   * 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: _propTypes.default.func,
   /**
    * Disable specific time.
    * @param {PickerValidDate} value The value to check.
@@ -437,17 +323,6 @@ DesktopDateTimeRangePicker.propTypes = {
    * @returns {boolean} If `true` the time will be disabled.
    */
   shouldDisableTime: _propTypes.default.func,
-  /**
-   * If `true`, days outside the current month are rendered:
-   *
-   * - if `fixedWeekNumber` is defined, renders days to have the weeks requested.
-   *
-   * - if `fixedWeekNumber` is not defined, renders day to fill the first and last week of the current month.
-   *
-   * - ignored if `calendars` equals more than `1` on range pickers.
-   * @default false
-   */
-  showDaysOutsideCurrentMonth: _propTypes.default.bool,
   /**
    * If `true`, disabled digital clock items will not be rendered.
    * @default false
@@ -501,14 +376,13 @@ DesktopDateTimeRangePicker.propTypes = {
    * Used when the component view is controlled.
    * Must be a valid option from `views` list.
    */
-  view: _propTypes.default.oneOf(['day', 'hours', 'meridiem', 'minutes', 'seconds']),
+  view: _propTypes.default.oneOf(['hours', 'meridiem', 'minutes', 'seconds']),
   /**
    * Define custom view renderers for each section.
    * If `null`, the section will only have field editing.
-   * If `undefined`, internally defined view will be used.
+   * If `undefined`, internally defined view will be the used.
    */
   viewRenderers: _propTypes.default.shape({
-    day: _propTypes.default.func,
     hours: _propTypes.default.func,
     meridiem: _propTypes.default.func,
     minutes: _propTypes.default.func,
@@ -517,5 +391,5 @@ DesktopDateTimeRangePicker.propTypes = {
   /**
    * Available views.
    */
-  views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['day', 'hours', 'minutes', 'seconds']).isRequired)
+  views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['hours', 'minutes', 'seconds']).isRequired)
 };

package/DesktopTimeRangePicker/DesktopTimeRangePicker.types.d.ts

@@ -0,0 +1,18 @@
+import { MakeOptional } from '@mui/x-internals/types';
+import { DigitalTimePickerProps } from '@mui/x-date-pickers/internals';
+import { UseDesktopRangePickerSlots, UseDesktopRangePickerSlotProps, DesktopRangeOnlyPickerProps } from "../internals/hooks/useDesktopRangePicker/index.js";
+import { BaseTimeRangePickerProps, BaseTimeRangePickerSlots, BaseTimeRangePickerSlotProps } from "../TimeRangePicker/shared.js";
+export interface DesktopTimeRangePickerSlots extends BaseTimeRangePickerSlots, MakeOptional<UseDesktopRangePickerSlots, 'field'> {}
+export interface DesktopTimeRangePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends BaseTimeRangePickerSlotProps, Omit<UseDesktopRangePickerSlotProps<TEnableAccessibleFieldDOMStructure>, 'tabs' | 'toolbar'> {}
+export interface DesktopTimeRangePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends BaseTimeRangePickerProps, DesktopRangeOnlyPickerProps, DigitalTimePickerProps {
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: DesktopTimeRangePickerSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: DesktopTimeRangePickerSlotProps<TEnableAccessibleFieldDOMStructure>;
+}

package/DesktopTimeRangePicker/index.d.ts

@@ -0,0 +1,2 @@
+export { DesktopTimeRangePicker } from "./DesktopTimeRangePicker.js";
+export type { DesktopTimeRangePickerProps, DesktopTimeRangePickerSlots, DesktopTimeRangePickerSlotProps } from './DesktopTimeRangePicker.types';

package/DesktopTimeRangePicker/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "DesktopTimeRangePicker", {
+  enumerable: true,
+  get: function () {
+    return _DesktopTimeRangePicker.DesktopTimeRangePicker;
+  }
+});
+var _DesktopTimeRangePicker = require("./DesktopTimeRangePicker");

package/LocalizationProvider/index.d.ts

@@ -1 +1 @@
-export { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
+export { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';

package/LocalizationProvider/index.js

@@ -1 +1,12 @@
-export { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "LocalizationProvider", {
+  enumerable: true,
+  get: function () {
+    return _LocalizationProvider.LocalizationProvider;
+  }
+});
+var _LocalizationProvider = require("@mui/x-date-pickers/LocalizationProvider");

package/MobileDateRangePicker/MobileDateRangePicker.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { MobileDateRangePickerProps } from './MobileDateRangePicker.types';
+import { MobileDateRangePickerProps } from "./MobileDateRangePicker.types.js";
 type MobileDateRangePickerComponent = (<TEnableAccessibleFieldDOMStructure extends boolean = true>(props: MobileDateRangePickerProps<TEnableAccessibleFieldDOMStructure> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
-    propTypes?: any;
+  propTypes?: any;
 };
 /**
  * Demos:
@@ -14,4 +14,4 @@ type MobileDateRangePickerComponent = (<TEnableAccessibleFieldDOMStructure exten
  * - [MobileDateRangePicker API](https://mui.com/x/api/date-pickers/mobile-date-range-picker/)
  */
 declare const MobileDateRangePicker: MobileDateRangePickerComponent;
-export { MobileDateRangePicker };
+export { MobileDateRangePicker };