import { o as ie } from "./rolldown-runtime.js";
import { i as ne, n as de, t as oe } from "./vendor/react.js";
import { t as ce } from "./check.js";
import { t as n } from "./Button.js";
import { t as ue } from "./dist.js";
import { t as b } from "./utils.js";
import { t as me } from "./PageBackground.js";
import { t as i } from "./Input2.js";
import { t as M } from "./Steps.js";
import { t as D } from "./separator2.js";
import { t as S } from "./BrandIcon.js";
import { a as o, n as pe, r as g, t as ge } from "./LoginPage.js";
var c = /* @__PURE__ */ ie(ne(), 1), e = oe(), he = ue("min-h-screen w-full flex items-center justify-center relative overflow-hidden", {
  variants: { variant: {
    simple: "",
    "social-logins": "",
    "social-leading": "",
    "header-navigation": "",
    "card-separated": "",
    "card-combined": "",
    "progress-01": "",
    "progress-02": "",
    "progress-03": ""
  } },
  defaultVariants: { variant: "simple" }
});
function F({ checked: t, text: s }) {
  return /* @__PURE__ */ (0, e.jsxs)("li", {
    className: "flex items-start gap-2 list-none",
    children: [/* @__PURE__ */ (0, e.jsx)("div", {
      className: b("size-5 rounded-full flex items-center justify-center shrink-0 transition-colors duration-200", t ? "bg-success/10" : "bg-surface-2"),
      "aria-hidden": "true",
      children: t && /* @__PURE__ */ (0, e.jsx)(ce, { className: "size-3 text-success-foreground delight-check-bounce" })
    }), /* @__PURE__ */ (0, e.jsx)("p", {
      className: "text-sm leading-5 text-muted-foreground",
      children: s
    })]
  });
}
F.displayName = "PasswordCheck";
function Z({ className: t }) {
  return /* @__PURE__ */ (0, e.jsxs)("div", {
    className: b("flex items-center gap-1.5", t),
    children: [/* @__PURE__ */ (0, e.jsx)(S, {
      icon: "mark",
      size: "lg"
    }), /* @__PURE__ */ (0, e.jsxs)("span", {
      className: "text-lg font-semibold text-foreground",
      children: ["HUMAIN ", /* @__PURE__ */ (0, e.jsx)("span", {
        className: "text-primary",
        children: "ONE"
      })]
    })]
  });
}
Z.displayName = "LogoText";
function $({ onLogInLinkClick: t, loading: s }) {
  return /* @__PURE__ */ (0, e.jsx)("div", {
    className: "w-full flex flex-col items-center overflow-hidden",
    children: /* @__PURE__ */ (0, e.jsxs)("header", {
      className: "w-full max-w-[1280px] px-4 md:px-8 h-[72px] flex items-center justify-between delight-stagger",
      style: { "--delight-delay": "0ms" },
      children: [/* @__PURE__ */ (0, e.jsx)(Z, {}), /* @__PURE__ */ (0, e.jsxs)("div", {
        className: "flex items-center gap-1 delight-stagger",
        style: { "--delight-delay": "100ms" },
        children: [/* @__PURE__ */ (0, e.jsx)("p", {
          className: "hidden md:block text-base leading-6 text-muted-foreground",
          children: "Already have an account?"
        }), /* @__PURE__ */ (0, e.jsx)(n, {
          type: "button",
          appearance: "link",
          variant: "primary",
          size: "md",
          onClick: t,
          disabled: s,
          children: "Log in"
        })]
      })]
    })
  });
}
$.displayName = "HeaderNavigation";
function O({ activeTab: t, onSignUpTabClick: s, onLogInTabClick: r }) {
  return /* @__PURE__ */ (0, e.jsxs)("nav", {
    className: "w-full flex gap-0.5 bg-card/60 border border-border rounded-lg p-0.5",
    "aria-label": "Account action",
    children: [/* @__PURE__ */ (0, e.jsx)(n, {
      type: "button",
      appearance: t === "signup" ? "outline" : "ghost",
      variant: "secondary",
      size: "lg",
      className: "flex-1",
      onClick: s,
      children: "Sign up"
    }), /* @__PURE__ */ (0, e.jsx)(n, {
      type: "button",
      appearance: t === "login" ? "outline" : "ghost",
      variant: "secondary",
      size: "lg",
      className: "flex-1",
      onClick: r,
      children: "Log in"
    })]
  });
}
O.displayName = "TabsToggle";
var J = c.forwardRef(({ className: t, variant: s = "simple", logo: r, showTabs: h = !0, activeTab: y = "signup", onSignUpTabClick: V, onLogInTabClick: H, onSubmit: z, onLogInLinkClick: j, onGoogleSignUp: m, onFacebookSignUp: U, onAppleSignUp: X, onSAMLSignUp: Y, loading: l = !1, error: N, currentStep: T = 0, passwordValidation: I = {
  minLength: !1,
  hasSpecialChar: !1
}, rtl: K = !1, title: Q, subtitle: ee, submitLabel: se, footerText: te, footerLinkText: le }, ae) => {
  const [w, P] = c.useState(""), [u, C] = c.useState(""), [p, v] = c.useState(""), [B, re] = c.useState(""), d = s?.includes("progress"), G = s === "card-combined", x = Q ?? (d ? "Choose a password" : G ? "Start your free trial" : "Create an account"), _ = ee ?? (d ? "Must be at least 8 characters." : G ? "Sign up in less than 2 minutes." : "Start your 30-day free trial."), k = se ?? (d ? "Continue" : "Get started"), A = te ?? "Already have an account?", q = le ?? "Log in", E = (a) => {
    a.preventDefault(), z?.(d ? {
      email: u,
      password: p,
      confirmPassword: B
    } : s === "social-leading" || s === "social-logins" ? { email: u } : {
      name: w,
      email: u,
      password: p
    });
  }, L = [
    {
      label: "Your details",
      subtext: "Name and email"
    },
    {
      label: "Choose a password",
      subtext: "Choose a secure password"
    },
    {
      label: "Invite your team",
      subtext: "Start collaborating"
    },
    {
      label: "Add your socials",
      subtext: "Automatic sharing"
    }
  ];
  return /* @__PURE__ */ (0, e.jsxs)("div", {
    ref: ae,
    "data-slot": "signup-page",
    className: b(he({ variant: s }), t),
    dir: K ? "rtl" : "ltr",
    children: [
      s !== "header-navigation" && s !== "card-combined" && /* @__PURE__ */ (0, e.jsx)(me, {
        pattern: s === "social-leading" || s === "progress-02" ? "circular" : "grid",
        offset: "top"
      }),
      s === "header-navigation" && /* @__PURE__ */ (0, e.jsx)($, {
        onLogInLinkClick: j,
        loading: l
      }),
      /* @__PURE__ */ (0, e.jsx)("main", {
        className: b("relative z-10 w-full max-w-[1280px] px-8 flex", s === "header-navigation" ? "items-start justify-start" : "flex-col items-center"),
        children: /* @__PURE__ */ (0, e.jsxs)("div", {
          className: b("w-full flex flex-col gap-8 items-center", s === "card-separated" || s === "card-combined" ? "max-w-[440px]" : "max-w-[360px]"),
          children: [
            s !== "header-navigation" && /* @__PURE__ */ (0, e.jsxs)("div", {
              className: "w-full flex flex-col gap-6 items-center",
              children: [
                !d && s !== "card-combined" && /* @__PURE__ */ (0, e.jsx)("div", {
                  className: "delight-stagger",
                  style: { "--delight-delay": "0ms" },
                  children: r || /* @__PURE__ */ (0, e.jsx)(S, {
                    icon: "mark",
                    size: "xl"
                  })
                }),
                (s === "simple" || s === "social-logins" || s === "card-separated") && /* @__PURE__ */ (0, e.jsxs)("div", {
                  className: "w-full flex flex-col gap-3 text-center delight-stagger",
                  style: { "--delight-delay": "100ms" },
                  children: [/* @__PURE__ */ (0, e.jsx)("h1", {
                    className: "text-display-xs md:text-display-sm font-semibold text-foreground",
                    children: x
                  }), /* @__PURE__ */ (0, e.jsx)("p", {
                    className: "text-base leading-6 text-muted-foreground",
                    children: _
                  })]
                }),
                s === "social-leading" && /* @__PURE__ */ (0, e.jsx)("h1", {
                  className: "text-display-xs md:text-display-sm font-semibold text-foreground text-center w-full delight-stagger",
                  style: { "--delight-delay": "100ms" },
                  children: x
                }),
                d && /* @__PURE__ */ (0, e.jsxs)(e.Fragment, { children: [/* @__PURE__ */ (0, e.jsx)("div", {
                  className: "delight-stagger",
                  style: { "--delight-delay": "0ms" },
                  children: r || /* @__PURE__ */ (0, e.jsx)(S, {
                    icon: "mark",
                    size: "xl"
                  })
                }), /* @__PURE__ */ (0, e.jsxs)("div", {
                  className: "w-full flex flex-col gap-3 text-center delight-stagger",
                  style: { "--delight-delay": "100ms" },
                  children: [/* @__PURE__ */ (0, e.jsx)("h1", {
                    className: "text-display-xs md:text-display-sm font-semibold text-foreground",
                    children: x
                  }), /* @__PURE__ */ (0, e.jsx)("p", {
                    className: "text-base leading-6 text-muted-foreground",
                    children: _
                  })]
                })] }),
                h && (s === "simple" || s === "card-separated") && /* @__PURE__ */ (0, e.jsx)("div", {
                  className: "w-full delight-stagger",
                  style: { "--delight-delay": "200ms" },
                  children: /* @__PURE__ */ (0, e.jsx)(O, {
                    activeTab: y,
                    onSignUpTabClick: V,
                    onLogInTabClick: H
                  })
                })
              ]
            }),
            s === "header-navigation" && /* @__PURE__ */ (0, e.jsxs)("div", {
              className: "w-full flex flex-col gap-6 items-center",
              children: [/* @__PURE__ */ (0, e.jsxs)("div", {
                className: "w-full flex flex-col gap-3 text-center delight-stagger",
                style: { "--delight-delay": "100ms" },
                children: [/* @__PURE__ */ (0, e.jsx)("h1", {
                  className: "text-display-xs md:text-display-sm font-semibold text-foreground",
                  children: x
                }), /* @__PURE__ */ (0, e.jsx)("p", {
                  className: "text-base leading-6 text-muted-foreground",
                  children: _
                })]
              }), /* @__PURE__ */ (0, e.jsx)("div", {
                className: "w-full delight-stagger",
                style: { "--delight-delay": "200ms" },
                children: /* @__PURE__ */ (0, e.jsx)(O, {
                  activeTab: y,
                  onSignUpTabClick: V,
                  onLogInTabClick: H
                })
              })]
            }),
            s === "card-combined" && /* @__PURE__ */ (0, e.jsxs)("div", {
              className: "w-full bg-background rounded-xl shadow-sm border border-border px-10 py-8 flex flex-col gap-6 items-center",
              children: [
                /* @__PURE__ */ (0, e.jsx)("div", {
                  className: "delight-stagger",
                  style: { "--delight-delay": "0ms" },
                  children: r || /* @__PURE__ */ (0, e.jsx)(S, {
                    icon: "mark",
                    size: "xl"
                  })
                }),
                /* @__PURE__ */ (0, e.jsxs)("div", {
                  className: "w-full flex flex-col gap-2 text-center delight-stagger",
                  style: { "--delight-delay": "100ms" },
                  children: [/* @__PURE__ */ (0, e.jsx)("h1", {
                    className: "text-display-xs font-semibold text-foreground",
                    children: x
                  }), /* @__PURE__ */ (0, e.jsx)("p", {
                    className: "text-base leading-6 text-muted-foreground",
                    children: _
                  })]
                }),
                /* @__PURE__ */ (0, e.jsxs)("form", {
                  onSubmit: E,
                  className: "w-full flex flex-col gap-5 delight-stagger",
                  style: { "--delight-delay": "300ms" },
                  children: [
                    /* @__PURE__ */ (0, e.jsx)(i, {
                      type: "text",
                      placeholder: "Enter your name",
                      "aria-label": "Name",
                      value: w,
                      onChange: (a) => P(a.target.value),
                      required: !0,
                      disabled: l
                    }),
                    /* @__PURE__ */ (0, e.jsx)(i, {
                      type: "email",
                      placeholder: "Enter your email",
                      "aria-label": "Email",
                      value: u,
                      onChange: (a) => C(a.target.value),
                      required: !0,
                      disabled: l,
                      error: N
                    }),
                    /* @__PURE__ */ (0, e.jsxs)("div", {
                      className: "flex flex-col gap-1.5",
                      children: [/* @__PURE__ */ (0, e.jsx)(i, {
                        type: "password",
                        placeholder: "Create a password",
                        "aria-label": "Password",
                        value: p,
                        onChange: (a) => v(a.target.value),
                        required: !0,
                        disabled: l
                      }), /* @__PURE__ */ (0, e.jsx)("p", {
                        className: "text-sm leading-5 text-muted-foreground",
                        children: "Must be at least 8 characters."
                      })]
                    }),
                    /* @__PURE__ */ (0, e.jsxs)("div", {
                      className: "flex flex-col gap-4",
                      children: [/* @__PURE__ */ (0, e.jsx)(n, {
                        type: "submit",
                        appearance: "gradient",
                        variant: "primary",
                        size: "lg",
                        className: "w-full",
                        loading: l,
                        children: k
                      }), /* @__PURE__ */ (0, e.jsx)(o, {
                        icon: /* @__PURE__ */ (0, e.jsx)(g, {}),
                        label: "Sign up with Google",
                        onClick: m,
                        disabled: l
                      })]
                    })
                  ]
                }),
                /* @__PURE__ */ (0, e.jsxs)("div", {
                  className: "w-full flex items-baseline justify-center gap-1 delight-stagger",
                  style: { "--delight-delay": "500ms" },
                  children: [/* @__PURE__ */ (0, e.jsx)("p", {
                    className: "text-sm leading-5 text-muted-foreground",
                    children: A
                  }), /* @__PURE__ */ (0, e.jsx)(n, {
                    type: "button",
                    appearance: "link",
                    variant: "primary",
                    size: "sm",
                    onClick: j,
                    disabled: l,
                    children: q
                  })]
                })
              ]
            }),
            s === "card-separated" && /* @__PURE__ */ (0, e.jsxs)(e.Fragment, { children: [/* @__PURE__ */ (0, e.jsx)("div", {
              className: "w-full bg-background rounded-xl shadow-md border border-border px-10 py-8 flex flex-col gap-6 delight-stagger",
              style: { "--delight-delay": "300ms" },
              children: /* @__PURE__ */ (0, e.jsxs)("form", {
                onSubmit: E,
                className: "w-full flex flex-col gap-5",
                children: [
                  /* @__PURE__ */ (0, e.jsx)(i, {
                    type: "text",
                    label: "Name",
                    placeholder: "Enter your name",
                    value: w,
                    onChange: (a) => P(a.target.value),
                    required: !0,
                    disabled: l
                  }),
                  /* @__PURE__ */ (0, e.jsx)(i, {
                    type: "email",
                    label: "Email",
                    placeholder: "Enter your email",
                    value: u,
                    onChange: (a) => C(a.target.value),
                    required: !0,
                    disabled: l,
                    error: N
                  }),
                  /* @__PURE__ */ (0, e.jsxs)("div", {
                    className: "flex flex-col gap-1.5",
                    children: [/* @__PURE__ */ (0, e.jsx)(i, {
                      type: "password",
                      label: "Password",
                      placeholder: "Create a password",
                      value: p,
                      onChange: (a) => v(a.target.value),
                      required: !0,
                      disabled: l
                    }), /* @__PURE__ */ (0, e.jsx)("p", {
                      className: "text-sm leading-5 text-muted-foreground",
                      children: "Must be at least 8 characters."
                    })]
                  }),
                  /* @__PURE__ */ (0, e.jsxs)("div", {
                    className: "flex flex-col gap-4 delight-stagger",
                    style: { "--delight-delay": "400ms" },
                    children: [/* @__PURE__ */ (0, e.jsx)(n, {
                      type: "submit",
                      appearance: "gradient",
                      variant: "primary",
                      size: "lg",
                      className: "w-full",
                      loading: l,
                      children: k
                    }), /* @__PURE__ */ (0, e.jsx)(o, {
                      icon: /* @__PURE__ */ (0, e.jsx)(g, {}),
                      label: "Sign up with Google",
                      onClick: m,
                      disabled: l
                    })]
                  })
                ]
              })
            }), /* @__PURE__ */ (0, e.jsxs)("div", {
              className: "w-full flex items-baseline justify-center gap-1 delight-stagger",
              style: { "--delight-delay": "500ms" },
              children: [/* @__PURE__ */ (0, e.jsx)("p", {
                className: "text-sm leading-5 text-muted-foreground",
                children: A
              }), /* @__PURE__ */ (0, e.jsx)(n, {
                type: "button",
                appearance: "link",
                variant: "primary",
                size: "sm",
                onClick: j,
                disabled: l,
                children: q
              })]
            })] }),
            d && /* @__PURE__ */ (0, e.jsxs)(e.Fragment, { children: [
              /* @__PURE__ */ (0, e.jsxs)("form", {
                onSubmit: E,
                className: "w-full flex flex-col gap-6 delight-stagger",
                style: { "--delight-delay": "300ms" },
                children: [/* @__PURE__ */ (0, e.jsxs)("div", {
                  className: "w-full flex flex-col gap-5",
                  children: [/* @__PURE__ */ (0, e.jsx)(i, {
                    type: "password",
                    placeholder: "Choose a password",
                    value: p,
                    onChange: (a) => v(a.target.value),
                    required: !0,
                    disabled: l
                  }), /* @__PURE__ */ (0, e.jsx)(i, {
                    type: "password",
                    placeholder: "Confirm password",
                    value: B,
                    onChange: (a) => re(a.target.value),
                    required: !0,
                    disabled: l
                  })]
                }), /* @__PURE__ */ (0, e.jsx)(n, {
                  type: "submit",
                  appearance: "gradient",
                  variant: "primary",
                  size: "lg",
                  className: "w-full",
                  loading: l,
                  children: k
                })]
              }),
              s === "progress-01" && /* @__PURE__ */ (0, e.jsx)("div", {
                className: "w-full flex items-center justify-center delight-stagger",
                style: { "--delight-delay": "500ms" },
                children: /* @__PURE__ */ (0, e.jsx)(M, {
                  steps: L,
                  currentStep: T,
                  shape: "round",
                  bulletType: "text"
                })
              }),
              s === "progress-02" && /* @__PURE__ */ (0, e.jsx)("div", {
                className: "w-full flex items-center justify-center delight-stagger",
                style: { "--delight-delay": "500ms" },
                children: /* @__PURE__ */ (0, e.jsx)(M, {
                  steps: L,
                  currentStep: T,
                  shape: "rounded",
                  bulletType: "icon"
                })
              }),
              s === "progress-03" && /* @__PURE__ */ (0, e.jsx)("div", {
                className: "w-full flex items-start gap-4 delight-stagger",
                style: { "--delight-delay": "500ms" },
                children: /* @__PURE__ */ (0, e.jsx)(M, {
                  steps: L,
                  currentStep: T,
                  orientation: "horizontal",
                  shape: "rounded",
                  bulletType: "text"
                })
              })
            ] }),
            !d && s !== "card-separated" && s !== "card-combined" && /* @__PURE__ */ (0, e.jsxs)(e.Fragment, { children: [
              s === "social-leading" && /* @__PURE__ */ (0, e.jsxs)(e.Fragment, { children: [/* @__PURE__ */ (0, e.jsx)("div", {
                className: "w-full flex flex-col gap-3 delight-stagger",
                style: { "--delight-delay": "200ms" },
                children: /* @__PURE__ */ (0, e.jsx)(o, {
                  icon: /* @__PURE__ */ (0, e.jsx)(g, {}),
                  label: "Sign up with Google",
                  onClick: m,
                  disabled: l
                })
              }), /* @__PURE__ */ (0, e.jsx)(D, {})] }),
              /* @__PURE__ */ (0, e.jsxs)("form", {
                onSubmit: E,
                className: "w-full flex flex-col gap-6",
                children: [
                  (s === "simple" || s === "header-navigation") && /* @__PURE__ */ (0, e.jsxs)("div", {
                    className: "w-full flex flex-col gap-5 delight-stagger",
                    style: { "--delight-delay": "300ms" },
                    children: [
                      /* @__PURE__ */ (0, e.jsx)(i, {
                        type: "text",
                        label: "Name",
                        placeholder: "Enter your name",
                        value: w,
                        onChange: (a) => P(a.target.value),
                        required: !0,
                        disabled: l
                      }),
                      /* @__PURE__ */ (0, e.jsx)(i, {
                        type: "email",
                        label: "Email",
                        placeholder: "Enter your email",
                        value: u,
                        onChange: (a) => C(a.target.value),
                        required: !0,
                        disabled: l,
                        error: N
                      }),
                      /* @__PURE__ */ (0, e.jsx)(i, {
                        type: "password",
                        label: "Password",
                        placeholder: "Create a password",
                        value: p,
                        onChange: (a) => v(a.target.value),
                        required: !0,
                        disabled: l
                      }),
                      s === "simple" && /* @__PURE__ */ (0, e.jsxs)("ul", {
                        className: "flex flex-col gap-3",
                        "aria-label": "Password requirements",
                        children: [/* @__PURE__ */ (0, e.jsx)(F, {
                          checked: I.minLength,
                          text: "Must be at least 8 characters"
                        }), /* @__PURE__ */ (0, e.jsx)(F, {
                          checked: I.hasSpecialChar,
                          text: "Must contain one special character"
                        })]
                      }),
                      s === "header-navigation" && /* @__PURE__ */ (0, e.jsx)("p", {
                        className: "text-sm leading-5 text-muted-foreground",
                        children: "Must be at least 8 characters."
                      })
                    ]
                  }),
                  (s === "social-logins" || s === "social-leading") && /* @__PURE__ */ (0, e.jsx)("div", {
                    className: "w-full flex flex-col gap-4 delight-stagger",
                    style: { "--delight-delay": "300ms" },
                    children: /* @__PURE__ */ (0, e.jsx)(i, {
                      type: "email",
                      placeholder: "Enter your email",
                      value: u,
                      onChange: (a) => C(a.target.value),
                      required: !0,
                      disabled: l,
                      error: N
                    })
                  }),
                  /* @__PURE__ */ (0, e.jsxs)("div", {
                    className: "w-full flex flex-col gap-4 delight-stagger",
                    style: { "--delight-delay": "400ms" },
                    children: [
                      /* @__PURE__ */ (0, e.jsx)(n, {
                        type: "submit",
                        appearance: "gradient",
                        variant: "primary",
                        size: "lg",
                        className: "w-full",
                        loading: l,
                        children: k
                      }),
                      s === "simple" && /* @__PURE__ */ (0, e.jsx)(o, {
                        icon: /* @__PURE__ */ (0, e.jsx)(g, {}),
                        label: "Sign up with Google",
                        onClick: m,
                        disabled: l
                      }),
                      s === "social-logins" && /* @__PURE__ */ (0, e.jsxs)(e.Fragment, { children: [/* @__PURE__ */ (0, e.jsx)(D, { label: "OR" }), /* @__PURE__ */ (0, e.jsxs)("div", {
                        className: "w-full flex flex-col gap-3",
                        children: [
                          /* @__PURE__ */ (0, e.jsx)(o, {
                            icon: /* @__PURE__ */ (0, e.jsx)(g, {}),
                            label: "Sign up with Google",
                            onClick: m,
                            disabled: l
                          }),
                          /* @__PURE__ */ (0, e.jsx)(o, {
                            icon: /* @__PURE__ */ (0, e.jsx)(pe, {}),
                            label: "Sign up with Facebook",
                            onClick: U,
                            disabled: l
                          }),
                          /* @__PURE__ */ (0, e.jsx)(o, {
                            icon: /* @__PURE__ */ (0, e.jsx)(ge, {}),
                            label: "Sign up with Apple",
                            onClick: X,
                            disabled: l
                          })
                        ]
                      })] }),
                      s === "header-navigation" && /* @__PURE__ */ (0, e.jsx)(o, {
                        icon: /* @__PURE__ */ (0, e.jsx)(g, {}),
                        label: "Sign up with Google",
                        onClick: m,
                        disabled: l
                      })
                    ]
                  })
                ]
              }),
              (s === "social-leading" || s === "header-navigation") && /* @__PURE__ */ (0, e.jsx)("div", {
                className: "delight-stagger",
                style: { "--delight-delay": "500ms" },
                children: /* @__PURE__ */ (0, e.jsx)(n, {
                  type: "button",
                  appearance: "link",
                  variant: "primary",
                  size: "sm",
                  onClick: Y,
                  disabled: l,
                  children: "Continue with SAML SSO"
                })
              }),
              (s === "simple" || s === "social-logins") && /* @__PURE__ */ (0, e.jsxs)("div", {
                className: "w-full flex items-baseline justify-center gap-1 delight-stagger",
                style: { "--delight-delay": "500ms" },
                children: [/* @__PURE__ */ (0, e.jsx)("p", {
                  className: "text-sm leading-5 text-muted-foreground",
                  children: A
                }), /* @__PURE__ */ (0, e.jsx)(n, {
                  type: "button",
                  appearance: "link",
                  variant: "primary",
                  size: "sm",
                  onClick: j,
                  disabled: l,
                  children: q
                })]
              })
            ] })
          ]
        })
      })
    ]
  });
});
J.displayName = "SignupPage";
var xe = de();
function fe(t) {
  return {
    onSignUpTabClick: (s) => {
      t.dispatchEvent(new CustomEvent("sign-up-tab-click", {
        detail: s,
        bubbles: !0,
        composed: !0
      }));
    },
    onLogInTabClick: (s) => {
      t.dispatchEvent(new CustomEvent("log-in-tab-click", {
        detail: s,
        bubbles: !0,
        composed: !0
      }));
    },
    onSubmit: (s) => {
      t.dispatchEvent(new CustomEvent("submit", {
        detail: s,
        bubbles: !0,
        composed: !0
      }));
    },
    onLogInLinkClick: (s) => {
      t.dispatchEvent(new CustomEvent("log-in-link-click", {
        detail: s,
        bubbles: !0,
        composed: !0
      }));
    },
    onGoogleSignUp: (s) => {
      t.dispatchEvent(new CustomEvent("google-sign-up", {
        detail: s,
        bubbles: !0,
        composed: !0
      }));
    },
    onFacebookSignUp: (s) => {
      t.dispatchEvent(new CustomEvent("facebook-sign-up", {
        detail: s,
        bubbles: !0,
        composed: !0
      }));
    },
    onAppleSignUp: (s) => {
      t.dispatchEvent(new CustomEvent("apple-sign-up", {
        detail: s,
        bubbles: !0,
        composed: !0
      }));
    },
    onSAMLSignUp: (s) => {
      t.dispatchEvent(new CustomEvent("saml-sign-up", {
        detail: s,
        bubbles: !0,
        composed: !0
      }));
    }
  };
}
function be(t) {
  const { _hostElement: s, ...r } = t, h = c.useMemo(() => s ? fe(s) : {}, [s]);
  return c.createElement(J, {
    ...r,
    ...h
  });
}
var f = {
  variant: "string",
  size: "string",
  className: "string",
  logo: "json",
  showTabs: "boolean",
  activeTab: "string",
  loading: "boolean",
  error: "string",
  currentStep: "number",
  passwordValidation: "json",
  rtl: "boolean",
  title: "string",
  subtitle: "string",
  submitLabel: "string",
  footerText: "string",
  footerLinkText: "string"
};
function R(t, s) {
  if (t !== null)
    switch (s) {
      case "number":
        return Number(t);
      case "boolean":
        return t !== "false" && t !== "0";
      case "json":
        try {
          return JSON.parse(t);
        } catch {
          return t;
        }
      default:
        return t;
    }
}
var W = class extends HTMLElement {
  _root = null;
  _childrenContainer = null;
  _props = {};
  _initialized = !1;
  connectedCallback() {
    setTimeout(() => this._initialize(), 0);
  }
  _initialize() {
    if (this._initialized) return;
    this._initialized = !0;
    const t = [];
    for (const r of Array.from(this.childNodes))
      r.nodeType === Node.TEXT_NODE && !r.textContent?.trim() || t.push(r);
    const s = document.createElement("div");
    for (s.style.display = "contents", this._childrenContainer = document.createElement("div"), this._childrenContainer.style.display = "contents", t.forEach((r) => this._childrenContainer.appendChild(r)); this.firstChild; ) this.removeChild(this.firstChild);
    this.appendChild(s), this._root = (0, xe.createRoot)(s), this._render();
  }
  disconnectedCallback() {
    this._root?.unmount(), this._root = null;
  }
  attributeChangedCallback(t, s, r) {
    this._render();
  }
  static get observedAttributes() {
    return Object.keys(f).map((t) => t.replace(/([A-Z])/g, "-$1").toLowerCase());
  }
  _setProp(t, s) {
    const r = f[t] || "string";
    this._props[t] = this._parseValue(s, r), this._render();
  }
  _parseValue(t, s) {
    if (s === "boolean" && typeof t == "boolean" || s === "number" && typeof t == "number" || s === "string" && typeof t == "string") return t;
    if (typeof t == "string") switch (s) {
      case "boolean":
        return t !== "false" && t !== "0" && t !== "";
      case "number":
        return Number(t);
      case "json":
        try {
          return JSON.parse(t);
        } catch {
          return t;
        }
      default:
        return t;
    }
    return t;
  }
  _getProp(t) {
    if (t in this._props) return this._props[t];
    const s = t.replace(/([A-Z])/g, "-$1").toLowerCase(), r = f[t] || "string";
    return R(this.getAttribute(s), r);
  }
  _render() {
    if (!this._root) return;
    const t = {};
    for (const [r, h] of Object.entries(f)) if (r in this._props) t[r] = this._props[r];
    else {
      const y = r.replace(/([A-Z])/g, "-$1").toLowerCase();
      t[r] = R(this.getAttribute(y), h);
    }
    const s = c.createElement(be, {
      ...t,
      _hostElement: this
    });
    this._root.render(s);
  }
};
for (const t of Object.keys(f)) Object.defineProperty(W.prototype, t, {
  get() {
    return this._getProp(t);
  },
  set(s) {
    this._setProp(t, s);
  },
  enumerable: !0,
  configurable: !0
});
typeof customElements < "u" && !customElements.get("hf-signup-page") && customElements.define("hf-signup-page", W);
export {
  W as SignupPageWC,
  W as default
};

//# sourceMappingURL=hf-signup-page.js.map