@aws-amplify/ui-react-core 2.0.0 → 2.1.0

package/dist/index.js

@@ -7,20 +7,22 @@ var React = require('react');
 var react = require('@xstate/react');
 var ui = require('@aws-amplify/ui');
 var awsAmplify = require('aws-amplify');
+var isString = require('lodash/isString');
 var isEmpty = require('lodash/isEmpty');
 var isObject = require('lodash/isObject');
 var notifications = require('@aws-amplify/notifications');
 var core = require('@aws-amplify/core');
 var isNil = require('lodash/isNil');
-var isString = require('lodash/isString');
+var isUndefined = require('lodash/isUndefined');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var isString__default = /*#__PURE__*/_interopDefaultLegacy(isString);
 var isEmpty__default = /*#__PURE__*/_interopDefaultLegacy(isEmpty);
 var isObject__default = /*#__PURE__*/_interopDefaultLegacy(isObject);
 var isNil__default = /*#__PURE__*/_interopDefaultLegacy(isNil);
-var isString__default = /*#__PURE__*/_interopDefaultLegacy(isString);
+var isUndefined__default = /*#__PURE__*/_interopDefaultLegacy(isUndefined);
 
 /**
  * AuthenticatorContext serves static reference to the auth machine service.
@@ -86,18 +88,6 @@ function __awaiter(thisArg, _arguments, P, generator) {
 }
 
 const USE_AUTHENTICATOR_ERROR = '`useAuthenticator` must be used inside an `Authenticator.Provider`.';
-const COMPONENT_ROUTE_KEYS = [
-    'signIn',
-    'signUp',
-    'forceNewPassword',
-    'confirmResetPassword',
-    'confirmSignIn',
-    'confirmSignUp',
-    'confirmVerifyUser',
-    'resetPassword',
-    'setupTOTP',
-    'verifyUser',
-];
 
 function isEmptyArray(value) {
     return Array.isArray(value) && isEmpty__default["default"](value);
@@ -112,6 +102,52 @@ function areEmptyObjects(...values) {
     return values.every(isEmptyObject);
 }
 
+const COMPONENT_ROUTE_KEYS = [
+    'confirmResetPassword',
+    'confirmSignIn',
+    'confirmSignUp',
+    'confirmVerifyUser',
+    'forceNewPassword',
+    'resetPassword',
+    'setupTOTP',
+    'signIn',
+    'signUp',
+    'verifyUser',
+];
+const COMPONENT_ROUTE_NAMES = [
+    'ConfirmResetPassword',
+    'ConfirmSignIn',
+    'ConfirmSignUp',
+    'ConfirmVerifyUser',
+    'ForceNewPassword',
+    'ResetPassword',
+    'SetupTOTP',
+    'SignIn',
+    'SignUp',
+    'VerifyUser',
+];
+
+const isComponentRouteKey = (route) => COMPONENT_ROUTE_KEYS.some((componentRoute) => componentRoute === route);
+function resolveAuthenticatorComponents(defaults, overrides) {
+    if (!overrides) {
+        return defaults;
+    }
+    return COMPONENT_ROUTE_NAMES.reduce((components, route) => {
+        const Default = defaults[route];
+        const Override = overrides[route];
+        if (typeof Override !== 'function') {
+            return Object.assign(Object.assign({}, components), { [route]: Default });
+        }
+        const { Footer, FormFields, Header } = Default;
+        // cast to allow assigning of component slots
+        const Component = Override;
+        Component.Footer = Footer;
+        Component.FormFields = FormFields;
+        Component.Header = Header;
+        return Object.assign(Object.assign({}, components), { [route]: Component });
+    }, {});
+}
+
 const defaultComparator = () => false;
 /**
  * Does an ordering and shallow comparison of each array value,
@@ -141,16 +177,29 @@ const getTotpSecretCodeCallback = (user) => function getTotpSecretCode() {
         return yield awsAmplify.Auth.setupTOTP(user);
     });
 };
-const isComponentRouteKey = (route) => COMPONENT_ROUTE_KEYS.some((componentRoute) => componentRoute === route);
 const flattenFormFields = (fields) => fields.flatMap(([name, options]) => (Object.assign({ name }, options)));
+const convertContactMethodsToFields = (unverifiedContactMethods) => {
+    return (unverifiedContactMethods &&
+        Object.entries(unverifiedContactMethods).map(([name, value]) => {
+            const valueIsString = isString__default["default"](value);
+            if (!valueIsString || !name) {
+                return {};
+            }
+            return { name, label: value, type: 'radio', value };
+        }));
+};
 /**
- * Retrieves legacy form field values from state machine for routes that have fields
+ * Retrieves default and custom (RWA only, to be updated) form field values from state machine
+ * for subcomponent routes that render fields
  */
