Preview
PasswordField contains a client-enhanced reveal control; presenting that control without hydration would make it inert. This server-rendered page does not imitate client behavior. Open the live playground.
Usage
PasswordField usage<PasswordField label="Password" name="password" />API
PasswordField APIPasswordFieldProps
The password input with a reveal toggle — every login form re-rolls this. JS-off it is exactly a native password Field (progressive; the toggle is island behavior — render inside a clientEntry). The suffix here is a CONTROL, not decoration: unlike Field's aria-hidden `prefix`/`suffix`, the reveal button is visible to assistive tech and speaks `aria-pressed` (RESOLVED-72's other half). Text over eye glyphs: "show"/"hide" in the machine register needs no legend.
| prop | type | notes |
|---|---|---|
| label | string | |
| name | string | |
| id? | string | Explicit control id (ErrorSummary anchor hook), like Field's. |
| error? | string | null | |
| hint? | string | |
| required? | boolean | |
| placeholder? | string | |
| autoComplete? | string | Default 'current-password'; use 'new-password' on signup forms. |
| labels? | { show: string; hide: string } | i18n: toggle strings. When set, each value is used as BOTH the visible text and the accessible name (the default English split — "show" text / "Show password" label — is a register choice, not a requirement). |
| mix? | MixInput |