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

package/CHANGELOG.md

@@ -5,6 +5,116 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 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 = "MTc0Nzc3ODQwMDAwMA==";
 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/DateRangePicker/DateRangePicker.js

@@ -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 |

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/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', "MTc0Nzc3ODQwMDAwMA==");
   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/DateTimeRangePicker/DateTimeRangePicker.js

@@ -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 |

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/DesktopDateRangePicker/DesktopDateRangePicker.js

@@ -67,6 +67,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 |

package/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.js

@@ -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 |

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

@@ -69,6 +69,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 |

package/MobileDateTimeRangePicker/MobileDateTimeRangePicker.js

@@ -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 |

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

@@ -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 --------------------------------

package/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.js

@@ -50,6 +50,7 @@ const SingleInputDateTimeRangeField = exports.SingleInputDateTimeRangeField = /*
     defaultOpenPickerIcon: _icons.DateRangeIcon
   });
 });
+if (process.env.NODE_ENV !== "production") SingleInputDateTimeRangeField.displayName = "SingleInputDateTimeRangeField";
 SingleInputDateTimeRangeField.fieldType = 'single-input';
 process.env.NODE_ENV !== "production" ? SingleInputDateTimeRangeField.propTypes = {
   // ----------------------------- Warning --------------------------------

package/SingleInputTimeRangeField/SingleInputTimeRangeField.js

@@ -50,6 +50,7 @@ const SingleInputTimeRangeField = exports.SingleInputTimeRangeField = /*#__PURE_
     defaultOpenPickerIcon: _icons.ClockIcon
   });
 });
+if (process.env.NODE_ENV !== "production") SingleInputTimeRangeField.displayName = "SingleInputTimeRangeField";
 SingleInputTimeRangeField.fieldType = 'single-input';
 process.env.NODE_ENV !== "production" ? SingleInputTimeRangeField.propTypes = {
   // ----------------------------- Warning --------------------------------

package/StaticDateRangePicker/StaticDateRangePicker.js

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

package/TimeRangePicker/TimeRangePicker.js

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

package/TimeRangePicker/TimeRangePickerTabs.js

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

package/TimeRangePicker/TimeRangePickerToolbar.js

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

package/dateRangeViewRenderers/dateRangeViewRenderers.js

@@ -90,4 +90,5 @@ const renderDateRangeViewCalendar = ({
   timezone: timezone,
   availableRangePositions: availableRangePositions
 });
-exports.renderDateRangeViewCalendar = renderDateRangeViewCalendar;
+exports.renderDateRangeViewCalendar = renderDateRangeViewCalendar;
+if (process.env.NODE_ENV !== "production") renderDateRangeViewCalendar.displayName = "renderDateRangeViewCalendar";

package/esm/DateRangeCalendar/DateRangeCalendar.js

@@ -28,7 +28,7 @@ import { DAY_RANGE_SIZE, DAY_MARGIN } from "../internals/constants/dimensions.js
 import { PickersRangeCalendarHeader } from "../PickersRangeCalendarHeader/index.js";
 import { useNullablePickerRangePositionContext } from "../internals/hooks/useNullablePickerRangePositionContext.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const releaseInfo = "MTc0NzE3MzYwMDAwMA==";
+const releaseInfo = "MTc0Nzc3ODQwMDAwMA==";
 const DateRangeCalendarRoot = styled('div', {
   name: 'MuiDateRangeCalendar',
   slot: 'Root'
@@ -506,6 +506,7 @@ const DateRangeCalendar = /*#__PURE__*/React.forwardRef(function DateRangeCalend
     })]
   }));
 });
+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/esm/DateRangePicker/DateRangePicker.js

@@ -45,6 +45,7 @@ const DateRangePicker = /*#__PURE__*/React.forwardRef(function DateRangePicker(i
     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 |

package/esm/DateRangePicker/DateRangePickerToolbar.js

@@ -96,6 +96,7 @@ const DateRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateRangeP
     })
   }));
 });
+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/esm/DateRangePickerDay/DateRangePickerDay.js

