@mui/lab 5.0.0-alpha.52 → 5.0.0-alpha.56

package/node/TimelineSeparator/timelineSeparatorClasses.js

@@ -6,12 +6,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 exports.getTimelineSeparatorUtilityClass = getTimelineSeparatorUtilityClass;
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");
 
 function getTimelineSeparatorUtilityClass(slot) {
-  return (0, _core.generateUtilityClass)('MuiTimelineSeparator', slot);
+  return (0, _base.generateUtilityClass)('MuiTimelineSeparator', slot);
 }
 
-const timelineSeparatorClasses = (0, _core.generateUtilityClasses)('MuiTimelineSeparator', ['root']);
+const timelineSeparatorClasses = (0, _base.generateUtilityClasses)('MuiTimelineSeparator', ['root']);
 var _default = timelineSeparatorClasses;
 exports.default = _default;

package/node/TreeItem/TreeItem.js

@@ -25,7 +25,7 @@ var _styles = require("@mui/material/styles");
 
 var _utils2 = require("@mui/material/utils");
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");
 
 var _TreeViewContext = _interopRequireDefault(require("../TreeView/TreeViewContext"));
 
@@ -58,7 +58,7 @@ const useUtilityClasses = ownerState => {
     label: ['label'],
     group: ['group']
   };
