import {
  FormControlError,
  FormControlErrorIcon,
  FormControlErrorText,
} from "../ui/form-control";
import { AlertCircleIcon } from "../ui/icon";

type props = { text: string };

export default function FormError({ text }: props) {
  return (
    <FormControlError className="mb-2 border-[1px] border-red-500 p-4 rounded-3xl bg-red-100 gap-2">
      <FormControlErrorIcon as={AlertCircleIcon} />
      <FormControlErrorText className="text-black font-bold">
        {text}
      </FormControlErrorText>
    </FormControlError>
  );
}