@aws-amplify/ui-react 5.3.2 → 6.0.0

package/dist/esm/components/AccountSettings/shared/Defaults.mjs

@@ -1 +1,66 @@
-import i from"react";import{Alert as e}from"../../../primitives/Alert/Alert.mjs";import"../../../primitives/Autocomplete/Autocomplete.mjs";import"../../../primitives/Badge/Badge.mjs";import"../../../primitives/Breadcrumbs/Breadcrumbs.mjs";import"../../../primitives/Button/Button.mjs";import"../../../primitives/ButtonGroup/ButtonGroup.mjs";import"../../../primitives/Card/Card.mjs";import"../../../primitives/CheckboxField/CheckboxField.mjs";import"../../../primitives/Collection/Collection.mjs";import"../../../primitives/Divider/Divider.mjs";import"../../../primitives/DropZone/DropZone.mjs";import"../../../primitives/Expander/Expander.mjs";import"../../../primitives/Expander/ExpanderItem.mjs";import"../../../primitives/FieldGroupIcon/FieldGroupIcon.mjs";import"../../../primitives/FieldGroupIcon/FieldGroupIconButton.mjs";import"../../../primitives/Fieldset/Fieldset.mjs";import"../../../primitives/Fieldset/useFieldset.mjs";import"../../../primitives/Flex/Flex.mjs";import"../../../primitives/Grid/Grid.mjs";import"../../../primitives/Heading/Heading.mjs";import"../../../primitives/HighlightMatch/HighlightMatch.mjs";import"../../../primitives/Icon/Icon.mjs";import"../../../primitives/Icon/context/IconsContext.mjs";import"tslib";import"classnames";import"../../../primitives/shared/constants.mjs";import"../../../primitives/View/View.mjs";import"../../../primitives/Image/Image.mjs";import"../../../primitives/Input/Input.mjs";import"../../../primitives/Label/Label.mjs";import"../../../primitives/Link/Link.mjs";import"../../../primitives/Loader/Loader.mjs";import"../../../primitives/Menu/Menu.mjs";import"../../../primitives/Menu/MenuButton.mjs";import"../../../primitives/Menu/MenuItem.mjs";import"../../../primitives/Message/Message.mjs";import"../../../primitives/Pagination/Pagination.mjs";import"../../../primitives/PasswordField/PasswordField.mjs";import"../../../primitives/PhoneNumberField/PhoneNumberField.mjs";import"../../../primitives/Placeholder/Placeholder.mjs";import"../../../primitives/Radio/Radio.mjs";import"../../../primitives/RadioGroupField/RadioGroupField.mjs";import"../../../primitives/Rating/Rating.mjs";import"../../../primitives/ScrollView/ScrollView.mjs";import"../../../primitives/SearchField/SearchField.mjs";import"../../../primitives/SelectField/SelectField.mjs";import"../../../primitives/SliderField/SliderField.mjs";import"../../../primitives/StepperField/StepperField.mjs";import"../../../primitives/SwitchField/SwitchField.mjs";import"../../../primitives/Table/Table.mjs";import"../../../primitives/Table/TableBody.mjs";import"../../../primitives/Table/TableCell.mjs";import"../../../primitives/Table/TableFoot.mjs";import"../../../primitives/Table/TableHead.mjs";import"../../../primitives/Table/TableRow.mjs";import"../../../primitives/Tabs/Tabs.mjs";import"../../../primitives/Text/Text.mjs";import"../../../primitives/TextAreaField/TextAreaField.mjs";import"../../../primitives/TextField/TextField.mjs";import"../../../primitives/ToggleButton/ToggleButton.mjs";import"../../../primitives/ToggleButtonGroup/ToggleButtonGroup.mjs";import"../../../primitives/VisuallyHidden/VisuallyHidden.mjs";const m=m=>i.createElement(e,Object.assign({variation:"error"},m));export{m as DefaultErrorMessage};
+import React__default from 'react';
+import { Alert } from '../../../primitives/Alert/Alert.mjs';
+import '../../../primitives/Autocomplete/Autocomplete.mjs';
+import '../../../primitives/Badge/Badge.mjs';
+import '../../../primitives/Breadcrumbs/Breadcrumbs.mjs';
+import '../../../primitives/Button/Button.mjs';
+import '../../../primitives/ButtonGroup/ButtonGroup.mjs';
+import '../../../primitives/Card/Card.mjs';
+import '../../../primitives/CheckboxField/CheckboxField.mjs';
+import '../../../primitives/Collection/Collection.mjs';
+import '../../../primitives/Divider/Divider.mjs';
+import '../../../primitives/DropZone/DropZone.mjs';
+import '../../../primitives/Accordion/Accordion.mjs';
+import '../../../primitives/FieldGroupIcon/FieldGroupIcon.mjs';
+import '../../../primitives/FieldGroupIcon/FieldGroupIconButton.mjs';
+import '../../../primitives/Fieldset/Fieldset.mjs';
+import '../../../primitives/Fieldset/useFieldset.mjs';
+import '../../../primitives/Flex/Flex.mjs';
+import '../../../primitives/Grid/Grid.mjs';
+import '../../../primitives/Heading/Heading.mjs';
+import '../../../primitives/HighlightMatch/HighlightMatch.mjs';
+import '../../../primitives/Icon/Icon.mjs';
+import '../../../primitives/Icon/context/IconsContext.mjs';
+import '@aws-amplify/ui';
+import '../../../primitives/View/View.mjs';
+import '../../../primitives/Image/Image.mjs';
+import '../../../primitives/Input/Input.mjs';
+import '../../../primitives/Label/Label.mjs';
+import '../../../primitives/Link/Link.mjs';
+import '../../../primitives/Loader/Loader.mjs';
+import '../../../primitives/Menu/Menu.mjs';
+import '../../../primitives/Menu/MenuButton.mjs';
+import '../../../primitives/Menu/MenuItem.mjs';
+import '../../../primitives/Message/Message.mjs';
+import '../../../primitives/Pagination/Pagination.mjs';
+import '../../../primitives/PasswordField/PasswordField.mjs';
+import '../../../primitives/PhoneNumberField/PhoneNumberField.mjs';
+import '../../../primitives/Placeholder/Placeholder.mjs';
+import '../../../primitives/Radio/Radio.mjs';
+import '../../../primitives/RadioGroupField/RadioGroupField.mjs';
+import '../../../primitives/Rating/Rating.mjs';
+import '../../../primitives/ScrollView/ScrollView.mjs';
+import '../../../primitives/SearchField/SearchField.mjs';
+import '../../../primitives/SelectField/SelectField.mjs';
+import '../../../primitives/SliderField/SliderField.mjs';
+import '../../../primitives/StepperField/StepperField.mjs';
+import '../../../primitives/SwitchField/SwitchField.mjs';
+import '../../../primitives/Table/Table.mjs';
+import '../../../primitives/Table/TableBody.mjs';
+import '../../../primitives/Table/TableCell.mjs';
+import '../../../primitives/Table/TableFoot.mjs';
+import '../../../primitives/Table/TableHead.mjs';
+import '../../../primitives/Table/TableRow.mjs';
+import '../../../primitives/Tabs/Tabs.mjs';
+import '../../../primitives/Text/Text.mjs';
+import '../../../primitives/TextAreaField/TextAreaField.mjs';
+import '../../../primitives/TextField/TextField.mjs';
+import '../../../primitives/ToggleButton/ToggleButton.mjs';
+import '../../../primitives/ToggleButtonGroup/ToggleButtonGroup.mjs';
+import '../../../primitives/VisuallyHidden/VisuallyHidden.mjs';
+
+const DefaultErrorMessage = (props) => {
+    return React__default.createElement(Alert, { variation: "error", ...props });
+};
+
+export { DefaultErrorMessage };

