@mui/material 5.8.6 → 5.9.1

package/Unstable_Grid2/Grid2.js

@@ -0,0 +1,34 @@
+import PropTypes from 'prop-types';
+import { createGrid } from '@mui/system/Unstable_Grid';
+import { styled, useThemeProps } from '../styles';
+const Grid2 = createGrid({
+  createStyledComponent: styled('div', {
+    name: 'MuiGrid2',
+    overridesResolver: (props, styles) => styles.root
+  }),
+  componentName: 'MuiGrid2',
+  // eslint-disable-next-line material-ui/mui-name-matches-component-name
+  useThemeProps: inProps => useThemeProps({
+    props: inProps,
+    name: 'MuiGrid2'
+  })
+});
+process.env.NODE_ENV !== "production" ? Grid2.propTypes
+/* remove-proptypes */
+= {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+
+  /**
+   * @ignore
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default Grid2;

package/Unstable_Grid2/Grid2Props.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { OverrideProps } from '@mui/types';
+import { SxProps, SystemProps } from '@mui/system';
+import { GridBaseProps } from '@mui/system/Unstable_Grid';
+import { Theme } from '../styles';
+export declare type Grid2Slot = 'root';
+export interface Grid2TypeMap<P = {}, D extends React.ElementType = 'div'> {
+    props: P & GridBaseProps & {
+        sx?: SxProps<Theme>;
+    } & SystemProps<Theme>;
+    defaultComponent: D;
+}
+export declare type Grid2Props<D extends React.ElementType = Grid2TypeMap['defaultComponent'], P = {
+    component?: React.ElementType;
+}> = OverrideProps<Grid2TypeMap<P, D>, D>;

package/Unstable_Grid2/Grid2Props.js

@@ -0,0 +1 @@
+export {};

package/Unstable_Grid2/grid2Classes.d.ts

@@ -0,0 +1,5 @@
+import { GridClasses } from '@mui/system/Unstable_Grid';
+export declare type Grid2ClassKey = keyof GridClasses;
+export declare function getGrid2UtilityClass(slot: string): string;
+declare const grid2Classes: GridClasses;
+export default grid2Classes;

package/Unstable_Grid2/grid2Classes.js

@@ -0,0 +1,14 @@
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
+export function getGrid2UtilityClass(slot) {
+  return generateUtilityClass('MuiGrid2', slot);
+}
+const SPACINGS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
+const DIRECTIONS = ['column-reverse', 'column', 'row-reverse', 'row'];
+const WRAPS = ['nowrap', 'wrap-reverse', 'wrap'];
+const GRID_SIZES = ['auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
+const grid2Classes = generateUtilityClasses('MuiGrid2', ['root', 'container', 'item', 'zeroMinWidth', // spacings
+...SPACINGS.map(spacing => `spacing-xs-${spacing}`), // direction values
+...DIRECTIONS.map(direction => `direction-xs-${direction}`), // wrap values
+...WRAPS.map(wrap => `wrap-xs-${wrap}`), // grid sizes for all breakpoints
+...GRID_SIZES.map(size => `grid-xs-${size}`), ...GRID_SIZES.map(size => `grid-sm-${size}`), ...GRID_SIZES.map(size => `grid-md-${size}`), ...GRID_SIZES.map(size => `grid-lg-${size}`), ...GRID_SIZES.map(size => `grid-xl-${size}`)]);
+export default grid2Classes;

package/Unstable_Grid2/index.d.ts

@@ -0,0 +1,4 @@
+export { default } from './Grid2';
+export * from './Grid2Props';
+export { default as grid2Classes } from './grid2Classes';
+export * from './grid2Classes';

package/Unstable_Grid2/index.js

@@ -0,0 +1,4 @@
+export { default } from './Grid2';
+export * from './Grid2Props';
+export { default as grid2Classes } from './grid2Classes';
+export * from './grid2Classes';

package/Unstable_Grid2/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "main": "../node/Unstable_Grid2/index.js",
+  "types": "./index.d.ts"
+}

package/index.d.ts

@@ -224,6 +224,9 @@ export * from './FormLabel';
 export { default as Grid } from './Grid';
 export * from './Grid';
 
+export { default as Unstable_Grid2 } from './Unstable_Grid2';
+export * from './Unstable_Grid2';
+
 export { default as Grow } from './Grow';
 export * from './Grow';
 

package/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.8.6
+/** @license MUI v5.9.1
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -106,6 +106,8 @@ export { default as FormLabel } from './FormLabel';
 export * from './FormLabel';
 export { default as Grid } from './Grid';
 export * from './Grid';
+export { default as Unstable_Grid2 } from './Unstable_Grid2';
+export * from './Unstable_Grid2';
 export { default as Grow } from './Grow';
 export * from './Grow';
 export { default as Hidden } from './Hidden';

package/legacy/Autocomplete/Autocomplete.js

@@ -316,7 +316,7 @@ var AutocompleteGroupUl = styled('ul', {
 }));
 export { createFilterOptions };
 var Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps, ref) {
-  var _componentsProps$clea, _componentsProps$pape;
+  var _componentsProps$clea, _componentsProps$popu, _componentsProps$popp, _componentsProps$pape;
 
   var props = useThemeProps({
     props: inProps,
@@ -477,7 +477,7 @@ var Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps,
   if (multiple && value.length > 0) {
     var getCustomizedTagProps = function getCustomizedTagProps(params) {
       return _extends({
-        className: clsx(classes.tag),
+        className: classes.tag,
         disabled: disabled
       }, getTagProps(params));
     };
@@ -577,21 +577,21 @@ var Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps,
               disabled: disabled,
               "aria-label": popupOpen ? closeText : openText,
               title: popupOpen ? closeText : openText,
-              className: clsx(classes.popupIndicator),
-              ownerState: ownerState,
+              ownerState: ownerState
+            }, componentsProps.popupIndicator, {
+              className: clsx(classes.popupIndicator, (_componentsProps$popu = componentsProps.popupIndicator) == null ? void 0 : _componentsProps$popu.className),
               children: popupIcon
             })) : null]
           })
         }),
         inputProps: _extends({
-          className: clsx(classes.input),
+          className: classes.input,
           disabled: disabled,
           readOnly: readOnly
         }, getInputProps())
       })
-    })), popupOpen && anchorEl ? /*#__PURE__*/_jsx(AutocompletePopper, {
+    })), popupOpen && anchorEl ? /*#__PURE__*/_jsx(AutocompletePopper, _extends({
       as: PopperComponent,
-      className: clsx(classes.popper),
       disablePortal: disablePortal,
       style: {
         width: anchorEl ? anchorEl.clientWidth : null
@@ -599,7 +599,9 @@ var Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps,
       ownerState: ownerState,
       role: "presentation",
       anchorEl: anchorEl,
-      open: true,
+      open: true
+    }, componentsProps.popper, {
+      className: clsx(classes.popper, (_componentsProps$popp = componentsProps.popper) == null ? void 0 : _componentsProps$popp.className),
       children: /*#__PURE__*/_jsxs(AutocompletePaper, _extends({
         ownerState: ownerState,
         as: PaperComponent
@@ -638,7 +640,7 @@ var Autocomplete = /*#__PURE__*/React.forwardRef(function Autocomplete(inProps,
           })
         })) : null]
       }))