-const getLegacyFields = (route, state) => 
-// verifyUser is a component route, but does not have form fields
-isComponentRouteKey(route) && route !== 'verifyUser'
-    ? flattenFormFields(ui.getSortedFormFields(route, state))
-    : [];
+const getMachineFields = (route, state, unverifiedContactMethods) => {
+    if (isComponentRouteKey(route)) {
+        return route === 'verifyUser'
+            ? convertContactMethodsToFields(unverifiedContactMethods)
+            : flattenFormFields(ui.getSortedFormFields(route, state));
+    }
+    return [];
+};
 
 /**
  * [📖 Docs](https://ui.docs.amplify.aws/react/connected-components/authenticator/headless#useauthenticator-hook)
@@ -165,18 +214,241 @@ function useAuthenticator(selector) {
     const xstateSelector = React.useCallback((state) => (Object.assign({}, ui.getServiceFacade({ send, state }))), [send]);
     const comparator = selector ? getComparator(selector) : defaultComparator;
     const facade = react.useSelector(service, xstateSelector, comparator);
-    const { route, user } = facade, rest = __rest(facade, ["route", "user"]);
+    const { route, unverifiedContactMethods, user } = facade, rest = __rest(facade, ["route", "unverifiedContactMethods", "user"]);
     // do not memoize output. `service.getSnapshot` reference remains stable preventing
     // `fields` from updating with current form state on value changes
     const serviceSnapshot = service.getSnapshot();
     // legacy `formFields` values required until form state is removed from state machine
-    const fields = React.useMemo(() => getLegacyFields(route, serviceSnapshot), [route, serviceSnapshot]);
+    const fields = React.useMemo(() => getMachineFields(route, serviceSnapshot, unverifiedContactMethods), [route, serviceSnapshot, unverifiedContactMethods]);
     return Object.assign(Object.assign({}, rest), { getTotpSecretCode: getTotpSecretCodeCallback(user), route,
+        unverifiedContactMethods,
         user,
         /** @deprecated For internal use only */
         fields });
 }
 
