@reblu/site-next 1.6.0 → 1.7.1

package/dist/auth.d.ts

@@ -12,6 +12,9 @@ interface LoginFormCopy {
     magicLinkSubmitCta: string;
     magicLinkSuccessTitle: string;
     magicLinkSuccessMessage: string;
+    /** Countdown line. `{seconds}` is replaced with the seconds remaining. */
+    magicLinkCooldownMessage: string;
+    magicLinkResendCta: string;
     mfaTitle: string;
     mfaMessage: string;
     mfaCodeLabel: string;
@@ -30,6 +33,14 @@ interface LoginFormProps {
     copy?: Partial<LoginFormCopy>;
     className?: string;
     defaultMethod?: 'magic-link' | 'password';
+    /**
+     * Seconds the form refuses to request another magic link after a successful
+     * request. Mirrors Supabase Auth's per-project "minimum interval per user",
+     * which silently drops the second link — see `MAGIC_LINK_COOLDOWN_SECONDS`
+     * for where the authoritative value lives and why this is a mirror. Override
+     * only for a SITE whose Supabase project uses a different interval.
+     */
+    cooldownSeconds?: number;
     onPasswordSubmitted?: (email: string) => void;
     onMagicLinkSubmitted?: (email: string) => void;
     onMfaSubmitted?: () => void;
@@ -59,7 +70,76 @@ interface AuthCallbackProps {
     onError?: (state: 'expired' | 'network' | 'malformed', error?: Error) => void;
     className?: string;
 }
-declare function AuthCallback({ exchangeUrl, loginUrl, copy, onSuccess, onError, className, }: AuthCallbackProps): react_jsx_runtime.JSX.Element;
+declare function AuthCallback({ exchangeUrl, loginUrl, copy, onSuccess, onError, className, }: AuthCallbackProps): react_jsx_runtime.JSX.Element | null;
+
+/**
+ * How long the request form refuses to ask for another magic link (REB-762).
+ *
+ * ## This number is not ours
+ *
+ * The throttle that actually fires is Supabase Auth's per-project **"Minimum
+ * interval per user"** (GoTrue `SMTP_MAX_FREQUENCY`; dashboard →
+ * Authentication → Emails → SMTP settings). A second magic link requested
+ * inside that window is **dropped before any email is sent**, silently — our
+ * route still answers 200, so nothing on the wire says a wait is needed.
+ *
+ * Measured on the Dermamedicin project on 25-Sep-2026: **60 seconds**. The
+ * LOCAL tenant stack sets `max_frequency = "1s"`
+ * (`packages/tenant-db/supabase/config.toml`, `[auth.email]`), so the
+ * authoritative value already differs per environment.
+ *
+ * ## Why it is mirrored rather than read
+ *
+ * It cannot be read at runtime from where it is needed. It lives in the
+ * tenant's Supabase project config, reachable only through the Management API
+ * with a PAT that must never reach a SITE, and our provisioning never writes it
+ * (`patchAuthConfig` sets `site_url`, the redirect allow-list, SMTP relay and
+ * templates — not the interval), so we do not own a copy to read either.
+ *
+ * So this is a **mirror of somebody else's setting, declared exactly once**.
+ * The two CAN diverge: an operator changing the interval on a Supabase project
+ * does not change this constant. When that happens, override it for that SITE
+ * through `LoginForm`'s `cooldownSeconds` prop — do not add a second literal.
+ *
+ * Divergence is not symmetric: a mirror that is too SHORT re-opens the bug (the
+ * user retries into a silent drop), while one that is too LONG only makes an
+ * honest wait a little longer than it had to be.
+ */
+declare const MAGIC_LINK_COOLDOWN_SECONDS = 60;
+
+/**
+ * "A magic link was just requested" — the single fact `LoginForm` and
+ * `AuthCallback` must share (REB-763).
+ *
+ * ## Why an event and not a prop
+ *
+ * A SITE can land on `/auth/callback` with an expired link and re-request from
+ * the form rendered on that same page. `AuthCallback` then holds a verdict
+ * ("Enlace caducado") about a link the user has already replaced, and the
+ * expired notice is the louder of the two messages on screen.
+ *
+ * Both components are published SDK surface and a SITE may render **only one**
+ * of them, so neither may require the other. Lifting the state into the page
+ * would make every consuming SITE write the wiring (and the existing ones would
+ * keep the bug until they did). A DOM event on `window` couples them at zero
+ * API cost: rendering one alone is a dispatch nobody listens to, or a listener
+ * nobody fires. No prop is added to `AuthCallback`, so an already-published
+ * SITE page picks the fix up by upgrading the package alone.
+ *
+ * `window` rather than a module-scoped emitter on purpose: the `./auth` entry
+ * ships both ESM and CJS builds, and a consumer that reaches the two components
+ * through different formats would get two module instances — and a listener
+ * registered on the wrong one. There is exactly one `window`.
+ */
+/** Public event name — stable surface; a SITE may dispatch or observe it. */
+declare const MAGIC_LINK_REQUESTED_EVENT = "reblu:magic-link-requested";
+/** Announce that a magic-link request just succeeded. No-op during SSR. */
+declare function emitMagicLinkRequested(): void;
+/**
+ * Observe magic-link requests. Returns an unsubscribe function, so it plugs
+ * straight into a `useEffect` cleanup. No-op during SSR.
+ */
+declare function onMagicLinkRequested(listener: () => void): () => void;
 
 /**
  * Maps the raw `?error=` query param that Supabase appends when a magic link is
@@ -271,4 +351,4 @@ interface AuthConfirmProps {
  */
 declare function AuthConfirm(props: AuthConfirmProps): react_jsx_runtime.JSX.Element;
 
-export { AuthCallback, type AuthCallbackCopy, type AuthCallbackProps, AuthConfirm, type AuthConfirmCopy, type AuthConfirmProps, AuthLogo, type AuthLogoCopy, type AuthLogoProps, type LoginErrorCopy, type LoginErrorInfo, LoginForm, type LoginFormCopy, type LoginFormProps, ResetPasswordConfirm, type ResetPasswordConfirmCopy, type ResetPasswordConfirmProps, ResetPasswordRequest, type ResetPasswordRequestCopy, type ResetPasswordRequestProps, SetPassword, type SetPasswordCopy, type SetPasswordProps, mapLoginError };
+export { AuthCallback, type AuthCallbackCopy, type AuthCallbackProps, AuthConfirm, type AuthConfirmCopy, type AuthConfirmProps, AuthLogo, type AuthLogoCopy, type AuthLogoProps, type LoginErrorCopy, type LoginErrorInfo, LoginForm, type LoginFormCopy, type LoginFormProps, MAGIC_LINK_COOLDOWN_SECONDS, MAGIC_LINK_REQUESTED_EVENT, ResetPasswordConfirm, type ResetPasswordConfirmCopy, type ResetPasswordConfirmProps, ResetPasswordRequest, type ResetPasswordRequestCopy, type ResetPasswordRequestProps, SetPassword, type SetPasswordCopy, type SetPasswordProps, emitMagicLinkRequested, mapLoginError, onMagicLinkRequested };

package/dist/auth.js

@@ -16,6 +16,27 @@ function isSafeRedirectUrl(url) {
   return ["http", "https"].includes(scheme) || clean.startsWith("/");
 }
 
+// src/auth/magic-link-cooldown.ts
+var MAGIC_LINK_COOLDOWN_SECONDS = 60;
+
+// src/auth/magic-link-events.ts
+var MAGIC_LINK_REQUESTED_EVENT = "reblu:magic-link-requested";
+function emitMagicLinkRequested() {
+  if (typeof window === "undefined") return;
+  window.dispatchEvent(new CustomEvent(MAGIC_LINK_REQUESTED_EVENT));
+}
+function onMagicLinkRequested(listener) {
+  if (typeof window === "undefined") return () => {
+  };
+  const handler = () => {
+    listener();
+  };
+  window.addEventListener(MAGIC_LINK_REQUESTED_EVENT, handler);
+  return () => {
+    window.removeEventListener(MAGIC_LINK_REQUESTED_EVENT, handler);
+  };
+}
+
 // src/auth/login-form.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
 var DEFAULT_COPY = {
@@ -28,8 +49,15 @@ var DEFAULT_COPY = {
   passwordSubmitCta: "Iniciar sesi\xF3n",
   forgotPasswordCta: "\xBFOlvidaste tu contrase\xF1a?",
   magicLinkSubmitCta: "Enviar enlace de acceso",
-  magicLinkSuccessTitle: "\xA1Enlace enviado!",
-  magicLinkSuccessMessage: "Revisa tu correo para acceder.",
+  magicLinkSuccessTitle: "Revisa tu correo",
+  // True in every branch, and leaks nothing: the request path answers an
+  // identical 200 whether or not the account exists, and whether or not an
+  // email actually went out (REB-762). "¡Enlace enviado!" asserted a send that
+  // may never have happened — the user then waited for something that was not
+  // coming.
+  magicLinkSuccessMessage: "Si la cuenta existe, recibir\xE1s un enlace en unos minutos. Si ya lo has pedido hace poco, espera antes de volver a intentarlo.",
+  magicLinkCooldownMessage: "Podr\xE1s pedir otro enlace en {seconds} s.",
+  magicLinkResendCta: "Pedir otro enlace",
   mfaTitle: "Verificaci\xF3n en dos pasos",
   mfaMessage: "Introduce el c\xF3digo de 6 d\xEDgitos de tu aplicaci\xF3n autenticadora.",
   mfaCodeLabel: "C\xF3digo de verificaci\xF3n",
@@ -53,6 +81,7 @@ function LoginForm(props) {
     copy,
     className,
     defaultMethod = "password",
+    cooldownSeconds = MAGIC_LINK_COOLDOWN_SECONDS,
     onPasswordSubmitted,
     onMagicLinkSubmitted,
     onMfaSubmitted
@@ -65,12 +94,37 @@ function LoginForm(props) {
   const [password, setPassword] = React.useState("");
   const [mfa, setMfa] = React.useState(null);
   const [mfaCode, setMfaCode] = React.useState("");
+  const [cooldownLeft, setCooldownLeft] = React.useState(0);
+  const successHeadingRef = React.useRef(null);
+  const magicEmailRef = React.useRef(null);
+  const returningFromSuccessRef = React.useRef(false);
+  const isCoolingDown = cooldownLeft > 0;
+  React.useEffect(() => {
+    if (!isCoolingDown) return;
+    const id = setInterval(() => {
+      setCooldownLeft((s) => Math.max(0, s - 1));
+    }, 1e3);
+    return () => {
+      clearInterval(id);
+    };
+  }, [isCoolingDown]);
+  React.useEffect(() => {
+    if (state === "magic-link-success") successHeadingRef.current?.focus();
+    if (state === "idle" && returningFromSuccessRef.current) {
+      returningFromSuccessRef.current = false;
+      magicEmailRef.current?.focus();
+    }
+  }, [state]);
   const resetTransientState = React.useCallback(() => {
     setState("idle");
     setError(null);
     setMfa(null);
     setMfaCode("");
   }, []);
+  const handleResend = () => {
+    returningFromSuccessRef.current = true;
+    resetTransientState();
+  };
   const handleTabChange = (next) => {
     if (next !== "magic-link" && next !== "password") return;
     setMethod(next);
@@ -95,6 +149,8 @@ function LoginForm(props) {
       });
       if (res.ok) {
         setState("magic-link-success");
+        setCooldownLeft(cooldownSeconds);
+        emitMagicLinkRequested();
         onMagicLinkSubmitted?.(trimmed);
         return;
       }
@@ -237,9 +293,18 @@ function LoginForm(props) {
     ] });
   }
   if (state === "magic-link-success") {
-    return /* @__PURE__ */ jsxs("div", { className: cn("space-y-2 text-center", className), children: [
-      /* @__PURE__ */ jsx("h2", { className: "text-xl font-semibold", children: c.magicLinkSuccessTitle }),
-      /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: c.magicLinkSuccessMessage })
+    return /* @__PURE__ */ jsxs("div", { className: cn("space-y-3 text-center", className), children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-xl font-semibold", ref: successHeadingRef, tabIndex: -1, children: c.magicLinkSuccessTitle }),
+      /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: c.magicLinkSuccessMessage }),
+      /* @__PURE__ */ jsx("div", { role: "status", "aria-live": "polite", className: "sr-only", children: cooldownLeft > 0 ? "" : c.magicLinkResendCta }),
+      cooldownLeft > 0 ? (
+        // A ticking number is VISUAL. Every text mutation inside a live
+        // region is a separate announcement, so marking this one would queue
+        // ~60 polite interruptions; the heading above already took focus and
+        // spoke the new state once. The only transition worth announcing is
+        // the end of the wait, which the region above carries.
+        /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: c.magicLinkCooldownMessage.replaceAll("{seconds}", String(cooldownLeft)) })
+      ) : /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", onClick: handleResend, children: c.magicLinkResendCta })
     ] });
   }
   return /* @__PURE__ */ jsx("div", { className: cn("space-y-6", className), children: /* @__PURE__ */ jsxs(Tabs, { value: method, onValueChange: handleTabChange, children: [
@@ -299,6 +364,7 @@ function LoginForm(props) {
           Input,
           {
             id: "login-email-magic",
+            ref: magicEmailRef,
             type: "email",
             autoComplete: "email",
             placeholder: c.emailPlaceholder,
@@ -319,6 +385,7 @@ function LoginForm(props) {
 import * as React2 from "react";
 import { Button as Button2, cn as cn2 } from "@reblu/site-ui";
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var TERMINAL_FAILURE_STATES = ["expired", "network", "malformed"];
 var DEFAULT_COPY2 = {
   loadingTitle: "Autenticando...",
   loadingMessage: "Estamos verificando tu identidad.",
@@ -430,7 +497,14 @@ function AuthCallback({
     if (state === "network") retryRef.current?.focus();
     if (state === "expired" || state === "malformed") linkRef.current?.focus();
   }, [state]);
+  React2.useEffect(
+    () => onMagicLinkRequested(() => {
+      setState((current) => TERMINAL_FAILURE_STATES.includes(current) ? "stale" : current);
+    }),
+    []
+  );
   const isLoading = state === "mounting" || state === "parsing" || state === "exchanging";
+  if (state === "stale") return null;
   return /* @__PURE__ */ jsx2("main", { className: cn2("flex min-h-screen items-center justify-center", className), children: /* @__PURE__ */ jsxs2("div", { "aria-live": "polite", className: "w-full max-w-md space-y-4 p-6 text-center", children: [
     isLoading && /* @__PURE__ */ jsxs2("section", { children: [
       /* @__PURE__ */ jsx2("h2", { className: "text-xl font-semibold", children: c.loadingTitle }),
@@ -1050,9 +1124,13 @@ export {
   AuthConfirm,
   AuthLogo,
   LoginForm,
+  MAGIC_LINK_COOLDOWN_SECONDS,
+  MAGIC_LINK_REQUESTED_EVENT,
   ResetPasswordConfirm,
   ResetPasswordRequest,
   SetPassword,
-  mapLoginError
+  emitMagicLinkRequested,
+  mapLoginError,
+  onMagicLinkRequested
 };
 //# sourceMappingURL=auth.js.map