@ttoss/react-auth 1.6.41 → 1.7.0

package/dist/esm/index.js

@@ -76,7 +76,7 @@ var useAuth = () => {
 };
 
 // src/Auth.tsx
-import * as React5 from "react";
+import * as React6 from "react";
 import { Auth as AmplifyAuth } from "aws-amplify";
 
 // src/AuthCard.tsx
@@ -236,32 +236,115 @@ var AuthConfirmSignUp = ({
   });
 };
 
-// src/AuthFullScreen.tsx
-import { Flex as Flex2 } from "@ttoss/ui";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var AuthFullScreen = ({
-  children
+// src/AuthForgotPassword.tsx
+import { Button as Button2, Link, Text } from "@ttoss/ui";
+import { Form as Form2, FormFieldInput as FormFieldInput2, useForm as useForm2, yup as yup2, yupResolver as yupResolver2 } from "@ttoss/forms";
+import { NotificationsBox } from "@ttoss/react-notifications";
+import { useI18n as useI18n2 } from "@ttoss/react-i18n";
+import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
+var AuthForgotPassword = ({
+  onForgotPassword,
+  onCancel,
+  onSignUp
 }) => {
-  return /* @__PURE__ */jsx4(Flex2, {
+  const {
+    intl
+  } = useI18n2();
+  const schema = yup2.object().shape({
+    email: yup2.string().required(intl.formatMessage({
+      id: "5oOshZ",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Enter your email address"
+      }]
+    })).email(intl.formatMessage({
+      id: "SnONhb",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Please, insert a valid e-mail"
+      }]
+    }))
+  }).required();
+  const formMethods = useForm2({
+    resolver: yupResolver2(schema),
+    mode: "onBlur"
+  });
+  return /* @__PURE__ */jsx4(Form2, {
+    ...formMethods,
     sx: {
-      height: "100vh",
-      width: "100vw",
-      justifyContent: "center",
-      alignItems: "center",
-      margin: 0,
-      backgroundPosition: "center",
-      backgroundRepeat: "no-repeat",
-      backgroundSize: "cover"
+      maxWidth: "390px"
     },
-    children
+    onSubmit: ({
+      email
+    }) => {
+      return onForgotPassword({
+        email
+      });
+    },
+    children: /* @__PURE__ */jsxs2(AuthCard, {
+      buttonLabel: intl.formatMessage({
+        id: "mZzmNV",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Recover Password"
+        }]
+      }),
+      isValidForm: formMethods.formState.isValid,
+      title: intl.formatMessage({
+        id: "S4bbEj",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Recovering Password"
+        }]
+      }),
+      extraButton: /* @__PURE__ */jsx4(Button2, {
+        sx: {
+          textAlign: "center",
+          display: "initial"
+        },
+        variant: "secondary",
+        onClick: onCancel,
+        children: intl.formatMessage({
+          id: "6PdOcy",
+          defaultMessage: [{
+            "type": 0,
+            "value": "Cancel"
+          }]
+        })
+      }),
+      children: [/* @__PURE__ */jsx4(FormFieldInput2, {
+        name: "email",
+        label: intl.formatMessage({
+          id: "XreZg+",
+          defaultMessage: [{
+            "type": 0,
+            "value": "Registered Email"
+          }]
+        })
+      }), /* @__PURE__ */jsx4(NotificationsBox, {}), /* @__PURE__ */jsx4(Text, {
+        sx: {
+          marginTop: "xl",
+          cursor: "pointer"
+        },
+        as: Link,
+        onClick: onSignUp,
+        children: intl.formatMessage({
+          id: "lZvoYL",
+          defaultMessage: [{
+            "type": 0,
+            "value": "Sign up now"
+          }]
+        })
+      })]
+    })
   });
 };
 
-// src/AuthSignIn.tsx
+// src/AuthForgotPasswordResetPassword.tsx
 import * as React3 from "react";
-import { Button as Button2, Flex as Flex3, Link, Text } from "@ttoss/ui";
-import { Form as Form2, FormFieldInput as FormFieldInput2, FormFieldPassword, useForm as useForm2, yup as yup2, yupResolver as yupResolver2 } from "@ttoss/forms";
-import { NotificationsBox, useNotifications as useNotifications2 } from "@ttoss/react-notifications";
+import { Button as Button3 } from "@ttoss/ui";
+import { Form as Form3, FormFieldInput as FormFieldInput3, FormFieldPassword, useForm as useForm3, yup as yup3, yupResolver as yupResolver3 } from "@ttoss/forms";
+import { NotificationsBox as NotificationsBox2 } from "@ttoss/react-notifications";
 
 // ../cloud-auth/dist/esm/index.js
 var PASSWORD_MINIMUM_LENGTH = 8;
