REACT-NATIVES
WIRED FOR SPEED
react-natives v2.2.0
Theme
Light
Dark
Get Started
Menu
Components
Form Controls
PasswordInput
A text input with a visibility toggle for password entry.
Example
Preview
Code
Props
PasswordInput Props
Prop
Type
Default
Description
className
string
—
NativeWind utility classes to apply to the password input container.
size
'sm' | 'md' | 'lg'
'md'
Controls the size of the input.
isDisabled
boolean
false
When true, disables the input.
PasswordInputField Props
Prop
Type
Default
Description
className
string
—
NativeWind utility classes for the password text field.
placeholder
string
—
Placeholder text for the input field.
PasswordInputToggle Props
Prop
Type
Default
Description
className
string
—
NativeWind utility classes for the visibility toggle button.
Usage Guidelines
When to use
Use PasswordInput for password fields where users need the option to reveal what they typed.
Best practices
•
Always include PasswordInputToggle for usability on mobile devices.
•
Wrap with FormControl for label and validation messaging.
•
Use secureTextEntry internally — do not rely solely on masking characters.
Accessibility
PasswordInputToggle announces whether the password is visible or hidden. The field uses secureTextEntry for privacy.
Related Components
Input
A compound text input component with support for leading/trailing slots, icons, and multiple visual variants.
FormControl
A compound wrapper that provides shared state (disabled, invalid, required, read-only) to its label, helper text, and error message children.
React-Natives
A comprehensive React Native component library.
Documentation
Getting Started
Components
Theming
Community
GitHub
Discord
Twitter
Blog
Support
FAQ
Contact
Contributing
License
© 2026 React-Natives. Wired by WireServers-UI.