Hello I'm using styled components and material-ui with custom prefix for material ui classes.
However on my styles files I'm forced to import that prefix and before the name of material-ui class manually.
Is there any way to automate it across entire application, so I don't have to add muiPrefix
manually to before the class ?
This is how I'm using prefix
MUI theme provider wraps styled components provider
import { createGenerateClassName } from '@material-ui/core/styles';
export const generateClassPrefix = (prefix: string) =>
createGenerateClassName({
seed: prefix,
});
Example styles file
export const muiPrefix = 'my-prefix';
import { muiPrefix } from ...
const Button = styled(MuiButton)<StylesProps>`
&.${muiPrefix}-MuiButton-root {
pointer-events: ${({ $loading }) => {
return $loading ? 'none' : 'auto';
}};
}
}