import cn from "classnames" ; import React , { FunctionComponent , ReactNode } from "react" ; import { withStyles } from "coral-ui/hocs" ; import styles from "./Message.css" ; export interface MessageProps { /**
     * The content of the component.
     */ children : ReactNode ; /**
     * Convenient prop to override the root styling.
     */ className ? : string ; /**
     * Override or extend the styles applied to the component.
     */ classes : typeof styles ; fullWidth ? : boolean ; color ? : "error" | "grey" | "primary" | "dark" ; } const Message = ( props ) => { const { className , classes , fullWidth , children , color , ... rest } = props ; const rootClassName = cn ( classes . root , { [ classes . colorGrey ] : color === "grey" , [ classes . colorError ] : color === "error" , [ classes . colorPrimary ] : color === "primary" , [ classes . colorDark ] : color === "dark" , [ classes . fullWidth ] : fullWidth , } , className ) ; return ( < div className = { rootClassName } { ... rest } > { children } < /div>); } ; Message . defaultProps = { color : "grey" , fullWidth : false , } ; const enhanced = withStyles ( styles ) ( Message ) ; export default enhanced ;