@turinhub/atomix-common-ui 0.4.0 → 0.6.0

package/dist/AuthPanel-Cn_WwmjX.js

@@ -0,0 +1,703 @@
+import { j as e } from "./jsx-runtime-B4hRZ52C.js";
+import { c as y } from "./utils-B6yFEsav.js";
+import { useState as l, useMemo as ge, useEffect as re } from "react";
+import { Layers3 as ce, MessageCircle as oe, Loader2 as Q, ArrowRight as te, UserRound as de, LockKeyhole as ae } from "lucide-react";
+const fe = (s) => /^1[3-9]\d{9}$/.test(s) ? void 0 : "请输入正确的手机号", se = (s, i) => s instanceof Error && s.message ? s.message : typeof s == "string" && s ? s : i, be = (s) => s.replace(/\D/g, "").slice(0, 11), je = (s) => s.length <= 3 ? s : s.length <= 7 ? `${s.slice(0, 3)} ${s.slice(3)}` : `${s.slice(0, 3)} ${s.slice(3, 7)} ${s.slice(7)}`;
+function we({
+  components: s,
+  title: i = "欢迎登录",
+  description: p = "使用账号密码或手机号验证码进入系统",
+  brandIcon: g,
+  defaultMethod: u = "password",
+  enabledMethods: m = ["password", "sms"],
+  error: A,
+  extraActions: k,
+  footer: c,
+  socialProviders: f,
+  className: j,
+  smsCountdownSeconds: w = 60,
+  validatePhone: x = fe,
+  validatePassword: h,
+  onPasswordLogin: v,
+  onSendSmsCode: C,
+  onSmsLogin: F
+}) {
+  const [z, t] = l(
+    m.includes(u) ? u : m[0]
+  ), [r, W] = l(""), [X, Y] = l(), [Z, B] = l(), [R, b] = l(), [$, K] = l(!1), [U, V] = l(!1), [H, E] = l(!1), [D, O] = l(0), I = ge(
+    () => m.filter(
+      (a, d, T) => T.indexOf(a) === d
+    ),
+    [m]
+  ), _ = I.length > 1, S = R || A;
+  if (re(() => {
+    if (D <= 0) return;
+    const a = setTimeout(() => O((d) => d - 1), 1e3);
+    return () => clearTimeout(a);
+  }, [D]), !s)
+    return /* @__PURE__ */ e.jsx("div", { className: "p-4 text-center text-destructive", children: "错误：请通过 components prop 注入 UI 组件" });
+  const { Button: q, Input: M, Label: L, Tabs: n, TabsList: o, TabsTrigger: N, TabsContent: G } = s, P = async (a) => {
+    a.preventDefault();
+    const d = new FormData(a.currentTarget), T = {
+      username: String(d.get("username") || "").trim(),
+      password: String(d.get("password") || "")
+    }, J = !T.username || !T.password ? "请输入账号和密码" : h == null ? void 0 : h(T);
+    if (J) {
+      b(J);
+      return;
+    }
+    try {
+      K(!0), b(void 0), await (v == null ? void 0 : v(T));
+    } catch (ee) {
+      b(se(ee, "登录失败，请稍后重试"));
+    } finally {
+      K(!1);
+    }
+  }, ue = async () => {
+    const a = x(r);
+    if (a) {
+      b(a);
+      return;
+    }
+    try {
+      E(!0), b(void 0);
+      const d = await (C == null ? void 0 : C(r));
+      Y(d == null ? void 0 : d.smsId), B(d == null ? void 0 : d.smsType), O(w);
+    } catch (d) {
+      b(se(d, "发送验证码失败，请稍后重试"));
+    } finally {
+      E(!1);
+    }
+  }, me = async (a) => {
+    a.preventDefault();
+    const d = new FormData(a.currentTarget), T = String(d.get("code") || "").trim(), J = x(r);
+    if (J) {
+      b(J);
+      return;
+    }
+    if (!T) {
+      b("请输入验证码");
+      return;
+    }
+    try {
+      V(!0), b(void 0), await (F == null ? void 0 : F({ phone: r, code: T, smsId: X, smsType: Z }));
+    } catch (ee) {
+      b(se(ee, "验证码错误或已过期"));
+    } finally {
+      V(!1);
+    }
+  }, he = () => /* @__PURE__ */ e.jsxs("div", { className: "mb-7", children: [
+    /* @__PURE__ */ e.jsx("div", { className: "mb-4 flex h-11 w-11 items-center justify-center rounded-lg bg-primary text-primary-foreground shadow-sm ring-1 ring-primary/10", children: g || /* @__PURE__ */ e.jsx(ce, { className: "h-5 w-5" }) }),
+    /* @__PURE__ */ e.jsx("h1", { className: "text-balance text-2xl font-semibold leading-tight", children: i }),
+    p && /* @__PURE__ */ e.jsx("p", { className: "mt-2 text-pretty text-sm leading-6 text-muted-foreground", children: p })
+  ] }), xe = () => f != null && f.length ? /* @__PURE__ */ e.jsx("div", { className: "mb-6 grid gap-2", children: f.map((a) => /* @__PURE__ */ e.jsxs(
+    q,
+    {
+      type: "button",
+      variant: "outline",
+      className: "h-10 w-full",
+      disabled: a.disabled,
+      onClick: a.onClick,
+      children: [
+        a.icon && /* @__PURE__ */ e.jsx("span", { className: "mr-2 inline-flex h-4 w-4 items-center justify-center", children: a.icon }),
+        a.label
+      ]
+    },
+    a.id
+  )) }) : null, ne = () => /* @__PURE__ */ e.jsx("form", { className: "flex flex-col", onSubmit: P, children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ e.jsx(L, { htmlFor: "auth-username", children: "用户名" }),
+      /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ e.jsx(de, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
+        /* @__PURE__ */ e.jsx(
+          M,
+          {
+            id: "auth-username",
+            name: "username",
+            className: "bg-background/80 pl-9 backdrop-blur",
+            placeholder: "请输入用户名",
+            autoComplete: "username",
+            spellCheck: !1,
+            required: !0
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ e.jsx(L, { htmlFor: "auth-password", children: "密码" }),
+      /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ e.jsx(ae, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
+        /* @__PURE__ */ e.jsx(
+          M,
+          {
+            id: "auth-password",
+            name: "password",
+            className: "bg-background/80 pl-9 backdrop-blur",
+            type: "password",
+            placeholder: "请输入密码",
+            autoComplete: "current-password",
+            required: !0
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ e.jsx(
+      q,
+      {
+        type: "submit",
+        className: "mt-4 h-11 w-full",
+        disabled: $,
+        children: $ ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+          /* @__PURE__ */ e.jsx(Q, { className: "mr-2 h-4 w-4 animate-spin" }),
+          "登录中..."
+        ] }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+          "登录",
+          /* @__PURE__ */ e.jsx(te, { className: "ml-2 h-4 w-4" })
+        ] })
+      }
+    )
+  ] }) }), le = () => /* @__PURE__ */ e.jsx("form", { className: "flex flex-col", onSubmit: me, children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ e.jsx(L, { htmlFor: "auth-phone", children: "手机号" }),
+      /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ e.jsxs("div", { className: "relative w-full", children: [
+          /* @__PURE__ */ e.jsx(oe, { className: "pointer-events-none absolute left-3 top-1/2 z-10 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
+          /* @__PURE__ */ e.jsx(
+            M,
+            {
+              id: "auth-phone",
+              name: "phone",
+              className: "bg-background/80 pl-9 backdrop-blur",
+              placeholder: "请输入手机号",
+              value: je(r),
+              onChange: (a) => W(be(a.target.value)),
+              required: !0,
+              maxLength: 13,
+              inputMode: "numeric",
+              autoComplete: "tel",
+              spellCheck: !1
+            }
+          )
+        ] }),
+        /* @__PURE__ */ e.jsx(
+          q,
+          {
+            type: "button",
+            variant: "outline",
+            className: "h-10 w-28 shrink-0 bg-background/70 backdrop-blur hover:bg-background/90",
+            onClick: ue,
+            disabled: !r || H || D > 0,
+            children: H ? /* @__PURE__ */ e.jsx(Q, { className: "h-4 w-4 animate-spin" }) : D > 0 ? `${D}秒` : "发送验证码"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+      /* @__PURE__ */ e.jsx(L, { htmlFor: "auth-code", children: "验证码" }),
+      /* @__PURE__ */ e.jsx(
+        M,
+        {
+          id: "auth-code",
+          name: "code",
+          className: "bg-background/80 backdrop-blur",
+          placeholder: "请输入验证码",
+          inputMode: "numeric",
+          autoComplete: "one-time-code",
+          required: !0
+        }
+      )
+    ] }),
+    /* @__PURE__ */ e.jsx(
+      q,
+      {
+        type: "submit",
+        className: "mt-4 h-11 w-full",
+        disabled: U,
+        children: U ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+          /* @__PURE__ */ e.jsx(Q, { className: "mr-2 h-4 w-4 animate-spin" }),
+          "验证中..."
+        ] }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+          "验证并登录",
+          /* @__PURE__ */ e.jsx(te, { className: "ml-2 h-4 w-4" })
+        ] })
+      }
+    )
+  ] }) }), pe = () => _ ? /* @__PURE__ */ e.jsxs(
+    n,
+    {
+      value: z,
+      onValueChange: (a) => t(a),
+      className: "w-full",
+      children: [
+        /* @__PURE__ */ e.jsxs(o, { className: "mb-6 grid h-11 w-full grid-cols-2 bg-background/60 backdrop-blur", children: [
+          I.includes("password") && /* @__PURE__ */ e.jsx(N, { value: "password", children: "账号密码登录" }),
+          I.includes("sms") && /* @__PURE__ */ e.jsx(N, { value: "sms", children: "手机号登录" })
+        ] }),
+        /* @__PURE__ */ e.jsx(G, { value: "password", children: ne() }),
+        /* @__PURE__ */ e.jsx(G, { value: "sms", children: le() })
+      ]
+    }
+  ) : I[0] === "sms" ? le() : ne();
+  return /* @__PURE__ */ e.jsxs(
+    "div",
+    {
+      className: y(
+        "w-full max-w-[calc(100vw-2rem)] rounded-lg border border-white/45 bg-background/70 p-5 shadow-2xl shadow-slate-950/25 backdrop-blur-md supports-[backdrop-filter]:bg-background/55 md:p-8",
+        j
+      ),
+      children: [
+        he(),
+        xe(),
+        pe(),
+        k && /* @__PURE__ */ e.jsx("div", { className: "mt-5", children: k }),
+        S && /* @__PURE__ */ e.jsx(
+          "div",
+          {
+            className: "mt-4 border-l-2 border-destructive bg-destructive/5 px-4 py-3 text-sm text-destructive",
+            "aria-live": "polite",
+            children: S
+          }
+        ),
+        c && /* @__PURE__ */ e.jsx("div", { className: "mt-6 text-sm text-muted-foreground", children: c })
+      ]
+    }
+  );
+}
+const ve = (s) => /^1[3-9]\d{9}$/.test(s) ? void 0 : "请输入正确的手机号", ie = (s, i) => s instanceof Error && s.message ? s.message : typeof s == "string" && s ? s : i, Ne = (s) => s.replace(/\D/g, "").slice(0, 11), ye = (s) => s.length <= 3 ? s : s.length <= 7 ? `${s.slice(0, 3)} ${s.slice(3)}` : `${s.slice(0, 3)} ${s.slice(3, 7)} ${s.slice(7)}`;
+function ke({
+  components: s,
+  title: i = "创建账号",
+  description: p = "填写账号信息并完成手机号验证",
+  brandIcon: g,
+  requirePhoneVerification: u = !0,
+  requireTermsAccepted: m = !1,
+  termsLabel: A = "我已阅读并同意服务条款",
+  error: k,
+  extraActions: c,
+  footer: f,
+  socialProviders: j,
+  className: w,
+  smsCountdownSeconds: x = 60,
+  validatePhone: h = ve,
+  validatePassword: v,
+  validateRegister: C,
+  onSendSmsCode: F,
+  onRegister: z
+}) {
+  const [t, r] = l(""), [W, X] = l(), [Y, Z] = l(), [B, R] = l(!1), [b, $] = l(), [K, U] = l(!1), [V, H] = l(!1), [E, D] = l(0), O = b || k;
+  if (re(() => {
+    if (E <= 0) return;
+    const n = setTimeout(() => D((o) => o - 1), 1e3);
+    return () => clearTimeout(n);
+  }, [E]), !s)
+    return /* @__PURE__ */ e.jsx("div", { className: "p-4 text-center text-destructive", children: "错误：请通过 components prop 注入 UI 组件" });
+  const { Button: I, Input: _, Label: S } = s, q = async () => {
+    const n = h(t);
+    if (n) {
+      $(n);
+      return;
+    }
+    try {
+      H(!0), $(void 0);
+      const o = await (F == null ? void 0 : F(t));
+      X(o == null ? void 0 : o.smsId), Z(o == null ? void 0 : o.smsType), D(x);
+    } catch (o) {
+      $(ie(o, "发送验证码失败，请稍后重试"));
+    } finally {
+      H(!1);
+    }
+  }, M = async (n) => {
+    n.preventDefault();
+    const o = new FormData(n.currentTarget), N = {
+      username: String(o.get("username") || "").trim(),
+      password: String(o.get("password") || ""),
+      confirmPassword: String(o.get("confirmPassword") || ""),
+      phone: t,
+      code: String(o.get("code") || "").trim(),
+      smsId: W,
+      smsType: Y,
+      termsAccepted: B
+    }, G = !N.username && "请输入用户名" || !N.password && "请输入密码" || N.password !== N.confirmPassword && "两次输入的密码不一致" || u && h(t) || u && !N.code && "请输入验证码" || m && !B && "请先同意服务条款" || (v == null ? void 0 : v(N)) || (C == null ? void 0 : C(N));
+    if (G) {
+      $(G);
+      return;
+    }
+    try {
+      U(!0), $(void 0), await (z == null ? void 0 : z(N));
+    } catch (P) {
+      $(ie(P, "注册失败，请稍后重试"));
+    } finally {
+      U(!1);
+    }
+  }, L = () => j != null && j.length ? /* @__PURE__ */ e.jsx("div", { className: "mb-6 grid gap-2", children: j.map((n) => /* @__PURE__ */ e.jsxs(
+    I,
+    {
+      type: "button",
+      variant: "outline",
+      className: "h-10 w-full",
+      disabled: n.disabled,
+      onClick: n.onClick,
+      children: [
+        n.icon && /* @__PURE__ */ e.jsx("span", { className: "mr-2 inline-flex h-4 w-4 items-center justify-center", children: n.icon }),
+        n.label
+      ]
+    },
+    n.id
+  )) }) : null;
+  return /* @__PURE__ */ e.jsxs(
+    "div",
+    {
+      className: y(
+        "w-full max-w-[calc(100vw-2rem)] rounded-lg border border-white/45 bg-background/70 p-5 shadow-2xl shadow-slate-950/25 backdrop-blur-md supports-[backdrop-filter]:bg-background/55 md:p-8",
+        w
+      ),
+      children: [
+        /* @__PURE__ */ e.jsxs("div", { className: "mb-7", children: [
+          /* @__PURE__ */ e.jsx("div", { className: "mb-4 flex h-11 w-11 items-center justify-center rounded-lg bg-primary text-primary-foreground shadow-sm ring-1 ring-primary/10", children: g || /* @__PURE__ */ e.jsx(ce, { className: "h-5 w-5" }) }),
+          /* @__PURE__ */ e.jsx("h1", { className: "text-balance text-2xl font-semibold leading-tight", children: i }),
+          p && /* @__PURE__ */ e.jsx("p", { className: "mt-2 text-pretty text-sm leading-6 text-muted-foreground", children: p })
+        ] }),
+        L(),
+        /* @__PURE__ */ e.jsx("form", { className: "flex flex-col", onSubmit: M, children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-4", children: [
+          /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ e.jsx(S, { htmlFor: "auth-register-username", children: "用户名" }),
+            /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
+              /* @__PURE__ */ e.jsx(de, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
+              /* @__PURE__ */ e.jsx(
+                _,
+                {
+                  id: "auth-register-username",
+                  name: "username",
+                  className: "bg-background/80 pl-9 backdrop-blur",
+                  placeholder: "请输入用户名",
+                  autoComplete: "username",
+                  spellCheck: !1,
+                  required: !0
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ e.jsx(S, { htmlFor: "auth-register-password", children: "密码" }),
+            /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
+              /* @__PURE__ */ e.jsx(ae, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
+              /* @__PURE__ */ e.jsx(
+                _,
+                {
+                  id: "auth-register-password",
+                  name: "password",
+                  className: "bg-background/80 pl-9 backdrop-blur",
+                  type: "password",
+                  placeholder: "请输入密码",
+                  autoComplete: "new-password",
+                  required: !0
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+            /* @__PURE__ */ e.jsx(S, { htmlFor: "auth-register-confirm-password", children: "确认密码" }),
+            /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
+              /* @__PURE__ */ e.jsx(ae, { className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
+              /* @__PURE__ */ e.jsx(
+                _,
+                {
+                  id: "auth-register-confirm-password",
+                  name: "confirmPassword",
+                  className: "bg-background/80 pl-9 backdrop-blur",
+                  type: "password",
+                  placeholder: "请再次输入密码",
+                  autoComplete: "new-password",
+                  required: !0
+                }
+              )
+            ] })
+          ] }),
+          u && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+            /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+              /* @__PURE__ */ e.jsx(S, { htmlFor: "auth-register-phone", children: "手机号" }),
+              /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2", children: [
+                /* @__PURE__ */ e.jsxs("div", { className: "relative w-full", children: [
+                  /* @__PURE__ */ e.jsx(oe, { className: "pointer-events-none absolute left-3 top-1/2 z-10 h-4 w-4 -translate-y-1/2 text-muted-foreground" }),
+                  /* @__PURE__ */ e.jsx(
+                    _,
+                    {
+                      id: "auth-register-phone",
+                      name: "phone",
+                      className: "bg-background/80 pl-9 backdrop-blur",
+                      placeholder: "请输入手机号",
+                      value: ye(t),
+                      onChange: (n) => r(Ne(n.target.value)),
+                      required: !0,
+                      maxLength: 13,
+                      inputMode: "numeric",
+                      autoComplete: "tel",
+                      spellCheck: !1
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ e.jsx(
+                  I,
+                  {
+                    type: "button",
+                    variant: "outline",
+                    className: "h-10 w-28 shrink-0 bg-background/70 backdrop-blur hover:bg-background/90",
+                    onClick: q,
+                    disabled: !t || V || E > 0,
+                    children: V ? /* @__PURE__ */ e.jsx(Q, { className: "h-4 w-4 animate-spin" }) : E > 0 ? `${E}秒` : "发送验证码"
+                  }
+                )
+              ] })
+            ] }),
+            /* @__PURE__ */ e.jsxs("div", { className: "space-y-2", children: [
+              /* @__PURE__ */ e.jsx(S, { htmlFor: "auth-register-code", children: "验证码" }),
+              /* @__PURE__ */ e.jsx(
+                _,
+                {
+                  id: "auth-register-code",
+                  name: "code",
+                  className: "bg-background/80 backdrop-blur",
+                  placeholder: "请输入验证码",
+                  inputMode: "numeric",
+                  autoComplete: "one-time-code",
+                  required: !0
+                }
+              )
+            ] })
+          ] }),
+          m && /* @__PURE__ */ e.jsxs("label", { className: "flex items-start gap-2 text-sm text-muted-foreground", children: [
+            /* @__PURE__ */ e.jsx(
+              "input",
+              {
+                type: "checkbox",
+                className: "mt-0.5 h-4 w-4 rounded border-input focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background",
+                checked: B,
+                onChange: (n) => R(n.target.checked)
+              }
+            ),
+            /* @__PURE__ */ e.jsx("span", { children: A })
+          ] }),
+          /* @__PURE__ */ e.jsx(
+            I,
+            {
+              type: "submit",
+              className: "mt-4 h-11 w-full",
+              disabled: K,
+              children: K ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+                /* @__PURE__ */ e.jsx(Q, { className: "mr-2 h-4 w-4 animate-spin" }),
+                "注册中..."
+              ] }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+                "创建账号",
+                /* @__PURE__ */ e.jsx(te, { className: "ml-2 h-4 w-4" })
+              ] })
+            }
+          )
+        ] }) }),
+        c && /* @__PURE__ */ e.jsx("div", { className: "mt-5", children: c }),
+        O && /* @__PURE__ */ e.jsx(
+          "div",
+          {
+            className: "mt-4 border-l-2 border-destructive bg-destructive/5 px-4 py-3 text-sm text-destructive",
+            "aria-live": "polite",
+            children: O
+          }
+        ),
+        f && /* @__PURE__ */ e.jsx("div", { className: "mt-6 text-sm text-muted-foreground", children: f })
+      ]
+    }
+  );
+}
+function Ee({
+  children: s,
+  visual: i,
+  overlay: p,
+  className: g,
+  contentClassName: u,
+  panelClassName: m
+}) {
+  return /* @__PURE__ */ e.jsx("div", { className: y("min-h-screen", g), children: /* @__PURE__ */ e.jsxs("main", { className: "relative flex min-h-screen w-full overflow-hidden", children: [
+    i && /* @__PURE__ */ e.jsx("div", { className: "absolute inset-0", children: i }),
+    p ?? /* @__PURE__ */ e.jsx("div", { className: "absolute inset-0 z-10 bg-black/35" }),
+    /* @__PURE__ */ e.jsx(
+      "div",
+      {
+        className: y(
+          "relative z-20 flex min-h-screen w-full items-center justify-center px-4 py-6 sm:px-6 lg:p-12 xl:p-16",
+          u
+        ),
+        children: /* @__PURE__ */ e.jsx("div", { className: y("w-full min-w-0 max-w-[420px]", m), children: s })
+      }
+    )
+  ] }) });
+}
+function De({
+  items: s,
+  intervalMs: i = 5e3,
+  showIndicators: p = !0,
+  showText: g = !0,
+  className: u,
+  imageClassName: m,
+  contentClassName: A,
+  ariaLabel: k = "认证页视觉轮播"
+}) {
+  const [c, f] = l(0), [j, w] = l(!1), x = s.length > 0, h = x ? s[c] : void 0, v = (t) => {
+    x && f((t + s.length) % s.length);
+  }, C = () => v(c + 1), F = () => v(c - 1);
+  re(() => {
+    if (!x || j || i <= 0 || s.length < 2) return;
+    const t = setTimeout(() => {
+      f((r) => (r + 1) % s.length);
+    }, i);
+    return () => clearTimeout(t);
+  }, [x, i, j, s.length, c]);
+  const z = (t) => {
+    t.key === "ArrowLeft" && (t.preventDefault(), F()), t.key === "ArrowRight" && (t.preventDefault(), C());
+  };
+  return x ? /* @__PURE__ */ e.jsxs(
+    "div",
+    {
+      className: y(
+        "relative h-full min-h-[360px] w-full overflow-hidden bg-slate-950 outline-none focus-visible:ring-2 focus-visible:ring-white/80 focus-visible:ring-offset-2 focus-visible:ring-offset-slate-950",
+        u
+      ),
+      tabIndex: 0,
+      "aria-label": k,
+      role: "region",
+      onKeyDown: z,
+      onMouseEnter: () => w(!0),
+      onMouseLeave: () => w(!1),
+      onFocus: () => w(!0),
+      onBlur: () => w(!1),
+      children: [
+        s.map((t, r) => /* @__PURE__ */ e.jsx(
+          "img",
+          {
+            src: t.image,
+            alt: t.alt,
+            width: t.width ?? 1600,
+            height: t.height ?? 900,
+            fetchPriority: r === c ? "high" : "auto",
+            loading: r === 0 ? "eager" : "lazy",
+            decoding: "async",
+            className: y(
+              "absolute inset-0 h-full w-full object-cover transition-opacity duration-700 ease-out motion-reduce:transition-none",
+              r === c ? "opacity-100" : "opacity-0",
+              m
+            ),
+            "aria-hidden": r !== c
+          },
+          `${t.image}-${r}`
+        )),
+        /* @__PURE__ */ e.jsx("div", { className: "absolute inset-0 bg-gradient-to-r from-slate-950/80 via-slate-950/30 to-slate-950/10" }),
+        /* @__PURE__ */ e.jsx("div", { className: "absolute inset-x-0 bottom-0 bg-gradient-to-t from-slate-950/80 via-slate-950/30 to-transparent pb-16 pt-24" }),
+        /* @__PURE__ */ e.jsx(
+          "div",
+          {
+            className: "pointer-events-none absolute inset-0 opacity-[0.18] [background-image:linear-gradient(to_right,rgba(255,255,255,0.32)_1px,transparent_1px),linear-gradient(to_bottom,rgba(255,255,255,0.26)_1px,transparent_1px)] [background-size:44px_44px]",
+            "aria-hidden": "true"
+          }
+        ),
+        /* @__PURE__ */ e.jsx(
+          "div",
+          {
+            className: "pointer-events-none absolute inset-x-0 top-0 h-px bg-gradient-to-r from-transparent via-white/60 to-transparent",
+            "aria-hidden": "true"
+          }
+        ),
+        (g || p) && /* @__PURE__ */ e.jsxs(
+          "div",
+          {
+            className: y(
+              "absolute inset-x-5 bottom-6 text-white sm:inset-x-8 sm:bottom-8 lg:inset-x-12 lg:bottom-10",
+              A
+            ),
+            children: [
+              g && h && /* @__PURE__ */ e.jsxs("div", { className: "max-w-[min(28rem,calc(100vw-2.5rem))]", children: [
+                h.eyebrow && /* @__PURE__ */ e.jsx("p", { className: "mb-2 text-[0.68rem] font-medium uppercase tracking-normal text-cyan-100/80 sm:text-xs", children: h.eyebrow }),
+                h.title && /* @__PURE__ */ e.jsx("h2", { className: "text-balance text-xl font-semibold leading-tight sm:text-2xl lg:text-3xl", children: h.title }),
+                h.description && /* @__PURE__ */ e.jsx("p", { className: "mt-2 line-clamp-3 text-sm leading-6 text-slate-100/80 sm:text-base", children: h.description })
+              ] }),
+              p && s.length > 1 && /* @__PURE__ */ e.jsx("div", { className: "mt-5 flex items-center gap-2", children: s.map((t, r) => /* @__PURE__ */ e.jsx(
+                "button",
+                {
+                  type: "button",
+                  className: y(
+                    "h-1.5 rounded-full transition-[background-color,width] duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-offset-2 focus-visible:ring-offset-slate-950 motion-reduce:transition-none",
+                    r === c ? "w-8 bg-white" : "w-3 bg-white/40 hover:bg-white/70"
+                  ),
+                  "aria-label": `切换到第 ${r + 1} 张轮播图`,
+                  "aria-current": r === c,
+                  onClick: () => v(r)
+                },
+                `${t.image}-indicator-${r}`
+              )) })
+            ]
+          }
+        )
+      ]
+    }
+  ) : /* @__PURE__ */ e.jsx(
+    "div",
+    {
+      className: y(
+        "relative h-full min-h-[360px] w-full overflow-hidden bg-slate-950",
+        u
+      ),
+      "aria-label": k,
+      role: "region"
+    }
+  );
+}
+function Ie({
+  components: s,
+  mode: i,
+  defaultMode: p = "login",
+  onModeChange: g,
+  loginProps: u,
+  registerProps: m,
+  loginLabel: A = "已有账号？登录",
+  registerLabel: k = "没有账号？注册"
+}) {
+  const [c, f] = l(p), j = i ?? c, w = (x) => {
+    i || f(x), g == null || g(x);
+  };
+  return j === "register" ? /* @__PURE__ */ e.jsx(
+    ke,
+    {
+      ...m,
+      components: s,
+      footer: (m == null ? void 0 : m.footer) ?? /* @__PURE__ */ e.jsx(
+        "button",
+        {
+          type: "button",
+          className: "text-primary underline-offset-4 hover:underline",
+          onClick: () => w("login"),
+          children: A
+        }
+      )
+    }
+  ) : /* @__PURE__ */ e.jsx(
+    we,
+    {
+      ...u,
+      components: s,
+      footer: (u == null ? void 0 : u.footer) ?? /* @__PURE__ */ e.jsx(
+        "button",
+        {
+          type: "button",
+          className: "text-primary underline-offset-4 hover:underline",
+          onClick: () => w("register"),
+          children: k
+        }
+      )
+    }
+  );
+}
+export {
+  we as A,
+  Ee as a,
+  Ie as b,
+  ke as c,
+  De as d
+};
+//# sourceMappingURL=AuthPanel-Cn_WwmjX.js.map