import { FC } from "react"
import ErrorIcon from '@mui/icons-material/Error';
import { ValidateMessageNewProps } from "@/widgetLibrary/PublicSector/InvalidMessage/interface"
import { invalidateMessageCss } from "./style"

export const InvalidMessage: FC<ValidateMessageNewProps> = (props) => {
  const { validateMessage } = props

  return (
    <>
      {typeof validateMessage === "string" && validateMessage.length > 0 && (
        <span css={invalidateMessageCss}>
          <ErrorIcon fontSize="small" />
          {validateMessage}
        </span>
      )}
    </>
  )
}
