import styles from '../styles/input2.module.scss'
import { AiFillEye, AiFillEyeInvisible } from "react-icons/ai";
import { useState } from 'react';


export default function Input2(props) {
  const [type, setType] = useState(props.type||'text')
  return (
    <span className={styles.container}>
      <input className={styles.input} {...props} type={type} />
      {props.type == "password" &&
        (type != "password" ? (
          <AiFillEye
            onClick={() => {
              setType("password");
            }}
            className={styles["password-toggler"]}
          />
        ) : (
          <AiFillEyeInvisible
            onClick={() => {
              setType("text");
            }}
            className={styles["password-toggler"]}
          />
        ))}
    </span>
  );
}