-    }) : null]
+    })) : null]
   });
 });
 process.env.NODE_ENV !== "production" ? Autocomplete.propTypes
@@ -740,7 +742,9 @@ process.env.NODE_ENV !== "production" ? Autocomplete.propTypes
    */
   componentsProps: PropTypes.shape({
     clearIndicator: PropTypes.object,
-    paper: PropTypes.object
+    paper: PropTypes.object,
+    popper: PropTypes.object,
+    popupIndicator: PropTypes.object
   }),
 
   /**

package/legacy/ButtonBase/TouchRipple.js

@@ -158,7 +158,7 @@ var TouchRipple = /*#__PURE__*/React.forwardRef(function TouchRipple(inProps, re
       rippleX = Math.round(rect.width / 2);
       rippleY = Math.round(rect.height / 2);
     } else {
-      var _ref5 = event.touches ? event.touches[0] : event,
+      var _ref5 = event.touches && event.touches.length > 0 ? event.touches[0] : event,
           clientX = _ref5.clientX,
           clientY = _ref5.clientY;
 

package/legacy/Modal/Modal.js

@@ -2,9 +2,9 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutPr
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
-import { isHostComponent } from '@mui/base';
-import { elementAcceptingRef, HTMLElementType } from '@mui/utils';
 import ModalUnstyled, { modalUnstyledClasses } from '@mui/base/ModalUnstyled';
+import { isHostComponent, resolveComponentProps } from '@mui/base/utils';
+import { elementAcceptingRef, HTMLElementType } from '@mui/utils';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import Backdrop from '../Backdrop';
@@ -125,11 +125,15 @@ var Modal = /*#__PURE__*/React.forwardRef(function Modal(inProps, ref) {
       Backdrop: BackdropComponent
     }, components),
     componentsProps: {
-      root: _extends({}, componentsProps.root, !isHostComponent(Root) && {
-        as: component,
-        theme: theme
-      }),
-      backdrop: _extends({}, BackdropProps, componentsProps.backdrop)
+      root: function root() {
+        return _extends({}, resolveComponentProps(componentsProps.root, ownerState), !isHostComponent(Root) && {
+          as: component,
+          theme: theme
+        });
+      },
+      backdrop: function backdrop() {
+        return _extends({}, BackdropProps, resolveComponentProps(componentsProps.backdrop, ownerState));
+      }
     },
     onTransitionEnter: function onTransitionEnter() {
       return setExited(false);
@@ -210,8 +214,8 @@ process.env.NODE_ENV !== "production" ? Modal.propTypes
    * @default {}
    */
   componentsProps: PropTypes.shape({
-    backdrop: PropTypes.object,
-    root: PropTypes.object
+    backdrop: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
   }),
 
   /**

package/legacy/ScopedCssBaseline/ScopedCssBaseline.js

@@ -94,6 +94,11 @@ process.env.NODE_ENV !== "production" ? ScopedCssBaseline.propTypes
    * For more details, check out https://developer.mozilla.org/en-US/docs/Web/CSS/color-scheme
    * For browser support, check out https://caniuse.com/?search=color-scheme
    */
-  enableColorScheme: PropTypes.bool
+  enableColorScheme: 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])
 } : void 0;
 export default ScopedCssBaseline;