package/dist/esm/components/AccountSettings/utils/displayText.mjs

@@ -0,0 +1,14 @@
+const defaultChangePasswordDisplayText = {
+    confirmPasswordFieldLabel: 'Confirm Password',
+    currentPasswordFieldLabel: 'Current Password',
+    newPasswordFieldLabel: 'New Password',
+    updatePasswordButtonText: 'Update password',
+};
+const defaultDeleteUserDisplayText = {
+    cancelButtonText: 'Cancel',
+    confirmDeleteButtonText: 'Delete',
+    deleteAccountButtonText: 'Delete Account',
+    warningText: 'Deleting your account is not reversible. You will lose access to your account and all data associated with it.',
+};
+
+export { defaultChangePasswordDisplayText, defaultDeleteUserDisplayText };

package/dist/esm/components/Authenticator/Authenticator.mjs

@@ -1 +1,74 @@
-import*as e from"react";import{configureComponent as s,isFunction as o}from"@aws-amplify/ui";import{AuthenticatorProvider as r,useAuthenticator as t,useAuthenticatorInitMachine as i}from"@aws-amplify/ui-react-core";import{VERSION as m}from"../../version.mjs";import{useDeprecationWarning as n}from"../../hooks/useDeprecationWarning.mjs";import{CustomComponentsContext as a}from"./hooks/useCustomComponents/useCustomComponents.mjs";import"../../primitives/View/View.mjs";import{Router as p}from"./Router/Router.mjs";import{SetupTOTP as u}from"./SetupTOTP/SetupTOTP.mjs";import{SignIn as c}from"./SignIn/SignIn.mjs";import{SignUp as l}from"./SignUp/SignUp.mjs";import{ForceNewPassword as f}from"./ForceNewPassword/ForceNewPassword.mjs";import"./ResetPassword/ConfirmResetPassword.mjs";import{ResetPassword as d}from"./ResetPassword/ResetPassword.mjs";import{defaultComponents as g}from"./hooks/useCustomComponents/defaultComponents.mjs";function w({children:s,className:r,components:m,formFields:u,hideSignUp:c,initialState:l,loginMechanisms:f,passwordSettings:d,signUpAttributes:w,services:j,socialProviders:P,variation:S}){n({message:"The `passwordSettings` prop has been deprecated and will be removed in a future major version of Amplify UI.",shouldWarn:!!d});const{route:v,signOut:h,user:O}=t((({route:e,signOut:s,user:o})=>[e,s,o]));i({initialState:l,loginMechanisms:f,services:j,signUpAttributes:w,socialProviders:P,formFields:u});const C=e.useMemo((()=>({components:Object.assign(Object.assign({},g),m)})),[m]);return"authenticated"===v||"signOut"===v?s?e.createElement(e.Fragment,null,o(s)?s({signOut:h,user:O}):s):null:e.createElement(a.Provider,{value:C},e.createElement(p,{className:r,hideSignUp:c,variation:S}))}function j(o){return e.useEffect((()=>{s({packageName:"@aws-amplify/ui-react",version:m})}),[]),e.createElement(r,null,e.createElement(w,Object.assign({},o)))}j.Provider=r,j.ResetPassword=d,j.SetupTOTP=u,j.SignIn=c,j.SignUp=l,j.ForceNewPassword=f;export{j as Authenticator,w as AuthenticatorInternal};
+import * as React from 'react';
+import { isFunction } from '@aws-amplify/ui';
+import { useSetUserAgent, AuthenticatorProvider, useAuthenticator, useAuthenticatorInitMachine } from '@aws-amplify/ui-react-core';
+import { VERSION } from '../../version.mjs';
+import { useDeprecationWarning } from '../../hooks/useDeprecationWarning.mjs';
+import { CustomComponentsContext } from './hooks/useCustomComponents/useCustomComponents.mjs';
+import '../../primitives/View/View.mjs';
+import { Router } from './Router/Router.mjs';
+import { SetupTotp } from './SetupTotp/SetupTotp.mjs';
+import { SignIn } from './SignIn/SignIn.mjs';
+import { SignUp } from './SignUp/SignUp.mjs';
+import { ForceNewPassword } from './ForceNewPassword/ForceNewPassword.mjs';
+import './ForgotPassword/ConfirmResetPassword.mjs';
+import { ResetPassword } from './ForgotPassword/ForgotPassword.mjs';
+import { defaultComponents } from './hooks/useCustomComponents/defaultComponents.mjs';
+
+// `AuthenticatorInternal` exists to give access to the context returned via `useAuthenticator`,
+// which allows the `Authenticator` to just return `children` if a user is authenticated.
+// Once the `Provider` is removed from the `Authenticator` component and exported as
+// `AuthenticatorProvider`, this component should be renamed to `Authenticator`.
+function AuthenticatorInternal({ children, className, components: customComponents, formFields, hideSignUp, initialState, loginMechanisms, passwordSettings, signUpAttributes, services, socialProviders, variation, }) {
+    useDeprecationWarning({
+        message: 'The `passwordSettings` prop has been deprecated and will be removed in a future major version of Amplify UI.',
+        // shouldWarn: !!passwordSettings,
+        /**
+         * @migration turn off until getConfig returns zero config
+         */
+        shouldWarn: false,
+    });
+    const { route, signOut, user } = useAuthenticator(({ route, signOut, user }) => [route, signOut, user]);
+    useAuthenticatorInitMachine({
+        initialState,
+        loginMechanisms,
+        passwordSettings,
+        services,
+        signUpAttributes,
+        socialProviders,
+        formFields,
+    });
+    const value = React.useMemo(() => ({ components: { ...defaultComponents, ...customComponents } }), [customComponents]);
+    const isAuthenticatedRoute = route === 'authenticated' || route === 'signOut';
+    if (isAuthenticatedRoute) {
+        // `Authenticator` might not have user defined `children` for non SPA use cases.
+        if (!children) {
+            // @ts-ignore
+            return null;
+        }
+        return (React.createElement(React.Fragment, null, isFunction(children)
+            ? children({ signOut, user }) // children is a render prop
+            : children));
+    }
+    return (React.createElement(CustomComponentsContext.Provider, { value: value },
+        React.createElement(Router, { className: className, hideSignUp: hideSignUp, variation: variation })));
+}
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/connected-components/authenticator)
+ */
+function Authenticator(props) {
+    useSetUserAgent({
+        componentName: 'Authenticator',
+        packageName: 'react',
+        version: VERSION,
+    });
+    return (React.createElement(AuthenticatorProvider, null,
+        React.createElement(AuthenticatorInternal, { ...props })));
+}
+Authenticator.Provider = AuthenticatorProvider;
+Authenticator.ResetPassword = ResetPassword;
+Authenticator.SetupTotp = SetupTotp;
+Authenticator.SignIn = SignIn;
+Authenticator.SignUp = SignUp;
+Authenticator.ForceNewPassword = ForceNewPassword;
+
+export { Authenticator, AuthenticatorInternal };

package/dist/esm/components/Authenticator/ConfirmSignIn/ConfirmSignIn.mjs

