@mui/material 6.0.0-alpha.7 → 6.0.0-alpha.9

package/node/Rating/Rating.js

@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
@@ -23,8 +21,6 @@ var _zeroStyled = require("../zero-styled");
 var _slotShouldForwardProp = _interopRequireDefault(require("../styles/slotShouldForwardProp"));
 var _ratingClasses = _interopRequireWildcard(require("./ratingClasses"));
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["value"],
-  _excluded2 = ["className", "defaultValue", "disabled", "emptyIcon", "emptyLabelText", "getLabelText", "highlightSelectedOnly", "icon", "IconContainerComponent", "max", "name", "onChange", "onChangeActive", "onMouseLeave", "onMouseMove", "precision", "readOnly", "size", "value"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useThemeProps = (0, _zeroStyled.createUseThemeProps)('MuiRating');
@@ -197,8 +193,13 @@ const RatingDecimal = (0, _zeroStyled.styled)('span', {
   }]
 });
 function IconContainer(props) {
-  const other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", (0, _extends2.default)({}, other));
+  const {
+    value,
+    ...other
+  } = props;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+    ...other
+  });
 }
 process.env.NODE_ENV !== "production" ? IconContainer.propTypes = {
   value: _propTypes.default.number.isRequired
@@ -236,32 +237,35 @@ function RatingItem(props) {
     as: IconContainerComponent,
     value: itemValue,
     className: (0, _clsx.default)(classes.icon, isFilled ? classes.iconFilled : classes.iconEmpty, isHovered && classes.iconHover, isFocused && classes.iconFocus, isActive && classes.iconActive),
-    ownerState: (0, _extends2.default)({}, ownerState, {
+    ownerState: {
+      ...ownerState,
       iconEmpty: !isFilled,
       iconFilled: isFilled,
       iconHover: isHovered,
       iconFocus: isFocused,
       iconActive: isActive
-    }),
+    },
     children: emptyIcon && !isFilled ? emptyIcon : icon
   });
   if (readOnly) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", (0, _extends2.default)({}, labelProps, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      ...labelProps,
       children: container
-    }));
+    });
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(RatingLabel, (0, _extends2.default)({
-      ownerState: (0, _extends2.default)({}, ownerState, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(RatingLabel, {
+      ownerState: {
+        ...ownerState,
         emptyValueFocused: undefined
-      }),
-      htmlFor: id
-    }, labelProps, {
+      },
+      htmlFor: id,
+      ...labelProps,
       children: [container, /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
         className: classes.visuallyHidden,
         children: getLabelText(itemValue)
       })]
-    })), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
       className: classes.visuallyHidden,
       onFocus: onFocus,
       onBlur: onBlur,
@@ -314,27 +318,27 @@ const Rating = /*#__PURE__*/React.forwardRef(function Rating(inProps, ref) {
     props: inProps
   });
   const {
-      className,
-      defaultValue = null,
-      disabled = false,
-      emptyIcon = defaultEmptyIcon,
-      emptyLabelText = 'Empty',
-      getLabelText = defaultLabelText,
-      highlightSelectedOnly = false,
-      icon = defaultIcon,
-      IconContainerComponent = IconContainer,
-      max = 5,
-      name: nameProp,
-      onChange,
-      onChangeActive,
-      onMouseLeave,
-      onMouseMove,
-      precision = 1,
-      readOnly = false,
-      size = 'medium',
-      value: valueProp
-    } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded2);
+    className,
+    defaultValue = null,
+    disabled = false,
+    emptyIcon = defaultEmptyIcon,
+    emptyLabelText = 'Empty',
+    getLabelText = defaultLabelText,
+    highlightSelectedOnly = false,
+    icon = defaultIcon,
+    IconContainerComponent = IconContainer,
+    max = 5,
+    name: nameProp,
+    onChange,
+    onChangeActive,
+    onMouseLeave,
+    onMouseMove,
+    precision = 1,
+    readOnly = false,
+    size = 'medium',
+    value: valueProp,
+    ...other
+  } = props;
   const name = (0, _utils.unstable_useId)(nameProp);
   const [valueDerived, setValueState] = (0, _utils.useControlled)({
     controlled: valueProp,
@@ -460,7 +464,8 @@ const Rating = /*#__PURE__*/React.forwardRef(function Rating(inProps, ref) {
     }));
   };
   const [emptyValueFocused, setEmptyValueFocused] = React.useState(false);
