How can I customize the icon default prop for Mui checkbox? I followed the instructions provided here and used a snippet from the documentation:
const BpIcon = styled('span')(({ theme }) => ({
borderRadius: 3,
width: 16,
height: 16,
...
}));
const theme = createTheme({
components: {
// Name of the component
MuiCheckbox: {
defaultProps: {
icon: <BpIcon />,
},
},
},
});
However, I encountered the following error:
./src/theme.ts
Error: error: Expression expected
|
81 | icon: <BpIcon />,
| ^
I also attempted to pass icon: BpIcon but received the following error:
Unhandled Runtime Error
RangeError: Maximum call stack size exceeded
Call Stack
Module.default
webpack-internal:///./node_modules/@babel/runtime/helpers/esm/extends.js (3:43)
deepmerge
node_modules/@mui/utils/esm/deepmerge.js (8:33)
eval
node_modules/@mui/utils/esm/deepmerge.js (19:0)
Could someone provide guidance on what mistake I might be making? Thank you!