@unicity/design-system
Version:
A comprehensive React component library built on Material-UI with advanced theming capabilities including neumorphism design support
47 lines • 1.61 kB
JavaScript
import { styled } from '@mui/material/styles';
import { Tooltip } from '@mui/material';
export const StyledTooltip = styled(Tooltip, {
shouldForwardProp: (prop) => prop !== 'size' && prop !== 'color',
})(({ theme, size, color }) => {
const getFontSize = () => {
switch (size) {
case 'small':
return '0.625rem';
case 'large':
return '0.875rem';
default:
return '0.75rem';
}
};
const getBackgroundColor = () => {
switch (color) {
case 'primary':
return theme.palette.primary.main;
case 'secondary':
return theme.palette.secondary.main;
case 'error':
return theme.palette.error.main;
case 'warning':
return theme.palette.warning.main;
case 'info':
return theme.palette.info.main;
case 'success':
return theme.palette.success.main;
default:
return theme.palette.grey[700];
}
};
return {
'& .MuiTooltip-tooltip': {
backgroundColor: getBackgroundColor(),
fontSize: getFontSize(),
borderRadius: theme.shape.borderRadius,
padding: theme.spacing(size === 'small' ? 0.5 : size === 'large' ? 1.5 : 1),
maxWidth: size === 'small' ? 200 : size === 'large' ? 400 : 300,
},
'& .MuiTooltip-arrow': {
color: getBackgroundColor(),
},
};
});
//# sourceMappingURL=Tooltip.style.js.map