@hook-sdk/template 0.12.0 → 0.14.0

package/dist/index.js

@@ -1,7 +1,7 @@
 // src/AppRoot.tsx
 import { useMemo as useMemo3 } from "react";
 import { BrowserRouter, MemoryRouter, Navigate, Route, Routes } from "react-router-dom";
-import { useHook as useHook4 } from "@hook-sdk/sdk";
+import { useHook as useHook5 } from "@hook-sdk/sdk";
 
 // src/config/AppConfigContext.tsx
 import { createContext, useContext } from "react";
@@ -1756,9 +1756,68 @@ function PushPrompt() {
   return null;
 }
 
+// src/internal/SessionExpiredBanner.tsx
+import { useEffect as useEffect5, useRef as useRef2, useState as useState4 } from "react";
+import { useHook as useHook3 } from "@hook-sdk/sdk";
+import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
+var DISMISS_KEY = "hook:session-expired-dismissed-until";
+var DISMISS_TTL_MS = 60 * 60 * 1e3;
+function SessionExpiredBanner() {
+  const { authStatus } = useHook3();
+  const wasAuthRef = useRef2(false);
+  const [show, setShow] = useState4(false);
+  useEffect5(() => {
+    if (authStatus === "authenticated") {
+      wasAuthRef.current = true;
+      setShow(false);
+      return;
+    }
+    if (authStatus === "anonymous" && wasAuthRef.current) {
+      const until = Number(localStorage.getItem(DISMISS_KEY) ?? "0");
+      if (Date.now() < until) {
+        setShow(false);
+        return;
+      }
+      setShow(true);
+    }
+  }, [authStatus]);
+  if (!show) return null;
+  function dismiss() {
+    localStorage.setItem(DISMISS_KEY, String(Date.now() + DISMISS_TTL_MS));
+    setShow(false);
+  }
+  return /* @__PURE__ */ jsxs11("div", { role: "alert", className: "fixed top-0 inset-x-0 bg-red-600 text-white px-4 py-2 flex items-center justify-between gap-3 text-sm shadow", style: { zIndex: 10001 }, children: [
+    /* @__PURE__ */ jsxs11("span", { children: [
+      /* @__PURE__ */ jsx16("strong", { children: "Sua sess\xE3o expirou." }),
+      " Fa\xE7a login novamente para continuar."
+    ] }),
+    /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsx16(
+        "button",
+        {
+          type: "button",
+          onClick: dismiss,
+          className: "px-3 py-1 bg-white text-red-700 rounded text-xs font-medium hover:bg-red-50",
+          children: "Fazer login"
+        }
+      ),
+      /* @__PURE__ */ jsx16(
+        "button",
+        {
+          type: "button",
+          onClick: dismiss,
+          "aria-label": "Fechar",
+          className: "px-2 py-1 text-white/80 hover:text-white text-xs",
+          children: "Fechar"
+        }
+      )
+    ] })
+  ] });
+}
+
 // src/defaults/ErrorBoundary.tsx
 import { Component } from "react";
