@mui/x-date-pickers-pro 8.3.1 → 8.5.0

package/CHANGELOG.md

@@ -5,6 +5,219 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 8.5.0
+
+_May 29, 2025_
+
+We'd like to offer a big thanks to the 13 contributors who made this release possible. Here are some highlights ✨:
+
+- 📊 Add support for exporting `RadarChartPro`, `FunnelChart` and `Heatmap` as image and PDF.
+- 📊 `RadarChart` is now stable.
+
+Special thanks go out to the community members for their valuable contributions:
+@xBlizZer, @sai6855, @alisasanib.
+Following are all team members who have contributed to this release:
+@alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @Janpot, @JCQuintas, @KenanYusuf, @LukasTy, @oliviertassinari.
+
+<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
+
+### Data Grid
+
+#### `@mui/x-data-grid@8.5.0`
+
+- [DataGrid] Avoid ResizeObserver loop error (#17984) @cherniavskii
+- [DataGrid] Fix column management `toggleColumn` event type (#18023) @KenanYusuf
+- [DataGrid] Remove unnecessary `any` type (#17979) @sai6855
+
+#### `@mui/x-data-grid-pro@8.5.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@8.5.0`, plus:
+
+- [DataGridPro] Allow multi sorting without modifier key (#17925) @cherniavskii
+- [DataGridPro] Row reordering icon improvements (#17947) @KenanYusuf
+- [DataGridPro] Fix pinned columns order in column management (#17950) @alisasanib
+
+#### `@mui/x-data-grid-premium@8.5.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@8.5.0`, plus:
+
+- [DataGridPremium] Export `GridApiPremium` type (#18037) @arminmeh
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@8.5.0`
+
+Internal changes.
+
+#### `@mui/x-date-pickers-pro@8.5.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@8.5.0`, plus:
+
+- [DateRangePicker] Allow to override the format in the field (#17972) @flaviendelangle
+
+### Charts
+
+#### `@mui/x-charts@8.5.0`
+
+- [charts] Add `render` prop to charts toolbar components (#17649) @bernardobelchior
+- [charts] Add configurable slots to toolbar (#17712) @bernardobelchior
+- [charts] Export `useFunnelSeries` and `useRadarSeries` (#18034) @JCQuintas
+- [charts] Expose `ChartApi` through context (#18004) @bernardobelchior
+- [charts] Mark Radar chart as stable (#17946) @alexfauquette
+- [charts] Only update store if interaction item is different (#17851) @bernardobelchior
+- [charts] Reuse shared date utils (#18014) @JCQuintas
+- [charts] Use Map for string cache instead of object (#17982) @bernardobelchior
+- [charts] Fix Population pyramid demo (#17987) @oliviertassinari
+
+#### `@mui/x-charts-pro@8.5.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@8.5.0`, plus:
+
+- [charts-pro] Add range selection to zoom slider (#17949) @bernardobelchior
+- [charts-pro] Allow configuring zoom slider tooltip (#18030) @bernardobelchior
+- [charts-pro] Allow exporting a funnel chart (#17957) @bernardobelchior
+- [charts-pro] Allow exporting a heatmap chart (#17916) @bernardobelchior
+- [charts-pro] Allow exporting a radar chart (#17968) @bernardobelchior
+- [charts-pro] Always show both zoom slider tooltips (#18027) @bernardobelchior
+- [charts-pro] Show zoom slider tooltip when selecting range (#18028) @bernardobelchior
+- [charts-pro] Split `ChartAxisZoomSlider` into smaller files (#18011) @bernardobelchior
+- [charts-pro] Update zoom slider range selection cursor (#17977) @bernardobelchior
+- [charts-pro] Add support for Heatmap legend (#17943) @alexfauquette
+
+### Tree View
+
+#### `@mui/x-tree-view@8.5.0`
+
+Internal changes.
+
+#### `@mui/x-tree-view-pro@8.5.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-tree-view@8.5.0`.
+
+### Docs
+
+- [docs] Fix derived column pivoting demo crash (#17944) @arminmeh
+- [docs] Fix light/dark mode blink on pickers overview (#18002) @alexfauquette
+- [docs] Fix scatter shape demo causing horizontal overflow (#17974) @bernardobelchior
+
+### Core
+
+- [code-infra] Add bundle size monitor (#17754) @Janpot
+- [code-infra] Enable `babel-plugin-display-name` in vitest (#17903) @JCQuintas
+- [infra] Remove last deprecated `ponyfillGlobal` usage (#18003) @LukasTy
+- [infra] Use `babel-plugin-display-name` from npm (#18040) @LukasTy
+- [x-telemetry] Remove deprecated `ponyfillGlobal` (#17986) @xBlizZer
+
+## 8.4.0
+
+_May 21, 2025_
+
+We'd like to offer a big thanks to the 21 contributors who made this release possible. Here are some highlights ✨:
+
+- 🔺 Support regular [`pyramid` variation in the `<FunnelChart />` component](https://mui.com/x/react-charts/funnel/#pyramid-chart):
+
+  <img width="398" alt="Pyramid funnel chart" src="https://github.com/user-attachments/assets/90ccb221-3a48-4ffa-8878-89c6db16da86" />
+
+- 📚 Documentation improvements
+- 🌎 Improve Icelandic (is-IS) locale on the Data Grid
+- 🐞 Bugfixes
+
+Special thanks go out to the community members for their valuable contributions:
+@aizerin, @arminmeh, @campmarc, @jyash97, @mapache-salvaje, @noraleonte, @nusr, @ragnarr18, @romgrk, @whereisrmsqhs.
+Following are all team members who have contributed to this release:
+@alexfauquette, @bernardobelchior, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi, @rita-codes.
+
+<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
+
+### Data Grid
+
+#### `@mui/x-data-grid@8.4.0`
+
+- [DataGrid] Fix content rendering for large rows while using automatic page size (#14737) @campmarc
+- [DataGrid] Fix disabled typography variants crashing grid (#17934) @KenanYusuf
+- [DataGrid] Fix tree data demo crash (#17904) @MBilalShafi
+- [DataGrid] Use `exclude` selection model type if quick filter does not have actual values (#17899) @arminmeh
+- [DataGrid] Fix clipboard copy behavior for cell ranges with empty cells (#16797) @nusr
+- [l10n] Improve Icelandic (is-IS) locale (#17915) @ragnarr18
+
+#### `@mui/x-data-grid-pro@8.4.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@8.4.0`, plus:
+
+- [DataGridPro] Add `aria-expanded` attribute to the master detail toggle button (#17122) @whereisrmsqhs
+- [DataGridPro] Preserve row state during server-side lazy loading (#17743) @arminmeh
+- [DataGridPro] Prevent text selection when reordering rows (#16568) @jyash97
+
+#### `@mui/x-data-grid-premium@8.4.0` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@8.4.0`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@8.4.0`
+
+- [fields] Ensure fresh `disabled` value is used when focusing or clicking (#17914) @aizerin
+- [fields] Improve the field controlled edition (#17816) @flaviendelangle
+- [pickers] Fix `PickersTextField` overflow (#17942) @noraleonte
+
+#### `@mui/x-date-pickers-pro@8.4.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@8.4.0`.
+
+### Charts
+
+#### `@mui/x-charts@8.4.0`
+
+- [charts] Add grouped axes demo (#17848) @bernardobelchior
+- [charts] Enable tooltip disable portal (#17871) @alexfauquette
+- [charts] Improve performance in scatter chart (#17849) @bernardobelchior
+- [charts] Recreate `isPointInside` less often (#17850) @bernardobelchior
+- [charts] Try fix for flaky `useAnimate` test (#17777) @JCQuintas
+- [charts] Add `isXInside` and `isYInside` (#17911) @bernardobelchior
+
+#### `@mui/x-charts-pro@8.4.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@8.4.0`, plus:
+
+- [charts-pro] Add size for zoom slider (#17736) @bernardobelchior
+- [charts-pro] Add zoom slider tooltip (#17733) @bernardobelchior
+- [charts-pro] Clean and document Heatmap Tooltip (#17933) @alexfauquette
+- [charts-pro] Introduce `Pyramid` chart (#17783) @JCQuintas
+- [charts-pro] Update zoom slider nomenclature (#17938) @bernardobelchior
+- [charts-pro] Fix error when importing rasterizehtml (#17897) @bernardobelchior
+
+### Tree View
+
+#### `@mui/x-tree-view@8.4.0`
+
+- [TreeView] Add `getItemChildren` prop in `RichTreeView` (#17894) @rita-codes
+- [TreeView] Add a method in the `apiRef` to toggle the editing status of an item (#17768) @rita-codes
+- [TreeView] Add missing sx prop on the Tree Item component (#17930) @flaviendelangle
+
+#### `@mui/x-tree-view-pro@8.4.0` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-tree-view@8.4.0`.
+
+### Docs
+
+- [docs] Add a recipe for drag and drop row grouping (#17638) @KenanYusuf
+- [docs] Add introductory text to Data Grid component pages (#17902) @KenanYusuf
+- [docs] Refactor embedded CodeSandbox on Data Grid—Quickstart page (#17749) @rita-codes
+- [docs] Remove double border on Data Grid—Quickstart demo (#17932) @rita-codes
+- [docs] Standardize `apiRef` copy (#17776) @mapache-salvaje
+- [docs][DataGrid] Revise server-side data docs (#17007) @mapache-salvaje
+- [docs][DataGrid] Audit and revise the tree data doc (#17650) @mapache-salvaje
+- [docs][pickers] Fix migration guide references to range fields (#17861) @LukasTy
+- [docs][charts] Reorganize the Tooltip documentation (#17917) @alexfauquette
+
+### Core
+
+- [core] refactor: remove manual `displayName` (#17845) @romgrk
+- [code-infra] Document how to use `vitest` cli (#17847) @JCQuintas
+- [code-infra] Increase charts export test timeout (#17909) @JCQuintas
+- [code-infra] Set `isolatedModules=true` in tsconfig (#17781) @JCQuintas
+- [infra] Ensure proper docs preview path resolution (#17863) @LukasTy
+
 ## 8.3.1
 
 _May 14, 2025_

package/DateRangeCalendar/DateRangeCalendar.js

@@ -35,7 +35,7 @@ var _useNullablePickerRangePositionContext = require("../internals/hooks/useNull
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["value", "defaultValue", "referenceDate", "onChange", "className", "classes", "disableFuture", "disablePast", "minDate", "maxDate", "shouldDisableDate", "reduceAnimations", "onMonthChange", "rangePosition", "defaultRangePosition", "onRangePositionChange", "calendars", "currentMonthCalendarPosition", "slots", "slotProps", "loading", "renderLoading", "disableHighlightToday", "focusedView", "onFocusedViewChange", "readOnly", "disabled", "showDaysOutsideCurrentMonth", "dayOfWeekFormatter", "disableAutoMonthSwitching", "autoFocus", "fixedWeekNumber", "disableDragEditing", "displayWeekNumber", "timezone", "availableRangePositions", "views", "view", "openTo", "onViewChange"],
   _excluded2 = ["isDragging", "rangeDragDay", "draggingDatePosition"];
-const releaseInfo = "MTc0NzE3MzYwMDAwMA==";
+const releaseInfo = "MTc0ODQ2OTYwMDAwMA==";
 const DateRangeCalendarRoot = (0, _styles.styled)('div', {
   name: 'MuiDateRangeCalendar',
   slot: 'Root'
@@ -513,6 +513,7 @@ const DateRangeCalendar = exports.DateRangeCalendar = /*#__PURE__*/React.forward
     })]
   }));
 });
+if (process.env.NODE_ENV !== "production") DateRangeCalendar.displayName = "DateRangeCalendar";
 process.env.NODE_ENV !== "production" ? DateRangeCalendar.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/DateRangeCalendar/DateRangeCalendar.types.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
-import { SlotComponentProps } from '@mui/utils';
+import { SlotComponentProps } from '@mui/utils/types';
 import { Theme } from '@mui/material/styles';
 import { DefaultizedProps } from '@mui/x-internals/types';
 import { PickerOwnerState, PickerValidDate, TimezoneProps } from '@mui/x-date-pickers/models';

package/DateRangeCalendar/dateRangeCalendarClasses.js

@@ -1,10 +1,12 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getDateRangeCalendarUtilityClass = exports.dateRangeCalendarClasses = void 0;
-var _utils = require("@mui/utils");
-const getDateRangeCalendarUtilityClass = slot => (0, _utils.unstable_generateUtilityClass)('MuiDateRangeCalendar', slot);
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+const getDateRangeCalendarUtilityClass = slot => (0, _generateUtilityClass.default)('MuiDateRangeCalendar', slot);
 exports.getDateRangeCalendarUtilityClass = getDateRangeCalendarUtilityClass;
-const dateRangeCalendarClasses = exports.dateRangeCalendarClasses = (0, _utils.unstable_generateUtilityClasses)('MuiDateRangeCalendar', ['root', 'monthContainer', 'dayDragging']);
+const dateRangeCalendarClasses = exports.dateRangeCalendarClasses = (0, _generateUtilityClasses.default)('MuiDateRangeCalendar', ['root', 'monthContainer', 'dayDragging']);

package/DateRangePicker/DateRangePicker.js

@@ -14,7 +14,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _useMediaQuery = _interopRequireDefault(require("@mui/material/useMediaQuery"));
 var _styles = require("@mui/material/styles");
 var _internals = require("@mui/x-date-pickers/internals");
-var _utils = require("@mui/utils");
+var _refType = _interopRequireDefault(require("@mui/utils/refType"));
 var _DesktopDateRangePicker = require("../DesktopDateRangePicker");
 var _MobileDateRangePicker = require("../MobileDateRangePicker");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -52,6 +52,7 @@ const DateRangePicker = exports.DateRangePicker = /*#__PURE__*/React.forwardRef(
     ref: ref
   }, other));
 });
+if (process.env.NODE_ENV !== "production") DateRangePicker.displayName = "DateRangePicker";
 process.env.NODE_ENV !== "production" ? DateRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -168,7 +169,7 @@ process.env.NODE_ENV !== "production" ? DateRangePicker.propTypes = {
   /**
    * Pass a ref to the `input` element.
    */
-  inputRef: _utils.refType,
+  inputRef: _refType.default,
   /**
    * The label content.
    */

package/DateRangePicker/DateRangePickerToolbar.js

@@ -103,6 +103,7 @@ const DateRangePickerToolbar = exports.DateRangePickerToolbar = /*#__PURE__*/Rea
     })
   }));
 });
+if (process.env.NODE_ENV !== "production") DateRangePickerToolbar.displayName = "DateRangePickerToolbar";
 process.env.NODE_ENV !== "production" ? DateRangePickerToolbar.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/DateRangePicker/dateRangePickerToolbarClasses.js

@@ -1,12 +1,14 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.dateRangePickerToolbarClasses = void 0;
 exports.getDateRangePickerToolbarUtilityClass = getDateRangePickerToolbarUtilityClass;
-var _utils = require("@mui/utils");
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
 function getDateRangePickerToolbarUtilityClass(slot) {
-  return (0, _utils.unstable_generateUtilityClass)('MuiDateRangePickerToolbar', slot);
+  return (0, _generateUtilityClass.default)('MuiDateRangePickerToolbar', slot);
 }
-const dateRangePickerToolbarClasses = exports.dateRangePickerToolbarClasses = (0, _utils.unstable_generateUtilityClasses)('MuiDateRangePickerToolbar', ['root', 'container']);
+const dateRangePickerToolbarClasses = exports.dateRangePickerToolbarClasses = (0, _generateUtilityClasses.default)('MuiDateRangePickerToolbar', ['root', 'container']);

package/DateRangePickerDay/DateRangePickerDay.js

@@ -234,7 +234,7 @@ const DateRangePickerDayRaw = /*#__PURE__*/React.forwardRef(function DateRangePi
       showDaysOutsideCurrentMonth
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  (0, _xLicense.useLicenseVerifier)('x-date-pickers-pro', "MTc0NzE3MzYwMDAwMA==");
+  (0, _xLicense.useLicenseVerifier)('x-date-pickers-pro', "MTc0ODQ2OTYwMDAwMA==");
   const utils = (0, _internals.useUtils)();
   const shouldRenderHighlight = isHighlighting && !outsideCurrentMonth;
   const shouldRenderPreview = isPreviewing && !outsideCurrentMonth;
@@ -292,6 +292,7 @@ const DateRangePickerDayRaw = /*#__PURE__*/React.forwardRef(function DateRangePi
     })
   });
 });
+if (process.env.NODE_ENV !== "production") DateRangePickerDayRaw.displayName = "DateRangePickerDayRaw";
 process.env.NODE_ENV !== "production" ? DateRangePickerDayRaw.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -474,4 +475,5 @@ process.env.NODE_ENV !== "production" ? DateRangePickerDayRaw.propTypes = {
  *
  * - [DateRangePickerDay API](https://mui.com/x/api/date-pickers/date-range-picker-day/)
  */
-const DateRangePickerDay = exports.DateRangePickerDay = /*#__PURE__*/React.memo(DateRangePickerDayRaw);
+const DateRangePickerDay = exports.DateRangePickerDay = /*#__PURE__*/React.memo(DateRangePickerDayRaw);
+if (process.env.NODE_ENV !== "production") DateRangePickerDay.displayName = "DateRangePickerDay";

package/DateRangePickerDay/dateRangePickerDayClasses.js

@@ -1,12 +1,14 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.dateRangePickerDayClasses = void 0;
 exports.getDateRangePickerDayUtilityClass = getDateRangePickerDayUtilityClass;
-var _utils = require("@mui/utils");
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
 function getDateRangePickerDayUtilityClass(slot) {
-  return (0, _utils.unstable_generateUtilityClass)('MuiDateRangePickerDay', slot);
+  return (0, _generateUtilityClass.default)('MuiDateRangePickerDay', slot);
 }
-const dateRangePickerDayClasses = exports.dateRangePickerDayClasses = (0, _utils.unstable_generateUtilityClasses)('MuiDateRangePickerDay', ['root', 'rangeIntervalDayHighlight', 'rangeIntervalDayHighlightStart', 'rangeIntervalDayHighlightEnd', 'rangeIntervalPreview', 'rangeIntervalDayPreview', 'rangeIntervalDayPreviewStart', 'rangeIntervalDayPreviewEnd', 'outsideCurrentMonth', 'startOfMonth', 'endOfMonth', 'firstVisibleCell', 'lastVisibleCell', 'hiddenDayFiller', 'day', 'dayOutsideRangeInterval', 'dayInsideRangeInterval', 'notSelectedDate']);
+const dateRangePickerDayClasses = exports.dateRangePickerDayClasses = (0, _generateUtilityClasses.default)('MuiDateRangePickerDay', ['root', 'rangeIntervalDayHighlight', 'rangeIntervalDayHighlightStart', 'rangeIntervalDayHighlightEnd', 'rangeIntervalPreview', 'rangeIntervalDayPreview', 'rangeIntervalDayPreviewStart', 'rangeIntervalDayPreviewEnd', 'outsideCurrentMonth', 'startOfMonth', 'endOfMonth', 'firstVisibleCell', 'lastVisibleCell', 'hiddenDayFiller', 'day', 'dayOutsideRangeInterval', 'dayInsideRangeInterval', 'notSelectedDate']);

package/DateTimeRangePicker/DateTimeRangePicker.js

@@ -11,7 +11,7 @@ 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 _utils = require("@mui/utils");
+var _refType = _interopRequireDefault(require("@mui/utils/refType"));
 var _useMediaQuery = _interopRequireDefault(require("@mui/material/useMediaQuery"));
 var _styles = require("@mui/material/styles");
 var _internals = require("@mui/x-date-pickers/internals");
@@ -52,6 +52,7 @@ const DateTimeRangePicker = exports.DateTimeRangePicker = /*#__PURE__*/React.for
     ref: ref
   }, other));
 });
