@aws-amplify/ui-react-native 2.4.5 → 2.5.0

package/dist/Authenticator/Authenticator.d.ts

@@ -176,5 +176,38 @@ declare namespace Authenticator {
         Header: typeof import("./common").DefaultHeader;
         displayName: string;
     };
+    var SetupEmail: {
+        ({ fields, handleBlur, handleChange, handleSubmit, isPending, toSignIn, validationErrors, ...rest }: import("@aws-amplify/ui-react-core/dist/types/Authenticator/hooks").ComponentSlots<import("./hooks").TextFieldOptionsType> & {
+            toSignIn: (data?: import("@aws-amplify/ui").AuthEventData | undefined) => void;
+        } & import("@aws-amplify/ui-react-core/dist/types/Authenticator/hooks").CommonRouteProps & import("@aws-amplify/ui-react-core/dist/types/Authenticator/hooks").ValidationProps & {
+            fields: import("./hooks").TextFieldOptionsType[];
+        } & {
+            style?: import("./Defaults/types").SetupEmailStyle | undefined;
+        }): React.JSX.Element;
+        Footer: typeof import("./common").DefaultFooter;
+        FormFields: {
+            ({ fieldContainerStyle, fieldErrorsContainer, fieldErrorStyle, fieldStyle, fields, isPending, style, validationErrors, }: import("./common/DefaultFormFields/types").DefaultTextFormFieldsProps): React.JSX.Element;
+            displayName: string;
+        };
+        Header: typeof import("./common").DefaultHeader;
+        displayName: string;
+    };
+    var SelectMfaType: {
+        ({ challengeName, fields, handleBlur, handleChange, handleSubmit, isPending, toSignIn, validationErrors, ...rest }: import("@aws-amplify/ui-react-core/dist/types/Authenticator/hooks").ComponentSlots<import("./hooks").RadioFieldOptions> & {
+            challengeName: import("@aws-amplify/ui").ChallengeName | undefined;
+            toSignIn: (data?: import("@aws-amplify/ui").AuthEventData | undefined) => void;
+        } & import("@aws-amplify/ui-react-core/dist/types/Authenticator/hooks").CommonRouteProps & import("@aws-amplify/ui-react-core/dist/types/Authenticator/hooks").ValidationProps & {
+            fields: import("./hooks").RadioFieldOptions[];
+        } & {
+            style?: import("./Defaults/types").SelectMfaTypeStyle | undefined;
+        }): React.JSX.Element;
+        Footer: typeof import("./common").DefaultFooter;
+        FormFields: {
+            ({ fields, fieldContainerStyle, fieldLabelStyle, isPending, style, }: import("./common/DefaultFormFields/types").DefaultRadioFormFieldsProps): React.JSX.Element;
+            displayName: string;
+        };
+        Header: typeof import("./common").DefaultHeader;
+        displayName: string;
+    };
 }
 export default Authenticator;

package/dist/Authenticator/Authenticator.js

@@ -5,7 +5,7 @@ import { useDeprecationWarning } from '../hooks';
 import { DefaultContainer, InnerContainer } from './common';
 import { getRouteTypedFields } from './hooks';
 import { VERSION } from '../version';
