@mui/x-date-pickers 6.19.4 → 6.19.6

package/legacy/DateTimePicker/DateTimePickerTabs.js

@@ -73,7 +73,8 @@ var DateTimePickerTabs = function DateTimePickerTabs(inProps) {
     view = props.view,
     _props$hidden = props.hidden,
     hidden = _props$hidden === void 0 ? typeof window === 'undefined' || window.innerHeight < 667 : _props$hidden,
-    className = props.className;
+    className = props.className,
+    sx = props.sx;
   var localeText = useLocaleText();
   var classes = useUtilityClasses(props);
   var handleChange = function handleChange(event, value) {
@@ -88,6 +89,7 @@ var DateTimePickerTabs = function DateTimePickerTabs(inProps) {
     value: viewToTab(view),
     onChange: handleChange,
     className: clsx(className, classes.root),
+    sx: sx,
     children: [/*#__PURE__*/_jsx(Tab, {
       value: "date",
       "aria-label": localeText.dateTableLabel,
@@ -129,6 +131,10 @@ process.env.NODE_ENV !== "production" ? DateTimePickerTabs.propTypes = {
    * @param {TView} view The view to open
    */
   onViewChange: PropTypes.func.isRequired,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   /**
    * Time tab icon.
    * @default Time

package/legacy/DateTimePicker/DateTimePickerToolbar.js

@@ -352,6 +352,9 @@ process.env.NODE_ENV !== "production" ? DateTimePickerToolbar.propTypes = {
    */
   onViewChange: PropTypes.func.isRequired,
   readOnly: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   titleId: PropTypes.string,
   /**

package/legacy/PickersLayout/PickersLayout.js

@@ -120,6 +120,9 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
   children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: PropTypes.object,
   className: PropTypes.string,
   /**
@@ -162,6 +165,9 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
    * @default {}
    */
   slots: PropTypes.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   value: PropTypes.any,
   view: PropTypes.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']),

package/legacy/TimePicker/TimePickerToolbar.js

@@ -1,8 +1,9 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-var _excluded = ["ampm", "ampmInClock", "value", "isLandscape", "onChange", "view", "onViewChange", "views", "disabled", "readOnly"];
+var _excluded = ["ampm", "ampmInClock", "value", "isLandscape", "onChange", "view", "onViewChange", "views", "disabled", "readOnly", "className"];
 import * as React from 'react';
+import clsx from 'clsx';
 import PropTypes from 'prop-types';
 import { useTheme, styled, useThemeProps } from '@mui/material/styles';
 import { unstable_composeClasses as composeClasses } from '@mui/utils';
@@ -132,6 +133,7 @@ function TimePickerToolbar(inProps) {
     views = props.views,
     disabled = props.disabled,
     readOnly = props.readOnly,
+    className = props.className,
     other = _objectWithoutProperties(props, _excluded);
   var utils = useUtils();
   var localeText = useLocaleText();
@@ -159,7 +161,7 @@ function TimePickerToolbar(inProps) {
     toolbarTitle: localeText.timePickerToolbarTitle,
     isLandscape: isLandscape,
     ownerState: ownerState,
-    className: classes.root
+    className: clsx(classes.root, className)
   }, other, {
     children: [/*#__PURE__*/_jsxs(TimePickerToolbarHourMinuteLabel, {
       className: classes.hourMinuteLabel,
@@ -222,6 +224,9 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
   // ----------------------------------------------------------------------
   ampm: PropTypes.bool,
   ampmInClock: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: PropTypes.object,
   /**
    * className applied to the root component.
@@ -242,6 +247,9 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
    */
   onViewChange: PropTypes.func.isRequired,
   readOnly: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   titleId: PropTypes.string,
   /**

package/legacy/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers v6.19.4
+ * @mui/x-date-pickers v6.19.6
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/legacy/locales/koKR.js

@@ -61,8 +61,7 @@ var koKRPickers = {
   openTimePickerDialogue: function openTimePickerDialogue(value, utils) {
     return value !== null && utils.isValid(value) ? "\uC2DC\uAC04\uC744 \uC120\uD0DD\uD558\uC138\uC694. \uD604\uC7AC \uC120\uD0DD\uB41C \uC2DC\uAC04\uC740 ".concat(utils.format(value, 'fullTime'), "\uC785\uB2C8\uB2E4.") : '시간을 선택하세요';
   },
-  // fieldClearLabel: 'Clear value',
-
+  fieldClearLabel: '지우기',
   // Table labels
   timeTableLabel: '선택한 시간',
   dateTableLabel: '선택한 날짜',

package/legacy/locales/zhCN.js

@@ -3,7 +3,7 @@ var views = {
   hours: '小时',
   minutes: '分钟',
   seconds: '秒',
-  meridiem: '子午线'
+  meridiem: '十二小时制'
 };
 var zhCNPickers = {
   // Calendar navigation
@@ -61,8 +61,7 @@ var zhCNPickers = {
   openTimePickerDialogue: function openTimePickerDialogue(value, utils) {
     return value !== null && utils.isValid(value) ? "\u9009\u62E9\u65F6\u95F4\uFF0C\u5DF2\u9009\u62E9".concat(utils.format(value, 'fullTime')) : '选择时间';
   },
-  // fieldClearLabel: 'Clear value',
-
+  fieldClearLabel: '清除',
   // Table labels
   timeTableLabel: '选择时间',
   dateTableLabel: '选择日期',

package/locales/koKR.js

@@ -41,8 +41,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
@@ -41,8 +41,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: '选择日期',

package/modern/DateCalendar/DateCalendar.js

@@ -360,6 +360,9 @@ process.env.NODE_ENV !== "production" ? DateCalendar.propTypes = {
    * - the `input` element if there is a field rendered.
    */
   autoFocus: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: PropTypes.object,
   className: PropTypes.string,
   /**

package/modern/DateCalendar/useCalendarState.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
 import { useIsDateDisabled } from './useIsDateDisabled';
-import { useUtils, useNow } from '../internals/hooks/useUtils';
+import { useUtils } from '../internals/hooks/useUtils';
 import { singleItemValueManager } from '../internals/utils/valueManagers';
 import { SECTION_TYPE_GRANULARITY } from '../internals/utils/getDefaultReferenceDate';
 export const createCalendarStateReducer = (reduceAnimations, disableSwitchToMonthOnDayFocus, utils) => (state, action) => {
@@ -49,7 +49,6 @@ export const useCalendarState = params => {
     shouldDisableDate,
     timezone
   } = params;
-  const now = useNow(timezone);
   const utils = useUtils();
   const reducerFn = React.useRef(createCalendarStateReducer(Boolean(reduceAnimations), disableSwitchToMonthOnDayFocus, utils)).current;
   const referenceDate = React.useMemo(() => {
@@ -72,7 +71,7 @@ export const useCalendarState = params => {
   );
   const [calendarState, dispatch] = React.useReducer(reducerFn, {
     isMonthSwitchingAnimating: false,
-    focusedDay: utils.isValid(value) ? value : now,
+    focusedDay: referenceDate,
     currentMonth: utils.startOfMonth(referenceDate),
     slideDirection: 'left'
   });

package/modern/DatePicker/DatePickerToolbar.js

@@ -1,7 +1,8 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["value", "isLandscape", "onChange", "toolbarFormat", "toolbarPlaceholder", "views"];
+const _excluded = ["value", "isLandscape", "onChange", "toolbarFormat", "toolbarPlaceholder", "views", "className"];
 import * as React from 'react';
+import clsx from 'clsx';
 import PropTypes from 'prop-types';
 import Typography from '@mui/material/Typography';
 import { styled, useThemeProps } from '@mui/material/styles';
@@ -55,7 +56,8 @@ export const DatePickerToolbar = /*#__PURE__*/React.forwardRef(function DatePick
       isLandscape,
       toolbarFormat,
       toolbarPlaceholder = '––',
-      views
+      views,
+      className
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const utils = useUtils();
@@ -76,7 +78,7 @@ export const DatePickerToolbar = /*#__PURE__*/React.forwardRef(function DatePick
     ref: ref,
     toolbarTitle: localeText.datePickerToolbarTitle,
     isLandscape: isLandscape,
-    className: classes.root
+    className: clsx(classes.root, className)
   }, other, {
     children: /*#__PURE__*/_jsx(DatePickerToolbarTitle, {
       variant: "h4",
@@ -92,6 +94,9 @@ process.env.NODE_ENV !== "production" ? DatePickerToolbar.propTypes = {
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: PropTypes.object,
   /**
    * className applied to the root component.
@@ -112,6 +117,9 @@ process.env.NODE_ENV !== "production" ? DatePickerToolbar.propTypes = {
    */
   onViewChange: PropTypes.func.isRequired,
   readOnly: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   titleId: PropTypes.string,
   /**

package/modern/DateTimePicker/DateTimePickerTabs.js

@@ -70,7 +70,8 @@ const DateTimePickerTabs = function DateTimePickerTabs(inProps) {
     timeIcon = /*#__PURE__*/_jsx(TimeIcon, {}),
     view,
     hidden = typeof window === 'undefined' || window.innerHeight < 667,
-    className
+    className,
+    sx
   } = props;
   const localeText = useLocaleText();
   const classes = useUtilityClasses(props);
@@ -86,6 +87,7 @@ const DateTimePickerTabs = function DateTimePickerTabs(inProps) {
     value: viewToTab(view),
     onChange: handleChange,
     className: clsx(className, classes.root),
+    sx: sx,
     children: [/*#__PURE__*/_jsx(Tab, {
       value: "date",
       "aria-label": localeText.dateTableLabel,
@@ -127,6 +129,10 @@ process.env.NODE_ENV !== "production" ? DateTimePickerTabs.propTypes = {
    * @param {TView} view The view to open
    */
   onViewChange: PropTypes.func.isRequired,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   /**
    * Time tab icon.
    * @default Time

package/modern/DateTimePicker/DateTimePickerToolbar.js

@@ -327,6 +327,9 @@ process.env.NODE_ENV !== "production" ? DateTimePickerToolbar.propTypes = {
    */
   onViewChange: PropTypes.func.isRequired,
   readOnly: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   titleId: PropTypes.string,
   /**

package/modern/PickersLayout/PickersLayout.js

@@ -122,6 +122,9 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
   children: PropTypes.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: PropTypes.object,
   className: PropTypes.string,
   /**
@@ -164,6 +167,9 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
    * @default {}
    */
   slots: PropTypes.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   value: PropTypes.any,
   view: PropTypes.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']),

package/modern/TimePicker/TimePickerToolbar.js

@@ -1,7 +1,8 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["ampm", "ampmInClock", "value", "isLandscape", "onChange", "view", "onViewChange", "views", "disabled", "readOnly"];
+const _excluded = ["ampm", "ampmInClock", "value", "isLandscape", "onChange", "view", "onViewChange", "views", "disabled", "readOnly", "className"];
 import * as React from 'react';
+import clsx from 'clsx';
 import PropTypes from 'prop-types';
 import { useTheme, styled, useThemeProps } from '@mui/material/styles';
 import { unstable_composeClasses as composeClasses } from '@mui/utils';
@@ -132,7 +133,8 @@ function TimePickerToolbar(inProps) {
       onViewChange,
       views,
       disabled,
-      readOnly
+      readOnly,
+      className
     } = props,
     other = _objectWithoutPropertiesLoose(props, _excluded);
   const utils = useUtils();
@@ -160,7 +162,7 @@ function TimePickerToolbar(inProps) {
     toolbarTitle: localeText.timePickerToolbarTitle,
     isLandscape: isLandscape,
     ownerState: ownerState,
-    className: classes.root
+    className: clsx(classes.root, className)
   }, other, {
     children: [/*#__PURE__*/_jsxs(TimePickerToolbarHourMinuteLabel, {
       className: classes.hourMinuteLabel,
@@ -213,6 +215,9 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
   // ----------------------------------------------------------------------
   ampm: PropTypes.bool,
   ampmInClock: PropTypes.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: PropTypes.object,
   /**
    * className applied to the root component.
@@ -233,6 +238,9 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
    */
   onViewChange: PropTypes.func.isRequired,
   readOnly: PropTypes.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   titleId: PropTypes.string,
   /**

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers v6.19.4
+ * @mui/x-date-pickers v6.19.6
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/modern/locales/koKR.js

@@ -41,8 +41,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
@@ -41,8 +41,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: '选择日期',

package/node/DateCalendar/DateCalendar.js

@@ -368,6 +368,9 @@ process.env.NODE_ENV !== "production" ? DateCalendar.propTypes = {
    * - the `input` element if there is a field rendered.
    */
   autoFocus: _propTypes.default.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: _propTypes.default.object,
   className: _propTypes.default.string,
   /**

package/node/DateCalendar/useCalendarState.js

@@ -59,7 +59,6 @@ const useCalendarState = params => {
     shouldDisableDate,
     timezone
   } = params;
-  const now = (0, _useUtils.useNow)(timezone);
   const utils = (0, _useUtils.useUtils)();
   const reducerFn = React.useRef(createCalendarStateReducer(Boolean(reduceAnimations), disableSwitchToMonthOnDayFocus, utils)).current;
   const referenceDate = React.useMemo(() => {
@@ -82,7 +81,7 @@ const useCalendarState = params => {
   );
   const [calendarState, dispatch] = React.useReducer(reducerFn, {
     isMonthSwitchingAnimating: false,
-    focusedDay: utils.isValid(value) ? value : now,
+    focusedDay: referenceDate,
     currentMonth: utils.startOfMonth(referenceDate),
     slideDirection: 'left'
   });

package/node/DatePicker/DatePickerToolbar.js

@@ -8,6 +8,7 @@ exports.DatePickerToolbar = 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"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
 var _styles = require("@mui/material/styles");
@@ -17,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"];
+const _excluded = ["value", "isLandscape", "onChange", "toolbarFormat", "toolbarPlaceholder", "views", "className"];
 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 => {
@@ -64,7 +65,8 @@ const DatePickerToolbar = exports.DatePickerToolbar = /*#__PURE__*/React.forward
       isLandscape,
       toolbarFormat,
       toolbarPlaceholder = '––',
-      views
+      views,
+      className
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const utils = (0, _useUtils.useUtils)();
@@ -85,7 +87,7 @@ const DatePickerToolbar = exports.DatePickerToolbar = /*#__PURE__*/React.forward
     ref: ref,
     toolbarTitle: localeText.datePickerToolbarTitle,
     isLandscape: isLandscape,
-    className: classes.root
+    className: (0, _clsx.default)(classes.root, className)
   }, other, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(DatePickerToolbarTitle, {
       variant: "h4",
@@ -101,6 +103,9 @@ process.env.NODE_ENV !== "production" ? DatePickerToolbar.propTypes = {
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: _propTypes.default.object,
   /**
    * className applied to the root component.
@@ -121,6 +126,9 @@ process.env.NODE_ENV !== "production" ? DatePickerToolbar.propTypes = {
    */
   onViewChange: _propTypes.default.func.isRequired,
   readOnly: _propTypes.default.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
   titleId: _propTypes.default.string,
   /**

package/node/DateTimePicker/DateTimePickerTabs.js

@@ -78,7 +78,8 @@ const DateTimePickerTabs = exports.DateTimePickerTabs = function DateTimePickerT
     timeIcon = /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.TimeIcon, {}),
     view,
     hidden = typeof window === 'undefined' || window.innerHeight < 667,
-    className
+    className,
+    sx
   } = props;
   const localeText = (0, _useUtils.useLocaleText)();
   const classes = useUtilityClasses(props);
@@ -94,6 +95,7 @@ const DateTimePickerTabs = exports.DateTimePickerTabs = function DateTimePickerT
     value: viewToTab(view),
     onChange: handleChange,
     className: (0, _clsx.default)(className, classes.root),
+    sx: sx,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tab.default, {
       value: "date",
       "aria-label": localeText.dateTableLabel,
@@ -135,6 +137,10 @@ process.env.NODE_ENV !== "production" ? DateTimePickerTabs.propTypes = {
    * @param {TView} view The view to open
    */
   onViewChange: _propTypes.default.func.isRequired,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
   /**
    * Time tab icon.
    * @default Time

package/node/DateTimePicker/DateTimePickerToolbar.js

@@ -335,6 +335,9 @@ process.env.NODE_ENV !== "production" ? DateTimePickerToolbar.propTypes = {
    */
   onViewChange: _propTypes.default.func.isRequired,
   readOnly: _propTypes.default.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
   titleId: _propTypes.default.string,
   /**

package/node/PickersLayout/PickersLayout.js

@@ -129,6 +129,9 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
   children: _propTypes.default.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: _propTypes.default.object,
   className: _propTypes.default.string,
   /**
@@ -171,6 +174,9 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
    * @default {}
    */
   slots: _propTypes.default.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
   value: _propTypes.default.any,
   view: _propTypes.default.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']),

package/node/TimePicker/TimePickerToolbar.js

@@ -8,6 +8,7 @@ exports.TimePickerToolbar = TimePickerToolbar;
 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"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _styles = require("@mui/material/styles");
 var _utils = require("@mui/utils");
@@ -20,7 +21,7 @@ var _dateHelpersHooks = require("../internals/hooks/date-helpers-hooks");
 var _timePickerToolbarClasses = require("./timePickerToolbarClasses");
 var _dateUtils = require("../internals/utils/date-utils");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["ampm", "ampmInClock", "value", "isLandscape", "onChange", "view", "onViewChange", "views", "disabled", "readOnly"];
+const _excluded = ["ampm", "ampmInClock", "value", "isLandscape", "onChange", "view", "onViewChange", "views", "disabled", "readOnly", "className"];
 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 => {
@@ -140,7 +141,8 @@ function TimePickerToolbar(inProps) {
       onViewChange,
       views,
       disabled,
-      readOnly
+      readOnly,
+      className
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const utils = (0, _useUtils.useUtils)();
@@ -168,7 +170,7 @@ function TimePickerToolbar(inProps) {
     toolbarTitle: localeText.timePickerToolbarTitle,
     isLandscape: isLandscape,
     ownerState: ownerState,
-    className: classes.root
+    className: (0, _clsx.default)(classes.root, className)
   }, other, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(TimePickerToolbarHourMinuteLabel, {
       className: classes.hourMinuteLabel,
@@ -221,6 +223,9 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
   // ----------------------------------------------------------------------
   ampm: _propTypes.default.bool,
   ampmInClock: _propTypes.default.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
   classes: _propTypes.default.object,
   /**
    * className applied to the root component.
@@ -241,6 +246,9 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
    */
   onViewChange: _propTypes.default.func.isRequired,
   readOnly: _propTypes.default.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
   sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
   titleId: _propTypes.default.string,
   /**

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers v6.19.4
+ * @mui/x-date-pickers v6.19.6
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/node/locales/koKR.js

@@ -47,8 +47,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: '선택한 날짜',