@mui/material 5.10.12 → 5.10.14

package/modern/PaginationItem/PaginationItem.js

@@ -1,6 +1,6 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["className", "color", "component", "components", "disabled", "page", "selected", "shape", "size", "type", "variant"];
+const _excluded = ["className", "color", "component", "components", "disabled", "page", "selected", "shape", "size", "slots", "type", "variant"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -18,14 +18,12 @@ import NavigateNextIcon from '../internal/svg-icons/NavigateNext';
 import styled from '../styles/styled';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-
 const overridesResolver = (props, styles) => {
   const {
     ownerState
   } = props;
   return [styles.root, styles[ownerState.variant], styles[`size${capitalize(ownerState.size)}`], ownerState.variant === 'text' && styles[`text${capitalize(ownerState.color)}`], ownerState.variant === 'outlined' && styles[`outlined${capitalize(ownerState.color)}`], ownerState.shape === 'rounded' && styles.rounded, ownerState.type === 'page' && styles.page, (ownerState.type === 'start-ellipsis' || ownerState.type === 'end-ellipsis') && styles.ellipsis, (ownerState.type === 'previous' || ownerState.type === 'next') && styles.previousNext, (ownerState.type === 'first' || ownerState.type === 'last') && styles.firstLast];
 };
-
 const useUtilityClasses = ownerState => {
   const {
     classes,
@@ -51,7 +49,6 @@ const useUtilityClasses = ownerState => {
   };
   return composeClasses(slots, getPaginationItemUtilityClass, classes);
 };
-
 const PaginationItemEllipsis = styled('div', {
   name: 'MuiPaginationItem',
   slot: 'Root',
@@ -211,27 +208,21 @@ const PaginationItem = /*#__PURE__*/React.forwardRef(function PaginationItem(inP
     props: inProps,
     name: 'MuiPaginationItem'
   });
-
   const {
-    className,
-    color = 'standard',
-    component,
-    components = {
-      first: FirstPageIcon,
-      last: LastPageIcon,
-      next: NavigateNextIcon,
-      previous: NavigateBeforeIcon
-    },
-    disabled = false,
-    page,
-    selected = false,
-    shape = 'circular',
-    size = 'medium',
-    type = 'page',
-    variant = 'text'
-  } = props,
-        other = _objectWithoutPropertiesLoose(props, _excluded);
-
+      className,
+      color = 'standard',
+      component,
+      components = {},
+      disabled = false,
+      page,
+      selected = false,
+      shape = 'circular',
+      size = 'medium',
+      slots = {},
+      type = 'page',
+      variant = 'text'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const ownerState = _extends({}, props, {
     color,
     disabled,
@@ -241,19 +232,18 @@ const PaginationItem = /*#__PURE__*/React.forwardRef(function PaginationItem(inP
     type,
     variant
   });
-
   const theme = useTheme();
   const classes = useUtilityClasses(ownerState);
   const normalizedIcons = theme.direction === 'rtl' ? {
-    previous: components.next || NavigateNextIcon,
-    next: components.previous || NavigateBeforeIcon,
-    last: components.first || FirstPageIcon,
-    first: components.last || LastPageIcon
+    previous: slots.next || components.next || NavigateNextIcon,
+    next: slots.previous || components.previous || NavigateBeforeIcon,
+    last: slots.first || components.first || FirstPageIcon,
+    first: slots.last || components.last || LastPageIcon
   } : {
-    previous: components.previous || NavigateBeforeIcon,
-    next: components.next || NavigateNextIcon,
-    first: components.first || FirstPageIcon,
-    last: components.last || LastPageIcon
+    previous: slots.previous || components.previous || NavigateBeforeIcon,
+    next: slots.next || components.next || NavigateNextIcon,
+    first: slots.first || components.first || FirstPageIcon,
+    last: slots.last || components.last || LastPageIcon
   };
   const Icon = normalizedIcons[type];
   return type === 'start-ellipsis' || type === 'end-ellipsis' ? /*#__PURE__*/_jsx(PaginationItemEllipsis, {
@@ -275,53 +265,42 @@ const PaginationItem = /*#__PURE__*/React.forwardRef(function PaginationItem(inP
     }) : null]
   }));
 });
-process.env.NODE_ENV !== "production" ? PaginationItem.propTypes
-/* remove-proptypes */
-= {
+process.env.NODE_ENV !== "production" ? PaginationItem.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"     |
   // ----------------------------------------------------------------------
-
   /**
    * @ignore
    */
   children: PropTypes.node,
-
   /**
    * Override or extend the styles applied to the component.
    */
   classes: PropTypes.object,
-
   /**
    * @ignore
    */
   className: PropTypes.string,
-
   /**
    * The active color.
    * It supports both default and custom theme colors, which can be added as shown in the
    * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).
    * @default 'standard'
    */
-  color: PropTypes
-  /* @typescript-to-proptypes-ignore */
-  .oneOfType([PropTypes.oneOf(['primary', 'secondary', 'standard']), PropTypes.string]),
-
+  color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['primary', 'secondary', 'standard']), PropTypes.string]),
   /**
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
   component: PropTypes.elementType,
-
   /**
-   * The components used for first, last, next & previous item type
-   * @default {
-   *   first: FirstPageIcon,
-   *   last: LastPageIcon,
-   *   next: NavigateNextIcon,
-   *   previous: NavigateBeforeIcon,
-   * }
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `slots` prop.
+   * It's recommended to use the `slots` prop instead.
+   *
+   * @default {}
    */
   components: PropTypes.shape({
     first: PropTypes.elementType,
@@ -329,55 +308,56 @@ process.env.NODE_ENV !== "production" ? PaginationItem.propTypes
     next: PropTypes.elementType,
     previous: PropTypes.elementType
   }),
