<PasswordChange />

Change your password preset with password strength validation

The <PasswordChange /> component requires password confirmation to continue. It's "previous" value is somewhat blind, so that validation should live server-side. The client only protects against mistyping in the new password.

To help user set a password, the preset also provides the following validation:

1. New passwords must be at least 8 characters;

2. New passwords must contain at least 1 lowercase and 1 uppercase character;

3. New passwords must contain at least 1 special character;

4. New passwords must contain at least 1 number.

API

Prop	Type	Description
onSubmit	Function	Submit handler to receive the previous, new, and confirmed password values. If not provided, the component will post to the default Q3 verification route.

Example

import React from 'react';
import { PasswordChange } from 'q3-ui-forms/lib/presets';

const submitHandler = ({ previous, newPassword, confirmNewPassword }) => {
    // noop
};

const PasswordChangeExample = () => (
    <PasswordChange onSubmit={submitHandler} />
);