import PropTypes from "prop-types";
import { motion } from "motion/react";

function FieldError({ text }) {
  return (
    <motion.div
      className="text-sm text-error ml-3 pt-1"
      initial={{ y: 15, opacity: 0 }}
      animate={{ y: 0, opacity: 1 }}
      exit={{ y: 15, opacity: 0 }}
    >
      {text}
    </motion.div>
  );
}

FieldError.propTypes = {
  text: PropTypes.string.isRequired,
};

export default FieldError;