aboutsummaryrefslogblamecommitdiffstats
path: root/packages/instant/src/components/ui/circle.tsx
blob: 4f9f56f125190414994fc9a01ac9ad36bbbd02fc (plain) (tree)
1
2
3
4
5
6
7
8
9
                                                                          

                              
                     


                        

 
                                
                

                     


                                             
                                                                                                                        

                           

  



                              
                             
  
import { ColorOption, styled, Theme, withTheme } from '../../style/theme';

export interface CircleProps {
    diameter: number;
    rawColor?: string;
    color?: ColorOption;
    theme: Theme;
}

export const Circle = withTheme(
    styled.div <
        CircleProps >
        `
    && {
        width: ${props => props.diameter}px;
        height: ${props => props.diameter}px;
        background-color: ${props => (props.rawColor ? props.rawColor : props.theme[props.color || ColorOption.white])};
        border-radius: 50%;
    }
`,
);

Circle.displayName = 'Circle';

Circle.defaultProps = {
    color: ColorOption.white,
};