Skip to main content
Version: v8

ion-input-password-toggle

shadow

The InputPasswordToggle component is a companion component to Input. It allows users to toggle the visibility of text in a password input.

Basic Usage​

info

InputPasswordToggle must be used with an Input that has its type property set to either 'text' or 'password'.

Using any other type will cause a warning to be logged.

Properties​

color​

DescriptionThe color to use from your application's color palette. Default options are: "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark". For more information on colors, see theming.
Attributecolor
Type"danger" īŊœ "dark" īŊœ "light" īŊœ "medium" īŊœ "primary" īŊœ "secondary" īŊœ "success" īŊœ "tertiary" īŊœ "warning" īŊœ string īŊœ undefined
Defaultundefined

hideIcon​

DescriptionThe icon that can be used to represent hiding a password. If not set, the "eyeOff" Ionicon will be used.
Attributehide-icon
Typestring īŊœ undefined
Defaultundefined

mode​

DescriptionThe mode determines which platform styles to use.
Attributemode
Type"ios" īŊœ "md"
Defaultundefined

showIcon​

DescriptionThe icon that can be used to represent showing a password. If not set, the "eye" Ionicon will be used.
Attributeshow-icon
Typestring īŊœ undefined
Defaultundefined

Events​

No events available for this component.

Methods​

No public methods available for this component.

CSS Shadow Parts​

No CSS shadow parts available for this component.

CSS Custom Properties​

No CSS custom properties available for this component.

Slots​

No slots available for this component.