@sikka/hawa 0.27.19-next → 0.27.20-next

package/dist/blocks/index.mjs

@@ -442,7 +442,7 @@ var RegisterForm = ({
   showNewsletterOption = false,
   ...props
 }) => {
-  var _a, _b, _c, _d, _e, _f;
+  var _a, _b, _c, _d, _e, _f, _g, _h;
   const [passwordVisible, setPasswordVisible] = useState2(false);
   const thirdPartyAuthTexts = {
     continueWithGoogle: texts == null ? void 0 : texts.continueWithGoogle,
@@ -508,281 +508,290 @@ var RegisterForm = ({
   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",
+  return /* @__PURE__ */ React3.createElement(
+    "div",
     {
-      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"
+      className: cn(
+        "hawa-flex hawa-flex-col hawa-gap-4",
+        (_g = props.classNames) == null ? void 0 : _g.root
+      )
     },
-    /* @__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) || "Full Name",
-                  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) || "Email",
-                  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, _d2;
-              return /* @__PURE__ */ React3.createElement(
-                Input,
-                {
-                  width: "full",
-                  autoComplete: "username",
-                  label: ((_a2 = texts == null ? void 0 : texts.username) == null ? void 0 : _a2.label) || "Username",
-                  labelProps: {
-                    ...(_b2 = props.usernameOptions) == null ? void 0 : _b2.label
-                  },
-                  helperText: (_c2 = formState.errors.username) == null ? void 0 : _c2.message,
-                  placeholder: (_d2 = texts == null ? void 0 : texts.username) == null ? void 0 : _d2.placeholder,
-                  ...field
-                }
-              );
-            }
-          }
-        );
-      }
-    })),
-    /* @__PURE__ */ React3.createElement(
-      Controller2,
+    /* @__PURE__ */ React3.createElement(Card, { dir: props.direction, className: cn((_h = props.classNames) == null ? void 0 : _h.card) }, /* @__PURE__ */ React3.createElement(CardContent, { headless: true }, /* @__PURE__ */ React3.createElement("div", null, props.showError && /* @__PURE__ */ React3.createElement(
+      Alert,
       {
-        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) || "Password",
-              placeholder: (_b2 = texts == null ? void 0 : texts.password) == null ? void 0 : _b2.placeholder,
-              helperText: (_c2 = formState.errors.password) == null ? void 0 : _c2.message,
-              ...field
-            }
-          );
-        }
+        title: props.errorTitle,
+        text: props.errorText,
+        severity: "error"
       }
-    ),
-    /* @__PURE__ */ React3.createElement(
-      Controller2,
+    ), /* @__PURE__ */ React3.createElement(FormProvider, { ...methods }, /* @__PURE__ */ React3.createElement(
+      "form",
       {
-        control,
-        name: "confirm_password",
-        render: ({ field }) => {
-          var _a2, _b2, _c2;
+        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(
-            Input,
+            Controller2,
             {
-              width: "full",
-              type: "password",
-              autoComplete: "new-password",
-              label: ((_a2 = texts == null ? void 0 : texts.confirm) == null ? void 0 : _a2.label) || "Confirm Password",
-              placeholder: ((_b2 = texts == null ? void 0 : texts.confirm) == null ? void 0 : _b2.placeholder) || "Confirm your Password",
-              helperText: (_c2 = formState.errors.confirm_password) == null ? void 0 : _c2.message,
-              ...field
+              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) || "Full Name",
+                    placeholder: (_b2 = texts == null ? void 0 : texts.fullName) == null ? void 0 : _b2.placeholder,
+                    helperText: (_c2 = formState.errors.fullName) == null ? void 0 : _c2.message,
+                    ...field
+                  }
+                );
+              }
             }
           );
         }
-      }
-    ),
-    props.additionalInputs,
-    props.showRefCode && /* @__PURE__ */ React3.createElement(
-      Controller2,
-      {
-        control,
-        name: "refCode",
-        render: ({ field }) => {
-          var _a2;
+        if (fld === "email") {
           return /* @__PURE__ */ React3.createElement(
-            Input,
+            Controller2,
             {
-              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
+              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) || "Email",
+                    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
+                  }
+                );
+              }
             }
           );
         }