+/**
+ * Utility component for rendering nothing.
+ */
+function RenderNothing(_) {
+    return null;
+}
+
+const EVENT_HANDLER_KEY_MAP = {
+    updateBlur: 'handleBlur',
+    updateForm: 'handleChange',
+    submitForm: 'handleSubmit',
+};
+const COMMON_ROUTE_MACHINE_KEYS = [
+    'error',
+    'isPending',
+    'submitForm',
+    'updateBlur',
+    'updateForm',
+];
+const CONFIRM_RESET_PASSWORD_MACHINE_KEYS = [
+    ...COMMON_ROUTE_MACHINE_KEYS,
+    'resendCode',
+    'validationErrors',
+];
+const CONFIRM_SIGN_IN_MACHINE_KEYS = [
+    ...COMMON_ROUTE_MACHINE_KEYS,
+    'toSignIn',
+    'user',
+];
+const CONFIRM_SIGN_UP_MACHINE_KEYS = [
+    ...COMMON_ROUTE_MACHINE_KEYS,
+    'codeDeliveryDetails',
+    'resendCode',
+];
+const CONFIRM_VERIFY_USER_MACHINE_KEYS = [
+    ...COMMON_ROUTE_MACHINE_KEYS,
+    'skipVerification',
+];
+const FORCE_NEW_PASSWORD_MACHINE_KEYS = [
+    ...COMMON_ROUTE_MACHINE_KEYS,
+    'toSignIn',
+    'validationErrors',
+];
+const RESET_PASSWORD_MACHINE_KEYS = [
+    ...COMMON_ROUTE_MACHINE_KEYS,
+    'toSignIn',
+];
+const SIGN_IN_MACHINE_KEYS = [
+    ...COMMON_ROUTE_MACHINE_KEYS,
+    'toFederatedSignIn',
+    'toResetPassword',
+    'toSignUp',
+];
+const SIGN_UP_MACHINE_KEYS = [
+    ...COMMON_ROUTE_MACHINE_KEYS,
+    'toSignIn',
+    'validationErrors',
+];
+const SETUP_TOTP_MACHINE_KEYS = [
+    ...COMMON_ROUTE_MACHINE_KEYS,
+    'toSignIn',
+];
+const VERIFY_USER_MACHINE_KEYS = [
+    ...COMMON_ROUTE_MACHINE_KEYS,
+    'skipVerification',
+];
+const MACHINE_PROP_KEYS = {
+    confirmResetPassword: CONFIRM_RESET_PASSWORD_MACHINE_KEYS,
+    confirmSignIn: CONFIRM_SIGN_IN_MACHINE_KEYS,
+    confirmSignUp: CONFIRM_SIGN_UP_MACHINE_KEYS,
+    confirmVerifyUser: CONFIRM_VERIFY_USER_MACHINE_KEYS,
+    forceNewPassword: FORCE_NEW_PASSWORD_MACHINE_KEYS,
+    signIn: SIGN_IN_MACHINE_KEYS,
+    signUp: SIGN_UP_MACHINE_KEYS,
+    resetPassword: RESET_PASSWORD_MACHINE_KEYS,
+    setupTOTP: SETUP_TOTP_MACHINE_KEYS,
+    verifyUser: VERIFY_USER_MACHINE_KEYS,
+};
+
+// only select `route` from machine context
+const routeSelector$1 = ({ route }) => [route];
+const createSelector = (selectorKeys) => (context) => {
+    const dependencies = selectorKeys.map((key) => context[key]);
+    // route should always be part of deps, so hook knows when route changes.
+    return [...dependencies, context.route];
+};
+const getRouteMachineSelector = (route) => isComponentRouteKey(route)
+    ? createSelector(MACHINE_PROP_KEYS[route])
+    : routeSelector$1;
+const isFormEventHandlerKey = (key) => ['updateBlur', 'updateForm', 'submitForm'].includes(key);
+const convertEventHandlerKey = (key) => EVENT_HANDLER_KEY_MAP[key];
+const getConvertedMachineProps = (route, context) => MACHINE_PROP_KEYS[route].reduce((acc, key) => (Object.assign(Object.assign({}, acc), { [isFormEventHandlerKey(key) ? convertEventHandlerKey(key) : key]: context[key] })), {});
+function resolveConfirmResetPasswordRoute(Component, props) {
+    return {
+        Component,
+        props: Object.assign(Object.assign({}, Component), getConvertedMachineProps('confirmResetPassword', props)),
+    };
+}
+function resolveConfirmSignInRoute(Component, props) {
+    const _a = getConvertedMachineProps('confirmSignIn', props), { user } = _a, machineProps = __rest(_a, ["user"]);
+    // prior to the `confirmSignIn` route, `user.username` is populated
+    const challengeName = user.challengeName;
+    return { Component, props: Object.assign(Object.assign(Object.assign({}, Component), machineProps), { challengeName }) };
+}
+function resolveConfirmSignUpRoute(Component, props) {
+    return {
+        Component,
+        props: Object.assign(Object.assign({}, Component), getConvertedMachineProps('confirmSignUp', props)),
+    };
+}
+function resolveConfirmVerifyUserRoute(Component, props) {
+    return {
+        Component,
+        props: Object.assign(Object.assign({}, Component), getConvertedMachineProps('confirmVerifyUser', props)),
+    };
+}
+function resolveForceNewPasswordRoute(Component, props) {
+    return {
+        Component,
+        props: Object.assign(Object.assign({}, Component), getConvertedMachineProps('forceNewPassword', props)),
+    };
+}
+function resolveResetPasswordRoute(Component, props) {
+    return {
+        Component,
+        props: Object.assign(Object.assign({}, Component), getConvertedMachineProps('resetPassword', props)),
+    };
+}
+function resolveSetupTOTPRoute(Component, _a) {
+    var { getTotpSecretCode } = _a, props = __rest(_a, ["getTotpSecretCode"]);
+    return {
+        Component,
+        props: Object.assign(Object.assign(Object.assign({}, Component), getConvertedMachineProps('setupTOTP', props)), { getTotpSecretCode }),
+    };
+}
+function resolveSignInRoute(Component, props) {
+    // default `hideSignUp` to false
+    const hideSignUp = false;
+    return {
+        Component,
+        props: Object.assign(Object.assign(Object.assign({}, Component), getConvertedMachineProps('signIn', props)), { hideSignUp }),
+    };
+}
+function resolveSignUpRoute(Component, props) {
+    return {
+        Component,
+        props: Object.assign(Object.assign({}, Component), getConvertedMachineProps('signUp', props)),
+    };
+}
+function resolveVerifyUserRoute(Component, props) {
+    return {
+        Component,
+        props: Object.assign(Object.assign({}, Component), getConvertedMachineProps('verifyUser', props)),
+    };
+}
+function resolveDefault() {
+    return {
+        Component: RenderNothing,
+        props: {},
+    };
+}
+
+function useAuthenticatorRoute({ components, }) {
+    const { route } = useAuthenticator(routeSelector$1);
+    const routeMachineSelector = React.useMemo(() => getRouteMachineSelector(route), [route]);
+    // `useAuthenticator` exposes both state machine (example: `toSignIn`) and non-state machine
+    // props (example: `getTotpSecretCode`). `routeSelector` specifies which state machine props
+    // should be returned for a specific route.
+    // Only state machine props specified by the current `routeSelector` will have their current value
+    // returned by `useAuthenticator`, non-machine props returned will always be the current value
+    const routeSelectorProps = useAuthenticator(routeMachineSelector);
+    const { ConfirmResetPassword, ConfirmSignIn, ConfirmSignUp, ConfirmVerifyUser, ForceNewPassword, ResetPassword, SetupTOTP, SignIn, SignUp, VerifyUser, } = components;
+    switch (route) {
+        case 'confirmResetPassword': {
+            return resolveConfirmResetPasswordRoute(ConfirmResetPassword, routeSelectorProps);
+        }
+        case 'confirmSignIn': {
+            return resolveConfirmSignInRoute(ConfirmSignIn, routeSelectorProps);
+        }
+        case 'confirmSignUp': {
+            return resolveConfirmSignUpRoute(ConfirmSignUp, routeSelectorProps);
+        }
+        case 'confirmVerifyUser': {
+            return resolveConfirmVerifyUserRoute(ConfirmVerifyUser, routeSelectorProps);
+        }
+        case 'forceNewPassword': {
+            return resolveForceNewPasswordRoute(ForceNewPassword, routeSelectorProps);
+        }
+        case 'resetPassword': {
+            return resolveResetPasswordRoute(ResetPassword, routeSelectorProps);
+        }
+        case 'setupTOTP': {
+            return resolveSetupTOTPRoute(SetupTOTP, routeSelectorProps);
+        }
+        case 'signIn': {
+            return resolveSignInRoute(SignIn, routeSelectorProps);
+        }
+        case 'signUp': {
+            return resolveSignUpRoute(SignUp, routeSelectorProps);
+        }
+        case 'verifyUser': {
+            return resolveVerifyUserRoute(VerifyUser, routeSelectorProps);
+        }
+        default: {
+            return resolveDefault();
+        }
+    }
+}
+
+// only select `route` from machine context
+const routeSelector = ({ route }) => [route];
+function useAuthenticatorInitMachine(data) {
+    const { route, initializeMachine } = useAuthenticator(routeSelector);
+    const hasInitialized = React__default["default"].useRef(false);
+    React__default["default"].useEffect(() => {
+        if (!hasInitialized.current && route === 'setup') {
+            initializeMachine(data);
+            hasInitialized.current = true;
+        }
+    }, [initializeMachine, route, data]);
+}
+
 const InAppMessagingContext = React.createContext(null);
 
 const { InAppMessaging: InAppMessaging$1 } = notifications.Notifications;