-  const ownerState = (0, _extends2.default)({}, props, {
+  const ownerState = {
+    ...props,
     defaultValue,
     disabled,
     emptyIcon,
@@ -474,17 +479,17 @@ const Rating = /*#__PURE__*/React.forwardRef(function Rating(inProps, ref) {
     precision,
     readOnly,
     size
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(RatingRoot, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(RatingRoot, {
     ref: handleRef,
     onMouseMove: handleMouseMove,
     onMouseLeave: handleMouseLeave,
     className: (0, _clsx.default)(classes.root, className, readOnly && 'MuiRating-readOnly'),
     ownerState: ownerState,
     role: readOnly ? 'img' : null,
-    "aria-label": readOnly ? getLabelText(value) : null
-  }, other, {
+    "aria-label": readOnly ? getLabelText(value) : null,
+    ...other,
     children: [Array.from(new Array(max)).map((_, index) => {
       const itemValue = index + 1;
       const ratingItemProps = {
@@ -516,7 +521,8 @@ const Rating = /*#__PURE__*/React.forwardRef(function Rating(inProps, ref) {
           iconActive: isActive,
           children: items.map(($, indexDecimal) => {
             const itemDecimalValue = roundValueToPrecision(itemValue - 1 + (indexDecimal + 1) * precision, precision);
-            return /*#__PURE__*/(0, _jsxRuntime.jsx)(RatingItem, (0, _extends2.default)({}, ratingItemProps, {
+            return /*#__PURE__*/(0, _jsxRuntime.jsx)(RatingItem, {
+              ...ratingItemProps,
               // The icon is already displayed as active
               isActive: false,
               itemValue: itemDecimalValue,
@@ -527,14 +533,15 @@ const Rating = /*#__PURE__*/React.forwardRef(function Rating(inProps, ref) {
                   position: 'absolute'
                 }
               }
-            }), itemDecimalValue);
+            }, itemDecimalValue);
           })
         }, itemValue);
       }
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(RatingItem, (0, _extends2.default)({}, ratingItemProps, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(RatingItem, {
+        ...ratingItemProps,
         isActive: isActive,
         itemValue: itemValue
-      }), itemValue);
+      }, itemValue);
     }), !readOnly && !disabled && /*#__PURE__*/(0, _jsxRuntime.jsxs)(RatingLabel, {
       className: (0, _clsx.default)(classes.label, classes.labelEmptyValue),
       ownerState: ownerState,
@@ -553,7 +560,7 @@ const Rating = /*#__PURE__*/React.forwardRef(function Rating(inProps, ref) {
         children: emptyLabelText
       })]
     })]
-  }));
+  });
 });
 process.env.NODE_ENV !== "production" ? Rating.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐

package/node/ScopedCssBaseline/ScopedCssBaseline.js

@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
@@ -17,7 +15,6 @@ var _styled = _interopRequireDefault(require("../styles/styled"));
 var _CssBaseline = require("../CssBaseline/CssBaseline");
 var _scopedCssBaselineClasses = require("./scopedCssBaselineClasses");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["className", "component", "enableColorScheme"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useUtilityClasses = ownerState => {
@@ -46,14 +43,17 @@ const ScopedCssBaselineRoot = (0, _styled.default)('div', {
       };
     });
   }