@@ -1 +1,42 @@
-import e from"react";import{authenticatorTextUtil as r}from"@aws-amplify/ui";import{Flex as o}from"../../../primitives/Flex/Flex.mjs";import{Heading as t}from"../../../primitives/Heading/Heading.mjs";import{useAuthenticator as m}from"@aws-amplify/ui-react-core";import{useCustomComponents as n}from"../hooks/useCustomComponents/useCustomComponents.mjs";import{useFormHandlers as i}from"../hooks/useFormHandlers/useFormHandlers.mjs";import{FormFields as a}from"../shared/FormFields.mjs";import{ConfirmSignInFooter as s}from"../shared/ConfirmSignInFooter.mjs";import{RemoteErrorMessage as l}from"../shared/RemoteErrorMessage.mjs";import{RouteContainer as c}from"../RouteContainer/RouteContainer.mjs";const{getChallengeText:u}=r,f=({className:r,variation:t})=>{const{isPending:u}=m((e=>[e.isPending])),{handleChange:d,handleSubmit:p}=i(),{components:{ConfirmSignIn:{Header:g=f.Header,Footer:h=f.Footer}}}=n();return e.createElement(c,{className:r,variation:t},e.createElement("form",{"data-amplify-form":"","data-amplify-authenticator-confirmsignin":"",method:"post",onChange:d,onSubmit:p},e.createElement(o,{as:"fieldset",direction:"column",isDisabled:u},e.createElement(g,null),e.createElement(o,{direction:"column"},e.createElement(a,null),e.createElement(l,null)),e.createElement(s,null),e.createElement(h,null))))};f.Header=function(){const{user:{challengeName:r}}=m((({user:e})=>[e]));return e.createElement(t,{level:3},u(r))},f.Footer=function(){return null};export{f as ConfirmSignIn};
+import React__default from 'react';
+import { authenticatorTextUtil } from '@aws-amplify/ui';
+import { Flex } from '../../../primitives/Flex/Flex.mjs';
+import { Heading } from '../../../primitives/Heading/Heading.mjs';
+import { useAuthenticator } from '@aws-amplify/ui-react-core';
+import { useCustomComponents } from '../hooks/useCustomComponents/useCustomComponents.mjs';
+import { useFormHandlers } from '../hooks/useFormHandlers/useFormHandlers.mjs';
+import { FormFields } from '../shared/FormFields.mjs';
+import { ConfirmSignInFooter } from '../shared/ConfirmSignInFooter.mjs';
+import { RemoteErrorMessage } from '../shared/RemoteErrorMessage.mjs';
+import { RouteContainer } from '../RouteContainer/RouteContainer.mjs';
+
+const { getChallengeText } = authenticatorTextUtil;
+const ConfirmSignIn = ({ className, variation, }) => {
+    const { isPending } = useAuthenticator((context) => [context.isPending]);
+    const { handleChange, handleSubmit } = useFormHandlers();
+    const { components: { 
+    // @ts-ignore
+    ConfirmSignIn: { Header = ConfirmSignIn.Header, Footer = ConfirmSignIn.Footer, }, }, } = useCustomComponents();
+    return (React__default.createElement(RouteContainer, { className: className, variation: variation },
+        React__default.createElement("form", { "data-amplify-form": "", "data-amplify-authenticator-confirmsignin": "", method: "post", onChange: handleChange, onSubmit: handleSubmit },
+            React__default.createElement(Flex, { as: "fieldset", direction: "column", isDisabled: isPending },
+                React__default.createElement(Header, null),
+                React__default.createElement(Flex, { direction: "column" },
+                    React__default.createElement(FormFields, null),
+                    React__default.createElement(RemoteErrorMessage, null)),
+                React__default.createElement(ConfirmSignInFooter, null),
+                React__default.createElement(Footer, null)))));
+};
+function Header() {
+    const { challengeName } = useAuthenticator(({ challengeName }) => [
+        challengeName,
+    ]);
+    return React__default.createElement(Heading, { level: 3 }, getChallengeText(challengeName));
+}
+ConfirmSignIn.Header = Header;
+ConfirmSignIn.Footer = function Footer() {
+    // @ts-ignore
+    return null;
+};
+
+export { ConfirmSignIn };

package/dist/esm/components/Authenticator/ConfirmSignUp/ConfirmSignUp.mjs

@@ -1 +1,51 @@
-import e from"react";import{authenticatorTextUtil as t}from"@aws-amplify/ui";import{Button as o}from"../../../primitives/Button/Button.mjs";import{Flex as r}from"../../../primitives/Flex/Flex.mjs";import{Heading as i}from"../../../primitives/Heading/Heading.mjs";import{Text as m}from"../../../primitives/Text/Text.mjs";import{useAuthenticator as n}from"@aws-amplify/ui-react-core";import{useCustomComponents as a}from"../hooks/useCustomComponents/useCustomComponents.mjs";import{useFormHandlers as s}from"../hooks/useFormHandlers/useFormHandlers.mjs";import{RemoteErrorMessage as l}from"../shared/RemoteErrorMessage.mjs";import{FormFields as c}from"../shared/FormFields.mjs";import{RouteContainer as d}from"../RouteContainer/RouteContainer.mjs";const{getDeliveryMessageText:u,getDeliveryMethodText:p,getConfirmingText:f,getConfirmText:g,getResendCodeText:C}=t;function h({className:t,variation:i}){const{isPending:p,resendCode:v,codeDeliveryDetails:y}=n((e=>[e.isPending,e.resendCode,e.codeDeliveryDetails])),{handleChange:E,handleSubmit:D}=s(),{components:{ConfirmSignUp:{Header:x=h.Header,Footer:j=h.Footer}}}=a();return e.createElement(d,{className:t,variation:i},e.createElement("form",{"data-amplify-form":"","data-amplify-authenticator-confirmsignup":"",method:"post",onChange:E,onSubmit:D},e.createElement(r,{as:"fieldset",direction:"column",isDisabled:p},e.createElement(x,null),e.createElement(r,{direction:"column"},e.createElement(m,{className:"amplify-authenticator__subtitle"},u(y)),e.createElement(c,null),e.createElement(l,null),e.createElement(o,{variation:"primary",isDisabled:p,type:"submit",loadingText:f(),isLoading:p,fontWeight:"normal"},g()),e.createElement(o,{onClick:v,type:"button",fontWeight:"normal"},C())),e.createElement(j,null))))}h.Header=()=>{const{codeDeliveryDetails:t}=n((e=>[e.codeDeliveryDetails]));return e.createElement(i,{level:4},p(t))},h.Footer=function(){return null};export{h as ConfirmSignUp};
+import React__default from 'react';
+import { authenticatorTextUtil } from '@aws-amplify/ui';
+import { Button } from '../../../primitives/Button/Button.mjs';
+import { Flex } from '../../../primitives/Flex/Flex.mjs';
+import { Heading } from '../../../primitives/Heading/Heading.mjs';
+import { Text } from '../../../primitives/Text/Text.mjs';
+import { useAuthenticator } from '@aws-amplify/ui-react-core';
+import { useCustomComponents } from '../hooks/useCustomComponents/useCustomComponents.mjs';
+import { useFormHandlers } from '../hooks/useFormHandlers/useFormHandlers.mjs';
+import { RemoteErrorMessage } from '../shared/RemoteErrorMessage.mjs';
+import { FormFields } from '../shared/FormFields.mjs';
+import { RouteContainer } from '../RouteContainer/RouteContainer.mjs';
+
+const { getDeliveryMessageText, getDeliveryMethodText, getConfirmingText, getConfirmText, getResendCodeText, } = authenticatorTextUtil;
+function ConfirmSignUp({ className, variation, }) {
+    const { isPending, resendCode, codeDeliveryDetails } = useAuthenticator((context) => [
+        context.isPending,
+        context.resendCode,
+        context.codeDeliveryDetails,
+    ]);
+    const { handleChange, handleSubmit } = useFormHandlers();
+    const { components: { 
+    // @ts-ignore
+    ConfirmSignUp: { Header = ConfirmSignUp.Header, Footer = ConfirmSignUp.Footer, }, }, } = useCustomComponents();
+    return (
+    // TODO Automatically add these namespaces again from `useAmplify`
+    React__default.createElement(RouteContainer, { className: className, variation: variation },
+        React__default.createElement("form", { "data-amplify-form": "", "data-amplify-authenticator-confirmsignup": "", method: "post", onChange: handleChange, onSubmit: handleSubmit },
+            React__default.createElement(Flex, { as: "fieldset", direction: "column", isDisabled: isPending },
+                React__default.createElement(Header, null),
+                React__default.createElement(Flex, { direction: "column" },
+                    React__default.createElement(Text, { className: "amplify-authenticator__subtitle" }, getDeliveryMessageText(codeDeliveryDetails)),
+                    React__default.createElement(FormFields, null),
+                    React__default.createElement(RemoteErrorMessage, null),
+                    React__default.createElement(Button, { variation: "primary", isDisabled: isPending, type: "submit", loadingText: getConfirmingText(), isLoading: isPending, fontWeight: "normal" }, getConfirmText()),
+                    React__default.createElement(Button, { onClick: resendCode, type: "button", fontWeight: "normal" }, getResendCodeText())),
+                React__default.createElement(Footer, null)))));
+}
+const DefaultHeader = () => {
+    const { codeDeliveryDetails } = useAuthenticator((context) => [
+        context.codeDeliveryDetails,
+    ]);
+    return (React__default.createElement(Heading, { level: 4 }, getDeliveryMethodText(codeDeliveryDetails)));
+};
+ConfirmSignUp.Header = DefaultHeader;
+ConfirmSignUp.Footer = function Footer() {
+    // @ts-ignore
+    return null;
+};
+
+export { ConfirmSignUp };

