@mui/material 5.0.6 → 5.2.1

package/Grid/Grid.js

@@ -15,7 +15,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { unstable_extendSxProp as extendSxProp, handleBreakpoints, unstable_resolveBreakpointValues as resolveBreakpointValues } from '@mui/system';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import requirePropFactory from '../utils/requirePropFactory';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
@@ -55,10 +55,11 @@ function generateGrid(globalStyles, theme, breakpoint, ownerState) {
   } else {
     const columnsBreakpointValues = resolveBreakpointValues({
       values: ownerState.columns,
-      base: theme.breakpoints.values
-    }); // Keep 7 significant numbers.
+      breakpoints: theme.breakpoints.values
+    });
+    const columnValue = typeof columnsBreakpointValues === 'object' ? columnsBreakpointValues[breakpoint] : columnsBreakpointValues; // Keep 7 significant numbers.
 
-    const width = `${Math.round(size / columnsBreakpointValues[breakpoint] * 10e7) / 10e5}%`;
+    const width = `${Math.round(size / columnValue * 10e7) / 10e5}%`;
     let more = {};
 
     if (ownerState.container && ownerState.item && ownerState.columnSpacing !== 0) {
@@ -90,13 +91,17 @@ function generateGrid(globalStyles, theme, breakpoint, ownerState) {
   }
 }
 
