@mui/material 5.13.1 → 5.13.2

package/Badge/Badge.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["anchorOrigin", "className", "classes", "component", "components", "componentsProps", "children", "overlap", "color", "invisible", "max", "badgeContent", "slots", "slotProps", "showZero", "variant"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -51,7 +54,7 @@ const BadgeBadge = styled('span', {
 })(({
   theme,
   ownerState
-}) => ({
+}) => _extends({
   display: 'flex',
   flexDirection: 'row',
   flexWrap: 'wrap',
@@ -73,94 +76,83 @@ const BadgeBadge = styled('span', {
   transition: theme.transitions.create('transform', {
     easing: theme.transitions.easing.easeInOut,
     duration: theme.transitions.duration.enteringScreen
-  }),
-  ...(ownerState.color !== 'default' && {
-    backgroundColor: (theme.vars || theme).palette[ownerState.color].main,
-    color: (theme.vars || theme).palette[ownerState.color].contrastText
-  }),
-  ...(ownerState.variant === 'dot' && {
-    borderRadius: RADIUS_DOT,
-    height: RADIUS_DOT * 2,
-    minWidth: RADIUS_DOT * 2,
-    padding: 0
-  }),
-  ...(ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'rectangular' && {
-    top: 0,
-    right: 0,
-    transform: 'scale(1) translate(50%, -50%)',
-    transformOrigin: '100% 0%',
-    [`&.${badgeClasses.invisible}`]: {
-      transform: 'scale(0) translate(50%, -50%)'
-    }
-  }),
-  ...(ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'rectangular' && {
-    bottom: 0,
-    right: 0,
-    transform: 'scale(1) translate(50%, 50%)',
-    transformOrigin: '100% 100%',
-    [`&.${badgeClasses.invisible}`]: {
-      transform: 'scale(0) translate(50%, 50%)'
-    }
-  }),
-  ...(ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'rectangular' && {
-    top: 0,
-    left: 0,
-    transform: 'scale(1) translate(-50%, -50%)',
-    transformOrigin: '0% 0%',
-    [`&.${badgeClasses.invisible}`]: {
-      transform: 'scale(0) translate(-50%, -50%)'
-    }
-  }),
-  ...(ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'rectangular' && {
-    bottom: 0,
-    left: 0,
-    transform: 'scale(1) translate(-50%, 50%)',
-    transformOrigin: '0% 100%',
-    [`&.${badgeClasses.invisible}`]: {
-      transform: 'scale(0) translate(-50%, 50%)'
-    }
-  }),
-  ...(ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'circular' && {
-    top: '14%',
-    right: '14%',
-    transform: 'scale(1) translate(50%, -50%)',
-    transformOrigin: '100% 0%',
-    [`&.${badgeClasses.invisible}`]: {
-      transform: 'scale(0) translate(50%, -50%)'
-    }
-  }),
-  ...(ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'circular' && {
-    bottom: '14%',
-    right: '14%',
-    transform: 'scale(1) translate(50%, 50%)',
-    transformOrigin: '100% 100%',
-    [`&.${badgeClasses.invisible}`]: {
-      transform: 'scale(0) translate(50%, 50%)'
-    }
-  }),
-  ...(ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'circular' && {
-    top: '14%',
-    left: '14%',
-    transform: 'scale(1) translate(-50%, -50%)',
-    transformOrigin: '0% 0%',
-    [`&.${badgeClasses.invisible}`]: {
-      transform: 'scale(0) translate(-50%, -50%)'
-    }
-  }),
-  ...(ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'circular' && {
-    bottom: '14%',
-    left: '14%',
-    transform: 'scale(1) translate(-50%, 50%)',
-    transformOrigin: '0% 100%',
-    [`&.${badgeClasses.invisible}`]: {
-      transform: 'scale(0) translate(-50%, 50%)'
-    }
-  }),
-  ...(ownerState.invisible && {
-    transition: theme.transitions.create('transform', {
-      easing: theme.transitions.easing.easeInOut,
-      duration: theme.transitions.duration.leavingScreen
-    })
+  })
+}, ownerState.color !== 'default' && {
+  backgroundColor: (theme.vars || theme).palette[ownerState.color].main,
+  color: (theme.vars || theme).palette[ownerState.color].contrastText
+}, ownerState.variant === 'dot' && {
+  borderRadius: RADIUS_DOT,
+  height: RADIUS_DOT * 2,
+  minWidth: RADIUS_DOT * 2,
+  padding: 0
+}, ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'rectangular' && {
+  top: 0,
+  right: 0,
+  transform: 'scale(1) translate(50%, -50%)',
+  transformOrigin: '100% 0%',
+  [`&.${badgeClasses.invisible}`]: {
+    transform: 'scale(0) translate(50%, -50%)'
+  }
+}, ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'rectangular' && {
+  bottom: 0,
+  right: 0,
+  transform: 'scale(1) translate(50%, 50%)',
+  transformOrigin: '100% 100%',
+  [`&.${badgeClasses.invisible}`]: {
+    transform: 'scale(0) translate(50%, 50%)'
+  }
+}, ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'rectangular' && {
+  top: 0,
+  left: 0,
+  transform: 'scale(1) translate(-50%, -50%)',
+  transformOrigin: '0% 0%',
+  [`&.${badgeClasses.invisible}`]: {
+    transform: 'scale(0) translate(-50%, -50%)'
+  }
+}, ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'rectangular' && {
+  bottom: 0,
+  left: 0,
+  transform: 'scale(1) translate(-50%, 50%)',
+  transformOrigin: '0% 100%',
+  [`&.${badgeClasses.invisible}`]: {
+    transform: 'scale(0) translate(-50%, 50%)'
+  }
+}, ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'circular' && {
+  top: '14%',
+  right: '14%',
+  transform: 'scale(1) translate(50%, -50%)',
+  transformOrigin: '100% 0%',
+  [`&.${badgeClasses.invisible}`]: {
+    transform: 'scale(0) translate(50%, -50%)'
+  }
+}, ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'right' && ownerState.overlap === 'circular' && {
+  bottom: '14%',
+  right: '14%',
+  transform: 'scale(1) translate(50%, 50%)',
+  transformOrigin: '100% 100%',
+  [`&.${badgeClasses.invisible}`]: {
+    transform: 'scale(0) translate(50%, 50%)'
+  }
+}, ownerState.anchorOrigin.vertical === 'top' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'circular' && {
+  top: '14%',
+  left: '14%',
+  transform: 'scale(1) translate(-50%, -50%)',
+  transformOrigin: '0% 0%',
+  [`&.${badgeClasses.invisible}`]: {
+    transform: 'scale(0) translate(-50%, -50%)'
+  }
+}, ownerState.anchorOrigin.vertical === 'bottom' && ownerState.anchorOrigin.horizontal === 'left' && ownerState.overlap === 'circular' && {
+  bottom: '14%',
+  left: '14%',
+  transform: 'scale(1) translate(-50%, 50%)',
+  transformOrigin: '0% 100%',
+  [`&.${badgeClasses.invisible}`]: {
+    transform: 'scale(0) translate(-50%, 50%)'
+  }
+}, ownerState.invisible && {
+  transition: theme.transitions.create('transform', {
+    easing: theme.transitions.easing.easeInOut,
+    duration: theme.transitions.duration.leavingScreen
   })
 }));
 const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
@@ -170,27 +162,26 @@ const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
     name: 'MuiBadge'
   });
   const {
-    anchorOrigin: anchorOriginProp = {
-      vertical: 'top',
-      horizontal: 'right'
-    },
-    className,
-    classes: classesProp,
-    component,
-    components = {},
-    componentsProps = {},
-    children,
-    overlap: overlapProp = 'rectangular',
-    color: colorProp = 'default',
-    invisible: invisibleProp = false,
-    max: maxProp = 99,
-    badgeContent: badgeContentProp,
-    slots,
-    slotProps,
-    showZero = false,
-    variant: variantProp = 'standard',
-    ...other
-  } = props;
+      anchorOrigin: anchorOriginProp = {
+        vertical: 'top',
+        horizontal: 'right'
+      },
+      className,
+      component,
+      components = {},
+      componentsProps = {},
+      children,
+      overlap: overlapProp = 'rectangular',
+      color: colorProp = 'default',
+      invisible: invisibleProp = false,
+      max: maxProp = 99,
+      badgeContent: badgeContentProp,
+      slots,
+      slotProps,
+      showZero = false,
+      variant: variantProp = 'standard'
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const {
     badgeContent,
     invisible: invisibleFromHook,
@@ -217,8 +208,7 @@ const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
     variant = variantProp
   } = invisible ? prevProps : props;
   const displayValue = variant !== 'dot' ? displayValueFromHook : undefined;
-  const ownerState = {
-    ...props,
+  const ownerState = _extends({}, props, {
     badgeContent,
     invisible,
     max,
@@ -228,7 +218,7 @@ const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
     color,
     overlap,
     variant
-  };
+  });
   const classes = useUtilityClasses(ownerState);
 
   // support both `slots` and `components` for backward compatibility
@@ -253,13 +243,11 @@ const Badge = /*#__PURE__*/React.forwardRef(function Badge(inProps, ref) {
     ownerState,
     className: clsx(classes.badge, badgeSlotProps == null ? void 0 : badgeSlotProps.className)
   });
-  return /*#__PURE__*/_jsxs(RootSlot, {
-    ...rootProps,
-    children: [children, /*#__PURE__*/_jsx(BadgeSlot, {
-      ...badgeProps,
+  return /*#__PURE__*/_jsxs(RootSlot, _extends({}, rootProps, {
+    children: [children, /*#__PURE__*/_jsx(BadgeSlot, _extends({}, badgeProps, {
       children: displayValue
-    })]
-  });
+    }))]
+  }));
 });
 process.env.NODE_ENV !== "production" ? Badge.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/Badge/badgeClasses.d.ts