@@ -227,7 +227,7 @@ const DateRangePickerDayRaw = /*#__PURE__*/React.forwardRef(function DateRangePi
       showDaysOutsideCurrentMonth
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
-  useLicenseVerifier('x-date-pickers-pro', "MTc0NzE3MzYwMDAwMA==");
+  useLicenseVerifier('x-date-pickers-pro', "MTc0Nzc3ODQwMDAwMA==");
   const utils = useUtils();
   const shouldRenderHighlight = isHighlighting && !outsideCurrentMonth;
   const shouldRenderPreview = isPreviewing && !outsideCurrentMonth;
@@ -285,6 +285,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 |
@@ -467,4 +468,5 @@ process.env.NODE_ENV !== "production" ? DateRangePickerDayRaw.propTypes = {
  *
  * - [DateRangePickerDay API](https://mui.com/x/api/date-pickers/date-range-picker-day/)
  */
-export const DateRangePickerDay = /*#__PURE__*/React.memo(DateRangePickerDayRaw);
+export const DateRangePickerDay = /*#__PURE__*/React.memo(DateRangePickerDayRaw);
+if (process.env.NODE_ENV !== "production") DateRangePickerDay.displayName = "DateRangePickerDay";

package/esm/DateTimeRangePicker/DateTimeRangePicker.js

@@ -45,6 +45,7 @@ const DateTimeRangePicker = /*#__PURE__*/React.forwardRef(function DateTimeRange
     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 |

package/esm/DateTimeRangePicker/DateTimeRangePickerTabs.js

@@ -157,6 +157,7 @@ const DateTimeRangePickerTabs = function DateTimeRangePickerTabs(inProps) {
     })]
   });
 };
+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/esm/DateTimeRangePicker/DateTimeRangePickerToolbar.js

@@ -163,6 +163,7 @@ const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTi
     })]
   }));
 });
+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/esm/DesktopDateRangePicker/DesktopDateRangePicker.js

@@ -60,6 +60,7 @@ const DesktopDateRangePicker = /*#__PURE__*/React.forwardRef(function DesktopDat
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") DesktopDateRangePicker.displayName = "DesktopDateRangePicker";
 DesktopDateRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.js

@@ -79,6 +79,7 @@ const rendererInterceptor = function RendererInterceptor(props) {
     }))]
   });
 };
+if (process.env.NODE_ENV !== "production") rendererInterceptor.displayName = "rendererInterceptor";
 /**
  * Demos:
  *
@@ -139,6 +140,7 @@ const DesktopDateTimeRangePicker = /*#__PURE__*/React.forwardRef(function Deskto
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") DesktopDateTimeRangePicker.displayName = "DesktopDateTimeRangePicker";
 DesktopDateTimeRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/DesktopTimeRangePicker/DesktopTimeRangePicker.js

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

package/esm/MobileDateRangePicker/MobileDateRangePicker.js

@@ -62,6 +62,7 @@ const MobileDateRangePicker = /*#__PURE__*/React.forwardRef(function MobileDateR
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") MobileDateRangePicker.displayName = "MobileDateRangePicker";
 MobileDateRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/MobileDateTimeRangePicker/MobileDateTimeRangePicker.js

@@ -150,6 +150,7 @@ const MobileDateTimeRangePicker = /*#__PURE__*/React.forwardRef(function MobileD
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") MobileDateTimeRangePicker.displayName = "MobileDateTimeRangePicker";
 MobileDateTimeRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/MobileTimeRangePicker/MobileTimeRangePicker.js

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

package/esm/PickersRangeCalendarHeader/PickersRangeCalendarHeader.js

@@ -75,6 +75,7 @@ const PickersRangeCalendarHeader = /*#__PURE__*/React.forwardRef(function Picker
     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/esm/SingleInputDateRangeField/SingleInputDateRangeField.js

@@ -43,6 +43,7 @@ const SingleInputDateRangeField = /*#__PURE__*/React.forwardRef(function SingleI
     defaultOpenPickerIcon: DateRangeIcon
   });
 });
+if (process.env.NODE_ENV !== "production") SingleInputDateRangeField.displayName = "SingleInputDateRangeField";
 SingleInputDateRangeField.fieldType = 'single-input';
 process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
   // ----------------------------- Warning --------------------------------

package/esm/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.js

@@ -43,6 +43,7 @@ const SingleInputDateTimeRangeField = /*#__PURE__*/React.forwardRef(function Sin
     defaultOpenPickerIcon: DateRangeIcon
   });
 });
+if (process.env.NODE_ENV !== "production") SingleInputDateTimeRangeField.displayName = "SingleInputDateTimeRangeField";
 SingleInputDateTimeRangeField.fieldType = 'single-input';
 process.env.NODE_ENV !== "production" ? SingleInputDateTimeRangeField.propTypes = {
   // ----------------------------- Warning --------------------------------

package/esm/SingleInputTimeRangeField/SingleInputTimeRangeField.js

@@ -43,6 +43,7 @@ const SingleInputTimeRangeField = /*#__PURE__*/React.forwardRef(function SingleI
     defaultOpenPickerIcon: ClockIcon
   });
 });