@@ -506,9 +589,186 @@ createAuthTemplate.CognitoUserPoolLogicalId = CognitoUserPoolLogicalId;
 createAuthTemplate.CognitoUserPoolClientLogicalId = CognitoUserPoolClientLogicalId;
 createAuthTemplate.CognitoIdentityPoolLogicalId = CognitoIdentityPoolLogicalId;
 
+// src/AuthForgotPasswordResetPassword.tsx
+import { useI18n as useI18n3 } from "@ttoss/react-i18n";
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+var AuthForgotPasswordResetPassword = ({
+  email,
+  onForgotPasswordResetPassword,
+  onCancel
+}) => {
+  const {
+    intl
+  } = useI18n3();
+  const schema = React3.useMemo(() => {
+    return yup3.object().shape({
+      code: yup3.string().required(intl.formatMessage({
+        id: "0XOzcH",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Required field"
+        }]
+      })).max(6, intl.formatMessage({
+        id: "S3pjKw",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Minimum "
+        }, {
+          "type": 1,
+          "value": "value"
+        }, {
+          "type": 0,
+          "value": " characters"
+        }]
+      }, {
+        value: 6
+      })),
+      password: yup3.string().required(intl.formatMessage({
+        id: "kdFYba",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Password field is required"
+        }]
+      })).min(PASSWORD_MINIMUM_LENGTH, intl.formatMessage({
+        id: "TZ4WUk",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Password requires "
+        }, {
+          "type": 1,
+          "value": "value"
+        }, {
+          "type": 0,
+          "value": " characters"
+        }]
+      }, {
+        value: PASSWORD_MINIMUM_LENGTH
+      })).trim(),
+      confirmPassword: yup3.string().required(intl.formatMessage({
+        id: "NJ57Qj",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Confirm password field is required"
+        }]
+      })).oneOf([yup3.ref("password")], intl.formatMessage({
+        id: "WU/CqP",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Passwords are not the same"
+        }]
+      }))
+    }).required();
+  }, [intl]);
+  const formMethods = useForm3({
+    resolver: yupResolver3(schema),
+    mode: "onBlur"
+  });
+  return /* @__PURE__ */jsx5(Form3, {
+    ...formMethods,
+    sx: {
+      maxWidth: "390px"
+    },
+    onSubmit: ({
+      code,
+      password
+    }) => {
+      return onForgotPasswordResetPassword({
+        email,
+        code,
+        newPassword: password
+      });
+    },
+    children: /* @__PURE__ */jsxs3(AuthCard, {
+      buttonLabel: intl.formatMessage({
+        id: "mZzmNV",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Recover Password"
+        }]
+      }),
+      isValidForm: formMethods.formState.isValid,
+      title: intl.formatMessage({
+        id: "S4bbEj",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Recovering Password"
+        }]
+      }),
+      extraButton: /* @__PURE__ */jsx5(Button3, {
+        sx: {
+          textAlign: "center",
+          display: "initial"
+        },
+        variant: "secondary",
+        onClick: onCancel,
+        children: intl.formatMessage({
+          id: "6PdOcy",
+          defaultMessage: [{
+            "type": 0,
+            "value": "Cancel"
+          }]
+        })
+      }),
+      children: [/* @__PURE__ */jsx5(FormFieldInput3, {
+        name: "code",
+        label: intl.formatMessage({
+          id: "42HafR",
+          defaultMessage: [{
+            "type": 0,
+            "value": "Code"
+          }]
+        })
+      }), /* @__PURE__ */jsx5(FormFieldPassword, {
+        name: "password",
+        label: intl.formatMessage({
+          id: "PylVqx",
+          defaultMessage: [{
+            "type": 0,
+            "value": "Password"
+          }]
+        })
+      }), /* @__PURE__ */jsx5(FormFieldPassword, {
+        name: "confirmPassword",
+        label: intl.formatMessage({
+          id: "lY+cuM",
+          defaultMessage: [{
+            "type": 0,
+            "value": "Confirm password"
+          }]
+        })
+      }), /* @__PURE__ */jsx5(NotificationsBox2, {})]
+    })
+  });
+};
+
+// src/AuthFullScreen.tsx
+import { Flex as Flex2 } from "@ttoss/ui";
+import { jsx as jsx6 } from "react/jsx-runtime";
+var AuthFullScreen = ({
+  children
+}) => {
+  return /* @__PURE__ */jsx6(Flex2, {
+    sx: {
+      height: "100vh",
+      width: "100vw",
+      justifyContent: "center",
+      alignItems: "center",
+      margin: 0,
+      backgroundPosition: "center",
+      backgroundRepeat: "no-repeat",
+      backgroundSize: "cover"
+    },
+    children
+  });
+};
+
 // src/AuthSignIn.tsx