package/dist/esm/components/Authenticator/FederatedSignIn/FederatedSignIn.mjs

@@ -1 +1,34 @@
-import e from"react";import{FederatedIdentityProviders as t,authenticatorTextUtil as o}from"@aws-amplify/ui";import{Divider as r}from"../../../primitives/Divider/Divider.mjs";import{Flex as i}from"../../../primitives/Flex/Flex.mjs";import{useAuthenticator as a}from"@aws-amplify/ui-react-core";import{FederatedSignInButton as n}from"./FederatedSignInButtons/FederatedSignInButton.mjs";const{getSignInWithFederationText:m,getOrText:s}=o;function c(){const{route:o,socialProviders:c}=a((({route:e,socialProviders:t})=>[e,t]));return 0===c.length?null:e.createElement(i,{direction:"column",padding:"0 0 1rem 0",className:"federated-sign-in-container"},c.map((r=>{switch(r){case"amazon":return e.createElement(n,{icon:"amazon",key:r,provider:t.Amazon,text:m(o,r)});case"apple":return e.createElement(n,{icon:"apple",key:r,provider:t.Apple,text:m(o,r)});case"facebook":return e.createElement(n,{icon:"facebook",key:r,provider:t.Facebook,text:m(o,r)});case"google":return e.createElement(n,{icon:"google",key:r,provider:t.Google,text:m(o,r)});default:console.error(`Authenticator does not support ${r}. Please open an issue: https://github.com/aws-amplify/amplify-ui/issues/choose`)}})),e.createElement(r,{size:"small",label:s()}))}export{c as FederatedSignIn};
+import React__default from 'react';
+import { FederatedIdentityProviders, authenticatorTextUtil } from '@aws-amplify/ui';
+import { Divider } from '../../../primitives/Divider/Divider.mjs';
+import { Flex } from '../../../primitives/Flex/Flex.mjs';
+import { useAuthenticator } from '@aws-amplify/ui-react-core';
+import { FederatedSignInButton } from './FederatedSignInButtons/FederatedSignInButton.mjs';
+
+const { getSignInWithFederationText, getOrText } = authenticatorTextUtil;
+function FederatedSignIn() {
+    const { route, socialProviders } = useAuthenticator(({ route, socialProviders }) => [route, socialProviders]);
+    if (socialProviders.length === 0) {
+        // @ts-ignore
+        return null;
+    }
+    return (React__default.createElement(Flex, { direction: "column", padding: `0 0 1rem 0`, className: "federated-sign-in-container" },
+        socialProviders.map((provider) => {
+            switch (provider) {
+                case 'amazon':
+                    return (React__default.createElement(FederatedSignInButton, { icon: "amazon", key: provider, provider: FederatedIdentityProviders.Amazon, text: getSignInWithFederationText(route, provider) }));
+                case 'apple':
+                    return (React__default.createElement(FederatedSignInButton, { icon: "apple", key: provider, provider: FederatedIdentityProviders.Apple, text: getSignInWithFederationText(route, provider) }));
+                case 'facebook':
+                    return (React__default.createElement(FederatedSignInButton, { icon: "facebook", key: provider, provider: FederatedIdentityProviders.Facebook, text: getSignInWithFederationText(route, provider) }));
+                case 'google':
+                    return (React__default.createElement(FederatedSignInButton, { icon: "google", key: provider, provider: FederatedIdentityProviders.Google, text: getSignInWithFederationText(route, provider) }));
+                default:
+                    // eslint-disable-next-line no-console
+                    console.error(`Authenticator does not support ${provider}. Please open an issue: https://github.com/aws-amplify/amplify-ui/issues/choose`);
+            }
+        }),
+        React__default.createElement(Divider, { size: "small", label: getOrText() })));
+}
+
+export { FederatedSignIn };

package/dist/esm/components/Authenticator/FederatedSignIn/FederatedSignInButtons/FederatedSignInButton.mjs