+if (process.env.NODE_ENV !== "production") SingleInputTimeRangeField.displayName = "SingleInputTimeRangeField";
 SingleInputTimeRangeField.fieldType = 'single-input';
 process.env.NODE_ENV !== "production" ? SingleInputTimeRangeField.propTypes = {
   // ----------------------------- Warning --------------------------------

package/esm/StaticDateRangePicker/StaticDateRangePicker.js

@@ -50,6 +50,7 @@ const StaticDateRangePicker = /*#__PURE__*/React.forwardRef(function StaticDateR
   });
   return renderPicker();
 });
+if (process.env.NODE_ENV !== "production") StaticDateRangePicker.displayName = "StaticDateRangePicker";
 StaticDateRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/TimeRangePicker/TimeRangePicker.js

@@ -45,6 +45,7 @@ const TimeRangePicker = /*#__PURE__*/React.forwardRef(function TimeRangePicker(i
     ref: ref
   }, other));
 });
+if (process.env.NODE_ENV !== "production") TimeRangePicker.displayName = "TimeRangePicker";
 process.env.NODE_ENV !== "production" ? TimeRangePicker.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/TimeRangePicker/TimeRangePickerTabs.js

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

package/esm/TimeRangePicker/TimeRangePickerToolbar.js

@@ -222,6 +222,7 @@ const TimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function TimeRangeP
     })
   }));
 });
+if (process.env.NODE_ENV !== "production") TimeRangePickerToolbar.displayName = "TimeRangePickerToolbar";
 process.env.NODE_ENV !== "production" ? TimeRangePickerToolbar.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |

package/esm/dateRangeViewRenderers/dateRangeViewRenderers.js

@@ -82,4 +82,5 @@ export const renderDateRangeViewCalendar = ({
   displayWeekNumber: displayWeekNumber,
   timezone: timezone,
   availableRangePositions: availableRangePositions
-});
+});
+if (process.env.NODE_ENV !== "production") renderDateRangeViewCalendar.displayName = "renderDateRangeViewCalendar";

package/esm/hooks/usePickerRangePositionContext.js

@@ -6,6 +6,7 @@ export const PickerRangePositionContext = /*#__PURE__*/React.createContext(null)
 /**
  * Returns information about the range position of the picker that wraps the current component.
  */
+if (process.env.NODE_ENV !== "production") PickerRangePositionContext.displayName = "PickerRangePositionContext";
 export function usePickerRangePositionContext() {
   const value = React.useContext(PickerRangePositionContext);
   if (value == null) {

package/esm/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers-pro v8.3.1
+ * @mui/x-date-pickers-pro v8.4.0
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/esm/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js

@@ -19,7 +19,7 @@ export const useDesktopRangePicker = _ref => {
       steps
     } = _ref,
     pickerParams = _objectWithoutPropertiesLoose(_ref, _excluded);
-  useLicenseVerifier('x-date-pickers-pro', "MTc0NzE3MzYwMDAwMA==");
+  useLicenseVerifier('x-date-pickers-pro', "MTc0Nzc3ODQwMDAwMA==");
   const {
     slots,
     slotProps,
@@ -76,6 +76,7 @@ export const useDesktopRangePicker = _ref => {
       })
     })
   }));
+  if (process.env.NODE_ENV !== "production") renderPicker.displayName = "renderPicker";
   return {
     renderPicker
   };

package/esm/internals/hooks/useMobileRangePicker/useMobileRangePicker.js

@@ -21,7 +21,7 @@ export const useMobileRangePicker = _ref => {
       steps
     } = _ref,
     pickerParams = _objectWithoutPropertiesLoose(_ref, _excluded);
-  useLicenseVerifier('x-date-pickers-pro', "MTc0NzE3MzYwMDAwMA==");
+  useLicenseVerifier('x-date-pickers-pro', "MTc0Nzc3ODQwMDAwMA==");
   const {
     slots,
     slotProps: innerSlotProps,
@@ -111,6 +111,7 @@ export const useMobileRangePicker = _ref => {
       })
     })
   }));
+  if (process.env.NODE_ENV !== "production") renderPicker.displayName = "renderPicker";
   return {
     renderPicker
   };

package/esm/internals/hooks/useStaticRangePicker/useStaticRangePicker.js

@@ -65,6 +65,7 @@ export const useStaticRangePicker = _ref => {
       }))
     }))
   });
+  if (process.env.NODE_ENV !== "production") renderPicker.displayName = "renderPicker";
   return {
     renderPicker
   };

package/esm/internals/utils/createMultiInputRangeField/createMultiInputRangeField.js

