PasswordInput
Markdown for agentsPassword field with an accessible show/hide toggle (aria-pressed), built on Input.
npx slipstream-ui@latest add password-inputSign-in field
At least 12 characters
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| showLabel | string | 'Show password' | Accessible label while hidden. |
| hideLabel | string | 'Hide password' | Accessible label while visible. |
| …InputProps | InputProps | — | All Input props pass through (value, onChange, autoComplete…). |
Accessibility
- The toggle is a real button with aria-pressed and Show/Hide labels.
- Revealing never moves focus away from the field.
Browser support
| Browser | Tested versions |
|---|---|
| Chrome | 111+ (Mar 2023) |
| Edge | 111+ (Mar 2023) |
| Firefox | 121+ (Dec 2023) |
| Safari | 17.2+ — macOS & iOS (Dec 2023) |
Slipstream components rely only on CSS custom properties, Flexbox/Grid, and ARIA — the everyday baseline of the last two years of evergreen releases. Anything newer is progressive enhancement: unsupported browsers keep full functionality with static behavior instead of animations.