@mui/material 5.10.12 → 5.10.14

package/legacy/Grid/Grid.js

@@ -25,28 +25,23 @@ import useTheme from '../styles/useTheme';
 import GridContext from './GridContext';
 import gridClasses, { getGridUtilityClass } from './gridClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
-
 function getOffset(val) {
   var parse = parseFloat(val);
   return "".concat(parse).concat(String(val).replace(String(parse), '') || 'px');
 }
-
 export function generateGrid(_ref) {
   var theme = _ref.theme,
-      ownerState = _ref.ownerState;
+    ownerState = _ref.ownerState;
   var size;
   return theme.breakpoints.keys.reduce(function (globalStyles, breakpoint) {
     // Use side effect over immutability for better performance.
     var styles = {};
-
     if (ownerState[breakpoint]) {
       size = ownerState[breakpoint];
     }
-
     if (!size) {
       return globalStyles;
     }
-
     if (size === true) {
       // For the auto layouting
       styles = {
@@ -68,18 +63,14 @@ export function generateGrid(_ref) {
         breakpoints: theme.breakpoints.values
       });
       var columnValue = _typeof(columnsBreakpointValues) === 'object' ? columnsBreakpointValues[breakpoint] : columnsBreakpointValues;
-
       if (columnValue === undefined || columnValue === null) {
         return globalStyles;
-      } // Keep 7 significant numbers.
-
-
+      }
+      // Keep 7 significant numbers.
       var width = "".concat(Math.round(size / columnValue * 10e7) / 10e5, "%");
       var more = {};
-
       if (ownerState.container && ownerState.item && ownerState.columnSpacing !== 0) {
         var themeSpacing = theme.spacing(ownerState.columnSpacing);
-
         if (themeSpacing !== '0px') {
           var fullWidth = "calc(".concat(width, " + ").concat(getOffset(themeSpacing), ")");
           more = {
@@ -87,30 +78,29 @@ export function generateGrid(_ref) {
             maxWidth: fullWidth
           };
         }
-      } // Close to the bootstrap implementation:
-      // https://github.com/twbs/bootstrap/blob/8fccaa2439e97ec72a4b7dc42ccc1f649790adb0/scss/mixins/_grid.scss#L41
-
+      }
 
+      // Close to the bootstrap implementation:
+      // https://github.com/twbs/bootstrap/blob/8fccaa2439e97ec72a4b7dc42ccc1f649790adb0/scss/mixins/_grid.scss#L41
       styles = _extends({
         flexBasis: width,
         flexGrow: 0,
         maxWidth: width
       }, more);
-    } // No need for a media query for the first size.
-
+    }
 
+    // No need for a media query for the first size.
     if (theme.breakpoints.values[breakpoint] === 0) {
       _extends(globalStyles, styles);
     } else {
       globalStyles[theme.breakpoints.up(breakpoint)] = styles;
     }
-
     return globalStyles;
   }, {});
 }
 export function generateDirection(_ref2) {
   var theme = _ref2.theme,
-      ownerState = _ref2.ownerState;
+    ownerState = _ref2.ownerState;
   var directionValues = resolveBreakpointValues({
     values: ownerState.direction,
     breakpoints: theme.breakpoints.values
@@ -121,31 +111,28 @@ export function generateDirection(_ref2) {
     var output = {
       flexDirection: propValue
     };
-
     if (propValue.indexOf('column') === 0) {
       output["& > .".concat(gridClasses.item)] = {
         maxWidth: 'none'
       };
     }
-
     return output;
   });
 }
+
 /**
  * Extracts zero value breakpoint keys before a non-zero value breakpoint key.
  * @example { xs: 0, sm: 0, md: 2, lg: 0, xl: 0 } or [0, 0, 2, 0, 0]
  * @returns [xs, sm]
  */
-
 function extractZeroValueBreakpointKeys(_ref3) {
   var breakpoints = _ref3.breakpoints,
-      values = _ref3.values;
+    values = _ref3.values;
   var nonZeroKey = '';
   Object.keys(values).forEach(function (key) {
     if (nonZeroKey !== '') {
       return;
     }
-
     if (values[key] !== 0) {
       nonZeroKey = key;
     }
@@ -155,35 +142,29 @@ function extractZeroValueBreakpointKeys(_ref3) {
   });
   return sortedBreakpointKeysByValue.slice(0, sortedBreakpointKeysByValue.indexOf(nonZeroKey));
 }
-
 export function generateRowGap(_ref4) {
   var theme = _ref4.theme,
-      ownerState = _ref4.ownerState;
+    ownerState = _ref4.ownerState;
   var container = ownerState.container,
-      rowSpacing = ownerState.rowSpacing;
+    rowSpacing = ownerState.rowSpacing;
   var styles = {};
-
   if (container && rowSpacing !== 0) {
     var rowSpacingValues = resolveBreakpointValues({
       values: rowSpacing,
       breakpoints: theme.breakpoints.values
     });
     var zeroValueBreakpointKeys;
-
     if (_typeof(rowSpacingValues) === 'object') {
       zeroValueBreakpointKeys = extractZeroValueBreakpointKeys({
         breakpoints: theme.breakpoints.values,
         values: rowSpacingValues
       });
     }
-
     styles = handleBreakpoints({
       theme: theme
     }, rowSpacingValues, function (propValue, breakpoint) {
       var _zeroValueBreakpointK;
-
       var themeSpacing = theme.spacing(propValue);
-
       if (themeSpacing !== '0px') {
         return _defineProperty({
           marginTop: "-".concat(getOffset(themeSpacing))
@@ -191,11 +172,9 @@ export function generateRowGap(_ref4) {
           paddingTop: getOffset(themeSpacing)
         });
       }
-
       if ((_zeroValueBreakpointK = zeroValueBreakpointKeys) != null && _zeroValueBreakpointK.includes(breakpoint)) {
         return {};
       }
-
       return _defineProperty({
         marginTop: 0
       }, "& > .".concat(gridClasses.item), {
@@ -203,37 +182,31 @@ export function generateRowGap(_ref4) {
       });
     });
   }
-
   return styles;
 }
 export function generateColumnGap(_ref7) {
   var theme = _ref7.theme,
-      ownerState = _ref7.ownerState;
+    ownerState = _ref7.ownerState;
   var container = ownerState.container,
-      columnSpacing = ownerState.columnSpacing;
+    columnSpacing = ownerState.columnSpacing;
   var styles = {};
-
   if (container && columnSpacing !== 0) {
     var columnSpacingValues = resolveBreakpointValues({
       values: columnSpacing,
       breakpoints: theme.breakpoints.values
     });
     var zeroValueBreakpointKeys;
-
     if (_typeof(columnSpacingValues) === 'object') {
       zeroValueBreakpointKeys = extractZeroValueBreakpointKeys({
         breakpoints: theme.breakpoints.values,
         values: columnSpacingValues
       });
     }
-
     styles = handleBreakpoints({
       theme: theme
     }, columnSpacingValues, function (propValue, breakpoint) {
       var _zeroValueBreakpointK2;
-
       var themeSpacing = theme.spacing(propValue);
-
       if (themeSpacing !== '0px') {
         return _defineProperty({
           width: "calc(100% + ".concat(getOffset(themeSpacing), ")"),
@@ -242,11 +215,9 @@ export function generateColumnGap(_ref7) {
           paddingLeft: getOffset(themeSpacing)
         });
       }
-
       if ((_zeroValueBreakpointK2 = zeroValueBreakpointKeys) != null && _zeroValueBreakpointK2.includes(breakpoint)) {
         return {};
       }
-
       return _defineProperty({
         width: '100%',
         marginLeft: 0
@@ -255,61 +226,56 @@ export function generateColumnGap(_ref7) {
       });
     });
   }
-
   return styles;
 }
 export function resolveSpacingStyles(spacing, breakpoints) {
   var styles = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-
   // undefined/null or `spacing` <= 0
   if (!spacing || spacing <= 0) {
     return [];
-  } // in case of string/number `spacing`
-
-
+  }
+  // in case of string/number `spacing`
   if (typeof spacing === 'string' && !Number.isNaN(Number(spacing)) || typeof spacing === 'number') {
     return [styles["spacing-xs-".concat(String(spacing))]];
-  } // in case of object `spacing`
-
-
+  }
+  // in case of object `spacing`
   var spacingStyles = [];
   breakpoints.forEach(function (breakpoint) {
     var value = spacing[breakpoint];
-
     if (Number(value) > 0) {
       spacingStyles.push(styles["spacing-".concat(breakpoint, "-").concat(String(value))]);
     }
   });
   return spacingStyles;
-} // Default CSS values
+}
+
+// Default CSS values
 // flex: '0 1 auto',
 // flexDirection: 'row',
 // alignItems: 'flex-start',
 // flexWrap: 'nowrap',
 // justifyContent: 'flex-start',
-
 var GridRoot = styled('div', {
   name: 'MuiGrid',
   slot: 'Root',
   overridesResolver: function overridesResolver(props, styles) {
     var ownerState = props.ownerState;
     var container = ownerState.container,
-        direction = ownerState.direction,
-        item = ownerState.item,
-        spacing = ownerState.spacing,
-        wrap = ownerState.wrap,
-        zeroMinWidth = ownerState.zeroMinWidth,
-        breakpoints = ownerState.breakpoints;
-    var spacingStyles = []; // in case of grid item
+      direction = ownerState.direction,
+      item = ownerState.item,
+      spacing = ownerState.spacing,
+      wrap = ownerState.wrap,
+      zeroMinWidth = ownerState.zeroMinWidth,
+      breakpoints = ownerState.breakpoints;
+    var spacingStyles = [];
 
+    // in case of grid item
     if (container) {
       spacingStyles = resolveSpacingStyles(spacing, breakpoints, styles);
     }
-
     var breakpointsStyles = [];
     breakpoints.forEach(function (breakpoint) {
       var value = ownerState[breakpoint];
-
       if (value) {
         breakpointsStyles.push(styles["grid-".concat(breakpoint, "-").concat(String(value))]);
       }
@@ -326,7 +292,6 @@ var GridRoot = styled('div', {
     width: '100%'
   }, ownerState.item && {
     margin: 0 // For instance, it's useful when used with a `figure` element.
-
   }, ownerState.zeroMinWidth && {
     minWidth: 0
   }, ownerState.wrap !== 'wrap' && {
@@ -337,18 +302,15 @@ export function resolveSpacingClasses(spacing, breakpoints) {
   // undefined/null or `spacing` <= 0
   if (!spacing || spacing <= 0) {
     return [];
-  } // in case of string/number `spacing`
-
-
+  }
+  // in case of string/number `spacing`
   if (typeof spacing === 'string' && !Number.isNaN(Number(spacing)) || typeof spacing === 'number') {
     return ["spacing-xs-".concat(String(spacing))];
-  } // in case of object `spacing`
-
-
+  }
+  // in case of object `spacing`
   var classes = [];
   breakpoints.forEach(function (breakpoint) {
     var value = spacing[breakpoint];
-
     if (Number(value) > 0) {
       var className = "spacing-".concat(breakpoint, "-").concat(String(value));
       classes.push(className);
@@ -356,26 +318,24 @@ export function resolveSpacingClasses(spacing, breakpoints) {
   });
   return classes;
 }
-
 var useUtilityClasses = function useUtilityClasses(ownerState) {
   var classes = ownerState.classes,
-      container = ownerState.container,
-      direction = ownerState.direction,
-      item = ownerState.item,
-      spacing = ownerState.spacing,
-      wrap = ownerState.wrap,
-      zeroMinWidth = ownerState.zeroMinWidth,
-      breakpoints = ownerState.breakpoints;
-  var spacingClasses = []; // in case of grid item
-
+    container = ownerState.container,
+    direction = ownerState.direction,
+    item = ownerState.item,
+    spacing = ownerState.spacing,
+    wrap = ownerState.wrap,
+    zeroMinWidth = ownerState.zeroMinWidth,
+    breakpoints = ownerState.breakpoints;
+  var spacingClasses = [];
+
+  // in case of grid item
   if (container) {
     spacingClasses = resolveSpacingClasses(spacing, breakpoints);
   }
-
   var breakpointsClasses = [];
   breakpoints.forEach(function (breakpoint) {
     var value = ownerState[breakpoint];
-
     if (value) {
       breakpointsClasses.push("grid-".concat(breakpoint, "-").concat(String(value)));
     }
@@ -385,54 +345,47 @@ var useUtilityClasses = function useUtilityClasses(ownerState) {
   };
   return composeClasses(slots, getGridUtilityClass, classes);
 };
-
 var Grid = /*#__PURE__*/React.forwardRef(function Grid(inProps, ref) {
   var themeProps = useThemeProps({
     props: inProps,
     name: 'MuiGrid'
   });
-
   var _useTheme = useTheme(),
-      breakpoints = _useTheme.breakpoints;
-
+    breakpoints = _useTheme.breakpoints;
   var props = extendSxProp(themeProps);
-
   var className = props.className,
-      columnsProp = props.columns,
-      columnSpacingProp = props.columnSpacing,
-      _props$component = props.component,
-      component = _props$component === void 0 ? 'div' : _props$component,
-      _props$container = props.container,
-      container = _props$container === void 0 ? false : _props$container,
-      _props$direction = props.direction,
-      direction = _props$direction === void 0 ? 'row' : _props$direction,
-      _props$item = props.item,
-      item = _props$item === void 0 ? false : _props$item,
-      rowSpacingProp = props.rowSpacing,
-      _props$spacing = props.spacing,
-      spacing = _props$spacing === void 0 ? 0 : _props$spacing,
-      _props$wrap = props.wrap,
-      wrap = _props$wrap === void 0 ? 'wrap' : _props$wrap,
-      _props$zeroMinWidth = props.zeroMinWidth,
-      zeroMinWidth = _props$zeroMinWidth === void 0 ? false : _props$zeroMinWidth,
-      other = _objectWithoutProperties(props, ["className", "columns", "columnSpacing", "component", "container", "direction", "item", "rowSpacing", "spacing", "wrap", "zeroMinWidth"]);
-
+    columnsProp = props.columns,
+    columnSpacingProp = props.columnSpacing,
+    _props$component = props.component,
+    component = _props$component === void 0 ? 'div' : _props$component,
+    _props$container = props.container,
+    container = _props$container === void 0 ? false : _props$container,
+    _props$direction = props.direction,
+    direction = _props$direction === void 0 ? 'row' : _props$direction,
+    _props$item = props.item,
+    item = _props$item === void 0 ? false : _props$item,
+    rowSpacingProp = props.rowSpacing,
+    _props$spacing = props.spacing,
+    spacing = _props$spacing === void 0 ? 0 : _props$spacing,
+    _props$wrap = props.wrap,
+    wrap = _props$wrap === void 0 ? 'wrap' : _props$wrap,
+    _props$zeroMinWidth = props.zeroMinWidth,
+    zeroMinWidth = _props$zeroMinWidth === void 0 ? false : _props$zeroMinWidth,
+    other = _objectWithoutProperties(props, ["className", "columns", "columnSpacing", "component", "container", "direction", "item", "rowSpacing", "spacing", "wrap", "zeroMinWidth"]);
   var rowSpacing = rowSpacingProp || spacing;
   var columnSpacing = columnSpacingProp || spacing;
-  var columnsContext = React.useContext(GridContext); // columns set with default breakpoint unit of 12
+  var columnsContext = React.useContext(GridContext);
 
+  // columns set with default breakpoint unit of 12
   var columns = container ? columnsProp || 12 : columnsContext;
   var breakpointsValues = {};
-
   var otherFiltered = _extends({}, other);
-
   breakpoints.keys.forEach(function (breakpoint) {
     if (other[breakpoint] != null) {
       breakpointsValues[breakpoint] = other[breakpoint];
       delete otherFiltered[breakpoint];
     }
   });
-
   var ownerState = _extends({}, props, {
     columns: columns,
     container: container,
@@ -446,7 +399,6 @@ var Grid = /*#__PURE__*/React.forwardRef(function Grid(inProps, ref) {
   }, breakpointsValues, {
     breakpoints: breakpoints.keys
   });
-
   var classes = useUtilityClasses(ownerState);
   return /*#__PURE__*/_jsx(GridContext.Provider, {
     value: columns,
@@ -458,68 +410,56 @@ var Grid = /*#__PURE__*/React.forwardRef(function Grid(inProps, ref) {
     }, otherFiltered))
   });
 });
-process.env.NODE_ENV !== "production" ? Grid.propTypes
-/* remove-proptypes */
-= {
+process.env.NODE_ENV !== "production" ? Grid.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
   // |     To update them edit the d.ts file and run "yarn proptypes"     |
   // ----------------------------------------------------------------------
-
   /**
    * The content of the component.
    */
   children: PropTypes.node,
-
   /**
    * Override or extend the styles applied to the component.
    */
   classes: PropTypes.object,
-
   /**
    * @ignore
    */
   className: PropTypes.string,
-
   /**
    * The number of columns.
    * @default 12
    */
   columns: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.number, PropTypes.object]),
-
   /**
    * Defines the horizontal space between the type `item` components.
    * It overrides the value of the `spacing` prop.
    */
   columnSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
-
   /**
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
   component: PropTypes.elementType,
-
   /**
    * If `true`, the component will have the flex *container* behavior.
    * You should be wrapping *items* with a *container*.
    * @default false
    */
   container: PropTypes.bool,
-
   /**
    * Defines the `flex-direction` style property.
    * It is applied for all screen sizes.
    * @default 'row'
    */
   direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
-
   /**
    * If `true`, the component will have the flex *item* behavior.
    * You should be wrapping *items* with a *container*.
    * @default false
    */
   item: PropTypes.bool,
-
   /**
    * If a number, it sets the number of columns the grid item uses.
    * It can't be greater than the total number of columns of the container (12 by default).
@@ -530,7 +470,6 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes
    * @default false
    */
   lg: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
-
   /**
    * If a number, it sets the number of columns the grid item uses.
    * It can't be greater than the total number of columns of the container (12 by default).
@@ -541,13 +480,11 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes
    * @default false
    */
   md: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
-
   /**
    * Defines the vertical space between the type `item` components.
    * It overrides the value of the `spacing` prop.
    */
   rowSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
-
   /**
    * If a number, it sets the number of columns the grid item uses.
    * It can't be greater than the total number of columns of the container (12 by default).
@@ -558,26 +495,22 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes
    * @default false
    */
   sm: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
-
   /**
    * Defines the space between the type `item` components.
    * It can only be used on a type `container` component.
    * @default 0
    */
   spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
-
   /**
    * 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]),
-
   /**
    * Defines the `flex-wrap` style property.
    * It's applied for all screen sizes.
    * @default 'wrap'
    */
   wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']),
-
   /**
    * If a number, it sets the number of columns the grid item uses.
    * It can't be greater than the total number of columns of the container (12 by default).
@@ -588,7 +521,6 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes
    * @default false
    */
   xl: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
-
   /**
    * If a number, it sets the number of columns the grid item uses.
    * It can't be greater than the total number of columns of the container (12 by default).
@@ -599,7 +531,6 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes
    * @default false
    */
   xs: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
-
   /**
    * If `true`, it sets `min-width: 0` on the item.
    * Refer to the limitations section of the documentation to better understand the use case.
@@ -607,10 +538,9 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes
    */
   zeroMinWidth: PropTypes.bool
 } : void 0;
-
 if (process.env.NODE_ENV !== 'production') {
-  var requireProp = requirePropFactory('Grid', Grid); // eslint-disable-next-line no-useless-concat
-
+  var requireProp = requirePropFactory('Grid', Grid);
+  // eslint-disable-next-line no-useless-concat
   Grid['propTypes' + ''] = _extends({}, Grid.propTypes, {
     direction: requireProp('container'),
     lg: requireProp('item'),
@@ -622,5 +552,4 @@ if (process.env.NODE_ENV !== 'production') {
     zeroMinWidth: requireProp('item')
   });
 }
-
 export default Grid;

package/legacy/Grid/GridContext.js

@@ -1,12 +1,10 @@
 import * as React from 'react';
+
 /**
  * @ignore - internal component.
  */
-
 var GridContext = /*#__PURE__*/React.createContext();
-
 if (process.env.NODE_ENV !== 'production') {
   GridContext.displayName = 'GridContext';
 }
-
 export default GridContext;