import * as React from "react" ; import styles from "./index.scss" ; export type Props = { color : string ; element : string ; size : string ; } ; export default class Text extends React . Component < Props > { getClassNames ( ) { let classNames = [ ] ; const { color , size } = this . props ; const colorPrefix = "text-" ; ( "string" === typeof size ) ? classNames . push ( styles [ size ] ) : Function . prototype ( ) ; ( "string" === typeof color ) ? classNames . push ( styles [ colorPrefix . concat ( color ) ] ) : Function . prototype ( ) ; return classNames . join ( " " ) ; } getTagName ( ) { const defaultTagName = "span" ; const { element } = this . props ; if ( "string" !== typeof element ) { return defaultTagName ; } const elementsNameMap = { "inline" : "span" , "p" : "p" , "paragraph" : "p" , "small" : "small" , "smallprint" : "small" , "span" : "span" } ; let tagName = elementsNameMap [ element ] ; if ( "string" !== typeof tagName ) { return defaultTagName ; } return tagName ; } render ( ) { const TagName = this . getTagName ( ) ; return ( < TagName className = { this . getClassNames ( ) } > { this . props . children } < /TagName>); } }