+if (process.env.NODE_ENV !== "production") DateTimeRangePicker.displayName = "DateTimeRangePicker";
 process.env.NODE_ENV !== "production" ? DateTimeRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -178,7 +179,7 @@ process.env.NODE_ENV !== "production" ? DateTimeRangePicker.propTypes = {
   /**
    * Pass a ref to the `input` element.
    */
-  inputRef: _utils.refType,
+  inputRef: _refType.default,
   /**
    * The label content.
    */

package/DateTimeRangePicker/DateTimeRangePickerTabs.js

@@ -164,6 +164,7 @@ const DateTimeRangePickerTabs = exports.DateTimeRangePickerTabs = function DateT
     })]
   });
 };
+if (process.env.NODE_ENV !== "production") DateTimeRangePickerTabs.displayName = "DateTimeRangePickerTabs";
 process.env.NODE_ENV !== "production" ? DateTimeRangePickerTabs.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/DateTimeRangePicker/DateTimeRangePickerToolbar.js

@@ -170,6 +170,7 @@ const DateTimeRangePickerToolbar = exports.DateTimeRangePickerToolbar = /*#__PUR
     })]
   }));
 });
+if (process.env.NODE_ENV !== "production") DateTimeRangePickerToolbar.displayName = "DateTimeRangePickerToolbar";
 process.env.NODE_ENV !== "production" ? DateTimeRangePickerToolbar.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/DateTimeRangePicker/dateTimeRangePickerToolbarClasses.js

@@ -1,12 +1,14 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.dateTimeRangePickerToolbarClasses = void 0;
 exports.getDateTimeRangePickerToolbarUtilityClass = getDateTimeRangePickerToolbarUtilityClass;
-var _utils = require("@mui/utils");
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
 function getDateTimeRangePickerToolbarUtilityClass(slot) {
-  return (0, _utils.unstable_generateUtilityClass)('MuiDateTimeRangePickerToolbar', slot);
+  return (0, _generateUtilityClass.default)('MuiDateTimeRangePickerToolbar', slot);
 }
-const dateTimeRangePickerToolbarClasses = exports.dateTimeRangePickerToolbarClasses = (0, _utils.unstable_generateUtilityClasses)('MuiDateTimeRangePickerToolbar', ['root', 'startToolbar', 'endToolbar']);
+const dateTimeRangePickerToolbarClasses = exports.dateTimeRangePickerToolbarClasses = (0, _generateUtilityClasses.default)('MuiDateTimeRangePickerToolbar', ['root', 'startToolbar', 'endToolbar']);

package/DesktopDateRangePicker/DesktopDateRangePicker.js

@@ -13,7 +13,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 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 _refType = _interopRequireDefault(require("@mui/utils/refType"));
 var _valueManagers = require("../internals/utils/valueManagers");
 var _shared = require("../DateRangePicker/shared");
 var _dateRangeViewRenderers = require("../dateRangeViewRenderers");
@@ -41,7 +41,8 @@ const DesktopDateRangePicker = exports.DesktopDateRangePicker = /*#__PURE__*/Rea
   const props = (0, _extends2.default)({}, defaultizedProps, {
     closeOnSelect: defaultizedProps.closeOnSelect ?? true,
     viewRenderers,
-    format: utils.formats.keyboardDate,
+    // TODO: Replace with resolveDateFormat() once we support month and year views
+    format: defaultizedProps.format ?? utils.formats.keyboardDate,
     calendars: defaultizedProps.calendars ?? 2,
     views: ['day'],
     openTo: 'day',
@@ -67,6 +68,7 @@ const DesktopDateRangePicker = exports.DesktopDateRangePicker = /*#__PURE__*/Rea
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") DesktopDateRangePicker.displayName = "DesktopDateRangePicker";
 DesktopDateRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -177,7 +179,7 @@ DesktopDateRangePicker.propTypes = {
   /**
    * Pass a ref to the `input` element.
    */
-  inputRef: _utils.refType,
+  inputRef: _refType.default,
   /**
    * The label content.
    */

package/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.js

@@ -14,7 +14,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 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 _refType = _interopRequireDefault(require("@mui/utils/refType"));
 var _timeViewRenderers = require("@mui/x-date-pickers/timeViewRenderers");
 var _MultiSectionDigitalClock = require("@mui/x-date-pickers/MultiSectionDigitalClock");
 var _Divider = _interopRequireDefault(require("@mui/material/Divider"));
@@ -86,6 +86,7 @@ const rendererInterceptor = function RendererInterceptor(props) {
     }))]
   });
 };
