@mui/x-date-pickers 7.0.0-beta.4 → 7.0.0-beta.5

package/CHANGELOG.md

@@ -3,6 +3,89 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 7.0.0-beta.5
+
+_Mar 1, 2024_
+
+We'd like to offer a big thanks to the 15 contributors who made this release possible. Here are some highlights ✨:
+
+- 🎁 Add `getSortComparator` for more advanced sorting behaviors (#12215) @cherniavskii
+- 🚀 Add `use client` directive to the Grid packages (#11803) @MBilalShafi
+- 🌍 Improve Korean (ko-KR) and Chinese (zh-CN) locales on the Pickers
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### Data Grid
+
+#### `@mui/x-data-grid@7.0.0-beta.5`
+
+- [DataGrid] Add `getSortComparator` for more advanced sorting behaviors (#12215) @cherniavskii
+- [DataGrid] Add `use client` directive to the Grid packages (#11803) @MBilalShafi
+- [DataGrid] Fix `disableResetButton` and `disableShowHideToggle` flags to not exclude each other (#12169) @adyry
+- [DataGrid] Fix cell range classnames (#12230) @romgrk
+- [DataGrid] Fix wrong offset for right-pinned columns when toggling dark/light modes (#12233) @cherniavskii
+- [DataGrid] Improve row virtualization and rendering performance (#12247) @romgrk
+- [DataGrid] Improve performance by removing `querySelector` call (#12229) @romgrk
+- [DataGrid] Fix `onColumnWidthChange` called before autosize affects column width (#12140) @shaharyar-shamshi
+- [DataGrid] Fix boolean "is" filter (#12117) @shaharyar-shamshi
+- [DataGrid] Fix `upsertFilterItems` removing filters that are not part of the update (#11954) @gitstart
+- [DataGrid] Render scrollbars only if there is scroll (#12265) @cherniavskii
+
+#### `@mui/x-data-grid-pro@7.0.0-beta.5` [![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@7.0.0-beta.5`, plus:
+
+- [DataGridPro] Fix column resize errors on MacOS with automatic scrollbars enabled (#12217) @cherniavskii
+- [DataGridPro] Fix lazy-loading crash (#12080) @romgrk
+- [DataGridPro] Fix useGridRows not giving error on reversed data (#10821) @martijn-basesoft
+
+#### `@mui/x-data-grid-premium@7.0.0-beta.5` [![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@7.0.0-beta.5`, plus:
+
+- [DataGridPremium] Make clipboard copy respect the sorting during cell selection (#12235) @MBilalShafi
+
+### Date Pickers
+
+#### `@mui/x-date-pickers@7.0.0-beta.5`
+
+- [pickers] Fix toolbar components props handling (#12211) @LukasTy
+- [l10n] Improve Chinese (zh-CN) locale (#12245) @headironc
+- [l10n] Improve Korean (ko-KR) locale (#12192) @Luzi
+
+#### `@mui/x-date-pickers-pro@7.0.0-beta.5` [![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@7.0.0-beta.5`.
+
+- [DateTimeRangePicker] Fix validation behavior (#12243) @LukasTy
+
+### Charts / `@mui/x-charts@7.0.0-beta.5`
+
+- [charts] Fix grid duplicated key (#12208) @alexfauquette
+
+### Tree View / `@mui/x-tree-view@7.0.0-beta.5`
+
+- [TreeView] Add public API and expose focus method (#12143) @noraleonte
+
+### Docs
+
+- [docs] Fix image layout shift when loading @oliviertassinari
+- [docs] Match Material UI repo comment for redirections @oliviertassinari
+- [docs] Non breaking spaces @oliviertassinari
+- [docs] Polish the Date Picker playground (#11869) @zanivan
+- [docs] Standardize WAI-ARIA references @oliviertassinari
+
+### Core
+
+- [core] Allow local docs next.js settings (#12227) @romgrk
+- [core] Remove grid folder from `getComponentInfo` RegExp (#12241) @flaviendelangle
+- [core] Remove `window.` reference for common globals @oliviertassinari
+- [core] Use runtime agnostic setTimeout type @oliviertassinari
+- [docs-infra] Fix Stack Overflow breaking space @oliviertassinari
+- [docs-infra] Fix missing non breaking spaces @oliviertassinari
+- [github] Update `no-response` workflow (#12193) @MBilalShafi
+- [infra] Fix missing permission reset @oliviertassinari
+
 ## 7.0.0-beta.4
 
 _Feb 23, 2024_
@@ -49,7 +132,7 @@ Same changes as in `@mui/x-data-grid-pro@7.0.0-beta.4`.
    <DateField
   -  selectedSections={{ startIndex: 0, endIndex: 0 }}
   +  selectedSections={0}
-  
+
      // If the field has 3 sections
   -  selectedSections={{ startIndex: 0, endIndex: 2 }}
   +  selectedSections="all"
@@ -68,20 +151,20 @@ Same changes as in `@mui/x-data-grid-pro@7.0.0-beta.4`.
   +     enableAccessibleFieldDOMStructure,
         // ... rest of the props you are using
       } = props;
-  
+
       return ( /* Some UI to edit the date */ )
     }
-  
+
     function MyCustomField(props) {
       const fieldResponse = useDateField<Dayjs, false, typeof textFieldProps>({
         ...props,
   +     // If you only support one DOM structure, we advise you to hardcode it here to avoid unwanted switches in your application
   +     enableAccessibleFieldDOMStructure: false,
       });
-  
+
       return <MyCustomTextField ref={ref} {...fieldResponse} />;
     }
-  
+
     function App() {
       return <DatePicker slots={{ field: MyCustomField }} />;
     }
@@ -2352,6 +2435,47 @@ Here is an example of the renaming for the `<ChartsTooltip />` component.
 - [core] Update release instructions as per v7 configuration (#10962) @MBilalShafi
 - [license] Correctly throw errors (#10924) @oliviertassinari
 
+## 6.19.6
+
+_Mar 1, 2024_
+
+We'd like to offer a big thanks to the 4 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Improve Korean (ko-KR) and Chinese (zh-CN) locales on the Pickers
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### Data Grid
+
+#### `@mui/x-data-grid@6.19.6`
+
+- [DataGrid] Fix error when existing rows are passed to `replaceRows` (@martijn-basesoft)
+
+#### `@mui/x-data-grid-pro@6.19.6` [![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@6.19.6`.
+
+#### `@mui/x-data-grid-premium@6.19.6` [![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@6.19.6`, plus:
+
+- [DataGridPremium] Make clipboard copy respect the sorting during cell selection (#12255) @MBilalShafi
+
+### Date Pickers
+
+#### `@mui/x-date-pickers@6.19.6`
+
+- [l10n] Improve Chinese (zh-CN) locale (#12250) @headironc
+- [l10n] Improve Korean (ko-KR) locale (#12186) @Luzi
+
+#### `@mui/x-date-pickers-pro@6.19.6` [![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@6.19.6`.
+
+### Docs
+
+- [docs] Update lazy loading demo to show skeleton rows during initial rows fetch (#12062) @cherniavskii
+
 ## 6.19.5
 
 _Feb 23, 2024_
@@ -2394,8 +2518,8 @@ Same changes as in `@mui/x-date-pickers@6.19.5`.
 
 - [docs] Clarify Pickers 'Component composition' section (#12147) @LukasTy
 - [docs] Fix 301 redirection to StackBlitz @oliviertassinari
-- [docs] Fix 301 to Material UI @oliviertassinari
-- [docs] Fix 301 to Material UI @oliviertassinari
+- [docs] Fix 301 to Material UI @oliviertassinari
+- [docs] Fix 301 to Material UI @oliviertassinari
 - [docs] Fix 404 links to translation source @oliviertassinari
 - [docs] Fix dead link to translations @oliviertassinari
 - [docs] Fix the Treemap illustration (#12189) @danilo-leal
@@ -4264,7 +4388,7 @@ We'd like to offer a big thanks to the 13 contributors who made this release pos
 
 #### `@mui/x-data-grid@6.9.1`
 
-- [DataGrid] Add Joy UI `tooltip` and `loadingOverlay` slots (#9028) @cherniavskii
+- [DataGrid] Add Joy UI `tooltip` and `loadingOverlay` slots (#9028) @cherniavskii
 - [DataGrid] Add section about enabling pagination on Pro and Premium (#8759) @joserodolfofreitas
 - [DataGrid] Don't forward `editCellState` prop to DOM element (#9501) @m4theushw
 - [DataGrid] Add experimental API for faster filtering performance (#9254) @romgrk
@@ -4395,7 +4519,7 @@ Same changes as in `@mui/x-date-pickers@6.9.0`.
 - [docs] Fix random screenshot generation (#9364) @cherniavskii
 - [docs] Remove random generation from chart doc example (#9343) @flaviendelangle
 - [docs] Sync h1 with sidenav link (#9252) @oliviertassinari
-- [docs] Use the mui-x Stack Overflow tag (#9352) @oliviertassinari
+- [docs] Use the mui-x Stack Overflow tag (#9352) @oliviertassinari
 
 ### Core
 
@@ -4722,8 +4846,8 @@ We'd like to offer a big thanks to the 12 contributors who made this release pos
 
 - [DataGrid] Fix DataGrid rendering in JSDOM (#8968) @cherniavskii
 - [DataGrid] Fix layout when rendered inside a parent with `display: grid` (#8577) @cherniavskii
-- [DataGrid] Add Joy UI icon slots (#8940) @siriwatknp
-- [DataGrid] Add Joy UI pagination slot (#8871) @cherniavskii
+- [DataGrid] Add Joy UI icon slots (#8940) @siriwatknp
+- [DataGrid] Add Joy UI pagination slot (#8871) @cherniavskii
 - [DataGrid] Extract `baseChip` slot (#8748) @cherniavskii
 - [DataGridPremium] Implement Clipboard import (#7389) @cherniavskii
 - [l10n] Improve French (fr-FR) locale (#8825) @allereaugabriel
@@ -4773,7 +4897,7 @@ We'd like to offer a big thanks to the 7 contributors who made this release poss
 - [DataGrid] Fix falsy filter values not showing in filter button tooltip (#8550) @ithrforu
 - [DataGrid] Fix missing watermark in Pro and Premium packages (#8797) @cherniavskii
 - [DataGrid] Remove unwarranted warning log (#8847) @romgrk
-- [DataGrid] Add Joy UI slots (`Select`, `SelectOption`, `InputLabel`, `FormControl`) (#8747) @cherniavskii
+- [DataGrid] Add Joy UI slots (`Select`, `SelectOption`, `InputLabel`, `FormControl`) (#8747) @cherniavskii
 - [DataGridPremium] Fix expanded groups being collapsed after calling `updateRows` (#8823) @cherniavskii
 
 ### `@mui/x-date-pickers@6.3.1` / `@mui/x-date-pickers-pro@6.3.1`
@@ -4824,7 +4948,7 @@ We'd like to offer a big thanks to the 15 contributors who made this release pos
 - [DataGrid] Add overlay classes to `gridClasses` (#8686) @lindapaiste
 - [DataGrid] Avoid passing `api` prop to div (#8679) @someden
 - [DataGrid] Fix 'ResizeObserver loop limit exceeded' error (#8744) @m4theushw
-- [DataGrid] Add Joy UI slots (button and switch) (#8699) @siriwatknp
+- [DataGrid] Add Joy UI slots (button and switch) (#8699) @siriwatknp
 - [DataGrid] Fix aggregation label alignment (#8694) @joserodolfofreitas
 - [DataGridPremium] Fix infinite loop when updating grouped rows (#8693) @cherniavskii
 - [DataGridPro] Fix error after updating `columns` and `columnGroupingModel` at once (#8730) @cherniavskii
@@ -4886,7 +5010,7 @@ We'd like to offer a big thanks to the 9 contributors who made this release poss
 #### Changes
 
 - [DataGrid] Add `getTogglableColumns` to `Hide all` and `Show all` actions (#8496) @MBilalShafi
-- [DataGrid] Add Grid + Joy UI experiment page (#8067) @cherniavskii
+- [DataGrid] Add Grid + Joy UI experiment page (#8067) @cherniavskii
 - [DataGrid] Fix print style when rendering inside Shadow DOM (#8656) @Bwatermelon
 - [DataGrid] Replace `GridAutoSizer` with `ResizeObserver` (#8091) @m4theushw
 - [DataGrid] Use stable ID for the placeholder filter item (#8603) @m4theushw

package/DatePicker/DatePickerToolbar.js

@@ -1,6 +1,6 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["value", "isLandscape", "onChange", "toolbarFormat", "toolbarPlaceholder", "views", "className"];
+const _excluded = ["value", "isLandscape", "onChange", "toolbarFormat", "toolbarPlaceholder", "views", "className", "onViewChange", "view"];
 import * as React from 'react';
 import clsx from 'clsx';
 import PropTypes from 'prop-types';
@@ -133,5 +133,8 @@ process.env.NODE_ENV !== "production" ? DatePickerToolbar.propTypes = {
    * Currently visible picker view.
    */
   view: PropTypes.oneOf(['day', 'month', 'year']).isRequired,
+  /**
+   * Available views.
+   */
   views: PropTypes.arrayOf(PropTypes.oneOf(['day', 'month', 'year']).isRequired).isRequired
 } : void 0;

package/DateTimePicker/DateTimePickerToolbar.d.ts

@@ -5,8 +5,6 @@ import { DateOrTimeViewWithMeridiem, WrapperVariant } from '../internals/models'
 import { MakeOptional } from '../internals/models/helpers';
 import { PickerValidDate } from '../models';
 export interface ExportedDateTimePickerToolbarProps extends ExportedBaseToolbarProps {
-    ampm?: boolean;
-    ampmInClock?: boolean;
     /**
      * Override or extend the styles applied to the component.
      */
@@ -18,6 +16,8 @@ export interface DateTimePickerToolbarProps<TDate extends PickerValidDate> exten
      * If provided, it will be used instead of `dateTimePickerToolbarTitle` from localization.
      */
     toolbarTitle?: React.ReactNode;
+    ampm?: boolean;
+    ampmInClock?: boolean;
 }
 /**
  * Demos:

package/DateTimePicker/DateTimePickerToolbar.js

@@ -360,6 +360,9 @@ process.env.NODE_ENV !== "production" ? DateTimePickerToolbar.propTypes = {
    * Currently visible picker view.
    */
   view: PropTypes.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']),
+  /**
+   * Available views.
+   */
   views: PropTypes.arrayOf(PropTypes.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']).isRequired).isRequired
 } : void 0;
 export { DateTimePickerToolbar };

package/MultiSectionDigitalClock/MultiSectionDigitalClock.js

@@ -229,7 +229,7 @@ export const MultiSectionDigitalClock = /*#__PURE__*/React.forwardRef(function M
               value,
               ampm,
               utils,
-              isDisabled: hours => disabled || isTimeDisabled(hours, 'hours'),
+              isDisabled: hours => isTimeDisabled(hours, 'hours'),
               timeStep: timeSteps.hours,
               resolveAriaLabel: localeText.hoursClockNumberText,
               valueOrReferenceDate
@@ -245,7 +245,7 @@ export const MultiSectionDigitalClock = /*#__PURE__*/React.forwardRef(function M
             items: getTimeSectionOptions({
               value: utils.getMinutes(valueOrReferenceDate),
               utils,
-              isDisabled: minutes => disabled || isTimeDisabled(minutes, 'minutes'),
+              isDisabled: minutes => isTimeDisabled(minutes, 'minutes'),
               resolveLabel: minutes => utils.format(utils.setMinutes(now, minutes), 'minutes'),
               timeStep: timeSteps.minutes,
               hasValue: !!value,
@@ -262,7 +262,7 @@ export const MultiSectionDigitalClock = /*#__PURE__*/React.forwardRef(function M
             items: getTimeSectionOptions({
               value: utils.getSeconds(valueOrReferenceDate),
               utils,
-              isDisabled: seconds => disabled || isTimeDisabled(seconds, 'seconds'),
+              isDisabled: seconds => isTimeDisabled(seconds, 'seconds'),
               resolveLabel: seconds => utils.format(utils.setSeconds(now, seconds), 'seconds'),
               timeStep: timeSteps.seconds,
               hasValue: !!value,
@@ -294,7 +294,7 @@ export const MultiSectionDigitalClock = /*#__PURE__*/React.forwardRef(function M
       default:
         throw new Error(`Unknown view: ${viewToBuild} found.`);
     }
-  }, [now, value, ampm, utils, timeSteps.hours, timeSteps.minutes, timeSteps.seconds, localeText.hoursClockNumberText, localeText.minutesClockNumberText, localeText.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, disabled, isTimeDisabled, handleMeridiemChange]);
+  }, [now, value, ampm, utils, timeSteps.hours, timeSteps.minutes, timeSteps.seconds, localeText.hoursClockNumberText, localeText.minutesClockNumberText, localeText.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, isTimeDisabled, handleMeridiemChange]);
   const viewTimeOptions = React.useMemo(() => {
     return views.reduce((result, currentView) => {
       return _extends({}, result, {

package/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js

@@ -138,8 +138,10 @@ export const MultiSectionDigitalClockSection = /*#__PURE__*/React.forwardRef(fun
     role: "listbox"
   }, other, {
     children: items.map((option, index) => {
-      var _option$isDisabled, _option$isDisabled2;
-      if (skipDisabled && (_option$isDisabled = option.isDisabled) != null && _option$isDisabled.call(option, option.value)) {
+      var _option$isDisabled;
+      const isItemDisabled = (_option$isDisabled = option.isDisabled) == null ? void 0 : _option$isDisabled.call(option, option.value);
+      const isDisabled = disabled || isItemDisabled;
+      if (skipDisabled && isDisabled) {
         return null;
       }
       const isSelected = option.isSelected(option.value);
@@ -147,12 +149,12 @@ export const MultiSectionDigitalClockSection = /*#__PURE__*/React.forwardRef(fun
       return /*#__PURE__*/_jsx(DigitalClockSectionItem, _extends({
         onClick: () => !readOnly && onChange(option.value),
         selected: isSelected,
-        disabled: disabled || ((_option$isDisabled2 = option.isDisabled) == null ? void 0 : _option$isDisabled2.call(option, option.value)),
+        disabled: isDisabled,
         disableRipple: readOnly,
         role: "option"
         // aria-readonly is not supported here and does not have any effect
         ,
-        "aria-disabled": readOnly,
+        "aria-disabled": readOnly || isDisabled || undefined,
         "aria-label": option.ariaLabel,
         "aria-selected": isSelected,
         tabIndex: tabIndex,

package/TimePicker/TimePickerToolbar.js

@@ -254,6 +254,9 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
    * Currently visible picker view.
    */
   view: PropTypes.oneOf(['hours', 'meridiem', 'minutes', 'seconds']).isRequired,
+  /**
+   * Available views.
+   */
   views: PropTypes.arrayOf(PropTypes.oneOf(['hours', 'meridiem', 'minutes', 'seconds']).isRequired).isRequired
 } : void 0;
 export { TimePickerToolbar };

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers v7.0.0-beta.4
+ * @mui/x-date-pickers v7.0.0-beta.5
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/internals/components/PickersToolbar.js

@@ -1,4 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className", "toolbarTitle", "hidden", "titleId", "isLandscape", "classes", "landscapeDirection"];
 import * as React from 'react';
 import clsx from 'clsx';
 import Typography from '@mui/material/Typography';
@@ -63,21 +65,23 @@ export const PickersToolbar = /*#__PURE__*/React.forwardRef(function PickersTool
     name: 'MuiPickersToolbar'
   });
   const {
-    children,
-    className,
-    toolbarTitle,
-    hidden,
-    titleId
-  } = props;
+      children,
+      className,
+      toolbarTitle,
+      hidden,
+      titleId
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const ownerState = props;
   const classes = useUtilityClasses(ownerState);
   if (hidden) {
     return null;
   }
-  return /*#__PURE__*/_jsxs(PickersToolbarRoot, {
+  return /*#__PURE__*/_jsxs(PickersToolbarRoot, _extends({
     ref: ref,
     className: clsx(classes.root, className),
-    ownerState: ownerState,
+    ownerState: ownerState
+  }, other, {
     children: [/*#__PURE__*/_jsx(Typography, {
       color: "text.secondary",
       variant: "overline",
@@ -88,5 +92,5 @@ export const PickersToolbar = /*#__PURE__*/React.forwardRef(function PickersTool
       ownerState: ownerState,
       children: children
     })]
-  });
+  }));
 });

package/internals/hooks/useField/useFieldCharacterEditing.js

@@ -57,7 +57,7 @@ export const useFieldCharacterEditing = ({
     if (query != null) {
       const timeout = setTimeout(() => resetQuery(), QUERY_LIFE_DURATION_MS);
       return () => {
-        window.clearTimeout(timeout);
+        clearTimeout(timeout);
       };
     }
     return () => {};

package/internals/hooks/useField/useFieldV6TextField.js

@@ -36,7 +36,7 @@ export const addPositionPropertiesToSections = (sections, localizedDigits, isRTL
 export const useFieldV6TextField = params => {
   const theme = useTheme();
   const isRTL = theme.direction === 'rtl';
-  const focusTimeoutRef = React.useRef(undefined);
+  const focusTimeoutRef = React.useRef();
   const {
     forwardedProps: {
       onFocus,
@@ -151,7 +151,7 @@ export const useFieldV6TextField = params => {
     onFocus == null || onFocus(...args);
     // The ref is guaranteed to be resolved at this point.
     const input = inputRef.current;
-    window.clearTimeout(focusTimeoutRef.current);
+    clearTimeout(focusTimeoutRef.current);
     focusTimeoutRef.current = setTimeout(() => {
       // The ref changed, the component got remounted, the focus event is no longer relevant.
       if (!input || input !== inputRef.current) {
@@ -288,7 +288,9 @@ export const useFieldV6TextField = params => {
     if (inputRef.current && inputRef.current === getActiveElement(document)) {
       setSelectedSections('all');
     }
-    return () => window.clearTimeout(focusTimeoutRef.current);
+    return () => {
+      clearTimeout(focusTimeoutRef.current);
+    };
   }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
   const inputMode = React.useMemo(() => {

package/internals/hooks/useField/useFieldV7TextField.js

@@ -134,7 +134,7 @@ export const useFieldV7TextField = params => {
     setFocused(true);
     onClick == null || onClick(event, ...args);
     if (parsedSelectedSections === 'all') {
-      window.setTimeout(() => {
+      setTimeout(() => {
         const cursorPosition = document.getSelection().getRangeAt(0).startOffset;
         if (cursorPosition === 0) {
           setSelectedSections(sectionOrder.startIndex);
@@ -206,7 +206,7 @@ export const useFieldV7TextField = params => {
   });
   const handleContainerBlur = useEventCallback((...args) => {
     onBlur == null || onBlur(...args);
-    window.setTimeout(() => {
+    setTimeout(() => {
       if (!sectionListRef.current) {
         return;
       }

package/internals/models/props/toolbar.d.ts

@@ -16,6 +16,9 @@ export interface BaseToolbarProps<TValue, TView extends DateOrTimeViewWithMeridi
      * @param {TView} view The view to open
      */
     onViewChange: (view: TView) => void;
+    /**
+     * Available views.
+     */
     views: readonly TView[];
     disabled?: boolean;
     readOnly?: boolean;

package/locales/koKR.js

@@ -46,8 +46,7 @@ const koKRPickers = {
   // Open picker labels
   openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `날짜를 선택하세요. 현재 선택된 날짜는 ${utils.format(value, 'fullDate')}입니다.` : '날짜를 선택하세요',
   openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `시간을 선택하세요. 현재 선택된 시간은 ${utils.format(value, 'fullTime')}입니다.` : '시간을 선택하세요',
-  // fieldClearLabel: 'Clear value',
-
+  fieldClearLabel: '지우기',
   // Table labels
   timeTableLabel: '선택한 시간',
   dateTableLabel: '선택한 날짜',

package/locales/zhCN.js

@@ -3,7 +3,7 @@ const views = {
   hours: '小时',
   minutes: '分钟',
   seconds: '秒',
-  meridiem: '子午线'
+  meridiem: '十二小时制'
 };
 const zhCNPickers = {
   // Calendar navigation
@@ -16,11 +16,10 @@ const zhCNPickers = {
   // DateRange labels
   start: '开始',
   end: '结束',
-  // startDate: 'Start date',
-  // startTime: 'Start time',
-  // endDate: 'End date',
-  // endTime: 'End time',
-
+  startDate: '开始日期',
+  startTime: '开始时间',
+  endDate: '结束日期',
+  endTime: '结束时间',
   // Action bar
   cancelButtonLabel: '取消',
   clearButtonLabel: '清除',
@@ -46,8 +45,7 @@ const zhCNPickers = {
   // Open picker labels
   openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `选择日期，已选择${utils.format(value, 'fullDate')}` : '选择日期',
   openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `选择时间，已选择${utils.format(value, 'fullTime')}` : '选择时间',
-  // fieldClearLabel: 'Clear value',
-
+  fieldClearLabel: '清除',
   // Table labels
   timeTableLabel: '选择时间',
   dateTableLabel: '选择日期',
@@ -59,19 +57,17 @@ const zhCNPickers = {
   fieldHoursPlaceholder: () => 'hh',
   fieldMinutesPlaceholder: () => 'mm',
   fieldSecondsPlaceholder: () => 'ss',
-  fieldMeridiemPlaceholder: () => 'aa'
-
+  fieldMeridiemPlaceholder: () => 'aa',
   // View names
-  // year: 'Year',
-  // month: 'Month',
-  // day: 'Day',
-  // weekDay: 'Week day',
-  // hours: 'Hours',
-  // minutes: 'Minutes',
-  // seconds: 'Seconds',
-  // meridiem: 'Meridiem',
-
+  year: '年份',
+  month: '月份',
+  day: '日期',
+  weekDay: '星期',
+  hours: '时',
+  minutes: '分',
+  seconds: '秒',
+  meridiem: '十二小时制',
   // Common
-  // empty: 'Empty',
+  empty: '空'
 };
 export const zhCN = getPickersLocalization(zhCNPickers);

package/modern/DatePicker/DatePickerToolbar.js

@@ -1,6 +1,6 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["value", "isLandscape", "onChange", "toolbarFormat", "toolbarPlaceholder", "views", "className"];
+const _excluded = ["value", "isLandscape", "onChange", "toolbarFormat", "toolbarPlaceholder", "views", "className", "onViewChange", "view"];
 import * as React from 'react';
 import clsx from 'clsx';
 import PropTypes from 'prop-types';
@@ -133,5 +133,8 @@ process.env.NODE_ENV !== "production" ? DatePickerToolbar.propTypes = {
    * Currently visible picker view.
    */
   view: PropTypes.oneOf(['day', 'month', 'year']).isRequired,
+  /**
+   * Available views.
+   */
   views: PropTypes.arrayOf(PropTypes.oneOf(['day', 'month', 'year']).isRequired).isRequired
 } : void 0;

package/modern/DateTimePicker/DateTimePickerToolbar.js

@@ -360,6 +360,9 @@ process.env.NODE_ENV !== "production" ? DateTimePickerToolbar.propTypes = {
    * Currently visible picker view.
    */
   view: PropTypes.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']),
+  /**
+   * Available views.
+   */
   views: PropTypes.arrayOf(PropTypes.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']).isRequired).isRequired
 } : void 0;
 export { DateTimePickerToolbar };

package/modern/MultiSectionDigitalClock/MultiSectionDigitalClock.js

@@ -229,7 +229,7 @@ export const MultiSectionDigitalClock = /*#__PURE__*/React.forwardRef(function M
               value,
               ampm,
               utils,
-              isDisabled: hours => disabled || isTimeDisabled(hours, 'hours'),
+              isDisabled: hours => isTimeDisabled(hours, 'hours'),
               timeStep: timeSteps.hours,
               resolveAriaLabel: localeText.hoursClockNumberText,
               valueOrReferenceDate
@@ -245,7 +245,7 @@ export const MultiSectionDigitalClock = /*#__PURE__*/React.forwardRef(function M
             items: getTimeSectionOptions({
               value: utils.getMinutes(valueOrReferenceDate),
               utils,
-              isDisabled: minutes => disabled || isTimeDisabled(minutes, 'minutes'),
+              isDisabled: minutes => isTimeDisabled(minutes, 'minutes'),
               resolveLabel: minutes => utils.format(utils.setMinutes(now, minutes), 'minutes'),
               timeStep: timeSteps.minutes,
               hasValue: !!value,
@@ -262,7 +262,7 @@ export const MultiSectionDigitalClock = /*#__PURE__*/React.forwardRef(function M
             items: getTimeSectionOptions({
               value: utils.getSeconds(valueOrReferenceDate),
               utils,
-              isDisabled: seconds => disabled || isTimeDisabled(seconds, 'seconds'),
+              isDisabled: seconds => isTimeDisabled(seconds, 'seconds'),
               resolveLabel: seconds => utils.format(utils.setSeconds(now, seconds), 'seconds'),
               timeStep: timeSteps.seconds,
               hasValue: !!value,
@@ -294,7 +294,7 @@ export const MultiSectionDigitalClock = /*#__PURE__*/React.forwardRef(function M
       default:
         throw new Error(`Unknown view: ${viewToBuild} found.`);
     }
-  }, [now, value, ampm, utils, timeSteps.hours, timeSteps.minutes, timeSteps.seconds, localeText.hoursClockNumberText, localeText.minutesClockNumberText, localeText.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, disabled, isTimeDisabled, handleMeridiemChange]);
+  }, [now, value, ampm, utils, timeSteps.hours, timeSteps.minutes, timeSteps.seconds, localeText.hoursClockNumberText, localeText.minutesClockNumberText, localeText.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, isTimeDisabled, handleMeridiemChange]);
   const viewTimeOptions = React.useMemo(() => {
     return views.reduce((result, currentView) => {
       return _extends({}, result, {

package/modern/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js

@@ -137,7 +137,9 @@ export const MultiSectionDigitalClockSection = /*#__PURE__*/React.forwardRef(fun
     role: "listbox"
   }, other, {
     children: items.map((option, index) => {
-      if (skipDisabled && option.isDisabled?.(option.value)) {
+      const isItemDisabled = option.isDisabled?.(option.value);
+      const isDisabled = disabled || isItemDisabled;
+      if (skipDisabled && isDisabled) {
         return null;
       }
       const isSelected = option.isSelected(option.value);
@@ -145,12 +147,12 @@ export const MultiSectionDigitalClockSection = /*#__PURE__*/React.forwardRef(fun
       return /*#__PURE__*/_jsx(DigitalClockSectionItem, _extends({
         onClick: () => !readOnly && onChange(option.value),
         selected: isSelected,
-        disabled: disabled || option.isDisabled?.(option.value),
+        disabled: isDisabled,
         disableRipple: readOnly,
         role: "option"
         // aria-readonly is not supported here and does not have any effect
         ,
-        "aria-disabled": readOnly,
+        "aria-disabled": readOnly || isDisabled || undefined,
         "aria-label": option.ariaLabel,
         "aria-selected": isSelected,
         tabIndex: tabIndex,

package/modern/TimePicker/TimePickerToolbar.js

@@ -254,6 +254,9 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
    * Currently visible picker view.
    */
   view: PropTypes.oneOf(['hours', 'meridiem', 'minutes', 'seconds']).isRequired,
+  /**
+   * Available views.
+   */
   views: PropTypes.arrayOf(PropTypes.oneOf(['hours', 'meridiem', 'minutes', 'seconds']).isRequired).isRequired
 } : void 0;
 export { TimePickerToolbar };

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers v7.0.0-beta.4
+ * @mui/x-date-pickers v7.0.0-beta.5
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/internals/components/PickersToolbar.js

@@ -1,4 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["children", "className", "toolbarTitle", "hidden", "titleId", "isLandscape", "classes", "landscapeDirection"];
 import * as React from 'react';
 import clsx from 'clsx';
 import Typography from '@mui/material/Typography';
@@ -60,21 +62,23 @@ export const PickersToolbar = /*#__PURE__*/React.forwardRef(function PickersTool
     name: 'MuiPickersToolbar'
   });
   const {
-    children,
-    className,
-    toolbarTitle,
-    hidden,
-    titleId
-  } = props;
+      children,
+      className,
+      toolbarTitle,
+      hidden,
+      titleId
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const ownerState = props;
   const classes = useUtilityClasses(ownerState);
   if (hidden) {
     return null;
   }
-  return /*#__PURE__*/_jsxs(PickersToolbarRoot, {
+  return /*#__PURE__*/_jsxs(PickersToolbarRoot, _extends({
     ref: ref,
     className: clsx(classes.root, className),
-    ownerState: ownerState,
+    ownerState: ownerState
+  }, other, {
     children: [/*#__PURE__*/_jsx(Typography, {
       color: "text.secondary",
       variant: "overline",
@@ -85,5 +89,5 @@ export const PickersToolbar = /*#__PURE__*/React.forwardRef(function PickersTool
       ownerState: ownerState,
       children: children
     })]
-  });
+  }));
 });

package/modern/internals/hooks/useField/useFieldCharacterEditing.js

@@ -56,7 +56,7 @@ export const useFieldCharacterEditing = ({
     if (query != null) {
       const timeout = setTimeout(() => resetQuery(), QUERY_LIFE_DURATION_MS);
       return () => {
-        window.clearTimeout(timeout);
+        clearTimeout(timeout);
       };
     }
     return () => {};

package/modern/internals/hooks/useField/useFieldV6TextField.js

@@ -36,7 +36,7 @@ export const addPositionPropertiesToSections = (sections, localizedDigits, isRTL
 export const useFieldV6TextField = params => {
   const theme = useTheme();
   const isRTL = theme.direction === 'rtl';
-  const focusTimeoutRef = React.useRef(undefined);
+  const focusTimeoutRef = React.useRef();
   const {
     forwardedProps: {
       onFocus,
@@ -148,7 +148,7 @@ export const useFieldV6TextField = params => {
     onFocus?.(...args);
     // The ref is guaranteed to be resolved at this point.
     const input = inputRef.current;
-    window.clearTimeout(focusTimeoutRef.current);
+    clearTimeout(focusTimeoutRef.current);
     focusTimeoutRef.current = setTimeout(() => {
       // The ref changed, the component got remounted, the focus event is no longer relevant.
       if (!input || input !== inputRef.current) {
@@ -282,7 +282,9 @@ export const useFieldV6TextField = params => {
     if (inputRef.current && inputRef.current === getActiveElement(document)) {
       setSelectedSections('all');
     }
-    return () => window.clearTimeout(focusTimeoutRef.current);
+    return () => {
+      clearTimeout(focusTimeoutRef.current);
+    };
   }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
   const inputMode = React.useMemo(() => {

package/modern/internals/hooks/useField/useFieldV7TextField.js

@@ -134,7 +134,7 @@ export const useFieldV7TextField = params => {
     setFocused(true);
     onClick?.(event, ...args);
     if (parsedSelectedSections === 'all') {
-      window.setTimeout(() => {
+      setTimeout(() => {
         const cursorPosition = document.getSelection().getRangeAt(0).startOffset;
         if (cursorPosition === 0) {
           setSelectedSections(sectionOrder.startIndex);
@@ -205,7 +205,7 @@ export const useFieldV7TextField = params => {
   });
   const handleContainerBlur = useEventCallback((...args) => {
     onBlur?.(...args);
-    window.setTimeout(() => {
+    setTimeout(() => {
       if (!sectionListRef.current) {
         return;
       }

package/modern/locales/koKR.js

@@ -46,8 +46,7 @@ const koKRPickers = {
   // Open picker labels
   openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `날짜를 선택하세요. 현재 선택된 날짜는 ${utils.format(value, 'fullDate')}입니다.` : '날짜를 선택하세요',
   openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `시간을 선택하세요. 현재 선택된 시간은 ${utils.format(value, 'fullTime')}입니다.` : '시간을 선택하세요',
-  // fieldClearLabel: 'Clear value',
-
+  fieldClearLabel: '지우기',
   // Table labels
   timeTableLabel: '선택한 시간',
   dateTableLabel: '선택한 날짜',

package/modern/locales/zhCN.js

@@ -3,7 +3,7 @@ const views = {
   hours: '小时',
   minutes: '分钟',
   seconds: '秒',
-  meridiem: '子午线'
+  meridiem: '十二小时制'
 };
 const zhCNPickers = {
   // Calendar navigation
@@ -16,11 +16,10 @@ const zhCNPickers = {
   // DateRange labels
   start: '开始',
   end: '结束',
-  // startDate: 'Start date',
-  // startTime: 'Start time',
-  // endDate: 'End date',
-  // endTime: 'End time',
-
+  startDate: '开始日期',
+  startTime: '开始时间',
+  endDate: '结束日期',
+  endTime: '结束时间',
   // Action bar
   cancelButtonLabel: '取消',
   clearButtonLabel: '清除',
@@ -46,8 +45,7 @@ const zhCNPickers = {
   // Open picker labels
   openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `选择日期，已选择${utils.format(value, 'fullDate')}` : '选择日期',
   openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `选择时间，已选择${utils.format(value, 'fullTime')}` : '选择时间',
-  // fieldClearLabel: 'Clear value',
-
+  fieldClearLabel: '清除',
   // Table labels
   timeTableLabel: '选择时间',
   dateTableLabel: '选择日期',
@@ -59,19 +57,17 @@ const zhCNPickers = {
   fieldHoursPlaceholder: () => 'hh',
   fieldMinutesPlaceholder: () => 'mm',
   fieldSecondsPlaceholder: () => 'ss',
-  fieldMeridiemPlaceholder: () => 'aa'
-
+  fieldMeridiemPlaceholder: () => 'aa',
   // View names
-  // year: 'Year',
-  // month: 'Month',
-  // day: 'Day',
-  // weekDay: 'Week day',
-  // hours: 'Hours',
-  // minutes: 'Minutes',
-  // seconds: 'Seconds',
-  // meridiem: 'Meridiem',
-
+  year: '年份',
+  month: '月份',
+  day: '日期',
+  weekDay: '星期',
+  hours: '时',
+  minutes: '分',
+  seconds: '秒',
+  meridiem: '十二小时制',
   // Common
-  // empty: 'Empty',
+  empty: '空'
 };
 export const zhCN = getPickersLocalization(zhCNPickers);

package/node/DatePicker/DatePickerToolbar.js

@@ -18,7 +18,7 @@ var _useUtils = require("../internals/hooks/useUtils");
 var _datePickerToolbarClasses = require("./datePickerToolbarClasses");
 var _dateUtils = require("../internals/utils/date-utils");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["value", "isLandscape", "onChange", "toolbarFormat", "toolbarPlaceholder", "views", "className"];
+const _excluded = ["value", "isLandscape", "onChange", "toolbarFormat", "toolbarPlaceholder", "views", "className", "onViewChange", "view"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useUtilityClasses = ownerState => {
@@ -142,5 +142,8 @@ process.env.NODE_ENV !== "production" ? DatePickerToolbar.propTypes = {
    * Currently visible picker view.
    */
   view: _propTypes.default.oneOf(['day', 'month', 'year']).isRequired,
+  /**
+   * Available views.
+   */
   views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['day', 'month', 'year']).isRequired).isRequired
 } : void 0;

package/node/DateTimePicker/DateTimePickerToolbar.js

@@ -368,5 +368,8 @@ process.env.NODE_ENV !== "production" ? DateTimePickerToolbar.propTypes = {
    * Currently visible picker view.
    */
   view: _propTypes.default.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']),
+  /**
+   * Available views.
+   */
   views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']).isRequired).isRequired
 } : void 0;

package/node/MultiSectionDigitalClock/MultiSectionDigitalClock.js

@@ -238,7 +238,7 @@ const MultiSectionDigitalClock = exports.MultiSectionDigitalClock = /*#__PURE__*
               value,
               ampm,
               utils,
-              isDisabled: hours => disabled || isTimeDisabled(hours, 'hours'),
+              isDisabled: hours => isTimeDisabled(hours, 'hours'),
               timeStep: timeSteps.hours,
               resolveAriaLabel: localeText.hoursClockNumberText,
               valueOrReferenceDate
@@ -254,7 +254,7 @@ const MultiSectionDigitalClock = exports.MultiSectionDigitalClock = /*#__PURE__*
             items: (0, _MultiSectionDigitalClock.getTimeSectionOptions)({
               value: utils.getMinutes(valueOrReferenceDate),
               utils,
-              isDisabled: minutes => disabled || isTimeDisabled(minutes, 'minutes'),
+              isDisabled: minutes => isTimeDisabled(minutes, 'minutes'),
               resolveLabel: minutes => utils.format(utils.setMinutes(now, minutes), 'minutes'),
               timeStep: timeSteps.minutes,
               hasValue: !!value,
@@ -271,7 +271,7 @@ const MultiSectionDigitalClock = exports.MultiSectionDigitalClock = /*#__PURE__*
             items: (0, _MultiSectionDigitalClock.getTimeSectionOptions)({
               value: utils.getSeconds(valueOrReferenceDate),
               utils,
-              isDisabled: seconds => disabled || isTimeDisabled(seconds, 'seconds'),
+              isDisabled: seconds => isTimeDisabled(seconds, 'seconds'),
               resolveLabel: seconds => utils.format(utils.setSeconds(now, seconds), 'seconds'),
               timeStep: timeSteps.seconds,
               hasValue: !!value,
@@ -303,7 +303,7 @@ const MultiSectionDigitalClock = exports.MultiSectionDigitalClock = /*#__PURE__*
       default:
         throw new Error(`Unknown view: ${viewToBuild} found.`);
     }
-  }, [now, value, ampm, utils, timeSteps.hours, timeSteps.minutes, timeSteps.seconds, localeText.hoursClockNumberText, localeText.minutesClockNumberText, localeText.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, disabled, isTimeDisabled, handleMeridiemChange]);
+  }, [now, value, ampm, utils, timeSteps.hours, timeSteps.minutes, timeSteps.seconds, localeText.hoursClockNumberText, localeText.minutesClockNumberText, localeText.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, isTimeDisabled, handleMeridiemChange]);
   const viewTimeOptions = React.useMemo(() => {
     return views.reduce((result, currentView) => {
       return (0, _extends2.default)({}, result, {

package/node/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js

@@ -146,7 +146,9 @@ const MultiSectionDigitalClockSection = exports.MultiSectionDigitalClockSection
     role: "listbox"
   }, other, {
     children: items.map((option, index) => {
-      if (skipDisabled && option.isDisabled?.(option.value)) {
+      const isItemDisabled = option.isDisabled?.(option.value);
+      const isDisabled = disabled || isItemDisabled;
+      if (skipDisabled && isDisabled) {
         return null;
       }
       const isSelected = option.isSelected(option.value);
@@ -154,12 +156,12 @@ const MultiSectionDigitalClockSection = exports.MultiSectionDigitalClockSection
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(DigitalClockSectionItem, (0, _extends2.default)({
         onClick: () => !readOnly && onChange(option.value),
         selected: isSelected,
-        disabled: disabled || option.isDisabled?.(option.value),
+        disabled: isDisabled,
         disableRipple: readOnly,
         role: "option"
         // aria-readonly is not supported here and does not have any effect
         ,
-        "aria-disabled": readOnly,
+        "aria-disabled": readOnly || isDisabled || undefined,
         "aria-label": option.ariaLabel,
         "aria-selected": isSelected,
         tabIndex: tabIndex,

package/node/TimePicker/TimePickerToolbar.js

@@ -262,5 +262,8 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
    * Currently visible picker view.
    */
   view: _propTypes.default.oneOf(['hours', 'meridiem', 'minutes', 'seconds']).isRequired,
+  /**
+   * Available views.
+   */
   views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['hours', 'meridiem', 'minutes', 'seconds']).isRequired).isRequired
 } : void 0;

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers v7.0.0-beta.4
+ * @mui/x-date-pickers v7.0.0-beta.5
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/node/internals/components/PickersToolbar.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.PickersToolbar = void 0;
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _clsx = _interopRequireDefault(require("clsx"));
@@ -13,6 +14,7 @@ var _styles = require("@mui/material/styles");
 var _utils = require("@mui/utils");
 var _pickersToolbarClasses = require("./pickersToolbarClasses");
 var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["children", "className", "toolbarTitle", "hidden", "titleId", "isLandscape", "classes", "landscapeDirection"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useUtilityClasses = ownerState => {
@@ -68,21 +70,23 @@ const PickersToolbar = exports.PickersToolbar = /*#__PURE__*/React.forwardRef(fu
     name: 'MuiPickersToolbar'
   });
   const {
-    children,
-    className,
-    toolbarTitle,
-    hidden,
-    titleId
-  } = props;
+      children,
+      className,
+      toolbarTitle,
+      hidden,
+      titleId
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const ownerState = props;
   const classes = useUtilityClasses(ownerState);
   if (hidden) {
     return null;
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(PickersToolbarRoot, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(PickersToolbarRoot, (0, _extends2.default)({
     ref: ref,
     className: (0, _clsx.default)(classes.root, className),
-    ownerState: ownerState,
+    ownerState: ownerState
+  }, other, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
       color: "text.secondary",
       variant: "overline",
@@ -93,5 +97,5 @@ const PickersToolbar = exports.PickersToolbar = /*#__PURE__*/React.forwardRef(fu
       ownerState: ownerState,
       children: children
     })]
-  });
+  }));
 });

package/node/internals/hooks/useField/useFieldCharacterEditing.js

@@ -64,7 +64,7 @@ const useFieldCharacterEditing = ({
     if (query != null) {
       const timeout = setTimeout(() => resetQuery(), QUERY_LIFE_DURATION_MS);
       return () => {
-        window.clearTimeout(timeout);
+        clearTimeout(timeout);
       };
     }
     return () => {};

package/node/internals/hooks/useField/useFieldV6TextField.js

@@ -46,7 +46,7 @@ exports.addPositionPropertiesToSections = addPositionPropertiesToSections;
 const useFieldV6TextField = params => {
   const theme = (0, _styles.useTheme)();
   const isRTL = theme.direction === 'rtl';
-  const focusTimeoutRef = React.useRef(undefined);
+  const focusTimeoutRef = React.useRef();
   const {
     forwardedProps: {
       onFocus,
@@ -158,7 +158,7 @@ const useFieldV6TextField = params => {
     onFocus?.(...args);
     // The ref is guaranteed to be resolved at this point.
     const input = inputRef.current;
-    window.clearTimeout(focusTimeoutRef.current);
+    clearTimeout(focusTimeoutRef.current);
     focusTimeoutRef.current = setTimeout(() => {
       // The ref changed, the component got remounted, the focus event is no longer relevant.
       if (!input || input !== inputRef.current) {
@@ -292,7 +292,9 @@ const useFieldV6TextField = params => {
     if (inputRef.current && inputRef.current === (0, _utils.getActiveElement)(document)) {
       setSelectedSections('all');
     }
-    return () => window.clearTimeout(focusTimeoutRef.current);
+    return () => {
+      clearTimeout(focusTimeoutRef.current);
+    };
   }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
   const inputMode = React.useMemo(() => {

package/node/internals/hooks/useField/useFieldV7TextField.js

@@ -143,7 +143,7 @@ const useFieldV7TextField = params => {
     setFocused(true);
     onClick?.(event, ...args);
     if (parsedSelectedSections === 'all') {
-      window.setTimeout(() => {
+      setTimeout(() => {
         const cursorPosition = document.getSelection().getRangeAt(0).startOffset;
         if (cursorPosition === 0) {
           setSelectedSections(sectionOrder.startIndex);
@@ -214,7 +214,7 @@ const useFieldV7TextField = params => {
   });
   const handleContainerBlur = (0, _useEventCallback.default)((...args) => {
     onBlur?.(...args);
-    window.setTimeout(() => {
+    setTimeout(() => {
       if (!sectionListRef.current) {
         return;
       }

package/node/locales/koKR.js

@@ -52,8 +52,7 @@ const koKRPickers = {
   // Open picker labels
   openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `날짜를 선택하세요. 현재 선택된 날짜는 ${utils.format(value, 'fullDate')}입니다.` : '날짜를 선택하세요',
   openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `시간을 선택하세요. 현재 선택된 시간은 ${utils.format(value, 'fullTime')}입니다.` : '시간을 선택하세요',
-  // fieldClearLabel: 'Clear value',
-
+  fieldClearLabel: '지우기',
   // Table labels
   timeTableLabel: '선택한 시간',
   dateTableLabel: '선택한 날짜',

package/node/locales/zhCN.js

@@ -9,7 +9,7 @@ const views = {
   hours: '小时',
   minutes: '分钟',
   seconds: '秒',
-  meridiem: '子午线'
+  meridiem: '十二小时制'
 };
 const zhCNPickers = {
   // Calendar navigation
@@ -22,11 +22,10 @@ const zhCNPickers = {
   // DateRange labels
   start: '开始',
   end: '结束',
-  // startDate: 'Start date',
-  // startTime: 'Start time',
-  // endDate: 'End date',
-  // endTime: 'End time',
-
+  startDate: '开始日期',
+  startTime: '开始时间',
+  endDate: '结束日期',
+  endTime: '结束时间',
   // Action bar
   cancelButtonLabel: '取消',
   clearButtonLabel: '清除',
@@ -52,8 +51,7 @@ const zhCNPickers = {
   // Open picker labels
   openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `选择日期，已选择${utils.format(value, 'fullDate')}` : '选择日期',
   openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `选择时间，已选择${utils.format(value, 'fullTime')}` : '选择时间',
-  // fieldClearLabel: 'Clear value',
-
+  fieldClearLabel: '清除',
   // Table labels
   timeTableLabel: '选择时间',
   dateTableLabel: '选择日期',
@@ -65,19 +63,17 @@ const zhCNPickers = {
   fieldHoursPlaceholder: () => 'hh',
   fieldMinutesPlaceholder: () => 'mm',
   fieldSecondsPlaceholder: () => 'ss',
-  fieldMeridiemPlaceholder: () => 'aa'
-
+  fieldMeridiemPlaceholder: () => 'aa',
   // View names
-  // year: 'Year',
-  // month: 'Month',
-  // day: 'Day',
-  // weekDay: 'Week day',
-  // hours: 'Hours',
-  // minutes: 'Minutes',
-  // seconds: 'Seconds',
-  // meridiem: 'Meridiem',
-
+  year: '年份',
+  month: '月份',
+  day: '日期',
+  weekDay: '星期',
+  hours: '时',
+  minutes: '分',
+  seconds: '秒',
+  meridiem: '十二小时制',
   // Common
-  // empty: 'Empty',
+  empty: '空'
 };
 const zhCN = exports.zhCN = (0, _getPickersLocalization.getPickersLocalization)(zhCNPickers);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-date-pickers",
-  "version": "7.0.0-beta.4",
+  "version": "7.0.0-beta.5",
   "description": "The community edition of the date picker components (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",

package/themeAugmentation/props.d.ts

@@ -19,22 +19,21 @@ import { PickersToolbarButtonProps } from '../internals/components/PickersToolba
 import { ExportedPickersToolbarTextProps } from '../internals/components/PickersToolbarText';
 import { DateOrTimeView, PickerValidDate } from '../models';
 
-import { DatePickerProps, DatePickerToolbarProps } from '../DatePicker';
+import { DatePickerProps } from '../DatePicker';
+import { ExportedDatePickerToolbarProps } from '../DatePicker/DatePickerToolbar';
 import { DesktopDatePickerProps } from '../DesktopDatePicker';
 import { MobileDatePickerProps } from '../MobileDatePicker';
 import { StaticDatePickerProps } from '../StaticDatePicker';
 
-import {
-  DateTimePickerProps,
-  DateTimePickerTabsProps,
-  DateTimePickerToolbarProps,
-} from '../DateTimePicker';
+import { DateTimePickerProps, DateTimePickerTabsProps } from '../DateTimePicker';
+import { ExportedDateTimePickerToolbarProps } from '../DateTimePicker/DateTimePickerToolbar';
 import { DesktopDateTimePickerProps } from '../DesktopDateTimePicker';
 import { MobileDateTimePickerProps } from '../MobileDateTimePicker';
 import { StaticDateTimePickerProps } from '../StaticDateTimePicker';
 import { DateTimeFieldProps } from '../DateTimeField';
 
-import { TimePickerProps, TimePickerToolbarProps } from '../TimePicker';
+import { TimePickerProps } from '../TimePicker';
+import { ExportedTimePickerToolbarProps } from '../TimePicker/TimePickerToolbar';
 import { DesktopTimePickerProps } from '../DesktopTimePicker';
 import { MobileTimePickerProps } from '../MobileTimePicker';
 import { StaticTimePickerProps } from '../StaticTimePicker';
@@ -60,10 +59,10 @@ export interface PickersComponentsPropsList {
   MuiClockPointer: ClockPointerProps;
   MuiDateCalendar: DateCalendarProps<PickerValidDate>;
   MuiDateField: DateFieldProps<PickerValidDate, any>;
-  MuiDatePickerToolbar: DatePickerToolbarProps<PickerValidDate>;
+  MuiDatePickerToolbar: ExportedDatePickerToolbarProps;
   MuiDateTimeField: DateTimeFieldProps<PickerValidDate, any>;
   MuiDateTimePickerTabs: DateTimePickerTabsProps;
-  MuiDateTimePickerToolbar: DateTimePickerToolbarProps<PickerValidDate>;
+  MuiDateTimePickerToolbar: ExportedDateTimePickerToolbarProps;
   MuiDayCalendar: DayCalendarProps<PickerValidDate>;
   MuiDayCalendarSkeleton: DayCalendarSkeletonProps;
   MuiDigitalClock: ExportedDigitalClockProps<PickerValidDate>;
@@ -85,7 +84,7 @@ export interface PickersComponentsPropsList {
   MuiPickersYear: ExportedPickersYearProps;
   MuiTimeClock: TimeClockProps<PickerValidDate>;
   MuiTimeField: TimeFieldProps<PickerValidDate, any>;
-  MuiTimePickerToolbar: TimePickerToolbarProps<PickerValidDate>;
+  MuiTimePickerToolbar: ExportedTimePickerToolbarProps;
   MuiYearCalendar: YearCalendarProps<PickerValidDate>;
 
   // Date Pickers