In material UI doc, there's this:
styled(Button)({
boxShadow: 'none',
textTransform: 'none',
fontSize: 16,
padding: '6px 12px',
border: '1px solid',
lineHeight: 1.5,
backgroundColor: '#0063cc',
borderColor: '#0063cc',
fontFamily: [
'-apple-system',
'BlinkMacSystemFont',
'"Segoe UI"',
'Roboto',
'"Helvetica Neue"',
'Arial',
'sans-serif',
'"Apple Color Emoji"',
'"Segoe UI Emoji"',
'"Segoe UI Symbol"',
].join(','),
'&:hover': {
backgroundColor: '#0069d9',
borderColor: '#0062cc',
boxShadow: 'none',
},
'&:active': {
boxShadow: 'none',
backgroundColor: '#0062cc',
borderColor: '#005cbf',
},
'&:focus': {
boxShadow: '0 0 0 0.2rem rgba(0,123,255,.5)',
},
});
But what is this syntax? styled()() ? Is this Javascript? There's a toggle to switch between Javascript and Typescript, but I already set it to Javascript and the syntax is still styled()(), what does it means? Is this some kind of ES6 syntax?
EDIT: Apparently this is higher order function. Never knew before that it can be written like this: blablabla()();