import { assertExists } from '@ulangi/assert' ; import { ButtonSize , Theme } from '@ulangi/ulangi-common/enums' ; import { ButtonStyles } from '@ulangi/ulangi-common/interfaces' ; import { Map } from 'immutable' ; import { config } from '../constants/config' ; import { Layout , ResponsiveStyleSheet , ScaleByBreakpoints , ScaleByFactor , } from '../utils/responsive' ; import { roundedCornerButtonStyles } from './RoundedCornerButtonStyles' ; import { textButtonStyles } from './TextButtonStyles' ; export type FullRoundedButtonOptions = OutlineFullRoundedButtonOptions | SolidFullRoundedButtonOptions ; export interface SolidFullRoundedButtonOptions { kind : 'solid' ; size : ButtonSize ; textColor : string ; backgroundColor : string ; } export interface OutlineFullRoundedButtonOptions { kind : 'outline' ; size : ButtonSize ; textColor : string ; } export class FullRoundedButtonStyles extends ResponsiveStyleSheet < ButtonStyles , FullRoundedButtonOptions > { protected readonly borderRadiusBySize : Map < ButtonSize , number > = Map ( [ [ ButtonSize . X_LARGE , textButtonStyles . getHeightBySize ( ButtonSize . X_LARGE ) / 2 , ] , [ ButtonSize . LARGE , textButtonStyles . getHeightBySize ( ButtonSize . LARGE ) / 2 ] , [ ButtonSize . NORMAL , textButtonStyles . getHeightBySize ( ButtonSize . NORMAL ) / 2 , ] , [ ButtonSize . SMALL , textButtonStyles . getHeightBySize ( ButtonSize . SMALL ) / 2 ] , [ ButtonSize . X_SMALL , textButtonStyles . getHeightBySize ( ButtonSize . X_SMALL ) / 2 , ] , ] ) ; public getBorderRadiusBySize ( size ) { return assertExists ( this . borderRadiusBySize . get ( size ) ) ; } public baseStyles ( scaleByFactor , scaleByBreakpoints , layout , options ) { return roundedCornerButtonStyles . baseStyles ( scaleByFactor , scaleByBreakpoints , layout , { ... options , borderRadius : scaleByFactor ( this . getBorderRadiusBySize ( options . size ) * 2 ) / 2 , } ) ; } public lightStyles ( ) { return { } ; } public darkStyles ( ) { return { } ; } public getSolidBackgroundStyles ( size , backgroundColor , textColor , theme , layout ) { return this . compile ( layout , theme , { kind : 'solid' , size , backgroundColor , textColor , } ) ; } public getSolidPrimaryBackgroundStyles ( size , theme , layout ) { return this . getSolidBackgroundStyles ( size , config . styles . primaryColor , 'white' , theme , layout ) ; } public getSolidGreenBackgroundStyles ( size , theme , layout ) { return this . getSolidBackgroundStyles ( size , config . styles . greenColor , 'white' , theme , layout ) ; } public getSolidGreyBackgroundStyles ( size , theme , layout ) { return this . getSolidBackgroundStyles ( size , '#ddd' , '#444' , theme , layout ) ; } public getOutlineStyles ( size , textColor , theme , layout ) { return this . compile ( layout , theme , { kind : 'outline' , size , textColor , } ) ; } public getGreyOutlineStyles ( size , theme , layout ) { return this . getOutlineStyles ( size , '#777' , theme , layout ) ; } public getPrimaryOutlineStyles ( size , theme , layout ) { return this . getOutlineStyles ( size , config . styles . primaryColor , theme , layout ) ; } public getGreenOutlineStyles ( size , theme , layout ) { return this . getOutlineStyles ( size , config . styles . greenColor , theme , layout ) ; } } export const fullRoundedButtonStyles = new FullRoundedButtonStyles ( ) ;