@mui/material 5.11.0 → 5.11.2

package/modern/Chip/Chip.js

@@ -168,7 +168,7 @@ const ChipRoot = styled('div', {
     color: (theme.vars || theme).palette[ownerState.color].contrastText
   }, ownerState.onDelete && {
     [`&.${chipClasses.focusVisible}`]: {
-      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity + theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
     }
   }, ownerState.onDelete && ownerState.color !== 'default' && {
     [`&.${chipClasses.focusVisible}`]: {
@@ -183,10 +183,10 @@ const ChipRoot = styled('div', {
   WebkitTapHighlightColor: 'transparent',
   cursor: 'pointer',
   '&:hover': {
-    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity + theme.vars.palette.action.hoverOpacity}))` : alpha(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity)
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.hoverOpacity}))` : alpha(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity)
   },
   [`&.${chipClasses.focusVisible}`]: {
-    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity + theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
   },
   '&:active': {
     boxShadow: (theme.vars || theme).shadows[1]

package/modern/FilledInput/FilledInput.js

@@ -86,9 +86,13 @@ const FilledInputRoot = styled(InputBaseRoot, {
       // See https://github.com/mui/material-ui/issues/31766
       transform: 'scaleX(1) translateX(0)'
     },
-    [`&.${filledInputClasses.error}:after`]: {
-      borderBottomColor: (theme.vars || theme).palette.error.main,
-      transform: 'scaleX(1)' // error is always underlined in red
+    [`&.${filledInputClasses.error}`]: {
+      '&:before, &:after': {
+        borderBottomColor: (theme.vars || theme).palette.error.main
+      },
+      '&:focus-within:after': {
+        transform: 'scaleX(1)' // error is always underlined in red
+      }
     },
 
     '&:before': {
@@ -105,7 +109,7 @@ const FilledInputRoot = styled(InputBaseRoot, {
       pointerEvents: 'none' // Transparent to the hover style.
     },
 
-    [`&:hover:not(.${filledInputClasses.disabled}):before`]: {
+    [`&:hover:not(.${filledInputClasses.disabled}, .${filledInputClasses.error}):before`]: {
       borderBottom: `1px solid ${(theme.vars || theme).palette.text.primary}`
     },
     [`&.${filledInputClasses.disabled}:before`]: {

package/modern/Input/Input.js

@@ -70,9 +70,13 @@ const InputRoot = styled(InputBaseRoot, {
       // See https://github.com/mui/material-ui/issues/31766
       transform: 'scaleX(1) translateX(0)'
     },
-    [`&.${inputClasses.error}:after`]: {
-      borderBottomColor: (theme.vars || theme).palette.error.main,
-      transform: 'scaleX(1)' // error is always underlined in red
+    [`&.${inputClasses.error}`]: {
+      '&:before, &:after': {
+        borderBottomColor: (theme.vars || theme).palette.error.main
+      },
+      '&:focus-within:after': {
+        transform: 'scaleX(1)' // error is always underlined in red
+      }
     },
 
     '&:before': {
@@ -89,8 +93,8 @@ const InputRoot = styled(InputBaseRoot, {
       pointerEvents: 'none' // Transparent to the hover style.
     },
 
-    [`&:hover:not(.${inputClasses.disabled}):before`]: {
-      borderBottom: `2px solid ${(theme.vars || theme).palette.text.primary}`,
+    [`&:hover:not(.${inputClasses.disabled}, .${inputClasses.error}):before`]: {
+      borderBottom: `1px solid ${(theme.vars || theme).palette.text.primary}`,
       // Reset on touch devices, it doesn't add specificity
       '@media (hover: none)': {
         borderBottom: `1px solid ${bottomLineColor}`

package/modern/InputLabel/InputLabel.js

@@ -197,7 +197,7 @@ process.env.NODE_ENV !== "production" ? InputLabel.propTypes /* remove-proptypes
    * The size of the component.
    * @default 'normal'
    */
-  size: PropTypes.oneOf(['normal', 'small']),
+  size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['normal', 'small']), PropTypes.string]),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */

package/modern/Popper/Popper.js

@@ -28,17 +28,17 @@ const PopperRoot = styled(PopperUnstyled, {
  */
 const Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
   const theme = useTheme();
-  const _useThemeProps = useThemeProps({
-      props: inProps,
-      name: 'MuiPopper'
-    }),
-    {
+  const props = useThemeProps({
+    props: inProps,
+    name: 'MuiPopper'
+  });
+  const {
       components,
       componentsProps,
       slots,
       slotProps
-    } = _useThemeProps,
-    other = _objectWithoutPropertiesLoose(_useThemeProps, _excluded);
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
   const RootComponent = slots?.root ?? components?.Root;
   return /*#__PURE__*/_jsx(PopperRoot, _extends({
     direction: theme?.direction,
@@ -129,6 +129,10 @@ process.env.NODE_ENV !== "production" ? Popper.propTypes /* remove-proptypes */
    * If `true`, the component is shown.
    */
   open: PropTypes.bool.isRequired,
+  /**
+   * @ignore
+   */
+  ownerState: PropTypes.any,
   /**
    * Popper placement.
    * @default 'bottom'

package/modern/Select/SelectInput.js

@@ -159,6 +159,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       setDisplayNode(node);
     }
   }, []);
+  const anchorElement = displayNode?.parentNode;
   React.useImperativeHandle(handleRef, () => ({
     focus: () => {
       displayRef.current.focus();
@@ -170,7 +171,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
   // Resize menu on `defaultOpen` automatic toggle.
   React.useEffect(() => {
     if (defaultOpen && openState && displayNode && !isOpenControlled) {
-      setMenuMinWidthState(autoWidth ? null : displayNode.clientWidth);
+      setMenuMinWidthState(autoWidth ? null : anchorElement.clientWidth);
       displayRef.current.focus();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -209,7 +210,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       onClose(event);
     }
     if (!isOpenControlled) {
-      setMenuMinWidthState(autoWidth ? null : displayNode.clientWidth);
+      setMenuMinWidthState(autoWidth ? null : anchorElement.clientWidth);
       setOpenState(open);
     }
   };
@@ -365,7 +366,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       if (value) {
         return selected;
       }
-      const firstSelectableElement = arr.find(item => item.props.value !== undefined && item.props.disabled !== true);
+      const firstSelectableElement = arr.find(item => item?.props?.value !== undefined && item.props.disabled !== true);
       if (child === firstSelectableElement) {
         return true;
       }
@@ -386,7 +387,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
         }
       },
       role: 'option',
-      selected: arr[0].props.value === undefined || arr[0].props.disabled === true ? isFirstSelectableElement() : selected,
+      selected: arr[0]?.props?.value === undefined || arr[0]?.props?.disabled === true ? isFirstSelectableElement() : selected,
       value: undefined,
       // The value is most likely not a valid HTML attribute.
       'data-value': child.props.value // Instead, we provide it as a data attribute.
@@ -423,7 +424,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
   // Avoid performing a layout computation in the render method.
   let menuMinWidth = menuMinWidthState;
   if (!autoWidth && isOpenControlled && displayNode) {
-    menuMinWidth = displayNode.clientWidth;
+    menuMinWidth = anchorElement.clientWidth;
   }
   let tabIndex;
   if (typeof tabIndexProp !== 'undefined') {
@@ -481,7 +482,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       ownerState: ownerState
     }), /*#__PURE__*/_jsx(Menu, _extends({
       id: `menu-${name || ''}`,
-      anchorEl: displayNode,
+      anchorEl: anchorElement,
       open: open,
       onClose: handleClose,
       anchorOrigin: {

package/modern/Slider/Slider.js

@@ -619,11 +619,6 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes /* remove-proptypes */
    * @returns {string}
    */
   getAriaValueText: PropTypes.func,
-  /**
-   * Indicates whether the theme context has rtl direction. It is set automatically.
-   * @default false
-   */
-  isRtl: PropTypes.bool,
   /**
    * Marks indicate predetermined values to which the user can move the slider.
    * If `true` the marks are spaced according the value of the `step` prop.

package/modern/TableCell/TableCell.js

@@ -120,7 +120,11 @@ const TableCell = /*#__PURE__*/React.forwardRef(function TableCell(inProps, ref)
     component = isHeadCell ? 'th' : 'td';
   }
   let scope = scopeProp;
-  if (!scope && isHeadCell) {
+  // scope is not a valid attribute for <td/> elements.
+  // source: https://html.spec.whatwg.org/multipage/tables.html#the-td-element
+  if (component === 'td') {
+    scope = undefined;
+  } else if (!scope && isHeadCell) {
     scope = 'col';
   }
   const variant = variantProp || tablelvl2 && tablelvl2.variant;

package/modern/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.11.0
+/** @license MUI v5.11.2
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/modern/locale/index.js

@@ -1121,12 +1121,14 @@ export const faIR = {
           // if (type === 'previous') {
           return 'رفتن به صفحه‌ی قبلی';
         },
-        labelRowsPerPage: 'تعداد سطرهای هر صفحه:'
-        // labelDisplayedRows: ({ from, to, count }) =>
-        //   `${from}–${to} از ${count !== -1 ? count : `more than ${to}`}`,
+        labelRowsPerPage: 'تعداد سطرهای هر صفحه:',
+        labelDisplayedRows: ({
+          from,
+          to,
+          count
+        }) => `${from}–${to} از ${count !== -1 ? count : `بیشتر از ${to}`}`
       }
     },
-
     MuiRating: {
       defaultProps: {
         getLabelText: value => `${value} ستاره`,
@@ -2124,7 +2126,80 @@ export const koKR = {
     }
   }
 };
-export const kzKZ = {
+export const kuLatn = {
+  components: {
+    MuiBreadcrumbs: {
+      defaultProps: {
+        expandText: 'Rê nîşan bide'
+      }
+    },
+    MuiTablePagination: {
+      defaultProps: {
+        getItemAriaLabel: type => {
+          if (type === 'first') {
+            return 'Biçe rûpela yekem';
+          }
+          if (type === 'last') {
+            return 'Biçe rûpela dawî';
+          }
+          if (type === 'next') {
+            return 'Biçe rûpela din';
+          }
+          // if (type === 'previous') {
+          return 'Biçe rûpela berê';
+        },
+        labelRowsPerPage: 'Rêz li ser rûpelê:',
+        labelDisplayedRows: ({
+          from,
+          to,
+          count
+        }) => `${from}–${to} of ${count !== -1 ? count : `zêdetir ji ${to}`}`
+      }
+    },
+    MuiRating: {
+      defaultProps: {
+        getLabelText: value => `${value} Stêrk`,
+        emptyLabelText: 'Vala'
+      }
+    },
+    MuiAutocomplete: {
+      defaultProps: {
+        clearText: 'Paqij bike',
+        closeText: 'Bigre',
+        loadingText: 'Tê barkirin…',
+        noOptionsText: 'Vebijêrk tune',
+        openText: 'Veke'
+      }
+    },
+    MuiAlert: {
+      defaultProps: {
+        closeText: 'Bigre'
+      }
+    },
+    MuiPagination: {
+      defaultProps: {
+        'aria-label': 'Navîgasyona rûpelan',
+        getItemAriaLabel: (type, page, selected) => {
+          if (type === 'page') {
+            return `${selected ? '' : 'Biçe '}rûpel ${page}`;
+          }
+          if (type === 'first') {
+            return 'Biçe rûpela yekem';
+          }
+          if (type === 'last') {
+            return 'Biçe rûpela dawî';
+          }
+          if (type === 'next') {
+            return 'Biçe rûpela din';
+          }
+          // if (type === 'previous') {
+          return 'Biçe rûpela berê';
+        }
+      }
+    }
+  }
+};
+export const kkKZ = {
   components: {
     MuiBreadcrumbs: {
       defaultProps: {

package/modern/styles/index.js

@@ -1,5 +1,11 @@
+import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
 export { default as adaptV4Theme } from './adaptV4Theme';
 export { hexToRgb, rgbToHex, hslToRgb, decomposeColor, recomposeColor, getContrastRatio, getLuminance, emphasize, alpha, darken, lighten, css, keyframes } from '@mui/system';
+// TODO: Remove this function in v6.
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export function experimental_sx() {
+  throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The \`experimental_sx\` has been moved to \`theme.unstable_sx\`.For more details, see https://github.com/mui/material-ui/pull/35150.` : _formatMuiErrorMessage(20));
+}
 export { default as createTheme, createMuiTheme } from './createTheme';
 export { default as unstable_createMuiStrictModeTheme } from './createMuiStrictModeTheme';
 export { default as createStyles } from './createStyles';

package/node/Chip/Chip.js

@@ -176,7 +176,7 @@ const ChipRoot = (0, _styled.default)('div', {
     color: (theme.vars || theme).palette[ownerState.color].contrastText
   }, ownerState.onDelete && {
     [`&.${_chipClasses.default.focusVisible}`]: {
-      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity + theme.vars.palette.action.focusOpacity}))` : (0, _system.alpha)(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
+      backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : (0, _system.alpha)(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
     }
   }, ownerState.onDelete && ownerState.color !== 'default' && {
     [`&.${_chipClasses.default.focusVisible}`]: {
@@ -191,10 +191,10 @@ const ChipRoot = (0, _styled.default)('div', {
   WebkitTapHighlightColor: 'transparent',
   cursor: 'pointer',
   '&:hover': {
-    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity + theme.vars.palette.action.hoverOpacity}))` : (0, _system.alpha)(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity)
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.hoverOpacity}))` : (0, _system.alpha)(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity)
   },
   [`&.${_chipClasses.default.focusVisible}`]: {
-    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity + theme.vars.palette.action.focusOpacity}))` : (0, _system.alpha)(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
+    backgroundColor: theme.vars ? `rgba(${theme.vars.palette.action.selectedChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : (0, _system.alpha)(theme.palette.action.selected, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)
   },
   '&:active': {
     boxShadow: (theme.vars || theme).shadows[1]

package/node/FilledInput/FilledInput.js

@@ -96,9 +96,13 @@ const FilledInputRoot = (0, _styled.default)(_InputBase2.InputBaseRoot, {
       // See https://github.com/mui/material-ui/issues/31766
       transform: 'scaleX(1) translateX(0)'
     },
-    [`&.${_filledInputClasses.default.error}:after`]: {
-      borderBottomColor: (theme.vars || theme).palette.error.main,
-      transform: 'scaleX(1)' // error is always underlined in red
+    [`&.${_filledInputClasses.default.error}`]: {
+      '&:before, &:after': {
+        borderBottomColor: (theme.vars || theme).palette.error.main
+      },
+      '&:focus-within:after': {
+        transform: 'scaleX(1)' // error is always underlined in red
+      }
     },
 
     '&:before': {
@@ -115,7 +119,7 @@ const FilledInputRoot = (0, _styled.default)(_InputBase2.InputBaseRoot, {
       pointerEvents: 'none' // Transparent to the hover style.
     },
 
-    [`&:hover:not(.${_filledInputClasses.default.disabled}):before`]: {
+    [`&:hover:not(.${_filledInputClasses.default.disabled}, .${_filledInputClasses.default.error}):before`]: {
       borderBottom: `1px solid ${(theme.vars || theme).palette.text.primary}`
     },
     [`&.${_filledInputClasses.default.disabled}:before`]: {

package/node/Input/Input.js

@@ -79,9 +79,13 @@ const InputRoot = (0, _styled.default)(_InputBase2.InputBaseRoot, {
       // See https://github.com/mui/material-ui/issues/31766
       transform: 'scaleX(1) translateX(0)'
     },
-    [`&.${_inputClasses.default.error}:after`]: {
-      borderBottomColor: (theme.vars || theme).palette.error.main,
-      transform: 'scaleX(1)' // error is always underlined in red
+    [`&.${_inputClasses.default.error}`]: {
+      '&:before, &:after': {
+        borderBottomColor: (theme.vars || theme).palette.error.main
+      },
+      '&:focus-within:after': {
+        transform: 'scaleX(1)' // error is always underlined in red
+      }
     },
 
     '&:before': {
@@ -98,8 +102,8 @@ const InputRoot = (0, _styled.default)(_InputBase2.InputBaseRoot, {
       pointerEvents: 'none' // Transparent to the hover style.
     },
 
-    [`&:hover:not(.${_inputClasses.default.disabled}):before`]: {
-      borderBottom: `2px solid ${(theme.vars || theme).palette.text.primary}`,
+    [`&:hover:not(.${_inputClasses.default.disabled}, .${_inputClasses.default.error}):before`]: {
+      borderBottom: `1px solid ${(theme.vars || theme).palette.text.primary}`,
       // Reset on touch devices, it doesn't add specificity
       '@media (hover: none)': {
         borderBottom: `1px solid ${bottomLineColor}`

package/node/InputLabel/InputLabel.js

@@ -206,7 +206,7 @@ process.env.NODE_ENV !== "production" ? InputLabel.propTypes /* remove-proptypes
    * The size of the component.
    * @default 'normal'
    */
-  size: _propTypes.default.oneOf(['normal', 'small']),
+  size: _propTypes.default /* @typescript-to-proptypes-ignore */.oneOfType([_propTypes.default.oneOf(['normal', 'small']), _propTypes.default.string]),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */

package/node/Popper/Popper.js

@@ -38,17 +38,17 @@ const PopperRoot = (0, _styles.styled)(_PopperUnstyled.default, {
 const Popper = /*#__PURE__*/React.forwardRef(function Popper(inProps, ref) {
   var _slots$root;
   const theme = (0, _system.useThemeWithoutDefault)();
-  const _useThemeProps = (0, _styles.useThemeProps)({
-      props: inProps,
-      name: 'MuiPopper'
-    }),
-    {
+  const props = (0, _styles.useThemeProps)({
+    props: inProps,
+    name: 'MuiPopper'
+  });
+  const {
       components,
       componentsProps,
       slots,
       slotProps
-    } = _useThemeProps,
-    other = (0, _objectWithoutPropertiesLoose2.default)(_useThemeProps, _excluded);
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const RootComponent = (_slots$root = slots == null ? void 0 : slots.root) != null ? _slots$root : components == null ? void 0 : components.Root;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(PopperRoot, (0, _extends2.default)({
     direction: theme == null ? void 0 : theme.direction,
@@ -139,6 +139,10 @@ process.env.NODE_ENV !== "production" ? Popper.propTypes /* remove-proptypes */
    * If `true`, the component is shown.
    */
   open: _propTypes.default.bool.isRequired,
+  /**
+   * @ignore
+   */
+  ownerState: _propTypes.default.any,
   /**
    * Popper placement.
    * @default 'bottom'

package/node/Select/SelectInput.js

@@ -166,6 +166,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       setDisplayNode(node);
     }
   }, []);
+  const anchorElement = displayNode == null ? void 0 : displayNode.parentNode;
   React.useImperativeHandle(handleRef, () => ({
     focus: () => {
       displayRef.current.focus();
@@ -177,7 +178,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
   // Resize menu on `defaultOpen` automatic toggle.
   React.useEffect(() => {
     if (defaultOpen && openState && displayNode && !isOpenControlled) {
-      setMenuMinWidthState(autoWidth ? null : displayNode.clientWidth);
+      setMenuMinWidthState(autoWidth ? null : anchorElement.clientWidth);
       displayRef.current.focus();
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -216,7 +217,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       onClose(event);
     }
     if (!isOpenControlled) {
-      setMenuMinWidthState(autoWidth ? null : displayNode.clientWidth);
+      setMenuMinWidthState(autoWidth ? null : anchorElement.clientWidth);
       setOpenState(open);
     }
   };
@@ -336,6 +337,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     }
   }
   const items = childrenArray.map((child, index, arr) => {
+    var _arr$, _arr$$props, _arr$2, _arr$2$props;
     if (! /*#__PURE__*/React.isValidElement(child)) {
       return null;
     }
@@ -372,7 +374,10 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       if (value) {
         return selected;
       }
-      const firstSelectableElement = arr.find(item => item.props.value !== undefined && item.props.disabled !== true);
+      const firstSelectableElement = arr.find(item => {
+        var _item$props;
+        return (item == null ? void 0 : (_item$props = item.props) == null ? void 0 : _item$props.value) !== undefined && item.props.disabled !== true;
+      });
       if (child === firstSelectableElement) {
         return true;
       }
@@ -393,7 +398,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
         }
       },
       role: 'option',
-      selected: arr[0].props.value === undefined || arr[0].props.disabled === true ? isFirstSelectableElement() : selected,
+      selected: ((_arr$ = arr[0]) == null ? void 0 : (_arr$$props = _arr$.props) == null ? void 0 : _arr$$props.value) === undefined || ((_arr$2 = arr[0]) == null ? void 0 : (_arr$2$props = _arr$2.props) == null ? void 0 : _arr$2$props.disabled) === true ? isFirstSelectableElement() : selected,
       value: undefined,
       // The value is most likely not a valid HTML attribute.
       'data-value': child.props.value // Instead, we provide it as a data attribute.
@@ -430,7 +435,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
   // Avoid performing a layout computation in the render method.
   let menuMinWidth = menuMinWidthState;
   if (!autoWidth && isOpenControlled && displayNode) {
-    menuMinWidth = displayNode.clientWidth;
+    menuMinWidth = anchorElement.clientWidth;
   }
   let tabIndex;
   if (typeof tabIndexProp !== 'undefined') {
@@ -488,7 +493,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       ownerState: ownerState
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Menu.default, (0, _extends2.default)({
       id: `menu-${name || ''}`,
-      anchorEl: displayNode,
+      anchorEl: anchorElement,
       open: open,
       onClose: handleClose,
       anchorOrigin: {

package/node/Slider/Slider.js

@@ -630,11 +630,6 @@ process.env.NODE_ENV !== "production" ? Slider.propTypes /* remove-proptypes */
    * @returns {string}
    */
   getAriaValueText: _propTypes.default.func,
-  /**
-   * Indicates whether the theme context has rtl direction. It is set automatically.
-   * @default false
-   */
-  isRtl: _propTypes.default.bool,
   /**
    * Marks indicate predetermined values to which the user can move the slider.
    * If `true` the marks are spaced according the value of the `step` prop.

package/node/TableCell/TableCell.js

@@ -129,7 +129,11 @@ const TableCell = /*#__PURE__*/React.forwardRef(function TableCell(inProps, ref)
     component = isHeadCell ? 'th' : 'td';
   }
   let scope = scopeProp;
-  if (!scope && isHeadCell) {
+  // scope is not a valid attribute for <td/> elements.
+  // source: https://html.spec.whatwg.org/multipage/tables.html#the-td-element
+  if (component === 'td') {
+    scope = undefined;
+  } else if (!scope && isHeadCell) {
     scope = 'col';
   }
   const variant = variantProp || tablelvl2 && tablelvl2.variant;

package/node/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.11.0
+/** @license MUI v5.11.2
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.