@@ -1 +1,54 @@
-import e from"react";import{useAuthenticator as t}from"@aws-amplify/ui-react-core";import{Button as i}from"../../../../primitives/Button/Button.mjs";import{Icon as l}from"../../../../primitives/Icon/Icon.mjs";import"../../../../primitives/Icon/context/IconsContext.mjs";import"tslib";import"classnames";import"../../../../primitives/shared/constants.mjs";import"../../../../primitives/View/View.mjs";import{Text as a}from"../../../../primitives/Text/Text.mjs";const n=()=>e.createElement("svg",{"aria-label":"Apple icon",className:"amplify-icon federated-sign-in-icon",fill:"#000",preserveAspectRatio:"xMidYMid",stroke:"#000",strokeWidth:"0",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg"},e.createElement("path",{d:"M747.4 535.7c-.4-68.2 30.5-119.6 92.9-157.5-34.9-50-87.7-77.5-157.3-82.8-65.9-5.2-138 38.4-164.4 38.4-27.9 0-91.7-36.6-141.9-36.6C273.1 298.8 163 379.8 163 544.6c0 48.7 8.9 99 26.7 150.8 23.8 68.2 109.6 235.3 199.1 232.6 46.8-1.1 79.9-33.2 140.8-33.2 59.1 0 89.7 33.2 141.9 33.2 90.3-1.3 167.9-153.2 190.5-221.6-121.1-57.1-114.6-167.2-114.6-170.7zm-105.1-305c50.7-60.2 46.1-115 44.6-134.7-44.8 2.6-96.6 30.5-126.1 64.8-32.5 36.8-51.6 82.3-47.5 133.6 48.4 3.7 92.6-21.2 129-63.7z"})),r=()=>e.createElement("svg",{"aria-label":"Google icon",className:"amplify-icon federated-sign-in-icon",viewBox:"0 0 256 262",xmlns:"http://www.w3.org/2000/svg",preserveAspectRatio:"xMidYMid"},e.createElement("path",{d:"M255.878 133.451c0-10.734-.871-18.567-2.756-26.69H130.55v48.448h71.947c-1.45 12.04-9.283 30.172-26.69 42.356l-.244 1.622 38.755 30.023 2.685.268c24.659-22.774 38.875-56.282 38.875-96.027",fill:"#4285F4"}),e.createElement("path",{d:"M130.55 261.1c35.248 0 64.839-11.605 86.453-31.622l-41.196-31.913c-11.024 7.688-25.82 13.055-45.257 13.055-34.523 0-63.824-22.773-74.269-54.25l-1.531.13-40.298 31.187-.527 1.465C35.393 231.798 79.49 261.1 130.55 261.1",fill:"#34A853"}),e.createElement("path",{d:"M56.281 156.37c-2.756-8.123-4.351-16.827-4.351-25.82 0-8.994 1.595-17.697 4.206-25.82l-.073-1.73L15.26 71.312l-1.335.635C5.077 89.644 0 109.517 0 130.55s5.077 40.905 13.925 58.602l42.356-32.782",fill:"#FBBC05"}),e.createElement("path",{d:"M130.55 50.479c24.514 0 41.05 10.589 50.479 19.438l36.844-35.974C195.245 12.91 165.798 0 130.55 0 79.49 0 35.393 29.301 13.925 71.947l42.211 32.783c10.59-31.477 39.891-54.251 74.414-54.251",fill:"#EB4335"})),o=()=>e.createElement(l,{className:"federated-sign-in-icon",ariaLabel:"Facebook icon",viewBox:{minX:0,minY:0,width:279,height:538},pathData:"M82.3409742,538 L82.3409742,292.936652 L0,292.936652 L0,196.990154 L82.2410458,196.990154 L82.2410458,126.4295 C82.2410458,44.575144 132.205229,0 205.252865,0 C240.227794,0 270.306232,2.59855099 279,3.79788222 L279,89.2502322 L228.536175,89.2502322 C188.964542,89.2502322 181.270057,108.139699 181.270057,135.824262 L181.270057,196.89021 L276.202006,196.89021 L263.810888,292.836708 L181.16913,292.836708 L181.16913,538 L82.3409742,538 Z",fill:"#1877F2"}),c=()=>e.createElement("svg",{"aria-label":"Amazon icon",className:"amplify-icon federated-sign-in-icon",viewBox:"0 0 243 264",xmlns:"http://www.w3.org/2000/svg",preserveAspectRatio:"xMidYMid"},e.createElement("path",{d:"M230.826 208.039C227.468 203.683 208.551 205.982 200.056 206.998C197.471 207.321 197.076 205.042 199.407 203.405C214.475 192.665 239.201 195.766 242.082 199.364C244.966 202.982 241.337 228.071 227.173 240.049C225.001 241.888 222.93 240.904 223.898 238.468C227.077 230.431 234.205 212.419 230.826 208.039ZM123.769 264C71.0234 264 39.0764 241.955 14.7853 217.542C9.97339 212.706 3.71799 206.296 0.311513 200.691C-1.09773 198.372 2.59096 195.022 5.04421 196.844C35.239 219.268 79.1012 239.538 122.53 239.538C151.82 239.538 188.046 227.47 217.669 214.868C222.147 212.966 222.147 219.18 221.512 221.061C221.183 222.032 206.515 236.221 186.247 247.047C167.304 257.166 143.397 264 123.769 264Z",fill:"#F2541B"}),e.createElement("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M142.943 111.185C142.943 124.756 143.268 136.054 136.406 148.123C130.856 157.913 122.027 163.95 112.222 163.95C98.8288 163.95 90.9806 153.772 90.9806 138.693C90.9806 109.036 117.677 103.647 142.943 103.647V111.185ZM178.166 196.081C175.858 198.15 171.635 198.22 169.914 196.894C157.974 187.684 149.89 173.688 149.89 173.688C130.706 193.156 117.127 199 92.2879 199C62.8772 199 40 180.905 40 144.729C40 116.461 55.3552 97.2408 77.2563 87.823C96.2094 79.5256 122.684 78.0173 142.943 75.7517C142.943 75.7517 144.633 53.933 138.699 45.9806C134.098 39.8163 126.272 36.9329 119.089 36.9329C106.127 36.8829 93.61 43.9051 91.1262 57.4188C90.4136 61.2829 87.5533 64.5261 84.54 64.206L51.0823 60.5922C48.5156 60.2951 45.0381 57.6639 45.8636 53.3081C53.644 12.3684 90.7373 0 123.989 0C140.983 0 163.21 4.51651 176.608 17.3349C193.597 33.1648 191.969 54.2755 191.969 77.2722V131.51C191.969 147.835 198.768 154.987 205.151 163.775C207.376 166.953 207.886 170.714 205.04 173.032C197.902 178.999 178.166 196.081 178.166 196.081Z",fill:"#F2541B"})),m=l=>{const{icon:m,provider:s,text:p}=l,{toFederatedSignIn:C}=t();let d;return"facebook"===m?d=e.createElement(o,null):"google"===m?d=e.createElement(r,null):"amazon"===m?d=e.createElement(c,null):"apple"===m&&(d=e.createElement(n,null)),e.createElement(i,{onClick:e=>{e.preventDefault(),C({provider:s})},className:"federated-sign-in-button",fontWeight:"normal",gap:"1rem"},d,e.createElement(a,{as:"span"},p))};export{m as FederatedSignInButton};
+import React__default from 'react';
+import { useAuthenticator } from '@aws-amplify/ui-react-core';
+import { Button } from '../../../../primitives/Button/Button.mjs';
+import { Icon } from '../../../../primitives/Icon/Icon.mjs';
+import '../../../../primitives/Icon/context/IconsContext.mjs';
+import '@aws-amplify/ui';
+import '../../../../primitives/View/View.mjs';
+import { Text } from '../../../../primitives/Text/Text.mjs';
+
+const AppleIcon = () => {
+    return (React__default.createElement("svg", { "aria-label": "Apple icon", className: "amplify-icon federated-sign-in-icon", fill: "#000", preserveAspectRatio: "xMidYMid", stroke: "#000", strokeWidth: "0", viewBox: "0 0 1024 1024", xmlns: "http://www.w3.org/2000/svg" },
+        React__default.createElement("path", { d: "M747.4 535.7c-.4-68.2 30.5-119.6 92.9-157.5-34.9-50-87.7-77.5-157.3-82.8-65.9-5.2-138 38.4-164.4 38.4-27.9 0-91.7-36.6-141.9-36.6C273.1 298.8 163 379.8 163 544.6c0 48.7 8.9 99 26.7 150.8 23.8 68.2 109.6 235.3 199.1 232.6 46.8-1.1 79.9-33.2 140.8-33.2 59.1 0 89.7 33.2 141.9 33.2 90.3-1.3 167.9-153.2 190.5-221.6-121.1-57.1-114.6-167.2-114.6-170.7zm-105.1-305c50.7-60.2 46.1-115 44.6-134.7-44.8 2.6-96.6 30.5-126.1 64.8-32.5 36.8-51.6 82.3-47.5 133.6 48.4 3.7 92.6-21.2 129-63.7z" })));
+};
+const GoogleIcon = () => {
+    return (React__default.createElement("svg", { "aria-label": "Google icon", className: "amplify-icon federated-sign-in-icon", viewBox: "0 0 256 262", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "xMidYMid" },
+        React__default.createElement("path", { d: "M255.878 133.451c0-10.734-.871-18.567-2.756-26.69H130.55v48.448h71.947c-1.45 12.04-9.283 30.172-26.69 42.356l-.244 1.622 38.755 30.023 2.685.268c24.659-22.774 38.875-56.282 38.875-96.027", fill: "#4285F4" }),
+        React__default.createElement("path", { d: "M130.55 261.1c35.248 0 64.839-11.605 86.453-31.622l-41.196-31.913c-11.024 7.688-25.82 13.055-45.257 13.055-34.523 0-63.824-22.773-74.269-54.25l-1.531.13-40.298 31.187-.527 1.465C35.393 231.798 79.49 261.1 130.55 261.1", fill: "#34A853" }),
+        React__default.createElement("path", { d: "M56.281 156.37c-2.756-8.123-4.351-16.827-4.351-25.82 0-8.994 1.595-17.697 4.206-25.82l-.073-1.73L15.26 71.312l-1.335.635C5.077 89.644 0 109.517 0 130.55s5.077 40.905 13.925 58.602l42.356-32.782", fill: "#FBBC05" }),
+        React__default.createElement("path", { d: "M130.55 50.479c24.514 0 41.05 10.589 50.479 19.438l36.844-35.974C195.245 12.91 165.798 0 130.55 0 79.49 0 35.393 29.301 13.925 71.947l42.211 32.783c10.59-31.477 39.891-54.251 74.414-54.251", fill: "#EB4335" })));
+};
+const FacebookIcon = () => {
+    return (React__default.createElement(Icon, { className: "federated-sign-in-icon", ariaLabel: "Facebook icon", viewBox: { minX: 0, minY: 0, width: 279, height: 538 }, pathData: "M82.3409742,538 L82.3409742,292.936652 L0,292.936652 L0,196.990154 L82.2410458,196.990154 L82.2410458,126.4295 C82.2410458,44.575144 132.205229,0 205.252865,0 C240.227794,0 270.306232,2.59855099 279,3.79788222 L279,89.2502322 L228.536175,89.2502322 C188.964542,89.2502322 181.270057,108.139699 181.270057,135.824262 L181.270057,196.89021 L276.202006,196.89021 L263.810888,292.836708 L181.16913,292.836708 L181.16913,538 L82.3409742,538 Z", fill: "#1877F2" }));
+};
+const AmazonIcon = () => {
+    return (React__default.createElement("svg", { "aria-label": "Amazon icon", className: "amplify-icon federated-sign-in-icon", viewBox: "0 0 243 264", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "xMidYMid" },
+        React__default.createElement("path", { d: "M230.826 208.039C227.468 203.683 208.551 205.982 200.056 206.998C197.471 207.321 197.076 205.042 199.407 203.405C214.475 192.665 239.201 195.766 242.082 199.364C244.966 202.982 241.337 228.071 227.173 240.049C225.001 241.888 222.93 240.904 223.898 238.468C227.077 230.431 234.205 212.419 230.826 208.039ZM123.769 264C71.0234 264 39.0764 241.955 14.7853 217.542C9.97339 212.706 3.71799 206.296 0.311513 200.691C-1.09773 198.372 2.59096 195.022 5.04421 196.844C35.239 219.268 79.1012 239.538 122.53 239.538C151.82 239.538 188.046 227.47 217.669 214.868C222.147 212.966 222.147 219.18 221.512 221.061C221.183 222.032 206.515 236.221 186.247 247.047C167.304 257.166 143.397 264 123.769 264Z", fill: "#F2541B" }),
+        React__default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M142.943 111.185C142.943 124.756 143.268 136.054 136.406 148.123C130.856 157.913 122.027 163.95 112.222 163.95C98.8288 163.95 90.9806 153.772 90.9806 138.693C90.9806 109.036 117.677 103.647 142.943 103.647V111.185ZM178.166 196.081C175.858 198.15 171.635 198.22 169.914 196.894C157.974 187.684 149.89 173.688 149.89 173.688C130.706 193.156 117.127 199 92.2879 199C62.8772 199 40 180.905 40 144.729C40 116.461 55.3552 97.2408 77.2563 87.823C96.2094 79.5256 122.684 78.0173 142.943 75.7517C142.943 75.7517 144.633 53.933 138.699 45.9806C134.098 39.8163 126.272 36.9329 119.089 36.9329C106.127 36.8829 93.61 43.9051 91.1262 57.4188C90.4136 61.2829 87.5533 64.5261 84.54 64.206L51.0823 60.5922C48.5156 60.2951 45.0381 57.6639 45.8636 53.3081C53.644 12.3684 90.7373 0 123.989 0C140.983 0 163.21 4.51651 176.608 17.3349C193.597 33.1648 191.969 54.2755 191.969 77.2722V131.51C191.969 147.835 198.768 154.987 205.151 163.775C207.376 166.953 207.886 170.714 205.04 173.032C197.902 178.999 178.166 196.081 178.166 196.081Z", fill: "#F2541B" })));
+};
+const FederatedSignInButton = (props) => {
+    const { icon, provider, text } = props;
+    const { toFederatedSignIn } = useAuthenticator();
+    const handleClick = (event) => {
+        event.preventDefault();
+        toFederatedSignIn({ provider });
+    };
+    let iconComponent;
+    if (icon === 'facebook') {
+        iconComponent = React__default.createElement(FacebookIcon, null);
+    }
+    else if (icon === 'google') {
+        iconComponent = React__default.createElement(GoogleIcon, null);
+    }
+    else if (icon === 'amazon') {
+        iconComponent = React__default.createElement(AmazonIcon, null);
+    }
+    else if (icon === 'apple') {
+        iconComponent = React__default.createElement(AppleIcon, null);
+    }
+    return (React__default.createElement(Button, { onClick: handleClick, className: "federated-sign-in-button", fontWeight: "normal", gap: "1rem" },
+        iconComponent,
+        React__default.createElement(Text, { as: "span" }, text)));
+};
+
+export { FederatedSignInButton };

package/dist/esm/components/Authenticator/ForceNewPassword/ForceNewPassword.mjs

@@ -1 +1,43 @@
-import e from"react";import{authenticatorTextUtil as t}from"@aws-amplify/ui";import{Button as o}from"../../../primitives/Button/Button.mjs";import{Flex as r}from"../../../primitives/Flex/Flex.mjs";import{Heading as n}from"../../../primitives/Heading/Heading.mjs";import{RemoteErrorMessage as i}from"../shared/RemoteErrorMessage.mjs";import{useAuthenticator as m}from"@aws-amplify/ui-react-core";import{useCustomComponents as a}from"../hooks/useCustomComponents/useCustomComponents.mjs";import{useFormHandlers as s}from"../hooks/useFormHandlers/useFormHandlers.mjs";import{FormFields as l}from"../shared/FormFields.mjs";import{RouteContainer as u}from"../RouteContainer/RouteContainer.mjs";const{getChangePasswordText:d,getChangingText:c,getBackToSignInText:p}=t,f=({className:t,variation:n})=>{const{isPending:l,toSignIn:g}=m((e=>[e.isPending,e.toSignIn])),{handleBlur:F,handleChange:h,handleSubmit:E}=s(),{components:{ForceNewPassword:{FormFields:C=f.FormFields,Header:j=f.Header,Footer:v=f.Footer}}}=a();return e.createElement(u,{className:t,variation:n},e.createElement("form",{"data-amplify-form":"","data-amplify-authenticator-forcenewpassword":"",method:"post",onChange:h,onSubmit:E,onBlur:F},e.createElement(r,{as:"fieldset",direction:"column",isDisabled:l},e.createElement(j,null),e.createElement(C,null),e.createElement(i,null),e.createElement(o,{isDisabled:l,type:"submit",variation:"primary",isLoading:l,loadingText:c(),fontWeight:"normal"},d()),e.createElement(o,{onClick:g,type:"button",fontWeight:"normal",variation:"link",size:"small"},p()),e.createElement(v,null))))};f.FormFields=function(){return e.createElement(l,null)},f.Header=function(){return e.createElement(n,{level:4},d())},f.Footer=function(){return null};export{f as ForceNewPassword};
+import React__default from 'react';
+import { authenticatorTextUtil } from '@aws-amplify/ui';
+import { Button } from '../../../primitives/Button/Button.mjs';
+import { Flex } from '../../../primitives/Flex/Flex.mjs';
+import { Heading } from '../../../primitives/Heading/Heading.mjs';
+import { RemoteErrorMessage } from '../shared/RemoteErrorMessage.mjs';
+import { useAuthenticator } from '@aws-amplify/ui-react-core';
+import { useCustomComponents } from '../hooks/useCustomComponents/useCustomComponents.mjs';
+import { useFormHandlers } from '../hooks/useFormHandlers/useFormHandlers.mjs';
+import { FormFields } from '../shared/FormFields.mjs';
+import { RouteContainer } from '../RouteContainer/RouteContainer.mjs';
+
+const { getChangePasswordText, getChangingText, getBackToSignInText } = authenticatorTextUtil;
+const ForceNewPassword = ({ className, variation, }) => {
+    const { isPending, toSignIn } = useAuthenticator((context) => [
+        context.isPending,
+        context.toSignIn,
+    ]);
+    const { handleBlur, handleChange, handleSubmit } = useFormHandlers();
+    const { components: { 
+    // @ts-ignore
+    ForceNewPassword: { FormFields = ForceNewPassword.FormFields, Header = ForceNewPassword.Header, Footer = ForceNewPassword.Footer, }, }, } = useCustomComponents();
+    return (React__default.createElement(RouteContainer, { className: className, variation: variation },
+        React__default.createElement("form", { "data-amplify-form": "", "data-amplify-authenticator-forcenewpassword": "", method: "post", onChange: handleChange, onSubmit: handleSubmit, onBlur: handleBlur },
+            React__default.createElement(Flex, { as: "fieldset", direction: "column", isDisabled: isPending },
+                React__default.createElement(Header, null),
+                React__default.createElement(FormFields, null),
+                React__default.createElement(RemoteErrorMessage, null),
+                React__default.createElement(Button, { isDisabled: isPending, type: "submit", variation: "primary", isLoading: isPending, loadingText: getChangingText(), fontWeight: "normal" }, getChangePasswordText()),
+                React__default.createElement(Button, { onClick: toSignIn, type: "button", fontWeight: "normal", variation: "link", size: "small" }, getBackToSignInText()),
+                React__default.createElement(Footer, null)))));
+};
+ForceNewPassword.FormFields = function FormFields$1() {
+    return React__default.createElement(FormFields, null);
+};
+ForceNewPassword.Header = function Header() {
+    return React__default.createElement(Heading, { level: 4 }, getChangePasswordText());
+};
+ForceNewPassword.Footer = function Footer() {
+    return null;
+};
+
+export { ForceNewPassword };

package/dist/esm/components/Authenticator/ForgotPassword/ConfirmResetPassword.mjs

@@ -0,0 +1,39 @@
+import React__default from 'react';
+import { authenticatorTextUtil } from '@aws-amplify/ui';
+import { Flex } from '../../../primitives/Flex/Flex.mjs';
+import { Heading } from '../../../primitives/Heading/Heading.mjs';
+import { useAuthenticator } from '@aws-amplify/ui-react-core';
+import { useCustomComponents } from '../hooks/useCustomComponents/useCustomComponents.mjs';
+import { useFormHandlers } from '../hooks/useFormHandlers/useFormHandlers.mjs';
+import { RemoteErrorMessage } from '../shared/RemoteErrorMessage.mjs';
+import { TwoButtonSubmitFooter } from '../shared/TwoButtonSubmitFooter.mjs';
+import { FormFields } from '../shared/FormFields.mjs';
+import { RouteContainer } from '../RouteContainer/RouteContainer.mjs';
+
+const { getResendCodeText, getResetYourPasswordText } = authenticatorTextUtil;
+const ConfirmResetPassword = ({ className, variation, }) => {
+    const { isPending } = useAuthenticator((context) => [context.isPending]);
+    const { handleBlur, handleChange, handleSubmit } = useFormHandlers();
+    const { components: { 
+    // @ts-ignore
+    ConfirmResetPassword: { Header = ConfirmResetPassword.Header, Footer = ConfirmResetPassword.Footer, }, }, } = useCustomComponents();
+    return (React__default.createElement(RouteContainer, { className: className, variation: variation },
+        React__default.createElement("form", { "data-amplify-form": "", "data-amplify-authenticator-confirmresetpassword": "", method: "post", onSubmit: handleSubmit, onChange: handleChange, onBlur: handleBlur },
+            React__default.createElement(Flex, { as: "fieldset", direction: "column", isDisabled: isPending },
+                React__default.createElement(Header, null),
+                React__default.createElement(Flex, { direction: "column" },
+                    React__default.createElement(FormFields, null)),
+                React__default.createElement(RemoteErrorMessage, null),
+                React__default.createElement(TwoButtonSubmitFooter, { cancelButtonSendType: "RESEND", cancelButtonText: getResendCodeText() }),
+                React__default.createElement(Footer, null)))));
+};
+ConfirmResetPassword.Header = function Header() {
+    const headerText = getResetYourPasswordText();
+    return React__default.createElement(Heading, { level: 3 }, headerText);
+};
+ConfirmResetPassword.Footer = function Footer() {
+    // @ts-ignore
+    return null;
+};
+
+export { ConfirmResetPassword };

package/dist/esm/components/Authenticator/ForgotPassword/ForgotPassword.mjs

@@ -0,0 +1,40 @@
+import React__default from 'react';
+import { authenticatorTextUtil } from '@aws-amplify/ui';
+import { Flex } from '../../../primitives/Flex/Flex.mjs';
+import { Heading } from '../../../primitives/Heading/Heading.mjs';
+import { useAuthenticator } from '@aws-amplify/ui-react-core';
+import { useCustomComponents } from '../hooks/useCustomComponents/useCustomComponents.mjs';
+import { useFormHandlers } from '../hooks/useFormHandlers/useFormHandlers.mjs';
+import { RemoteErrorMessage } from '../shared/RemoteErrorMessage.mjs';
+import { TwoButtonSubmitFooter } from '../shared/TwoButtonSubmitFooter.mjs';
+import { FormFields } from '../shared/FormFields.mjs';
+import { RouteContainer } from '../RouteContainer/RouteContainer.mjs';
+
+const { getBackToSignInText, getSendingText, getSendCodeText, getResetYourPasswordText, } = authenticatorTextUtil;
+const ResetPassword = ({ className, variation, }) => {
+    const { isPending } = useAuthenticator((context) => [context.isPending]);
+    const { handleChange, handleSubmit } = useFormHandlers();
+    const { components: { 
+    // @ts-ignore
+    ResetPassword: { Header = ResetPassword.Header, Footer = ResetPassword.Footer, }, }, } = useCustomComponents();
+    return (React__default.createElement(RouteContainer, { className: className, variation: variation },
+        React__default.createElement("form", { "data-amplify-form": "", "data-amplify-authenticator-resetpassword": "", method: "post", onChange: handleChange, onSubmit: handleSubmit },
+            React__default.createElement(Flex, { as: "fieldset", direction: "column", isDisabled: isPending },
+                React__default.createElement(Header, null),
+                React__default.createElement(Flex, { direction: "column" },
+                    React__default.createElement(FormFields, null)),
+                React__default.createElement(RemoteErrorMessage, null),
+                React__default.createElement(TwoButtonSubmitFooter, { cancelButtonText: getBackToSignInText(), cancelButtonSendType: "SIGN_IN", submitButtonText: isPending ? (React__default.createElement(React__default.Fragment, null,
+                        getSendingText(),
+                        "\u2026")) : (React__default.createElement(React__default.Fragment, null, getSendCodeText())) }),
+                React__default.createElement(Footer, null)))));
+};
+ResetPassword.Header = function Header() {
+    return React__default.createElement(Heading, { level: 3 }, getResetYourPasswordText());
+};
+ResetPassword.Footer = function Footer() {
+    // @ts-ignore
+    return null;
+};
+
+export { ResetPassword };

package/dist/esm/components/Authenticator/RouteContainer/RouteContainer.mjs

@@ -1 +1,26 @@
-import e from"react";import{View as t}from"../../../primitives/View/View.mjs";import{useAuthenticator as a}from"@aws-amplify/ui-react-core";import{useCustomComponents as o}from"../hooks/useCustomComponents/useCustomComponents.mjs";const r=e=>"signIn"===e||"signUp";function n({children:n,className:m,variation:i="default"}){const{route:s}=a((({route:e})=>[e])),{components:{Header:c,Footer:l}}=o();return e.createElement(t,{className:m,"data-amplify-authenticator":"","data-variation":i},e.createElement(t,{"data-amplify-container":""},e.createElement(c,null),e.createElement(t,{"data-amplify-router":"","data-amplify-router-content":r(s)?void 0:""},n),e.createElement(l,null)))}export{n as RouteContainer};
+import React__default from 'react';
+import { View } from '../../../primitives/View/View.mjs';
+import { useAuthenticator } from '@aws-amplify/ui-react-core';
+import { useCustomComponents } from '../hooks/useCustomComponents/useCustomComponents.mjs';
+
+// TODO replace usage of this util with the `isSignInOrSignUpRoute` util in v3.
+// Currently `hasTabs` always returns `undefined` as the right condition always
+// resolves to truthy. This prevents the "data-amplify-router-content" attribute
+// from being applied below. Fixing it will cause consumer snapshot tests to break,
+// so wait to update.
+const hasTabs = (route) => {
+    return route === 'signIn' || 'signUp';
+};
+function RouteContainer({ children, className, variation = 'default', }) {
+    const { route } = useAuthenticator(({ route }) => [route]);
+    const { 
+    // @ts-ignore
+    components: { Header, Footer }, } = useCustomComponents();
+    return (React__default.createElement(View, { className: className, "data-amplify-authenticator": "", "data-variation": variation },
+        React__default.createElement(View, { "data-amplify-container": "" },
+            React__default.createElement(Header, null),
+            React__default.createElement(View, { "data-amplify-router": "", "data-amplify-router-content": hasTabs(route) ? undefined : '' }, children),
+            React__default.createElement(Footer, null))));
+}
+
+export { RouteContainer };

package/dist/esm/components/Authenticator/Router/Router.mjs

@@ -1 +1,63 @@
-import r,{useMemo as e}from"react";import{useAuthenticator as s}from"@aws-amplify/ui-react-core";import{ConfirmSignUp as i}from"../ConfirmSignUp/ConfirmSignUp.mjs";import{ForceNewPassword as t}from"../ForceNewPassword/ForceNewPassword.mjs";import{SetupTOTP as o}from"../SetupTOTP/SetupTOTP.mjs";import"@aws-amplify/ui";import"../../../primitives/TextField/TextField.mjs";import"../../../primitives/Button/Button.mjs";import"../../../primitives/Flex/Flex.mjs";import"../../../primitives/Alert/Alert.mjs";import{SignInSignUpTabs as m}from"../shared/SignInSignUpTabs.mjs";import{ConfirmVerifyUser as n}from"../VerifyUser/ConfirmVerifyUser.mjs";import{VerifyUser as a}from"../VerifyUser/VerifyUser.mjs";import{ConfirmSignIn as p}from"../ConfirmSignIn/ConfirmSignIn.mjs";import{ConfirmResetPassword as c}from"../ResetPassword/ConfirmResetPassword.mjs";import{ResetPassword as f}from"../ResetPassword/ResetPassword.mjs";import{isSignInOrSignUpRoute as u}from"../utils.mjs";function d(){return null}function l({className:l,hideSignUp:w,variation:j}){const{route:U}=s((({route:r})=>[r])),g=e((()=>(r=>{switch(r){case"authenticated":case"idle":case"setup":case"transition":return d;case"confirmSignUp":return i;case"confirmSignIn":return p;case"setupTOTP":return o;case"signIn":case"signUp":return m;case"forceNewPassword":return t;case"resetPassword":return f;case"confirmResetPassword":return c;case"verifyUser":return a;case"confirmVerifyUser":return n;default:return console.warn(`Unhandled Authenticator route - please open an issue: ${r}`),d}})(U)),[U]);return r.createElement(g,{className:l,hideSignUp:u(U)?w:void 0,variation:j})}export{l as Router};
+import React__default, { useMemo } from 'react';
+import { useAuthenticator } from '@aws-amplify/ui-react-core';
+import { ConfirmSignUp } from '../ConfirmSignUp/ConfirmSignUp.mjs';
+import { ForceNewPassword } from '../ForceNewPassword/ForceNewPassword.mjs';
+import { SetupTotp } from '../SetupTotp/SetupTotp.mjs';
+import '@aws-amplify/ui';
+import '../../../primitives/TextField/TextField.mjs';
+import '../../../primitives/Button/Button.mjs';
+import '../../../primitives/Flex/Flex.mjs';
+import '../../../primitives/Alert/Alert.mjs';
+import { SignInSignUpTabs } from '../shared/SignInSignUpTabs.mjs';
+import { ConfirmVerifyUser } from '../VerifyUser/ConfirmVerifyUser.mjs';
+import { VerifyUser } from '../VerifyUser/VerifyUser.mjs';
+import { ConfirmSignIn } from '../ConfirmSignIn/ConfirmSignIn.mjs';
+import { ConfirmResetPassword } from '../ForgotPassword/ConfirmResetPassword.mjs';
+import { ResetPassword } from '../ForgotPassword/ForgotPassword.mjs';
+import { isSignInOrSignUpRoute } from '../utils.mjs';
+
+function RenderNothing() {
+    // @ts-ignore
+    return null;
+}
+const getRouteComponent = (route) => {
+    switch (route) {
+        case 'authenticated':
+        case 'idle':
+        case 'setup':
+        case 'transition':
+            return RenderNothing;
+        case 'confirmSignUp':
+            return ConfirmSignUp;
+        case 'confirmSignIn':
+            return ConfirmSignIn;
+        case 'setupTotp':
+            return SetupTotp;
+        case 'signIn':
+        case 'signUp':
+            return SignInSignUpTabs;
+        case 'forceNewPassword':
+            return ForceNewPassword;
+        case 'forgotPassword':
+            return ResetPassword;
+        case 'confirmResetPassword':
+            return ConfirmResetPassword;
+        case 'verifyUser':
+            return VerifyUser;
+        case 'confirmVerifyUser':
+            return ConfirmVerifyUser;
+        default:
+            // eslint-disable-next-line no-console
+            console.warn(`Unhandled Authenticator route - please open an issue: ${route}`);
+            return RenderNothing;
+    }
+};
+function Router({ className, hideSignUp, variation, }) {
+    const { route } = useAuthenticator(({ route }) => [route]);
+    const RouterChildren = useMemo(() => getRouteComponent(route), [route]);
+    return (React__default.createElement(RouterChildren, { className: className, 
+        // @ts-ignore
+        hideSignUp: isSignInOrSignUpRoute(route) ? hideSignUp : undefined, variation: variation }));
+}
+
+export { Router };