Forms v1.0.0

Password Input

A password input with visibility toggle, strength meter, and requirements checklist. Features an eye icon to toggle between hidden and visible password text, an optional color-coded strength bar, and a requirements checklist that updates in real-time.

Preview & Code

Options

Name Type Default Description
form FormBuilder nil Rails form builder object (for form builder mode)
attribute Symbol nil Model attribute name (for form builder mode)
name String nil Input name attribute (for standalone mode)
value String nil Input value (for standalone mode)
label String nil Label text displayed above the input
placeholder String "Enter password" Placeholder text
required Boolean false Whether the field is required
disabled Boolean false Whether the field is disabled
size Symbol :md Input size: :sm, :md, or :lg
error String nil Error message displayed below the input
strength_meter Boolean false Show password strength meter below the input
show_requirements Boolean false Show password requirements checklist

Changelog v1.0.0

- v1.0.0: Initial release with visibility toggle, strength meter, and requirements checklist
- Eye icon toggle between password and text input types
- Strength meter with 4 levels: weak (red), fair (amber), good (blue), strong (emerald)
- Requirements checklist: length, uppercase, lowercase, number, special character
- Form builder and standalone modes
- Three sizes: sm, md, lg
- Dark mode support

Get Full Access

Unlock the source code for this component and all others. One-time payment for lifetime access.

Get Access Now