@frank-auth/react/dist/esm/components/auth/sign-up/sign-up-button.js

Flexible and customizable React UI components for Frank Authentication

'use client';
import { jsx as t, jsxs as G, Fragment as H } from "react/jsx-runtime";
import "@emotion/styled";
import { Button as N } from "../../ui/button/button.js";
import { UserIcon as J, UserPlusIcon as j } from "@heroicons/react/24/outline";
import { useCallback as D } from "react";
import { useAuth as K } from "../../../hooks/use-auth.js";
import { useConfig as Q } from "../../../hooks/use-config.js";
import { useSignUpModal as V, SignUpModal as W } from "./sign-up-modal.js";
function nt({
  children: d,
  variant: w = "solid",
  color: U = "primary",
  size: f = "md",
  fullWidth: g = !1,
  startContent: x,
  endContent: C,
  className: l = "",
  modalMode: e = !1,
  modalProps: b = {},
  href: r = "/auth/sign-up",
  onClick: o,
  onSuccess: p,
  onError: B,
  disabled: u = !1,
  loading: i = !1,
  showAuthenticatedState: I = !0,
  iconOnly: s = !1,
  redirectAfterSignUp: n,
  autoRedirect: a = !0
}) {
  const { isSignedIn: L, user: c, isLoading: m } = K(), { components: $, features: y } = Q(), { isOpen: F, open: S, close: P } = V(), T = $.SignUpButton;
  if (T)
    return /* @__PURE__ */ t(
      T,
      {
        children: d,
        variant: w,
        color: U,
        size: f,
        fullWidth: g,
        startContent: x,
        endContent: C,
        className: l,
        modalMode: e,
        modalProps: b,
        href: r,
        onClick: o,
        onSuccess: p,
        onError: B,
        disabled: u,
        loading: i,
        showAuthenticatedState: I,
        iconOnly: s,
        redirectAfterSignUp: n,
        autoRedirect: a
      }
    );
  if (!y.signUp)
    return null;
  const _ = D(
    (h) => {
      if (p?.(h), a && n)
        setTimeout(() => {
          window.location.href = n;
        }, 1e3);
      else if (a && h.user) {
        const v = h.user.userType || "external", E = {
          internal: "/admin/dashboard",
          external: "/dashboard",
          end_user: "/app"
        }[v] || "/dashboard";
        setTimeout(() => {
          window.location.href = E;
        }, 1e3);
      }
    },
    [p, a, n]
  ), q = D(() => {
    if (!(u || i || m)) {
      if (o) {
        o();
        return;
      }
      if (e) {
        S();
        return;
      }
      r && (window.location.href = r);
    }
  }, [u, i, m, o, e, S, r]);
  return I && L && c ? /* @__PURE__ */ t(
    N,
    {
      variant: "light",
      size: f,
      className: `${l} text-success-600`,
      startContent: /* @__PURE__ */ t(J, { className: "w-4 h-4" }),
      isDisabled: !0,
      children: s ? null : `Welcome, ${c.firstName || c.primaryEmailAddress || "User"}`
    }
  ) : /* @__PURE__ */ G(H, { children: [
    /* @__PURE__ */ t(
      N,
      {
        variant: w,
        color: U,
        size: f,
        fullWidth: g,
        startContent: x || (s ? /* @__PURE__ */ t(j, { className: "w-4 h-4" }) : /* @__PURE__ */ t(j, { className: "w-4 h-4" })),
        endContent: C,
        className: l,
        onPress: q,
        isDisabled: u || m,
        isLoading: i || m,
        isIconOnly: s,
        children: d || (s ? null : "Sign Up")
      }
    ),
    e && /* @__PURE__ */ t(
      W,
      {
        isOpen: F,
        onClose: P,
        onSuccess: _,
        onError: B,
        redirectUrl: n,
        ...b
      }
    )
  ] });
}
export {
  nt as SignUpButton
};
//# sourceMappingURL=sign-up-button.js.map