@@ -40,6 +40,7 @@ export function createMultiInputRangeField({
     name,
     slot: 'Root'
   })({});
+  if (process.env.NODE_ENV !== "production") MultiInputRangeFieldRoot.displayName = "MultiInputRangeFieldRoot";
   const MultiInputRangeFieldSeparator = styled(Typography, {
     name,
     slot: 'Separator'
@@ -126,6 +127,7 @@ export function createMultiInputRangeField({
       }, cleanEndTextFieldResponse.textFieldProps))]
     }));
   });
+  if (process.env.NODE_ENV !== "production") MultiInputRangeField.displayName = "MultiInputRangeField";
   MultiInputRangeField.fieldType = 'multi-input';
   return MultiInputRangeField;
 }

package/hooks/usePickerRangePositionContext.js

@@ -13,6 +13,7 @@ const PickerRangePositionContext = exports.PickerRangePositionContext = /*#__PUR
 /**
  * Returns information about the range position of the picker that wraps the current component.
  */
+if (process.env.NODE_ENV !== "production") PickerRangePositionContext.displayName = "PickerRangePositionContext";
 function usePickerRangePositionContext() {
   const value = React.useContext(PickerRangePositionContext);
   if (value == null) {

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers-pro v8.3.1
+ * @mui/x-date-pickers-pro v8.4.0
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js

@@ -27,7 +27,7 @@ const useDesktopRangePicker = _ref => {
       steps
     } = _ref,
     pickerParams = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
-  (0, _xLicense.useLicenseVerifier)('x-date-pickers-pro', "MTc0NzE3MzYwMDAwMA==");
+  (0, _xLicense.useLicenseVerifier)('x-date-pickers-pro', "MTc0Nzc3ODQwMDAwMA==");
   const {
     slots,
     slotProps,
@@ -84,6 +84,7 @@ const useDesktopRangePicker = _ref => {
       })
     })
   }));
+  if (process.env.NODE_ENV !== "production") renderPicker.displayName = "renderPicker";
   return {
     renderPicker
   };

package/internals/hooks/useMobileRangePicker/useMobileRangePicker.js

@@ -29,7 +29,7 @@ const useMobileRangePicker = _ref => {
       steps
     } = _ref,
     pickerParams = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
-  (0, _xLicense.useLicenseVerifier)('x-date-pickers-pro', "MTc0NzE3MzYwMDAwMA==");
+  (0, _xLicense.useLicenseVerifier)('x-date-pickers-pro', "MTc0Nzc3ODQwMDAwMA==");
   const {
     slots,
     slotProps: innerSlotProps,
@@ -119,6 +119,7 @@ const useMobileRangePicker = _ref => {
       })
     })
   }));
+  if (process.env.NODE_ENV !== "production") renderPicker.displayName = "renderPicker";
   return {
     renderPicker
   };

package/internals/hooks/useStaticRangePicker/useStaticRangePicker.js

@@ -73,6 +73,7 @@ const useStaticRangePicker = _ref => {
       }))
     }))
   });
+  if (process.env.NODE_ENV !== "production") renderPicker.displayName = "renderPicker";
   return {
     renderPicker
   };

package/internals/utils/createMultiInputRangeField/createMultiInputRangeField.js

@@ -47,6 +47,7 @@ function createMultiInputRangeField({
     name,
     slot: 'Root'
   })({});
+  if (process.env.NODE_ENV !== "production") MultiInputRangeFieldRoot.displayName = "MultiInputRangeFieldRoot";
   const MultiInputRangeFieldSeparator = (0, _styles.styled)(_Typography.default, {
     name,
     slot: 'Separator'
@@ -133,6 +134,7 @@ function createMultiInputRangeField({
       }, cleanEndTextFieldResponse.textFieldProps))]
     }));
   });
+  if (process.env.NODE_ENV !== "production") MultiInputRangeField.displayName = "MultiInputRangeField";
   MultiInputRangeField.fieldType = 'multi-input';
   return MultiInputRangeField;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-date-pickers-pro",
-  "version": "8.3.1",
+  "version": "8.4.0",
   "author": "MUI Team",
   "description": "The Pro plan edition of the MUI X Date and Time Picker components.",
   "main": "./index.js",
@@ -37,9 +37,9 @@
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "react-transition-group": "^4.4.5",
-    "@mui/x-date-pickers": "8.3.1",
-    "@mui/x-license": "8.3.1",
-    "@mui/x-internals": "8.3.1"
+    "@mui/x-internals": "8.4.0",
+    "@mui/x-license": "8.4.0",
+    "@mui/x-date-pickers": "8.4.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",