@@ -1,56 +1,56 @@
-export interface BadgeClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** Styles applied to the badge `span` element. */
-    badge: string;
-    /** Styles applied to the badge `span` element if `variant="dot"`. */
-    dot: string;
-    /** Styles applied to the badge `span` element if `variant="standard"`. */
-    standard: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'right' }}`. */
-    anchorOriginTopRight: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'right' }}`. */
-    anchorOriginBottomRight: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'left' }}`. */
-    anchorOriginTopLeft: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'left' }}`. */
-    anchorOriginBottomLeft: string;
-    /** State class applied to the badge `span` element if `invisible={true}`. */
-    invisible: string;
-    /** Styles applied to the badge `span` element if `color="primary"`. */
-    colorPrimary: string;
-    /** Styles applied to the badge `span` element if `color="secondary"`. */
-    colorSecondary: string;
-    /** Styles applied to the badge `span` element if `color="error"`. */
-    colorError: string;
-    /** Styles applied to the badge `span` element if `color="info"`. */
-    colorInfo: string;
-    /** Styles applied to the badge `span` element if `color="success"`. */
-    colorSuccess: string;
-    /** Styles applied to the badge `span` element if `color="warning"`. */
-    colorWarning: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'right' }} overlap="rectangular"`. */
-    anchorOriginTopRightRectangular: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'right' }} overlap="rectangular"`. */
-    anchorOriginBottomRightRectangular: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'left' }} overlap="rectangular"`. */
-    anchorOriginTopLeftRectangular: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'left' }} overlap="rectangular"`. */
-    anchorOriginBottomLeftRectangular: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'right' }} overlap="circular"`. */
-    anchorOriginTopRightCircular: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'right' }} overlap="circular"`. */
-    anchorOriginBottomRightCircular: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'left' }} overlap="circular"`. */
-    anchorOriginTopLeftCircular: string;
-    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'left' }} overlap="circular"`. */
-    anchorOriginBottomLeftCircular: string;
-    /** Styles applied to the badge `span` element if `overlap="rectangular"`. */
-    overlapRectangular: string;
-    /** Styles applied to the badge `span` element if `overlap="circular"`. */
-    overlapCircular: string;
-}
-export type BadgeClassKey = keyof BadgeClasses;
-export declare function getBadgeUtilityClass(slot: string): string;
-declare const badgeClasses: BadgeClasses;
-export default badgeClasses;
+export interface BadgeClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** Styles applied to the badge `span` element. */
+    badge: string;
+    /** Styles applied to the badge `span` element if `variant="dot"`. */
+    dot: string;
+    /** Styles applied to the badge `span` element if `variant="standard"`. */
+    standard: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'right' }}`. */
+    anchorOriginTopRight: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'right' }}`. */
+    anchorOriginBottomRight: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'left' }}`. */
+    anchorOriginTopLeft: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'left' }}`. */
+    anchorOriginBottomLeft: string;
+    /** State class applied to the badge `span` element if `invisible={true}`. */
+    invisible: string;
+    /** Styles applied to the badge `span` element if `color="primary"`. */
+    colorPrimary: string;
+    /** Styles applied to the badge `span` element if `color="secondary"`. */
+    colorSecondary: string;
+    /** Styles applied to the badge `span` element if `color="error"`. */
+    colorError: string;
+    /** Styles applied to the badge `span` element if `color="info"`. */
+    colorInfo: string;
+    /** Styles applied to the badge `span` element if `color="success"`. */
+    colorSuccess: string;
+    /** Styles applied to the badge `span` element if `color="warning"`. */
+    colorWarning: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'right' }} overlap="rectangular"`. */
+    anchorOriginTopRightRectangular: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'right' }} overlap="rectangular"`. */
+    anchorOriginBottomRightRectangular: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'left' }} overlap="rectangular"`. */
+    anchorOriginTopLeftRectangular: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'left' }} overlap="rectangular"`. */
+    anchorOriginBottomLeftRectangular: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'right' }} overlap="circular"`. */
+    anchorOriginTopRightCircular: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'right' }} overlap="circular"`. */
+    anchorOriginBottomRightCircular: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'top', 'left' }} overlap="circular"`. */
+    anchorOriginTopLeftCircular: string;
+    /** Styles applied to the badge `span` element if `anchorOrigin={{ 'bottom', 'left' }} overlap="circular"`. */
+    anchorOriginBottomLeftCircular: string;
+    /** Styles applied to the badge `span` element if `overlap="rectangular"`. */
+    overlapRectangular: string;
+    /** Styles applied to the badge `span` element if `overlap="circular"`. */
+    overlapCircular: string;
+}
+export type BadgeClassKey = keyof BadgeClasses;
+export declare function getBadgeUtilityClass(slot: string): string;
+declare const badgeClasses: BadgeClasses;
+export default badgeClasses;

package/BottomNavigation/BottomNavigation.js

@@ -1,3 +1,6 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["children", "className", "component", "onChange", "showLabels", "value"];
 import * as React from 'react';
 import { isFragment } from 'react-is';
 import PropTypes from 'prop-types';
@@ -34,26 +37,25 @@ const BottomNavigation = /*#__PURE__*/React.forwardRef(function BottomNavigation
     name: 'MuiBottomNavigation'
   });
   const {
-    children,
-    className,
-    component = 'div',
-    onChange,
-    showLabels = false,
-    value,
-    ...other
-  } = props;
-  const ownerState = {
-    ...props,
+      children,
+      className,
+      component = 'div',
+      onChange,
+      showLabels = false,
+      value
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const ownerState = _extends({}, props, {
     component,
     showLabels
-  };
+  });
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/_jsx(BottomNavigationRoot, {
+  return /*#__PURE__*/_jsx(BottomNavigationRoot, _extends({
     as: component,
     className: clsx(classes.root, className),
     ref: ref,
-    ownerState: ownerState,
-    ...other,
+    ownerState: ownerState
+  }, other, {
     children: React.Children.map(children, (child, childIndex) => {
       if (! /*#__PURE__*/React.isValidElement(child)) {
         return null;
@@ -71,7 +73,7 @@ const BottomNavigation = /*#__PURE__*/React.forwardRef(function BottomNavigation
         onChange
       });
     })
-  });
+  }));
 });
 process.env.NODE_ENV !== "production" ? BottomNavigation.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/BottomNavigation/bottomNavigationClasses.d.ts

@@ -1,8 +1,8 @@
-export interface BottomNavigationClasses {
-    /** Styles applied to the root element. */
-    root: string;
-}
-export type BottomNavigationClassKey = keyof BottomNavigationClasses;
-export declare function getBottomNavigationUtilityClass(slot: string): string;
-declare const bottomNavigationClasses: BottomNavigationClasses;
-export default bottomNavigationClasses;
+export interface BottomNavigationClasses {
+    /** Styles applied to the root element. */
+    root: string;
+}
+export type BottomNavigationClassKey = keyof BottomNavigationClasses;
+export declare function getBottomNavigationUtilityClass(slot: string): string;
+declare const bottomNavigationClasses: BottomNavigationClasses;
+export default bottomNavigationClasses;

package/BottomNavigationAction/BottomNavigationAction.js

@@ -1,3 +1,6 @@
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import _extends from "@babel/runtime/helpers/esm/extends";
+const _excluded = ["className", "icon", "label", "onChange", "onClick", "selected", "showLabel", "value"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
@@ -33,7 +36,7 @@ const BottomNavigationActionRoot = styled(ButtonBase, {
 })(({
   theme,
   ownerState
-}) => ({
+}) => _extends({
   transition: theme.transitions.create(['color', 'padding-top'], {
     duration: theme.transitions.duration.short
   }),
@@ -42,13 +45,12 @@ const BottomNavigationActionRoot = styled(ButtonBase, {
   maxWidth: 168,
   color: (theme.vars || theme).palette.text.secondary,
   flexDirection: 'column',
-  flex: '1',
-  ...(!ownerState.showLabel && !ownerState.selected && {
-    paddingTop: 14
-  }),
-  ...(!ownerState.showLabel && !ownerState.selected && !ownerState.label && {
-    paddingTop: 0
-  }),
+  flex: '1'
+}, !ownerState.showLabel && !ownerState.selected && {
+  paddingTop: 14
+}, !ownerState.showLabel && !ownerState.selected && !ownerState.label && {
+  paddingTop: 0
+}, {
   [`&.${bottomNavigationActionClasses.selected}`]: {
     color: (theme.vars || theme).palette.primary.main
   }
@@ -60,16 +62,16 @@ const BottomNavigationActionLabel = styled('span', {
 })(({
   theme,
   ownerState
-}) => ({
+}) => _extends({
   fontFamily: theme.typography.fontFamily,
   fontSize: theme.typography.pxToRem(12),
   opacity: 1,
   transition: 'font-size 0.2s, opacity 0.2s',
-  transitionDelay: '0.1s',
-  ...(!ownerState.showLabel && !ownerState.selected && {
-    opacity: 0,
-    transitionDelay: '0s'
-  }),
+  transitionDelay: '0.1s'
+}, !ownerState.showLabel && !ownerState.selected && {
+  opacity: 0,
+  transitionDelay: '0s'
+}, {
   [`&.${bottomNavigationActionClasses.selected}`]: {
     fontSize: theme.typography.pxToRem(14)
   }
@@ -80,17 +82,17 @@ const BottomNavigationAction = /*#__PURE__*/React.forwardRef(function BottomNavi
     name: 'MuiBottomNavigationAction'
   });
   const {
-    className,
-    icon,
-    label,
-    onChange,
-    onClick,
-    // eslint-disable-next-line react/prop-types -- private, always overridden by BottomNavigation
-    selected,
-    showLabel,
-    value,
-    ...other
-  } = props;
+      className,
+      icon,
+      label,
+      onChange,
+      onClick
+      // eslint-disable-next-line react/prop-types -- private, always overridden by BottomNavigation
+      ,
+
+      value
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const ownerState = props;
   const classes = useUtilityClasses(ownerState);
   const handleChange = event => {
@@ -101,19 +103,19 @@ const BottomNavigationAction = /*#__PURE__*/React.forwardRef(function BottomNavi
       onClick(event);
     }
   };
-  return /*#__PURE__*/_jsxs(BottomNavigationActionRoot, {
+  return /*#__PURE__*/_jsxs(BottomNavigationActionRoot, _extends({
     ref: ref,
     className: clsx(classes.root, className),
     focusRipple: true,
     onClick: handleChange,
-    ownerState: ownerState,
-    ...other,
+    ownerState: ownerState
+  }, other, {
     children: [icon, /*#__PURE__*/_jsx(BottomNavigationActionLabel, {
       className: classes.label,
       ownerState: ownerState,
       children: label
     })]
-  });
+  }));
 });
 process.env.NODE_ENV !== "production" ? BottomNavigationAction.propTypes /* remove-proptypes */ = {
   // ----------------------------- Warning --------------------------------

package/BottomNavigationAction/bottomNavigationActionClasses.d.ts

@@ -1,14 +1,14 @@
-export interface BottomNavigationActionClasses {
-    /** Styles applied to the root element. */
-    root: string;
-    /** State class applied to the root element if selected. */
-    selected: string;
-    /** State class applied to the root element if `showLabel={false}` and not selected. */
-    iconOnly: string;
-    /** Styles applied to the label's span element. */
-    label: string;
-}
-export type BottomNavigationActionClassKey = keyof BottomNavigationActionClasses;
-export declare function getBottomNavigationActionUtilityClass(slot: string): string;
-declare const bottomNavigationActionClasses: BottomNavigationActionClasses;
-export default bottomNavigationActionClasses;
+export interface BottomNavigationActionClasses {
+    /** Styles applied to the root element. */
+    root: string;
+    /** State class applied to the root element if selected. */
+    selected: string;
+    /** State class applied to the root element if `showLabel={false}` and not selected. */
+    iconOnly: string;
+    /** Styles applied to the label's span element. */
+    label: string;
+}
+export type BottomNavigationActionClassKey = keyof BottomNavigationActionClasses;
+export declare function getBottomNavigationActionUtilityClass(slot: string): string;
+declare const bottomNavigationActionClasses: BottomNavigationActionClasses;
+export default bottomNavigationActionClasses;