-function generateDirection({
+export function generateDirection({
   theme,
   ownerState
 }) {
+  const directionValues = resolveBreakpointValues({
+    values: ownerState.direction,
+    breakpoints: theme.breakpoints.values
+  });
   return handleBreakpoints({
     theme
-  }, ownerState.direction, propValue => {
+  }, directionValues, propValue => {
     const output = {
       flexDirection: propValue
     };
@@ -110,7 +115,6 @@ function generateDirection({
     return output;
   });
 }
-
 export function generateRowGap({
   theme,
   ownerState
@@ -122,9 +126,13 @@ export function generateRowGap({
   let styles = {};
 
   if (container && rowSpacing !== 0) {
+    const rowSpacingValues = resolveBreakpointValues({
+      values: rowSpacing,
+      breakpoints: theme.breakpoints.values
+    });
     styles = handleBreakpoints({
       theme
-    }, rowSpacing, propValue => {
+    }, rowSpacingValues, propValue => {
       const themeSpacing = theme.spacing(propValue);
 
       if (themeSpacing !== '0px') {
@@ -153,9 +161,13 @@ export function generateColumnGap({
   let styles = {};
 
   if (container && columnSpacing !== 0) {
+    const columnSpacingValues = resolveBreakpointValues({
+      values: columnSpacing,
+      breakpoints: theme.breakpoints.values
+    });
     styles = handleBreakpoints({
       theme
-    }, columnSpacing, propValue => {
+    }, columnSpacingValues, propValue => {
       const themeSpacing = theme.spacing(propValue);
 
       if (themeSpacing !== '0px') {
@@ -373,18 +385,26 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes
   item: PropTypes.bool,
 
   /**
-   * Defines the number of grids the component is going to use.
-   * It's applied for the `lg` breakpoint and wider screens if not overridden.
+   * 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).
+   * If 'auto', the grid item's width matches its content.
+   * If false, the prop is ignored.
+   * If true, the grid item's width grows to use the space available in the grid container.
+   * The value is applied for the `lg` breakpoint and wider screens if not overridden.
    * @default false
    */
-  lg: PropTypes.oneOfType([PropTypes.oneOf(['auto', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]), PropTypes.bool]),
+  lg: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
 
   /**
-   * Defines the number of grids the component is going to use.
-   * It's applied for the `md` breakpoint and wider screens if not overridden.
+   * 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).
+   * If 'auto', the grid item's width matches its content.
+   * If false, the prop is ignored.
+   * If true, the grid item's width grows to use the space available in the grid container.
+   * The value is applied for the `md` breakpoint and wider screens if not overridden.
    * @default false
    */
-  md: PropTypes.oneOfType([PropTypes.oneOf(['auto', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]), PropTypes.bool]),
+  md: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
 
   /**
    * Defines the vertical space between the type `item` components.
@@ -393,11 +413,15 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes
   rowSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
 
   /**
-   * Defines the number of grids the component is going to use.
-   * It's applied for the `sm` breakpoint and wider screens if not overridden.
+   * 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).
+   * If 'auto', the grid item's width matches its content.
+   * If false, the prop is ignored.
+   * If true, the grid item's width grows to use the space available in the grid container.
+   * The value is applied for the `sm` breakpoint and wider screens if not overridden.
    * @default false
    */
-  sm: PropTypes.oneOfType([PropTypes.oneOf(['auto', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]), PropTypes.bool]),
+  sm: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
 
   /**
    * Defines the space between the type `item` components.
@@ -409,7 +433,7 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * Defines the `flex-wrap` style property.
@@ -419,18 +443,26 @@ process.env.NODE_ENV !== "production" ? Grid.propTypes
   wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']),
 
   /**
-   * Defines the number of grids the component is going to use.
-   * It's applied for the `xl` breakpoint and wider screens.
+   * 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).
+   * If 'auto', the grid item's width matches its content.
+   * If false, the prop is ignored.
+   * If true, the grid item's width grows to use the space available in the grid container.
+   * The value is applied for the `xl` breakpoint and wider screens if not overridden.
    * @default false
    */
-  xl: PropTypes.oneOfType([PropTypes.oneOf(['auto', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]), PropTypes.bool]),
+  xl: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
 
   /**
-   * Defines the number of grids the component is going to use.
-   * It's applied for all the screen sizes with the lowest priority.
+   * 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).
+   * If 'auto', the grid item's width matches its content.
+   * If false, the prop is ignored.
+   * If true, the grid item's width grows to use the space available in the grid container.
+   * The value is applied for all the screen sizes with the lowest priority.
    * @default false
    */
-  xs: PropTypes.oneOfType([PropTypes.oneOf(['auto', 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]), PropTypes.bool]),
+  xs: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
 
   /**
    * If `true`, it sets `min-width: 0` on the item.

package/Grid/gridClasses.d.ts

@@ -1,48 +1,48 @@
-export interface GridClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the root element if `container={true}`. */
-    container: string;
-    /** Styles applied to the root element if `item={true}`. */
-    item: string;
-    /** Styles applied to the root element if `zeroMinWidth={true}`. */
-    zeroMinWidth: string;
-    /** Styles applied to the root element if `direction="column"`. */
-    'direction-xs-column': string;
-    /** Styles applied to the root element if `direction="column-reverse"`. */
-    'direction-xs-column-reverse': string;
-    /** Styles applied to the root element if `direction="row-reverse"`. */
-    'direction-xs-row-reverse': string;
-    /** Styles applied to the root element if `wrap="nowrap"`. */
-    'wrap-xs-nowrap': string;
-    /** Styles applied to the root element if `wrap="reverse"`. */
-    'wrap-xs-wrap-reverse': string;
-    'spacing-xs-1': string;
-    'spacing-xs-2': string;
-    'spacing-xs-3': string;
-    'spacing-xs-4': string;
-    'spacing-xs-5': string;
-    'spacing-xs-6': string;
-    'spacing-xs-7': string;
-    'spacing-xs-8': string;
-    'spacing-xs-9': string;
-    'spacing-xs-10': string;
-    'grid-xs-auto': string;
-    'grid-xs-true': string;
-    'grid-xs-1': string;
-    'grid-xs-2': string;
-    'grid-xs-3': string;
-    'grid-xs-4': string;
-    'grid-xs-5': string;
-    'grid-xs-6': string;
-    'grid-xs-7': string;
-    'grid-xs-8': string;
-    'grid-xs-9': string;
-    'grid-xs-10': string;
-    'grid-xs-11': string;
-    'grid-xs-12': string;
-}
-export declare type GridClassKey = keyof GridClasses;
-export declare function getGridUtilityClass(slot: string): string;
-declare const gridClasses: GridClasses;
-export default gridClasses;
+export interface GridClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to the root element if `container={true}`. */
+    container: string;
+    /** Styles applied to the root element if `item={true}`. */
+    item: string;
+    /** Styles applied to the root element if `zeroMinWidth={true}`. */
+    zeroMinWidth: string;
+    /** Styles applied to the root element if `direction="column"`. */
+    'direction-xs-column': string;
+    /** Styles applied to the root element if `direction="column-reverse"`. */
+    'direction-xs-column-reverse': string;
+    /** Styles applied to the root element if `direction="row-reverse"`. */
+    'direction-xs-row-reverse': string;
+    /** Styles applied to the root element if `wrap="nowrap"`. */
+    'wrap-xs-nowrap': string;
+    /** Styles applied to the root element if `wrap="reverse"`. */
+    'wrap-xs-wrap-reverse': string;
+    'spacing-xs-1': string;
+    'spacing-xs-2': string;
+    'spacing-xs-3': string;
+    'spacing-xs-4': string;
+    'spacing-xs-5': string;
+    'spacing-xs-6': string;
+    'spacing-xs-7': string;
+    'spacing-xs-8': string;
+    'spacing-xs-9': string;
+    'spacing-xs-10': string;
+    'grid-xs-auto': string;
+    'grid-xs-true': string;
+    'grid-xs-1': string;
+    'grid-xs-2': string;
+    'grid-xs-3': string;
+    'grid-xs-4': string;
+    'grid-xs-5': string;
+    'grid-xs-6': string;
+    'grid-xs-7': string;
+    'grid-xs-8': string;
+    'grid-xs-9': string;
+    'grid-xs-10': string;
+    'grid-xs-11': string;
+    'grid-xs-12': string;
+}
+export declare type GridClassKey = keyof GridClasses;
+export declare function getGridUtilityClass(slot: string): string;
+declare const gridClasses: GridClasses;
+export default gridClasses;

package/Grid/gridClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getGridUtilityClass(slot) {
   return generateUtilityClass('MuiGrid', slot);
 }

package/Hidden/HiddenCss.js

@@ -4,7 +4,7 @@ const _excluded = ["children", "className", "only"];
 import * as React from 'react';
 import clsx from 'clsx';
 import PropTypes from 'prop-types';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import capitalize from '../utils/capitalize';
 import styled from '../styles/styled';
 import useTheme from '../styles/useTheme';

package/Hidden/hiddenCssClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getHiddenCssUtilityClass(slot) {
   return generateUtilityClass('PrivateHiddenCss', slot);
 }

package/Icon/Icon.js

@@ -4,7 +4,7 @@ const _excluded = ["baseClassName", "className", "color", "component", "fontSize
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import capitalize from '../utils/capitalize';
@@ -154,7 +154,7 @@ process.env.NODE_ENV !== "production" ? Icon.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 Icon.muiName = 'Icon';
 export default Icon;

package/Icon/iconClasses.d.ts

@@ -1,24 +1,24 @@
-export interface IconClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the root element if `color="primary"`. */
-    colorPrimary: string;
-    /** Styles applied to the root element if `color="secondary"`. */
-    colorSecondary: string;
-    /** Styles applied to the root element if `color="action"`. */
-    colorAction: string;
-    /** Styles applied to the root element if `color="error"`. */
-    colorError: string;
-    /** Styles applied to the root element if `color="disabled"`. */
-    colorDisabled: string;
-    /** Styles applied to the root element if `fontSize="inherit"`. */
-    fontSizeInherit: string;
-    /** Styles applied to the root element if `fontSize="small"`. */
-    fontSizeSmall: string;
-    /** Styles applied to the root element if `fontSize="large"`. */
-    fontSizeLarge: string;
-}
-export declare type IconClassKey = keyof IconClasses;
-export declare function getIconUtilityClass(slot: string): string;
-declare const iconClasses: IconClasses;
-export default iconClasses;
+export interface IconClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to the root element if `color="primary"`. */
+    colorPrimary: string;
+    /** Styles applied to the root element if `color="secondary"`. */
+    colorSecondary: string;
+    /** Styles applied to the root element if `color="action"`. */
+    colorAction: string;
+    /** Styles applied to the root element if `color="error"`. */
+    colorError: string;
+    /** Styles applied to the root element if `color="disabled"`. */
+    colorDisabled: string;
+    /** Styles applied to the root element if `fontSize="inherit"`. */
+    fontSizeInherit: string;
+    /** Styles applied to the root element if `fontSize="small"`. */
+    fontSizeSmall: string;
+    /** Styles applied to the root element if `fontSize="large"`. */
+    fontSizeLarge: string;
+}
+export declare type IconClassKey = keyof IconClasses;
+export declare function getIconUtilityClass(slot: string): string;
+declare const iconClasses: IconClasses;
+export default iconClasses;

package/Icon/iconClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getIconUtilityClass(slot) {
   return generateUtilityClass('MuiIcon', slot);
 }

package/IconButton/IconButton.js

@@ -5,7 +5,7 @@ import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
 import { chainPropTypes } from '@mui/utils';
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { alpha } from '@mui/system';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
@@ -51,7 +51,8 @@ const IconButtonRoot = styled(ButtonBase, {
   color: theme.palette.action.active,
   transition: theme.transitions.create('background-color', {
     duration: theme.transitions.duration.shortest
-  }),
+  })
+}, !ownerState.disableRipple && {
   '&:hover': {
     backgroundColor: alpha(theme.palette.action.active, theme.palette.action.hoverOpacity),
     // Reset on touch devices, it doesn't add specificity
@@ -68,8 +69,9 @@ const IconButtonRoot = styled(ButtonBase, {
   ownerState
 }) => _extends({}, ownerState.color === 'inherit' && {
   color: 'inherit'
-}, ownerState.color !== 'inherit' && ownerState.color !== 'default' && {
-  color: theme.palette[ownerState.color].main,
+}, ownerState.color !== 'inherit' && ownerState.color !== 'default' && _extends({
+  color: theme.palette[ownerState.color].main
+}, !ownerState.disableRipple && {
   '&:hover': {
     backgroundColor: alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),
     // Reset on touch devices, it doesn't add specificity
@@ -77,7 +79,7 @@ const IconButtonRoot = styled(ButtonBase, {
       backgroundColor: 'transparent'
     }
   }
-}, ownerState.size === 'small' && {
+}), ownerState.size === 'small' && {
   padding: 5,
   fontSize: theme.typography.pxToRem(18)
 }, ownerState.size === 'large' && {
@@ -212,6 +214,6 @@ process.env.NODE_ENV !== "production" ? IconButton.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 export default IconButton;

package/IconButton/iconButtonClasses.d.ts

@@ -1,26 +1,26 @@
-export interface IconButtonClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the root element if `edge="start"`. */
-    edgeStart: string;
-    /** Styles applied to the root element if `edge="end"`. */
-    edgeEnd: string;
-    /** Styles applied to the root element if `color="inherit"`. */
-    colorInherit: string;
-    /** Styles applied to the root element if `color="primary"`. */
-    colorPrimary: string;
-    /** Styles applied to the root element if `color="secondary"`. */
-    colorSecondary: string;
-    /** State class applied to the root element if `disabled={true}`. */
-    disabled: string;
-    /** Styles applied to the root element if `size="small"`. */
-    sizeSmall: string;
-    /** Styles applied to the root element if `size="medium"`. */
-    sizeMedium: string;
-    /** Styles applied to the root element if `size="large"`. */
-    sizeLarge: string;
-}
-export declare type IconButtonClassKey = keyof IconButtonClasses;
-export declare function getIconButtonUtilityClass(slot: string): string;
-declare const iconButtonClasses: IconButtonClasses;
-export default iconButtonClasses;
+export interface IconButtonClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to the root element if `edge="start"`. */
+    edgeStart: string;
+    /** Styles applied to the root element if `edge="end"`. */
+    edgeEnd: string;
+    /** Styles applied to the root element if `color="inherit"`. */
+    colorInherit: string;
+    /** Styles applied to the root element if `color="primary"`. */
+    colorPrimary: string;
+    /** Styles applied to the root element if `color="secondary"`. */
+    colorSecondary: string;
+    /** State class applied to the root element if `disabled={true}`. */
+    disabled: string;
+    /** Styles applied to the root element if `size="small"`. */
+    sizeSmall: string;
+    /** Styles applied to the root element if `size="medium"`. */
+    sizeMedium: string;
+    /** Styles applied to the root element if `size="large"`. */
+    sizeLarge: string;
+}
+export declare type IconButtonClassKey = keyof IconButtonClasses;
+export declare function getIconButtonUtilityClass(slot: string): string;
+declare const iconButtonClasses: IconButtonClasses;
+export default iconButtonClasses;

package/IconButton/iconButtonClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getIconButtonUtilityClass(slot) {
   return generateUtilityClass('MuiIconButton', slot);
 }

package/ImageList/ImageList.js

@@ -1,7 +1,7 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
 const _excluded = ["children", "className", "cols", "component", "rowHeight", "gap", "style", "variant"];
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { integerPropType } from '@mui/utils';
 import clsx from 'clsx';
 import PropTypes from 'prop-types';
@@ -163,7 +163,7 @@ process.env.NODE_ENV !== "production" ? ImageList.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * The variant to use.

package/ImageList/imageListClasses.d.ts

@@ -1,16 +1,16 @@
-export interface ImageListClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the root element if `variant="masonry"`. */
-    masonry: string;
-    /** Styles applied to the root element if `variant="quilted"`. */
-    quilted: string;
-    /** Styles applied to the root element if `variant="standard"`. */
-    standard: string;
-    /** Styles applied to the root element if `variant="woven"`. */
-    woven: string;
-}
-export declare type ImageListClassKey = keyof ImageListClasses;
-export declare function getImageListUtilityClass(slot: string): string;
-declare const imageListClasses: ImageListClasses;
-export default imageListClasses;
+export interface ImageListClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to the root element if `variant="masonry"`. */
+    masonry: string;
+    /** Styles applied to the root element if `variant="quilted"`. */
+    quilted: string;
+    /** Styles applied to the root element if `variant="standard"`. */
+    standard: string;
+    /** Styles applied to the root element if `variant="woven"`. */
+    woven: string;
+}
+export declare type ImageListClassKey = keyof ImageListClasses;
+export declare function getImageListUtilityClass(slot: string): string;
+declare const imageListClasses: ImageListClasses;
+export default imageListClasses;

package/ImageList/imageListClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getImageListUtilityClass(slot) {
   return generateUtilityClass('MuiImageList', slot);
 }

package/ImageListItem/ImageListItem.js

@@ -1,7 +1,7 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
 const _excluded = ["children", "className", "cols", "component", "rows", "style"];
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import { integerPropType } from '@mui/utils';
 import clsx from 'clsx';
 import PropTypes from 'prop-types';
@@ -184,6 +184,6 @@ process.env.NODE_ENV !== "production" ? ImageListItem.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object])
 } : void 0;
 export default ImageListItem;

package/ImageListItem/imageListItemClasses.d.ts

@@ -1,18 +1,18 @@
-export interface ImageListItemClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to an `img` element to ensure it covers the item. */
-    img: string;
-    /** Styles applied to the root element if `variant="standard"`. */
-    standard: string;
-    /** Styles applied to the root element if `variant="woven"`. */
-    woven: string;
-    /** Styles applied to the root element if `variant="masonry"`. */
-    masonry: string;
-    /** Styles applied to the root element if `variant="quilted"`. */
-    quilted: string;
-}
-export declare type ImageListItemClassKey = keyof ImageListItemClasses;
-export declare function getImageListItemUtilityClass(slot: string): string;
-declare const imageListItemClasses: ImageListItemClasses;
-export default imageListItemClasses;
+export interface ImageListItemClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to an `img` element to ensure it covers the item. */
+    img: string;
+    /** Styles applied to the root element if `variant="standard"`. */
+    standard: string;
+    /** Styles applied to the root element if `variant="woven"`. */
+    woven: string;
+    /** Styles applied to the root element if `variant="masonry"`. */
+    masonry: string;
+    /** Styles applied to the root element if `variant="quilted"`. */
+    quilted: string;
+}
+export declare type ImageListItemClassKey = keyof ImageListItemClasses;
+export declare function getImageListItemUtilityClass(slot: string): string;
+declare const imageListItemClasses: ImageListItemClasses;
+export default imageListItemClasses;

package/ImageListItem/imageListItemClasses.js

@@ -1,4 +1,4 @@
-import { generateUtilityClass, generateUtilityClasses } from '@mui/core';
+import { generateUtilityClass, generateUtilityClasses } from '@mui/base';
 export function getImageListItemUtilityClass(slot) {
   return generateUtilityClass('MuiImageListItem', slot);
 }

package/ImageListItemBar/ImageListItemBar.js

@@ -1,7 +1,7 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
 const _excluded = ["actionIcon", "actionPosition", "className", "subtitle", "title", "position"];
-import { unstable_composeClasses as composeClasses } from '@mui/core';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
 import clsx from 'clsx';
 import PropTypes from 'prop-types';
 import * as React from 'react';
@@ -226,7 +226,7 @@ process.env.NODE_ENV !== "production" ? ImageListItemBar.propTypes
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
-  sx: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object])), PropTypes.func, PropTypes.object]),
 
   /**
    * Title to be displayed.