-import { useI18n as useI18n2 } from "@ttoss/react-i18n";
-import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+import * as React4 from "react";
+import { Button as Button4, Flex as Flex3, Link as Link2, Text as Text2 } from "@ttoss/ui";
+import { Form as Form4, FormFieldInput as FormFieldInput4, FormFieldPassword as FormFieldPassword2, useForm as useForm4, yup as yup4, yupResolver as yupResolver4 } from "@ttoss/forms";
+import { NotificationsBox as NotificationsBox3, useNotifications as useNotifications2 } from "@ttoss/react-notifications";
+import { useI18n as useI18n4 } from "@ttoss/react-i18n";
+import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
 var AuthSignIn = ({
   onSignIn,
   onSignUp,
@@ -517,15 +777,15 @@ var AuthSignIn = ({
 }) => {
   const {
     intl
-  } = useI18n2();
+  } = useI18n4();
   const {
     setNotifications
   } = useNotifications2();
-  React3.useEffect(() => {
+  React4.useEffect(() => {
     setNotifications(void 0);
   }, [setNotifications]);
-  const schema = yup2.object().shape({
-    email: yup2.string().required(intl.formatMessage({
+  const schema = yup4.object().shape({
+    email: yup4.string().required(intl.formatMessage({
       id: "d1YCuH",
       defaultMessage: [{
         "type": 0,
@@ -538,7 +798,7 @@ var AuthSignIn = ({
         "value": "Please, insert a valid e-mail"
       }]
     })),
-    password: yup2.string().required(intl.formatMessage({
+    password: yup4.string().required(intl.formatMessage({
       id: "kdFYba",
       defaultMessage: [{
         "type": 0,
@@ -562,22 +822,22 @@ var AuthSignIn = ({
     // remember: yup.boolean(),
   });
 
-  const formMethods = useForm2({
+  const formMethods = useForm4({
     defaultValues,
     mode: "onBlur",
-    resolver: yupResolver2(schema)
+    resolver: yupResolver4(schema)
   });
   const onSubmitForm = data => {
     return onSignIn(data);
   };
-  return /* @__PURE__ */jsx5(Form2, {
+  return /* @__PURE__ */jsx7(Form4, {
     sx: {
       maxWidth: "390px",
       width: "100%"
     },
     ...formMethods,
     onSubmit: onSubmitForm,
-    children: /* @__PURE__ */jsxs2(AuthCard, {
+    children: /* @__PURE__ */jsxs4(AuthCard, {
       title: intl.formatMessage({
         id: "F2iS37",
         defaultMessage: [{
@@ -593,7 +853,7 @@ var AuthSignIn = ({
         }]
       }),
       isValidForm: formMethods.formState.isValid,
-      extraButton: /* @__PURE__ */jsx5(Button2, {
+      extraButton: /* @__PURE__ */jsx7(Button4, {
         type: "button",
         variant: "secondary",
         sx: {
@@ -610,12 +870,12 @@ var AuthSignIn = ({
           }]
         })
       }),
-      children: [/* @__PURE__ */jsxs2(Flex3, {
+      children: [/* @__PURE__ */jsxs4(Flex3, {
         sx: {
           flexDirection: "column",
           gap: "xl"
         },
-        children: [/* @__PURE__ */jsx5(FormFieldInput2, {
+        children: [/* @__PURE__ */jsx7(FormFieldInput4, {
           name: "email",
           label: intl.formatMessage({
             id: "5E12mO",
@@ -624,7 +884,7 @@ var AuthSignIn = ({
               "value": "Email"
             }]
           })
-        }), /* @__PURE__ */jsx5(FormFieldPassword, {
+        }), /* @__PURE__ */jsx7(FormFieldPassword2, {
           name: "password",
           label: intl.formatMessage({
             id: "PylVqx",
@@ -634,16 +894,17 @@ var AuthSignIn = ({
             }]
           })
         })]
-      }), /* @__PURE__ */jsx5(Flex3, {
+      }), /* @__PURE__ */jsx7(Flex3, {
         sx: {
           justifyContent: "space-between",
           marginTop: "lg"
         },
-        children: /* @__PURE__ */jsx5(Text, {
+        children: /* @__PURE__ */jsx7(Text2, {
           sx: {
-            marginLeft: "auto"
+            marginLeft: "auto",
+            cursor: "pointer"
           },
-          as: Link,
+          as: Link2,
           onClick: onForgotPassword,
           children: intl.formatMessage({
             id: "BtK6KR",
@@ -653,33 +914,33 @@ var AuthSignIn = ({
             }]
           })
         })
-      }), /* @__PURE__ */jsx5(NotificationsBox, {})]
+      }), /* @__PURE__ */jsx7(NotificationsBox3, {})]
     })
   });
 };
 
 // src/AuthSignUp.tsx
-import * as React4 from "react";
-import { Flex as Flex4, Link as Link2, Text as Text2 } from "@ttoss/ui";
-import { Form as Form3, FormFieldInput as FormFieldInput3, FormFieldPassword as FormFieldPassword2, useForm as useForm3, yup as yup3, yupResolver as yupResolver3 } from "@ttoss/forms";
-import { NotificationsBox as NotificationsBox2, useNotifications as useNotifications3 } from "@ttoss/react-notifications";
-import { useI18n as useI18n3 } from "@ttoss/react-i18n";
-import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+import * as React5 from "react";
+import { Flex as Flex4, Link as Link3, Text as Text3 } from "@ttoss/ui";
+import { Form as Form5, FormFieldInput as FormFieldInput5, FormFieldPassword as FormFieldPassword3, useForm as useForm5, yup as yup5, yupResolver as yupResolver5 } from "@ttoss/forms";
+import { NotificationsBox as NotificationsBox4, useNotifications as useNotifications3 } from "@ttoss/react-notifications";
+import { useI18n as useI18n5 } from "@ttoss/react-i18n";
+import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
 var AuthSignUp = ({
   onSignUp,
   onReturnToSignIn
 }) => {
   const {
     intl
-  } = useI18n3();
+  } = useI18n5();
   const {
     setNotifications
   } = useNotifications3();
-  React4.useEffect(() => {
+  React5.useEffect(() => {
     setNotifications(void 0);
   }, [setNotifications]);
-  const schema = yup3.object().shape({
-    email: yup3.string().required(intl.formatMessage({
+  const schema = yup5.object().shape({
+    email: yup5.string().required(intl.formatMessage({
       id: "d1YCuH",
       defaultMessage: [{
         "type": 0,
@@ -692,7 +953,7 @@ var AuthSignUp = ({
         "value": "Invalid email"
       }]
     })),
-    password: yup3.string().required(intl.formatMessage({
+    password: yup5.string().required(intl.formatMessage({
       id: "kdFYba",
       defaultMessage: [{
         "type": 0,
@@ -713,13 +974,13 @@ var AuthSignUp = ({
     }, {
       value: PASSWORD_MINIMUM_LENGTH
     })).trim(),
-    confirmPassword: yup3.string().required(intl.formatMessage({
+    confirmPassword: yup5.string().required(intl.formatMessage({
       id: "NJ57Qj",
       defaultMessage: [{
         "type": 0,
         "value": "Confirm password field is required"
       }]
-    })).oneOf([yup3.ref("password")], intl.formatMessage({
+    })).oneOf([yup5.ref("password")], intl.formatMessage({
       id: "WU/CqP",
       defaultMessage: [{
         "type": 0,
@@ -727,21 +988,21 @@ var AuthSignUp = ({
       }]
     }))
   });
-  const formMethods = useForm3({
+  const formMethods = useForm5({
     mode: "all",
-    resolver: yupResolver3(schema)
+    resolver: yupResolver5(schema)
   });
   const onSubmitForm = data => {
     return onSignUp(data);
   };
-  return /* @__PURE__ */jsx6(Form3, {
+  return /* @__PURE__ */jsx8(Form5, {
     sx: {
       maxWidth: "390px",
       width: "100%"
     },
     ...formMethods,
     onSubmit: onSubmitForm,
-    children: /* @__PURE__ */jsxs3(AuthCard, {
+    children: /* @__PURE__ */jsxs5(AuthCard, {
       buttonLabel: intl.formatMessage({
         id: "URJDrG",
         defaultMessage: [{
@@ -757,12 +1018,12 @@ var AuthSignUp = ({
         }]
       }),
       isValidForm: formMethods.formState.isValid,
-      extraButton: /* @__PURE__ */jsx6(Text2, {
+      extraButton: /* @__PURE__ */jsx8(Text3, {
         sx: {
           cursor: "pointer"
         },
         onClick: onReturnToSignIn,
-        as: Link2,
+        as: Link3,
         children: intl.formatMessage({
           id: "rx8HF/",
           defaultMessage: [{
@@ -771,12 +1032,12 @@ var AuthSignUp = ({
           }]
         })
       }),
-      children: [/* @__PURE__ */jsxs3(Flex4, {
+      children: [/* @__PURE__ */jsxs5(Flex4, {
         sx: {
           flexDirection: "column",
           gap: "xl"
         },
-        children: [/* @__PURE__ */jsx6(FormFieldInput3, {
+        children: [/* @__PURE__ */jsx8(FormFieldInput5, {
           name: "email",
           label: intl.formatMessage({
             id: "5E12mO",
@@ -785,7 +1046,7 @@ var AuthSignUp = ({
               "value": "Email"
             }]
           })
-        }), /* @__PURE__ */jsx6(FormFieldPassword2, {
+        }), /* @__PURE__ */jsx8(FormFieldPassword3, {
           name: "password",
           label: intl.formatMessage({
             id: "PylVqx",
@@ -794,7 +1055,7 @@ var AuthSignUp = ({
               "value": "Password"
             }]
           })
-        }), /* @__PURE__ */jsx6(FormFieldPassword2, {
+        }), /* @__PURE__ */jsx8(FormFieldPassword3, {
           name: "confirmPassword",
           label: intl.formatMessage({
             id: "lY+cuM",
@@ -804,7 +1065,7 @@ var AuthSignUp = ({
             }]
           })
         })]
-      }), /* @__PURE__ */jsx6(NotificationsBox2, {})]
+      }), /* @__PURE__ */jsx8(NotificationsBox4, {})]
     })
   });
 };
@@ -813,7 +1074,7 @@ var AuthSignUp = ({
 import { assign, createMachine } from "xstate";
 import { useMachine } from "@xstate/react";
 import { useNotifications as useNotifications4 } from "@ttoss/react-notifications";
-import { jsx as jsx7 } from "react/jsx-runtime";
+import { jsx as jsx9 } from "react/jsx-runtime";
 var authMachine = createMachine({
   predictableActionArguments: true,
   initial: "signIn",
@@ -826,6 +1087,9 @@ var authMachine = createMachine({
         SIGN_UP_RESEND_CONFIRMATION: {
           actions: ["assignEmail"],
           target: "signUpConfirm"
+        },
+        FORGOT_PASSWORD: {
+          target: "forgotPassword"
         }
       }
     },
@@ -847,13 +1111,41 @@ var authMachine = createMachine({
           target: "signIn"
         }
       }
+    },
+    forgotPassword: {
+      on: {
+        RETURN_TO_SIGN_IN: {
+          target: "signIn"
+        },
+        SIGN_UP: {
+          target: "signUp"
+        },
+        FORGOT_PASSWORD_RESET_PASSWORD: {
+          actions: ["assignEmail"],
+          target: "forgotPasswordResetPassword"
+        }
+      }
+    },
+    forgotPasswordResetPassword: {
+      on: {
+        FORGOT_PASSWORD_CONFIRMED: {
+          actions: ["assignEmail"],
+          target: "signIn"
+        },
+        RETURN_TO_SIGN_IN: {
+          target: "signIn"
+        }
+      }
     }
   }
 }, {
   actions: {
     assignEmail: assign({
       email: (_, event) => {
-        return event.email;
+        if ("email" in event) {
+          return event.email;
+        }
+        return void 0;
       }
     })
   }
@@ -867,7 +1159,7 @@ var AuthLogic = () => {
     setLoading,
     setNotifications
   } = useNotifications4();
-  const onSignIn = React5.useCallback(async ({
+  const onSignIn = React6.useCallback(async ({
     email,
     password
   }) => {
@@ -893,7 +1185,7 @@ var AuthLogic = () => {
       setLoading(false);
     }
   }, [send, setLoading, setNotifications]);
-  const onSignUp = React5.useCallback(async ({
+  const onSignUp = React6.useCallback(async ({
     email,
     password
   }) => {
@@ -919,7 +1211,7 @@ var AuthLogic = () => {
       setLoading(false);
     }
   }, [send, setLoading, setNotifications]);
-  const onConfirmSignUp = React5.useCallback(async ({
+  const onConfirmSignUp = React6.useCallback(async ({
     email,
     code
   }) => {
@@ -939,31 +1231,90 @@ var AuthLogic = () => {
       setLoading(false);
     }
   }, [send, setLoading, setNotifications]);
-  const onReturnToSignIn = React5.useCallback(() => {
+  const onReturnToSignIn = React6.useCallback(() => {
     send({
       type: "RETURN_TO_SIGN_IN"
     });
   }, [send]);
+  const onForgotPassword = React6.useCallback(async ({
+    email
+  }) => {
+    try {
+      setLoading(true);
+      await AmplifyAuth.forgotPassword(email);
+      send({
+        type: "FORGOT_PASSWORD_RESET_PASSWORD",
+        email
+      });
+    } catch (error) {
+      setNotifications({
+        type: "error",
+        message: error.message
+      });
+    } finally {
+      setLoading(false);
+    }
+  }, [send, setLoading, setNotifications]);
+  const onForgotPasswordResetPassword = React6.useCallback(async ({
+    email,
+    code,
+    newPassword
+  }) => {
+    try {
+      setLoading(true);
+      await AmplifyAuth.forgotPasswordSubmit(email, code, newPassword);
+      send({
+        type: "FORGOT_PASSWORD_CONFIRMED",
+        email
+      });
+    } catch (error) {
+      setNotifications({
+        type: "error",
+        message: error.message
+      });
+    } finally {
+      setLoading(false);
+    }
+  }, [send, setLoading, setNotifications]);
   if (isAuthenticated) {
     return null;
   }
   if (state.matches("signUp")) {
-    return /* @__PURE__ */jsx7(AuthSignUp, {
+    return /* @__PURE__ */jsx9(AuthSignUp, {
       onSignUp,
       onReturnToSignIn
     });
   }
   if (state.matches("signUpConfirm")) {
-    return /* @__PURE__ */jsx7(AuthConfirmSignUp, {
+    return /* @__PURE__ */jsx9(AuthConfirmSignUp, {
       onConfirmSignUp,
       email: state.context.email
     });
   }
-  return /* @__PURE__ */jsx7(AuthSignIn, {
+  if (state.matches("forgotPassword")) {
+    return /* @__PURE__ */jsx9(AuthForgotPassword, {
+      onForgotPassword,
+      onCancel: onReturnToSignIn,
+      onSignUp: () => {
+        return send("SIGN_UP");
+      }
+    });
+  }
+  if (state.matches("forgotPasswordResetPassword")) {
+    return /* @__PURE__ */jsx9(AuthForgotPasswordResetPassword, {
+      email: state.context.email,
+      onForgotPasswordResetPassword,
+      onCancel: onReturnToSignIn
+    });
+  }
+  return /* @__PURE__ */jsx9(AuthSignIn, {
     onSignIn,
     onSignUp: () => {
       return send("SIGN_UP");
     },
+    onForgotPassword: () => {
+      return send("FORGOT_PASSWORD");
+    },
     defaultValues: {
       email: state.context.email
     }
@@ -973,14 +1324,14 @@ var Auth2 = ({
   logo,
   fullScreen = true
 }) => {
-  const withLogoNode = React5.useMemo(() => {
-    return /* @__PURE__ */jsx7(LogoProvider, {
+  const withLogoNode = React6.useMemo(() => {
+    return /* @__PURE__ */jsx9(LogoProvider, {
       logo,
-      children: /* @__PURE__ */jsx7(AuthLogic, {})
+      children: /* @__PURE__ */jsx9(AuthLogic, {})
     });
   }, [logo]);
   if (fullScreen) {
-    return /* @__PURE__ */jsx7(AuthFullScreen, {
+    return /* @__PURE__ */jsx9(AuthFullScreen, {
       children: withLogoNode
     });
   }