Re-added password input

src/components/ui/password-input.tsx

@@ -0,0 +1,40 @@
+"use client";
+
+import * as React from "react";
+import { Eye, EyeOff } from "lucide-react";
+import { Input } from "@/components/ui/input";
+import { cn } from "@/lib/utils";
+
+interface PasswordInputProps
+    extends React.InputHTMLAttributes<HTMLInputElement> {}
+
+export const PasswordInput = React.forwardRef<HTMLInputElement, PasswordInputProps>(
+    ({ className, ...props }, ref) => {
+        const [showPassword, setShowPassword] = React.useState(false);
+
+        return (
+            <div className="relative w-full">
+                <Input
+                    ref={ref}
+                    type={showPassword ? "text" : "password"}
+                    className={cn("h-11 text-base pr-12", className)} // extra padding-right
+                    {...props}
+                />
+                <button
+                    type="button"
+                    onClick={() => setShowPassword((prev) => !prev)}
+                    className="absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground transition"
+                    aria-label={showPassword ? "Hide password" : "Show password"}
+                >
+                    {showPassword ? (
+                        <EyeOff className="h-5 w-5" />
+                    ) : (
+                        <Eye className="h-5 w-5" />
+                    )}
+                </button>
+            </div>
+        );
+    }
+);
+
+PasswordInput.displayName = "PasswordInput";