Untitled

 avatar
unknown
plain_text
2 years ago
888 B
3
Indexable
import { useState } from "react";
import { FaRegEye, FaRegEyeSlash } from "react-icons/fa";

export default function PasswordFild({ password, handleChange }) {

    const [passwordType, setPasswordType] = useState(false)
    const handlePasswordShow = async (e) => {
        setPasswordType(!passwordType)
    };
    return (
        <div className="flex">
            <input
                type={passwordType ? "text" : "password"}
                className="w-full rounded-lg border-gray-200 p-4 pe-12 text-sm shadow-sm "
                placeholder="Enter password"
                name="password"
                value={password}
                onChange={handleChange}

            />
            <p className=" cursor-pointer -ml-8 mt-5" onClick={() =>
                handlePasswordShow()
            }>{passwordType ? <FaRegEyeSlash /> : <FaRegEye />}</p>
        </div>
    )
}
Editor is loading...
Leave a Comment