import { jsxs as r, jsx as e } from "react/jsx-runtime";
import { Loader2 as p, LogIn as d } from "lucide-react";
import { Fragment as f } from "react";
import { ArcadeGrid as g } from "../../../assets/images/arcade-grid.js";
import { Button as A } from "../atoms/button.js";
import { ArcadeLogo as b } from "../atoms/icons/arcade-logo.js";
import { AuthTemplate as T, AuthTemplateVideoBackground as v, AuthTemplateLogo as y, AuthTemplateCard as L, AuthTemplateHeader as N, AuthTemplateTitle as x, AuthTemplateDescription as k, AuthTemplateContent as z, AuthTemplateFooter as w, AuthTemplatePrompt as P, AuthTemplatePromptLink as _, AuthTemplateLegal as B, AuthTemplateLegalLink as C } from "../templates/auth-template.js";
import { cn as s } from "../../../lib/utils.js";
import { PUBLIC_VIDEO_URL as D } from "../../../metadata/constants.js";
const I = `${D}/A_L_Orange_Pink.mp4`;
function F({ isLoading: t }) {
  return t ? /* @__PURE__ */ e(p, { className: "size-5 animate-spin" }) : /* @__PURE__ */ e(d, { className: "size-5" });
}
function j({
  termsHref: t,
  privacyHref: o
}) {
  const i = [
    t && { href: t, label: "Terms of Service" },
    o && { href: o, label: "Privacy Policy" }
  ].filter((a) => !!a);
  return i.length === 0 ? null : /* @__PURE__ */ r(B, { children: [
    "By continuing, you agree to the",
    " ",
    i.map((a, n) => /* @__PURE__ */ r(f, { children: [
      n > 0 && /* @__PURE__ */ e("span", { children: " and " }),
      /* @__PURE__ */ e(C, { href: a.href, children: a.label })
    ] }, a.href))
  ] });
}
function q({
  isLoading: t = !1,
  loadingText: o = "Authenticating...",
  onSubmit: i,
  privacyHref: a,
  registerHref: n,
  submitText: m = "Sign in with Arcade",
  termsHref: l,
  videoSrc: c = I
}) {
  const h = t ? o : m, u = n || l || a;
  return /* @__PURE__ */ r(T, { children: [
    /* @__PURE__ */ e("div", { className: "absolute -inset-4 z-0 bg-gradient-to-br from-rose-500/70 via-pink-400/50 to-amber-500/70 opacity-60 blur-lg brightness-50" }),
    c && /* @__PURE__ */ e(v, { src: c }),
    /* @__PURE__ */ e("div", { className: "absolute inset-0 z-1 opacity-[0.01]", children: /* @__PURE__ */ e(g, { className: "size-full", fill: "currentColor" }) }),
    /* @__PURE__ */ e(y, { children: /* @__PURE__ */ e(b, { className: "h-12 w-auto text-zinc-900 dark:text-white" }) }),
    /* @__PURE__ */ r(L, { children: [
      /* @__PURE__ */ r(N, { children: [
        /* @__PURE__ */ e(x, { children: "Welcome back" }),
        /* @__PURE__ */ e(k, { children: "Sign in with your Arcade account to continue" })
      ] }),
      /* @__PURE__ */ e(z, { children: /* @__PURE__ */ r(
        A,
        {
          className: s(
            "group relative h-12 w-full overflow-hidden text-base transition-all duration-300",
            "hover:scale-[1.01] hover:shadow-md hover:brightness-105 active:scale-[0.99]"
          ),
          disabled: t,
          onClick: i,
          size: "lg",
          children: [
            /* @__PURE__ */ r("span", { className: "relative z-10 flex items-center justify-center gap-2", children: [
              /* @__PURE__ */ e(F, { isLoading: t }),
              h
            ] }),
            /* @__PURE__ */ e(
              "div",
              {
                className: s(
                  "absolute inset-0 bg-gradient-to-r from-primary/5 via-primary/0 to-primary/5 transition-opacity duration-300 group-hover:opacity-100",
                  t ? "pointer-events-none opacity-0" : "opacity-0"
                )
              }
            )
          ]
        }
      ) }),
      u && /* @__PURE__ */ r(w, { children: [
        n && /* @__PURE__ */ r(P, { children: [
          /* @__PURE__ */ e("span", { className: "text-muted-foreground text-sm", children: "Don't have an account?" }),
          " ",
          /* @__PURE__ */ e(_, { href: n, children: "Register" })
        ] }),
        /* @__PURE__ */ e(j, { privacyHref: a, termsHref: l })
      ] })
    ] })
  ] });
}
export {
  q as LoginPage
};