-  return (0, _core.unstable_composeClasses)(slots, _treeItemClasses.getTreeItemUtilityClass, classes);
+  return (0, _base.unstable_composeClasses)(slots, _treeItemClasses.getTreeItemUtilityClass, classes);
 };
 
 const TreeItemRoot = (0, _styles.styled)('li', {
@@ -428,7 +428,7 @@ process.env.NODE_ENV !== "production" ? TreeItem.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object]),
+  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object])), _propTypes.default.func, _propTypes.default.object]),
 
   /**
    * The component used for the transition.

package/node/TreeItem/treeItemClasses.js

@@ -6,12 +6,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 exports.getTreeItemUtilityClass = getTreeItemUtilityClass;
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");
 
 function getTreeItemUtilityClass(slot) {
-  return (0, _core.generateUtilityClass)('MuiTreeItem', slot);
+  return (0, _base.generateUtilityClass)('MuiTreeItem', slot);
 }
 
-const treeItemClasses = (0, _core.generateUtilityClasses)('MuiTreeItem', ['root', 'group', 'content', 'expanded', 'selected', 'focused', 'disabled', 'iconContainer', 'label']);
+const treeItemClasses = (0, _base.generateUtilityClasses)('MuiTreeItem', ['root', 'group', 'content', 'expanded', 'selected', 'focused', 'disabled', 'iconContainer', 'label']);
 var _default = treeItemClasses;
 exports.default = _default;

package/node/TreeView/TreeView.js

@@ -19,7 +19,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _styles = require("@mui/material/styles");
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");
 
 var _utils = require("@mui/material/utils");
 
@@ -44,7 +44,7 @@ const useUtilityClasses = ownerState => {
   const slots = {
     root: ['root']
   };
-  return (0, _core.unstable_composeClasses)(slots, _treeViewClasses.getTreeViewUtilityClass, classes);
+  return (0, _base.unstable_composeClasses)(slots, _treeViewClasses.getTreeViewUtilityClass, classes);
 };
 
 const TreeViewRoot = (0, _styles.styled)('ul', {
@@ -992,7 +992,7 @@ process.env.NODE_ENV !== "production" ? TreeView.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object])
+  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object])), _propTypes.default.func, _propTypes.default.object])
 } : void 0;
 var _default = TreeView;
 exports.default = _default;

package/node/TreeView/treeViewClasses.js

@@ -6,12 +6,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 exports.getTreeViewUtilityClass = getTreeViewUtilityClass;
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");
 
 function getTreeViewUtilityClass(slot) {
-  return (0, _core.generateUtilityClass)('MuiTreeView', slot);
+  return (0, _base.generateUtilityClass)('MuiTreeView', slot);
 }
 
-const treeViewClasses = (0, _core.generateUtilityClasses)('MuiTreeView', ['root']);
+const treeViewClasses = (0, _base.generateUtilityClasses)('MuiTreeView', ['root']);
 var _default = treeViewClasses;
 exports.default = _default;

package/node/YearPicker/PickersYear.js

@@ -19,7 +19,7 @@ var _utils = require("@mui/material/utils");
 
 var _styles = require("@mui/material/styles");
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");
 
 var _WrapperVariantContext = require("../internal/pickers/wrappers/WrapperVariantContext");
 
@@ -30,10 +30,10 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 function getPickersYearUtilityClass(slot) {
-  return (0, _core.generateUtilityClass)('PrivatePickersYear', slot);
+  return (0, _base.generateUtilityClass)('PrivatePickersYear', slot);
 }
 
-const pickersYearClasses = (0, _core.generateUtilityClasses)('PrivatePickersYear', ['root', 'modeMobile', 'modeDesktop', 'yearButton', 'disabled', 'selected']);
+const pickersYearClasses = (0, _base.generateUtilityClasses)('PrivatePickersYear', ['root', 'modeMobile', 'modeDesktop', 'yearButton', 'disabled', 'selected']);
 exports.pickersYearClasses = pickersYearClasses;
 
 const useUtilityClasses = ownerState => {
@@ -47,7 +47,7 @@ const useUtilityClasses = ownerState => {
     root: ['root', wrapperVariant && `mode${(0, _utils.capitalize)(wrapperVariant)}`],
     yearButton: ['yearButton', disabled && 'disabled', selected && 'selected']
   };
-  return (0, _core.unstable_composeClasses)(slots, getPickersYearUtilityClass, classes);
+  return (0, _base.unstable_composeClasses)(slots, getPickersYearUtilityClass, classes);
 };
 
 const PickersYearRoot = (0, _styles.styled)('div', {
@@ -75,7 +75,7 @@ const PickersYearButton = (0, _styles.styled)('button', {
   margin: '8px 0',
   height: 36,
   width: 72,
-  borderRadius: 16,
+  borderRadius: 18,
   cursor: 'pointer',
   '&:focus, &:hover': {
     backgroundColor: (0, _styles.alpha)(theme.palette.action.active, theme.palette.action.hoverOpacity)

package/node/YearPicker/YearPicker.js

@@ -13,7 +13,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _styles = require("@mui/material/styles");
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");
 
 var _clsx = _interopRequireDefault(require("clsx"));
 
@@ -40,7 +40,7 @@ const useUtilityClasses = ownerState => {
   const slots = {
     root: ['root']
   };
-  return (0, _core.unstable_composeClasses)(slots, _yearPickerClasses.getYearPickerUtilityClass, classes);
+  return (0, _base.unstable_composeClasses)(slots, _yearPickerClasses.getYearPickerUtilityClass, classes);
 };
 
 const YearPickerRoot = (0, _styles.styled)('div', {
@@ -64,6 +64,7 @@ const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inProps, re
     autoFocus,
     className,
     date,
+    disabled,
     disableFuture,
     disablePast,
     isDateDisabled,
@@ -72,6 +73,7 @@ const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inProps, re
     onChange,
     onFocusedDayChange,
     onYearChange,
+    readOnly,
     shouldDisableYear
   } = props;
   const ownerState = props;
@@ -86,6 +88,10 @@ const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inProps, re
   const [focusedYear, setFocusedYear] = React.useState(currentYear);
 
   const handleYearSelection = (event, year, isFinish = 'finish') => {
+    if (readOnly) {
+      return;
+    }
+
     const submitDate = newDate => {
       onChange(newDate, isFinish);
 
@@ -164,7 +170,7 @@ const YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inProps, re
         onKeyDown: handleKeyDown,
         autoFocus: autoFocus && yearNumber === focusedYear,
         ref: selected ? selectedYearRef : undefined,
-        disabled: disablePast && utils.isBeforeYear(year, now) || disableFuture && utils.isAfterYear(year, now) || shouldDisableYear && shouldDisableYear(year),
+        disabled: disabled || disablePast && utils.isBeforeYear(year, now) || disableFuture && utils.isAfterYear(year, now) || shouldDisableYear && shouldDisableYear(year),
         children: utils.format(year, 'year')
       }, utils.format(year, 'year'));
     })
@@ -198,6 +204,11 @@ process.env.NODE_ENV !== "production" ? YearPicker.propTypes
    */
   date: _propTypes.default.any,
 
