[Rating] Remove deprecated IconContainerComponent

docs/data/material/components/rating/RadioGroupRating.js

@@ -51,8 +51,8 @@ export default function RadioGroupRating() {
     <StyledRating
       name="highlight-selected-only"
       defaultValue={2}
-      IconContainerComponent={IconContainer}
       getLabelText={(value) => customIcons[value].label}
+      slotProps={{ icon: { component: IconContainer } }}
       highlightSelectedOnly
     />
   );

docs/data/material/components/rating/RadioGroupRating.tsx

@@ -51,8 +51,8 @@ export default function RadioGroupRating() {
     <StyledRating
       name="highlight-selected-only"
       defaultValue={2}
-      IconContainerComponent={IconContainer}
       getLabelText={(value: number) => customIcons[value].label}
+      slotProps={{ icon: { component: IconContainer } }}
       highlightSelectedOnly
     />
   );

docs/data/material/components/rating/RadioGroupRating.tsx.preview

@@ -1,7 +1,7 @@
 <StyledRating
   name="highlight-selected-only"
   defaultValue={2}
-  IconContainerComponent={IconContainer}
   getLabelText={(value: number) => customIcons[value].label}
+  slotProps={{ icon: { component: IconContainer } }}
   highlightSelectedOnly
 />

docs/data/material/migration/upgrade-to-v9/upgrade-to-v9.md

@@ -1314,6 +1314,25 @@ The following deprecated props have been removed:
  />
 ```
 
+#### Rating deprecated props removed
+
+Use the [rating-props codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#rating-props) below to migrate the code as described in the following section:
+
+```bash
+npx @mui/codemod@latest deprecations/rating-props <path>
+```
+
+The following deprecated prop has been removed:
+
+- `IconContainerComponent` — use `slotProps.icon.component` instead
+
+```diff
+ <Rating
+-  IconContainerComponent={CustomIconContainer}
++  slotProps={{ icon: { component: CustomIconContainer } }}
+ />
+```
+
 #### Switch deprecated props removed
 
 Use the [switch-props codemod](https://github.com/mui/material-ui/tree/HEAD/packages/mui-codemod#switch-props) below to migrate the code as described in the following section:

docs/pages/material-ui/api/rating.json

@@ -13,12 +13,6 @@
     },
     "highlightSelectedOnly": { "type": { "name": "bool" }, "default": "false" },
     "icon": { "type": { "name": "node" }, "default": "<Star fontSize=\"inherit\" />" },
-    "IconContainerComponent": {
-      "type": { "name": "elementType" },
-      "default": "function IconContainer(props) {\n  const { value, ...other } = props;\n  return <span {...other} />;\n}",
-      "deprecated": true,
-      "deprecationInfo": "Use <code>slotProps.icon.component</code> instead. This prop will be removed in a future major release. See <a href=\"/material-ui/migration/migrating-from-deprecated-apis/\">Migrating from deprecated APIs</a> for more details."
-    },
     "max": { "type": { "name": "number" }, "default": "5" },
     "name": { "type": { "name": "string" } },
     "onChange": {

docs/translations/api-docs/rating/rating.json

@@ -21,7 +21,6 @@
       "description": "If <code>true</code>, only the selected icon will be highlighted."
     },
     "icon": { "description": "The icon to display." },
-    "IconContainerComponent": { "description": "The component containing the icon." },
     "max": { "description": "Maximum rating." },
     "name": {
       "description": "The name attribute of the radio <code>input</code> elements. This input <code>name</code> should be unique within the page. Being unique within a form is insufficient since the <code>name</code> is used to generate IDs."

packages/mui-material/src/Rating/Rating.d.ts

@@ -113,15 +113,6 @@ export interface RatingOwnProps extends RatingSlotsAndSlotProps {
    * @default <Star fontSize="inherit" />
    */
   icon?: React.ReactNode;
-  /**
-   * The component containing the icon.
-   * @deprecated Use `slotProps.icon.component` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   * @default function IconContainer(props) {
-   *   const { value, ...other } = props;
-   *   return <span {...other} />;
-   * }
-   */
-  IconContainerComponent?: React.ElementType<IconContainerProps> | undefined;
   /**
    * Maximum rating.
    * @default 5

packages/mui-material/src/Rating/Rating.js

@@ -223,7 +223,6 @@ function RatingItem(props) {
     highlightSelectedOnly,
     hover,
     icon,
-    IconContainerComponent,
     isActive,
     itemValue,
     labelProps,
@@ -278,9 +277,7 @@ function RatingItem(props) {
       value: itemValue,
     },
     internalForwardedProps: {
-      // TODO: remove this in v7 because `IconContainerComponent` is deprecated
-      // only forward if `slots.icon` is NOT provided
-      as: IconContainerComponent,
+      as: IconContainer,
     },
   });
 
@@ -334,7 +331,6 @@ RatingItem.propTypes = {
   highlightSelectedOnly: PropTypes.bool.isRequired,
   hover: PropTypes.number.isRequired,
   icon: PropTypes.node,
-  IconContainerComponent: PropTypes.elementType.isRequired,
   isActive: PropTypes.bool.isRequired,
   itemValue: PropTypes.number.isRequired,
   labelProps: PropTypes.object,
@@ -370,7 +366,6 @@ const Rating = React.forwardRef(function Rating(inProps, ref) {
     getLabelText = defaultLabelText,
     highlightSelectedOnly = false,
     icon = defaultIcon,
-    IconContainerComponent = IconContainer,
     max = 5,
     name: nameProp,
     onChange,
@@ -541,7 +536,6 @@ const Rating = React.forwardRef(function Rating(inProps, ref) {
     focusVisible,
     getLabelText,
     icon,
-    IconContainerComponent,
     max,
     precision,
     readOnly,
@@ -610,7 +604,6 @@ const Rating = React.forwardRef(function Rating(inProps, ref) {
           highlightSelectedOnly,
           hover,
           icon,
-          IconContainerComponent,
           name,
           onBlur: handleBlur,
           onChange: handleChange,
@@ -760,15 +753,6 @@ Rating.propTypes /* remove-proptypes */ = {
    * @default <Star fontSize="inherit" />
    */
   icon: PropTypes.node,
-  /**
-   * The component containing the icon.
-   * @deprecated Use `slotProps.icon.component` instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   * @default function IconContainer(props) {
-   *   const { value, ...other } = props;
-   *   return <span {...other} />;
-   * }
-   */
-  IconContainerComponent: PropTypes.elementType,
   /**
    * Maximum rating.
    * @default 5

packages/mui-material/src/Rating/Rating.test.js

@@ -263,6 +263,14 @@ describe('<Rating />', () => {
     }
   });
 
+  it('should not spread the `value` prop on the icon slot DOM element', () => {
+    const { container } = render(<Rating name="rating-test" value={2} />);
+
+    container.querySelectorAll(`.${classes.icon}`).forEach((icon) => {
+      expect(icon).not.to.have.attribute('value');
+    });
+  });
+
   it('should be able to replace the icon', () => {
     function Icon(props) {
       return <i data-testid="custom" {...props} />;