@zango-core/appbuilder 1.0.0-rc.1

package/dist/LoginPageWithRoleSelection-xTr_eIWh.js

@@ -0,0 +1,662 @@
+import { jsx as e, jsxs as n, Fragment as ge } from "react/jsx-runtime";
+import { Spin as ie, Button as J, FormItem as N, PasswordInput as te, toast as j, Alert as ce, Divider as Y, Tabs as ke, Form as ye, Input as we, Checkbox as ve, Select as Ae, Space as Te, Layout as Q, Card as fe } from "@zango-core/components";
+import Me, { useState as u, useCallback as me, useEffect as ne, useRef as Fe, useLayoutEffect as Ue } from "react";
+import { b as ue, c as he, g as Ne, d as Pe, e as _e, f as a, l as se, O as oe, P as M, M as Ie, S as qe, p as de, h as De, u as Ce, i as Se, j as je, k as xe, m as Be, n as Ke, o as We, s as pe, q as be, A as Ee, r as $e } from "./index.framework-B8SMzgN1.js";
+import { Link as Le, useSearchParams as ze } from "react-router-dom";
+const Ve = ({ onLogin: g, showRememberMe: y = !0 }) => {
+  const [h, m] = u(!1), [B, f] = u(null), [, l] = u(null), [O, P] = u("email"), [i, R] = u(!1), [F, k] = u(0), [U, A] = u(!1), [V, r] = u(!1), [p, _] = u(""), [K, I] = u(""), { authConfig: d } = ue(), { getLoginConfig: o, getMessagesConfig: c, getProvidersConfig: q, authConfig: W } = he(), $ = W || d, G = Ne($), X = Pe($), le = _e($), Z = me(async () => {
+    try {
+      return await a.isAuthenticated();
+    } catch {
+      return !1;
+    }
+  }, []);
+  if (ne(() => {
+    if (d) {
+      const s = a.isPasswordLoginEnabled() ? "password" : a.isOTPLoginEnabled() ? "otp" : null;
+      s && l(s);
+      const t = a.getAllowedUsernamesForMethod(s ?? "password");
+      if (t && t.length > 0) {
+        const x = t.includes("email"), S = t.includes("mobile");
+        x ? P("email") : S && P("mobile");
+      }
+    }
+  }, [d]), ne(() => {
+    (async () => {
+      const t = await Z();
+      A(t);
+    })();
+  }, [Z]), !d)
+    return /* @__PURE__ */ e("div", { className: "flex justify-center items-center min-h-loading-min-h", children: /* @__PURE__ */ e(ie, { size: "large" }) });
+  const ae = (s) => {
+    const t = c();
+    return s === "email" ? [
+      {
+        required: !0,
+        message: t?.validation?.required || "Please enter your email address"
+      },
+      {
+        type: "email",
+        message: t?.validation?.invalidEmail || "Please enter a valid email address!"
+      }
+    ] : s === "mobile" ? [
+      {
+        required: !0,
+        message: t?.validation?.required || "Please input your mobile number!"
+      },
+      {
+        pattern: /^\+\d{7,15}$/,
+        message: t?.validation?.invalidMobile || "Please enter a valid mobile number with country code (e.g., +919876543210)"
+      }
+    ] : [
+      {
+        required: !0,
+        message: t?.validation?.required || "Please enter your email address"
+      },
+      {
+        type: "email",
+        message: t?.validation?.invalidEmail || "Please enter a valid email address!"
+      }
+    ];
+  }, ee = (s) => {
+    !["Backspace", "Delete", "Tab", "Enter", "ArrowLeft", "ArrowRight"].includes(s.key) && !s.ctrlKey && !s.metaKey && !/[0-9+]/.test(s.key) && s.preventDefault();
+  }, re = async (s) => {
+    m(!0), f(null);
+    try {
+      const t = a.getAllowedUsernames(), x = t.includes("email"), S = t.includes("mobile"), E = x && S ? O : x ? "email" : "mobile", D = {
+        email: E === "email" ? s.username : void 0,
+        phone: E === "mobile" ? s.username : void 0,
+        password: s.password,
+        remember_me: s.remember || !1
+      };
+      await g(D);
+    } catch (t) {
+      const x = c(), S = (t instanceof Error ? t.message : null) || x?.errors?.loginFailed || "Login failed. Please try again.";
+      f(S);
+    } finally {
+      m(!1);
+    }
+  }, w = async (s) => {
+    await g(s);
+  }, C = async () => {
+    m(!0);
+    try {
+      await a.logout(), j.success("Logged out successfully"), A(!1);
+    } catch (s) {
+      j.error(s instanceof Error ? s.message : "Failed to logout");
+    } finally {
+      m(!1);
+    }
+  }, T = async () => {
+    if (!p || !K) {
+      j.error("Please fill in all password fields");
+      return;
+    }
+    if (p !== K) {
+      j.error("Passwords do not match");
+      return;
+    }
+    if (p.length < 8) {
+      j.error("Password must be at least 8 characters long");
+      return;
+    }
+    m(!0);
+    try {
+      await a.setPassword(p), j.success("Password changed successfully!"), r(!1), _(""), I("");
+    } catch (s) {
+      j.error(s instanceof Error ? s.message : "Failed to change password");
+    } finally {
+      m(!1);
+    }
+  }, z = (s) => {
+    const t = o(), x = c();
+    return /* @__PURE__ */ n(
+      ye,
+      {
+        name: `${s}-password-login`,
+        className: "w-full",
+        onFinish: re,
+        layout: "vertical",
+        initialValues: { remember: !1 },
+        children: [
+          B && /* @__PURE__ */ e(ce, { message: B, type: "error", showIcon: !0, closable: !0, onClose: () => f(null), className: "mb-4" }),
+          /* @__PURE__ */ e(N, { name: "username", rules: ae(s), children: /* @__PURE__ */ e(
+            we,
+            {
+              placeholder: s === "email" ? t?.formPlaceholders?.email || "Enter your email address" : t?.formPlaceholders?.mobile || "Enter your mobile number (+919876543210)",
+              autoComplete: s === "email" ? "email" : "tel",
+              onKeyDown: s === "mobile" ? ee : void 0
+            }
+          ) }),
+          /* @__PURE__ */ e(
+            N,
+            {
+              name: "password",
+              rules: [
+                {
+                  required: !0,
+                  // validation.required is worded for the identifier field, so it
+                  // must not be reused under the password input.
+                  message: x?.validation?.passwordRequired || "Please input your password!"
+                },
+                {
+                  ...de(
+                    d?.password_policy ?? null
+                  ),
+                  message: x?.validation?.passwordTooShort || de(
+                    d?.password_policy ?? null
+                  ).message
+                }
+              ],
+              children: /* @__PURE__ */ e(
+                te,
+                {
+                  placeholder: t?.formPlaceholders?.password || "Enter your password",
+                  autoComplete: "current-password"
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ e(N, { children: /* @__PURE__ */ n("div", { className: "flex justify-between items-center w-full", children: [
+            /* @__PURE__ */ e("div", { children: t?.showRememberMe !== !1 && y && a.isRememberMeEnabled() && /* @__PURE__ */ e(N, { name: "remember", valuePropName: "checked", noStyle: !0, children: /* @__PURE__ */ e("div", { className: "auth-remember-me", style: X, children: /* @__PURE__ */ e(ve, { label: t?.rememberMeText || "Remember me" }) }) }) }),
+            /* @__PURE__ */ e("div", { children: a.isForgotPasswordEnabled() && /* @__PURE__ */ e(Le, { to: "forgot-password", className: "text-sm transition-colors duration-300", style: le, children: t?.forgotPasswordText || "Forgot password?" }) })
+          ] }) }),
+          /* @__PURE__ */ e(N, { children: /* @__PURE__ */ e(
+            J,
+            {
+              variant: "primary",
+              type: "submit",
+              className: "w-full text-base font-medium",
+              disabled: h,
+              fullWidth: !0,
+              children: h ? /* @__PURE__ */ n("span", { className: "inline-flex items-center gap-2", children: [
+                /* @__PURE__ */ e(De, { size: 16, className: "animate-spin" }),
+                t?.submitButtonText || "Sign in"
+              ] }) : t?.submitButtonText || "Sign in"
+            }
+          ) })
+        ]
+      },
+      `${s}-${F}`
+    );
+  }, H = () => {
+    if (!a.isOTPLoginEnabled()) return null;
+    const s = o();
+    return i ? /* @__PURE__ */ e(oe, { onSuccess: w, onBack: () => R(!1) }) : /* @__PURE__ */ e(
+      J,
+      {
+        variant: "secondary",
+        fullWidth: !0,
+        onClick: () => R(!0),
+        className: "bg-gray-100 border-gray-300",
+        children: s?.otpButtonText || "Sign in with OTP"
+      }
+    );
+  }, Oe = () => {
+    if (!d)
+      return null;
+    const s = a.getAllowedUsernames(), t = s.includes("email"), x = s.includes("mobile"), S = a.isSSOEnabled() || a.isOIDCEnabled(), E = a.isPasswordLoginEnabled(), D = a.isOTPLoginEnabled();
+    if (!E && !D && !S)
+      return se.error("[Auth] No login method is enabled in the auth config", void 0, {
+        enabledMethods: a.getEnabledLoginMethods()
+      }), /* @__PURE__ */ e(
+        ce,
+        {
+          type: "warning",
+          showIcon: !1,
+          message: "No sign-in method is configured. Please contact your administrator."
+        }
+      );
+    if (i && D && E)
+      return /* @__PURE__ */ e("div", { className: "w-full", children: /* @__PURE__ */ e(oe, { onSuccess: w, onBack: () => R(!1) }) });
+    if (S && !E && !D)
+      return /* @__PURE__ */ n("div", { className: "w-full", children: [
+        a.isSSOEnabled() && /* @__PURE__ */ e("div", { className: "mb-4", children: /* @__PURE__ */ e("div", { className: "space-y-2", children: a.getSSOProviders().map((L) => /* @__PURE__ */ e(M, { provider: L, type: "sso" }, L.id)) }) }),
+        a.isOIDCEnabled() && /* @__PURE__ */ e("div", { className: "space-y-2", children: a.getOIDCProviders().map((L) => /* @__PURE__ */ e(M, { provider: L, type: "oidc" }, L.id)) })
+      ] });
+    if (D && !E) {
+      const L = q();
+      return /* @__PURE__ */ n("div", { className: "w-full", children: [
+        /* @__PURE__ */ e(oe, { onSuccess: w }),
+        S && /* @__PURE__ */ n("div", { className: "mt-6", children: [
+          /* @__PURE__ */ e(Y, { children: L?.separatorText || "OR" }),
+          a.isSSOEnabled() && /* @__PURE__ */ e("div", { className: "mb-4", children: /* @__PURE__ */ e("div", { className: "space-y-2", children: a.getSSOProviders().map((b) => /* @__PURE__ */ e(M, { provider: b, type: "sso" }, b.id)) }) }),
+          a.isOIDCEnabled() && /* @__PURE__ */ e("div", { className: "mt-4", children: /* @__PURE__ */ e("div", { className: "space-y-2", children: a.getOIDCProviders().map((b) => /* @__PURE__ */ e(M, { provider: b, type: "oidc" }, b.id)) }) })
+        ] })
+      ] });
+    }
+    if (t && x && E) {
+      const L = o(), b = q();
+      return /* @__PURE__ */ e("div", { className: "w-full", children: /* @__PURE__ */ e(
+        ke,
+        {
+          className: "login-tabs",
+          activeKey: O,
+          onChange: (v) => {
+            P(v), k((Re) => Re + 1), f(null);
+          },
+          items: [
+            {
+              key: "email",
+              label: /* @__PURE__ */ n("span", { className: "flex items-center gap-1", style: G, children: [
+                /* @__PURE__ */ e(Ie, { size: 16 }),
+                L?.tabLabels?.email || "Email"
+              ] }),
+              children: /* @__PURE__ */ n(ge, { children: [
+                z("email"),
+                D && E && !i && /* @__PURE__ */ n("div", { className: "mt-6", children: [
+                  /* @__PURE__ */ e(Y, { children: b?.separatorText || "OR" }),
+                  H()
+                ] }),
+                i && H(),
+                !i && S && /* @__PURE__ */ n("div", { className: "mt-6", children: [
+                  /* @__PURE__ */ e(Y, { children: b?.separatorText || "OR" }),
+                  a.isSSOEnabled() && /* @__PURE__ */ e("div", { className: "mb-4", children: /* @__PURE__ */ e("div", { className: "space-y-2", children: a.getSSOProviders().map(
+                    (v) => /* @__PURE__ */ e(M, { provider: v, type: "sso" }, v.id)
+                  ) }) }),
+                  a.isOIDCEnabled() && /* @__PURE__ */ e("div", { className: "mt-4", children: /* @__PURE__ */ e("div", { className: "space-y-2", children: a.getOIDCProviders().map(
+                    (v) => /* @__PURE__ */ e(M, { provider: v, type: "oidc" }, v.id)
+                  ) }) })
+                ] })
+              ] })
+            },
+            {
+              key: "mobile",
+              label: /* @__PURE__ */ n("span", { className: "flex items-center gap-1", style: G, children: [
+                /* @__PURE__ */ e(qe, { size: 16 }),
+                L?.tabLabels?.mobile || "Mobile"
+              ] }),
+              children: /* @__PURE__ */ n(ge, { children: [
+                z("mobile"),
+                D && E && !i && /* @__PURE__ */ n("div", { className: "mt-6", children: [
+                  /* @__PURE__ */ e(Y, { children: "OR" }),
+                  H()
+                ] }),
+                i && H(),
+                !i && S && /* @__PURE__ */ n("div", { className: "mt-6", children: [
+                  /* @__PURE__ */ e(Y, { children: "OR" }),
+                  a.isSSOEnabled() && /* @__PURE__ */ e("div", { className: "mb-4", children: /* @__PURE__ */ e("div", { className: "space-y-2", children: a.getSSOProviders().map(
+                    (v) => /* @__PURE__ */ e(M, { provider: v, type: "sso" }, v.id)
+                  ) }) }),
+                  a.isOIDCEnabled() && /* @__PURE__ */ e("div", { className: "mt-4", children: /* @__PURE__ */ e("div", { className: "space-y-2", children: a.getOIDCProviders().map(
+                    (v) => /* @__PURE__ */ e(M, { provider: v, type: "oidc" }, v.id)
+                  ) }) })
+                ] })
+              ] })
+            }
+          ]
+        }
+      ) });
+    } else
+      return /* @__PURE__ */ n("div", { className: "w-full", children: [
+        z(t ? "email" : "mobile"),
+        D && E && !i && /* @__PURE__ */ n("div", { className: "mt-6", children: [
+          /* @__PURE__ */ e(Y, { children: "OR" }),
+          H()
+        ] }),
+        i && H(),
+        !i && S && /* @__PURE__ */ n("div", { className: "mt-6", children: [
+          /* @__PURE__ */ e(Y, { children: "OR" }),
+          a.isSSOEnabled() && /* @__PURE__ */ e("div", { className: "mb-4", children: /* @__PURE__ */ e("div", { className: "space-y-2", children: a.getSSOProviders().map((b) => /* @__PURE__ */ e(M, { provider: b, type: "sso" }, b.id)) }) }),
+          a.isOIDCEnabled() && /* @__PURE__ */ e("div", { className: "mt-4", children: /* @__PURE__ */ e("div", { className: "space-y-2", children: a.getOIDCProviders().map((b) => /* @__PURE__ */ e(M, { provider: b, type: "oidc" }, b.id)) }) })
+        ] })
+      ] });
+  };
+  return d ? U ? /* @__PURE__ */ e("div", { className: "w-full", children: V ? /* @__PURE__ */ n("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ e("h4", { className: "text-base font-medium mb-4", children: "Change Your Password" }),
+    /* @__PURE__ */ e(N, { label: "New Password", children: /* @__PURE__ */ e(
+      te,
+      {
+        value: p,
+        onChange: (s) => _(s.target.value),
+        placeholder: "Enter new password",
+        disabled: h
+      }
+    ) }),
+    /* @__PURE__ */ e(N, { label: "Confirm Password", children: /* @__PURE__ */ e(
+      te,
+      {
+        value: K,
+        onChange: (s) => I(s.target.value),
+        placeholder: "Confirm new password",
+        disabled: h
+      }
+    ) }),
+    /* @__PURE__ */ n("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ e(J, { type: "primary", onClick: T, loading: h, className: "flex-1", children: "Change Password" }),
+      /* @__PURE__ */ e(
+        J,
+        {
+          onClick: () => {
+            r(!1), _(""), I("");
+          },
+          disabled: h,
+          className: "flex-1",
+          children: "Cancel"
+        }
+      )
+    ] })
+  ] }) : /* @__PURE__ */ n("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ n("div", { className: "text-center mb-4", children: [
+      /* @__PURE__ */ e("h3", { className: "text-lg font-medium", style: G, children: "Already Logged In" }),
+      /* @__PURE__ */ e("p", { className: "text-sm mt-2", style: X, children: "You are currently logged in." })
+    ] }),
+    /* @__PURE__ */ e(J, { block: !0, onClick: () => r(!0), children: "Change Password" }),
+    /* @__PURE__ */ e(J, { block: !0, danger: !0, onClick: C, loading: h, children: "Logout" })
+  ] }) }) : Oe() : /* @__PURE__ */ e("div", { className: "flex justify-center items-center min-h-loading-min-h", children: /* @__PURE__ */ e(ie, { size: "large" }) });
+}, Ye = ({ onLogin: g, showRememberMe: y = !0, showForgotPassword: h = !0 }) => {
+  const [m, B] = u(!1), [f] = u(0), [l, O] = u("email"), { authConfig: P } = ue();
+  ne(() => {
+    if (P) {
+      const r = a.getAllowedUsernames();
+      r && r.length > 0 && O(r[0]);
+    }
+  }, [P]);
+  const i = async (r) => {
+    B(!0);
+    try {
+      if (g) {
+        const p = {
+          email: l === "email" ? r.username : void 0,
+          phone: l === "mobile" ? r.username : void 0,
+          username: r.username,
+          password: r.password,
+          remember_me: r.remember || !1
+        };
+        await g(p);
+      }
+    } catch (p) {
+      j.error(p instanceof Error ? p.message : "Login failed. Please try again.");
+    } finally {
+      B(!1);
+    }
+  }, R = () => {
+    switch (l) {
+      case "email":
+        return "Email address";
+      case "mobile":
+        return "Phone number";
+      case "username":
+        return "Username";
+      default:
+        return "Username";
+    }
+  }, F = () => {
+    const r = [{ required: !0, message: `Please input your ${l}!` }];
+    switch (l) {
+      case "email":
+        return [...r, { type: "email", message: "Please enter a valid email address!" }];
+      case "mobile":
+        return [...r, { pattern: /^\+?[1-9]\d{1,14}$/, message: "Please enter a valid phone number!" }];
+      case "username":
+        return [...r, { min: 3, message: "Username must be at least 3 characters long" }];
+      default:
+        return r;
+    }
+  };
+  if (!P)
+    return /* @__PURE__ */ e("div", { className: "flex justify-center items-center min-h-loading-min-h", children: "Loading..." });
+  const k = a.getAllowedUsernames(), U = k.length > 1, A = a.isRememberMeEnabled(), V = a.isForgotPasswordEnabled();
+  return /* @__PURE__ */ n(
+    ye,
+    {
+      name: "login",
+      className: "w-full space-y-4",
+      initialValues: { remember: !1 },
+      onFinish: (r) => i(r),
+      autoComplete: "off",
+      layout: "vertical",
+      children: [
+        U && /* @__PURE__ */ e(N, { label: "Login with", className: "mb-4", children: /* @__PURE__ */ e(
+          Ae,
+          {
+            value: l,
+            onChange: (r) => O(String(r)),
+            options: k.map((r) => ({
+              value: r,
+              label: r === "mobile" ? "Phone" : r.charAt(0).toUpperCase() + r.slice(1)
+            }))
+          }
+        ) }),
+        /* @__PURE__ */ e(N, { name: "username", rules: F(), children: /* @__PURE__ */ e(
+          we,
+          {
+            className: "w-full",
+            placeholder: R(),
+            autoComplete: l === "email" ? "email" : "username"
+          }
+        ) }),
+        /* @__PURE__ */ e(
+          N,
+          {
+            name: "password",
+            rules: [
+              { required: !0, message: "Please input your password!" },
+              de(P?.password_policy)
+            ],
+            children: /* @__PURE__ */ e(te, { className: "w-full", placeholder: "Password", autoComplete: "current-password" })
+          }
+        ),
+        /* @__PURE__ */ e(N, { children: /* @__PURE__ */ n(Te, { className: "flex justify-between items-center w-full", children: [
+          y && A && /* @__PURE__ */ e(N, { name: "remember", valuePropName: "checked", noStyle: !0, children: /* @__PURE__ */ e(ve, { label: "Remember me" }) }),
+          h && V && /* @__PURE__ */ e(Le, { to: "forgot-password", className: "text-brand-500 text-sm hover:text-brand-600 transition-colors", children: "Forgot password?" })
+        ] }) }),
+        /* @__PURE__ */ e(N, { children: /* @__PURE__ */ e(J, { variant: "primary", type: "submit", className: "w-full text-base font-medium", disabled: m, fullWidth: !0, children: "Log in" }) })
+      ]
+    },
+    f
+  );
+}, Je = ({
+  onLogin: g,
+  logo: y,
+  title: h,
+  subtitle: m,
+  apiConfig: B = {},
+  useDynamicConfig: f = !0,
+  staticConfig: l = null
+}) => {
+  const [O] = ze(), [P, i] = u(null), [R, F] = u(f), [k, U] = u(null), A = Fe(!1), { appLogo: V, appName: r } = Ce(), p = Se(), _ = O.get("token"), K = O.get("request_id"), I = !!(_ && K);
+  Ue(() => {
+    if (A.current)
+      return;
+    const w = sessionStorage.getItem("saml_error");
+    if (w) {
+      A.current = !0, sessionStorage.removeItem("saml_error");
+      try {
+        const C = JSON.parse(w);
+        j.error(C.message, {
+          duration: 5e3
+        });
+      } catch (C) {
+        se.error("Failed to parse SAML error", C);
+      }
+    }
+  }, []);
+  const { authConfig: d, getCustomComponents: o } = he(), c = o(), q = je(d), W = xe(d), $ = Ne(d), G = Pe(d), X = Be(d), le = Ke(d), Z = c?.LoginPage, ae = c?.LoginCard, ee = me(async () => {
+    try {
+      const w = await a.getAuthConfig();
+      i(w), U(null);
+    } catch (w) {
+      se.error("Failed to fetch login methods", w), i({
+        login_methods: {
+          password: {
+            enabled: !0,
+            allowed_usernames: ["email"]
+          },
+          otp: { enabled: !1 },
+          sso: { enabled: !1 },
+          oidc: { enabled: !1 }
+        },
+        password_policy: {
+          min_length: 8,
+          reset: {
+            enabled: !0
+          }
+        },
+        session_policy: {
+          remember_me_enabled: !0,
+          remember_me_duration_days: 30
+        }
+      }), U(null), se.warn("Using default auth configuration due to config fetch failure");
+    } finally {
+      F(!1);
+    }
+  }, []);
+  if (ne(() => {
+    f && !l ? ee() : l && (i(l), F(!1));
+  }, [f, l, ee]), I)
+    return /* @__PURE__ */ e(
+      We,
+      {
+        logo: y,
+        title: h || "Processing Authentication",
+        subtitle: m || "Please wait while we complete your login",
+        onAuthComplete: (w) => {
+          const C = w?.redirect_url || "/app";
+          try {
+            const T = new URL(C, window.location.origin);
+            T.searchParams.delete("token"), T.searchParams.delete("request_id");
+            const z = T.pathname + (T.search ? T.search : "");
+            pe(z);
+          } catch {
+            pe(C);
+          }
+        },
+        roleSelectionTitle: "Select Your Role",
+        roleSelectionSubtitle: "Choose a role to continue",
+        twoFactorTitle: "Two-Factor Authentication",
+        twoFactorSubtitle: "For your security, please verify your identity",
+        passwordResetTitle: "Password Update Required",
+        passwordResetSubtitle: "Please create a new password to continue"
+      }
+    );
+  const re = () => R ? /* @__PURE__ */ e("div", { className: "flex justify-center items-center min-h-loading-min-h", children: /* @__PURE__ */ e(ie, { size: "large", tip: "Loading login methods..." }) }) : k ? /* @__PURE__ */ e(
+    ce,
+    {
+      message: "Error",
+      description: k,
+      type: "error",
+      showIcon: !0,
+      action: /* @__PURE__ */ e("button", { type: "button", onClick: ee, children: "Retry" })
+    }
+  ) : P && f ? /* @__PURE__ */ e(Ve, { onLogin: g }) : /* @__PURE__ */ e(Ye, { onLogin: g });
+  return Z && !_ && !K ? /* @__PURE__ */ e(be.Provider, { value: { onLogin: g || (() => {
+  }) }, children: /* @__PURE__ */ e(Z, {}) }) : ae ? /* @__PURE__ */ e(be.Provider, { value: { onLogin: g || (() => {
+  }) }, children: /* @__PURE__ */ e(Q, { className: "min-h-screen", style: W, children: /* @__PURE__ */ e(Q.Content, { className: "flex justify-center items-center min-h-screen p-5", children: /* @__PURE__ */ e(fe, { className: "w-full max-w-md", bordered: !1, style: q, children: /* @__PURE__ */ e(ae, {}) }) }) }) }) : p ? /* @__PURE__ */ n(Ee, { appName: r, appLogo: typeof y == "string" ? y : V, children: [
+    /* @__PURE__ */ n("div", { className: "text-center mb-[22px]", children: [
+      (() => {
+        const C = (h || "Welcome Back").trim().split(/\s+/), T = C.pop(), z = C.join(" ");
+        return /* @__PURE__ */ n("h1", { className: "mb-2", style: $, children: [
+          z ? `${z} ` : "",
+          /* @__PURE__ */ n("em", { className: "accent", children: [
+            T,
+            "."
+          ] })
+        ] });
+      })(),
+      m && /* @__PURE__ */ e("p", { className: "text-sm", style: G, children: m })
+    ] }),
+    re()
+  ] }) : /* @__PURE__ */ e(Q, { className: "min-h-screen", style: W, children: /* @__PURE__ */ e(Q.Content, { className: "flex justify-center items-center min-h-screen p-5", children: /* @__PURE__ */ n(fe, { className: "w-full max-w-md", bordered: !1, style: q, children: [
+    y && /* @__PURE__ */ e("div", { className: X.className, style: X.style, children: typeof y == "string" ? /* @__PURE__ */ e(
+      "img",
+      {
+        src: y,
+        alt: d?.logo?.alt || "Logo",
+        className: "max-w-logo-max-w h-auto",
+        style: le
+      }
+    ) : y }),
+    /* @__PURE__ */ n("div", { className: "text-center mb-[18px]", children: [
+      /* @__PURE__ */ e("h1", { className: "text-3xl font-semibold mb-2", style: $, children: h || "Welcome Back" }),
+      m && /* @__PURE__ */ e("p", { className: "text-base", style: G, children: m })
+    ] }),
+    re()
+  ] }) }) });
+}, { Content: Ge } = Q, as = ({
+  logo: g,
+  title: y,
+  subtitle: h,
+  apiConfig: m,
+  useDynamicConfig: B = !0,
+  staticConfig: f = null,
+  onLoginSuccess: l,
+  roleSelectionTitle: O,
+  roleSelectionSubtitle: P,
+  initialAuthResult: i = null
+}) => {
+  const { pendingAuth: R, availableRoles: F, login: k, processAuthResult: U } = ue(), [, A] = u(null), V = Se(), { appName: r, appLogo: p } = Ce(), { getCustomComponents: _ } = he(), K = _()?.LoginPage ? "custom" : _()?.LoginCard ? "card" : "default", I = me(
+    async (o) => {
+      A(null);
+      try {
+        if (o && (o.status || o.data || o.next_step || o.response)) {
+          const W = U(o);
+          if (W?.requiresRoleSelection)
+            return;
+          if (W?.autoSelectedRole) {
+            const $ = await a.selectRole(W.autoSelectedRole.id);
+            l && l($);
+            return;
+          }
+          l && l(o);
+          return;
+        }
+        const c = await k(o), q = {
+          email: o.email,
+          username: o.username,
+          phone: o.phone,
+          // Use whichever credential was provided
+          display: o.email || o.username || o.phone
+        };
+        if (c.requiresRoleSelection)
+          return;
+        l && l({ ...c, loginUser: q });
+      } catch (c) {
+        const q = c instanceof Error ? c.message : "Login failed";
+        throw A(q), c;
+      }
+    },
+    [k, U, l]
+  );
+  Me.useEffect(() => {
+    i && I(i);
+  }, [i, I]);
+  const d = async (o) => {
+    try {
+      const c = await a.selectRole(o.id);
+      l && l(c);
+    } catch (c) {
+      throw se.error("Role selection failed", c), c;
+    }
+  };
+  if (R && F) {
+    const o = xe(m || f || {}), c = /* @__PURE__ */ e(
+      $e,
+      {
+        user: R.user,
+        roles: F,
+        onRoleSelect: d,
+        title: O,
+        subtitle: P
+      }
+    );
+    return V ? /* @__PURE__ */ e(Ee, { appName: r, appLogo: typeof g == "string" ? g : p, children: c }) : /* @__PURE__ */ e(Q, { className: "min-h-screen", style: o, children: /* @__PURE__ */ e(Ge, { className: "flex justify-center items-center min-h-screen p-5", children: c }) });
+  }
+  return /* @__PURE__ */ e(
+    Je,
+    {
+      onLogin: I,
+      logo: g,
+      title: y,
+      subtitle: h,
+      apiConfig: m,
+      useDynamicConfig: B,
+      staticConfig: f
+    },
+    K
+  );
+};
+export {
+  as as LoginPageWithRoleSelection
+};
+//# sourceMappingURL=LoginPageWithRoleSelection-xTr_eIWh.js.map