diff --git a/src/components/ValidatedTextInput/ValidatedPasswordInput.tsx b/src/components/ValidatedTextInput/ValidatedPasswordInput.tsx index 5eae84f..cc381ec 100644 --- a/src/components/ValidatedTextInput/ValidatedPasswordInput.tsx +++ b/src/components/ValidatedTextInput/ValidatedPasswordInput.tsx @@ -8,12 +8,16 @@ import { TextInputProps, } from '@patternfly/react-core'; import { EyeIcon, EyeSlashIcon } from '@patternfly/react-icons'; -import { IValidatedFormField, getFormGroupProps, getTextInputProps } from '../..'; +import { IValidatedFormField, getFormGroupProps, getTextInputProps, TextFieldOptions } from '../..'; interface IValidatedPasswordInputProps extends Pick { /** A field returned from useFormField() or useFormState().fields. */ field: IValidatedFormField | IValidatedFormField; + /** Whether to show the green 'valid' style when the field has been validated. Defaults to false ('default' style) */ + greenWhenValid?: boolean; + /** Extra callback to call onBlur in addition to setting the field isTouched in state */ + onBlur?: () => void; /** Any extra props for the PatternFly FormGroup */ formGroupProps?: Partial; /** Any extra props for the PatternFly TextInput */ @@ -27,25 +31,28 @@ export const ValidatedPasswordInput: React.FunctionComponent { const [isValueVisible, toggleValueVisible] = React.useReducer((isVisible) => !isVisible, false); + const options: TextFieldOptions = { greenWhenValid, onBlur }; return ( )} + {...getFormGroupProps(field as IValidatedFormField, options)} {...formGroupProps} > )} />