-  return (0, _extends2.default)({}, (0, _CssBaseline.html)(theme, ownerState.enableColorScheme), (0, _CssBaseline.body)(theme), {
+  return {
+    ...(0, _CssBaseline.html)(theme, ownerState.enableColorScheme),
+    ...(0, _CssBaseline.body)(theme),
     '& *, & *::before, & *::after': {
       boxSizing: 'inherit'
     },
     '& strong, & b': {
       fontWeight: theme.typography.fontWeightBold
-    }
-  }, colorSchemeStyles);
+    },
+    ...colorSchemeStyles
+  };
 });
 const ScopedCssBaseline = /*#__PURE__*/React.forwardRef(function ScopedCssBaseline(inProps, ref) {
   const props = (0, _useThemeProps.default)({
@@ -61,20 +61,23 @@ const ScopedCssBaseline = /*#__PURE__*/React.forwardRef(function ScopedCssBaseli
     name: 'MuiScopedCssBaseline'
   });
   const {
-      className,
-      component = 'div'
-    } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  const ownerState = (0, _extends2.default)({}, props, {
+    className,
+    component = 'div',
+    enableColorScheme,
+    ...other
+  } = props;
+  const ownerState = {
+    ...props,
     component
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ScopedCssBaselineRoot, (0, _extends2.default)({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ScopedCssBaselineRoot, {
     as: component,
     className: (0, _clsx.default)(classes.root, className),
     ref: ref,
-    ownerState: ownerState
-  }, other));
+    ownerState: ownerState,
+    ...other
+  });
 });
 process.env.NODE_ENV !== "production" ? ScopedCssBaseline.propTypes /* remove-proptypes */ = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐

package/node/Select/Select.js

@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var React = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx = _interopRequireDefault(require("clsx"));
@@ -25,8 +23,6 @@ var _useForkRef = _interopRequireDefault(require("../utils/useForkRef"));
 var _zeroStyled = require("../zero-styled");
 var _rootShouldForwardProp = _interopRequireDefault(require("../styles/rootShouldForwardProp"));
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["autoWidth", "children", "classes", "className", "defaultOpen", "displayEmpty", "IconComponent", "id", "input", "inputProps", "label", "labelId", "MenuProps", "multiple", "native", "onClose", "onOpen", "open", "renderValue", "SelectDisplayProps", "variant"],
-  _excluded2 = ["root"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useUtilityClasses = ownerState => {
@@ -50,29 +46,29 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     props: inProps
   });
   const {
-      autoWidth = false,
-      children,
-      classes: classesProp = {},
-      className,
-      defaultOpen = false,
-      displayEmpty = false,
-      IconComponent = _ArrowDropDown.default,
-      id,
-      input,
-      inputProps,
-      label,
-      labelId,
-      MenuProps,
-      multiple = false,
-      native = false,
-      onClose,
-      onOpen,
-      open,
-      renderValue,
-      SelectDisplayProps,
-      variant: variantProp = 'outlined'
-    } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+    autoWidth = false,
+    children,
+    classes: classesProp = {},
+    className,
+    defaultOpen = false,
+    displayEmpty = false,
+    IconComponent = _ArrowDropDown.default,
+    id,
+    input,
+    inputProps,
+    label,
+    labelId,
+    MenuProps,
+    multiple = false,
+    native = false,
+    onClose,
+    onOpen,
+    open,
+    renderValue,
+    SelectDisplayProps,
+    variant: variantProp = 'outlined',
+    ...other
+  } = props;
   const inputComponent = native ? _NativeSelectInput.default : _SelectInput.default;
   const muiFormControl = (0, _useFormControl.default)();
   const fcs = (0, _formControlState.default)({
@@ -81,12 +77,16 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
     states: ['variant', 'error']
   });
   const variant = fcs.variant || variantProp;
