@mui/material 6.4.4 → 6.4.6

package/SpeedDialAction/SpeedDialAction.js

@@ -13,6 +13,8 @@ import Fab from "../Fab/index.js";
 import Tooltip from "../Tooltip/index.js";
 import capitalize from "../utils/capitalize.js";
 import speedDialActionClasses, { getSpeedDialActionUtilityClass } from "./speedDialActionClasses.js";
+import useSlot from "../utils/useSlot.js";
+import { mergeSlotProps } from "../utils/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {
   const {
@@ -147,6 +149,8 @@ const SpeedDialAction = /*#__PURE__*/React.forwardRef(function SpeedDialAction(i
     tooltipOpen: tooltipOpenProp = false,
     tooltipPlacement = 'left',
     tooltipTitle,
+    slots = {},
+    slotProps = {},
     ...other
   } = props;
   const ownerState = {
@@ -154,7 +158,20 @@ const SpeedDialAction = /*#__PURE__*/React.forwardRef(function SpeedDialAction(i
     tooltipPlacement
   };
   const classes = useUtilityClasses(ownerState);
-  const [tooltipOpen, setTooltipOpen] = React.useState(tooltipOpenProp);
+  const externalForwardedProps = {
+    slots,
+    slotProps: {
+      fab: FabProps,
+      ...slotProps,
+      tooltip: mergeSlotProps(typeof slotProps.tooltip === 'function' ? slotProps.tooltip(ownerState) : slotProps.tooltip, {
+        title: tooltipTitle,
+        open: tooltipOpenProp,
+        placement: tooltipPlacement,
+        classes: TooltipClasses
+      })
+    }
+  };
+  const [tooltipOpen, setTooltipOpen] = React.useState(externalForwardedProps.slotProps.tooltip?.open);
   const handleTooltipClose = () => {
     setTooltipOpen(false);
   };
@@ -164,32 +181,71 @@ const SpeedDialAction = /*#__PURE__*/React.forwardRef(function SpeedDialAction(i
   const transitionStyle = {
     transitionDelay: `${delay}ms`
   };
-  const fab = /*#__PURE__*/_jsx(SpeedDialActionFab, {
-    size: "small",
+  const [FabSlot, fabSlotProps] = useSlot('fab', {
+    elementType: SpeedDialActionFab,
+    externalForwardedProps,
+    ownerState,
+    shouldForwardComponentProp: true,
     className: clsx(classes.fab, className),
-    tabIndex: -1,
-    role: "menuitem",
-    ownerState: ownerState,
-    ...FabProps,
-    style: {
-      ...transitionStyle,
-      ...FabProps.style
+    additionalProps: {
+      style: transitionStyle,
+      tabIndex: -1,
+      role: 'menuitem',
+      size: 'small'
+    }
+  });
+  const [TooltipSlot, tooltipSlotProps] = useSlot('tooltip', {
+    elementType: Tooltip,
+    externalForwardedProps,
+    shouldForwardComponentProp: true,
+    ref,
+    additionalProps: {
+      id
     },
+    ownerState,
+    getSlotProps: handlers => ({
+      ...handlers,
+      onClose: event => {
+        handlers.onClose?.(event);
+        handleTooltipClose();
+      },
+      onOpen: event => {
+        handlers.onOpen?.(event);
+        handleTooltipOpen();
+      }
+    })
+  });
+  const [StaticTooltipSlot, staticTooltipSlotProps] = useSlot('staticTooltip', {
+    elementType: SpeedDialActionStaticTooltip,
+    externalForwardedProps,
+    ownerState,
+    ref,
+    className: classes.staticTooltip,
+    additionalProps: {
+      id
+    }
+  });
+  const [StaticTooltipLabelSlot, staticTooltipLabelSlotProps] = useSlot('staticTooltipLabel', {
+    elementType: SpeedDialActionStaticTooltipLabel,
+    externalForwardedProps,
+    ownerState,
+    className: classes.staticTooltipLabel,
+    additionalProps: {
+      style: transitionStyle,
+      id: `${id}-label`
+    }
+  });
+  const fab = /*#__PURE__*/_jsx(FabSlot, {
+    ...fabSlotProps,
     children: icon
   });
-  if (tooltipOpenProp) {
-    return /*#__PURE__*/_jsxs(SpeedDialActionStaticTooltip, {
-      id: id,
-      ref: ref,
-      className: classes.staticTooltip,
-      ownerState: ownerState,
+  if (tooltipSlotProps.open) {
+    return /*#__PURE__*/_jsxs(StaticTooltipSlot, {
+      ...staticTooltipSlotProps,
       ...other,
-      children: [/*#__PURE__*/_jsx(SpeedDialActionStaticTooltipLabel, {
-        style: transitionStyle,
-        id: `${id}-label`,
-        className: classes.staticTooltipLabel,
-        ownerState: ownerState,
-        children: tooltipTitle
+      children: [/*#__PURE__*/_jsx(StaticTooltipLabelSlot, {
+        ...staticTooltipLabelSlotProps,
+        children: tooltipSlotProps.title
       }), /*#__PURE__*/React.cloneElement(fab, {
         'aria-labelledby': `${id}-label`
       })]
@@ -198,15 +254,12 @@ const SpeedDialAction = /*#__PURE__*/React.forwardRef(function SpeedDialAction(i
   if (!open && tooltipOpen) {
     setTooltipOpen(false);
   }
-  return /*#__PURE__*/_jsx(Tooltip, {
-    id: id,
-    ref: ref,
-    title: tooltipTitle,
-    placement: tooltipPlacement,
-    onClose: handleTooltipClose,
-    onOpen: handleTooltipOpen,
+  return /*#__PURE__*/_jsx(TooltipSlot, {
+    ...tooltipSlotProps,
+    title: tooltipSlotProps.title,
     open: open && tooltipOpen,
-    classes: TooltipClasses,
+    placement: tooltipSlotProps.placement,
+    classes: tooltipSlotProps.classes,
     ...other,
     children: fab
   });
@@ -232,6 +285,7 @@ process.env.NODE_ENV !== "production" ? SpeedDialAction.propTypes /* remove-prop
   /**
    * Props applied to the [`Fab`](https://mui.com/material-ui/api/fab/) component.
    * @default {}
+   * @deprecated Use `slotProps.fab` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   FabProps: PropTypes.object,
   /**
@@ -247,26 +301,50 @@ process.env.NODE_ENV !== "production" ? SpeedDialAction.propTypes /* remove-prop
    * If `true`, the component is shown.
    */
   open: PropTypes.bool,
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    fab: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    staticTooltip: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    staticTooltipLabel: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    tooltip: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    fab: PropTypes.elementType,
+    staticTooltip: PropTypes.elementType,
+    staticTooltipLabel: PropTypes.elementType,
+    tooltip: PropTypes.elementType
+  }),
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
   /**
    * `classes` prop applied to the [`Tooltip`](https://mui.com/material-ui/api/tooltip/) element.
+   * @deprecated Use `slotProps.tooltip.classes` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   TooltipClasses: PropTypes.object,
   /**
    * Make the tooltip always visible when the SpeedDial is open.
    * @default false
+   * @deprecated Use `slotProps.tooltip.open` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   tooltipOpen: PropTypes.bool,
   /**
    * Placement of the tooltip.
    * @default 'left'
+   * @deprecated Use `slotProps.tooltip.placement` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   tooltipPlacement: PropTypes.oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),
   /**
    * Label to display in the tooltip.
+   * @deprecated Use `slotProps.tooltip.title` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   tooltipTitle: PropTypes.node
 } : void 0;

package/StepContent/StepContent.d.ts

@@ -4,7 +4,7 @@ import { CollapseProps, InternalStandardProps as StandardProps } from '..';
 import { Theme } from '../styles';
 import { TransitionProps } from '../transitions/transition';
 import { StepContentClasses } from './stepContentClasses';
-import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types';
+import { CreateSlotsAndSlotProps, SlotComponentProps } from '../utils/types';
 
 export interface StepContentSlots {
   /**
@@ -24,7 +24,7 @@ export type StepContentSlotsAndSlotProps = CreateSlotsAndSlotProps<
      * Props forwared to the transition slot.
      * By default, the available props are based on the [Collapse](https://mui.com/material-ui/api/collapse/#props) component
      */
-    transition: SlotProps<React.ElementType<CollapseProps>, {}, StepContentOwnerState>;
+    transition: SlotComponentProps<React.ElementType, CollapseProps, StepContentOwnerState>;
   }
 >;
 

package/SwipeableDrawer/SwipeableDrawer.d.ts

@@ -1,7 +1,32 @@
 import * as React from 'react';
-import { DrawerProps } from '../Drawer';
+import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types';
+import { DrawerProps, DrawerOwnerState, DrawerSlotsAndSlotProps } from '../Drawer';
 
-export interface SwipeableDrawerProps extends Omit<DrawerProps, 'onClose' | 'open'> {
+export interface SwipeableDrawerSwipeAreaSlotPropsOverrides {}
+
+export interface SwipeableDrawerSlots {
+  /**
+   * The component used for the swipeArea slot.
+   * @default div
+   */
+  swipeArea?: React.ElementType;
+}
+
+type SwipeableDrawerSlotsAndSlotProps = DrawerSlotsAndSlotProps &
+  CreateSlotsAndSlotProps<
+    SwipeableDrawerSlots,
+    {
+      /**
+       * Props forwarded to the docked slot.
+       * By default, the avaible props are based on a div element.
+       */
+      swipeArea: SlotProps<'div', SwipeableDrawerSwipeAreaSlotPropsOverrides, DrawerOwnerState>;
+    }
+  >;
+
+export interface SwipeableDrawerProps
+  extends Omit<DrawerProps, 'onClose' | 'open' | 'slots' | 'slotProps'>,
+    SwipeableDrawerSlotsAndSlotProps {
   /**
    * If set to true, the swipe event will open the drawer even if the user begins the swipe on one of the drawer's children.
    * This can be useful in scenarios where the drawer is partially visible.
@@ -67,6 +92,7 @@ export interface SwipeableDrawerProps extends Omit<DrawerProps, 'onClose' | 'ope
   open?: boolean;
   /**
    * The element is used to intercept the touch events on the edge.
+   * @deprecated use the `slotProps.swipeArea` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   SwipeAreaProps?: object;
   /**

package/SwipeableDrawer/SwipeableDrawer.js

@@ -14,6 +14,8 @@ import useEnhancedEffect from "../utils/useEnhancedEffect.js";
 import { useTheme } from "../zero-styled/index.js";
 import { useDefaultProps } from "../DefaultPropsProvider/index.js";
 import { getTransitionProps } from "../transitions/utils.js";
+import { mergeSlotProps } from "../utils/index.js";
+import useSlot from "../utils/useSlot.js";
 import SwipeArea from "./SwipeArea.js";
 
 // This value is closed to what browsers are using internally to
@@ -145,6 +147,8 @@ const SwipeableDrawer = /*#__PURE__*/React.forwardRef(function SwipeableDrawer(i
     transitionDuration = transitionDurationDefault,
     variant = 'temporary',
     // Mobile first.
+    slots = {},
+    slotProps = {},
     ...other
   } = props;
   const [maybeSwiping, setMaybeSwiping] = React.useState(false);
@@ -450,6 +454,22 @@ const SwipeableDrawer = /*#__PURE__*/React.forwardRef(function SwipeableDrawer(i
       setMaybeSwiping(false);
     }
   }, [open]);
+  const [SwipeAreaSlot, swipeAreaSlotProps] = useSlot('swipeArea', {
+    ref: swipeAreaRef,
+    elementType: SwipeArea,
+    ownerState: props,
+    externalForwardedProps: {
+      slots,
+      slotProps: {
+        swipeArea: SwipeAreaProps,
+        ...slotProps
+      }
+    },
+    additionalProps: {
+      width: swipeAreaWidth,
+      anchor
+    }
+  });
   return /*#__PURE__*/_jsxs(React.Fragment, {
     children: [/*#__PURE__*/_jsx(Drawer, {
       open: variant === 'temporary' && maybeSwiping ? true : open,
@@ -467,25 +487,27 @@ const SwipeableDrawer = /*#__PURE__*/React.forwardRef(function SwipeableDrawer(i
         ...ModalPropsProp
       },
       hideBackdrop: hideBackdrop,
-      PaperProps: {
-        ...PaperProps,
-        style: {
-          pointerEvents: variant === 'temporary' && !open && !allowSwipeInChildren ? 'none' : '',
-          ...PaperProps.style
-        },
-        ref: handleRef
-      },
       anchor: anchor,
       transitionDuration: calculatedDurationRef.current || transitionDuration,
       onClose: onClose,
       ref: ref,
+      slots: slots,
+      slotProps: {
+        ...slotProps,
+        backdrop: mergeSlotProps(slotProps.backdrop ?? BackdropProps, {
+          ref: backdropRef
+        }),
+        paper: mergeSlotProps(slotProps.paper ?? PaperProps, {
+          style: {
+            pointerEvents: variant === 'temporary' && !open && !allowSwipeInChildren ? 'none' : ''
+          },
+          ref: handleRef
+        })
+      },
       ...other
     }), !disableSwipeToOpen && variant === 'temporary' && /*#__PURE__*/_jsx(NoSsr, {
-      children: /*#__PURE__*/_jsx(SwipeArea, {
-        anchor: anchor,
-        ref: swipeAreaRef,
-        width: swipeAreaWidth,
-        ...SwipeAreaProps
+      children: /*#__PURE__*/_jsx(SwipeAreaSlot, {
+        ...swipeAreaSlotProps
       })
     })]
   });
@@ -583,8 +605,33 @@ process.env.NODE_ENV !== "production" ? SwipeableDrawer.propTypes /* remove-prop
     component: elementTypeAcceptingRef,
     style: PropTypes.object
   }),
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: PropTypes.shape({
+    backdrop: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    docked: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    paper: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    root: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    swipeArea: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    transition: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: PropTypes.shape({
+    backdrop: PropTypes.elementType,
+    docked: PropTypes.elementType,
+    paper: PropTypes.elementType,
+    root: PropTypes.elementType,
+    swipeArea: PropTypes.elementType,
+    transition: PropTypes.elementType
+  }),
   /**
    * The element is used to intercept the touch events on the edge.
+   * @deprecated use the `slotProps.swipeArea` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   SwipeAreaProps: PropTypes.object,
   /**

package/Switch/Switch.js

@@ -305,10 +305,12 @@ process.env.NODE_ENV !== "production" ? Switch.propTypes /* remove-proptypes */
   id: PropTypes.string,
   /**
    * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   * @deprecated Use `slotProps.input` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   inputProps: PropTypes.object,
   /**
    * Pass a ref to the `input` element.
+   * @deprecated Use `slotProps.input.ref` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
   inputRef: refType,
   /**

package/Tabs/Tabs.d.ts

@@ -1,19 +1,141 @@
 import * as React from 'react';
 import { SxProps } from '@mui/system';
 import { OverridableStringUnion } from '@mui/types';
-import { SlotComponentProps } from '../utils/types';
+import { CreateSlotsAndSlotProps, SlotProps } from '../utils/types';
 import { Theme } from '../styles';
-import { TabScrollButtonProps } from '../TabScrollButton';
+import TabScrollButton, { TabScrollButtonProps } from '../TabScrollButton';
 import { OverridableComponent, OverrideProps } from '../OverridableComponent';
 import { TabsClasses } from './tabsClasses';
 import SvgIcon from '../SvgIcon';
 
 export interface TabsPropsIndicatorColorOverrides {}
 
+export interface TabsRootSlotPropsOverrides {}
+export interface TabsScrollerSlotPropsOverrides {}
+export interface TabsListSlotPropsOverrides {}
+export interface TabsScrollbarSlotPropsOverrides {}
+export interface TabsIndicatorSlotPropsOverrides {}
+export interface TabsScrollButtonsSlotPropsOverrides {}
 export interface TabsStartScrollButtonIconSlotPropsOverrides {}
 export interface TabsEndScrollButtonIconSlotPropsOverrides {}
 
-export interface TabsOwnerState extends TabsProps {
+export interface TabsSlots {
+  /**
+   * The component used for the popper.
+   * @default div
+   */
+  root: React.ElementType;
+  /**
+   * The component used for the scroller.
+   * @default div
+   */
+  scroller: React.ElementType;
+  /**
+   * The component used for the flex container.
+   * @default div
+   */
+  list: React.ElementType;
+  /**
+   * The component used for the scroller.
+   * @default ScrollbarSize
+   */
+  scrollbar: React.ElementType;
+  /**
+   * The component used for the tab indicator.
+   * @default span
+   */
+  indicator: React.ElementType;
+  /**
+   * The component used for the scroll button.
+   * @default TabScrollButton
+   */
+  scrollButtons: React.ElementType;
+  /**
+   * The component used for the start scroll button icon.
+   * @default KeyboardArrowLeft
+   */
+  startScrollButtonIcon: React.ElementType;
+  /**
+   * The component used for the end scroll button icon.
+   * @default KeyboardArrowRight
+   */
+  endScrollButtonIcon: React.ElementType;
+}
+
+export type TabsSlotsAndSlotProps = CreateSlotsAndSlotProps<
+  TabsSlots,
+  {
+    /**
+     * Props forwarded to the root slot.
+     * By default, the avaible props are based on the div element.
+     */
+    root: SlotProps<'div', TabsRootSlotPropsOverrides, TabsOwnerState>;
+    /**
+     * Props forwarded to the scroller slot.
+     * By default, the avaible props are based on the div element.
+     */
+    scroller: SlotProps<'div', TabsScrollerSlotPropsOverrides, TabsOwnerState>;
+    /**
+     * Props forwarded to the list slot.
+     * By default, the avaible props are based on the div element.
+     */
+    list: SlotProps<'div', TabsListSlotPropsOverrides, TabsOwnerState>;
+    /**
+     * Props forwarded to the scrollbar slot.
+     * By default, the avaible props are based on the div element.
+     */
+    scrollbar: SlotProps<
+      'div',
+      { onChange?: (scrollbarWidth: undefined | number) => void } & TabsScrollbarSlotPropsOverrides,
+      TabsOwnerState
+    >;
+    /**
+     * Props forwarded to the indicator slot.
+     * By default, the avaible props are based on the span element.
+     */
+    indicator: SlotProps<'span', TabsIndicatorSlotPropsOverrides, TabsOwnerState>;
+    /**
+     * Props forwarded to the scrollButton slot.
+     * By default, the avaible props are based on the [TabScrollButton](https://mui.com/material-ui/api/tab-scroll-button/#props) component.
+     */
+    scrollButtons: SlotProps<
+      typeof TabScrollButton,
+      TabsScrollButtonsSlotPropsOverrides,
+      TabsOwnerState
+    >;
+    /**
+     * Props forwarded to the startScrollButtonIcon slot.
+     * By default, the avaible props are based on the [SvgIcon](https://mui.com/material-ui/api/svg-icon/#props) component.
+     */
+    startScrollButtonIcon: SlotProps<
+      typeof SvgIcon,
+      TabsStartScrollButtonIconSlotPropsOverrides,
+      TabsOwnerState
+    >;
+    /**
+     * Props forwarded to the endScrollButtonIcon slot.
+     * By default, the avaible props are based on the [SvgIcon](https://mui.com/material-ui/api/svg-icon/#props) component.
+     */
+    endScrollButtonIcon: SlotProps<
+      typeof SvgIcon,
+      TabsEndScrollButtonIconSlotPropsOverrides,
+      TabsOwnerState
+    >;
+  }
+> & {
+  slots?: {
+    /**
+     * @deprecated Use `slots.startScrollButtonIcon` instead.
+     */
+    StartScrollButtonIcon?: React.ElementType;
+    /**
+     * @deprecated Use `slots.endScrollButtonIcon` instead.
+     */
+    EndScrollButtonIcon?: React.ElementType;
+  };
+};
+
+export interface TabsOwnerState extends Omit<TabsProps, 'slots' | 'slotProps'> {
   vertical: boolean;
   fixed: boolean;
   hideScrollbar: boolean;
@@ -23,7 +145,7 @@ export interface TabsOwnerState extends TabsProps {
   scrollButtonsHideMobile: boolean;
 }
 
-export interface TabsOwnProps {
+export interface TabsOwnProps extends TabsSlotsAndSlotProps {
   /**
    * Callback fired when the component mounts.
    * This is useful when you want to trigger an action programmatically.
@@ -61,31 +183,6 @@ export interface TabsOwnProps {
    * Override or extend the styles applied to the component.
    */
   classes?: Partial<TabsClasses>;
-  /**
-   * The components used for each slot inside.
-   * @default {}
-   */
-  slots?: {
-    StartScrollButtonIcon?: React.ElementType;
-    EndScrollButtonIcon?: React.ElementType;
-  };
-  /**
-   * The extra props for the slot components.
-   * You can override the existing props or add new ones.
-   * @default {}
-   */
-  slotProps?: {
-    startScrollButtonIcon?: SlotComponentProps<
-      typeof SvgIcon,
-      TabsStartScrollButtonIconSlotPropsOverrides,
-      TabsOwnerState
-    >;
-    endScrollButtonIcon?: SlotComponentProps<
-      typeof SvgIcon,
-      TabsEndScrollButtonIconSlotPropsOverrides,
-      TabsOwnerState
-    >;
-  };
   /**
    * Determines the color of the indicator.
    * @default 'primary'
@@ -108,6 +205,7 @@ export interface TabsOwnProps {
   orientation?: 'horizontal' | 'vertical';
   /**
    * The component used to render the scroll buttons.
+   * @deprecated use the `slots.scrollButtons` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    * @default TabScrollButton
    */
   ScrollButtonComponent?: React.ElementType;
@@ -130,6 +228,7 @@ export interface TabsOwnProps {
   selectionFollowsFocus?: boolean;
   /**
    * Props applied to the tab indicator element.
+   * @deprecated use the `slotProps.indicator` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    * @default  {}
    */
   TabIndicatorProps?: React.HTMLAttributes<HTMLDivElement> & {
@@ -137,6 +236,7 @@ export interface TabsOwnProps {
   };
   /**
    * Props applied to the [`TabScrollButton`](https://mui.com/material-ui/api/tab-scroll-button/) element.
+   * @deprecated use the `slotProps.scrollButtons` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    * @default {}
    */
   TabScrollButtonProps?: Partial<TabScrollButtonProps>;