Form Password
Form password component. Show or hide password value.
Form Password, Personalization Blocks
Example:
// AppServiceProvider, "boot" method. TallStackUi::customize() ->form('password') ->block('block', 'classes');
WARNING!
You are browsing the docs for an old version of TallStackUI. Consider upgrade your project to TallStackUI v3.
Expected Password Format:
At least 8 characters
At least one symbol (!@#$%^&*()_+-=)
At least one number
Uppercase and lowercase letters
<x-password value="TallStackUi" />
Expected Password Format:
At least 8 characters
At least one symbol (!@#$%^&*()_+-=)
At least one number
Uppercase and lowercase letters
<x-password label="Password" hint="Insert your best password" value="TallStackUi" />
An option to display an asterisk indicating that the field is required.
Expected Password Format:
At least 8 characters
At least one symbol (!@#$%^&*()_+-=)
At least one number
Uppercase and lowercase letters
<x-password label="Password *" hint="Insert your password" value="TallStackUi" />
An option to control the caps lock indicator.
Expected Password Format:
At least 8 characters
At least one symbol (!@#$%^&*()_+-=)
At least one number
Uppercase and lowercase letters
<x-password hint="Activate caps lock to see the indicator." /> <!-- To disable and do not show the indicator use `mixed-case` --><x-password hint="Activate caps lock to see the indicator." mixed-case />
The caps lock indicator does not work on mobile devices.
An option to visually validate the format of the entered password.
Expected Password Format:
At least 8 characters
At least one symbol (!@#)
At least one number
Uppercase and lowercase letters
<!-- Allowed: min, symbols, numbers, mixed --> <!-- You can set min to `min:8` oromit the number to use the default --> <!-- You can define symbols like `symbols:!@#`or omit symbols to use the defaults --> <x-password :rules="['min:8', 'symbols:!@#', 'numbers', 'mixed']" />
- If you do not specify the min size then the default size will be 8
- If you do not specify the symbols then the default symbols will be !@#$%^&*()_+-=
Expected Password Format:
At least 8 characters
At least one symbol (!@#$%^&*()_+-=)
At least one number
Uppercase and lowercase letters
<x-password generator :rules="['min:8', 'symbols', 'numbers', 'mixed']" />
- The generator requires the rules attributes.
- The generated password will match the rules passed to the component.
Expected Password Format:
At least 8 characters
At least one symbol (!@#$%^&*()_+-=)
At least one number
Uppercase and lowercase letters
<x-password value="TallStackUI" generator :rules="['min:8', 'symbols', 'numbers', 'mixed']" x-on:reveal="alert(`Password Revealed: ${$event.detail.status}`)" x-on:generate="alert(`Password Generated: ${$event.detail.password}`)" />
An option to not show validation error message
Expected Password Format:
At least 8 characters
At least one symbol (!@#$%^&*()_+-=)
At least one number
Uppercase and lowercase letters
<x-password label="Password" hint="Insert your best password" value="TallStackUi" invalidate />