-import { ConfirmResetPassword, ConfirmSignIn, ConfirmSignUp, ConfirmVerifyUser, ForceNewPassword, ForgotPassword, SetupTotp, SignIn, SignUp, VerifyUser, } from './Defaults';
+import { ConfirmResetPassword, ConfirmSignIn, ConfirmSignUp, ConfirmVerifyUser, ForceNewPassword, ForgotPassword, SetupTotp, SignIn, SignUp, VerifyUser, SetupEmail, SelectMfaType, } from './Defaults';
 const DEFAULTS = {
     ConfirmResetPassword,
     ConfirmSignIn,
@@ -17,6 +17,8 @@ const DEFAULTS = {
     SignIn,
     SignUp,
     VerifyUser,
+    SetupEmail,
+    SelectMfaType,
 };
 const routePropSelector = ({ route, }) => [
     route,
@@ -69,4 +71,6 @@ Authenticator.SetupTotp = SetupTotp;
 Authenticator.SignIn = SignIn;
 Authenticator.SignUp = SignUp;
 Authenticator.VerifyUser = VerifyUser;
+Authenticator.SetupEmail = SetupEmail;
+Authenticator.SelectMfaType = SelectMfaType;
 export default Authenticator;

package/dist/Authenticator/Defaults/SelectMfaType/SelectMfaType.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { DefaultFooter, DefaultHeader } from '../../common';
+import { DefaultSelectMfaTypeProps } from '../types';
+declare const SelectMfaType: {
+    ({ challengeName, fields, handleBlur, handleChange, handleSubmit, isPending, toSignIn, validationErrors, ...rest }: DefaultSelectMfaTypeProps): React.JSX.Element;
+    Footer: typeof DefaultFooter;
+    FormFields: {
+        ({ fields, fieldContainerStyle, fieldLabelStyle, isPending, style, }: import("../../common/DefaultFormFields/types").DefaultRadioFormFieldsProps): React.JSX.Element;
+        displayName: string;
+    };
+    Header: typeof DefaultHeader;
+    displayName: string;
+};
+export default SelectMfaType;

package/dist/Authenticator/Defaults/SelectMfaType/SelectMfaType.js

@@ -0,0 +1,39 @@
+import React, { useMemo } from 'react';
+import { authenticatorTextUtil } from '@aws-amplify/ui';
+import { DefaultContent, DefaultFooter, DefaultHeader, DefaultSelectMfaTypeFormFields, } from '../../common';
+import { useFieldValues } from '../../hooks';
+const COMPONENT_NAME = 'SelectMfaType';
+const { getSelectMfaTypeByChallengeName, getBackToSignInText, getConfirmText, getConfirmingText, } = authenticatorTextUtil;
+const SelectMfaType = ({ challengeName, fields, handleBlur, handleChange, handleSubmit, isPending, toSignIn, validationErrors, ...rest }) => {
+    const { disableFormSubmit: disabled, fields: fieldsWithHandlers, fieldValidationErrors, handleFormSubmit, } = useFieldValues({
+        componentName: COMPONENT_NAME,
+        fields,
+        handleBlur,
+        handleChange,
+        handleSubmit,
+        validationErrors,
+    });
+    const headerText = getSelectMfaTypeByChallengeName(challengeName);
+    const primaryButtonText = isPending ? getConfirmingText() : getConfirmText();
+    const secondaryButtonText = getBackToSignInText();
+    const buttons = useMemo(() => ({
+        primary: {
+            children: primaryButtonText,
+            disabled,
+            onPress: handleFormSubmit,
+        },
+        links: [{ children: secondaryButtonText, onPress: toSignIn }],
+    }), [
+        disabled,
+        handleFormSubmit,
+        primaryButtonText,
+        secondaryButtonText,
+        toSignIn,
+    ]);
+    return (<DefaultContent {...rest} buttons={buttons} headerText={headerText} fields={fieldsWithHandlers} isPending={isPending} validationErrors={fieldValidationErrors}/>);
+};
+SelectMfaType.Footer = DefaultFooter;
+SelectMfaType.FormFields = DefaultSelectMfaTypeFormFields;
+SelectMfaType.Header = DefaultHeader;
+SelectMfaType.displayName = COMPONENT_NAME;
+export default SelectMfaType;

package/dist/Authenticator/Defaults/SelectMfaType/index.d.ts

@@ -0,0 +1 @@
+export { default as SelectMfaType } from './SelectMfaType';

package/dist/Authenticator/Defaults/SelectMfaType/index.js

@@ -0,0 +1 @@
+export { default as SelectMfaType } from './SelectMfaType';

package/dist/Authenticator/Defaults/SetupEmail/SetupEmail.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { DefaultFooter, DefaultHeader } from '../../common';
+import { DefaultSetupEmailProps } from '../types';
+declare const SetupEmail: {
+    ({ fields, handleBlur, handleChange, handleSubmit, isPending, toSignIn, validationErrors, ...rest }: DefaultSetupEmailProps): React.JSX.Element;
+    Footer: typeof DefaultFooter;
+    FormFields: {
+        ({ fieldContainerStyle, fieldErrorsContainer, fieldErrorStyle, fieldStyle, fields, isPending, style, validationErrors, }: import("../../common/DefaultFormFields/types").DefaultTextFormFieldsProps): React.JSX.Element;
+        displayName: string;
+    };
+    Header: typeof DefaultHeader;
+    displayName: string;
+};
+export default SetupEmail;

package/dist/Authenticator/Defaults/SetupEmail/SetupEmail.js

@@ -0,0 +1,39 @@
+import React, { useMemo } from 'react';
+import { authenticatorTextUtil } from '@aws-amplify/ui';
+import { DefaultContent, DefaultFooter, DefaultTextFormFields, DefaultHeader, } from '../../common';
+import { useFieldValues } from '../../hooks';
+const COMPONENT_NAME = 'SetupEmail';
+const { getBackToSignInText, getConfirmText, getConfirmingText, getSetupEmailText, } = authenticatorTextUtil;
+const SetupEmail = ({ fields, handleBlur, handleChange, handleSubmit, isPending, toSignIn, validationErrors, ...rest }) => {
+    const { disableFormSubmit: disabled, fields: fieldsWithHandlers, fieldValidationErrors, handleFormSubmit, } = useFieldValues({
+        componentName: COMPONENT_NAME,
+        fields,
+        handleBlur,
+        handleChange,
+        handleSubmit,
+        validationErrors,
+    });
+    const headerText = getSetupEmailText();
+    const primaryButtonText = isPending ? getConfirmingText() : getConfirmText();
+    const secondaryButtonText = getBackToSignInText();
+    const buttons = useMemo(() => ({
+        primary: {
+            children: primaryButtonText,
+            disabled,
+            onPress: handleFormSubmit,
+        },
+        links: [{ children: secondaryButtonText, onPress: toSignIn }],
+    }), [
+        disabled,
+        handleFormSubmit,
+        primaryButtonText,
+        secondaryButtonText,
+        toSignIn,
+    ]);
+    return (<DefaultContent {...rest} buttons={buttons} headerText={headerText} fields={fieldsWithHandlers} isPending={isPending} validationErrors={fieldValidationErrors}/>);
+};
+SetupEmail.Footer = DefaultFooter;
+SetupEmail.FormFields = DefaultTextFormFields;
+SetupEmail.Header = DefaultHeader;
+SetupEmail.displayName = COMPONENT_NAME;
+export default SetupEmail;

package/dist/Authenticator/Defaults/SetupEmail/index.d.ts

@@ -0,0 +1 @@
+export { default as SetupEmail } from './SetupEmail';

package/dist/Authenticator/Defaults/SetupEmail/index.js

@@ -0,0 +1 @@
+export { default as SetupEmail } from './SetupEmail';

package/dist/Authenticator/Defaults/VerifyUser/VerifyUser.js

@@ -1,6 +1,6 @@
 import React, { useMemo } from 'react';
 import { authenticatorTextUtil } from '@aws-amplify/ui';
-import { DefaultContent, DefaultFooter, DefaultHeader, DefaultRadioFormFields, } from '../../common';
+import { DefaultContent, DefaultFooter, DefaultHeader, DefaultVerifyUserFormFields, } from '../../common';
 import { useFieldValues } from '../../hooks';
 const COMPONENT_NAME = 'VerifyUser';
 const { getSkipText, getVerifyContactText, getVerifyText, getAccountRecoveryInfoText, } = authenticatorTextUtil;
@@ -24,7 +24,7 @@ const VerifyUser = ({ fields, handleBlur, handleChange, handleSubmit, skipVerifi
     return (<DefaultContent {...rest} body={bodyText} buttons={buttons} fields={fieldsWithHandlers} headerText={headerText} validationErrors={fieldValidationErrors}/>);
 };
 VerifyUser.Footer = DefaultFooter;
-VerifyUser.FormFields = DefaultRadioFormFields;
+VerifyUser.FormFields = DefaultVerifyUserFormFields;
 VerifyUser.Header = DefaultHeader;
 VerifyUser.displayName = COMPONENT_NAME;
 export default VerifyUser;

package/dist/Authenticator/Defaults/index.d.ts

@@ -8,4 +8,6 @@ export { SetupTotp } from './SetupTotp';
 export { SignIn } from './SignIn';
 export { SignUp } from './SignUp';
 export { VerifyUser } from './VerifyUser';
-export { Components, DefaultComponents, ConfirmResetPasswordProps, ConfirmSignInProps, ConfirmSignUpProps, ConfirmVerifyUserProps, ForceNewPasswordProps, ForgotPasswordProps, SetupTotpProps, SignInProps, SignUpProps, VerifyUserProps, } from './types';
+export { SelectMfaType } from './SelectMfaType';
+export { SetupEmail } from './SetupEmail';
+export { Components, DefaultComponents, ConfirmResetPasswordProps, ConfirmSignInProps, ConfirmSignUpProps, ConfirmVerifyUserProps, ForceNewPasswordProps, ForgotPasswordProps, SelectMfaTypeProps, SetupEmailProps, SetupTotpProps, SignInProps, SignUpProps, VerifyUserProps, } from './types';

package/dist/Authenticator/Defaults/index.js

@@ -8,3 +8,5 @@ export { SetupTotp } from './SetupTotp';
 export { SignIn } from './SignIn';
 export { SignUp } from './SignUp';
 export { VerifyUser } from './VerifyUser';
+export { SelectMfaType } from './SelectMfaType';
+export { SetupEmail } from './SetupEmail';

package/dist/Authenticator/Defaults/types.d.ts

@@ -20,6 +20,10 @@ export interface SignUpStyle {
 }
 export interface VerifyUserStyle {
 }
+export interface SetupEmailStyle {
+}
+export interface SelectMfaTypeStyle {
+}
 export type DefaultComponents<FieldType = {}, Props = {}> = AuthenticatorComponentDefaults<FieldType, Props>;
 export type DefaultConfirmResetPasswordProps = React.ComponentPropsWithoutRef<DefaultComponents<TextFieldOptionsType, {
     style?: ConfirmResetPasswordStyle;
@@ -51,6 +55,12 @@ export type DefaultSignUpProps = React.ComponentPropsWithoutRef<DefaultComponent
 export type DefaultVerifyUserProps = React.ComponentPropsWithoutRef<DefaultComponents<RadioFieldOptions, {
     style?: VerifyUserStyle;
 }>['VerifyUser']>;
+export type DefaultSetupEmailProps = React.ComponentPropsWithoutRef<DefaultComponents<TextFieldOptionsType, {
+    style?: SetupEmailStyle;
+}>['SetupEmail']>;
+export type DefaultSelectMfaTypeProps = React.ComponentPropsWithoutRef<DefaultComponents<RadioFieldOptions, {
+    style?: SelectMfaTypeStyle;
+}>['SelectMfaType']>;
 /**
  * Custom Authenticator components
  */
@@ -85,6 +95,12 @@ type SignUpComponent<P = {}> = OverrideComponents<TextFieldOptionsType, {
 type VerifyUserComponent<P = {}> = OverrideComponents<RadioFieldOptions, {
     style?: VerifyUserStyle;
 } & P>['VerifyUser'];
+type SetupEmailComponent<P = {}> = OverrideComponents<TextFieldOptionsType, {
+    style?: SetupEmailStyle;
+} & P>['SetupEmail'];
+type SelectMfaTypeComponent<P = {}> = OverrideComponents<RadioFieldOptions, {
+    style?: SelectMfaTypeStyle;
+} & P>['SelectMfaType'];
 /**
  * Override `Authenticator` components param
  */
@@ -95,6 +111,8 @@ export interface Components {
     ConfirmVerifyUser?: ConfirmVerifyUserComponent;
     ForceNewPassword?: ForceNewPasswordComponent;
     ForgotPassword?: ForgotPasswordComponent;
+    SelectMfaType?: SelectMfaTypeComponent;
+    SetupEmail?: SetupEmailComponent;
     SetupTotp?: SetupTotpComponent;
     SignIn?: SignInComponent;
     SignUp?: SignUpComponent;
@@ -112,6 +130,10 @@ export interface ForceNewPasswordProps extends DefaultForceNewPasswordProps {
 }
 export interface ForgotPasswordProps extends DefaultForgotPasswordProps {
 }
+export interface SelectMfaTypeProps extends DefaultSelectMfaTypeProps {
+}
+export interface SetupEmailProps extends DefaultSetupEmailProps {
+}
 export interface SetupTotpProps extends DefaultSetupTotpProps {
 }
 export interface SignInProps extends DefaultSignInProps {

package/dist/Authenticator/common/DefaultFormFields/DefaultSelectMfaTypeFormFields.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { DefaultRadioFormFieldsProps } from './types';
+declare const DefaultSelectMfaTypeFormFields: {
+    ({ fields, fieldContainerStyle, fieldLabelStyle, isPending, style, }: DefaultRadioFormFieldsProps): React.JSX.Element;
+    displayName: string;
+};
+export default DefaultSelectMfaTypeFormFields;

package/dist/Authenticator/common/DefaultFormFields/DefaultSelectMfaTypeFormFields.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { RadioGroup } from '../../../primitives/RadioGroup';
+import { Radio } from '../../../primitives/Radio';
+const DefaultSelectMfaTypeFormFields = ({ fields = [], fieldContainerStyle, fieldLabelStyle, isPending, style, }) => {
+    // set initial value for radio field based on selected bool
+    const initialValue = fields.find((field) => !!field.selected)?.value;
+    return (<RadioGroup disabled={isPending} style={style} initialValue={initialValue}>
+      {fields.map(({ value, label, ...props }) => (<Radio {...props} key={value} value={value} label={label} labelStyle={fieldLabelStyle} style={fieldContainerStyle}/>))}
+    </RadioGroup>);
+};
+DefaultSelectMfaTypeFormFields.displayName = 'FormFields';
+export default DefaultSelectMfaTypeFormFields;

package/dist/Authenticator/common/DefaultFormFields/{DefaultRadioFormFields.d.ts → DefaultVerifyUserFormFields.d.ts}

@@ -1,7 +1,7 @@
 import React from 'react';
 import { DefaultRadioFormFieldsProps } from './types';
-declare const DefaultRadioFormFields: {
+declare const DefaultVerifyUserFormFields: {
     ({ fields, fieldContainerStyle, fieldLabelStyle, isPending, style, }: DefaultRadioFormFieldsProps): React.JSX.Element;
     displayName: string;
 };
-export default DefaultRadioFormFields;
+export default DefaultVerifyUserFormFields;

package/dist/Authenticator/common/DefaultFormFields/{DefaultRadioFormFields.js → DefaultVerifyUserFormFields.js}

@@ -5,9 +5,11 @@ const attributeMap = {
     email: 'Email',
     phone_number: 'Phone Number',
 };
-const DefaultRadioFormFields = ({ fields, fieldContainerStyle, fieldLabelStyle, isPending, style, }) => {
-    return (<RadioGroup disabled={isPending} style={style}>
-      {(fields ?? []).map(({ name, value, ...props }) => {
+const DefaultVerifyUserFormFields = ({ fields = [], fieldContainerStyle, fieldLabelStyle, isPending, style, }) => {
+    // set initial value for radio field based on selected bool
+    const initialValue = fields.find((field) => !!field.selected)?.name;
+    return (<RadioGroup disabled={isPending} style={style} initialValue={initialValue}>
+      {fields.map(({ name, value, ...props }) => {
             const attributeType = attributeMap[name];
             return (<Radio {...props} key={value} 
             // value has to be name, because Auth is only interested in the
@@ -16,5 +18,5 @@ const DefaultRadioFormFields = ({ fields, fieldContainerStyle, fieldLabelStyle,
         })}
     </RadioGroup>);
 };
-DefaultRadioFormFields.displayName = 'FormFields';
-export default DefaultRadioFormFields;
+DefaultVerifyUserFormFields.displayName = 'FormFields';
+export default DefaultVerifyUserFormFields;

package/dist/Authenticator/common/DefaultFormFields/index.d.ts

@@ -1,3 +1,4 @@
-export { default as DefaultRadioFormFields } from './DefaultRadioFormFields';
 export { default as DefaultTextFormFields } from './DefaultTextFormFields';
+export { default as DefaultVerifyUserFormFields } from './DefaultVerifyUserFormFields';
+export { default as DefaultSelectMfaTypeFormFields } from './DefaultSelectMfaTypeFormFields';
 export { DefaultFormFieldsComponent, DefaultFormFieldsStyle } from './types';

package/dist/Authenticator/common/DefaultFormFields/index.js

@@ -1,2 +1,3 @@
-export { default as DefaultRadioFormFields } from './DefaultRadioFormFields';
 export { default as DefaultTextFormFields } from './DefaultTextFormFields';
+export { default as DefaultVerifyUserFormFields } from './DefaultVerifyUserFormFields';
+export { default as DefaultSelectMfaTypeFormFields } from './DefaultSelectMfaTypeFormFields';

package/dist/Authenticator/hooks/useFieldValues/useFieldValues.js

@@ -1,31 +1,70 @@
 import { useMemo, useState } from 'react';
 import { ConsoleLogger as Logger } from 'aws-amplify/utils';
-import { getSanitizedTextFields, getSanitizedRadioFields, isRadioFieldOptions, runFieldValidation, } from './utils';
+import { getSanitizedTextFields, isRadioFieldOptions, runFieldValidation, getSanitizedVerifyUserFields, getSanitizedSelectMfaTypeFields, } from './utils';
 const logger = new Logger('Authenticator');
 export default function useFieldValues({ componentName, fields = [], handleBlur, handleChange, handleSubmit, validationErrors, }) {
-    const [values, setValues] = useState({});
     const [touched, setTouched] = useState({});
     const [fieldValidationErrors, setFieldValidationErrors] = useState({});
-    const isRadioFieldComponent = componentName === 'VerifyUser';
+    const isVerifyUserRoute = componentName === 'VerifyUser';
+    const isSelectMfaTypeRoute = componentName === 'SelectMfaType';
+    const isRadioFieldComponent = isVerifyUserRoute || isSelectMfaTypeRoute;
+    // initialize values based on route
+    // select mfa type screen should auto select first radio option
+    const [values, setValues] = useState(() => {
+        const result = {};
+        if (isSelectMfaTypeRoute) {
+            const initialValue = fields[0]?.value;
+            if (initialValue) {
+                result.mfa_type = initialValue;
+            }
+        }
+        if (isVerifyUserRoute) {
+            const initialValue = fields[0]?.name;
+            if (initialValue) {
+                result.unverifiedAttr = initialValue;
+            }
+        }
+        return result;
+    });
     const sanitizedFields = useMemo(() => {
         if (!Array.isArray(fields)) {
             logger.warn(`Invalid fields type of ${typeof fields} passed to ${componentName}. fields must be of type array.`);
             return [];
         }
-        if (isRadioFieldComponent) {
-            return getSanitizedRadioFields(fields, componentName);
+        if (isVerifyUserRoute) {
+            return getSanitizedVerifyUserFields(fields);
+        }
+        if (isSelectMfaTypeRoute) {
+            return getSanitizedSelectMfaTypeFields(fields);
         }
         return getSanitizedTextFields(fields, componentName);
-    }, [componentName, fields, isRadioFieldComponent]);
+    }, [componentName, fields, isVerifyUserRoute, isSelectMfaTypeRoute]);
     const fieldsWithHandlers = sanitizedFields.map((field) => {
         if (isRadioFieldOptions(field)) {
             const onChange = (value) => {
                 // call `onChange` passed as radio `field` option
                 field.onChange?.(value);
-                // set `name` as value of 'unverifiedAttr'
-                setValues({ unverifiedAttr: value });
+                // on VerifyUser route, set `name` as value of 'unverifiedAttr'
+                // on SelectMfaTYpe route, set `name` as value of 'mfa_type'
+                const fieldName = isVerifyUserRoute
+                    ? 'unverifiedAttr'
+                    : isSelectMfaTypeRoute
+                        ? 'mfa_type'
+                        : field.name;
+                setValues((prev) => ({ ...prev, [fieldName]: value }));
             };
-            return { ...field, onChange };
+            const result = {
+                ...field,
+                onChange,
+            };
+            // bind selected boolean attribute for radio field
+            if (isSelectMfaTypeRoute) {
+                result.selected = values.mfa_type === field.value;
+            }
+            if (isVerifyUserRoute) {
+                result.selected = values.unverifiedAttr === field.name;
+            }
+            return result;
         }
         const { name, label, labelHidden, ...rest } = field;
         const onBlur = (event) => {
@@ -61,17 +100,11 @@ export default function useFieldValues({ componentName, fields = [], handleBlur,
             value: values[name],
         };
     });
-    const disableFormSubmit = isRadioFieldComponent
+    const disableFormSubmit = isVerifyUserRoute
         ? !values.unverifiedAttr
-        : fieldsWithHandlers.some(({ required, value }) => {
-            if (!required) {
-                return false;
-            }
-            if (value) {
-                return false;
-            }
-            return true;
-        });
+        : isSelectMfaTypeRoute
+            ? !values.mfa_type
+            : fieldsWithHandlers.some(({ required, value }) => required && !value);
     const handleFormSubmit = () => {
         const submitValue = isRadioFieldComponent
             ? values

package/dist/Authenticator/hooks/useFieldValues/utils.d.ts

@@ -2,7 +2,8 @@ import { ValidationError } from '@aws-amplify/ui';
 import { AuthenticatorLegacyField, AuthenticatorRouteComponentName, UseAuthenticator } from '@aws-amplify/ui-react-core';
 import { RadioFieldOptions, TextFieldOptionsType, TypedField } from '../types';
 export declare const isRadioFieldOptions: (field: TypedField) => field is RadioFieldOptions;
-export declare const getSanitizedRadioFields: (fields: TypedField[], componentName: AuthenticatorRouteComponentName) => TypedField[];
+export declare const getSanitizedVerifyUserFields: (fields: TypedField[]) => TypedField[];
+export declare const getSanitizedSelectMfaTypeFields: (fields: TypedField[]) => TypedField[];
 export declare const getSanitizedTextFields: (fields: TypedField[], componentName: AuthenticatorRouteComponentName) => TypedField[];
 /**
  * Translate machine fields to typed fields

package/dist/Authenticator/hooks/useFieldValues/utils.js

@@ -5,11 +5,11 @@ import { KEY_ALLOW_LIST } from './constants';
 const logger = new Logger('Authenticator');
 const { getInvalidEmailText, getRequiredFieldText } = authenticatorTextUtil;
 export const isRadioFieldOptions = (field) => field?.type === 'radio';
-export const getSanitizedRadioFields = (fields, componentName) => {
+export const getSanitizedVerifyUserFields = (fields) => {
     const values = {};
     return fields.filter((field) => {
         if (!isRadioFieldOptions(field)) {
-            logger.warn(`${componentName} component does not support text fields. field with type ${field.type} has been ignored.`);
+            logger.warn(`VerifyUser component does not support text fields. field with type ${field.type} has been ignored.`);
             return false;
         }
         const { name, value } = field;
@@ -30,6 +30,26 @@ export const getSanitizedRadioFields = (fields, componentName) => {
         return true;
     });
 };
+export const getSanitizedSelectMfaTypeFields = (fields) => {
+    const values = {};
+    return fields.filter((field) => {
+        const { value } = field;
+        if (!isRadioFieldOptions(field)) {
+            logger.warn(`SelectMfaType component does not support non-radio fields; field with type "${field.type}" has been ignored.`);
+            return false;
+        }
+        if (!value) {
+            logger.warn('Each field must have a value; field has been ignored.');
+            return false;
+        }
+        if (values[value]) {
+            logger.warn(`Each field value must be unique; field with duplicate value of "${value}" has been ignored.`);
+            return false;
+        }
+        values[value] = true;
+        return true;
+    });
+};
 export const getSanitizedTextFields = (fields, componentName) => {
     const names = {};
     return fields.filter((field) => {
@@ -95,8 +115,11 @@ export function getRouteTypedFields({ fields, route, }) {
     }
     // `VerifyUser` does not require additional updates to the shape of `fields`
     const isVerifyUserRoute = route === 'verifyUser';
+    const isSelectMfaTypeRoute = route === 'selectMfaType';
     const radioFields = fields;
-    return isVerifyUserRoute ? radioFields : getTypedFields(fields);
+    return isVerifyUserRoute || isSelectMfaTypeRoute
+        ? radioFields
+        : getTypedFields(fields);
 }
 /**
  *

package/dist/Authenticator/index.d.ts

@@ -1,6 +1,6 @@
 export { default as Authenticator } from './Authenticator';
 export { ContainerProps } from './common';
-export { ConfirmResetPasswordProps, ConfirmSignInProps, ConfirmSignUpProps, ConfirmVerifyUserProps, ForceNewPasswordProps, ForgotPasswordProps, SetupTotpProps, SignInProps, SignUpProps, VerifyUserProps, } from './Defaults';
+export { ConfirmResetPasswordProps, ConfirmSignInProps, ConfirmSignUpProps, ConfirmVerifyUserProps, ForceNewPasswordProps, ForgotPasswordProps, SelectMfaTypeProps, SetupEmailProps, SetupTotpProps, SignInProps, SignUpProps, VerifyUserProps, } from './Defaults';
 export { AuthenticatorProps, WithAuthenticatorOptions } from './types';
 export { useAuthenticator, UseAuthenticator } from './useAuthenticator';
 export { default as withAuthenticator } from './withAuthenticator';

package/dist/index.d.ts

@@ -1,3 +1,3 @@
-export { Authenticator, AuthenticatorProps, useAuthenticator, UseAuthenticator, withAuthenticator, WithAuthenticatorOptions, ConfirmResetPasswordProps, ConfirmSignInProps, ConfirmSignUpProps, ConfirmVerifyUserProps, ForceNewPasswordProps, ForgotPasswordProps, SetupTotpProps, SignInProps, SignUpProps, VerifyUserProps, } from './Authenticator';
+export { Authenticator, AuthenticatorProps, useAuthenticator, UseAuthenticator, withAuthenticator, WithAuthenticatorOptions, ConfirmResetPasswordProps, ConfirmSignInProps, ConfirmSignUpProps, ConfirmVerifyUserProps, ForceNewPasswordProps, ForgotPasswordProps, SelectMfaTypeProps, SetupEmailProps, SetupTotpProps, SignInProps, SignUpProps, VerifyUserProps, } from './Authenticator';
 export * from './InAppMessaging';
 export { Theme, ThemeProvider, defaultDarkModeOverride, defaultTheme, useTheme, } from './theme';

package/dist/primitives/RadioGroup/RadioGroup.d.ts

@@ -1,3 +1,4 @@
 import React from 'react';
 import { RadioGroupProps } from './types';
+export declare const RADIO_GROUP_CONTAINER_TEST_ID = "amplify__radio-group__container";
 export default function RadioGroup<T>({ accessible, accessibilityRole, children, direction, disabled, initialValue, label, labelPosition, labelStyle, onChange, onValueChange, size, style, ...rest }: RadioGroupProps<T>): React.JSX.Element;

package/dist/primitives/RadioGroup/RadioGroup.js

@@ -5,6 +5,7 @@ import { useTheme } from '../../theme';
 import { Label } from '../Label';
 import { getFlexDirectionFromLabelPosition } from '../Label/utils';
 import { getThemedStyles } from './styles';
+export const RADIO_GROUP_CONTAINER_TEST_ID = 'amplify__radio-group__container';
 export default function RadioGroup({ accessible = true, accessibilityRole = 'radiogroup', children, direction = 'vertical', disabled, initialValue, label, labelPosition = 'top', labelStyle, onChange, onValueChange, size, style, ...rest }) {
     const theme = useTheme();
     const themedStyle = getThemedStyles(theme);
@@ -26,7 +27,7 @@ export default function RadioGroup({ accessible = true, accessibilityRole = 'rad
         setValue(nextValue);
         onChange?.(nextValue);
     }, [onChange]);
-    return (<View {...rest} style={[themedStyle.container, containerStyle, style]}>
+    return (<View {...rest} style={[themedStyle.container, containerStyle, style]} testID={RADIO_GROUP_CONTAINER_TEST_ID}>
       <View accessible={accessible} accessibilityRole={accessibilityRole} style={childContainerStyle}>
         {Children.map(children, (child) => {
             if (isValidElement(child)) {

package/dist/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "2.4.5";
+export declare const VERSION = "2.5.0";

package/dist/version.js

@@ -1 +1 @@
-export const VERSION = '2.4.5';
+export const VERSION = '2.5.0';

package/lib/Authenticator/Authenticator.js

@@ -20,6 +20,8 @@ const DEFAULTS = {
     SignIn: Defaults_1.SignIn,
     SignUp: Defaults_1.SignUp,
     VerifyUser: Defaults_1.VerifyUser,
+    SetupEmail: Defaults_1.SetupEmail,
+    SelectMfaType: Defaults_1.SelectMfaType,
 };
 const routePropSelector = ({ route, }) => [
     route,
@@ -72,4 +74,6 @@ Authenticator.SetupTotp = Defaults_1.SetupTotp;
 Authenticator.SignIn = Defaults_1.SignIn;
 Authenticator.SignUp = Defaults_1.SignUp;
 Authenticator.VerifyUser = Defaults_1.VerifyUser;
+Authenticator.SetupEmail = Defaults_1.SetupEmail;
+Authenticator.SelectMfaType = Defaults_1.SelectMfaType;
 exports.default = Authenticator;

package/lib/Authenticator/Defaults/SelectMfaType/SelectMfaType.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const ui_1 = require("@aws-amplify/ui");
+const common_1 = require("../../common");
+const hooks_1 = require("../../hooks");
+const COMPONENT_NAME = 'SelectMfaType';
+const { getSelectMfaTypeByChallengeName, getBackToSignInText, getConfirmText, getConfirmingText, } = ui_1.authenticatorTextUtil;
+const SelectMfaType = ({ challengeName, fields, handleBlur, handleChange, handleSubmit, isPending, toSignIn, validationErrors, ...rest }) => {
+    const { disableFormSubmit: disabled, fields: fieldsWithHandlers, fieldValidationErrors, handleFormSubmit, } = (0, hooks_1.useFieldValues)({
+        componentName: COMPONENT_NAME,
+        fields,
+        handleBlur,
+        handleChange,
+        handleSubmit,
+        validationErrors,
+    });
+    const headerText = getSelectMfaTypeByChallengeName(challengeName);
+    const primaryButtonText = isPending ? getConfirmingText() : getConfirmText();
+    const secondaryButtonText = getBackToSignInText();
+    const buttons = (0, react_1.useMemo)(() => ({
+        primary: {
+            children: primaryButtonText,
+            disabled,
+            onPress: handleFormSubmit,
+        },
+        links: [{ children: secondaryButtonText, onPress: toSignIn }],
+    }), [
+        disabled,
+        handleFormSubmit,
+        primaryButtonText,
+        secondaryButtonText,
+        toSignIn,
+    ]);
+    return (<common_1.DefaultContent {...rest} buttons={buttons} headerText={headerText} fields={fieldsWithHandlers} isPending={isPending} validationErrors={fieldValidationErrors}/>);
+};
+SelectMfaType.Footer = common_1.DefaultFooter;
+SelectMfaType.FormFields = common_1.DefaultSelectMfaTypeFormFields;
+SelectMfaType.Header = common_1.DefaultHeader;
+SelectMfaType.displayName = COMPONENT_NAME;
+exports.default = SelectMfaType;

package/lib/Authenticator/Defaults/SelectMfaType/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SelectMfaType = void 0;
+var SelectMfaType_1 = require("./SelectMfaType");
+Object.defineProperty(exports, "SelectMfaType", { enumerable: true, get: function () { return __importDefault(SelectMfaType_1).default; } });