-import { Fragment as Fragment4, jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
 var ErrorBoundary = class extends Component {
   state = { error: null };
   static getDerivedStateFromError(error) {
@@ -1776,28 +1835,32 @@ var ErrorBoundary = class extends Component {
   }
   render() {
     if (this.state.error) {
-      return this.props.fallback ?? /* @__PURE__ */ jsxs11("div", { role: "alert", style: { padding: 24, textAlign: "center" }, children: [
-        /* @__PURE__ */ jsx16("h2", { children: "Algo deu errado" }),
-        /* @__PURE__ */ jsx16("p", { style: { opacity: 0.7 }, children: "Recarregue a p\xE1gina pra tentar de novo." })
+      return this.props.fallback ?? /* @__PURE__ */ jsxs12("div", { role: "alert", style: { padding: 24, textAlign: "center" }, children: [
+        /* @__PURE__ */ jsx17("h2", { children: "Algo deu errado" }),
+        /* @__PURE__ */ jsx17("p", { style: { opacity: 0.7 }, children: "Recarregue a p\xE1gina pra tentar de novo." })
       ] });
     }
-    return /* @__PURE__ */ jsx16(Fragment4, { children: this.props.children });
+    return /* @__PURE__ */ jsx17(Fragment4, { children: this.props.children });
   }
 };
 
 // src/internal/PaymentReturnHandler.tsx
-import { useCallback as useCallback3, useEffect as useEffect5, useRef as useRef2, useState as useState4 } from "react";
-import { useHook as useHook3 } from "@hook-sdk/sdk";
-import { Fragment as Fragment5, jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
+import { useCallback as useCallback3, useEffect as useEffect6, useRef as useRef3, useState as useState5 } from "react";
+import { useHook as useHook4 } from "@hook-sdk/sdk";
+import { Fragment as Fragment5, jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
 var BACKOFF_MS = [2e3, 5e3, 1e4, 2e4, 4e4];
+var MAX_CYCLES = 3;
+var SUPPORT_MAILTO = "mailto:suporte@usehook.net?subject=Pagamento%20pendente";
 function PaymentReturnHandler({ children }) {
-  const { subscription } = useHook3();
-  const subRef = useRef2(subscription);
+  const { subscription } = useHook4();
+  const subRef = useRef3(subscription);
   subRef.current = subscription;
-  const runIdRef = useRef2(0);
-  const [state, setState] = useState4("idle");
+  const runIdRef = useRef3(0);
+  const cyclesRef = useRef3(0);
+  const [state, setState] = useState5("idle");
   const runPoll = useCallback3(() => {
     const runId = ++runIdRef.current;
+    cyclesRef.current += 1;
     setState("confirming");
     let attempts = 0;
     const tick = async () => {
@@ -1813,37 +1876,88 @@ function PaymentReturnHandler({ children }) {
         const cleanUrl = new URL(window.location.href);
         cleanUrl.searchParams.delete("paymentReturn");
         window.history.replaceState({}, "", cleanUrl.toString());
+        cyclesRef.current = 0;
         setState("idle");
         return;
       }
       const delay = BACKOFF_MS[attempts - 1];
       if (delay === void 0) {
-        setState("waiting");
+        if (cyclesRef.current >= MAX_CYCLES) {
+          setState("timeout");
+        } else {
+          setState("waiting");
+        }
         return;
       }
       setTimeout(tick, delay);
     };
     void tick();
   }, []);
-  useEffect5(() => {
+  useEffect6(() => {
     if (typeof window === "undefined") return;
     const url = new URL(window.location.href);
     if (url.searchParams.get("paymentReturn") !== "1") return;
+    cyclesRef.current = 0;
     runPoll();
     return () => {
       runIdRef.current++;
     };
   }, [runPoll]);
+  const goHome = useCallback3(() => {
+    const cleanUrl = new URL(window.location.href);
+    cleanUrl.searchParams.delete("paymentReturn");
+    cleanUrl.pathname = "/app/home";
+    window.location.href = cleanUrl.toString();
+  }, []);
   if (state === "confirming") {
-    return /* @__PURE__ */ jsx17("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: "Confirmando pagamento\u2026" });
+    return /* @__PURE__ */ jsx18("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: "Confirmando pagamento\u2026" });
   }
   if (state === "waiting") {
-    return /* @__PURE__ */ jsx17("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: /* @__PURE__ */ jsxs12("div", { style: { maxWidth: 320, textAlign: "center", lineHeight: 1.5 }, children: [
-      /* @__PURE__ */ jsx17("div", { style: { marginBottom: 16 }, children: "Pagamento aceito. Estamos confirmando com o banco \u2014 pode levar alguns minutos." }),
-      /* @__PURE__ */ jsx17("button", { type: "button", onClick: runPoll, style: buttonStyle, children: "Atualizar" })
+    return /* @__PURE__ */ jsx18("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: /* @__PURE__ */ jsxs13("div", { style: { maxWidth: 320, textAlign: "center", lineHeight: 1.5 }, children: [
+      /* @__PURE__ */ jsx18("div", { style: { marginBottom: 16 }, children: "Pagamento aceito. Estamos confirmando com o banco \u2014 pode levar alguns minutos." }),
+      /* @__PURE__ */ jsx18("button", { type: "button", onClick: runPoll, style: buttonStyle, children: "Atualizar" })
+    ] }) });
+  }
+  if (state === "timeout") {
+    return /* @__PURE__ */ jsx18("div", { role: "alert", "aria-live": "assertive", style: overlayStyle2, children: /* @__PURE__ */ jsxs13("div", { style: { maxWidth: 360, textAlign: "center", lineHeight: 1.5 }, children: [
+      /* @__PURE__ */ jsx18("div", { style: { marginBottom: 16 }, children: "Ainda n\xE3o conseguimos confirmar seu pagamento com o banco. Voc\xEA pode tentar de novo, voltar pro app, ou falar com a gente." }),
+      /* @__PURE__ */ jsxs13("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
+        /* @__PURE__ */ jsx18(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              cyclesRef.current = 0;
+              runPoll();
+            },
+            style: buttonStyle,
+            "data-testid": "payment-timeout-retry",
+            children: "Tentar de novo"
+          }
+        ),
+        /* @__PURE__ */ jsx18(
+          "button",
+          {
+            type: "button",
+            onClick: goHome,
+            style: secondaryButtonStyle,
+            "data-testid": "payment-timeout-home",
+            children: "Voltar pro app"
+          }
+        ),
+        /* @__PURE__ */ jsx18(
+          "a",
+          {
+            href: SUPPORT_MAILTO,
+            style: linkStyle,
+            "data-testid": "payment-timeout-support",
+            children: "Falar com suporte"
+          }
+        )
+      ] })
     ] }) });
   }
-  return /* @__PURE__ */ jsx17(Fragment5, { children });
+  return /* @__PURE__ */ jsx18(Fragment5, { children });
 }
 var overlayStyle2 = {
   position: "fixed",
@@ -1867,9 +1981,22 @@ var buttonStyle = {
   fontWeight: 600,
   cursor: "pointer"
 };
+var secondaryButtonStyle = {
+  ...buttonStyle,
+  background: "transparent",
+  color: "white",
+  border: "1px solid rgba(255,255,255,0.5)"
+};
+var linkStyle = {
+  color: "white",
+  textDecoration: "underline",
+  fontSize: "0.9rem",
+  marginTop: 4,
+  textAlign: "center"
+};
 
 // src/AppRoot.tsx
-import { Fragment as Fragment6, jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
 function buildLegacyConfigShim(config) {
   const paywall = config.paywall;
   const isFree = paywall.mode === "free";
@@ -1937,9 +2064,10 @@ function AppRoot(props) {
   const Router = testRouter === "memory" ? MemoryRouter : BrowserRouter;
   const basename = `/app/${config.slug}`;
   const routerProps = testRouter === "memory" ? { basename, initialEntries: testInitialEntries } : { basename };
-  return /* @__PURE__ */ jsx18(ErrorBoundary, { children: /* @__PURE__ */ jsx18(AppConfigProvider, { config, children: /* @__PURE__ */ jsx18(TemplateConfigProvider, { config: legacyShim, children: /* @__PURE__ */ jsx18(ThemeProvider, { children: /* @__PURE__ */ jsx18(PersistenceRegistry, { config: config.persistedKeys, children: /* @__PURE__ */ jsxs13(Router, { ...routerProps, children: [
-    /* @__PURE__ */ jsx18(DeepLinkHandler, { deepLinks: config.deepLinks }),
-    /* @__PURE__ */ jsx18(InstallGate, { children: /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx19(ErrorBoundary, { children: /* @__PURE__ */ jsx19(AppConfigProvider, { config, children: /* @__PURE__ */ jsx19(TemplateConfigProvider, { config: legacyShim, children: /* @__PURE__ */ jsx19(ThemeProvider, { children: /* @__PURE__ */ jsx19(PersistenceRegistry, { config: config.persistedKeys, children: /* @__PURE__ */ jsxs14(Router, { ...routerProps, children: [
+    /* @__PURE__ */ jsx19(DeepLinkHandler, { deepLinks: config.deepLinks }),
+    /* @__PURE__ */ jsx19(SessionExpiredBanner, {}),
+    /* @__PURE__ */ jsx19(InstallGate, { children: /* @__PURE__ */ jsx19(
       AuthGated,
       {
         config,
@@ -1951,9 +2079,9 @@ function AppRoot(props) {
         Paywall,
         Onboarding,
         PreAuthFlow,
-        children: /* @__PURE__ */ jsxs13(SubscriptionGate, { Paywall: Paywall ?? FallbackPaywall, children: [
+        children: /* @__PURE__ */ jsxs14(SubscriptionGate, { Paywall: Paywall ?? FallbackPaywall, children: [
           children,
-          /* @__PURE__ */ jsx18(PushPrompt, {})
+          /* @__PURE__ */ jsx19(PushPrompt, {})
         ] })
       }
     ) })
@@ -1969,39 +2097,39 @@ function AuthGated({
   EmailVerify,
   PreAuthFlow
 }) {
-  const { authStatus } = useHook4();
+  const { authStatus } = useHook5();
   if (authStatus === "loading") return null;
   if (authStatus !== "authenticated") {
     if (config.onboarding?.trigger === "pre_signup_custom" && PreAuthFlow) {
-      return /* @__PURE__ */ jsxs13(Routes, { children: [
-        /* @__PURE__ */ jsx18(Route, { path: "/signin", element: /* @__PURE__ */ jsx18(Login, {}) }),
-        /* @__PURE__ */ jsx18(Route, { path: "/signup", element: /* @__PURE__ */ jsx18(Signup, {}) }),
-        /* @__PURE__ */ jsx18(Route, { path: "/forgot", element: /* @__PURE__ */ jsx18(Forgot, {}) }),
-        /* @__PURE__ */ jsx18(Route, { path: "/reset", element: /* @__PURE__ */ jsx18(Reset, {}) }),
-        EmailVerify ? /* @__PURE__ */ jsx18(Route, { path: "/verify", element: /* @__PURE__ */ jsx18(EmailVerify, {}) }) : null,
-        /* @__PURE__ */ jsx18(Route, { path: "/*", element: /* @__PURE__ */ jsx18(PreAuthFlow, {}) })
+      return /* @__PURE__ */ jsxs14(Routes, { children: [
+        /* @__PURE__ */ jsx19(Route, { path: "/signin", element: /* @__PURE__ */ jsx19(Login, {}) }),
+        /* @__PURE__ */ jsx19(Route, { path: "/signup", element: /* @__PURE__ */ jsx19(Signup, {}) }),
+        /* @__PURE__ */ jsx19(Route, { path: "/forgot", element: /* @__PURE__ */ jsx19(Forgot, {}) }),
+        /* @__PURE__ */ jsx19(Route, { path: "/reset", element: /* @__PURE__ */ jsx19(Reset, {}) }),
+        EmailVerify ? /* @__PURE__ */ jsx19(Route, { path: "/verify", element: /* @__PURE__ */ jsx19(EmailVerify, {}) }) : null,
+        /* @__PURE__ */ jsx19(Route, { path: "/*", element: /* @__PURE__ */ jsx19(PreAuthFlow, {}) })
       ] });
     }
-    return /* @__PURE__ */ jsxs13(Routes, { children: [
-      /* @__PURE__ */ jsx18(Route, { path: "/", element: /* @__PURE__ */ jsx18(Login, {}) }),
-      /* @__PURE__ */ jsx18(Route, { path: "/signup", element: /* @__PURE__ */ jsx18(Signup, {}) }),
-      /* @__PURE__ */ jsx18(Route, { path: "/forgot", element: /* @__PURE__ */ jsx18(Forgot, {}) }),
-      /* @__PURE__ */ jsx18(Route, { path: "/reset", element: /* @__PURE__ */ jsx18(Reset, {}) }),
-      EmailVerify ? /* @__PURE__ */ jsx18(Route, { path: "/verify", element: /* @__PURE__ */ jsx18(EmailVerify, {}) }) : null,
-      /* @__PURE__ */ jsx18(Route, { path: "*", element: /* @__PURE__ */ jsx18(Navigate, { to: "/", replace: true }) })
+    return /* @__PURE__ */ jsxs14(Routes, { children: [
+      /* @__PURE__ */ jsx19(Route, { path: "/", element: /* @__PURE__ */ jsx19(Login, {}) }),
+      /* @__PURE__ */ jsx19(Route, { path: "/signup", element: /* @__PURE__ */ jsx19(Signup, {}) }),
+      /* @__PURE__ */ jsx19(Route, { path: "/forgot", element: /* @__PURE__ */ jsx19(Forgot, {}) }),
+      /* @__PURE__ */ jsx19(Route, { path: "/reset", element: /* @__PURE__ */ jsx19(Reset, {}) }),
+      EmailVerify ? /* @__PURE__ */ jsx19(Route, { path: "/verify", element: /* @__PURE__ */ jsx19(EmailVerify, {}) }) : null,
+      /* @__PURE__ */ jsx19(Route, { path: "*", element: /* @__PURE__ */ jsx19(Navigate, { to: "/", replace: true }) })
     ] });
   }
-  return /* @__PURE__ */ jsx18(Fragment6, { children });
+  return /* @__PURE__ */ jsx19(Fragment6, { children });
 }
 function FallbackPaywall() {
   return null;
 }
 
 // src/hooks/usePush.ts
-import { useCallback as useCallback4, useEffect as useEffect6, useState as useState5 } from "react";
-import { useHook as useHook5 } from "@hook-sdk/sdk";
+import { useCallback as useCallback4, useEffect as useEffect7, useState as useState6 } from "react";
+import { useHook as useHook6 } from "@hook-sdk/sdk";
 var DISMISS_STORAGE_KEY = "push:dismissed-until";
-var DISMISS_TTL_MS = 7 * 24 * 60 * 60 * 1e3;
+var DISMISS_TTL_MS2 = 7 * 24 * 60 * 60 * 1e3;
 function detectIosNeedsInstall() {
   if (typeof navigator === "undefined" || typeof window === "undefined") return false;
   const ua = navigator.userAgent || "";
@@ -2043,9 +2171,9 @@ function deriveState(push) {
   return { kind: "prompt" };
 }
 function usePush() {
-  const { push } = useHook5();
-  const [state, setState] = useState5(() => deriveState(push));
-  useEffect6(() => {
+  const { push } = useHook6();
+  const [state, setState] = useState6(() => deriveState(push));
+  useEffect7(() => {
     setState(deriveState(push));
   }, [push]);
   const subscribe = useCallback4(async () => {
@@ -2072,7 +2200,7 @@ function usePush() {
   const dismiss = useCallback4(() => {
     if (typeof localStorage !== "undefined") {
       try {
-        localStorage.setItem(DISMISS_STORAGE_KEY, String(Date.now() + DISMISS_TTL_MS));
+        localStorage.setItem(DISMISS_STORAGE_KEY, String(Date.now() + DISMISS_TTL_MS2));
       } catch {
       }
     }
@@ -2082,7 +2210,7 @@ function usePush() {
 }
 
 // src/components/PushPrompt.tsx
-import { jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs15 } from "react/jsx-runtime";
 function platformRecoveryCopy(texts) {
   if (typeof navigator === "undefined") return null;
   const ua = navigator.userAgent || "";
@@ -2105,28 +2233,28 @@ function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, clas
   const { state, subscribe } = usePush();
   if (state.kind === "subscribed" || state.kind === "dismissed") return null;
   if (state.kind === "ios_needs_install") {
-    return /* @__PURE__ */ jsxs14("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
-      /* @__PURE__ */ jsx19("h3", { children: texts.iosInstallTitle }),
-      /* @__PURE__ */ jsx19("p", { children: texts.iosInstallBody }),
-      onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ jsx19("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
+    return /* @__PURE__ */ jsxs15("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
+      /* @__PURE__ */ jsx20("h3", { children: texts.iosInstallTitle }),
+      /* @__PURE__ */ jsx20("p", { children: texts.iosInstallBody }),
+      onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ jsx20("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
     ] });
   }
   if (state.kind === "denied") {
     const recovery = platformRecoveryCopy(texts);
-    return /* @__PURE__ */ jsxs14("div", { className, role: "region", "aria-label": texts.deniedTitle, children: [
-      /* @__PURE__ */ jsx19("h3", { children: texts.deniedTitle }),
-      /* @__PURE__ */ jsx19("p", { children: texts.deniedBody }),
-      recovery && /* @__PURE__ */ jsx19("p", { "data-testid": "denied-recovery", children: recovery })
+    return /* @__PURE__ */ jsxs15("div", { className, role: "region", "aria-label": texts.deniedTitle, children: [
+      /* @__PURE__ */ jsx20("h3", { children: texts.deniedTitle }),
+      /* @__PURE__ */ jsx20("p", { children: texts.deniedBody }),
+      recovery && /* @__PURE__ */ jsx20("p", { "data-testid": "denied-recovery", children: recovery })
     ] });
   }
   if (state.kind === "unsupported") {
-    return /* @__PURE__ */ jsx19("div", { className, role: "region", children: /* @__PURE__ */ jsx19("p", { children: texts.unsupportedBody }) });
+    return /* @__PURE__ */ jsx20("div", { className, role: "region", children: /* @__PURE__ */ jsx20("p", { children: texts.unsupportedBody }) });
   }
   if (state.kind === "error") {
-    return /* @__PURE__ */ jsx19("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ jsx19("p", { children: state.message }) });
+    return /* @__PURE__ */ jsx20("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ jsx20("p", { children: state.message }) });
   }
-  return /* @__PURE__ */ jsxs14("div", { className, role: "region", children: [
-    /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsxs15("div", { className, role: "region", children: [
+    /* @__PURE__ */ jsx20(
       "button",
       {
         type: "button",
@@ -2140,29 +2268,29 @@ function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, clas
         children: texts.cta
       }
     ),
-    onDeclined && /* @__PURE__ */ jsx19("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
+    onDeclined && /* @__PURE__ */ jsx20("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
   ] });
 }
 
 // src/defaults/LoadingState.tsx
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx21 } from "react/jsx-runtime";
 function LoadingState({ message }) {
-  return /* @__PURE__ */ jsx20("div", { role: "status", "aria-live": "polite", style: { padding: 24, textAlign: "center" }, children: /* @__PURE__ */ jsx20("span", { children: message ?? "Carregando..." }) });
+  return /* @__PURE__ */ jsx21("div", { role: "status", "aria-live": "polite", style: { padding: 24, textAlign: "center" }, children: /* @__PURE__ */ jsx21("span", { children: message ?? "Carregando..." }) });
 }
 
 // src/defaults/EmptyState.tsx
-import { jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs16 } from "react/jsx-runtime";
 function EmptyState({ title, description, action }) {
-  return /* @__PURE__ */ jsxs15("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
-    /* @__PURE__ */ jsx21("h2", { style: { marginBottom: 8 }, children: title }),
-    description && /* @__PURE__ */ jsx21("p", { style: { opacity: 0.7 }, children: description }),
-    action && /* @__PURE__ */ jsx21("div", { style: { marginTop: 16 }, children: action })
+  return /* @__PURE__ */ jsxs16("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
+    /* @__PURE__ */ jsx22("h2", { style: { marginBottom: 8 }, children: title }),
+    description && /* @__PURE__ */ jsx22("p", { style: { opacity: 0.7 }, children: description }),
+    action && /* @__PURE__ */ jsx22("div", { style: { marginTop: 16 }, children: action })
   ] });
 }
 
 // src/hooks/useLoginForm.ts
-import { useCallback as useCallback5, useMemo as useMemo4, useState as useState6 } from "react";
-import { useHook as useHook6 } from "@hook-sdk/sdk";
+import { useCallback as useCallback5, useMemo as useMemo4, useState as useState7 } from "react";
+import { useHook as useHook7 } from "@hook-sdk/sdk";
 
 // src/errors.ts
 import { SdkError, SdkAuthError, SdkRateLimitError } from "@hook-sdk/sdk";
@@ -2197,23 +2325,29 @@ function mapSdkError(err) {
 var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 var MIN_PASSWORD = 8;
 function useLoginForm() {
-  const { auth } = useHook6();
-  const [email, setEmail] = useState6("");
-  const [password, setPassword] = useState6("");
-  const [submitting, setSubmitting] = useState6(false);
-  const [error, setError] = useState6(null);
-  const emailError = useMemo4(() => {
+  const { auth } = useHook7();
+  const [email, setEmail] = useState7("");
+  const [password, setPassword] = useState7("");
+  const [submitting, setSubmitting] = useState7(false);
+  const [error, setError] = useState7(null);
+  const [touchedEmail, setTouchedEmail] = useState7(false);
+  const [touchedPassword, setTouchedPassword] = useState7(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = useState7(false);
+  const validateEmail = useMemo4(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE.test(email)) return "Formato de e-mail inv\xE1lido.";
     return null;
   }, [email]);
-  const passwordError = useMemo4(() => {
+  const validatePassword = useMemo4(() => {
     if (password.length === 0) return null;
     if (password.length < MIN_PASSWORD) return `M\xEDnimo de ${MIN_PASSWORD} caracteres.`;
     return null;
   }, [password]);
-  const canSubmit = email.length > 0 && password.length >= MIN_PASSWORD && emailError === null && passwordError === null && !submitting;
+  const emailError = touchedEmail || formSubmitAttempted ? validateEmail : null;
+  const passwordError = touchedPassword || formSubmitAttempted ? validatePassword : null;
+  const canSubmit = email.length > 0 && password.length >= MIN_PASSWORD && validateEmail === null && validatePassword === null && !submitting;
   const submit = useCallback5(async () => {
+    setFormSubmitAttempted(true);
     if (!canSubmit) return false;
     setSubmitting(true);
     setError(null);
@@ -2231,9 +2365,12 @@ function useLoginForm() {
     email,
     setEmail,
     emailError,
+    markEmailTouched: () => setTouchedEmail(true),
     password,
     setPassword,
     passwordError,
+    markPasswordTouched: () => setTouchedPassword(true),
+    formSubmitAttempted,
     submit,
     submitting,
     canSubmit,
@@ -2243,34 +2380,42 @@ function useLoginForm() {
 }
 
 // src/hooks/useSignupForm.ts
-import { useCallback as useCallback6, useMemo as useMemo5, useState as useState7 } from "react";
-import { useHook as useHook7 } from "@hook-sdk/sdk";
+import { useCallback as useCallback6, useMemo as useMemo5, useState as useState8 } from "react";
+import { useHook as useHook8 } from "@hook-sdk/sdk";
 var EMAIL_RE2 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 var MIN_PASSWORD2 = 8;
 function useSignupForm() {
-  const { auth } = useHook7();
-  const [name, setName] = useState7("");
-  const [email, setEmail] = useState7("");
-  const [password, setPassword] = useState7("");
-  const [submitting, setSubmitting] = useState7(false);
-  const [error, setError] = useState7(null);
-  const nameError = useMemo5(() => {
+  const { auth } = useHook8();
+  const [name, setName] = useState8("");
+  const [email, setEmail] = useState8("");
+  const [password, setPassword] = useState8("");
+  const [submitting, setSubmitting] = useState8(false);
+  const [error, setError] = useState8(null);
+  const [touchedName, setTouchedName] = useState8(false);
+  const [touchedEmail, setTouchedEmail] = useState8(false);
+  const [touchedPassword, setTouchedPassword] = useState8(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = useState8(false);
+  const validateName = useMemo5(() => {
     if (name.length === 0) return null;
     if (name.trim().length < 2) return "Nome muito curto.";
     return null;
   }, [name]);
-  const emailError = useMemo5(() => {
+  const validateEmail = useMemo5(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE2.test(email)) return "Formato de e-mail inv\xE1lido.";
     return null;
   }, [email]);
-  const passwordError = useMemo5(() => {
+  const validatePassword = useMemo5(() => {
     if (password.length === 0) return null;
     if (password.length < MIN_PASSWORD2) return `M\xEDnimo de ${MIN_PASSWORD2} caracteres.`;
     return null;
   }, [password]);
-  const canSubmit = name.trim().length >= 2 && email.length > 0 && password.length >= MIN_PASSWORD2 && nameError === null && emailError === null && passwordError === null && !submitting;
+  const nameError = touchedName || formSubmitAttempted ? validateName : null;
+  const emailError = touchedEmail || formSubmitAttempted ? validateEmail : null;
+  const passwordError = touchedPassword || formSubmitAttempted ? validatePassword : null;
+  const canSubmit = name.trim().length >= 2 && email.length > 0 && password.length >= MIN_PASSWORD2 && validateName === null && validateEmail === null && validatePassword === null && !submitting;
   const submit = useCallback6(async () => {
+    setFormSubmitAttempted(true);
     if (!canSubmit) return false;
     setSubmitting(true);
     setError(null);
@@ -2288,12 +2433,16 @@ function useSignupForm() {
     name,
     setName,
     nameError,
+    markNameTouched: () => setTouchedName(true),
     email,
     setEmail,
     emailError,
+    markEmailTouched: () => setTouchedEmail(true),
     password,
     setPassword,
     passwordError,
+    markPasswordTouched: () => setTouchedPassword(true),
+    formSubmitAttempted,
     submit,
     submitting,
     canSubmit,
@@ -2303,22 +2452,26 @@ function useSignupForm() {
 }
 
 // src/hooks/useForgotForm.ts
-import { useCallback as useCallback7, useMemo as useMemo6, useState as useState8 } from "react";
-import { useHook as useHook8 } from "@hook-sdk/sdk";
+import { useCallback as useCallback7, useMemo as useMemo6, useState as useState9 } from "react";
+import { useHook as useHook9 } from "@hook-sdk/sdk";
 var EMAIL_RE3 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 function useForgotForm() {
-  const { auth } = useHook8();
-  const [email, setEmail] = useState8("");
-  const [submitting, setSubmitting] = useState8(false);
-  const [sent, setSent] = useState8(false);
-  const [error, setError] = useState8(null);
-  const emailError = useMemo6(() => {
+  const { auth } = useHook9();
+  const [email, setEmail] = useState9("");
+  const [submitting, setSubmitting] = useState9(false);
+  const [sent, setSent] = useState9(false);
+  const [error, setError] = useState9(null);
+  const [touchedEmail, setTouchedEmail] = useState9(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = useState9(false);
+  const validateEmail = useMemo6(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE3.test(email)) return "Formato de e-mail inv\xE1lido.";
     return null;
   }, [email]);
-  const canSubmit = email.length > 0 && emailError === null && !submitting;
+  const emailError = touchedEmail || formSubmitAttempted ? validateEmail : null;
+  const canSubmit = email.length > 0 && validateEmail === null && !submitting;
   const submit = useCallback7(async () => {
+    setFormSubmitAttempted(true);
     if (!canSubmit) return false;
     setSubmitting(true);
     setError(null);
@@ -2337,6 +2490,8 @@ function useForgotForm() {
     email,
     setEmail,
     emailError,
+    markEmailTouched: () => setTouchedEmail(true),
+    formSubmitAttempted,
     submit,
     submitting,
     canSubmit,
@@ -2346,35 +2501,41 @@ function useForgotForm() {
 }
 
 // src/hooks/useResetForm.ts
-import { useCallback as useCallback8, useEffect as useEffect7, useMemo as useMemo7, useState as useState9 } from "react";
-import { useHook as useHook9 } from "@hook-sdk/sdk";
+import { useCallback as useCallback8, useEffect as useEffect8, useMemo as useMemo7, useState as useState10 } from "react";
+import { useHook as useHook10 } from "@hook-sdk/sdk";
 var MIN_PASSWORD3 = 12;
 function useResetForm() {
-  const { auth } = useHook9();
-  const [token, setToken] = useState9(null);
-  const [password, setPassword] = useState9("");
-  const [confirm, setConfirm] = useState9("");
-  const [submitting, setSubmitting] = useState9(false);
-  const [done, setDone] = useState9(false);
-  const [error, setError] = useState9(null);
-  useEffect7(() => {
+  const { auth } = useHook10();
+  const [token, setToken] = useState10(null);
+  const [password, setPassword] = useState10("");
+  const [confirm, setConfirm] = useState10("");
+  const [submitting, setSubmitting] = useState10(false);
+  const [done, setDone] = useState10(false);
+  const [error, setError] = useState10(null);
+  const [touchedPassword, setTouchedPassword] = useState10(false);
+  const [touchedConfirm, setTouchedConfirm] = useState10(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = useState10(false);
+  useEffect8(() => {
     if (typeof window === "undefined") return;
     const params = new URLSearchParams(window.location.search);
     const t = params.get("token");
     setToken(t && t.length > 0 ? t : null);
   }, []);
-  const passwordError = useMemo7(() => {
+  const validatePassword = useMemo7(() => {
     if (password.length === 0) return null;
     if (password.length < MIN_PASSWORD3) return `M\xEDnimo de ${MIN_PASSWORD3} caracteres.`;
     return null;
   }, [password]);
-  const confirmError = useMemo7(() => {
+  const validateConfirm = useMemo7(() => {
     if (confirm.length === 0) return null;
     if (confirm !== password) return "Senhas n\xE3o coincidem.";
     return null;
   }, [confirm, password]);
-  const canSubmit = token !== null && password.length >= MIN_PASSWORD3 && confirm === password && passwordError === null && confirmError === null && !submitting && !done;
+  const passwordError = touchedPassword || formSubmitAttempted ? validatePassword : null;
+  const confirmError = touchedConfirm || formSubmitAttempted ? validateConfirm : null;
+  const canSubmit = token !== null && password.length >= MIN_PASSWORD3 && confirm === password && validatePassword === null && validateConfirm === null && !submitting && !done;
   const submit = useCallback8(async () => {
+    setFormSubmitAttempted(true);
     if (!canSubmit || token === null) return;
     setSubmitting(true);
     setError(null);
@@ -2398,9 +2559,12 @@ function useResetForm() {
     password,
     setPassword,
     passwordError,
+    markPasswordTouched: () => setTouchedPassword(true),
     confirm,
     setConfirm,
     confirmError,
+    markConfirmTouched: () => setTouchedConfirm(true),
+    formSubmitAttempted,
     submit,
     submitting,
     canSubmit,
@@ -2410,9 +2574,9 @@ function useResetForm() {
 }
 
 // src/hooks/usePlan.ts
-import { useHook as useHook10 } from "@hook-sdk/sdk";
+import { useHook as useHook11 } from "@hook-sdk/sdk";
 function usePlan() {
-  const { plan } = useHook10();
+  const { plan } = useHook11();
   return plan;
 }
 
@@ -2445,12 +2609,12 @@ function discountPercent(anchorCents, realCents) {
 }
 
 // src/hooks/useAuthPrimitives.ts
-import { useEffect as useEffect8 } from "react";
-import { useHook as useHook11 } from "@hook-sdk/sdk";
+import { useEffect as useEffect9 } from "react";
+import { useHook as useHook12 } from "@hook-sdk/sdk";
 var warned = false;
 function useAuthPrimitives() {
-  const { auth } = useHook11();
-  useEffect8(() => {
+  const { auth } = useHook12();
+  useEffect9(() => {
     if (!warned && process.env.NODE_ENV !== "production") {
       warned = true;
       console.warn(
@@ -2472,9 +2636,9 @@ function useAuthPrimitives() {
 }
 
 // src/hooks/useAuth.ts
-import { useHook as useHook12 } from "@hook-sdk/sdk";
+import { useHook as useHook13 } from "@hook-sdk/sdk";
 function useAuth() {
-  const { user, authStatus, auth } = useHook12();
+  const { user, authStatus, auth } = useHook13();
   return {
     user,
     authStatus,
@@ -2483,22 +2647,22 @@ function useAuth() {
 }
 
 // src/hooks/useSubscription.ts
-import { useHook as useHook13 } from "@hook-sdk/sdk";
+import { useHook as useHook14 } from "@hook-sdk/sdk";
 function useSubscription() {
-  const { subscription } = useHook13();
+  const { subscription } = useHook14();
   return {
     status: subscription.status()
   };
 }
 
 // src/hooks/useReminders.ts
-import { useCallback as useCallback9, useEffect as useEffect9, useState as useState10 } from "react";
-import { useHook as useHook14 } from "@hook-sdk/sdk";
+import { useCallback as useCallback9, useEffect as useEffect10, useState as useState11 } from "react";
+import { useHook as useHook15 } from "@hook-sdk/sdk";
 function useReminders() {
-  const { push } = useHook14();
+  const { push } = useHook15();
   const r = push.reminders;
-  const [reminders, setReminders] = useState10([]);
-  const [loading, setLoading] = useState10(true);
+  const [reminders, setReminders] = useState11([]);
+  const [loading, setLoading] = useState11(true);
   const reload = useCallback9(async () => {
     setLoading(true);
     try {
@@ -2508,7 +2672,7 @@ function useReminders() {
       setLoading(false);
     }
   }, [r]);
-  useEffect9(() => {
+  useEffect10(() => {
     void reload();
   }, [reload]);
   const setReminder = useCallback9(async (input) => {
@@ -2529,9 +2693,9 @@ function useReminders() {
 }
 
 // src/hooks/useToast.ts
-import { useCallback as useCallback10, useState as useState11 } from "react";
+import { useCallback as useCallback10, useState as useState12 } from "react";
 function useToast() {
-  const [items, setItems] = useState11([]);
+  const [items, setItems] = useState12([]);
   const show = useCallback10((message, kind = "info") => {
     const id = `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
     setItems((prev) => [...prev, { id, message, kind }]);
@@ -2547,20 +2711,20 @@ function useToast() {
 
 // src/RouteBoundary.tsx
 import { Routes as Routes2, Route as Route2 } from "react-router-dom";
-import { jsx as jsx22, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs17 } from "react/jsx-runtime";
 function RouteBoundary({ children }) {
-  return /* @__PURE__ */ jsxs16(Routes2, { children: [
+  return /* @__PURE__ */ jsxs17(Routes2, { children: [
     children,
-    /* @__PURE__ */ jsx22(Route2, { path: "*", element: /* @__PURE__ */ jsx22(DefaultNotFound, {}) })
+    /* @__PURE__ */ jsx23(Route2, { path: "*", element: /* @__PURE__ */ jsx23(DefaultNotFound, {}) })
   ] });
 }
 function DefaultNotFound() {
-  return /* @__PURE__ */ jsx22("div", { role: "alert", children: "P\xE1gina n\xE3o encontrada" });
+  return /* @__PURE__ */ jsx23("div", { role: "alert", children: "P\xE1gina n\xE3o encontrada" });
 }
 
 // src/PreAuthShell.tsx
 import { BrowserRouter as BrowserRouter2, MemoryRouter as MemoryRouter2, Routes as Routes3 } from "react-router-dom";
-import { jsx as jsx23 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 function PreAuthShell({
   basename,
   testRouter,
@@ -2568,13 +2732,13 @@ function PreAuthShell({
   children
 }) {
   if (testRouter === "memory") {
-    return /* @__PURE__ */ jsx23(MemoryRouter2, { basename, initialEntries: testInitialEntries, children: /* @__PURE__ */ jsx23(Routes3, { children }) });
+    return /* @__PURE__ */ jsx24(MemoryRouter2, { basename, initialEntries: testInitialEntries, children: /* @__PURE__ */ jsx24(Routes3, { children }) });
   }
-  return /* @__PURE__ */ jsx23(BrowserRouter2, { basename, children: /* @__PURE__ */ jsx23(Routes3, { children }) });
+  return /* @__PURE__ */ jsx24(BrowserRouter2, { basename, children: /* @__PURE__ */ jsx24(Routes3, { children }) });
 }
 
 // src/OnboardingFlow.tsx
-import { useCallback as useCallback11, useMemo as useMemo8, useRef as useRef3 } from "react";
+import { useCallback as useCallback11, useMemo as useMemo8, useRef as useRef4 } from "react";
 import { usePersistedState } from "@hook-sdk/sdk";
 
 // src/hooks/useOnboardingStep.ts
@@ -2591,7 +2755,7 @@ function useOnboardingStep() {
 }
 
 // src/OnboardingFlow.tsx
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { jsx as jsx25 } from "react/jsx-runtime";
 var isFilled = (v) => v != null && v !== "";
 var CURRENT_STEP_FIELD = "currentStep";
 function readPersistedStepIdx(draft) {
@@ -2605,7 +2769,7 @@ function OnboardingFlow({
   persistKey
 }) {
   const [draft, setDraft, status] = usePersistedState(persistKey, {});
-  const draftRef = useRef3(draft);
+  const draftRef = useRef4(draft);
   draftRef.current = draft;
   const idx = readPersistedStepIdx(draft);
   const clampedIdx = Math.min(Math.max(idx, 0), Math.max(steps.length - 1, 0));
@@ -2669,7 +2833,7 @@ function OnboardingFlow({
       `[hook-template] OnboardingFlow: missing screen component for step '${step.id}' (expected key '${step.screen}' in screens prop)`
     );
   }
-  return /* @__PURE__ */ jsx24(OnboardingStepContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx24(Screen, {}) });
+  return /* @__PURE__ */ jsx25(OnboardingStepContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx25(Screen, {}) });
 }
 
 // src/hooks/useFeature.ts