-      }
-    ),
-    props.showUserSource && /* @__PURE__ */ React3.createElement(
-      Controller2,
-      {
-        control,
-        name: "reference",
-        render: ({ field }) => {
-          var _a2, _b2;
+        if (fld === "username") {
           return /* @__PURE__ */ React3.createElement(
-            Select,
+            Controller2,
             {
-              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);
+              key: i,
+              control,
+              name: "username",
+              render: ({ field }) => {
+                var _a2, _b2, _c2, _d2;
+                return /* @__PURE__ */ React3.createElement(
+                  Input,
+                  {
+                    width: "full",
+                    autoComplete: "username",
+                    label: ((_a2 = texts == null ? void 0 : texts.username) == null ? void 0 : _a2.label) || "Username",
+                    labelProps: {
+                      ...(_b2 = props.usernameOptions) == null ? void 0 : _b2.label
+                    },
+                    helperText: (_c2 = formState.errors.username) == null ? void 0 : _c2.message,
+                    placeholder: (_d2 = texts == null ? void 0 : texts.username) == null ? void 0 : _d2.placeholder,
+                    ...field
+                  }
+                );
               }
             }
           );
         }
-      }
-    ),
-    showTermsOption || showNewsletterOption ? /* @__PURE__ */ React3.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-3 hawa-mb-2" }, showTermsOption && /* @__PURE__ */ React3.createElement(
-      Controller2,
-      {
-        control,
-        name: "terms_accepted",
-        render: ({ field }) => {
-          var _a2, _b2;
-          return /* @__PURE__ */ React3.createElement(
+      })),
+      /* @__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) || "Password",
+                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) || "Confirm Password",
+                placeholder: ((_b2 = texts == null ? void 0 : texts.confirm) == null ? void 0 : _b2.placeholder) || "Confirm your Password",
+                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);
+                }
+              }
+            );
+          }
+        }
+      ),
+      showTermsOption || showNewsletterOption ? /* @__PURE__ */ React3.createElement("div", { className: "hawa-flex hawa-flex-col hawa-gap-3 hawa-mb-2" }, 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) || "I accept the "), " ", /* @__PURE__ */ React3.createElement(StopPropagationWrapper, null, /* @__PURE__ */ React3.createElement(
+                  "a",
+                  {
+                    onClick: props.onRouteToTOS,
+                    className: "clickable-link"
+                  },
+                  (texts == null ? void 0 : texts.termsText) || "Terms of Service"
+                )))
+              }
+            );
+          }
+        }
+      ), showNewsletterOption && /* @__PURE__ */ React3.createElement(
+        Controller2,
+        {
+          control,
+          name: "newsletter_accepted",
+          render: ({ field }) => /* @__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) || "I accept the "), " ", /* @__PURE__ */ React3.createElement(StopPropagationWrapper, null, /* @__PURE__ */ React3.createElement(
-                "a",
-                {
-                  onClick: props.onRouteToTOS,
-                  className: "clickable-link"
-                },
-                (texts == null ? void 0 : texts.termsText) || "Terms of Service"
-              )))
+              id: "newsletter_accepted",
+              label: (texts == null ? void 0 : texts.subscribeToNewsletter) || "Subscribe to our newsletter",
+              onCheckedChange: field.onChange
             }
-          );
+          )
         }
-      }
-    ), showNewsletterOption && /* @__PURE__ */ React3.createElement(
-      Controller2,
+      )) : null,
+      /* @__PURE__ */ React3.createElement(
+        Button,
+        {
+          className: " hawa-w-full",
+          type: "submit",
+          isLoading: props.isLoading,
+          disabled: props.isLoading
+        },
+        (texts == null ? void 0 : texts.registerText) || "Register"
+      ),
+      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) || "Already have an account?"), /* @__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,
       {
-        control,
-        name: "newsletter_accepted",
-        render: ({ field }) => /* @__PURE__ */ React3.createElement(
-          Checkbox,
-          {
-            id: "newsletter_accepted",
-            label: (texts == null ? void 0 : texts.subscribeToNewsletter) || "Subscribe to our newsletter",
-            onCheckedChange: field.onChange
-          }
+        className: cn(
+          props.logosOnly ? "hawa-flex hawa-flex-row hawa-justify-center hawa-gap-2" : "hawa-grid hawa-grid-cols-1 hawa-gap-2"
         )
-      }
-    )) : null,
-    /* @__PURE__ */ React3.createElement(
-      Button,
-      {
-        className: " hawa-w-full",
-        type: "submit",
-        isLoading: props.isLoading,
-        disabled: props.isLoading
       },
-      (texts == null ? void 0 : texts.registerText) || "Register"
-    ),
-    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) || "Already have an account?"), /* @__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
+        }
       )
-    },
-    /* @__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));
+    ) : null)
+  );
 };
 
 // blocks/auth/AppLanding.tsx

package/dist/index.d.mts

@@ -1521,6 +1521,11 @@ type RegisterFormTypes = {
     usernameOptions?: {
         label?: LabelProps;
     };
+    classNames?: {
+        root?: string;
+        form?: string;
+        card?: string;
+    };
 };
 declare const RegisterForm: FC<RegisterFormTypes>;
 

package/dist/index.d.ts

@@ -1521,6 +1521,11 @@ type RegisterFormTypes = {
     usernameOptions?: {
         label?: LabelProps;
     };
+    classNames?: {
+        root?: string;
+        form?: string;
+        card?: string;
+    };
 };
 declare const RegisterForm: FC<RegisterFormTypes>;