Password Input

GitHub

Password input with a toggle that shows or hides the entered value.

Installation

bash
pnpm dlx shadcn@latest add @cs/password-input

Usage

tsx
import { PasswordInput } from "@/components/cs/password-input";
tsx
<PasswordInput label="Password" name="password" autoComplete="current-password" />

API Reference

PasswordInput

Password input with a toggle that shows or hides the entered value.

Props

NameTypeDefaultDescription
errorstring | null | undefined-Validation error message for the field.
hideLabelstring"Passwort verbergen"Accessible label for the hide-password control.
iconReactNode<Lock />Icon displayed inside the input on the left.
inputClassNamestring | undefined-Additional classes applied to the native input control.
labelReactNode-Field label and fallback placeholder.
orientation"vertical" | "horizontal" | "responsive" | null | undefined-Layout of the field label and input control.
showLabelstring"Passwort anzeigen"Accessible label for the show-password control.