27 lines
852 B
TypeScript
27 lines
852 B
TypeScript
import { useState } from "react";
|
|
import { Eye, EyeOff } from "lucide-react";
|
|
import { Input } from "@/components/ui/input";
|
|
|
|
interface Props extends React.InputHTMLAttributes<HTMLInputElement> {}
|
|
|
|
const InputPassword = ({ ...props }: Props) => {
|
|
const [showPassword, setShowPassword] = useState(false);
|
|
|
|
return (
|
|
<div className="relative w-full">
|
|
<Input
|
|
type={showPassword ? "text" : "password"}
|
|
{...props}
|
|
/>
|
|
<button
|
|
type="button"
|
|
className="absolute inset-y-0 right-3 flex items-center text-gray-500"
|
|
onClick={() => setShowPassword((prev) => !prev)}
|
|
>
|
|
{showPassword ? <EyeOff size={20} /> : <Eye size={20} />}
|
|
</button>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default InputPassword; |