+  /**
+   * @ignore
+   */
+  disabled: _propTypes.default.bool,
+
   /**
    * @ignore
    */
@@ -238,6 +249,11 @@ process.env.NODE_ENV !== "production" ? YearPicker.propTypes
    */
   onYearChange: _propTypes.default.func,
 
+  /**
+   * @ignore
+   */
+  readOnly: _propTypes.default.bool,
+
   /**
    * Disable specific years dynamically.
    * Works like `shouldDisableDate` but for year selection view @DateIOType.

package/node/YearPicker/yearPickerClasses.js

@@ -6,12 +6,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 exports.getYearPickerUtilityClass = getYearPickerUtilityClass;
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");
 
 function getYearPickerUtilityClass(slot) {
-  return (0, _core.generateUtilityClass)('MuiYearPicker', slot);
+  return (0, _base.generateUtilityClass)('MuiYearPicker', slot);
 }
 
-const yearPickerClasses = (0, _core.generateUtilityClasses)('MuiYearPicker', ['root']);
+const yearPickerClasses = (0, _base.generateUtilityClasses)('MuiYearPicker', ['root']);
 var _default = yearPickerClasses;
 exports.default = _default;

package/node/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.0.0-alpha.52
+/** @license MUI v5.0.0-alpha.56
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -61,7 +61,8 @@ var _exportNames = {
   TreeItem: true,
   TreeView: true,
   YearPicker: true,
-  useAutocomplete: true
+  useAutocomplete: true,
+  Masonry: true
 };
 Object.defineProperty(exports, "Alert", {
   enumerable: true,
@@ -165,6 +166,12 @@ Object.defineProperty(exports, "LocalizationProvider", {
     return _LocalizationProvider.default;
   }
 });
+Object.defineProperty(exports, "Masonry", {
+  enumerable: true,
+  get: function () {
+    return _Masonry.default;
+  }
+});
 Object.defineProperty(exports, "MobileDatePicker", {
   enumerable: true,
   get: function () {
@@ -1072,6 +1079,20 @@ Object.keys(_YearPicker).forEach(function (key) {
 
 var _useAutocomplete = _interopRequireDefault(require("./useAutocomplete"));
 
+var _Masonry = _interopRequireWildcard(require("./Masonry"));
+
+Object.keys(_Masonry).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Masonry[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _Masonry[key];
+    }
+  });
+});
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/node/internal/pickers/PickersToolbar.js

@@ -21,7 +21,7 @@ var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 
 var _styles = require("@mui/material/styles");
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");
 
 var _Pen = _interopRequireDefault(require("../svg-icons/Pen"));
 
@@ -37,7 +37,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const classes = (0, _core.generateUtilityClasses)('PrivatePickersToolbar', ['root', 'dateTitleContainer']);
+const classes = (0, _base.generateUtilityClasses)('PrivatePickersToolbar', ['root', 'dateTitleContainer']);
 const PickersToolbarRoot = (0, _styles.styled)('div', {
   skipSx: true
 })(({

package/node/internal/pickers/PickersToolbarText.js

@@ -19,7 +19,7 @@ var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
 
 var _styles = require("@mui/material/styles");
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
@@ -29,7 +29,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const classes = (0, _core.generateUtilityClasses)('PrivatePickersToolbarText', ['selected']);
+const classes = (0, _base.generateUtilityClasses)('PrivatePickersToolbarText', ['selected']);
 const PickersToolbarTextRoot = (0, _styles.styled)(_Typography.default, {
   skipSx: true
 })(({

package/node/internal/pickers/test-utils.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.adapterToUse = exports.FakeTransitionComponent = exports.AdapterClassToUse = void 0;
-exports.createPickerRender = createPickerRender;
+exports.createPickerRenderer = createPickerRenderer;
 exports.openMobilePicker = openMobilePicker;
 exports.wrapPickerMount = wrapPickerMount;
 
@@ -85,12 +85,15 @@ function wrapPickerMount(mount) {
   }));
 }
 
-function createPickerRender(_ref = {}) {
+function createPickerRenderer(_ref = {}) {
   let {
     locale
   } = _ref,
-      renderOptions = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
-  const clientRender = (0, _utils.createClientRender)(renderOptions);
+      createRendererOptions = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
+  const {
+    clock,
+    render: clientRender
+  } = (0, _utils.createRenderer)(createRendererOptions);
 
   function Wrapper({
     children
@@ -102,9 +105,16 @@ function createPickerRender(_ref = {}) {
     });
   }
 
-  return (node, options) => clientRender(node, (0, _extends2.default)({}, options, {
-    wrapper: Wrapper
-  }));
+  return {
+    clock,
+
+    render(node, options) {
+      return clientRender(node, (0, _extends2.default)({}, options, {
+        wrapper: Wrapper
+      }));
+    }
+
+  };
 }
 
 function openMobilePicker() {

package/node/useAutocomplete/index.js

@@ -6,14 +6,14 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "createFilterOptions", {
   enumerable: true,
   get: function () {
-    return _core.createFilterOptions;
+    return _base.createFilterOptions;
   }
 });
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function () {
-    return _core.useAutocomplete;
+    return _base.useAutocomplete;
   }
 });
 
-var _core = require("@mui/core");
+var _base = require("@mui/base");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/lab",
-  "version": "5.0.0-alpha.52",
+  "version": "5.0.0-alpha.56",
   "private": false,
   "author": "MUI Team",
   "description": "Laboratory for new MUI modules.",
@@ -8,6 +8,7 @@
   "keywords": [
     "react",
     "react-component",
+    "mui",
     "material-ui",
     "material design",
     "lab"
@@ -27,7 +28,7 @@
     "@types/react": "^16.8.6 || ^17.0.0",
     "date-fns": "^2.25.0",
     "dayjs": "^1.10.7",
-    "luxon": "^1.28.0",
+    "luxon": "^1.28.0 || ^2.0.0",
     "moment": "^2.29.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
@@ -50,14 +51,14 @@
     }
   },
   "dependencies": {
-    "@babel/runtime": "^7.15.4",
+    "@babel/runtime": "^7.16.3",
     "@date-io/date-fns": "^2.11.0",
     "@date-io/dayjs": "^2.11.0",
     "@date-io/luxon": "^2.11.1",
     "@date-io/moment": "^2.11.0",
-    "@mui/core": "5.0.0-alpha.52",
-    "@mui/system": "^5.0.5",
-    "@mui/utils": "^5.0.1",
+    "@mui/base": "5.0.0-alpha.56",
+    "@mui/system": "^5.2.0",
+    "@mui/utils": "^5.2.0",
     "clsx": "^1.1.1",
     "prop-types": "^15.7.2",
     "react-is": "^17.0.2",

package/themeAugmentation/components.d.ts

@@ -16,11 +16,21 @@ export interface LabComponents {
     styleOverrides?: ComponentsOverrides['MuiClockPicker'];
     variants?: ComponentsVariants['MuiClockPicker'];
   };
+  MuiDatePicker?: {
+    defaultProps?: ComponentsProps['MuiDatePicker'];
+    styleOverrides?: ComponentsOverrides['MuiDatePicker'];
+    variants?: ComponentsVariants['MuiDatePicker'];
+  };
   MuiDateRangePickerDay?: {
     defaultProps?: ComponentsProps['MuiDateRangePickerDay'];
     styleOverrides?: ComponentsOverrides['MuiDateRangePickerDay'];
     variants?: ComponentsVariants['MuiDateRangePickerDay'];
   };
+  MuiDateTimePicker?: {
+    defaultProps?: ComponentsProps['MuiDateTimePicker'];
+    styleOverrides?: ComponentsOverrides['MuiDateTimePicker'];
+    variants?: ComponentsVariants['MuiDateTimePicker'];
+  };
   MuiLoadingButton?: {
     defaultProps?: ComponentsProps['MuiLoadingButton'];
     styleOverrides?: ComponentsOverrides['MuiLoadingButton'];

package/useAutocomplete/index.d.ts

@@ -1 +1 @@
-export { useAutocomplete as default } from '@mui/core';
+export { useAutocomplete as default } from '@mui/base';

package/useAutocomplete/index.js

@@ -1 +1 @@
-export { useAutocomplete as default, createFilterOptions } from '@mui/core';
+export { useAutocomplete as default, createFilterOptions } from '@mui/base';