package/legacy/Select/Select.js

@@ -301,7 +301,7 @@ process.env.NODE_ENV !== "production" ? Select.propTypes
    * If the value is an object it must have reference equality with the option in order to be selected.
    * If the value is not an object, the string representation must match with the string representation of the option in order to be selected.
    */
-  value: PropTypes.any,
+  value: PropTypes.oneOfType([PropTypes.oneOf(['']), PropTypes.any]),
 
   /**
    * The variant to use.

package/legacy/Slider/Slider.js

@@ -283,7 +283,6 @@ var SliderValueLabel = styled(SliderValueLabelUnstyled, {
     transition: theme.transitions.create(['transform'], {
       duration: theme.transitions.duration.shortest
     }),
-    transformOrigin: 'bottom center',
     transform: 'translateY(-100%) scale(0)',
     position: 'absolute',
     backgroundColor: (theme.vars || theme).palette.grey[600],
@@ -295,6 +294,7 @@ var SliderValueLabel = styled(SliderValueLabelUnstyled, {
     padding: '0.25rem 0.75rem'
   }, ownerState.orientation === 'horizontal' && {
     top: '-10px',
+    transformOrigin: 'bottom center',
     '&:before': {
       position: 'absolute',
       content: '""',
@@ -307,7 +307,8 @@ var SliderValueLabel = styled(SliderValueLabelUnstyled, {
     }
   }, ownerState.orientation === 'vertical' && {
     right: '30px',
-    top: '25px',
+    top: '24px',
+    transformOrigin: 'right center',
     '&:before': {
       position: 'absolute',
       content: '""',

package/legacy/SnackbarContent/SnackbarContent.js

@@ -34,7 +34,7 @@ var SnackbarContentRoot = styled(Paper, {
   var emphasis = theme.palette.mode === 'light' ? 0.8 : 0.98;
   var backgroundColor = emphasize(theme.palette.background.default, emphasis);
   return _extends({}, theme.typography.body2, _defineProperty({
-    color: theme.vars ? theme.vars.palette.text.primary : theme.palette.getContrastText(backgroundColor),
+    color: theme.vars ? theme.vars.palette.SnackbarContent.color : theme.palette.getContrastText(backgroundColor),
     backgroundColor: theme.vars ? theme.vars.palette.SnackbarContent.bg : backgroundColor,
     display: 'flex',
     alignItems: 'center',

package/legacy/Tooltip/Tooltip.js

@@ -360,12 +360,15 @@ var Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
   var handleEnter = function handleEnter(event) {
     if (ignoreNonTouchEvents.current && event.type !== 'touchstart') {
       return;
+    } // Workaround for https://github.com/facebook/react/issues/7769
+
+
+    if (!childNode) {
+      setChildNode(event.currentTarget);
     } // Remove the title ahead of time.
     // We don't want to wait for the next render commit.
     // We would risk displaying two tooltips at the same time (native + this one).
-
-
-    if (childNode) {
+    else {
       childNode.removeAttribute('title');
     }
 
@@ -411,8 +414,6 @@ var Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {
 
   var handleFocus = function handleFocus(event) {
     // Workaround for https://github.com/facebook/react/issues/7769
-    // The autoFocus of React might trigger the event before the componentDidMount.
-    // We need to account for this eventuality.
     if (!childNode) {
       setChildNode(event.currentTarget);
     }

package/legacy/Unstable_Grid2/Grid2.js

@@ -0,0 +1,38 @@
+import PropTypes from 'prop-types';
+import { createGrid } from '@mui/system/Unstable_Grid';
+import { styled, useThemeProps as _useThemeProps } from '../styles';
+var Grid2 = createGrid({
+  createStyledComponent: styled('div', {
+    name: 'MuiGrid2',
+    overridesResolver: function overridesResolver(props, styles) {
+      return styles.root;
+    }
+  }),
+  componentName: 'MuiGrid2',
+  // eslint-disable-next-line material-ui/mui-name-matches-component-name
+  useThemeProps: function useThemeProps(inProps) {
+    return _useThemeProps({
+      props: inProps,
+      name: 'MuiGrid2'
+    });
+  }
+});
+process.env.NODE_ENV !== "production" ? Grid2.propTypes
+/* remove-proptypes */
+= {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+
+  /**
+   * The content of the component.
+   */
+  children: PropTypes.node,
+
+  /**
+   * @ignore
+   */
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export default Grid2;

package/legacy/Unstable_Grid2/Grid2Props.js

@@ -0,0 +1 @@
+export {};

package/legacy/Unstable_Grid2/grid2Classes.js

@@ -0,0 +1,27 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
+export function getGrid2UtilityClass(slot) {
+  return generateUtilityClass('MuiGrid2', slot);
+}
+var SPACINGS = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
+var DIRECTIONS = ['column-reverse', 'column', 'row-reverse', 'row'];
+var WRAPS = ['nowrap', 'wrap-reverse', 'wrap'];
+var GRID_SIZES = ['auto', true, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
+var grid2Classes = generateUtilityClasses('MuiGrid2', ['root', 'container', 'item', 'zeroMinWidth'].concat(_toConsumableArray(SPACINGS.map(function (spacing) {
+  return "spacing-xs-".concat(spacing);
+})), _toConsumableArray(DIRECTIONS.map(function (direction) {
+  return "direction-xs-".concat(direction);
+})), _toConsumableArray(WRAPS.map(function (wrap) {
+  return "wrap-xs-".concat(wrap);
+})), _toConsumableArray(GRID_SIZES.map(function (size) {
+  return "grid-xs-".concat(size);
+})), _toConsumableArray(GRID_SIZES.map(function (size) {
+  return "grid-sm-".concat(size);
+})), _toConsumableArray(GRID_SIZES.map(function (size) {
+  return "grid-md-".concat(size);
+})), _toConsumableArray(GRID_SIZES.map(function (size) {
+  return "grid-lg-".concat(size);
+})), _toConsumableArray(GRID_SIZES.map(function (size) {
+  return "grid-xl-".concat(size);
+}))));
+export default grid2Classes;

package/legacy/Unstable_Grid2/index.js

@@ -0,0 +1,4 @@
+export { default } from './Grid2';
+export * from './Grid2Props';
+export { default as grid2Classes } from './grid2Classes';
+export * from './grid2Classes';

package/legacy/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.8.6
+/** @license MUI v5.9.1
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
@@ -106,6 +106,8 @@ export { default as FormLabel } from './FormLabel';
 export * from './FormLabel';
 export { default as Grid } from './Grid';
 export * from './Grid';
+export { default as Unstable_Grid2 } from './Unstable_Grid2';
+export * from './Unstable_Grid2';
 export { default as Grow } from './Grow';
 export * from './Grow';
 export { default as Hidden } from './Hidden';

package/legacy/styles/CssVarsProvider.js

@@ -1,9 +1,14 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
-
-/* eslint-disable @typescript-eslint/naming-convention */
 import { unstable_createCssVarsProvider as createCssVarsProvider } from '@mui/system';
 import experimental_extendTheme from './experimental_extendTheme';
 import createTypography from './createTypography';
+
+var shouldSkipGeneratingVar = function shouldSkipGeneratingVar(keys) {
+  var _keys$;
+
+  return !!keys[0].match(/(typography|mixins|breakpoints|direction|transitions)/) || keys[0] === 'palette' && !!((_keys$ = keys[1]) != null && _keys$.match(/(mode|contrastThreshold|tonalOffset)/));
+};
+
 var defaultTheme = experimental_extendTheme();
 
 var _createCssVarsProvide = createCssVarsProvider({
@@ -15,7 +20,6 @@ var _createCssVarsProvide = createCssVarsProvider({
     light: 'light',
     dark: 'dark'
   },
-  prefix: 'mui',
   resolveTheme: function resolveTheme(theme) {
     var newTheme = _extends({}, theme, {
       typography: createTypography(theme.palette, theme.typography)
@@ -23,14 +27,10 @@ var _createCssVarsProvide = createCssVarsProvider({
 
     return newTheme;
   },
-  shouldSkipGeneratingVar: function shouldSkipGeneratingVar(keys) {
-    var _keys$;
-
-    return !!keys[0].match(/(typography|mixins|breakpoints|direction|transitions)/) || keys[0] === 'palette' && !!((_keys$ = keys[1]) != null && _keys$.match(/(mode|contrastThreshold|tonalOffset)/));
-  }
+  shouldSkipGeneratingVar: shouldSkipGeneratingVar
 }),
-    Experimental_CssVarsProvider = _createCssVarsProvide.CssVarsProvider,
+    CssVarsProvider = _createCssVarsProvide.CssVarsProvider,
     useColorScheme = _createCssVarsProvide.useColorScheme,
     getInitColorSchemeScript = _createCssVarsProvide.getInitColorSchemeScript;
 
-export { useColorScheme, getInitColorSchemeScript, Experimental_CssVarsProvider };
+export { useColorScheme, getInitColorSchemeScript, shouldSkipGeneratingVar, CssVarsProvider as Experimental_CssVarsProvider };