Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-13 16:23:06 +10:00
Code Issues Packages Projects Releases Wiki Activity

refactor: password input component

Browse Source
This commit is contained in:
nafees nazik
2023-12-02 17:46:16 +05:30
parent ab0d38eaf4
commit 4733f1e84b
1 changed files with 1 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
packages/ui/primitives/input.tsx
View File

@ -1,9 +1,6 @@
import * as React from 'react'; import * as React from 'react';
import { Eye, EyeOff } from 'lucide-react';
import { cn } from '../lib/utils'; import { cn } from '../lib/utils';
import { Button } from './button';
export type InputProps = React.InputHTMLAttributes<HTMLInputElement>; export type InputProps = React.InputHTMLAttributes<HTMLInputElement>;
@ -28,38 +25,4 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
Input.displayName = 'Input'; Input.displayName = 'Input';
const PasswordInput = React.forwardRef<HTMLInputElement, InputProps>( export { Input };
({ className, ...props }, ref) => {
const [showPassword, setShowPassword] = React.useState(false);
return (
<div className="relative">
<Input
id="password"
type={showPassword ? 'text' : 'password'}
className={cn('pr-10', className)}
ref={ref}
{...props}
/>
<Button
variant="link"
type="button"
className="absolute right-0 top-0 flex h-full items-center justify-center pr-3"
aria-label={showPassword ? 'Mask password' : 'Reveal password'}
onClick={() => setShowPassword((show) => !show)}
>
{showPassword ? (
<EyeOff aria-hidden className="text-muted-foreground h-5 w-5" />
) : (
<Eye aria-hidden className="text-muted-foreground h-5 w-5" />
)}
</Button>
</div>
);
},
);
PasswordInput.displayName = 'Input';
export { Input, PasswordInput };