Switching between dark/light style overrides - material-ui

Question

I want to override the color of some icons based on theme.type to a native PaletteColor. I can check the type and conditionally set the color like this:
const useStyles = makeStyles((theme: Theme) =>
createStyles({
someIcon: {
color:
theme.palette.type === "dark"
? theme.palette.warning.dark
: theme.palette.warning.light,
},
})
);
This is pretty verbose every time I want to override something though, so it can be refactored to themeColor below:
const themeColor = (theme: Theme, color: PaletteColor) =>
theme.palette.type === "dark"
? color.dark
: color.light;
const useStyles = makeStyles((theme: Theme) =>
createStyles({
someIcon: {
color: themeColor(theme, theme.palette.warning)
},
})
);
Which now makes me think, does Material-UI have some native helper that already does this?

Answer 1

I digged in the Material-UI source code for a while and here is what I found:
You can see any potential helper methods related to Material-UI style here.
There is this commit that changed palette.type to palette.mode, if you Ctrl+F to search for 'light' ? or 'dark' ?, you'll see that they also use ternary operator to assign the colors based on the dark | light mode so I doubt they have any helper method like what you described in the second snippet.