How can I apply custom styles for the Tab Icon?

export default function EcomTabs(props) {
  return (
    
       theme.palette.grey[50],
      }}
        icon={props.icon}
        label={props.label}
      >
    
  );
}

1. tried to create a new theme for the component:

components: {
        MuiTabs: {
            iconWrapper: {
                color: "secondary",
            }

                },
        },

2. also tried to use StyledTab, but didn't work as well

created styled tab in separated filed

const StyledTab = styled(Tab)  (({ theme }) => ({
    "& .MuiTab-root": {
        ".MuiTab-iconWrapper" :{
            color: theme.palette.primary.main,
        },
    },
}));

and imported to component

export default function EcomTabs(props) {
  return (
    
       theme.palette.grey[50],
      }}
        icon={props.icon}
        label={props.label}
      >
    
  );
}```