@lunit/oui/dist/presentations/ToggleControl/ToggleControl.styled.js

Lunit Oncology UI components

import { Box, styled } from '@mui/material';
export const ToggleControlOuter = styled(Box, {
    shouldForwardProp: (prop) => prop !== 'hasBar',
})(({ hasBar }) => ({
    display: 'flex',
    flexDirection: 'column',
    alignItems: 'flex-start',
    gap: hasBar ? '10px' : '8px',
    width: '100%',
    height: hasBar ? 'auto' : '20px',
}));
export const ToggleControlContainer = styled(Box, {
    shouldForwardProp: (prop) => !['size'].includes(prop.toString()),
})(({ size }) => {
    return {
        width: '100%',
        display: 'flex',
        justifyContent: 'space-between',
        padding: '2px',
        alignItems: 'center',
    };
});