-
   /**
    * If `true`, the component is disabled.
    * @default false
    */
   disabled: PropTypes.bool,
-
   /**
    * The current page number.
    */
   page: PropTypes.node,
-
   /**
    * If `true` the pagination item is selected.
    * @default false
    */
   selected: PropTypes.bool,
-
   /**
    * The shape of the pagination item.
    * @default 'circular'
    */
   shape: PropTypes.oneOf(['circular', 'rounded']),
-
   /**
    * The size of the component.
    * @default 'medium'
    */
-  size: PropTypes
-  /* @typescript-to-proptypes-ignore */
-  .oneOfType([PropTypes.oneOf(['small', 'medium', 'large']), PropTypes.string]),
-
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['small', 'medium', 'large']), PropTypes.string]),
+  /**
+   * The components used for each slot inside.
+   *
+   * This prop is an alias for the `components` prop, which will be deprecated in the future.
+   *
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    first: PropTypes.elementType,
+    last: PropTypes.elementType,
+    next: PropTypes.elementType,
+    previous: PropTypes.elementType
+  }),
   /**
    * 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]),
-
   /**
    * The type of pagination item.
    * @default 'page'
    */
   type: PropTypes.oneOf(['end-ellipsis', 'first', 'last', 'next', 'page', 'previous', 'start-ellipsis']),
-
   /**
    * The variant to use.
    * @default 'text'
    */
-  variant: PropTypes
-  /* @typescript-to-proptypes-ignore */
-  .oneOfType([PropTypes.oneOf(['outlined', 'text']), PropTypes.string])
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['outlined', 'text']), PropTypes.string])
 } : void 0;
 export default PaginationItem;

package/modern/Paper/Paper.js

@@ -10,21 +10,19 @@ import { alpha } from '@mui/system';
 import styled from '../styles/styled';
 import useThemeProps from '../styles/useThemeProps';
 import useTheme from '../styles/useTheme';