-  const ownerState = (0, _extends2.default)({}, props, {
+  const ownerState = {
+    ...props,
     variant,
     classes: classesProp
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  const restOfClasses = (0, _objectWithoutPropertiesLoose2.default)(classes, _excluded2);
+  const {
+    root,
+    ...restOfClasses
+  } = classes;
   const InputComponent = input || {
     standard: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledInput, {
       ownerState: ownerState
@@ -101,44 +101,50 @@ const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) {
   }[variant];
   const inputComponentRef = (0, _useForkRef.default)(ref, InputComponent.ref);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
-    children: /*#__PURE__*/React.cloneElement(InputComponent, (0, _extends2.default)({
+    children: /*#__PURE__*/React.cloneElement(InputComponent, {
       // Most of the logic is implemented in `SelectInput`.
       // The `Select` component is a simple API wrapper to expose something better to play with.
       inputComponent,
-      inputProps: (0, _extends2.default)({
+      inputProps: {
         children,
         error: fcs.error,
         IconComponent,
         variant,
         type: undefined,
         // We render a select. We can ignore the type provided by the `Input`.
-        multiple
-      }, native ? {
-        id
-      } : {
-        autoWidth,
-        defaultOpen,
-        displayEmpty,
-        labelId,
-        MenuProps,
-        onClose,
-        onOpen,
-        open,
-        renderValue,
-        SelectDisplayProps: (0, _extends2.default)({
+        multiple,
+        ...(native ? {
           id
-        }, SelectDisplayProps)
-      }, inputProps, {
-        classes: inputProps ? (0, _deepmerge.default)(restOfClasses, inputProps.classes) : restOfClasses
-      }, input ? input.props.inputProps : {})
-    }, (multiple && native || displayEmpty) && variant === 'outlined' ? {
-      notched: true
-    } : {}, {
+        } : {
+          autoWidth,
+          defaultOpen,
+          displayEmpty,
+          labelId,
+          MenuProps,
+          onClose,
+          onOpen,
+          open,
+          renderValue,
+          SelectDisplayProps: {
+            id,
+            ...SelectDisplayProps
+          }
+        }),
+        ...inputProps,
+        classes: inputProps ? (0, _deepmerge.default)(restOfClasses, inputProps.classes) : restOfClasses,
+        ...(input ? input.props.inputProps : {})
+      },
+      ...((multiple && native || displayEmpty) && variant === 'outlined' ? {
+        notched: true
+      } : {}),
       ref: inputComponentRef,
-      className: (0, _clsx.default)(InputComponent.props.className, className, classes.root)
-    }, !input && {
-      variant
-    }, other))
+      className: (0, _clsx.default)(InputComponent.props.className, className, classes.root),
+      // If a custom input is provided via 'input' prop, do not allow 'variant' to be propagated to it's root element. See https://github.com/mui/material-ui/issues/33894.
+      ...(!input && {
+        variant
+      }),
+      ...other
+    })
   });
 });
 process.env.NODE_ENV !== "production" ? Select.propTypes /* remove-proptypes */ = {

package/node/Select/SelectInput.js

@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
 var _formatMuiErrorMessage2 = _interopRequireDefault(require("@mui/utils/formatMuiErrorMessage"));
 var React = _interopRequireWildcard(require("react"));
 var _reactIs = require("react-is");
@@ -28,7 +26,6 @@ var _useControlled = _interopRequireDefault(require("../utils/useControlled"));
 var _selectClasses = _interopRequireWildcard(require("./selectClasses"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _span;
-const _excluded = ["aria-describedby", "aria-label", "autoFocus", "autoWidth", "children", "className", "defaultOpen", "defaultValue", "disabled", "displayEmpty", "error", "IconComponent", "inputRef", "labelId", "MenuProps", "multiple", "name", "onBlur", "onChange", "onClose", "onFocus", "onOpen", "open", "readOnly", "renderValue", "SelectDisplayProps", "tabIndex", "type", "value", "variant"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const SelectSelect = (0, _zeroStyled.styled)(_NativeSelectInput.StyledSelectSelect, {
@@ -120,40 +117,39 @@ const useUtilityClasses = ownerState => {
 const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, ref) {
   var _MenuProps$slotProps;
   const {
-      'aria-describedby': ariaDescribedby,
-      'aria-label': ariaLabel,
-      autoFocus,
-      autoWidth,
-      children,
-      className,
-      defaultOpen,
-      defaultValue,
-      disabled,
-      displayEmpty,
-      error = false,
-      IconComponent,
-      inputRef: inputRefProp,
-      labelId,
-      MenuProps = {},
-      multiple,
-      name,
-      onBlur,
-      onChange,
-      onClose,
-      onFocus,
-      onOpen,
-      open: openProp,
-      readOnly,
-      renderValue,
-      SelectDisplayProps = {},
-      tabIndex: tabIndexProp
-      // catching `type` from Input which makes no sense for SelectInput
-      ,
-
-      value: valueProp,
-      variant = 'standard'
-    } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+    'aria-describedby': ariaDescribedby,
+    'aria-label': ariaLabel,
+    autoFocus,
+    autoWidth,
+    children,
+    className,
+    defaultOpen,
+    defaultValue,
+    disabled,
+    displayEmpty,
+    error = false,
+    IconComponent,
+    inputRef: inputRefProp,
+    labelId,
+    MenuProps = {},
+    multiple,
+    name,
+    onBlur,
+    onChange,
+    onClose,
+    onFocus,
+    onOpen,
+    open: openProp,
+    readOnly,
+    renderValue,
+    SelectDisplayProps = {},
+    tabIndex: tabIndexProp,
+    // catching `type` from Input which makes no sense for SelectInput
+    type,
+    value: valueProp,
+    variant = 'standard',
+    ...other
+  } = props;
   const [value, setValueState] = (0, _useControlled.default)({
     controlled: valueProp,
     default: defaultValue,
@@ -434,17 +430,21 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     tabIndex = disabled ? null : 0;
   }
   const buttonId = SelectDisplayProps.id || (name ? `mui-component-select-${name}` : undefined);
-  const ownerState = (0, _extends2.default)({}, props, {
+  const ownerState = {
+    ...props,
     variant,
     value,
     open,
     error
-  });
+  };
   const classes = useUtilityClasses(ownerState);
-  const paperProps = (0, _extends2.default)({}, MenuProps.PaperProps, (_MenuProps$slotProps = MenuProps.slotProps) == null ? void 0 : _MenuProps$slotProps.paper);
+  const paperProps = {
+    ...MenuProps.PaperProps,
+    ...((_MenuProps$slotProps = MenuProps.slotProps) == null ? void 0 : _MenuProps$slotProps.paper)
+  };
   const listboxId = (0, _useId.default)();
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SelectSelect, (0, _extends2.default)({
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SelectSelect, {
       as: "div",
       ref: handleDisplayRef,
       tabIndex: tabIndex,
@@ -459,8 +459,8 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       onKeyDown: handleKeyDown,
       onMouseDown: disabled || readOnly ? null : handleMouseDown,
       onBlur: handleBlur,
-      onFocus: onFocus
-    }, SelectDisplayProps, {
+      onFocus: onFocus,
+      ...SelectDisplayProps,
       ownerState: ownerState,
       className: (0, _clsx.default)(SelectDisplayProps.className, classes.select, className)
       // The id is required for proper a11y
@@ -471,7 +471,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
         className: "notranslate",
         children: "\u200B"
       })) : display
-    })), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectNativeInput, (0, _extends2.default)({
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectNativeInput, {
       "aria-invalid": error,
       value: Array.isArray(value) ? value.join(',') : value,
       name: name,
@@ -482,12 +482,13 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       disabled: disabled,
       className: classes.nativeInput,
       autoFocus: autoFocus,
+      ...other,
       ownerState: ownerState
-    }, other)), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectIcon, {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectIcon, {
       as: IconComponent,
       className: classes.icon,
       ownerState: ownerState
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Menu.default, (0, _extends2.default)({
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Menu.default, {
       id: `menu-${name || ''}`,
       anchorEl: anchorElement,
       open: open,
@@ -499,24 +500,28 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       transformOrigin: {
         vertical: 'top',
         horizontal: 'center'
-      }
-    }, MenuProps, {
-      MenuListProps: (0, _extends2.default)({
+      },
+      ...MenuProps,
+      MenuListProps: {
         'aria-labelledby': labelId,
         role: 'listbox',
         'aria-multiselectable': multiple ? 'true' : undefined,
         disableListWrap: true,
-        id: listboxId
-      }, MenuProps.MenuListProps),
-      slotProps: (0, _extends2.default)({}, MenuProps.slotProps, {
-        paper: (0, _extends2.default)({}, paperProps, {
-          style: (0, _extends2.default)({
-            minWidth: menuMinWidth
-          }, paperProps != null ? paperProps.style : null)
-        })
-      }),
+        id: listboxId,
+        ...MenuProps.MenuListProps
+      },
+      slotProps: {
+        ...MenuProps.slotProps,
+        paper: {
+          ...paperProps,
+          style: {
+            minWidth: menuMinWidth,
+            ...(paperProps != null ? paperProps.style : null)
+          }
+        }
+      },
       children: items
-    }))]
+    })]
   });
 });
 process.env.NODE_ENV !== "production" ? SelectInput.propTypes = {