Password Input
A <input type="password"> with a client-side show/hide toggle powered by signals. The initial HTML is server-rendered; the toggle activates on the client.
Default
import { PasswordInput } from '@davaux/ui'
<PasswordInput label="Password" placeholder="Enter your password" />Description & error
Must be at least 8 characters
Passwords do not match
<PasswordInput
label="New password"
description="Must be at least 8 characters"
placeholder="Enter new password"
/>
<PasswordInput
label="Confirm password"
error="Passwords do not match"
placeholder="Repeat password"
/>Required & disabled
<PasswordInput label="Required" withAsterisk />
<PasswordInput label="Disabled" disabled value="secret123" />Props
| Prop | Type | Default | Description |
|---|---|---|---|
label | string | — | Field label rendered above the input |
description | string | — | Helper text below the label |
error | string|boolean | — | Error message or true for styles only |
value | string | — | Pre-filled value (SSR snapshot) |
placeholder | string | — | Placeholder text |
disabled | boolean | — | Disables the input and toggle button |
required | boolean | — | Marks the field required |
withAsterisk | boolean | — | Shows asterisk without native required |
size | 'xs'|'sm'|'md'|'lg'|'xl' | — | Font size and height via design tokens |
radius | 'xs'|'sm'|'md'|'lg'|'xl'|string | — | Corner radius via design tokens or CSS value |
name | string | — | Form field name |
id | string | — | Associates label with input |