@ttoss/react-auth-core 0.2.56 → 0.2.58

package/dist/index.js

@@ -0,0 +1,1099 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+import * as React from 'react';
+"use strict";
+
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", {
+  value,
+  configurable: true
+});
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+// If the importer is in node compatibility mode or this is not an ESM
+// file that has been converted to a CommonJS file using a Babel-
+// compatible transform (i.e. "__esModule" has not been set), then set
+// "default" to the CommonJS "module.exports" for node compatibility.
+isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+  value: mod,
+  enumerable: true
+}) : target, mod));
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  Auth: () => Auth,
+  AuthConfirmSignUpCheckEmail: () => AuthConfirmSignUpCheckEmail,
+  AuthConfirmSignUpWithCode: () => AuthConfirmSignUpWithCode,
+  AuthForgotPassword: () => AuthForgotPassword,
+  AuthForgotPasswordResetPassword: () => AuthForgotPasswordResetPassword,
+  AuthFullScreen: () => AuthFullScreen,
+  AuthProvider: () => AuthProvider,
+  AuthSignIn: () => AuthSignIn,
+  AuthSignUp: () => AuthSignUp,
+  ErrorBoundary: () => ErrorBoundary,
+  useAuth: () => useAuth,
+  useAuthScreen: () => useAuthScreen
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/Auth.tsx
+var import_react_notifications6 = require("@ttoss/react-notifications");
+var import_ui7 = require("@ttoss/ui");
+var React5 = __toESM(require("react"), 1);
+
+// src/AuthCard.tsx
+var import_react_notifications = require("@ttoss/react-notifications");
+var import_ui = require("@ttoss/ui");
+var React2 = __toESM(require("react"), 1);
+var LogoContext = /* @__PURE__ */React2.createContext({});
+var LogoProvider = /* @__PURE__ */__name(({
+  children,
+  ...values
+}) => {
+  return /* @__PURE__ */React2.createElement(LogoContext.Provider, {
+    value: values
+  }, children);
+}, "LogoProvider");
+var AuthCard = /* @__PURE__ */__name(({
+  children,
+  title,
+  buttonLabel,
+  extraButton,
+  isValidForm
+}) => {
+  const {
+    logo
+  } = React2.useContext(LogoContext);
+  const {
+    isLoading
+  } = (0, import_react_notifications.useNotifications)();
+  return /* @__PURE__ */React2.createElement(import_ui.Box, {
+    sx: {
+      maxWidth: "400px",
+      width: "full",
+      border: "md",
+      borderColor: "display.border.muted.default",
+      paddingX: "8",
+      paddingY: "9",
+      backgroundColor: "surface"
+    }
+  }, logo && /* @__PURE__ */React2.createElement(import_ui.Flex, {
+    sx: {
+      width: "full",
+      maxHeight: "90px",
+      justifyContent: "center",
+      marginBottom: "8"
+    }
+  }, logo), /* @__PURE__ */React2.createElement(import_ui.Flex, {
+    sx: {
+      flexDirection: "column"
+    }
+  }, /* @__PURE__ */React2.createElement(import_ui.Heading, {
+    as: "h2",
+    variant: "h2",
+    sx: {
+      marginBottom: "8"
+    }
+  }, title), children, /* @__PURE__ */React2.createElement(import_ui.Flex, {
+    sx: {
+      flexDirection: "column",
+      width: "100%",
+      gap: "7",
+      marginTop: "8"
+    }
+  }, /* @__PURE__ */React2.createElement(import_ui.Button, {
+    type: "submit",
+    variant: "accent",
+    disabled: isLoading || !isValidForm,
+    sx: {
+      textAlign: "center",
+      display: "initial"
+    },
+    loading: isLoading
+  }, buttonLabel), extraButton)));
+}, "AuthCard");
+
+// src/AuthConfirmSignUpCheckEmail.tsx
+var import_NotificationCard = require("@ttoss/components/NotificationCard");
+var import_react_i18n = require("@ttoss/react-i18n");
+var AuthConfirmSignUpCheckEmail = /* @__PURE__ */__name(({
+  onConfirmSignUpCheckEmail
+}) => {
+  const {
+    intl
+  } = (0, import_react_i18n.useI18n)();
+  return /* @__PURE__ */React.createElement("form", {
+    onSubmit: /* @__PURE__ */__name(e => {
+      e.preventDefault();
+      onConfirmSignUpCheckEmail();
+    }, "onSubmit")
+  }, /* @__PURE__ */React.createElement(AuthCard, {
+    isValidForm: true,
+    buttonLabel: intl.formatMessage({
+      id: "38HSjr",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Sign In"
+      }]
+    }),
+    title: intl.formatMessage({
+      id: "cGR2eI",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Confirmation"
+      }]
+    })
+  }, /* @__PURE__ */React.createElement(import_NotificationCard.NotificationCard, {
+    type: "info",
+    message: intl.formatMessage({
+      id: "qTQ4hP",
+      defaultMessage: [{
+        "type": 0,
+        "value": "An email has been sent to your address. Please check your inbox and follow the instructions to confirm your sign up."
+      }]
+    })
+  })));
+}, "AuthConfirmSignUpCheckEmail");
+
+// src/AuthConfirmSignUpWithCode.tsx
+var import_NotificationCard2 = require("@ttoss/components/NotificationCard");
+var import_forms = require("@ttoss/forms");
+var import_react_i18n2 = require("@ttoss/react-i18n");
+var AuthConfirmSignUpWithCode = /* @__PURE__ */__name(({
+  email,
+  onConfirmSignUpWithCode
+}) => {
+  const {
+    intl
+  } = (0, import_react_i18n2.useI18n)();
+  const schema = import_forms.yup.object().shape({
+    code: import_forms.yup.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
+    }))
+  }).required();
+  const formMethods = (0, import_forms.useForm)({
+    resolver: (0, import_forms.yupResolver)(schema)
+  });
+  return /* @__PURE__ */React.createElement(import_forms.Form, {
+    ...formMethods,
+    onSubmit: /* @__PURE__ */__name(({
+      code
+    }) => {
+      return onConfirmSignUpWithCode({
+        code,
+        email
+      });
+    }, "onSubmit")
+  }, /* @__PURE__ */React.createElement(AuthCard, {
+    buttonLabel: intl.formatMessage({
+      id: "UNttd+",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Confirm"
+      }]
+    }),
+    isValidForm: formMethods.formState.isValid,
+    title: intl.formatMessage({
+      id: "cGR2eI",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Confirmation"
+      }]
+    })
+  }, /* @__PURE__ */React.createElement(import_NotificationCard2.NotificationCard, {
+    type: "info",
+    message: intl.formatMessage({
+      id: "pwv2cR",
+      defaultMessage: [{
+        "type": 0,
+        "value": "We have sent a confirmation code to your email address. Please enter the code below."
+      }]
+    })
+  }), /* @__PURE__ */React.createElement(import_forms.FormFieldInput, {
+    sx: {
+      marginTop: "6"
+    },
+    name: "code",
+    label: intl.formatMessage({
+      id: "KY2T6J",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Code"
+      }]
+    })
+  })));
+}, "AuthConfirmSignUpWithCode");
+
+// src/AuthForgotPassword.tsx
+var import_forms2 = require("@ttoss/forms");
+var import_react_i18n3 = require("@ttoss/react-i18n");
+var import_react_notifications2 = require("@ttoss/react-notifications");
+var import_ui2 = require("@ttoss/ui");
+var AuthForgotPassword = /* @__PURE__ */__name(props => {
+  const {
+    intl
+  } = (0, import_react_i18n3.useI18n)();
+  const schema = import_forms2.yup.object().shape({
+    email: import_forms2.yup.string().email(intl.formatMessage({
+      id: "9cApwd",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Please, insert a valid e-mail"
+      }]
+    })).required()
+  }).required();
+  const formMethods = (0, import_forms2.useForm)({
+    resolver: (0, import_forms2.yupResolver)(schema),
+    mode: "onChange"
+  });
+  return /* @__PURE__ */React.createElement(import_forms2.Form, {
+    ...formMethods,
+    sx: {
+      maxWidth: "390px"
+    },
+    onSubmit: /* @__PURE__ */__name(({
+      email
+    }) => {
+      return props.onForgotPassword({
+        email
+      });
+    }, "onSubmit")
+  }, /* @__PURE__ */React.createElement(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__ */React.createElement(import_ui2.Button, {
+      sx: {
+        textAlign: "center",
+        display: "initial"
+      },
+      variant: "secondary",
+      onClick: props.onGoToSignIn
+    }, intl.formatMessage({
+      id: "6PdOcy",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Cancel"
+      }]
+    }))
+  }, /* @__PURE__ */React.createElement(import_forms2.FormFieldInput, {
+    name: "email",
+    label: intl.formatMessage({
+      id: "XreZg+",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Registered Email"
+      }]
+    })
+  }), /* @__PURE__ */React.createElement(import_react_notifications2.NotificationsBox, null), props.onGoToSignUp && /* @__PURE__ */React.createElement(import_ui2.Text, {
+    sx: {
+      marginTop: "xl",
+      cursor: "pointer"
+    },
+    as: import_ui2.Link,
+    onClick: props.onGoToSignUp
+  }, intl.formatMessage({
+    id: "lZvoYL",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Sign up now"
+    }]
+  }))));
+}, "AuthForgotPassword");
+
+// src/AuthForgotPasswordResetPassword.tsx
+var import_forms3 = require("@ttoss/forms");
+var import_react_i18n4 = require("@ttoss/react-i18n");
+var import_react_notifications3 = require("@ttoss/react-notifications");
+var import_ui3 = require("@ttoss/ui");
+var AuthForgotPasswordResetPassword = /* @__PURE__ */__name(props => {
+  const {
+    intl
+  } = (0, import_react_i18n4.useI18n)();
+  const schema = import_forms3.yup.object().shape({
+    code: import_forms3.yup.string().required(intl.formatMessage({
+      id: "0XOzcH",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Required field"
+      }]
+    })).max(6, intl.formatMessage({
+      id: "SfWKyS",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Maximum "
+      }, {
+        "type": 1,
+        "value": "value"
+      }, {
+        "type": 0,
+        "value": " characters"
+      }]
+    }, {
+      value: 6
+    })),
+    newPassword: import_forms3.yup.string().required(intl.formatMessage({
+      id: "kdFYba",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Password field is required"
+      }]
+    })).min(props.passwordMinimumLength || 8, intl.formatMessage({
+      id: "TZ4WUk",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Password requires "
+      }, {
+        "type": 1,
+        "value": "value"
+      }, {
+        "type": 0,
+        "value": " characters"
+      }]
+    }, {
+      value: props.passwordMinimumLength || 8
+    })).trim()
+  });
+  const formMethods = (0, import_forms3.useForm)({
+    resolver: (0, import_forms3.yupResolver)(schema),
+    mode: "onChange"
+  });
+  return /* @__PURE__ */React.createElement(import_forms3.Form, {
+    ...formMethods,
+    sx: {
+      maxWidth: "390px"
+    },
+    onSubmit: /* @__PURE__ */__name(({
+      code,
+      newPassword
+    }) => {
+      return props.onForgotPasswordResetPassword({
+        email: props.email,
+        code,
+        newPassword
+      });
+    }, "onSubmit")
+  }, /* @__PURE__ */React.createElement(AuthCard, {
+    buttonLabel: intl.formatMessage({
+      id: "HT4tSM",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Reset Password"
+      }]
+    }),
+    isValidForm: formMethods.formState.isValid,
+    title: intl.formatMessage({
+      id: "HT4tSM",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Reset Password"
+      }]
+    }),
+    extraButton: props.onGoToSignIn ? /* @__PURE__ */React.createElement(import_ui3.Button, {
+      type: "button",
+      sx: {
+        textAlign: "center",
+        display: "initial"
+      },
+      variant: "secondary",
+      onClick: props.onGoToSignIn
+    }, intl.formatMessage({
+      id: "6PdOcy",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Cancel"
+      }]
+    })) : null
+  }, /* @__PURE__ */React.createElement(import_forms3.FormFieldInput, {
+    name: "code",
+    label: intl.formatMessage({
+      id: "s1OmP0",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Confirmation code"
+      }]
+    })
+  }), /* @__PURE__ */React.createElement(import_forms3.FormFieldPassword, {
+    name: "newPassword",
+    label: intl.formatMessage({
+      id: "e3IQoc",
+      defaultMessage: [{
+        "type": 0,
+        "value": "New Password"
+      }]
+    })
+  }), /* @__PURE__ */React.createElement(import_react_notifications3.NotificationsBox, null)));
+}, "AuthForgotPasswordResetPassword");
+
+// src/AuthFullScreen.tsx
+var import_ui4 = require("@ttoss/ui");
+var AuthFullScreen = /* @__PURE__ */__name(({
+  children
+}) => {
+  return /* @__PURE__ */React.createElement(import_ui4.Flex, {
+    sx: {
+      height: "100vh",
+      width: "100vw",
+      justifyContent: "center",
+      alignItems: "center",
+      margin: 0,
+      backgroundPosition: "center",
+      backgroundRepeat: "no-repeat",
+      backgroundSize: "cover"
+    }
+  }, children);
+}, "AuthFullScreen");
+
+// src/AuthSignIn.tsx
+var import_forms4 = require("@ttoss/forms");
+var import_react_i18n5 = require("@ttoss/react-i18n");
+var import_react_notifications4 = require("@ttoss/react-notifications");
+var import_ui5 = require("@ttoss/ui");
+var AuthSignIn = /* @__PURE__ */__name(({
+  onSignIn,
+  onGoToSignUp,
+  defaultValues,
+  onGoToForgotPassword,
+  passwordMinimumLength = 8
+}) => {
+  const {
+    intl
+  } = (0, import_react_i18n5.useI18n)();
+  const schema = import_forms4.yup.object().shape({
+    email: import_forms4.yup.string().required(intl.formatMessage({
+      id: "d1YCuH",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Enter your email address"
+      }]
+    })).email(intl.formatMessage({
+      id: "9cApwd",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Please, insert a valid e-mail"
+      }]
+    })),
+    password: import_forms4.yup.string().required(intl.formatMessage({
+      id: "kdFYba",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Password field is required"
+      }]
+    })).min(passwordMinimumLength, intl.formatMessage({
+      id: "TZ4WUk",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Password requires "
+      }, {
+        "type": 1,
+        "value": "value"
+      }, {
+        "type": 0,
+        "value": " characters"
+      }]
+    }, {
+      value: passwordMinimumLength
+    })).trim()
+  });
+  const formMethods = (0, import_forms4.useForm)({
+    defaultValues,
+    mode: "onChange",
+    resolver: (0, import_forms4.yupResolver)(schema)
+  });
+  const onSubmitForm = /* @__PURE__ */__name(data => {
+    return onSignIn(data);
+  }, "onSubmitForm");
+  return /* @__PURE__ */React.createElement(import_forms4.Form, {
+    sx: {
+      maxWidth: "390px",
+      width: "100%"
+    },
+    ...formMethods,
+    onSubmit: onSubmitForm
+  }, /* @__PURE__ */React.createElement(AuthCard, {
+    title: intl.formatMessage({
+      id: "SQJto2",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Sign in"
+      }]
+    }),
+    buttonLabel: intl.formatMessage({
+      id: "SQJto2",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Sign in"
+      }]
+    }),
+    isValidForm: formMethods.formState.isValid,
+    extraButton: onGoToSignUp ? /* @__PURE__ */React.createElement(import_ui5.Button, {
+      type: "button",
+      variant: "secondary",
+      sx: {
+        textAlign: "center",
+        display: "initial"
+      },
+      onClick: onGoToSignUp
+    }, intl.formatMessage({
+      id: "EZ3YF2",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Sign up"
+      }]
+    })) : null
+  }, /* @__PURE__ */React.createElement(import_ui5.Flex, {
+    sx: {
+      flexDirection: "column",
+      gap: "xl"
+    }
+  }, /* @__PURE__ */React.createElement(import_forms4.FormFieldInput, {
+    name: "email",
+    label: intl.formatMessage({
+      id: "5E12mO",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Email"
+      }]
+    })
+  }), /* @__PURE__ */React.createElement(import_forms4.FormFieldPassword, {
+    name: "password",
+    label: intl.formatMessage({
+      id: "PylVqx",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Password"
+      }]
+    })
+  })), onGoToForgotPassword && /* @__PURE__ */React.createElement(import_ui5.Flex, {
+    sx: {
+      justifyContent: "space-between",
+      marginTop: "lg"
+    }
+  }, /* @__PURE__ */React.createElement(import_ui5.Text, {
+    sx: {
+      marginLeft: "auto",
+      cursor: "pointer"
+    },
+    as: import_ui5.Link,
+    onClick: onGoToForgotPassword
+  }, intl.formatMessage({
+    id: "BtK6KR",
+    defaultMessage: [{
+      "type": 0,
+      "value": "Forgot password?"
+    }]
+  }))), /* @__PURE__ */React.createElement(import_react_notifications4.NotificationsBox, null)));
+}, "AuthSignIn");
+
+// src/AuthSignUp.tsx
+var import_forms5 = require("@ttoss/forms");
+var import_react_i18n6 = require("@ttoss/react-i18n");
+var import_react_notifications5 = require("@ttoss/react-notifications");
+var import_ui6 = require("@ttoss/ui");
+var React3 = __toESM(require("react"), 1);
+var AuthSignUp = /* @__PURE__ */__name(props => {
+  const {
+    intl
+  } = (0, import_react_i18n6.useI18n)();
+  const {
+    passwordMinimumLength = 8
+  } = props;
+  const schema = React3.useMemo(() => {
+    return import_forms5.yup.object().shape({
+      email: import_forms5.yup.string().required(intl.formatMessage({
+        id: "d1YCuH",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Enter your email address"
+        }]
+      })).email(intl.formatMessage({
+        id: "OhDL0i",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Invalid email"
+        }]
+      })),
+      password: import_forms5.yup.string().required(intl.formatMessage({
+        id: "kdFYba",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Password field is required"
+        }]
+      })).min(passwordMinimumLength, intl.formatMessage({
+        id: "TZ4WUk",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Password requires "
+        }, {
+          "type": 1,
+          "value": "value"
+        }, {
+          "type": 0,
+          "value": " characters"
+        }]
+      }, {
+        value: passwordMinimumLength
+      })).trim(),
+      confirmPassword: import_forms5.yup.string().required(intl.formatMessage({
+        id: "NJ57Qj",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Confirm password field is required"
+        }]
+      })).oneOf([import_forms5.yup.ref("password")], intl.formatMessage({
+        id: "WU/CqP",
+        defaultMessage: [{
+          "type": 0,
+          "value": "Passwords are not the same"
+        }]
+      })),
+      signUpTerms: props.signUpTerms?.isRequired ? import_forms5.yup.boolean().required(intl.formatMessage({
+        id: "qnQYqN",
+        defaultMessage: [{
+          "type": 0,
+          "value": "You must accept the terms and conditions"
+        }]
+      })) : import_forms5.yup.boolean()
+    });
+  }, [intl, props.signUpTerms?.isRequired, passwordMinimumLength]);
+  const signUpTermsLabel = React3.useMemo(() => {
+    if (!props.signUpTerms) {
+      return null;
+    }
+    const signUpTermsFirstMessage = intl.formatMessage({
+      id: "Co3exe",
+      defaultMessage: [{
+        "type": 0,
+        "value": "By signing up, you agree to the following Terms and Conditions."
+      }]
+    });
+    const termsLinks = props.signUpTerms.terms.map((term, index, terms) => {
+      const finalPunctuation = index === terms.length - 1 ? "." : ", ";
+      return /* @__PURE__ */React3.createElement(React3.Fragment, {
+        key: index
+      }, /* @__PURE__ */React3.createElement(import_ui6.Link, {
+        key: index,
+        href: term.url,
+        target: "_blank",
+        rel: "noreferrer"
+      }, term.label), finalPunctuation);
+    });
+    const label = /* @__PURE__ */React3.createElement(import_ui6.Text, null, signUpTermsFirstMessage, " ", termsLinks);
+    return label;
+  }, [intl, props.signUpTerms]);
+  const signUpTermsNode = React3.useMemo(() => {
+    if (!props.signUpTerms) {
+      return null;
+    }
+    if (props.signUpTerms.isRequired) {
+      return /* @__PURE__ */React3.createElement(import_forms5.FormFieldCheckbox, {
+        name: "signUpTerms",
+        label: signUpTermsLabel
+      });
+    } else {
+      return /* @__PURE__ */React3.createElement(React3.Fragment, null, signUpTermsLabel);
+    }
+  }, [props.signUpTerms, signUpTermsLabel]);
+  const formMethods = (0, import_forms5.useForm)({
+    mode: "onChange",
+    resolver: (0, import_forms5.yupResolver)(schema)
+  });
+  const onSubmitForm = /* @__PURE__ */__name(data => {
+    return props.onSignUp(data);
+  }, "onSubmitForm");
+  return /* @__PURE__ */React3.createElement(import_forms5.Form, {
+    sx: {
+      maxWidth: "390px",
+      width: "100%"
+    },
+    ...formMethods,
+    onSubmit: onSubmitForm
+  }, /* @__PURE__ */React3.createElement(AuthCard, {
+    buttonLabel: intl.formatMessage({
+      id: "URJDrG",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Sign up"
+      }]
+    }),
+    title: intl.formatMessage({
+      id: "oayEC3",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Sign up"
+      }]
+    }),
+    isValidForm: formMethods.formState.isValid,
+    extraButton: /* @__PURE__ */React3.createElement(import_ui6.Text, {
+      sx: {
+        cursor: "pointer"
+      },
+      onClick: props.onGoToSignIn,
+      as: import_ui6.Link
+    }, intl.formatMessage({
+      id: "8GMUPk",
+      defaultMessage: [{
+        "type": 0,
+        "value": "I'm already registered"
+      }]
+    }))
+  }, /* @__PURE__ */React3.createElement(import_ui6.Flex, {
+    sx: {
+      flexDirection: "column",
+      gap: "xl"
+    }
+  }, /* @__PURE__ */React3.createElement(import_forms5.FormFieldInput, {
+    name: "email",
+    label: intl.formatMessage({
+      id: "5E12mO",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Email"
+      }]
+    })
+  }), /* @__PURE__ */React3.createElement(import_forms5.FormFieldPassword, {
+    name: "password",
+    label: intl.formatMessage({
+      id: "PylVqx",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Password"
+      }]
+    })
+  }), /* @__PURE__ */React3.createElement(import_forms5.FormFieldPassword, {
+    name: "confirmPassword",
+    label: intl.formatMessage({
+      id: "lY+cuM",
+      defaultMessage: [{
+        "type": 0,
+        "value": "Confirm password"
+      }]
+    })
+  }), signUpTermsNode), /* @__PURE__ */React3.createElement(import_react_notifications5.NotificationsBox, null)));
+}, "AuthSignUp");
+
+// src/ErrorBoundary.tsx
+var import_NotificationCard3 = require("@ttoss/components/NotificationCard");
+var import_logger = require("@ttoss/logger");
+var import_react_i18n7 = require("@ttoss/react-i18n");
+var React4 = __toESM(require("react"), 1);
+var import_react_error_boundary = require("react-error-boundary");
+var ErrorFallback = /* @__PURE__ */__name(({
+  resetErrorBoundary
+}) => {
+  const {
+    intl
+  } = (0, import_react_i18n7.useI18n)();
+  return /* @__PURE__ */React4.createElement("div", {
+    role: "alert"
+  }, /* @__PURE__ */React4.createElement(import_NotificationCard3.NotificationCard, {
+    type: "error",
+    message: intl.formatMessage({
+      id: "khMx/2",
+      defaultMessage: [{
+        "type": 0,
+        "value": "An error occurred with your authentication. Please try again."
+      }]
+    }),
+    onClose: resetErrorBoundary
+  }));
+}, "ErrorFallback");
+var ErrorBoundary = /* @__PURE__ */__name(({
+  children
+}) => {
+  return /* @__PURE__ */React4.createElement(import_react_error_boundary.ErrorBoundary, {
+    FallbackComponent: ErrorFallback,
+    onError: /* @__PURE__ */__name(error => {
+      (0, import_logger.notify)({
+        type: "error",
+        title: "Authentication Error",
+        message: error.message
+      });
+    }, "onError")
+  }, children);
+}, "ErrorBoundary");
+
+// src/Auth.tsx
+var AuthLogic = /* @__PURE__ */__name(props => {
+  const {
+    screen,
+    setScreen,
+    onSignUp,
+    onForgotPassword,
+    onSignIn,
+    onConfirmSignUpCheckEmail,
+    onConfirmSignUpWithCode,
+    onForgotPasswordResetPassword,
+    passwordMinimumLength,
+    signUpTerms
+  } = props;
+  const {
+    clearNotifications,
+    setLoading
+  } = (0, import_react_notifications6.useNotifications)();
+  React5.useEffect(() => {
+    clearNotifications();
+  }, [screen.value, clearNotifications]);
+  React5.useEffect(() => {
+    return clearNotifications;
+  }, [clearNotifications]);
+  const onGoToSignIn = /* @__PURE__ */__name(() => {
+    setScreen({
+      value: "signIn"
+    });
+  }, "onGoToSignIn");
+  const onGoToSignUp = React5.useCallback(() => {
+    if (!onSignUp) {
+      return void 0;
+    }
+    setScreen({
+      value: "signUp"
+    });
+  }, [onSignUp, setScreen]);
+  const onGoToForgotPassword = React5.useCallback(() => {
+    if (!onForgotPassword) {
+      return void 0;
+    }
+    setScreen({
+      value: "forgotPassword"
+    });
+  }, [onForgotPassword, setScreen]);
+  const notificationsWrapper = /* @__PURE__ */__name(fn => {
+    return async input => {
+      if (fn) {
+        clearNotifications();
+        setLoading(true);
+        const result = await fn(input);
+        setLoading(false);
+        return result;
+      }
+    };
+  }, "notificationsWrapper");
+  if (screen.value === "signIn") {
+    return /* @__PURE__ */React5.createElement(AuthSignIn, {
+      onSignIn: notificationsWrapper(onSignIn),
+      onGoToSignUp: onSignUp && onGoToSignUp,
+      onGoToForgotPassword: onForgotPassword && onGoToForgotPassword,
+      passwordMinimumLength
+    });
+  }
+  if (screen.value === "signUp" && onSignUp) {
+    return /* @__PURE__ */React5.createElement(AuthSignUp, {
+      onSignUp: notificationsWrapper(onSignUp),
+      passwordMinimumLength,
+      onGoToSignIn,
+      signUpTerms
+    });
+  }
+  if (screen.value === "forgotPassword" && onForgotPassword) {
+    return /* @__PURE__ */React5.createElement(AuthForgotPassword, {
+      onForgotPassword: notificationsWrapper(onForgotPassword),
+      onGoToSignIn,
+      onGoToSignUp: onSignUp && onGoToSignUp
+    });
+  }
+  if (screen.value === "confirmResetPassword" && onForgotPasswordResetPassword) {
+    return /* @__PURE__ */React5.createElement(AuthForgotPasswordResetPassword, {
+      onForgotPasswordResetPassword: notificationsWrapper(onForgotPasswordResetPassword),
+      onGoToSignIn,
+      email: screen.context.email
+    });
+  }
+  if (screen.value === "confirmSignUpWithCode" && onConfirmSignUpWithCode) {
+    return /* @__PURE__ */React5.createElement(AuthConfirmSignUpWithCode, {
+      onConfirmSignUpWithCode: notificationsWrapper(onConfirmSignUpWithCode),
+      email: screen.context.email
+    });
+  }
+  if (screen.value === "confirmSignUpCheckEmail" && onConfirmSignUpCheckEmail) {
+    return /* @__PURE__ */React5.createElement(AuthConfirmSignUpCheckEmail, {
+      onConfirmSignUpCheckEmail
+    });
+  }
+  return null;
+}, "AuthLogic");
+var Auth = /* @__PURE__ */__name(props => {
+  const {
+    layout = {
+      fullScreen: true
+    }
+  } = props;
+  const withLogoNode = React5.useMemo(() => {
+    return /* @__PURE__ */React5.createElement(LogoProvider, {
+      logo: props.logo
+    }, /* @__PURE__ */React5.createElement(ErrorBoundary, null, /* @__PURE__ */React5.createElement(AuthLogic, props)));
+  }, [props]);
+  if (layout.fullScreen) {
+    if (layout.sideContentPosition) {
+      return /* @__PURE__ */React5.createElement(AuthFullScreen, null, /* @__PURE__ */React5.createElement(import_ui7.Flex, {
+        sx: {
+          width: "100%",
+          height: "100%",
+          flexDirection: layout.sideContentPosition === "left" ? "row" : "row-reverse"
+        }
+      }, /* @__PURE__ */React5.createElement(import_ui7.Flex, {
+        sx: {
+          width: "100%",
+          height: "100%",
+          flex: [0, 0, 1],
+          justifyContent: "center",
+          alignItems: "center"
+        }
+      }, layout.sideContent), /* @__PURE__ */React5.createElement(import_ui7.Flex, {
+        sx: {
+          width: "100%",
+          height: "100%",
+          flex: [1],
+          justifyContent: "center",
+          alignItems: "center"
+        }
+      }, withLogoNode)));
+    }
+    return /* @__PURE__ */React5.createElement(AuthFullScreen, null, withLogoNode);
+  }
+  return withLogoNode;
+}, "Auth");
+
+// src/AuthProvider.tsx
+var import_react_notifications7 = require("@ttoss/react-notifications");
+var React6 = __toESM(require("react"), 1);
+var AuthContext = /* @__PURE__ */React6.createContext(null);
+var UNAUTHENTICATED_USER = {
+  user: null,
+  tokens: null,
+  isAuthenticated: false
+};
+var AuthProvider = /* @__PURE__ */__name(props => {
+  const {
+    getAuthData,
+    signOut: signOutProp
+  } = props;
+  const {
+    setLoading
+  } = (0, import_react_notifications7.useNotifications)();
+  const [authData, setAuthData] = React6.useState({
+    user: null,
+    tokens: null,
+    isAuthenticated: void 0
+  });
+  React6.useEffect(() => {
+    setLoading(authData.isAuthenticated === void 0);
+  }, [authData.isAuthenticated, setLoading]);
+  React6.useEffect(() => {
+    const fetchAuthData = /* @__PURE__ */__name(async () => {
+      try {
+        const data = await getAuthData?.();
+        if (data) {
+          setAuthData(data);
+        } else {
+          setAuthData(UNAUTHENTICATED_USER);
+        }
+      } catch {
+        setAuthData(UNAUTHENTICATED_USER);
+      }
+    }, "fetchAuthData");
+    fetchAuthData();
+  }, [getAuthData]);
+  const signOut = React6.useCallback(async () => {
+    await signOutProp?.();
+    setAuthData(UNAUTHENTICATED_USER);
+  }, [signOutProp]);
+  if (authData.isAuthenticated === void 0) {
+    return null;
+  }
+  return /* @__PURE__ */React6.createElement(AuthContext.Provider, {
+    value: {
+      signOut,
+      isAuthenticated: authData.isAuthenticated ?? false,
+      user: authData.user,
+      tokens: authData.tokens,
+      setAuthData
+    }
+  }, props.children);
+}, "AuthProvider");
+var useAuth = /* @__PURE__ */__name(() => {
+  const context = React6.useContext(AuthContext);
+  if (!context) {
+    throw new Error("useAuth must be used within an AuthProvider");
+  }
+  return context;
+}, "useAuth");
+
+// src/useAuthScreen.ts
+var React7 = __toESM(require("react"), 1);
+var useAuthScreen = /* @__PURE__ */__name(initialScreen => {
+  const [screen, setScreen] = React7.useState(initialScreen || {
+    value: "signIn"
+  });
+  return {
+    screen,
+    setScreen
+  };
+}, "useAuthScreen");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Auth,
+  AuthConfirmSignUpCheckEmail,
+  AuthConfirmSignUpWithCode,
+  AuthForgotPassword,
+  AuthForgotPasswordResetPassword,
+  AuthFullScreen,
+  AuthProvider,
+  AuthSignIn,
+  AuthSignUp,
+  ErrorBoundary,
+  useAuth,
+  useAuthScreen
+});