@enadhq/enad-react-sdk 0.0.6 → 1.0.2

package/dist/client/user/components/signup-form.mjs

@@ -1,143 +1,176 @@
 "use client";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { registerUserAction } from "../actions/registerUserAction";
+import { StorefrontInput } from "../../storefront/primitives/input";
+import { StorefrontButton } from "../../storefront/primitives/button";
+import { Checkbox } from "../../ui/checkbox";
+const DEFAULT_SIGNUP_LABELS = {
+  title: "Create your account",
+  subtitle: "Sign up to get started",
+  firstName: "First Name",
+  firstNamePlaceholder: "John",
+  lastName: "Last Name",
+  lastNamePlaceholder: "Doe",
+  email: "Email",
+  emailPlaceholder: "you@example.com",
+  password: "Password",
+  passwordPlaceholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",
+  acceptTerms: "I accept the",
+  termsLinkText: "terms and conditions",
+  submit: "Sign Up",
+  signingUp: "Signing up..."
+};
+function SignupFormFields({
+  firstName,
+  firstNamePlaceholder,
+  lastName,
+  lastNamePlaceholder,
+  email,
+  emailPlaceholder,
+  password,
+  passwordPlaceholder,
+  errors
+}) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      StorefrontInput,
+      {
+        type: "text",
+        id: "firstName",
+        name: "firstName",
+        required: true,
+        label: firstName,
+        placeholder: firstNamePlaceholder,
+        error: errors.firstName?.join(", ")
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      StorefrontInput,
+      {
+        type: "text",
+        id: "lastName",
+        name: "lastName",
+        required: true,
+        label: lastName,
+        placeholder: lastNamePlaceholder,
+        error: errors.lastName?.join(", ")
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      StorefrontInput,
+      {
+        type: "email",
+        id: "email",
+        name: "email",
+        required: true,
+        label: email,
+        placeholder: emailPlaceholder,
+        error: errors.email?.join(", ")
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      StorefrontInput,
+      {
+        type: "password",
+        id: "password",
+        name: "password",
+        required: true,
+        label: password,
+        placeholder: passwordPlaceholder,
+        error: errors.password?.join(", ")
+      }
+    )
+  ] });
+}
+function SignupTerms({
+  acceptTerms,
+  termsLinkText,
+  errors
+}) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          id: "acceptTerms",
+          name: "acceptTerms",
+          required: true,
+          "aria-describedby": errors.acceptTerms ? "acceptTerms-error" : void 0
+        }
+      ),
+      /* @__PURE__ */ jsxs("label", { htmlFor: "acceptTerms", className: "ml-2 text-sm text-(--enad-text-primary-color)", children: [
+        acceptTerms,
+        " ",
+        /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: "/terms",
+            target: "_blank",
+            className: "text-(--enad-link-color) hover:text-(--enad-link-hover-color) hover:underline",
+            children: termsLinkText
+          }
+        )
+      ] })
+    ] }),
+    errors.acceptTerms && /* @__PURE__ */ jsx("p", { id: "acceptTerms-error", role: "alert", className: "text-(--enad-error-color) text-sm mt-1", children: errors.acceptTerms.join(", ") })
+  ] });
+}
 const SignupForm = ({
-  title = "Create your account",
-  subtitle = "Sign up to get started",
-  submitText = "Sign Up",
+  labels = {},
   extraLink = { href: "/login", text: "Already have an account? Sign in" },
   successRedirect = "/"
 }) => {
+  const {
+    title,
+    subtitle,
+    firstName,
+    firstNamePlaceholder,
+    lastName,
+    lastNamePlaceholder,
+    email,
+    emailPlaceholder,
+    password,
+    passwordPlaceholder,
+    acceptTerms,
+    termsLinkText,
+    submit,
+    signingUp
+  } = { ...DEFAULT_SIGNUP_LABELS, ...labels };
   const [errors, setErrors] = useState({});
   const [isPending, setIsPending] = useState(false);
-  const action = async (formData) => {
+  const handleSubmit = async (e) => {
+    e.preventDefault();
     setIsPending(true);
     setErrors({});
+    const formData = new FormData(e.currentTarget);
     const res = await registerUserAction(formData, { redirectPath: successRedirect });
     if (res?.errors) {
       setErrors(res.errors);
     }
     setIsPending(false);
   };
-  const handleSubmit = async (e) => {
-    e.preventDefault();
-    const formData = new FormData(e.currentTarget);
-    await action(formData);
-  };
-  const inputBaseClasses = `
-        w-full px-4 py-2.5
-        border border-(--enad-border-color) 
-        rounded-(--enad-border-radius)
-        focus:ring-2 focus:ring-(--enad-button-bg)
-        focus:border-(--enad-button-bg)
-        outline-none transition
-        bg-(--enad-background)
-        text-(--enad-text-primary-color)
-    `;
-  const buttonBaseClasses = `
-        w-full py-2.5
-        bg-(--enad-button-bg)
-        hover:bg-(--enad-button-hover-bg)
-        text-(--enad-button-color)
-        font-medium rounded-(--enad-border-radius)
-        transition shadow-sm hover:shadow
-    `;
-  const labelClasses = `block text-sm font-medium text-(--enad-text-primary-color) mb-1`;
-  const checkboxLabelClasses = `ml-2 text-sm text-(--enad-text-primary-color)`;
-  const errorClasses = `text-(--enad-error-color) text-sm mt-1`;
-  return /* @__PURE__ */ jsx("main", { className: "flex items-center justify-center px-4", children: /* @__PURE__ */ jsxs("div", { className: "w-full max-w-md bg-(--enad-surface) shadow-lg p-8 border border-(--enad-border-color) rounded-(--enad-border-radius)", children: [
+  return /* @__PURE__ */ jsx("main", { className: "flex items-center justify-center px-4", children: /* @__PURE__ */ jsxs("div", { className: "w-full max-w-md bg-(--enad-surface) shadow-lg p-8 border border-(--enad-border-color) rounded-(--enad-card-radius)", children: [
     /* @__PURE__ */ jsx("h2", { className: "text-2xl font-semibold mb-2 text-center text-(--enad-text-primary-color)", children: title }),
     /* @__PURE__ */ jsx("p", { className: "text-sm mb-8 text-center text-(--enad-text-muted-color)", children: subtitle }),
     /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "space-y-5", children: [
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("label", { htmlFor: "firstName", className: labelClasses, children: "First Name" }),
-        /* @__PURE__ */ jsx(
-          "input",
-          {
-            type: "text",
-            id: "firstName",
-            name: "firstName",
-            required: true,
-            placeholder: "John",
-            className: inputBaseClasses
-          }
-        ),
-        errors.firstName && /* @__PURE__ */ jsx("p", { className: errorClasses, children: errors.firstName.join(", ") })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("label", { htmlFor: "lastName", className: labelClasses, children: "Last Name" }),
-        /* @__PURE__ */ jsx(
-          "input",
-          {
-            type: "text",
-            id: "lastName",
-            name: "lastName",
-            required: true,
-            placeholder: "Doe",
-            className: inputBaseClasses
-          }
-        ),
-        errors.lastName && /* @__PURE__ */ jsx("p", { className: errorClasses, children: errors.lastName.join(", ") })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("label", { htmlFor: "email", className: labelClasses, children: "Email" }),
-        /* @__PURE__ */ jsx(
-          "input",
-          {
-            type: "email",
-            id: "email",
-            name: "email",
-            required: true,
-            placeholder: "you@example.com",
-            className: inputBaseClasses
-          }
-        ),
-        errors.email && /* @__PURE__ */ jsx("p", { className: errorClasses, children: errors.email.join(", ") })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("label", { htmlFor: "password", className: labelClasses, children: "Password" }),
-        /* @__PURE__ */ jsx(
-          "input",
-          {
-            type: "password",
-            id: "password",
-            name: "password",
-            required: true,
-            placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",
-            className: inputBaseClasses
-          }
-        ),
-        errors.password && /* @__PURE__ */ jsx("p", { className: errorClasses, children: errors.password.join(", ") })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx(
-          "input",
-          {
-            type: "checkbox",
-            id: "acceptTerms",
-            name: "acceptTerms",
-            required: true,
-            className: "h-4 w-4 text-(--enad-button-bg) focus:ring-2 focus:ring-(--enad-button-bg) border border-(--enad-border-color) rounded transition"
-          }
-        ),
-        /* @__PURE__ */ jsxs("label", { htmlFor: "acceptTerms", className: checkboxLabelClasses, children: [
-          "I accept the",
-          " ",
-          /* @__PURE__ */ jsx(
-            "a",
-            {
-              href: "/terms",
-              target: "_blank",
-              className: "text-(--enad-link-color) hover:text-(--enad-link-hover-color) hover:underline",
-              children: "terms and conditions"
-            }
-          )
-        ] })
-      ] }),
-      errors.acceptTerms && /* @__PURE__ */ jsx("p", { className: errorClasses, children: errors.acceptTerms.join(", ") }),
-      /* @__PURE__ */ jsx("button", { type: "submit", disabled: isPending, className: buttonBaseClasses, children: isPending ? "Signing up..." : submitText }),
-      errors.general && /* @__PURE__ */ jsx("p", { className: errorClasses + " mt-2 text-center", children: errors.general.join(", ") })
+      /* @__PURE__ */ jsx(
+        SignupFormFields,
+        {
+          firstName,
+          firstNamePlaceholder,
+          lastName,
+          lastNamePlaceholder,
+          email,
+          emailPlaceholder,
+          password,
+          passwordPlaceholder,
+          errors
+        }
+      ),
+      /* @__PURE__ */ jsx(SignupTerms, { acceptTerms, termsLinkText, errors }),
+      /* @__PURE__ */ jsx(StorefrontButton, { type: "submit", disabled: isPending, className: "w-full", children: isPending ? signingUp : submit }),
+      errors.general && /* @__PURE__ */ jsx("p", { role: "alert", className: "text-(--enad-error-color) text-sm mt-2 text-center", children: errors.general.join(", ") })
     ] }),
     extraLink && /* @__PURE__ */ jsx("p", { className: "text-sm text-(--enad-text-muted-color) text-center mt-2", children: /* @__PURE__ */ jsx(
       "a",

package/dist/client/user/components/signup-form.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/client/user/components/signup-form.tsx"],"sourcesContent":["\"use client\"\n\nimport React, { useState, FormEvent } from \"react\"\nimport { registerUserAction } from \"../actions/registerUserAction\"\n\ninterface SignupFormProps {\n  title?: string\n  subtitle?: string\n  submitText?: string\n  extraLink?: {\n    href: string\n    text: string\n  }\n  successRedirect: string\n}\n\ninterface FormErrors {\n  firstName?: string[]\n  lastName?: string[]\n  email?: string[]\n  password?: string[]\n  acceptTerms?: string[]\n  general?: string[]\n}\n\nexport const SignupForm: React.FC<SignupFormProps> = ({\n  title = \"Create your account\",\n  subtitle = \"Sign up to get started\",\n  submitText = \"Sign Up\",\n  extraLink = { href: \"/login\", text: \"Already have an account? Sign in\" },\n  successRedirect = \"/\",\n}) => {\n  const [errors, setErrors] = useState<FormErrors>({})\n  const [isPending, setIsPending] = useState(false)\n\n  const action = async (formData: FormData) => {\n    setIsPending(true)\n    setErrors({})\n\n    const res = await registerUserAction(formData, { redirectPath: successRedirect })\n\n    if (res?.errors) {\n      setErrors(res.errors)\n    }\n\n    setIsPending(false)\n  }\n\n  const handleSubmit = async (e: FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n    const formData = new FormData(e.currentTarget)\n    await action(formData)\n  }\n\n  const inputBaseClasses = `\n        w-full px-4 py-2.5\n        border border-(--enad-border-color) \n        rounded-(--enad-border-radius)\n        focus:ring-2 focus:ring-(--enad-button-bg)\n        focus:border-(--enad-button-bg)\n        outline-none transition\n        bg-(--enad-background)\n        text-(--enad-text-primary-color)\n    `\n\n  const buttonBaseClasses = `\n        w-full py-2.5\n        bg-(--enad-button-bg)\n        hover:bg-(--enad-button-hover-bg)\n        text-(--enad-button-color)\n        font-medium rounded-(--enad-border-radius)\n        transition shadow-sm hover:shadow\n    `\n\n  const labelClasses = `block text-sm font-medium text-(--enad-text-primary-color) mb-1`\n  const checkboxLabelClasses = `ml-2 text-sm text-(--enad-text-primary-color)`\n  const errorClasses = `text-(--enad-error-color) text-sm mt-1`\n\n  return (\n    <main className=\"flex items-center justify-center px-4\">\n      <div className=\"w-full max-w-md bg-(--enad-surface) shadow-lg p-8 border border-(--enad-border-color) rounded-(--enad-border-radius)\">\n        <h2 className=\"text-2xl font-semibold mb-2 text-center text-(--enad-text-primary-color)\">\n          {title}\n        </h2>\n        <p className=\"text-sm mb-8 text-center text-(--enad-text-muted-color)\">{subtitle}</p>\n\n        <form onSubmit={handleSubmit} className=\"space-y-5\">\n          {/* First Name */}\n          <div>\n            <label htmlFor=\"firstName\" className={labelClasses}>\n              First Name\n            </label>\n            <input\n              type=\"text\"\n              id=\"firstName\"\n              name=\"firstName\"\n              required\n              placeholder=\"John\"\n              className={inputBaseClasses}\n            />\n            {errors.firstName && <p className={errorClasses}>{errors.firstName.join(\", \")}</p>}\n          </div>\n\n          {/* Last Name */}\n          <div>\n            <label htmlFor=\"lastName\" className={labelClasses}>\n              Last Name\n            </label>\n            <input\n              type=\"text\"\n              id=\"lastName\"\n              name=\"lastName\"\n              required\n              placeholder=\"Doe\"\n              className={inputBaseClasses}\n            />\n            {errors.lastName && <p className={errorClasses}>{errors.lastName.join(\", \")}</p>}\n          </div>\n\n          {/* Email */}\n          <div>\n            <label htmlFor=\"email\" className={labelClasses}>\n              Email\n            </label>\n            <input\n              type=\"email\"\n              id=\"email\"\n              name=\"email\"\n              required\n              placeholder=\"you@example.com\"\n              className={inputBaseClasses}\n            />\n            {errors.email && <p className={errorClasses}>{errors.email.join(\", \")}</p>}\n          </div>\n\n          {/* Password */}\n          <div>\n            <label htmlFor=\"password\" className={labelClasses}>\n              Password\n            </label>\n            <input\n              type=\"password\"\n              id=\"password\"\n              name=\"password\"\n              required\n              placeholder=\"••••••••\"\n              className={inputBaseClasses}\n            />\n            {errors.password && <p className={errorClasses}>{errors.password.join(\", \")}</p>}\n          </div>\n\n          {/* Accept Terms */}\n          <div className=\"flex items-center gap-2\">\n            <input\n              type=\"checkbox\"\n              id=\"acceptTerms\"\n              name=\"acceptTerms\"\n              required\n              className=\"h-4 w-4 text-(--enad-button-bg) focus:ring-2 focus:ring-(--enad-button-bg) border border-(--enad-border-color) rounded transition\"\n            />\n            <label htmlFor=\"acceptTerms\" className={checkboxLabelClasses}>\n              I accept the{\" \"}\n              <a\n                href=\"/terms\"\n                target=\"_blank\"\n                className=\"text-(--enad-link-color) hover:text-(--enad-link-hover-color) hover:underline\"\n              >\n                terms and conditions\n              </a>\n            </label>\n          </div>\n          {errors.acceptTerms && <p className={errorClasses}>{errors.acceptTerms.join(\", \")}</p>}\n\n          {/* Submit */}\n          <button type=\"submit\" disabled={isPending} className={buttonBaseClasses}>\n            {isPending ? \"Signing up...\" : submitText}\n          </button>\n\n          {/* General errors */}\n          {errors.general && (\n            <p className={errorClasses + \" mt-2 text-center\"}>{errors.general.join(\", \")}</p>\n          )}\n        </form>\n\n        {/* Extra Link */}\n        {extraLink && (\n          <p className=\"text-sm text-(--enad-text-muted-color) text-center mt-2\">\n            <a\n              href={extraLink.href}\n              className=\"text-(--enad-link-color) hover:text-(--enad-link-hover-color) font-medium\"\n            >\n              {extraLink.text}\n            </a>\n          </p>\n        )}\n      </div>\n    </main>\n  )\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../src/client/user/components/signup-form.tsx"],"sourcesContent":["\"use client\"\n\nimport React, { useState, type FormEvent } from \"react\"\nimport { registerUserAction } from \"../actions/registerUserAction\"\nimport { StorefrontInput } from \"../../storefront/primitives/input\"\nimport { StorefrontButton } from \"../../storefront/primitives/button\"\nimport { Checkbox } from \"../../ui/checkbox\"\n\ninterface SignupFormProps {\n  labels?: {\n    title?: string\n    subtitle?: string\n    firstName?: string\n    firstNamePlaceholder?: string\n    lastName?: string\n    lastNamePlaceholder?: string\n    email?: string\n    emailPlaceholder?: string\n    password?: string\n    passwordPlaceholder?: string\n    acceptTerms?: string\n    termsLinkText?: string\n    submit?: string\n    signingUp?: string\n  }\n  extraLink?: {\n    href: string\n    text: string\n  }\n  successRedirect: string\n}\n\ninterface FormErrors {\n  firstName?: string[]\n  lastName?: string[]\n  email?: string[]\n  password?: string[]\n  acceptTerms?: string[]\n  general?: string[]\n}\n\nconst DEFAULT_SIGNUP_LABELS = {\n  title: \"Create your account\",\n  subtitle: \"Sign up to get started\",\n  firstName: \"First Name\",\n  firstNamePlaceholder: \"John\",\n  lastName: \"Last Name\",\n  lastNamePlaceholder: \"Doe\",\n  email: \"Email\",\n  emailPlaceholder: \"you@example.com\",\n  password: \"Password\",\n  passwordPlaceholder: \"••••••••\",\n  acceptTerms: \"I accept the\",\n  termsLinkText: \"terms and conditions\",\n  submit: \"Sign Up\",\n  signingUp: \"Signing up...\",\n} as const\n\nfunction SignupFormFields({\n  firstName,\n  firstNamePlaceholder,\n  lastName,\n  lastNamePlaceholder,\n  email,\n  emailPlaceholder,\n  password,\n  passwordPlaceholder,\n  errors,\n}: {\n  firstName: string\n  firstNamePlaceholder: string\n  lastName: string\n  lastNamePlaceholder: string\n  email: string\n  emailPlaceholder: string\n  password: string\n  passwordPlaceholder: string\n  errors: FormErrors\n}) {\n  return (\n    <>\n      <StorefrontInput\n        type=\"text\"\n        id=\"firstName\"\n        name=\"firstName\"\n        required\n        label={firstName}\n        placeholder={firstNamePlaceholder}\n        error={errors.firstName?.join(\", \")}\n      />\n\n      <StorefrontInput\n        type=\"text\"\n        id=\"lastName\"\n        name=\"lastName\"\n        required\n        label={lastName}\n        placeholder={lastNamePlaceholder}\n        error={errors.lastName?.join(\", \")}\n      />\n\n      <StorefrontInput\n        type=\"email\"\n        id=\"email\"\n        name=\"email\"\n        required\n        label={email}\n        placeholder={emailPlaceholder}\n        error={errors.email?.join(\", \")}\n      />\n\n      <StorefrontInput\n        type=\"password\"\n        id=\"password\"\n        name=\"password\"\n        required\n        label={password}\n        placeholder={passwordPlaceholder}\n        error={errors.password?.join(\", \")}\n      />\n    </>\n  )\n}\n\nfunction SignupTerms({\n  acceptTerms,\n  termsLinkText,\n  errors,\n}: {\n  acceptTerms: string\n  termsLinkText: string\n  errors: FormErrors\n}) {\n  return (\n    <>\n      <div className=\"flex items-center gap-2\">\n        <Checkbox\n          id=\"acceptTerms\"\n          name=\"acceptTerms\"\n          required\n          aria-describedby={errors.acceptTerms ? \"acceptTerms-error\" : undefined}\n        />\n        <label htmlFor=\"acceptTerms\" className=\"ml-2 text-sm text-(--enad-text-primary-color)\">\n          {acceptTerms}{\" \"}\n          <a\n            href=\"/terms\"\n            target=\"_blank\"\n            className=\"text-(--enad-link-color) hover:text-(--enad-link-hover-color) hover:underline\"\n          >\n            {termsLinkText}\n          </a>\n        </label>\n      </div>\n      {errors.acceptTerms && (\n        <p id=\"acceptTerms-error\" role=\"alert\" className=\"text-(--enad-error-color) text-sm mt-1\">\n          {errors.acceptTerms.join(\", \")}\n        </p>\n      )}\n    </>\n  )\n}\n\nexport const SignupForm: React.FC<SignupFormProps> = ({\n  labels = {},\n  extraLink = { href: \"/login\", text: \"Already have an account? Sign in\" },\n  successRedirect = \"/\",\n}) => {\n  const {\n    title, subtitle,\n    firstName, firstNamePlaceholder,\n    lastName, lastNamePlaceholder,\n    email, emailPlaceholder,\n    password, passwordPlaceholder,\n    acceptTerms, termsLinkText,\n    submit, signingUp,\n  } = { ...DEFAULT_SIGNUP_LABELS, ...labels }\n\n  const [errors, setErrors] = useState<FormErrors>({})\n  const [isPending, setIsPending] = useState(false)\n\n  const handleSubmit = async (e: FormEvent<HTMLFormElement>) => {\n    e.preventDefault()\n    setIsPending(true)\n    setErrors({})\n\n    const formData = new FormData(e.currentTarget)\n    const res = await registerUserAction(formData, { redirectPath: successRedirect })\n\n    if (res?.errors) {\n      setErrors(res.errors)\n    }\n\n    setIsPending(false)\n  }\n\n  return (\n    <main className=\"flex items-center justify-center px-4\">\n      <div className=\"w-full max-w-md bg-(--enad-surface) shadow-lg p-8 border border-(--enad-border-color) rounded-(--enad-card-radius)\">\n        <h2 className=\"text-2xl font-semibold mb-2 text-center text-(--enad-text-primary-color)\">\n          {title}\n        </h2>\n        <p className=\"text-sm mb-8 text-center text-(--enad-text-muted-color)\">{subtitle}</p>\n\n        <form onSubmit={handleSubmit} className=\"space-y-5\">\n          <SignupFormFields\n            firstName={firstName}\n            firstNamePlaceholder={firstNamePlaceholder}\n            lastName={lastName}\n            lastNamePlaceholder={lastNamePlaceholder}\n            email={email}\n            emailPlaceholder={emailPlaceholder}\n            password={password}\n            passwordPlaceholder={passwordPlaceholder}\n            errors={errors}\n          />\n\n          <SignupTerms acceptTerms={acceptTerms} termsLinkText={termsLinkText} errors={errors} />\n\n          <StorefrontButton type=\"submit\" disabled={isPending} className=\"w-full\">\n            {isPending ? signingUp : submit}\n          </StorefrontButton>\n\n          {errors.general && (\n            <p role=\"alert\" className=\"text-(--enad-error-color) text-sm mt-2 text-center\">\n              {errors.general.join(\", \")}\n            </p>\n          )}\n        </form>\n\n        {extraLink && (\n          <p className=\"text-sm text-(--enad-text-muted-color) text-center mt-2\">\n            <a\n              href={extraLink.href}\n              className=\"text-(--enad-link-color) hover:text-(--enad-link-hover-color) font-medium\"\n            >\n              {extraLink.text}\n            </a>\n          </p>\n        )}\n      </div>\n    </main>\n  )\n}\n"],"mappings":"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","names":[]}

package/dist/client/user/components/signup-organisation-form.d.ts

@@ -0,0 +1,55 @@
+import React from "react";
+interface SignupOrganisationFormProps {
+    labels?: {
+        title?: string;
+        subtitle?: string;
+        submit?: string;
+        signingUp?: string;
+        contactPersonSection?: string;
+        companyInfoSection?: string;
+        billingAddressSection?: string;
+        shippingAddressSection?: string;
+        firstName?: string;
+        lastName?: string;
+        email?: string;
+        phoneNumber?: string;
+        password?: string;
+        confirmPassword?: string;
+        companyName?: string;
+        organisationNumber?: string;
+        taxIdVatNumber?: string;
+        companyEmail?: string;
+        companyPhone?: string;
+        invoiceEmail?: string;
+        contactName?: string;
+        externalRef?: string;
+        streetAddress?: string;
+        houseNumber?: string;
+        coAddress?: string;
+        postalCode?: string;
+        city?: string;
+        country?: string;
+        sameBillingAsShipping?: string;
+        emailNotifications?: string;
+        smsNotifications?: string;
+        postalNotifications?: string;
+        communicationPreferences?: string;
+        acceptTerms?: string;
+        termsLinkText?: string;
+        verifyEmailTitle?: string;
+        verifyEmailMessage?: string;
+    };
+    extraLink?: {
+        href: string;
+        text: string;
+    };
+    successRedirect?: string;
+    organisationStatus?: "active" | "pending";
+    defaultMarket?: string;
+    defaultLanguage?: string;
+    defaultCountry?: string;
+    defaultStoreGroup?: string;
+}
+export declare const SignupOrganisationForm: React.FC<SignupOrganisationFormProps>;
+export {};
+//# sourceMappingURL=signup-organisation-form.d.ts.map

package/dist/client/user/components/signup-organisation-form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"signup-organisation-form.d.ts","sourceRoot":"","sources":["../../../../src/client/user/components/signup-organisation-form.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAsC,MAAM,OAAO,CAAA;AA2sB1D,UAAU,2BAA2B;IACnC,MAAM,CAAC,EAAE;QACP,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,QAAQ,CAAC,EAAE,MAAM,CAAA;QACjB,MAAM,CAAC,EAAE,MAAM,CAAA;QACf,SAAS,CAAC,EAAE,MAAM,CAAA;QAClB,oBAAoB,CAAC,EAAE,MAAM,CAAA;QAC7B,kBAAkB,CAAC,EAAE,MAAM,CAAA;QAC3B,qBAAqB,CAAC,EAAE,MAAM,CAAA;QAC9B,sBAAsB,CAAC,EAAE,MAAM,CAAA;QAC/B,SAAS,CAAC,EAAE,MAAM,CAAA;QAClB,QAAQ,CAAC,EAAE,MAAM,CAAA;QACjB,KAAK,CAAC,EAAE,MAAM,CAAA;QACd,WAAW,CAAC,EAAE,MAAM,CAAA;QACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;QACjB,eAAe,CAAC,EAAE,MAAM,CAAA;QACxB,WAAW,CAAC,EAAE,MAAM,CAAA;QACpB,kBAAkB,CAAC,EAAE,MAAM,CAAA;QAC3B,cAAc,CAAC,EAAE,MAAM,CAAA;QACvB,YAAY,CAAC,EAAE,MAAM,CAAA;QACrB,YAAY,CAAC,EAAE,MAAM,CAAA;QACrB,YAAY,CAAC,EAAE,MAAM,CAAA;QACrB,WAAW,CAAC,EAAE,MAAM,CAAA;QACpB,WAAW,CAAC,EAAE,MAAM,CAAA;QACpB,aAAa,CAAC,EAAE,MAAM,CAAA;QACtB,WAAW,CAAC,EAAE,MAAM,CAAA;QACpB,SAAS,CAAC,EAAE,MAAM,CAAA;QAClB,UAAU,CAAC,EAAE,MAAM,CAAA;QACnB,IAAI,CAAC,EAAE,MAAM,CAAA;QACb,OAAO,CAAC,EAAE,MAAM,CAAA;QAChB,qBAAqB,CAAC,EAAE,MAAM,CAAA;QAC9B,kBAAkB,CAAC,EAAE,MAAM,CAAA;QAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAA;QACzB,mBAAmB,CAAC,EAAE,MAAM,CAAA;QAC5B,wBAAwB,CAAC,EAAE,MAAM,CAAA;QACjC,WAAW,CAAC,EAAE,MAAM,CAAA;QACpB,aAAa,CAAC,EAAE,MAAM,CAAA;QACtB,gBAAgB,CAAC,EAAE,MAAM,CAAA;QACzB,kBAAkB,CAAC,EAAE,MAAM,CAAA;KAC5B,CAAA;IACD,SAAS,CAAC,EAAE;QACV,IAAI,EAAE,MAAM,CAAA;QACZ,IAAI,EAAE,MAAM,CAAA;KACb,CAAA;IACD,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kBAAkB,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IACzC,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B;AAyOD,eAAO,MAAM,sBAAsB,EAAE,KAAK,CAAC,EAAE,CAAC,2BAA2B,CA0DxE,CAAA"}