+if (process.env.NODE_ENV !== "production") rendererInterceptor.displayName = "rendererInterceptor";
 /**
  * Demos:
  *
@@ -146,6 +147,7 @@ const DesktopDateTimeRangePicker = exports.DesktopDateTimeRangePicker = /*#__PUR
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") DesktopDateTimeRangePicker.displayName = "DesktopDateTimeRangePicker";
 DesktopDateTimeRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -266,7 +268,7 @@ DesktopDateTimeRangePicker.propTypes = {
   /**
    * Pass a ref to the `input` element.
    */
-  inputRef: _utils.refType,
+  inputRef: _refType.default,
   /**
    * The label content.
    */

package/DesktopTimeRangePicker/DesktopTimeRangePicker.js

@@ -67,6 +67,7 @@ const rendererInterceptor = function RendererInterceptor(props) {
     viewRenderer: viewRenderer
   }));
 };
+if (process.env.NODE_ENV !== "production") rendererInterceptor.displayName = "rendererInterceptor";
 const DesktopTimeRangePicker = exports.DesktopTimeRangePicker = /*#__PURE__*/React.forwardRef(function DesktopTimeRangePicker(inProps, ref) {
   const utils = (0, _internals.useUtils)();
 
@@ -120,6 +121,7 @@ const DesktopTimeRangePicker = exports.DesktopTimeRangePicker = /*#__PURE__*/Rea
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") DesktopTimeRangePicker.displayName = "DesktopTimeRangePicker";
 DesktopTimeRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/MobileDateRangePicker/MobileDateRangePicker.js

@@ -13,7 +13,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 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 _refType = _interopRequireDefault(require("@mui/utils/refType"));
 var _valueManagers = require("../internals/utils/valueManagers");
 var _shared = require("../DateRangePicker/shared");
 var _dateRangeViewRenderers = require("../dateRangeViewRenderers");
@@ -40,7 +40,8 @@ const MobileDateRangePicker = exports.MobileDateRangePicker = /*#__PURE__*/React
   }, defaultizedProps.viewRenderers);
   const props = (0, _extends2.default)({}, defaultizedProps, {
     viewRenderers,
-    format: utils.formats.keyboardDate,
+    // TODO: Replace with resolveDateFormat() once we support month and year views
+    format: defaultizedProps.format ?? utils.formats.keyboardDate,
     // Force one calendar on mobile to avoid layout issues
     calendars: 1,
     // force current calendar position, since we only have one calendar
@@ -69,6 +70,7 @@ const MobileDateRangePicker = exports.MobileDateRangePicker = /*#__PURE__*/React
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") MobileDateRangePicker.displayName = "MobileDateRangePicker";
 MobileDateRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -174,7 +176,7 @@ MobileDateRangePicker.propTypes = {
   /**
    * Pass a ref to the `input` element.
    */
-  inputRef: _utils.refType,
+  inputRef: _refType.default,
   /**
    * The label content.
    */

package/MobileDateTimeRangePicker/MobileDateTimeRangePicker.js

@@ -11,7 +11,7 @@ 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 _utils = require("@mui/utils");
+var _refType = _interopRequireDefault(require("@mui/utils/refType"));
 var _internals = require("@mui/x-date-pickers/internals");
 var _validation = require("@mui/x-date-pickers/validation");
 var _resolveComponentProps = _interopRequireDefault(require("@mui/utils/resolveComponentProps"));
@@ -157,6 +157,7 @@ const MobileDateTimeRangePicker = exports.MobileDateTimeRangePicker = /*#__PURE_
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") MobileDateTimeRangePicker.displayName = "MobileDateTimeRangePicker";
 MobileDateTimeRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -272,7 +273,7 @@ MobileDateTimeRangePicker.propTypes = {
   /**
    * Pass a ref to the `input` element.
    */
-  inputRef: _utils.refType,
+  inputRef: _refType.default,
   /**
    * The label content.
    */

package/MobileTimeRangePicker/MobileTimeRangePicker.js

@@ -68,6 +68,7 @@ const rendererInterceptor = function rendererInterceptor(props) {
     viewRenderer: viewRenderer
   }));
 };
