@sikka/hawa 0.23.8-next → 0.23.10-next

package/dist/blocks/auth/index.mjs

@@ -0,0 +1,1057 @@
+import {
+  Alert,
+  Checkbox,
+  Logos,
+  PhoneInput,
+  PinInput,
+  StopPropagationWrapper
+} from "../../chunk-TR56G3NM.mjs";
+import {
+  Input
+} from "../../chunk-A25EXELT.mjs";
+import {
+  EyeIcon,
+  HiddenEyeIcon,
+  Select
+} from "../../chunk-UAVBFK53.mjs";
+import {
+  Button,
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+  Loading,
+  cn
+} from "../../chunk-677VOLD4.mjs";
+
+// components/blocks/auth/LoginForm.tsx
+import React2, { useState } from "react";
+import { Controller, useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { parsePhoneNumber } from "libphonenumber-js";
+import * as z from "zod";
+
+// components/blocks/auth/AuthButtons.tsx
+import React from "react";
+var AuthButtons = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
+  return /* @__PURE__ */ React.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-4" }, props.viaGoogle && /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      disabled: props.isGoogleLoading,
+      className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2",
+      variant: "outline",
+      onClick: props.handleGoogle
+    },
+    props.isGoogleLoading ? /* @__PURE__ */ React.createElement(Loading, { size: "button" }) : /* @__PURE__ */ React.createElement(Logos.google, { className: "hawa-icon" }),
+    (_b = (_a = props.texts) == null ? void 0 : _a.continueWithGoogle) != null ? _b : "Continue With Google"
+  ), props.viaGithub && /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      disabled: props.isGithubLoading,
+      className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2",
+      variant: "outline",
+      onClick: props.handleGithub
+    },
+    props.isGithubLoading ? /* @__PURE__ */ React.createElement(Loading, { size: "button" }) : /* @__PURE__ */ React.createElement(Logos.github, { className: "hawa-icon" }),
+    (_d = (_c = props.texts) == null ? void 0 : _c.continueWithGithub) != null ? _d : "Continue With Github"
+  ), props.viaTwitter && /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      disabled: props.isTwitterLoading,
+      className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2",
+      variant: "outline",
+      onClick: props.handleTwitter
+    },
+    props.isTwitterLoading ? /* @__PURE__ */ React.createElement(Loading, { size: "button" }) : /* @__PURE__ */ React.createElement(Logos.twitter, { className: "hawa-icon" }),
+    (_f = (_e = props.texts) == null ? void 0 : _e.continueWithTwitter) != null ? _f : "Continue With Twitter"
+  ), props.viaApple && /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      disabled: props.isAppleLoading,
+      className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2",
+      variant: "outline",
+      onClick: props.handleApple
+    },
+    props.isAppleLoading ? /* @__PURE__ */ React.createElement(Loading, { size: "button" }) : /* @__PURE__ */ React.createElement(Logos.apple, { className: "hawa-icon" }),
+    (_h = (_g = props.texts) == null ? void 0 : _g.continueWithApple) != null ? _h : "Continue With Apple"
+  ), props.viaMicrosoft && /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      disabled: props.isMicrosoftLoading,
+      className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2",
+      variant: "outline",
+      onClick: props.handleMicrosoft
+    },
+    props.isMicrosoftLoading ? /* @__PURE__ */ React.createElement(Loading, { size: "button" }) : /* @__PURE__ */ React.createElement(Logos.microsoft, { className: "hawa-icon" }),
+    (_j = (_i = props.texts) == null ? void 0 : _i.continueWithMicrosoft) != null ? _j : "Continue With Microsoft"
+  ), props.viaEmail && /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      disabled: props.isEmailLoading,
+      className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2",
+      variant: "outline",
+      onClick: props.handleEmail
+    },
+    props.isEmailLoading ? /* @__PURE__ */ React.createElement(Loading, { size: "button" }) : /* @__PURE__ */ React.createElement(Logos.mail, { className: "hawa-icon" }),
+    (_l = (_k = props.texts) == null ? void 0 : _k.continueWithEmail) != null ? _l : "Continue With Email"
+  ), props.viaPhone && /* @__PURE__ */ React.createElement(
+    Button,
+    {
+      disabled: props.isPhoneLoading,
+      className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-2",
+      variant: "outline",
+      onClick: props.handlePhone
+    },
+    props.isPhoneLoading ? /* @__PURE__ */ React.createElement(Loading, { size: "button" }) : /* @__PURE__ */ React.createElement(Logos.phone, { className: "hawa-icon" }),
+    (_n = (_m = props.texts) == null ? void 0 : _m.continueWithPhone) != null ? _n : "Continue With Phone"
+  ));
+};
+
+// components/blocks/auth/LoginForm.tsx
+var LoginForm = ({
+  loginType,
+  texts,
+  passwordLength = 8,
+  ...props
+}) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q;
+  const [passwordVisible, setPasswordVisible] = useState(false);
+  const thirdPartyAuthTexts = {
+    continueWithGoogle: texts == null ? void 0 : texts.continueWithGoogle,
+    continueWithTwitter: texts == null ? void 0 : texts.continueWithTwitter,
+    continueWithApple: texts == null ? void 0 : texts.continueWithApple,
+    continueWithMicrosoft: texts == null ? void 0 : texts.continueWithMicrosoft,
+    continueWithGithub: texts == null ? void 0 : texts.continueWithGithub,
+    continueWithEmail: texts == null ? void 0 : texts.continueWithEmail,
+    continueWithPhone: texts == null ? void 0 : texts.continueWithPhone
+  };
+  let formSchema;
+  if (loginType === "email") {
+    formSchema = z.object({
+      email: z.string({ required_error: (_a = texts == null ? void 0 : texts.email) == null ? void 0 : _a.required }).min(1, { message: (_b = texts == null ? void 0 : texts.email) == null ? void 0 : _b.required }).email({ message: (_c = texts == null ? void 0 : texts.email) == null ? void 0 : _c.invalid }),
+      password: z.string({ required_error: (_d = texts == null ? void 0 : texts.password) == null ? void 0 : _d.required }).min(1, { message: (_e = texts == null ? void 0 : texts.password) == null ? void 0 : _e.required }).min(passwordLength, { message: (_f = texts == null ? void 0 : texts.password) == null ? void 0 : _f.tooShort })
+    });
+  } else if (loginType === "username") {
+    formSchema = z.object({
+      username: z.string({ required_error: (_g = texts == null ? void 0 : texts.username) == null ? void 0 : _g.required }).min(2, { message: (_h = texts == null ? void 0 : texts.username) == null ? void 0 : _h.tooShort }).refine(
+        (value) => {
+          const isValid = /^[a-zA-Z][a-zA-Z0-9_-]{2,14}$/.test(value);
+          return isValid;
+        },
+        { message: (_i = texts == null ? void 0 : texts.username) == null ? void 0 : _i.invalid }
+      ),
+      password: z.string({ required_error: (_j = texts == null ? void 0 : texts.password) == null ? void 0 : _j.required }).min(1, { message: (_k = texts == null ? void 0 : texts.password) == null ? void 0 : _k.required }).min(passwordLength, { message: (_l = texts == null ? void 0 : texts.password) == null ? void 0 : _l.tooShort })
+    });
+  } else if (loginType === "phone") {
+    formSchema = z.object({
+      phone: z.string({ required_error: (_m = texts == null ? void 0 : texts.phone) == null ? void 0 : _m.required }).refine(
+        (value) => {
+          let phoneNumber = parsePhoneNumber(value);
+          return phoneNumber.isValid();
+        },
+        { message: (_n = texts == null ? void 0 : texts.phone) == null ? void 0 : _n.invalid }
+      )
+    });
+  } else if (loginType === "link") {
+    formSchema = z.object({
+      email: z.string({ required_error: (_o = texts == null ? void 0 : texts.email) == null ? void 0 : _o.required }).min(1, { message: (_p = texts == null ? void 0 : texts.email) == null ? void 0 : _p.required }).email({ message: (_q = texts == null ? void 0 : texts.email) == null ? void 0 : _q.invalid })
+    });
+  } else {
+    formSchema = z.object({});
+  }
+  const { handleSubmit, control, formState } = useForm({
+    resolver: zodResolver(formSchema)
+  });
+  const renderFields = () => {
+    switch (loginType) {
+      case "email":
+        return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(
+          Controller,
+          {
+            control,
+            name: "email",
+            render: ({ field }) => {
+              var _a2, _b2, _c2;
+              return /* @__PURE__ */ React2.createElement(
+                Input,
+                {
+                  inputProps: {
+                    className: props.direction === "rtl" ? "hawa-text-right" : "hawa-text-left"
+                  },
+                  dir: "ltr",
+                  width: "full",
+                  autoComplete: "email",
+                  label: (_a2 = texts == null ? void 0 : texts.email) == null ? void 0 : _a2.label,
+                  helperText: (_b2 = formState.errors.email) == null ? void 0 : _b2.message,
+                  placeholder: ((_c2 = texts == null ? void 0 : texts.email) == null ? void 0 : _c2.placeholder) || "contact@sikka.io",
+                  ...field
+                }
+              );
+            }
+          }
+        ), /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement(
+          Controller,
+          {
+            control,
+            name: "password",
+            render: ({ field }) => {
+              var _a2, _b2, _c2;
+              return /* @__PURE__ */ React2.createElement(
+                Input,
+                {
+                  width: "full",
+                  autoComplete: "current-password",
+                  type: passwordVisible ? "text" : "password",
+                  label: ((_a2 = texts == null ? void 0 : texts.password) == null ? void 0 : _a2.label) || "Password",
+                  endIcon: /* @__PURE__ */ React2.createElement(
+                    "div",
+                    {
+                      className: "hawa-cursor-pointer",
+                      onClick: () => setPasswordVisible(!passwordVisible)
+                    },
+                    passwordVisible ? /* @__PURE__ */ React2.createElement(EyeIcon, { className: "hawa-text-gray-500" }) : /* @__PURE__ */ React2.createElement(HiddenEyeIcon, { className: "hawa-text-gray-500" })
+                  ),
+                  placeholder: ((_b2 = texts == null ? void 0 : texts.password) == null ? void 0 : _b2.placeholder) || "Enter your password",
+                  helperText: (_c2 = formState.errors.password) == null ? void 0 : _c2.message,
+                  ...field
+                }
+              );
+            }
+          }
+        ), !props.withoutResetPassword && /* @__PURE__ */ React2.createElement(
+          "div",
+          {
+            onClick: props.onForgotPassword,
+            className: "hawa-mb-3  hawa-mt-2 hawa-w-fit hawa-cursor-pointer hawa-select-none hawa-text-xs dark:hawa-text-gray-300"
+          },
+          (texts == null ? void 0 : texts.forgotPassword) || "Forgot Password?"
+        )));
+      case "username":
+        return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(
+          Controller,
+          {
+            control,
+            name: "username",
+            render: ({ field }) => {
+              var _a2, _b2, _c2;
+              return /* @__PURE__ */ React2.createElement(
+                Input,
+                {
+                  width: "full",
+                  autoComplete: "username",
+                  label: ((_a2 = texts == null ? void 0 : texts.username) == null ? void 0 : _a2.label) || "Username",
+                  helperText: (_b2 = formState.errors.username) == null ? void 0 : _b2.message,
+                  placeholder: ((_c2 = texts == null ? void 0 : texts.username) == null ? void 0 : _c2.placeholder) || "sikka_sa",
+                  ...field
+                }
+              );
+            }
+          }
+        ), /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement(
+          Controller,
+          {
+            control,
+            name: "password",
+            render: ({ field }) => {
+              var _a2, _b2, _c2;
+              return /* @__PURE__ */ React2.createElement(
+                Input,
+                {
+                  width: "full",
+                  autoComplete: "current-password",
+                  type: passwordVisible ? "text" : "password",
+                  label: (_a2 = texts == null ? void 0 : texts.password) == null ? void 0 : _a2.label,
+                  endIcon: /* @__PURE__ */ React2.createElement(
+                    "div",
+                    {
+                      className: "hawa-cursor-pointer",
+                      onClick: () => setPasswordVisible(!passwordVisible)
+                    },
+                    passwordVisible ? /* @__PURE__ */ React2.createElement(EyeIcon, { className: "hawa-text-gray-500" }) : /* @__PURE__ */ React2.createElement(HiddenEyeIcon, { className: "hawa-text-gray-500" })
+                  ),
+                  placeholder: ((_b2 = texts == null ? void 0 : texts.password) == null ? void 0 : _b2.placeholder) || "Enter your password",
+                  helperText: (_c2 = formState.errors.password) == null ? void 0 : _c2.message,
+                  ...field
+                }
+              );
+            }
+          }
+        ), !props.withoutResetPassword && /* @__PURE__ */ React2.createElement(
+          "div",
+          {
+            onClick: props.onForgotPassword,
+            className: "hawa-mb-3 hawa-mt-2 hawa-w-fit hawa-cursor-pointer hawa-select-none hawa-text-xs dark:hawa-text-gray-300"
+          },
+          (texts == null ? void 0 : texts.forgotPassword) || "Forgot Password?"
+        )));
+      case "phone":
+        return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(
+          Controller,
+          {
+            control,
+            name: "phone",
+            render: ({ field }) => {
+              var _a2, _b2;
+              return /* @__PURE__ */ React2.createElement(
+                PhoneInput,
+                {
+                  label: (_a2 = texts == null ? void 0 : texts.phone) == null ? void 0 : _a2.label,
+                  helperText: (_b2 = formState.errors.phone) == null ? void 0 : _b2.message,
+                  preferredCountry: { label: "+966" },
+                  handleChange: (e) => field.onChange(parsePhoneNumber(e).number)
+                }
+              );
+            }
+          }
+        ));
+      case "link":
+        return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(
+          Controller,
+          {
+            control,
+            name: "email",
+            render: ({ field }) => {
+              var _a2, _b2, _c2;
+              return /* @__PURE__ */ React2.createElement(
+                Input,
+                {
+                  width: "full",
+                  autoComplete: "email",
+                  label: ((_a2 = texts == null ? void 0 : texts.email) == null ? void 0 : _a2.label) || "Email",
+                  helperText: (_b2 = formState.errors.email) == null ? void 0 : _b2.message,
+                  placeholder: ((_c2 = texts == null ? void 0 : texts.email) == null ? void 0 : _c2.placeholder) || "contact@sikka.io",
+                  ...field
+                }
+              );
+            }
+          }
+        ));
+      default:
+        break;
+    }
+  };
+  return /* @__PURE__ */ React2.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-4" }, /* @__PURE__ */ React2.createElement(Card, { dir: props.direction }, /* @__PURE__ */ React2.createElement(CardContent, { headless: true }, props.showError && /* @__PURE__ */ React2.createElement(
+    Alert,
+    {
+      direction: props.direction,
+      title: props.errorTitle,
+      text: props.errorText,
+      severity: "error"
+    }
+  ), /* @__PURE__ */ React2.createElement(
+    "form",
+    {
+      noValidate: true,
+      className: "hawa-flex hawa-flex-col hawa-gap-4",
+      onSubmit: handleSubmit((e) => {
+        if (props.onLogin) {
+          return props.onLogin(e);
+        } else {
+          console.log("Form is submitted but onLogin prop is missing");
+        }
+      })
+    },
+    renderFields(),
+    /* @__PURE__ */ React2.createElement(
+      Button,
+      {
+        className: "hawa-mt-0 hawa-w-full",
+        type: "submit",
+        isLoading: props.isLoading,
+        disabled: props.isLoading
+      },
+      (texts == null ? void 0 : texts.loginText) || "Login"
+    ),
+    props.additionalButtons,
+    props.allowRegister && /* @__PURE__ */ React2.createElement("div", { className: "hawa-select-none hawa-p-3 hawa-text-center hawa-text-sm hawa-font-normal dark:hawa-text-gray-300" }, (texts == null ? void 0 : texts.newUserText) || "New user?", " ", /* @__PURE__ */ React2.createElement(
+      "span",
+      {
+        onClick: props.onRouteToRegister,
+        className: "clickable-link"
+      },
+      (texts == null ? void 0 : texts.createAccount) || "Create Account"
+    ))
+  )), props.viaGithub || props.viaGoogle || props.viaTwitter ? /* @__PURE__ */ React2.createElement(
+    CardFooter,
+    {
+      className: cn(
+        props.logosOnly ? "hawa-flex hawa-flex-row hawa-justify-center hawa-gap-2" : "hawa-grid hawa-grid-cols-1 hawa-gap-2"
+      )
+    },
+    /* @__PURE__ */ React2.createElement(
+      AuthButtons,
+      {
+        texts: thirdPartyAuthTexts,
+        viaGoogle: props.viaGoogle,
+        viaGithub: props.viaGithub,
+        viaTwitter: props.viaTwitter,
+        isGoogleLoading: props.isGoogleLoading,
+        isGithubLoading: props.isGithubLoading,
+        isTwitterLoading: props.isTwitterLoading,
+        handleGoogle: props.onGoogleLogin,
+        handleGithub: props.onGithubLogin,
+        handleTwitter: props.onTwitterLogin
+      }
+    )
+  ) : null));
+};
+
+// components/blocks/auth/RegisterForm.tsx
+import React3, { useState as useState2 } from "react";
+import { Controller as Controller2, FormProvider, useForm as useForm2 } from "react-hook-form";
+import { zodResolver as zodResolver2 } from "@hookform/resolvers/zod";
+import * as z2 from "zod";
+var RegisterForm = ({
+  texts,
+  registerFields = ["email"],
+  ...props
+}) => {
+  var _a, _b, _c, _d, _e, _f;
+  const [passwordVisible, setPasswordVisible] = useState2(false);
+  const thirdPartyAuthTexts = {
+    continueWithGoogle: texts == null ? void 0 : texts.continueWithGoogle,
+    continueWithTwitter: texts == null ? void 0 : texts.continueWithTwitter,
+    continueWithApple: texts == null ? void 0 : texts.continueWithApple,
+    continueWithMicrosoft: texts == null ? void 0 : texts.continueWithMicrosoft,
+    continueWithGithub: texts == null ? void 0 : texts.continueWithGithub,
+    continueWithEmail: texts == null ? void 0 : texts.continueWithEmail,
+    continueWithPhone: texts == null ? void 0 : texts.continueWithPhone
+  };
+  const methods = useForm2();
+  let fieldSchemas = {};
+  registerFields.forEach((field) => {
+    var _a2, _b2, _c2, _d2, _e2, _f2;
+    switch (field) {
+      case "fullname":
+        fieldSchemas["fullName"] = z2.string().optional();
+        break;
+      case "email":
+        fieldSchemas["email"] = z2.string({ required_error: (_a2 = texts == null ? void 0 : texts.email) == null ? void 0 : _a2.required }).email({ message: (_b2 = texts == null ? void 0 : texts.email) == null ? void 0 : _b2.invalid }).min(1, { message: (_c2 = texts == null ? void 0 : texts.email) == null ? void 0 : _c2.required });
+        break;
+      case "username":
+        fieldSchemas["username"] = z2.string({ required_error: (_d2 = texts == null ? void 0 : texts.username) == null ? void 0 : _d2.required }).min(1, { message: (_e2 = texts == null ? void 0 : texts.username) == null ? void 0 : _e2.required }).refine(
+          (value) => {
+            const isValid = /^[a-zA-Z][a-zA-Z0-9_-]{2,14}$/.test(value);
+            return isValid;
+          },
+          { message: (_f2 = texts == null ? void 0 : texts.username) == null ? void 0 : _f2.invalid }
+        );
+        break;
+    }
+  });
+  const formSchema = z2.object({
+    ...fieldSchemas,
+    password: z2.string({ required_error: (_a = texts == null ? void 0 : texts.password) == null ? void 0 : _a.required }).min(5, { message: (_b = texts == null ? void 0 : texts.password) == null ? void 0 : _b.tooShort }).refine((value) => value !== "", {
+      message: (_c = texts == null ? void 0 : texts.password) == null ? void 0 : _c.required
+    }),
+    confirm_password: z2.string({ required_error: (_d = texts == null ? void 0 : texts.confirm) == null ? void 0 : _d.required }).refine((value) => value !== "", {
+      message: (_e = texts == null ? void 0 : texts.password) == null ? void 0 : _e.required
+    }),
+    refCode: z2.string().optional(),
+    reference: z2.string().optional(),
+    terms_accepted: z2.boolean({ required_error: texts == null ? void 0 : texts.termsRequired }).refine((value) => value, { message: texts == null ? void 0 : texts.termsRequired }),
+    newsletter_accepted: z2.boolean().optional()
+  }).refine((data) => data.password === data.confirm_password, {
+    message: (_f = texts == null ? void 0 : texts.confirm) == null ? void 0 : _f.dontMatch,
+    path: ["confirm_password"]
+  });
+  const { handleSubmit, control, formState } = useForm2({
+    resolver: zodResolver2(formSchema)
+  });
+  return /* @__PURE__ */ React3.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-4" }, /* @__PURE__ */ React3.createElement(Card, { dir: props.direction }, /* @__PURE__ */ React3.createElement(CardContent, { headless: true }, /* @__PURE__ */ React3.createElement("div", null, props.showError && /* @__PURE__ */ React3.createElement(
+    Alert,
+    {
+      title: props.errorTitle,
+      text: props.errorText,
+      severity: "error"
+    }
+  ), /* @__PURE__ */ React3.createElement(FormProvider, { ...methods }, /* @__PURE__ */ React3.createElement(
+    "form",
+    {
+      noValidate: true,
+      onSubmit: handleSubmit((e) => {
+        if (props.onRegister) {
+          return props.onRegister(e);
+        } else {
+          console.log(
+            "Form is submitted but onRegister prop is missing"
+          );
+        }
+      }),
+      className: "hawa-flex hawa-flex-col hawa-gap-4"
+    },
+    /* @__PURE__ */ React3.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-4" }, registerFields.map((fld, i) => {
+      if (fld === "fullname") {
+        return /* @__PURE__ */ React3.createElement(
+          Controller2,
+          {
+            key: i,
+            control,
+            name: "fullName",
+            render: ({ field }) => {
+              var _a2, _b2, _c2;
+              return /* @__PURE__ */ React3.createElement(
+                Input,
+                {
+                  width: "full",
+                  label: (_a2 = texts == null ? void 0 : texts.fullName) == null ? void 0 : _a2.label,
+                  placeholder: (_b2 = texts == null ? void 0 : texts.fullName) == null ? void 0 : _b2.placeholder,
+                  helperText: (_c2 = formState.errors.fullName) == null ? void 0 : _c2.message,
+                  ...field
+                }
+              );
+            }
+          }
+        );
+      }
+      if (fld === "email") {
+        return /* @__PURE__ */ React3.createElement(
+          Controller2,
+          {
+            key: i,
+            control,
+            name: "email",
+            render: ({ field }) => {
+              var _a2, _b2, _c2;
+              return /* @__PURE__ */ React3.createElement(
+                Input,
+                {
+                  dir: "ltr",
+                  inputProps: {
+                    className: props.direction === "rtl" ? "hawa-text-right" : "hawa-text-left"
+                  },
+                  width: "full",
+                  autoComplete: "email",
+                  label: (_a2 = texts == null ? void 0 : texts.email) == null ? void 0 : _a2.label,
+                  helperText: (_b2 = formState.errors.email) == null ? void 0 : _b2.message,
+                  placeholder: ((_c2 = texts == null ? void 0 : texts.email) == null ? void 0 : _c2.placeholder) || "Enter your email",
+                  ...field
+                }
+              );
+            }
+          }
+        );
+      }
+      if (fld === "username") {
+        return /* @__PURE__ */ React3.createElement(
+          Controller2,
+          {
+            key: i,
+            control,
+            name: "username",
+            render: ({ field }) => {
+              var _a2, _b2, _c2;
+              return /* @__PURE__ */ React3.createElement(
+                Input,
+                {
+                  width: "full",
+                  autoComplete: "username",
+                  label: (_a2 = texts == null ? void 0 : texts.username) == null ? void 0 : _a2.label,
+                  helperText: (_b2 = formState.errors.username) == null ? void 0 : _b2.message,
+                  placeholder: (_c2 = texts == null ? void 0 : texts.username) == null ? void 0 : _c2.placeholder,
+                  ...field
+                }
+              );
+            }
+          }
+        );
+      }
+    })),
+    /* @__PURE__ */ React3.createElement(
+      Controller2,
+      {
+        control,
+        name: "password",
+        render: ({ field }) => {
+          var _a2, _b2, _c2;
+          return /* @__PURE__ */ React3.createElement(
+            Input,
+            {
+              width: "full",
+              type: passwordVisible ? "text" : "password",
+              endIcon: /* @__PURE__ */ React3.createElement(
+                "div",
+                {
+                  className: "hawa-cursor-pointer",
+                  onClick: () => setPasswordVisible(!passwordVisible)
+                },
+                passwordVisible ? /* @__PURE__ */ React3.createElement(EyeIcon, { className: "hawa-text-gray-500" }) : /* @__PURE__ */ React3.createElement(HiddenEyeIcon, { className: "hawa-text-gray-500" }),
+                " "
+              ),
+              autoComplete: "new-password",
+              label: (_a2 = texts == null ? void 0 : texts.password) == null ? void 0 : _a2.label,
+              placeholder: (_b2 = texts == null ? void 0 : texts.password) == null ? void 0 : _b2.placeholder,
+              helperText: (_c2 = formState.errors.password) == null ? void 0 : _c2.message,
+              ...field
+            }
+          );
+        }
+      }
+    ),
+    /* @__PURE__ */ React3.createElement(
+      Controller2,
+      {
+        control,
+        name: "confirm_password",
+        render: ({ field }) => {
+          var _a2, _b2, _c2;
+          return /* @__PURE__ */ React3.createElement(
+            Input,
+            {
+              width: "full",
+              type: "password",
+              autoComplete: "new-password",
+              label: (_a2 = texts == null ? void 0 : texts.confirm) == null ? void 0 : _a2.label,
+              placeholder: (_b2 = texts == null ? void 0 : texts.confirm) == null ? void 0 : _b2.placeholder,
+              helperText: (_c2 = formState.errors.confirm_password) == null ? void 0 : _c2.message,
+              ...field
+            }
+          );
+        }
+      }
+    ),
+    props.additionalInputs,
+    props.showRefCode && /* @__PURE__ */ React3.createElement(
+      Controller2,
+      {
+        control,
+        name: "refCode",
+        render: ({ field }) => {
+          var _a2;
+          return /* @__PURE__ */ React3.createElement(
+            Input,
+            {
+              width: "full",
+              label: texts == null ? void 0 : texts.refCode,
+              placeholder: (texts == null ? void 0 : texts.refCodePlaceholder) || "Enter the referral code",
+              helperText: (_a2 = formState.errors.refCode) == null ? void 0 : _a2.message,
+              ...field
+            }
+          );
+        }
+      }
+    ),
+    props.showUserSource && /* @__PURE__ */ React3.createElement(
+      Controller2,
+      {
+        control,
+        name: "reference",
+        render: ({ field }) => {
+          var _a2, _b2;
+          return /* @__PURE__ */ React3.createElement(
+            Select,
+            {
+              label: ((_a2 = texts == null ? void 0 : texts.userReference) == null ? void 0 : _a2.label) || "How did you learn about us?",
+              placeholder: (_b2 = texts == null ? void 0 : texts.userReference) == null ? void 0 : _b2.placeholder,
+              isCreatable: false,
+              isMulti: false,
+              isSearchable: false,
+              isClearable: false,
+              options: props.userReferenceOptions,
+              onChange: (e) => {
+                field.onChange(e.value);
+              }
+            }
+          );
+        }
+      }
+    ),
+    /* @__PURE__ */ React3.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-3" }, props.showTermsOption && /* @__PURE__ */ React3.createElement(
+      Controller2,
+      {
+        control,
+        name: "terms_accepted",
+        render: ({ field }) => {
+          var _a2, _b2;
+          return /* @__PURE__ */ React3.createElement(
+            Checkbox,
+            {
+              id: "terms_accepted",
+              helperText: (_b2 = (_a2 = formState.errors.terms_accepted) == null ? void 0 : _a2.message) == null ? void 0 : _b2.toString(),
+              onCheckedChange: (e) => field.onChange(e),
+              label: /* @__PURE__ */ React3.createElement("div", { className: "hawa-flex hawa-flex-row hawa-gap-0.5" }, /* @__PURE__ */ React3.createElement("span", null, texts == null ? void 0 : texts.iAcceptText), " ", /* @__PURE__ */ React3.createElement(StopPropagationWrapper, null, /* @__PURE__ */ React3.createElement(
+                "a",
+                {
+                  onClick: props.onRouteToTOS,
+                  className: "clickable-link"
+                },
+                texts == null ? void 0 : texts.termsText
+              )))
+            }
+          );
+        }
+      }
+    ), props.showNewsletterOption && /* @__PURE__ */ React3.createElement(
+      Controller2,
+      {
+        control,
+        name: "newsletter_accepted",
+        render: ({ field }) => /* @__PURE__ */ React3.createElement(
+          Checkbox,
+          {
+            id: "newsletter_accepted",
+            label: texts == null ? void 0 : texts.subscribeToNewsletter,
+            onCheckedChange: field.onChange
+          }
+        )
+      }
+    )),
+    /* @__PURE__ */ React3.createElement(
+      Button,
+      {
+        isLoading: props.isLoading,
+        className: "hawa-mt-4 hawa-w-full"
+      },
+      texts == null ? void 0 : texts.registerText
+    ),
+    props.additionalButtons
+  )), /* @__PURE__ */ React3.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-justify-center hawa-gap-1 hawa-p-3 hawa-text-center  hawa-text-sm hawa-font-normal dark:hawa-text-white" }, /* @__PURE__ */ React3.createElement("span", null, texts == null ? void 0 : texts.existingUserText), /* @__PURE__ */ React3.createElement("span", { onClick: props.onRouteToLogin, className: "clickable-link" }, (texts == null ? void 0 : texts.loginText) || "Login")))), props.viaGithub || props.viaGoogle || props.viaTwitter ? /* @__PURE__ */ React3.createElement(
+    CardFooter,
+    {
+      className: cn(
+        props.logosOnly ? "hawa-flex hawa-flex-row hawa-justify-center hawa-gap-2" : "hawa-grid hawa-grid-cols-1 hawa-gap-2"
+      )
+    },
+    /* @__PURE__ */ React3.createElement(
+      AuthButtons,
+      {
+        texts: thirdPartyAuthTexts,
+        viaGoogle: props.viaGoogle,
+        viaGithub: props.viaGithub,
+        viaTwitter: props.viaTwitter,
+        isGoogleLoading: props.isGoogleLoading,
+        isGithubLoading: props.isGithubLoading,
+        isTwitterLoading: props.isTwitterLoading,
+        handleGoogle: props.onGoogleRegister,
+        handleGithub: props.onGithubRegister,
+        handleTwitter: props.onTwitterRegister
+      }
+    )
+  ) : null));
+};
+
+// components/blocks/auth/AppLanding.tsx
+import React4 from "react";
+var AppLanding = ({ texts, ...props }) => {
+  const thirdPartyAuthTexts = {
+    continueWithGoogle: texts == null ? void 0 : texts.continueWithGoogle,
+    continueWithTwitter: texts == null ? void 0 : texts.continueWithTwitter,
+    continueWithApple: texts == null ? void 0 : texts.continueWithApple,
+    continueWithMicrosoft: texts == null ? void 0 : texts.continueWithMicrosoft,
+    continueWithGithub: texts == null ? void 0 : texts.continueWithGithub,
+    continueWithEmail: texts == null ? void 0 : texts.continueWithEmail,
+    continueWithPhone: texts == null ? void 0 : texts.continueWithPhone
+  };
+  return /* @__PURE__ */ React4.createElement("div", { dir: props.direction }, /* @__PURE__ */ React4.createElement(Card, null, /* @__PURE__ */ React4.createElement(CardContent, { headless: true, className: "hawa-flex hawa-flex-col hawa-gap-6" }, /* @__PURE__ */ React4.createElement(
+    AuthButtons,
+    {
+      texts: thirdPartyAuthTexts,
+      viaApple: props.viaApple,
+      viaGoogle: props.viaGoogle,
+      viaEmail: props.viaEmail,
+      viaGithub: props.viaGithub,
+      viaMicrosoft: props.viaMicrosoft,
+      viaPhone: props.viaPhone,
+      viaTwitter: props.viaTwitter,
+      handleApple: props.handleApple,
+      handleGoogle: props.handleGoogle,
+      handleTwitter: props.handleTwitter,
+      handleMicrosoft: props.handleMicrosoft,
+      handleGithub: props.handleGithub,
+      handleEmail: props.handleEmail,
+      handlePhone: props.handlePhone
+    }
+  ), props.allowRegister && /* @__PURE__ */ React4.createElement("div", { className: "hawa-p-3 hawa-text-center hawa-text-sm hawa-font-normal dark:hawa-text-gray-300" }, texts == null ? void 0 : texts.newUserText, " ", /* @__PURE__ */ React4.createElement(
+    "span",
+    {
+      onClick: props.handleRouteToRegister,
+      className: "clickable-link"
+    },
+    texts == null ? void 0 : texts.createAccount
+  )))));
+};
+
+// components/blocks/auth/CheckEmail.tsx
+import React5 from "react";
+var CheckEmail = ({ texts, handleResend }) => {
+  return /* @__PURE__ */ React5.createElement(Card, null, /* @__PURE__ */ React5.createElement(CardContent, { headless: true }, /* @__PURE__ */ React5.createElement("div", { className: "hawa-flex hawa-flex-col hawa-items-center hawa-justify-center hawa-text-center" }, /* @__PURE__ */ React5.createElement("div", { className: "hawa-flex hawa-h-16 hawa-w-16 hawa-flex-col hawa-items-center hawa-justify-center hawa-rounded-3xl hawa-bg-primary hawa-text-6xl hawa-font-bold  hawa-text-primary-foreground" }, /* @__PURE__ */ React5.createElement(
+    "svg",
+    {
+      stroke: "currentColor",
+      fill: "none",
+      strokeWidth: "2",
+      viewBox: "0 0 24 24",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      height: "0.5em",
+      width: "0.5em",
+      xmlns: "http://www.w3.org/2000/svg"
+    },
+    /* @__PURE__ */ React5.createElement("path", { d: "M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z" }),
+    /* @__PURE__ */ React5.createElement("polyline", { points: "22,6 12,13 2,6" })
+  )), /* @__PURE__ */ React5.createElement("div", { className: "hawa-m-2 hawa-text-xl hawa-font-bold" }, (texts == null ? void 0 : texts.checkEmail) || "Check your Email"), /* @__PURE__ */ React5.createElement("div", { className: "hawa-text-sm" }, (texts == null ? void 0 : texts.pleaseVerify) || "Thank you for signing up! To complete your registration, we've sent a verification email to the address you provided. Please check your inbox and follow the instructions in the email to activate your account."))), /* @__PURE__ */ React5.createElement(CardFooter, { className: "hawa-flex hawa-flex-col hawa-justify-center " }, /* @__PURE__ */ React5.createElement("span", { className: "clickable-link hawa-text-sm", onClick: handleResend }, (texts == null ? void 0 : texts.resendEmail) || "Resend Email")));
+};
+
+// components/blocks/auth/NewPassword.tsx
+import React6, { useState as useState3 } from "react";
+import { Controller as Controller3, useForm as useForm3 } from "react-hook-form";
+import { zodResolver as zodResolver3 } from "@hookform/resolvers/zod";
+import * as z3 from "zod";
+var NewPasswordForm = ({ texts, ...props }) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+  const formSchema = z3.object({
+    password: z3.string({ required_error: (_a = texts == null ? void 0 : texts.password) == null ? void 0 : _a.required }).min(1, { message: (_b = texts == null ? void 0 : texts.password) == null ? void 0 : _b.required }).min(8, { message: (_c = texts == null ? void 0 : texts.password) == null ? void 0 : _c.tooShort }),
+    confirm_password: z3.string({ required_error: (_d = texts == null ? void 0 : texts.confirm) == null ? void 0 : _d.required }).refine((value) => value !== "", {
+      message: (_e = texts == null ? void 0 : texts.password) == null ? void 0 : _e.required
+    })
+  }).refine((data) => data.password === data.confirm_password, {
+    message: (_f = texts == null ? void 0 : texts.confirm) == null ? void 0 : _f.dontMatch,
+    path: ["confirm_password"]
+  });
+  const { handleSubmit, control, formState } = useForm3({
+    resolver: zodResolver3(formSchema)
+  });
+  const [matchError, setMatchError] = useState3(false);
+  return /* @__PURE__ */ React6.createElement(Card, { dir: props.direction }, matchError && /* @__PURE__ */ React6.createElement(Alert, { text: (_g = texts == null ? void 0 : texts.confirm) == null ? void 0 : _g.dontMatch, severity: "error" }), props.passwordChanged ? /* @__PURE__ */ React6.createElement(CardContent, { headless: true }, /* @__PURE__ */ React6.createElement("div", { className: "hawa-text-center" }, texts == null ? void 0 : texts.passwordChanged)) : /* @__PURE__ */ React6.createElement(
+    "form",
+    {
+      noValidate: true,
+      onSubmit: handleSubmit((e) => {
+        if (props.handleNewPassword) {
+          return props.handleNewPassword(e);
+        } else {
+          console.log(
+            "Form is submitted but handleSubmission prop is missing"
+          );
+        }
+      })
+    },
+    !props.headless && /* @__PURE__ */ React6.createElement(CardHeader, null, /* @__PURE__ */ React6.createElement(CardTitle, null, "Create Password"), /* @__PURE__ */ React6.createElement(CardDescription, null, "Set a new password for your account")),
+    /* @__PURE__ */ React6.createElement(
+      CardContent,
+      {
+        headless: props.headless,
+        className: "hawa-flex hawa-flex-col hawa-gap-4"
+      },
+      /* @__PURE__ */ React6.createElement(
+        Controller3,
+        {
+          control,
+          name: "password",
+          render: ({ field }) => {
+            var _a2, _b2, _c2;
+            return /* @__PURE__ */ React6.createElement(
+              Input,
+              {
+                width: "full",
+                type: "password",
+                autoComplete: "new-password",
+                label: (_a2 = texts == null ? void 0 : texts.password) == null ? void 0 : _a2.label,
+                placeholder: (_b2 = texts == null ? void 0 : texts.password) == null ? void 0 : _b2.placeholder,
+                helperText: (_c2 = formState.errors.password) == null ? void 0 : _c2.message,
+                ...field
+              }
+            );
+          }
+        }
+      ),
+      /* @__PURE__ */ React6.createElement(
+        Controller3,
+        {
+          control,
+          name: "confirm_password",
+          render: ({ field }) => {
+            var _a2, _b2, _c2;
+            return /* @__PURE__ */ React6.createElement(
+              Input,
+              {
+                width: "full",
+                type: "password",
+                autoComplete: "new-password",
+                label: (_a2 = texts == null ? void 0 : texts.confirm) == null ? void 0 : _a2.label,
+                placeholder: (_b2 = texts == null ? void 0 : texts.confirm) == null ? void 0 : _b2.placeholder,
+                helperText: (_c2 = formState.errors.confirm_password) == null ? void 0 : _c2.message,
+                ...field
+              }
+            );
+          }
+        }
+      )
+    ),
+    /* @__PURE__ */ React6.createElement(CardFooter, { className: "hawa-flex hawa-flex-col" }, /* @__PURE__ */ React6.createElement(Button, { className: "hawa-w-full", type: "submit" }, texts == null ? void 0 : texts.updatePassword), props.allowRegister && /* @__PURE__ */ React6.createElement("div", { className: "hawa-mt-4 hawa-pb-0 hawa-text-center hawa-text-sm dark:hawa-text-gray-300" }, (_h = texts == null ? void 0 : texts.dontHaveAccount) != null ? _h : "Don't have an account? ", /* @__PURE__ */ React6.createElement(
+      "span",
+      {
+        className: "clickable-link",
+        onClick: props.handleRouteToRegister
+      },
+      (_i = texts == null ? void 0 : texts.registerText) != null ? _i : "Register"
+    )))
+  ));
+};
+
+// components/blocks/auth/ResetPassword.tsx
+import React7 from "react";
+import { Controller as Controller4, useForm as useForm4 } from "react-hook-form";
+import { zodResolver as zodResolver4 } from "@hookform/resolvers/zod";
+import * as z4 from "zod";
+var ResetPasswordForm = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
+  const formSchema = z4.object({
+    email: z4.string({ required_error: (_b = (_a = props.texts) == null ? void 0 : _a.email) == null ? void 0 : _b.required }).email({ message: (_d = (_c = props.texts) == null ? void 0 : _c.email) == null ? void 0 : _d.invalid }).min(1, { message: (_f = (_e = props.texts) == null ? void 0 : _e.email) == null ? void 0 : _f.required })
+  });
+  const { handleSubmit, control, formState } = useForm4({
+    resolver: zodResolver4(formSchema)
+  });
+  return /* @__PURE__ */ React7.createElement(Card, { dir: props.direction }, !props.sent ? /* @__PURE__ */ React7.createElement(React7.Fragment, null, !props.headless && /* @__PURE__ */ React7.createElement(CardHeader, null, /* @__PURE__ */ React7.createElement(CardTitle, null, " ", ((_g = props.texts) == null ? void 0 : _g.headTitle) || "Reset Password"), /* @__PURE__ */ React7.createElement(CardDescription, null, ((_h = props.texts) == null ? void 0 : _h.headDescription) || "Enter your email to reset your account password")), /* @__PURE__ */ React7.createElement(
+    "form",
+    {
+      noValidate: true,
+      onSubmit: handleSubmit((e) => {
+        if (props.handleResetPassword) {
+          return props.handleResetPassword(e);
+        } else {
+          console.log("handleResetPassword prop is missing");
+        }
+      })
+    },
+    /* @__PURE__ */ React7.createElement(CardContent, { headless: props.headless }, /* @__PURE__ */ React7.createElement(
+      Controller4,
+      {
+        control,
+        name: "email",
+        render: ({ field }) => {
+          var _a2, _b2, _c2, _d2, _e2;
+          return /* @__PURE__ */ React7.createElement(
+            Input,
+            {
+              width: "full",
+              label: (_b2 = (_a2 = props.texts) == null ? void 0 : _a2.email) == null ? void 0 : _b2.label,
+              helperText: (_c2 = formState.errors.email) == null ? void 0 : _c2.message,
+              placeholder: (_e2 = (_d2 = props.texts) == null ? void 0 : _d2.email) == null ? void 0 : _e2.placeholder,
+              ...field
+            }
+          );
+        }
+      }
+    )),
+    /* @__PURE__ */ React7.createElement(CardFooter, { className: "hawa-flex hawa-flex-col" }, /* @__PURE__ */ React7.createElement(Button, { type: "submit", className: "hawa-w-full" }, (_i = props.texts) == null ? void 0 : _i.resetPassword), props.allowRegister && /* @__PURE__ */ React7.createElement("div", { className: "hawa-mt-4 hawa-pb-0 hawa-text-center hawa-text-sm dark:hawa-text-gray-300" }, (_k = (_j = props.texts) == null ? void 0 : _j.dontHaveAccount) != null ? _k : "Don't have an account? ", /* @__PURE__ */ React7.createElement(
+      "span",
+      {
+        className: "clickable-link",
+        onClick: props.handleRouteToRegister
+      },
+      (_m = (_l = props.texts) == null ? void 0 : _l.registerText) != null ? _m : "Register"
+    )))
+  )) : /* @__PURE__ */ React7.createElement(CardContent, { headless: true }, /* @__PURE__ */ React7.createElement("div", { className: "hawa-text-center" }, (_n = props.texts) == null ? void 0 : _n.emailSentText)));
+};
+
+// components/blocks/auth/CodeConfirmation.tsx
+import React8, { useEffect, useState as useState4 } from "react";
+import { Controller as Controller5, useForm as useForm5 } from "react-hook-form";
+import { zodResolver as zodResolver5 } from "@hookform/resolvers/zod";
+import * as z5 from "zod";
+var CodeConfirmation = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+  const formSchema = z5.object({
+    otp_code: z5.string({ required_error: (_a = props.texts) == null ? void 0 : _a.codeRequiredText }).min(6, { message: (_b = props.texts) == null ? void 0 : _b.codeTooShort })
+  });
+  const { handleSubmit, control, formState, setValue } = useForm5({
+    resolver: zodResolver5(formSchema)
+  });
+  const [resendTimer, setResendTimer] = useState4(null);
+  const [remainingTime, setRemainingTime] = useState4(0);
+  const [showResendTimer, setShowResendTimer] = useState4(false);
+  const startResendTimer = () => {
+    if (resendTimer !== null) {
+      clearInterval(resendTimer);
+      setResendTimer(null);
+    }
+    const timerDuration = 60;
+    setRemainingTime(timerDuration);
+    setShowResendTimer(true);
+    const newTimer = window.setInterval(() => {
+      setRemainingTime((prevTime) => {
+        if (prevTime > 0) {
+          return prevTime - 1;
+        } else {
+          clearInterval(newTimer);
+          setShowResendTimer(false);
+          return 0;
+        }
+      });
+    }, 1e3);
+    setResendTimer(newTimer);
+  };
+  useEffect(() => {
+    return () => {
+      if (resendTimer !== null) {
+        clearInterval(resendTimer);
+      }
+    };
+  }, []);
+  return /* @__PURE__ */ React8.createElement(Card, null, /* @__PURE__ */ React8.createElement(CardContent, { headless: true }, props.showError && /* @__PURE__ */ React8.createElement(
+    Alert,
+    {
+      title: props.errorTitle,
+      text: props.errorText,
+      severity: "error"
+    }
+  ), /* @__PURE__ */ React8.createElement("div", { className: "hawa-mb-4 dark:hawa-text-white" }, /* @__PURE__ */ React8.createElement("div", { className: "hawa-text-lg hawa-font-bold" }, ((_c = props.texts) == null ? void 0 : _c.checkYourPhone) || "Please check your phone"), /* @__PURE__ */ React8.createElement("div", { className: "hawa-text-muted-foreground" }, /* @__PURE__ */ React8.createElement("span", null, ((_d = props.texts) == null ? void 0 : _d.weSentCode) || "We've sent a code to "), /* @__PURE__ */ React8.createElement("span", null, props.phoneNumber))), /* @__PURE__ */ React8.createElement(
+    "form",
+    {
+      noValidate: true,
+      onSubmit: handleSubmit((e) => {
+        if (props.handleConfirm) {
+          return props.handleConfirm(e);
+        } else {
+          console.log(
+            "Form is submitted but handleConfirm prop is missing"
+          );
+        }
+      })
+    },
+    /* @__PURE__ */ React8.createElement(
+      Controller5,
+      {
+        control,
+        name: "otp_code",
+        render: ({ field }) => {
+          var _a2;
+          return /* @__PURE__ */ React8.createElement(
+            PinInput,
+            {
+              width: "full",
+              digits: 6,
+              getPins: (e) => setValue("otp_code", e.join("")),
+              helperText: (_a2 = formState.errors.otp_code) == null ? void 0 : _a2.message
+            }
+          );
+        }
+      }
+    ),
+    showResendTimer ? /* @__PURE__ */ React8.createElement("div", { className: " hawa-py-2 hawa-text-center hawa-text-xs hawa-text-muted-foreground" }, (_e = props.texts) == null ? void 0 : _e.resendCodeTimer, " ", /* @__PURE__ */ React8.createElement("strong", null, remainingTime), " ", (_f = props.texts) == null ? void 0 : _f.seconds) : /* @__PURE__ */ React8.createElement("div", { className: " hawa-py-2 hawa-text-center hawa-text-xs hawa-text-muted-foreground" }, /* @__PURE__ */ React8.createElement("span", null, (_h = (_g = props.texts) == null ? void 0 : _g.didntGetCode) != null ? _h : "Didn't get the code?"), " ", /* @__PURE__ */ React8.createElement(
+      "span",
+      {
+        className: "clickable-link",
+        onClick: () => {
+          startResendTimer();
+          props.handleResend();
+        }
+      },
+      ((_i = props.texts) == null ? void 0 : _i.resendCode) || "Click to resend"
+    )),
+    /* @__PURE__ */ React8.createElement("div", { className: "hawa-mt-4 hawa-grid hawa-grid-cols-2 hawa-gap-2" }, /* @__PURE__ */ React8.createElement(Button, { variant: "secondary" }, ((_j = props.texts) == null ? void 0 : _j.cancel) || "Cancel"), /* @__PURE__ */ React8.createElement(Button, { isLoading: props.confirmLoading }, ((_k = props.texts) == null ? void 0 : _k.confirm) || "Confirm"))
+  )));
+};
+export {
+  AppLanding,
+  CheckEmail,
+  CodeConfirmation,
+  LoginForm,
+  NewPasswordForm,
+  RegisterForm,
+  ResetPasswordForm
+};