@@ -212,13 +484,6 @@ function useInAppMessaging() {
     return inAppMessagingContext;
 }
 
-/**
- * Utility component for rendering nothing.
- */
-function RenderNothng(_) {
-    return null;
-}
-
 const logger$2 = new core.ConsoleLogger('Notifications.InAppMessaging');
 const positions = {
     BOTTOM_BANNER: 'bottom',
@@ -272,7 +537,7 @@ function useMessage({ components, onMessageAction, }) {
     const { BannerMessage, CarouselMessage, FullScreenMessage, ModalMessage } = components;
     if (isNil__default["default"](message)) {
         return {
-            Component: RenderNothng,
+            Component: RenderNothing,
             props: EMPTY_PROPS,
         };
     }
@@ -321,7 +586,7 @@ function useMessage({ components, onMessageAction, }) {
         default: {
             logger$1.info(`Received unknown InAppMessage layout: ${layout}`);
             return {
-                Component: RenderNothng,
+                Component: RenderNothing,
                 props: EMPTY_PROPS,
             };
         }
@@ -340,9 +605,34 @@ const handleMessageAction = ({ action, handleMessageLinkAction, url, }) => {
     }
 };
 
+function usePreviousValue(value) {
+    const previous = React.useRef();
+    // update ref post render
+    React.useEffect(() => {
+        previous.current = value;
+    }, [value]);
+    // return previous ref
+    return previous.current;
+}
+
+function useHasValueUpdated(value, ignoreFirstRender = false) {
+    const previous = usePreviousValue(value);
+    const shouldIgnoreChange = isUndefined__default["default"](previous) && ignoreFirstRender;
+    if (shouldIgnoreChange) {
+        return false;
+    }
+    return previous !== value;
+}
+
 exports.AuthenticatorProvider = AuthenticatorProvider;
 exports.InAppMessagingProvider = InAppMessagingProvider;
 exports.handleMessageAction = handleMessageAction;
+exports.isAuthenticatorComponentRouteKey = isComponentRouteKey;
+exports.resolveAuthenticatorComponents = resolveAuthenticatorComponents;
 exports.useAuthenticator = useAuthenticator;
+exports.useAuthenticatorInitMachine = useAuthenticatorInitMachine;
+exports.useAuthenticatorRoute = useAuthenticatorRoute;
+exports.useHasValueUpdated = useHasValueUpdated;
 exports.useInAppMessaging = useInAppMessaging;
 exports.useMessage = useMessage;
+exports.usePreviousValue = usePreviousValue;

package/dist/types/Authenticator/hooks/__mock__/components.d.ts

@@ -0,0 +1,7 @@
+import { Defaults, Overrides } from '../types';
+declare type DefaultComponents<P> = Defaults<P>;
+export declare const DEFAULTS: DefaultComponents<{}>;
+export declare const OVERRIDES: Overrides;
+export declare const INVALID_SIGN_IN_OVERRIDES: Overrides;
+export declare const INVALID_OVERRIDES: Overrides<{}, {}>;
+export {};

package/dist/types/Authenticator/hooks/__tests__/utils.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/Authenticator/hooks/constants.d.ts

@@ -0,0 +1,3 @@
+import { AuthenticatorRouteComponentKey, AuthenticatorRouteComponentName } from './types';
+export declare const COMPONENT_ROUTE_KEYS: AuthenticatorRouteComponentKey[];
+export declare const COMPONENT_ROUTE_NAMES: AuthenticatorRouteComponentName[];

package/dist/types/Authenticator/hooks/index.d.ts

@@ -1 +1,5 @@
 export * from './useAuthenticator';
+export * from './useAuthenticatorRoute';
+export * from './useAuthenticatorInitMachine';
+export * from './utils';
+export * from './types';

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

@@ -0,0 +1,123 @@
+import React from 'react';
+import { AuthChallengeName, AuthenticatorServiceFacade, LegacyFormFieldOptions } from '@aws-amplify/ui';
+export declare type AuthenticatorRouteComponentKey = 'confirmResetPassword' | 'confirmSignIn' | 'confirmSignUp' | 'confirmVerifyUser' | 'forceNewPassword' | 'resetPassword' | 'setupTOTP' | 'signIn' | 'signUp' | 'verifyUser';
+export declare type AuthenticatorLegacyField = LegacyFormFieldOptions;
+export declare type AuthenticatorLegacyFields = AuthenticatorLegacyField[];
+/**
+ * These are the "facades" that we provide, which contains contexts respective
+ * to current authenticator state.
+ */
+export declare type AuthenticatorMachineContext = AuthenticatorServiceFacade;
+export declare type AuthenticatorMachineContextKey = keyof AuthenticatorMachineContext;
+export declare type AuthenticatorRouteComponentName = Capitalize<AuthenticatorRouteComponentKey>;
+export declare type GetTotpSecretCode = () => Promise<string>;
+interface HeaderProps {
+    children?: React.ReactNode;
+}
+interface FooterProps {
+    children?: React.ReactNode;
+}
+declare type FormFieldsProps = {
+    isPending: AuthenticatorMachineContext['isPending'];
+    validationErrors?: AuthenticatorMachineContext['validationErrors'];
+};
+export declare type FooterComponent<Props = {}> = React.ComponentType<FooterProps & Props>;
+export declare type FormFieldsComponent<FieldType, Props = {}> = React.ComponentType<FormFieldsProps & {
+    fields: FieldType[];
+} & Props>;
+export declare type HeaderComponent<Props = {}> = React.ComponentType<HeaderProps & Props>;
+export interface ComponentSlots<FieldType = {}> {
+    Footer: FooterComponent;
+    Header: HeaderComponent;
+    FormFields: FormFieldsComponent<FieldType>;
+}
+/**
+ * Common component prop types used for both RWA and RNA implementations
+ */
+export declare type CommonRouteProps = {
+    error?: AuthenticatorMachineContext['error'];
+    isPending: AuthenticatorMachineContext['isPending'];
+    handleBlur: AuthenticatorMachineContext['updateBlur'];
+    handleChange: AuthenticatorMachineContext['updateForm'];
+    handleSubmit: AuthenticatorMachineContext['submitForm'];
+};
+/**
+ * Base Route component props
+ */
+export declare type ConfirmResetPasswordBaseProps<FieldType = {}> = {
+    resendCode: AuthenticatorMachineContext['resendCode'];
+    validationErrors?: AuthenticatorMachineContext['validationErrors'];
+} & CommonRouteProps & ComponentSlots<FieldType>;
+export declare type ConfirmSignInBaseProps<FieldType = {}> = {
+    challengeName: AuthChallengeName;
+    toSignIn: AuthenticatorMachineContext['toSignIn'];
+} & CommonRouteProps & ComponentSlots<FieldType>;
+export declare type ConfirmSignUpBaseProps<FieldType = {}> = {
+    codeDeliveryDetails: AuthenticatorMachineContext['codeDeliveryDetails'];
+    resendCode: AuthenticatorMachineContext['resendCode'];
+} & CommonRouteProps & ComponentSlots<FieldType>;
+export declare type ConfirmVerifyUserProps<FieldType = {}> = {
+    skipVerification: AuthenticatorMachineContext['skipVerification'];
+} & CommonRouteProps & ComponentSlots<FieldType>;
+export declare type ForceResetPasswordBaseProps<FieldType = {}> = {
+    toSignIn: AuthenticatorMachineContext['toSignIn'];
+    validationErrors?: AuthenticatorMachineContext['validationErrors'];
+} & CommonRouteProps & ComponentSlots<FieldType>;
+export declare type ResetPasswordBaseProps<FieldType = {}> = {
+    toSignIn: AuthenticatorMachineContext['toSignIn'];
+} & CommonRouteProps & ComponentSlots<FieldType>;
+export declare type SetupTOTPBaseProps<FieldType = {}> = {
+    getTotpSecretCode: GetTotpSecretCode;
+    toSignIn: AuthenticatorMachineContext['toSignIn'];
+} & CommonRouteProps & ComponentSlots<FieldType>;
+export declare type SignInBaseProps<FieldType = {}> = {
+    hideSignUp?: boolean;
+    toFederatedSignIn: AuthenticatorMachineContext['toFederatedSignIn'];
+    toResetPassword: AuthenticatorMachineContext['toResetPassword'];
+    toSignUp: AuthenticatorMachineContext['toSignUp'];
+} & CommonRouteProps & ComponentSlots<FieldType>;
+export declare type SignUpBaseProps<FieldType = {}> = {
+    hideSignIn?: boolean;
+    toFederatedSignIn: AuthenticatorMachineContext['toFederatedSignIn'];
+    toSignIn: AuthenticatorMachineContext['toSignIn'];
+    validationErrors?: AuthenticatorMachineContext['validationErrors'];
+} & CommonRouteProps & ComponentSlots<FieldType>;
+export declare type VerifyUserProps<FieldType = {}> = {
+    skipVerification: AuthenticatorMachineContext['skipVerification'];
+} & CommonRouteProps & ComponentSlots<FieldType>;
+export interface DefaultProps<FieldType = {}> {
+    ConfirmSignIn: ConfirmSignInBaseProps<FieldType>;
+    ConfirmSignUp: ConfirmSignUpBaseProps<FieldType>;
+    ConfirmResetPassword: ConfirmResetPasswordBaseProps<FieldType>;
+    ConfirmVerifyUser: ConfirmVerifyUserProps<FieldType>;
+    ForceNewPassword: ForceResetPasswordBaseProps<FieldType>;
+    ResetPassword: ResetPasswordBaseProps<FieldType>;
+    SetupTOTP: SetupTOTPBaseProps<FieldType>;
+    SignIn: SignInBaseProps<FieldType>;
+    SignUp: SignUpBaseProps<FieldType>;
+    VerifyUser: VerifyUserProps<FieldType>;
+}
+/**
+ * common types extended for default component types/implementations and override component types
+ */
+declare type BaseComponent<ComponentRouteProps = {}, FieldType = {}, Props = {}> = React.ComponentType<ComponentSlots<FieldType> & ComponentRouteProps & {
+    fields: FieldType[];
+} & Props>;
+/**
+ * Authenticator Route Component Default types
+ */
+export declare type Defaults<FieldType = {}, PlatformProps = {}> = {
+    [Key in AuthenticatorRouteComponentName]: BaseComponent<DefaultProps<FieldType>[Key], FieldType, PlatformProps> & ComponentSlots<FieldType>;
+};
+export declare type Overrides<FieldType = {}, PlatformProps = {}> = {
+    [Key in AuthenticatorRouteComponentName]?: BaseComponent<DefaultProps<FieldType>[Key], FieldType, PlatformProps>;
+};
+/**
+ * Default Route Component union type
+ */
+export declare type DefaultComponentType<FieldType = {}> = Defaults<FieldType>[keyof Defaults<FieldType>];
+/**
+ * Default Route Component union type
+ */
+export declare type DefaultPropsType<FieldType = {}> = DefaultProps<FieldType>[keyof DefaultProps<FieldType>];
+export {};

package/dist/types/Authenticator/hooks/useAuthenticator/__mock__/useAuthenticator.d.ts

@@ -0,0 +1,4 @@
+import { AuthenticatorMachineContext } from '../../types';
+import { UseAuthenticator } from '../types';
+export declare const mockMachineContext: AuthenticatorMachineContext;
+export declare const mockUseAuthenticatorOutput: UseAuthenticator;

package/dist/types/Authenticator/hooks/useAuthenticator/constants.d.ts

@@ -1,3 +1 @@
-import { AuthenticatorRouteComponentKey } from './types';
 export declare const USE_AUTHENTICATOR_ERROR = "`useAuthenticator` must be used inside an `Authenticator.Provider`.";
-export declare const COMPONENT_ROUTE_KEYS: AuthenticatorRouteComponentKey[];

package/dist/types/Authenticator/hooks/useAuthenticator/index.d.ts

@@ -1,2 +1,2 @@
 export { default as useAuthenticator } from './useAuthenticator';
-export { UseAuthenticator } from './types';
+export { UseAuthenticator, UseAuthenticatorSelector } from './types';

package/dist/types/Authenticator/hooks/useAuthenticator/types.d.ts

@@ -13,11 +13,11 @@ export declare type AuthenticatorLegacyFields = LegacyFormFieldOptions[];
  * Selector accepts current facade values and returns an array of
  * desired value(s) that should trigger re-render.
  */
-export declare type Selector = (context: AuthenticatorMachineContext) => AuthenticatorMachineContext[AuthenticatorMachineContextKey][];
+export declare type UseAuthenticatorSelector = (context: AuthenticatorMachineContext) => AuthenticatorMachineContext[AuthenticatorMachineContextKey][];
 export interface UseAuthenticator extends AuthenticatorServiceFacade {
     getTotpSecretCode: () => Promise<string>;
     /** @deprecated For internal use only */
     fields: AuthenticatorLegacyFields;
 }
-export declare type Comparator = (currentFacade: AuthenticatorServiceFacade, nextFacade: AuthenticatorServiceFacade) => boolean;
+export declare type Comparator = (currentMachineContext: AuthenticatorMachineContext, nextMachineContext: AuthenticatorMachineContext) => boolean;
 export {};

package/dist/types/Authenticator/hooks/useAuthenticator/useAuthenticator.d.ts

@@ -1,5 +1,5 @@
-import { Selector, UseAuthenticator } from './types';
+import { UseAuthenticatorSelector, UseAuthenticator } from './types';
 /**
  * [📖 Docs](https://ui.docs.amplify.aws/react/connected-components/authenticator/headless#useauthenticator-hook)
  */
-export default function useAuthenticator(selector?: Selector): UseAuthenticator;
+export default function useAuthenticator(selector?: UseAuthenticatorSelector): UseAuthenticator;

package/dist/types/Authenticator/hooks/useAuthenticator/utils.d.ts

@@ -1,15 +1,16 @@
-import { AmplifyUser, AuthenticatorRoute, AuthMachineState } from '@aws-amplify/ui';
-import { AuthenticatorRouteComponentKey, AuthenticatorLegacyFields, Comparator, Selector } from './types';
+import { AmplifyUser, AuthenticatorRoute, AuthMachineState, UnverifiedContactMethods } from '@aws-amplify/ui';
+import { AuthenticatorLegacyFields } from '../types';
+import { Comparator, UseAuthenticatorSelector } from './types';
 export declare const defaultComparator: () => false;
 /**
  * Does an ordering and shallow comparison of each array value,
  * plus a value equality check for empty objects and arrays.
  */
 export declare function areSelectorDepsEqual<T>(currentDeps: T[], nextDeps: T[]): boolean;
-export declare const getComparator: (selector: Selector) => Comparator;
+export declare const getComparator: (selector: UseAuthenticatorSelector) => Comparator;
 export declare const getTotpSecretCodeCallback: (user: AmplifyUser) => () => Promise<string>;
-export declare const isComponentRouteKey: (route: AuthenticatorRoute) => route is AuthenticatorRouteComponentKey;
 /**
- * Retrieves legacy form field values from state machine for routes that have fields
+ * Retrieves default and custom (RWA only, to be updated) form field values from state machine
+ * for subcomponent routes that render fields
  */
-export declare const getLegacyFields: (route: AuthenticatorRoute, state: AuthMachineState) => AuthenticatorLegacyFields;
+export declare const getMachineFields: (route: AuthenticatorRoute, state: AuthMachineState, unverifiedContactMethods: UnverifiedContactMethods) => AuthenticatorLegacyFields;

package/dist/types/Authenticator/hooks/useAuthenticatorInitMachine/__tests__/useAuthenticatorInitMachine.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/Authenticator/hooks/useAuthenticatorInitMachine/index.d.ts

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

package/dist/types/Authenticator/hooks/useAuthenticatorInitMachine/useAuthenticatorInitMachine.d.ts

@@ -0,0 +1,4 @@
+import { AuthenticatorMachineOptions } from '@aws-amplify/ui';
+import { UseAuthenticatorSelector } from '../useAuthenticator';
+export declare const routeSelector: UseAuthenticatorSelector;
+export default function useAuthenticatorInitMachine(data: AuthenticatorMachineOptions): void;

package/dist/types/Authenticator/hooks/useAuthenticatorRoute/__tests__/useAuthenticatorRoute.spec.d.ts

@@ -0,0 +1 @@
+export {};