+if (process.env.NODE_ENV !== "production") rendererInterceptor.displayName = "rendererInterceptor";
 const MobileTimeRangePicker = exports.MobileTimeRangePicker = /*#__PURE__*/React.forwardRef(function MobileTimeRangePicker(inProps, ref) {
   const utils = (0, _internals.useUtils)();
 
@@ -110,6 +111,7 @@ const MobileTimeRangePicker = exports.MobileTimeRangePicker = /*#__PURE__*/React
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") MobileTimeRangePicker.displayName = "MobileTimeRangePicker";
 MobileTimeRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/PickersRangeCalendarHeader/PickersRangeCalendarHeader.js

@@ -82,6 +82,7 @@ const PickersRangeCalendarHeader = exports.PickersRangeCalendarHeader = /*#__PUR
     children: utils.formatByString(month, format ?? `${utils.formats.month} ${utils.formats.year}`)
   }));
 });
+if (process.env.NODE_ENV !== "production") PickersRangeCalendarHeader.displayName = "PickersRangeCalendarHeader";
 process.env.NODE_ENV !== "production" ? PickersRangeCalendarHeader.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/SingleInputDateRangeField/SingleInputDateRangeField.js

@@ -11,7 +11,7 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _styles = require("@mui/material/styles");
-var _utils = require("@mui/utils");
+var _refType = _interopRequireDefault(require("@mui/utils/refType"));
 var _icons = require("@mui/x-date-pickers/icons");
 var _internals = require("@mui/x-date-pickers/internals");
 var _useSingleInputDateRangeField = require("./useSingleInputDateRangeField");
@@ -50,6 +50,7 @@ const SingleInputDateRangeField = exports.SingleInputDateRangeField = /*#__PURE_
     defaultOpenPickerIcon: _icons.DateRangeIcon
   });
 });
+if (process.env.NODE_ENV !== "production") SingleInputDateRangeField.displayName = "SingleInputDateRangeField";
 SingleInputDateRangeField.fieldType = 'single-input';
 process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
   // ----------------------------- Warning --------------------------------
@@ -172,7 +173,7 @@ process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
   /**
    * Pass a ref to the `input` element.
    */
-  inputRef: _utils.refType,
+  inputRef: _refType.default,
   /**
    * The label content.
    */