@mui/material 9.0.0-alpha.3 → 9.0.0-alpha.4

package/Divider/Divider.mjs

@@ -15,13 +15,12 @@ const useUtilityClasses = ownerState => {
     children,
     classes,
     flexItem,
-    light,
     orientation,
     textAlign,
     variant
   } = ownerState;
   const slots = {
-    root: ['root', absolute && 'absolute', variant, light && 'light', orientation === 'vertical' && 'vertical', flexItem && 'flexItem', children && 'withChildren', children && orientation === 'vertical' && 'withChildrenVertical', textAlign === 'right' && orientation !== 'vertical' && 'textAlignRight', textAlign === 'left' && orientation !== 'vertical' && 'textAlignLeft'],
+    root: ['root', absolute && 'absolute', variant, orientation === 'vertical' && 'vertical', flexItem && 'flexItem', children && 'withChildren', children && orientation === 'vertical' && 'withChildrenVertical', textAlign === 'right' && orientation !== 'vertical' && 'textAlignRight', textAlign === 'left' && orientation !== 'vertical' && 'textAlignLeft'],
     wrapper: ['wrapper', orientation === 'vertical' && 'wrapperVertical']
   };
   return composeClasses(slots, getDividerUtilityClass, classes);
@@ -33,7 +32,7 @@ const DividerRoot = styled('div', {
     const {
       ownerState
     } = props;
-    return [styles.root, ownerState.absolute && styles.absolute, styles[ownerState.variant], ownerState.light && styles.light, ownerState.orientation === 'vertical' && styles.vertical, ownerState.flexItem && styles.flexItem, ownerState.children && styles.withChildren, ownerState.children && ownerState.orientation === 'vertical' && styles.withChildrenVertical, ownerState.textAlign === 'right' && ownerState.orientation !== 'vertical' && styles.textAlignRight, ownerState.textAlign === 'left' && ownerState.orientation !== 'vertical' && styles.textAlignLeft];
+    return [styles.root, ownerState.absolute && styles.absolute, styles[ownerState.variant], ownerState.orientation === 'vertical' && styles.vertical, ownerState.flexItem && styles.flexItem, ownerState.children && styles.withChildren, ownerState.children && ownerState.orientation === 'vertical' && styles.withChildrenVertical, ownerState.textAlign === 'right' && ownerState.orientation !== 'vertical' && styles.textAlignRight, ownerState.textAlign === 'left' && ownerState.orientation !== 'vertical' && styles.textAlignLeft];
   }
 })(memoTheme(({
   theme
@@ -55,13 +54,6 @@ const DividerRoot = styled('div', {
       left: 0,
       width: '100%'
     }
-  }, {
-    props: {
-      light: true
-    },
-    style: {
-      borderColor: theme.alpha((theme.vars || theme).palette.divider, 0.08)
-    }
   }, {
     props: {
       variant: 'inset'
@@ -206,7 +198,6 @@ const Divider = /*#__PURE__*/React.forwardRef(function Divider(inProps, ref) {
     orientation = 'horizontal',
     component = children || orientation === 'vertical' ? 'div' : 'hr',
     flexItem = false,
-    light = false,
     role = component !== 'hr' ? 'separator' : undefined,
     textAlign = 'center',
     variant = 'fullWidth',
@@ -217,7 +208,6 @@ const Divider = /*#__PURE__*/React.forwardRef(function Divider(inProps, ref) {
     absolute,
     component,
     flexItem,
-    light,
     orientation,
     role,
     textAlign,
@@ -280,12 +270,6 @@ process.env.NODE_ENV !== "production" ? Divider.propTypes /* remove-proptypes */
    * @default false
    */
   flexItem: PropTypes.bool,
-  /**
-   * If `true`, the divider will have a lighter color.
-   * @default false
-   * @deprecated Use <Divider sx={{ opacity: 0.6 }} /> (or any opacity or color) instead. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   */
-  light: PropTypes.bool,
   /**
    * The component orientation.
    * @default 'horizontal'

package/Divider/dividerClasses.d.mts

@@ -7,10 +7,6 @@ export interface DividerClasses {
   inset: string;
   /** Styles applied to the root element if `variant="fullWidth"`. */
   fullWidth: string;
-  /** Styles applied to the root element if `light={true}`.
-   * @deprecated
-   */
-  light: string;
   /** Styles applied to the root element if `variant="middle"`. */
   middle: string;
   /** Styles applied to the root element if `orientation="vertical"`. */

package/Divider/dividerClasses.d.ts

@@ -7,10 +7,6 @@ export interface DividerClasses {
   inset: string;
   /** Styles applied to the root element if `variant="fullWidth"`. */
   fullWidth: string;
-  /** Styles applied to the root element if `light={true}`.
-   * @deprecated
-   */
-  light: string;
   /** Styles applied to the root element if `variant="middle"`. */
   middle: string;
   /** Styles applied to the root element if `orientation="vertical"`. */

package/Divider/dividerClasses.js

@@ -11,5 +11,5 @@ var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateU
 function getDividerUtilityClass(slot) {
   return (0, _generateUtilityClass.default)('MuiDivider', slot);
 }
-const dividerClasses = (0, _generateUtilityClasses.default)('MuiDivider', ['root', 'absolute', 'fullWidth', 'inset', 'middle', 'flexItem', 'light', 'vertical', 'withChildren', 'withChildrenVertical', 'textAlignRight', 'textAlignLeft', 'wrapper', 'wrapperVertical']);
+const dividerClasses = (0, _generateUtilityClasses.default)('MuiDivider', ['root', 'absolute', 'fullWidth', 'inset', 'middle', 'flexItem', 'vertical', 'withChildren', 'withChildrenVertical', 'textAlignRight', 'textAlignLeft', 'wrapper', 'wrapperVertical']);
 var _default = exports.default = dividerClasses;

package/Divider/dividerClasses.mjs

@@ -3,5 +3,5 @@ import generateUtilityClass from '@mui/utils/generateUtilityClass';
 export function getDividerUtilityClass(slot) {
   return generateUtilityClass('MuiDivider', slot);
 }
-const dividerClasses = generateUtilityClasses('MuiDivider', ['root', 'absolute', 'fullWidth', 'inset', 'middle', 'flexItem', 'light', 'vertical', 'withChildren', 'withChildrenVertical', 'textAlignRight', 'textAlignLeft', 'wrapper', 'wrapperVertical']);
+const dividerClasses = generateUtilityClasses('MuiDivider', ['root', 'absolute', 'fullWidth', 'inset', 'middle', 'flexItem', 'vertical', 'withChildren', 'withChildrenVertical', 'textAlignRight', 'textAlignLeft', 'wrapper', 'wrapperVertical']);
 export default dividerClasses;

package/FormControlLabel/FormControlLabel.d.mts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { SxProps } from '@mui/system';
 import { Theme } from "../styles/index.mjs";
 import { InternalStandardProps as StandardProps } from "../internal/index.mjs";
-import Typography, { TypographyProps } from "../Typography/index.mjs";
+import Typography from "../Typography/index.mjs";
 import { FormControlLabelClasses } from "./formControlLabelClasses.mjs";
 import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.mjs";
 export interface FormControlLabelSlots {
@@ -25,19 +25,6 @@ export interface FormControlLabelProps extends StandardProps<React.LabelHTMLAttr
    * Override or extend the styles applied to the component.
    */
   classes?: Partial<FormControlLabelClasses> | undefined;
-  /**
-   * The props used for each slot inside.
-   * @default {}
-   * @deprecated use the `slotProps` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   */
-  componentsProps?: {
-    /**
-     * Props applied to the Typography wrapper of the passed label.
-     * This is unused if disableTypography is true.
-     * @default {}
-     */
-    typography?: TypographyProps | undefined;
-  } | undefined;
   /**
    * A control element. For instance, it can be a `Radio`, a `Switch` or a `Checkbox`.
    */

package/FormControlLabel/FormControlLabel.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { SxProps } from '@mui/system';
 import { Theme } from "../styles/index.js";
 import { InternalStandardProps as StandardProps } from "../internal/index.js";
-import Typography, { TypographyProps } from "../Typography/index.js";
+import Typography from "../Typography/index.js";
 import { FormControlLabelClasses } from "./formControlLabelClasses.js";
 import { CreateSlotsAndSlotProps, SlotProps } from "../utils/types.js";
 export interface FormControlLabelSlots {
@@ -25,19 +25,6 @@ export interface FormControlLabelProps extends StandardProps<React.LabelHTMLAttr
    * Override or extend the styles applied to the component.
    */
   classes?: Partial<FormControlLabelClasses> | undefined;
-  /**
-   * The props used for each slot inside.
-   * @default {}
-   * @deprecated use the `slotProps` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   */
-  componentsProps?: {
-    /**
-     * Props applied to the Typography wrapper of the passed label.
-     * This is unused if disableTypography is true.
-     * @default {}
-     */
-    typography?: TypographyProps | undefined;
-  } | undefined;
   /**
    * A control element. For instance, it can be a `Radio`, a `Switch` or a `Checkbox`.
    */

package/FormControlLabel/FormControlLabel.js

@@ -122,7 +122,6 @@ const FormControlLabel = /*#__PURE__*/React.forwardRef(function FormControlLabel
   const {
     checked,
     className,
-    componentsProps = {},
     control,
     disabled: disabledProp,
     disableTypography,
@@ -164,10 +163,7 @@ const FormControlLabel = /*#__PURE__*/React.forwardRef(function FormControlLabel
   const classes = useUtilityClasses(ownerState);
   const externalForwardedProps = {
     slots,
-    slotProps: {
-      ...componentsProps,
-      ...slotProps
-    }
+    slotProps
   };
   const [TypographySlot, typographySlotProps] = (0, _useSlot.default)('typography', {
     elementType: _Typography.default,
@@ -215,14 +211,6 @@ process.env.NODE_ENV !== "production" ? FormControlLabel.propTypes /* remove-pro
    * @ignore
    */
   className: _propTypes.default.string,
-  /**
-   * The props used for each slot inside.
-   * @default {}
-   * @deprecated use the `slotProps` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   */
-  componentsProps: _propTypes.default.shape({
-    typography: _propTypes.default.object
-  }),
   /**
    * A control element. For instance, it can be a `Radio`, a `Switch` or a `Checkbox`.
    */

package/FormControlLabel/FormControlLabel.mjs

@@ -115,7 +115,6 @@ const FormControlLabel = /*#__PURE__*/React.forwardRef(function FormControlLabel
   const {
     checked,
     className,
-    componentsProps = {},
     control,
     disabled: disabledProp,
     disableTypography,
@@ -157,10 +156,7 @@ const FormControlLabel = /*#__PURE__*/React.forwardRef(function FormControlLabel
   const classes = useUtilityClasses(ownerState);
   const externalForwardedProps = {
     slots,
-    slotProps: {
-      ...componentsProps,
-      ...slotProps
-    }
+    slotProps
   };
   const [TypographySlot, typographySlotProps] = useSlot('typography', {
     elementType: Typography,
@@ -208,14 +204,6 @@ process.env.NODE_ENV !== "production" ? FormControlLabel.propTypes /* remove-pro
    * @ignore
    */
   className: PropTypes.string,
-  /**
-   * The props used for each slot inside.
-   * @default {}
-   * @deprecated use the `slotProps` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   */
-  componentsProps: PropTypes.shape({
-    typography: PropTypes.object
-  }),
   /**
    * A control element. For instance, it can be a `Radio`, a `Switch` or a `Checkbox`.
    */

package/Input/Input.js

@@ -18,6 +18,7 @@ var _zeroStyled = require("../zero-styled");
 var _memoTheme = _interopRequireDefault(require("../utils/memoTheme"));
 var _createSimplePaletteValueFilter = _interopRequireDefault(require("../utils/createSimplePaletteValueFilter"));
 var _DefaultPropsProvider = require("../DefaultPropsProvider");
+var _inputLabelClasses = _interopRequireDefault(require("../InputLabel/inputLabelClasses"));
 var _inputClasses = _interopRequireWildcard(require("./inputClasses"));
 var _InputBase2 = require("../InputBase/InputBase");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -62,7 +63,7 @@ const InputRoot = (0, _zeroStyled.styled)(_InputBase2.InputBaseRoot, {
         ownerState
       }) => ownerState.formControl,
       style: {
-        'label + &': {
+        [`label + &, .${_inputLabelClasses.default.root} + &`]: {
           marginTop: 16
         }
       }

package/Input/Input.mjs

@@ -11,6 +11,7 @@ import { styled } from "../zero-styled/index.mjs";
 import memoTheme from "../utils/memoTheme.mjs";
 import createSimplePaletteValueFilter from "../utils/createSimplePaletteValueFilter.mjs";
 import { useDefaultProps } from "../DefaultPropsProvider/index.mjs";
+import inputLabelClasses from "../InputLabel/inputLabelClasses.mjs";
 import inputClasses, { getInputUtilityClass } from "./inputClasses.mjs";
 import { rootOverridesResolver as inputBaseRootOverridesResolver, inputOverridesResolver as inputBaseInputOverridesResolver, InputBaseRoot, InputBaseInput } from "../InputBase/InputBase.mjs";
 import { jsx as _jsx } from "react/jsx-runtime";
@@ -55,7 +56,7 @@ const InputRoot = styled(InputBaseRoot, {
         ownerState
       }) => ownerState.formControl,
       style: {
-        'label + &': {
+        [`label + &, .${inputLabelClasses.root} + &`]: {
           marginTop: 16
         }
       }

package/Menu/Menu.d.mts

@@ -101,12 +101,6 @@ export interface MenuProps extends StandardProps<Omit<PopoverProps, 'slots' | 's
    * @default false
    */
   disableAutoFocusItem?: boolean | undefined;
-  /**
-   * Props applied to the [`MenuList`](https://mui.com/material-ui/api/menu-list/) element.
-   * @deprecated use the `slotProps.list` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   * @default {}
-   */
-  MenuListProps?: Partial<MenuListProps> | undefined;
   /**
    * Callback fired when the component requests to be closed.
    *
@@ -131,13 +125,6 @@ export interface MenuProps extends StandardProps<Omit<PopoverProps, 'slots' | 's
    * @default 'auto'
    */
   transitionDuration?: TransitionProps['timeout'] | 'auto' | undefined;
-  /**
-   * Props applied to the transition element.
-   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
-   * @deprecated use the `slotProps.transition` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   * @default {}
-   */
-  TransitionProps?: TransitionProps | undefined;
   /**
    * The variant to use. Use `menu` to prevent selected items from impacting the initial focus.
    * @default 'selectedMenu'

package/Menu/Menu.d.ts

@@ -101,12 +101,6 @@ export interface MenuProps extends StandardProps<Omit<PopoverProps, 'slots' | 's
    * @default false
    */
   disableAutoFocusItem?: boolean | undefined;
-  /**
-   * Props applied to the [`MenuList`](https://mui.com/material-ui/api/menu-list/) element.
-   * @deprecated use the `slotProps.list` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   * @default {}
-   */
-  MenuListProps?: Partial<MenuListProps> | undefined;
   /**
    * Callback fired when the component requests to be closed.
    *
@@ -131,13 +125,6 @@ export interface MenuProps extends StandardProps<Omit<PopoverProps, 'slots' | 's
    * @default 'auto'
    */
   transitionDuration?: TransitionProps['timeout'] | 'auto' | undefined;
-  /**
-   * Props applied to the transition element.
-   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
-   * @deprecated use the `slotProps.transition` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   * @default {}
-   */
-  TransitionProps?: TransitionProps | undefined;
   /**
    * The variant to use. Use `menu` to prevent selected items from impacting the initial focus.
    * @default 'selectedMenu'

package/Menu/Menu.js

@@ -10,7 +10,6 @@ exports.default = exports.MenuPaper = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _reactIs = require("react-is");
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _clsx = _interopRequireDefault(require("clsx"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _HTMLElementType = _interopRequireDefault(require("@mui/utils/HTMLElementType"));
 var _RtlProvider = require("@mui/system/RtlProvider");
@@ -75,16 +74,10 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
     children,
     className,
     disableAutoFocusItem = false,
-    MenuListProps = {},
     onClose,
     open,
-    PaperProps = {},
     PopoverClasses,
     transitionDuration = 'auto',
-    TransitionProps: {
-      onEntering,
-      ...TransitionProps
-    } = {},
     variant = 'selectedMenu',
     slots = {},
     slotProps = {},
@@ -95,25 +88,18 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
     ...props,
     autoFocus,
     disableAutoFocusItem,
-    MenuListProps,
-    onEntering,
-    PaperProps,
     transitionDuration,
-    TransitionProps,
     variant
   };
   const classes = useUtilityClasses(ownerState);
   const autoFocusItem = autoFocus && !disableAutoFocusItem && open;
   const menuListActionsRef = React.useRef(null);
-  const handleEntering = (element, isAppearing) => {
+  const handleEntering = (element, _isAppearing) => {
     if (menuListActionsRef.current) {
       menuListActionsRef.current.adjustStyleForScrollbar(element, {
         direction: isRtl ? 'rtl' : 'ltr'
       });
     }
-    if (onEntering) {
-      onEntering(element, isAppearing);
-    }
   };
   const handleListKeyDown = event => {
     if (event.key === 'Tab') {
@@ -152,12 +138,7 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
   });
   const externalForwardedProps = {
     slots,
-    slotProps: {
-      list: MenuListProps,
-      transition: TransitionProps,
-      paper: PaperProps,
-      ...slotProps
-    }
+    slotProps
   };
   const rootSlotProps = (0, _useSlotProps.default)({
     elementType: slots.root,
@@ -173,7 +154,7 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
     ownerState
   });
   const [ListSlot, listSlotProps] = (0, _useSlot.default)('list', {
-    className: (0, _clsx.default)(classes.list, MenuListProps.className),
+    className: classes.list,
     elementType: MenuMenuList,
     shouldForwardComponentProp: true,
     externalForwardedProps,
@@ -186,7 +167,7 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
     }),
     ownerState
   });
-  const resolvedTransitionProps = typeof externalForwardedProps.slotProps.transition === 'function' ? externalForwardedProps.slotProps.transition(ownerState) : externalForwardedProps.slotProps.transition;
+  const resolvedTransitionProps = typeof slotProps.transition === 'function' ? slotProps.transition(ownerState) : slotProps.transition;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuRoot, {
     onClose: onClose,
     anchorOrigin: {
@@ -198,10 +179,7 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
       root: slots.root,
       paper: PaperSlot,
       backdrop: slots.backdrop,
-      ...(slots.transition && {
-        // TODO: pass `slots.transition` directly once `TransitionComponent` is removed from Popover
-        transition: slots.transition
-      })
+      transition: slots.transition
     },
     slotProps: {
       root: rootSlotProps,
@@ -269,12 +247,6 @@ process.env.NODE_ENV !== "production" ? Menu.propTypes /* remove-proptypes */ =
    * @default false
    */
   disableAutoFocusItem: _propTypes.default.bool,
-  /**
-   * Props applied to the [`MenuList`](https://mui.com/material-ui/api/menu-list/) element.
-   * @deprecated use the `slotProps.list` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   * @default {}
-   */
-  MenuListProps: _propTypes.default.object,
   /**
    * Callback fired when the component requests to be closed.
    *
@@ -286,10 +258,6 @@ process.env.NODE_ENV !== "production" ? Menu.propTypes /* remove-proptypes */ =
    * If `true`, the component is shown.
    */
   open: _propTypes.default.bool.isRequired,
-  /**
-   * @ignore
-   */
-  PaperProps: _propTypes.default.object,
   /**
    * `classes` prop applied to the [`Popover`](https://mui.com/material-ui/api/popover/) element.
    */
@@ -329,13 +297,6 @@ process.env.NODE_ENV !== "production" ? Menu.propTypes /* remove-proptypes */ =
     enter: _propTypes.default.number,
     exit: _propTypes.default.number
   })]),
-  /**
-   * Props applied to the transition element.
-   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
-   * @deprecated use the `slotProps.transition` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   * @default {}
-   */
-  TransitionProps: _propTypes.default.object,
   /**
    * The variant to use. Use `menu` to prevent selected items from impacting the initial focus.
    * @default 'selectedMenu'

package/Menu/Menu.mjs

@@ -3,7 +3,6 @@
 import * as React from 'react';
 import { isFragment } from 'react-is';
 import PropTypes from 'prop-types';
-import clsx from 'clsx';
 import composeClasses from '@mui/utils/composeClasses';
 import HTMLElementType from '@mui/utils/HTMLElementType';
 import { useRtl } from '@mui/system/RtlProvider';
@@ -68,16 +67,10 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
     children,
     className,
     disableAutoFocusItem = false,
-    MenuListProps = {},
     onClose,
     open,
-    PaperProps = {},
     PopoverClasses,
     transitionDuration = 'auto',
-    TransitionProps: {
-      onEntering,
-      ...TransitionProps
-    } = {},
     variant = 'selectedMenu',
     slots = {},
     slotProps = {},
@@ -88,25 +81,18 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
     ...props,
     autoFocus,
     disableAutoFocusItem,
-    MenuListProps,
-    onEntering,
-    PaperProps,
     transitionDuration,
-    TransitionProps,
     variant
   };
   const classes = useUtilityClasses(ownerState);
   const autoFocusItem = autoFocus && !disableAutoFocusItem && open;
   const menuListActionsRef = React.useRef(null);
-  const handleEntering = (element, isAppearing) => {
+  const handleEntering = (element, _isAppearing) => {
     if (menuListActionsRef.current) {
       menuListActionsRef.current.adjustStyleForScrollbar(element, {
         direction: isRtl ? 'rtl' : 'ltr'
       });
     }
-    if (onEntering) {
-      onEntering(element, isAppearing);
-    }
   };
   const handleListKeyDown = event => {
     if (event.key === 'Tab') {
@@ -145,12 +131,7 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
   });
   const externalForwardedProps = {
     slots,
-    slotProps: {
-      list: MenuListProps,
-      transition: TransitionProps,
-      paper: PaperProps,
-      ...slotProps
-    }
+    slotProps
   };
   const rootSlotProps = useSlotProps({
     elementType: slots.root,
@@ -166,7 +147,7 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
     ownerState
   });
   const [ListSlot, listSlotProps] = useSlot('list', {
-    className: clsx(classes.list, MenuListProps.className),
+    className: classes.list,
     elementType: MenuMenuList,
     shouldForwardComponentProp: true,
     externalForwardedProps,
@@ -179,7 +160,7 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
     }),
     ownerState
   });
-  const resolvedTransitionProps = typeof externalForwardedProps.slotProps.transition === 'function' ? externalForwardedProps.slotProps.transition(ownerState) : externalForwardedProps.slotProps.transition;
+  const resolvedTransitionProps = typeof slotProps.transition === 'function' ? slotProps.transition(ownerState) : slotProps.transition;
   return /*#__PURE__*/_jsx(MenuRoot, {
     onClose: onClose,
     anchorOrigin: {
@@ -191,10 +172,7 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(inProps, ref) {
       root: slots.root,
       paper: PaperSlot,
       backdrop: slots.backdrop,
-      ...(slots.transition && {
-        // TODO: pass `slots.transition` directly once `TransitionComponent` is removed from Popover
-        transition: slots.transition
-      })
+      transition: slots.transition
     },
     slotProps: {
       root: rootSlotProps,
@@ -262,12 +240,6 @@ process.env.NODE_ENV !== "production" ? Menu.propTypes /* remove-proptypes */ =
    * @default false
    */
   disableAutoFocusItem: PropTypes.bool,
-  /**
-   * Props applied to the [`MenuList`](https://mui.com/material-ui/api/menu-list/) element.
-   * @deprecated use the `slotProps.list` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   * @default {}
-   */
-  MenuListProps: PropTypes.object,
   /**
    * Callback fired when the component requests to be closed.
    *
@@ -279,10 +251,6 @@ process.env.NODE_ENV !== "production" ? Menu.propTypes /* remove-proptypes */ =
    * If `true`, the component is shown.
    */
   open: PropTypes.bool.isRequired,
-  /**
-   * @ignore
-   */
-  PaperProps: PropTypes.object,
   /**
    * `classes` prop applied to the [`Popover`](https://mui.com/material-ui/api/popover/) element.
    */
@@ -322,13 +290,6 @@ process.env.NODE_ENV !== "production" ? Menu.propTypes /* remove-proptypes */ =
     enter: PropTypes.number,
     exit: PropTypes.number
   })]),
-  /**
-   * Props applied to the transition element.
-   * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.
-   * @deprecated use the `slotProps.transition` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   * @default {}
-   */
-  TransitionProps: PropTypes.object,
   /**
    * The variant to use. Use `menu` to prevent selected items from impacting the initial focus.
    * @default 'selectedMenu'

package/MenuItem/MenuItem.js

@@ -23,7 +23,25 @@ var _Divider = require("../Divider");
 var _ListItemIcon = require("../ListItemIcon");
 var _ListItemText = require("../ListItemText");
 var _menuItemClasses = _interopRequireWildcard(require("./menuItemClasses"));
+var _Select = require("../Select");
 var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * If autoFocus is an object, it will attempt to call `element.focus()` with the options argument.
+ * If the browser doesn't support the options argument, it will fall back to a simple `element.focus()` call.
+ */function focusWithVisible(element, focusSource) {
+  if (focusSource == null) {
+    element.focus();
+    return;
+  }
+  try {
+    element.focus({
+      focusVisible: focusSource === 'keyboard'
+    });
+  } catch (error) {
+    // If the browser doesn't support the focus options argument, fall back to a simple focus call.
+    element.focus();
+  }
+}
 const overridesResolver = (props, styles) => {
   const {
     ownerState
@@ -170,6 +188,7 @@ const MenuItem = /*#__PURE__*/React.forwardRef(function MenuItem(inProps, ref) {
     className,
     ...other
   } = props;
+  const focusSource = (0, _Select.useSelectFocusSource)();
   const context = React.useContext(_ListContext.default);
   const childContext = React.useMemo(() => ({
     dense: dense || context.dense || false,
@@ -179,11 +198,12 @@ const MenuItem = /*#__PURE__*/React.forwardRef(function MenuItem(inProps, ref) {
   (0, _useEnhancedEffect.default)(() => {
     if (autoFocus) {
       if (menuItemRef.current) {
-        menuItemRef.current.focus();
+        focusWithVisible(menuItemRef.current, focusSource);
       } else if (process.env.NODE_ENV !== 'production') {
         console.error('MUI: Unable to set focus to a MenuItem whose component has not been rendered.');
       }
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [autoFocus]);
   const ownerState = {
     ...props,