-import { getPaperUtilityClass } from './paperClasses'; // Inspired by https://github.com/material-components/material-components-ios/blob/bca36107405594d5b7b16265a5b0ed698f85a5ee/components/Elevation/src/UIColor%2BMaterialElevation.m#L61
+import { getPaperUtilityClass } from './paperClasses';
 
+// Inspired by https://github.com/material-components/material-components-ios/blob/bca36107405594d5b7b16265a5b0ed698f85a5ee/components/Elevation/src/UIColor%2BMaterialElevation.m#L61
 import { jsx as _jsx } from "react/jsx-runtime";
 export const getOverlayAlpha = elevation => {
   let alphaValue;
-
   if (elevation < 1) {
     alphaValue = 5.11916 * elevation ** 2;
   } else {
     alphaValue = 4.5 * Math.log(elevation + 1) + 2;
   }
-
   return (alphaValue / 100).toFixed(2);
 };
-
 const useUtilityClasses = ownerState => {
   const {
     square,
@@ -37,7 +35,6 @@ const useUtilityClasses = ownerState => {
   };
   return composeClasses(slots, getPaperUtilityClass, classes);
 };
-
 const PaperRoot = styled('div', {
   name: 'MuiPaper',
   slot: 'Root',
@@ -70,34 +67,28 @@ const Paper = /*#__PURE__*/React.forwardRef(function Paper(inProps, ref) {
     props: inProps,
     name: 'MuiPaper'
   });
-
   const {
-    className,
-    component = 'div',
-    elevation = 1,
-    square = false,
-    variant = 'elevation'
-  } = props,
-        other = _objectWithoutPropertiesLoose(props, _excluded);
-
+      className,
+      component = 'div',
+      elevation = 1,
+      square = false,
+      variant = 'elevation'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const ownerState = _extends({}, props, {
     component,
     elevation,
     square,
     variant
   });
-
   const classes = useUtilityClasses(ownerState);
-
   if (process.env.NODE_ENV !== 'production') {
     // eslint-disable-next-line react-hooks/rules-of-hooks
     const theme = useTheme();
-
     if (theme.shadows[elevation] === undefined) {
       console.error([`MUI: The elevation provided <Paper elevation={${elevation}}> is not available in the theme.`, `Please make sure that \`theme.shadows[${elevation}]\` is defined.`].join('\n'));
     }
   }
-
   return /*#__PURE__*/_jsx(PaperRoot, _extends({
     as: component,
     ownerState: ownerState,
@@ -105,35 +96,28 @@ const Paper = /*#__PURE__*/React.forwardRef(function Paper(inProps, ref) {
     ref: ref
   }, other));
 });
-process.env.NODE_ENV !== "production" ? Paper.propTypes
-/* remove-proptypes */
-= {
+process.env.NODE_ENV !== "production" ? Paper.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 component used for the root node.
    * Either a string to use a HTML element or a component.
    */
   component: PropTypes.elementType,
-
   /**
    * Shadow depth, corresponds to `dp` in the spec.
    * It accepts values between 0 and 24 inclusive.
@@ -144,31 +128,24 @@ process.env.NODE_ENV !== "production" ? Paper.propTypes
       elevation,
       variant
     } = props;
-
     if (elevation > 0 && variant === 'outlined') {
       return new Error(`MUI: Combining \`elevation={${elevation}}\` with \`variant="${variant}"\` has no effect. Either use \`elevation={0}\` or use a different \`variant\`.`);
     }
-
     return null;
   }),
-
   /**
    * If `true`, rounded corners are disabled.
    * @default false
    */
   square: 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]),
-
   /**
    * The variant to use.
    * @default 'elevation'
    */
-  variant: PropTypes
-  /* @typescript-to-proptypes-ignore */
-  .oneOfType([PropTypes.oneOf(['elevation', 'outlined']), PropTypes.string])
+  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['elevation', 'outlined']), PropTypes.string])
 } : void 0;
 export default Paper;