@hook-sdk/template 0.13.0 → 0.14.1

package/dist/index.cjs

@@ -147,7 +147,11 @@ var DeepLinksSchema = import_zod.z.object({
 var AppConfigSchema = import_zod.z.object({
   slug: import_zod.z.string().regex(/^[a-z0-9-]+$/),
   name: import_zod.z.string().min(1),
-  branding: import_zod.z.object({ primaryColor: import_zod.z.string(), logoUrl: import_zod.z.string().url() }),
+  branding: import_zod.z.object({
+    primaryColor: import_zod.z.string(),
+    logoUrl: import_zod.z.string().url(),
+    iconUrl: import_zod.z.string().url().optional()
+  }),
   authFlow: AuthFlowSchema,
   paywall: PaywallSchema,
   persistedKeys: import_zod.z.array(PersistedKeySchema),
@@ -567,6 +571,7 @@ var import_react8 = require("react");
 
 // src/hooks/useInstallPrompt.ts
 var import_react6 = require("react");
+var ANDROID_PROMPT_WAIT_MS = 3e3;
 var IOS_RE = /iPad|iPhone|iPod/;
 var IOS_NON_SAFARI_RE = /CriOS|FxiOS|EdgiOS/;
 var ANDROID_RE = /Android/;
@@ -636,11 +641,12 @@ function track(event, props) {
   if (typeof window === "undefined") return;
   window.posthog?.capture?.(event, props);
 }
-function pickVariant(state) {
+function pickVariant(state, promptWaitElapsed) {
   if (state.isInstalled) return "none";
   switch (state.platform) {
     case "android":
-      return state.isInstallable ? "android-native" : "android-manual";
+      if (state.isInstallable) return "android-native";
+      return promptWaitElapsed ? "android-manual" : "android-pending";
     case "ios-safari":
       return "ios-safari";
     case "ios-other":
@@ -710,6 +716,15 @@ function useInstallPrompt(slug) {
   const [isDismissedSession, setIsDismissedSession] = (0, import_react6.useState)(() => readSessionSkip(slug));
   const [isDismissedPermanent, setIsDismissedPermanent] = (0, import_react6.useState)(() => readPermanentDismiss(slug).dismissed);
   const [skipCount, setSkipCount] = (0, import_react6.useState)(() => readSkipCount(slug));
+  const [promptWaitElapsed, setPromptWaitElapsed] = (0, import_react6.useState)(() => {
+    if (typeof window === "undefined") return true;
+    return window.__pwaInstallPrompt != null;
+  });
+  (0, import_react6.useEffect)(() => {
+    if (promptWaitElapsed) return;
+    const id = setTimeout(() => setPromptWaitElapsed(true), ANDROID_PROMPT_WAIT_MS);
+    return () => clearTimeout(id);
+  }, [promptWaitElapsed]);
   (0, import_react6.useEffect)(() => {
     if (typeof window === "undefined") return;
     if (window.__pwaInstallPrompt) {
@@ -747,17 +762,20 @@ function useInstallPrompt(slug) {
     mq.addEventListener?.("change", handler);
     return () => mq.removeEventListener?.("change", handler);
   }, [slug]);
-  const variant = pickVariant({
-    platform,
-    iosBrowser,
-    androidBrowser,
-    inAppApp,
-    isInstallable,
-    isInstalled,
-    isDismissedSession,
-    isDismissedPermanent,
-    skipCount
-  });
+  const variant = pickVariant(
+    {
+      platform,
+      iosBrowser,
+      androidBrowser,
+      inAppApp,
+      isInstallable,
+      isInstalled,
+      isDismissedSession,
+      isDismissedPermanent,
+      skipCount
+    },
+    promptWaitElapsed
+  );
   const promptInstall = (0, import_react6.useCallback)(async () => {
     if (typeof window === "undefined") return false;
     const prompt = window.__pwaInstallPrompt;
@@ -1293,15 +1311,51 @@ function Step({ n, icon, children }) {
   );
 }
 
-// src/components/InstallGate/Step.tsx
+// src/components/InstallGate/variants/AndroidPendingVariant.tsx
 var import_jsx_runtime10 = require("react/jsx-runtime");
+function AndroidPendingVariant() {
+  const copy = INSTALL_COPY.android.native;
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(InstallSplash, { title: copy.title, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        alignItems: "center",
+        gap: 16,
+        padding: "24px 0"
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Spinner, {})
+    }
+  ) });
+}
+function Spinner() {
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    "div",
+    {
+      "aria-hidden": true,
+      style: {
+        width: 28,
+        height: 28,
+        borderRadius: "50%",
+        border: "3px solid #e5e5e7",
+        borderTopColor: "var(--hook-color-primary)",
+        animation: "hook-install-spin 0.8s linear infinite"
+      },
+      children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("style", { children: `@keyframes hook-install-spin { to { transform: rotate(360deg); } }` })
+    }
+  );
+}
+
+// src/components/InstallGate/Step.tsx
+var import_jsx_runtime11 = require("react/jsx-runtime");
 function Step2({
   n,
   title,
   subtitle,
   visual
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
     "div",
     {
       style: {
@@ -1312,7 +1366,7 @@ function Step2({
         textAlign: "left"
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
           "div",
           {
             style: {
@@ -1331,9 +1385,9 @@ function Step2({
             children: n
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { style: { flex: 1 }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { style: { margin: 0, fontSize: 15, fontWeight: 500, color: "#111", lineHeight: 1.3 }, children: title }),
-          subtitle && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { style: { margin: "4px 0 0 0", fontSize: 13, color: "#777" }, children: subtitle }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: { flex: 1 }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { style: { margin: 0, fontSize: 15, fontWeight: 500, color: "#111", lineHeight: 1.3 }, children: title }),
+          subtitle && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { style: { margin: "4px 0 0 0", fontSize: 13, color: "#777" }, children: subtitle }),
           visual
         ] })
       ]
@@ -1342,21 +1396,21 @@ function Step2({
 }
 
 // src/components/InstallGate/variants/IOSafariVariant.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 function IOSafariVariant({
   state,
   actions
 }) {
   const copy = INSTALL_COPY.iosSafari;
   const showPermanent = shouldShowPermanentOption(state);
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(InstallSplash, { title: copy.title, subtitle: copy.subtitle, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(InstallSplash, { title: copy.title, subtitle: copy.subtitle, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       Step2,
       {
         n: 1,
         title: copy.step1.title,
         subtitle: copy.step1.subtitle,
-        visual: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+        visual: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
           "div",
           {
             style: {
@@ -1368,17 +1422,17 @@ function IOSafariVariant({
               padding: "12px 0",
               marginTop: 8
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ShareIconIOS, { size: 32, style: { color: "var(--hook-color-primary)" } })
+            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ShareIconIOS, { size: 32, style: { color: "var(--hook-color-primary)" } })
           }
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       Step2,
       {
         n: 2,
         title: copy.step2.title,
-        visual: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+        visual: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
           "div",
           {
             style: {
@@ -1391,19 +1445,19 @@ function IOSafariVariant({
               marginTop: 8
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SquarePlusIcon, { size: 22, style: { color: "#555" } }),
-              /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { style: { fontSize: 14, color: "#333" }, children: copy.step2.iconLabel })
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SquarePlusIcon, { size: 22, style: { color: "#555" } }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: { fontSize: 14, color: "#333" }, children: copy.step2.iconLabel })
             ]
           }
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       Step2,
       {
         n: 3,
         title: copy.step3.title,
-        visual: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+        visual: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
           "div",
           {
             style: {
@@ -1414,7 +1468,7 @@ function IOSafariVariant({
               padding: "10px 14px",
               marginTop: 8
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
               "span",
               {
                 style: {
@@ -1429,7 +1483,7 @@ function IOSafariVariant({
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       "button",
       {
         "data-testid": "install-prompt-skip-session",
@@ -1439,7 +1493,7 @@ function IOSafariVariant({
         children: copy.skip
       }
     ),
-    showPermanent && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    showPermanent && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       "button",
       {
         "data-testid": "install-prompt-skip-permanent",
@@ -1453,21 +1507,21 @@ function IOSafariVariant({
 }
 
 // src/components/InstallGate/variants/IOSOtherVariant.tsx
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 function IOSOtherVariant({
   state,
   actions
 }) {
   const copy = INSTALL_COPY.iosOther;
   const showPermanent = shouldShowPermanentOption(state);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(InstallSplash, { title: copy.title, subtitle: copy.subtitle, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(InstallSplash, { title: copy.title, subtitle: copy.subtitle, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Step2,
       {
         n: 1,
         title: copy.step1.title,
         subtitle: copy.step1.subtitle,
-        visual: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        visual: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
           "div",
           {
             style: {
@@ -1479,17 +1533,17 @@ function IOSOtherVariant({
               padding: "12px 0",
               marginTop: 8
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ShareIconIOS, { size: 32, style: { color: "var(--hook-color-primary)" } })
+            children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ShareIconIOS, { size: 32, style: { color: "var(--hook-color-primary)" } })
           }
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Step2,
       {
         n: 2,
         title: copy.step2.title,
-        visual: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+        visual: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
           "div",
           {
             style: {
@@ -1502,19 +1556,19 @@ function IOSOtherVariant({
               marginTop: 8
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SquarePlusIcon, { size: 22, style: { color: "#555" } }),
-              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { style: { fontSize: 14, color: "#333" }, children: copy.step2.iconLabel })
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SquarePlusIcon, { size: 22, style: { color: "#555" } }),
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { style: { fontSize: 14, color: "#333" }, children: copy.step2.iconLabel })
             ]
           }
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       Step2,
       {
         n: 3,
         title: copy.step3.title,
-        visual: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        visual: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
           "div",
           {
             style: {
@@ -1525,7 +1579,7 @@ function IOSOtherVariant({
               padding: "10px 14px",
               marginTop: 8
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
               "span",
               {
                 style: {
@@ -1540,7 +1594,7 @@ function IOSOtherVariant({
         )
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       "button",
       {
         "data-testid": "install-prompt-skip-session",
@@ -1550,7 +1604,7 @@ function IOSOtherVariant({
         children: copy.skip
       }
     ),
-    showPermanent && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    showPermanent && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       "button",
       {
         "data-testid": "install-prompt-skip-permanent",
@@ -1565,7 +1619,7 @@ function IOSOtherVariant({
 
 // src/components/InstallGate/variants/InAppBrowserVariant.tsx
 var import_react7 = require("react");
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 function InAppBrowserVariant({
   state,
   actions
@@ -1581,10 +1635,10 @@ function InAppBrowserVariant({
     setTimeout(() => setCopied(false), 2e3);
   };
   const DotsIcon = app === "facebook" || app === "telegram" ? MenuDotsVerticalIcon : MenuDotsHorizontalIcon;
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(InstallSplash, { title: appCopy.title, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Step3, { n: 1, icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(DotsIcon, { size: 20 }), children: appCopy.step1 }),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Step3, { n: 2, icon: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ExternalLinkIcon, { size: 18 }), children: appCopy.step2 }),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(InstallSplash, { title: appCopy.title, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Step3, { n: 1, icon: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DotsIcon, { size: 20 }), children: appCopy.step1 }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Step3, { n: 2, icon: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ExternalLinkIcon, { size: 18 }), children: appCopy.step2 }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       "button",
       {
         "data-testid": "install-prompt-cta-inapp-copy",
@@ -1594,7 +1648,7 @@ function InAppBrowserVariant({
         children: copied ? copy.copiedToast : copy.copy
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       "button",
       {
         "data-testid": "install-prompt-skip-session",
@@ -1604,7 +1658,7 @@ function InAppBrowserVariant({
         children: copy.skip
       }
     ),
-    showPermanent && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    showPermanent && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       "button",
       {
         "data-testid": "install-prompt-skip-permanent",
@@ -1621,7 +1675,7 @@ function Step3({
   icon,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
     "div",
     {
       style: {
@@ -1635,7 +1689,7 @@ function Step3({
         textAlign: "left"
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
           "div",
           {
             style: {
@@ -1654,15 +1708,15 @@ function Step3({
             children: n
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { style: { flex: 1, fontSize: 14, color: "#333" }, children }),
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { style: { color: "#888", flexShrink: 0 }, children: icon })
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { style: { flex: 1, fontSize: 14, color: "#333" }, children }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { style: { color: "#888", flexShrink: 0 }, children: icon })
       ]
     }
   );
 }
 
 // src/components/InstallGate/variants/DesktopVariant.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function DesktopVariant({
   state,
   actions
@@ -1671,21 +1725,21 @@ function DesktopVariant({
   const copy = INSTALL_COPY.desktop;
   const iconUrl = theme.icon_url || theme.logo_url || null;
   if (!state.isInstallable) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
     "div",
     {
       role: "complementary",
       "aria-label": copy.title,
       style: bannerStyle,
       children: [
-        iconUrl ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        iconUrl ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           "img",
           {
             src: iconUrl,
             alt: "",
             style: { width: 40, height: 40, borderRadius: 10, objectFit: "cover", flexShrink: 0 }
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        ) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           "div",
           {
             style: {
@@ -1704,11 +1758,11 @@ function DesktopVariant({
             children: name.charAt(0).toUpperCase()
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { style: { fontSize: 14, fontWeight: 600, color: "#111" }, children: copy.title }),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { style: { fontSize: 12, color: "#666" }, children: copy.subtitle })
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { fontSize: 14, fontWeight: 600, color: "#111" }, children: copy.title }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { fontSize: 12, color: "#666" }, children: copy.subtitle })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
           "button",
           {
             "data-testid": "install-prompt-cta-desktop",
@@ -1729,12 +1783,12 @@ function DesktopVariant({
               flexShrink: 0
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DownloadIcon, { size: 14 }),
+              /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DownloadIcon, { size: 14 }),
               copy.cta
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           "button",
           {
             "data-testid": "install-prompt-desktop-close",
@@ -1749,7 +1803,7 @@ function DesktopVariant({
               padding: 4,
               flexShrink: 0
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(XIcon, { size: 16 })
+            children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(XIcon, { size: 16 })
           }
         )
       ]
@@ -1773,7 +1827,7 @@ var bannerStyle = {
 };
 
 // src/components/InstallGate/InstallGate.tsx
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function InstallGate({ children }) {
   const { slug, features_enabled } = useTemplateConfig();
   const enabled = features_enabled.includes("install_prompt");
@@ -1794,30 +1848,32 @@ function InstallGate({ children }) {
       variant: installState.variant
     });
   }, [shouldBlock, slug, installState.variant, installState.platform, installState.iosBrowser, installState.androidBrowser, installState.inAppApp]);
-  if (!enabled) return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_jsx_runtime15.Fragment, { children });
-  if (installState.isInstalled) return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_jsx_runtime15.Fragment, { children });
+  if (!enabled) return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children });
+  if (installState.isInstalled) return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children });
   if (installState.variant === "desktop") {
     const showBanner = !installState.isDismissedSession && !installState.isDismissedPermanent;
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
       children,
-      showBanner && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(DesktopVariant, { state: installState, actions: installState })
+      showBanner && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(DesktopVariant, { state: installState, actions: installState })
     ] });
   }
-  if (!shouldBlock) return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_jsx_runtime15.Fragment, { children });
+  if (!shouldBlock) return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children });
   switch (installState.variant) {
     case "android-native":
-      return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(AndroidNativeVariant, { state: installState, actions: installState });
+      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AndroidNativeVariant, { state: installState, actions: installState });
     case "android-manual":
-      return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(AndroidManualVariant, { state: installState, actions: installState });
+      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AndroidManualVariant, { state: installState, actions: installState });
+    case "android-pending":
+      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(AndroidPendingVariant, {});
     case "ios-safari":
-      return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(IOSafariVariant, { state: installState, actions: installState });
+      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(IOSafariVariant, { state: installState, actions: installState });
     case "ios-other":
-      return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(IOSOtherVariant, { state: installState, actions: installState });
+      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(IOSOtherVariant, { state: installState, actions: installState });
     case "in-app":
-      return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(InAppBrowserVariant, { state: installState, actions: installState });
+      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(InAppBrowserVariant, { state: installState, actions: installState });
     case "none":
     default:
-      return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_jsx_runtime15.Fragment, { children });
+      return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children });
   }
 }
 
@@ -1829,7 +1885,7 @@ function PushPrompt() {
 // src/internal/SessionExpiredBanner.tsx
 var import_react9 = require("react");
 var import_sdk3 = require("@hook-sdk/sdk");
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var DISMISS_KEY = "hook:session-expired-dismissed-until";
 var DISMISS_TTL_MS = 60 * 60 * 1e3;
 function SessionExpiredBanner() {
@@ -1856,13 +1912,13 @@ function SessionExpiredBanner() {
     localStorage.setItem(DISMISS_KEY, String(Date.now() + DISMISS_TTL_MS));
     setShow(false);
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("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__ */ (0, import_jsx_runtime16.jsxs)("span", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("strong", { children: "Sua sess\xE3o expirou." }),
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("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__ */ (0, import_jsx_runtime17.jsxs)("span", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("strong", { children: "Sua sess\xE3o expirou." }),
       " Fa\xE7a login novamente para continuar."
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         "button",
         {
           type: "button",
@@ -1871,7 +1927,7 @@ function SessionExpiredBanner() {
           children: "Fazer login"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         "button",
         {
           type: "button",
@@ -1887,7 +1943,7 @@ function SessionExpiredBanner() {
 
 // src/defaults/ErrorBoundary.tsx
 var import_react10 = require("react");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 var ErrorBoundary = class extends import_react10.Component {
   state = { error: null };
   static getDerivedStateFromError(error) {
@@ -1905,28 +1961,32 @@ var ErrorBoundary = class extends import_react10.Component {
   }
   render() {
     if (this.state.error) {
-      return this.props.fallback ?? /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { role: "alert", style: { padding: 24, textAlign: "center" }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("h2", { children: "Algo deu errado" }),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { style: { opacity: 0.7 }, children: "Recarregue a p\xE1gina pra tentar de novo." })
+      return this.props.fallback ?? /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { role: "alert", style: { padding: 24, textAlign: "center" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("h2", { children: "Algo deu errado" }),
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { style: { opacity: 0.7 }, children: "Recarregue a p\xE1gina pra tentar de novo." })
       ] });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_jsx_runtime17.Fragment, { children: this.props.children });
+    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, { children: this.props.children });
   }
 };
 
 // src/internal/PaymentReturnHandler.tsx
 var import_react11 = require("react");
 var import_sdk4 = require("@hook-sdk/sdk");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("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 } = (0, import_sdk4.useHook)();
   const subRef = (0, import_react11.useRef)(subscription);
   subRef.current = subscription;
   const runIdRef = (0, import_react11.useRef)(0);
+  const cyclesRef = (0, import_react11.useRef)(0);
   const [state, setState] = (0, import_react11.useState)("idle");
   const runPoll = (0, import_react11.useCallback)(() => {
     const runId = ++runIdRef.current;
+    cyclesRef.current += 1;
     setState("confirming");
     let attempts = 0;
     const tick = async () => {
@@ -1942,12 +2002,17 @@ 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);
@@ -1958,21 +2023,67 @@ function PaymentReturnHandler({ children }) {
     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 = (0, import_react11.useCallback)(() => {
+    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__ */ (0, import_jsx_runtime18.jsx)("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: "Confirmando pagamento\u2026" });
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: "Confirmando pagamento\u2026" });
   }
   if (state === "waiting") {
-    return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { style: { maxWidth: 320, textAlign: "center", lineHeight: 1.5 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { marginBottom: 16 }, children: "Pagamento aceito. Estamos confirmando com o banco \u2014 pode levar alguns minutos." }),
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("button", { type: "button", onClick: runPoll, style: buttonStyle, children: "Atualizar" })
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { style: { maxWidth: 320, textAlign: "center", lineHeight: 1.5 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { style: { marginBottom: 16 }, children: "Pagamento aceito. Estamos confirmando com o banco \u2014 pode levar alguns minutos." }),
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("button", { type: "button", onClick: runPoll, style: buttonStyle, children: "Atualizar" })
+    ] }) });
+  }
+  if (state === "timeout") {
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { role: "alert", "aria-live": "assertive", style: overlayStyle2, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { style: { maxWidth: 360, textAlign: "center", lineHeight: 1.5 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("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__ */ (0, import_jsx_runtime19.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              cyclesRef.current = 0;
+              runPoll();
+            },
+            style: buttonStyle,
+            "data-testid": "payment-timeout-retry",
+            children: "Tentar de novo"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: goHome,
+            style: secondaryButtonStyle,
+            "data-testid": "payment-timeout-home",
+            children: "Voltar pro app"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+          "a",
+          {
+            href: SUPPORT_MAILTO,
+            style: linkStyle,
+            "data-testid": "payment-timeout-support",
+            children: "Falar com suporte"
+          }
+        )
+      ] })
     ] }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_jsx_runtime18.Fragment, { children });
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_jsx_runtime19.Fragment, { children });
 }
 var overlayStyle2 = {
   position: "fixed",
@@ -1996,9 +2107,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
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 function buildLegacyConfigShim(config) {
   const paywall = config.paywall;
   const isFree = paywall.mode === "free";
@@ -2008,7 +2132,16 @@ function buildLegacyConfigShim(config) {
     slug: config.slug,
     name: config.name,
     email_alias: config.slug,
-    theme: { primary_color: config.branding.primaryColor },
+    // Map branding into the legacy theme shape so InstallSplash (and
+    // anything else reading theme.icon_url / theme.logo_url) can surface
+    // the app icon instead of the generic "first letter of name" fallback.
+    // Falls back to logoUrl when iconUrl is unset — apps that haven't
+    // adopted iconUrl keep their previous behavior unchanged.
+    theme: {
+      primary_color: config.branding.primaryColor,
+      icon_url: config.branding.iconUrl ?? config.branding.logoUrl,
+      logo_url: config.branding.logoUrl
+    },
     features_enabled: config.features_enabled ?? [],
     dependencies_allowlist: ["react", "react-dom"],
     subscription: {
@@ -2066,10 +2199,10 @@ function AppRoot(props) {
   const Router = testRouter === "memory" ? import_react_router_dom2.MemoryRouter : import_react_router_dom2.BrowserRouter;
   const basename = `/app/${config.slug}`;
   const routerProps = testRouter === "memory" ? { basename, initialEntries: testInitialEntries } : { basename };
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ErrorBoundary, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(AppConfigProvider, { config, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(TemplateConfigProvider, { config: legacyShim, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ThemeProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(PersistenceRegistry, { config: config.persistedKeys, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(Router, { ...routerProps, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(DeepLinkHandler, { deepLinks: config.deepLinks }),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(SessionExpiredBanner, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(InstallGate, { children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ErrorBoundary, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(AppConfigProvider, { config, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(TemplateConfigProvider, { config: legacyShim, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(ThemeProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(PersistenceRegistry, { config: config.persistedKeys, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(Router, { ...routerProps, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(DeepLinkHandler, { deepLinks: config.deepLinks }),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(SessionExpiredBanner, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(InstallGate, { children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
       AuthGated,
       {
         config,
@@ -2081,9 +2214,9 @@ function AppRoot(props) {
         Paywall,
         Onboarding,
         PreAuthFlow,
-        children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(SubscriptionGate, { Paywall: Paywall ?? FallbackPaywall, children: [
+        children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(SubscriptionGate, { Paywall: Paywall ?? FallbackPaywall, children: [
           children,
-          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(PushPrompt, {})
+          /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(PushPrompt, {})
         ] })
       }
     ) })
@@ -2103,25 +2236,25 @@ function AuthGated({
   if (authStatus === "loading") return null;
   if (authStatus !== "authenticated") {
     if (config.onboarding?.trigger === "pre_signup_custom" && PreAuthFlow) {
-      return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react_router_dom2.Routes, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/signin", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Login, {}) }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/signup", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Signup, {}) }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Forgot, {}) }),
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Reset, {}) }),
-        EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(EmailVerify, {}) }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/*", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(PreAuthFlow, {}) })
+      return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react_router_dom2.Routes, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/signin", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Login, {}) }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/signup", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Signup, {}) }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Forgot, {}) }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Reset, {}) }),
+        EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(EmailVerify, {}) }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/*", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(PreAuthFlow, {}) })
       ] });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_react_router_dom2.Routes, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Login, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/signup", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Signup, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Forgot, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(Reset, {}) }),
-      EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(EmailVerify, {}) }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Route, { path: "*", element: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_router_dom2.Navigate, { to: "/", replace: true }) })
+    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_react_router_dom2.Routes, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Login, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/signup", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Signup, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Forgot, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(Reset, {}) }),
+      EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(EmailVerify, {}) }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Route, { path: "*", element: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_router_dom2.Navigate, { to: "/", replace: true }) })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_jsx_runtime19.Fragment, { children });
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_jsx_runtime20.Fragment, { children });
 }
 function FallbackPaywall() {
   return null;
@@ -2212,7 +2345,7 @@ function usePush() {
 }
 
 // src/components/PushPrompt.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function platformRecoveryCopy(texts) {
   if (typeof navigator === "undefined") return null;
   const ua = navigator.userAgent || "";
@@ -2235,28 +2368,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__ */ (0, import_jsx_runtime20.jsxs)("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("h3", { children: texts.iosInstallTitle }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { children: texts.iosInstallBody }),
-      onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h3", { children: texts.iosInstallTitle }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { children: texts.iosInstallBody }),
+      onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
     ] });
   }
   if (state.kind === "denied") {
     const recovery = platformRecoveryCopy(texts);
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className, role: "region", "aria-label": texts.deniedTitle, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("h3", { children: texts.deniedTitle }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { children: texts.deniedBody }),
-      recovery && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { "data-testid": "denied-recovery", children: recovery })
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className, role: "region", "aria-label": texts.deniedTitle, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h3", { children: texts.deniedTitle }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { children: texts.deniedBody }),
+      recovery && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { "data-testid": "denied-recovery", children: recovery })
     ] });
   }
   if (state.kind === "unsupported") {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className, role: "region", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { children: texts.unsupportedBody }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className, role: "region", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { children: texts.unsupportedBody }) });
   }
   if (state.kind === "error") {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("p", { children: state.message }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { children: state.message }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className, role: "region", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className, role: "region", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       "button",
       {
         type: "button",
@@ -2270,23 +2403,23 @@ function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, clas
         children: texts.cta
       }
     ),
-    onDeclined && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
+    onDeclined && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
   ] });
 }
 
 // src/defaults/LoadingState.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 function LoadingState({ message }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { role: "status", "aria-live": "polite", style: { padding: 24, textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: message ?? "Carregando..." }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { role: "status", "aria-live": "polite", style: { padding: 24, textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: message ?? "Carregando..." }) });
 }
 
 // src/defaults/EmptyState.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function EmptyState({ title, description, action }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("h2", { style: { marginBottom: 8 }, children: title }),
-    description && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { style: { opacity: 0.7 }, children: description }),
-    action && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { marginTop: 16 }, children: action })
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("h2", { style: { marginBottom: 8 }, children: title }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { style: { opacity: 0.7 }, children: description }),
+    action && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { style: { marginTop: 16 }, children: action })
   ] });
 }
 
@@ -2332,18 +2465,24 @@ function useLoginForm() {
   const [password, setPassword] = (0, import_react14.useState)("");
   const [submitting, setSubmitting] = (0, import_react14.useState)(false);
   const [error, setError] = (0, import_react14.useState)(null);
-  const emailError = (0, import_react14.useMemo)(() => {
+  const [touchedEmail, setTouchedEmail] = (0, import_react14.useState)(false);
+  const [touchedPassword, setTouchedPassword] = (0, import_react14.useState)(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react14.useState)(false);
+  const validateEmail = (0, import_react14.useMemo)(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE.test(email)) return "Formato de e-mail inv\xE1lido.";
     return null;
   }, [email]);
-  const passwordError = (0, import_react14.useMemo)(() => {
+  const validatePassword = (0, import_react14.useMemo)(() => {
     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 = (0, import_react14.useCallback)(async () => {
+    setFormSubmitAttempted(true);
     if (!canSubmit) return false;
     setSubmitting(true);
     setError(null);
@@ -2361,9 +2500,12 @@ function useLoginForm() {
     email,
     setEmail,
     emailError,
+    markEmailTouched: () => setTouchedEmail(true),
     password,
     setPassword,
     passwordError,
+    markPasswordTouched: () => setTouchedPassword(true),
+    formSubmitAttempted,
     submit,
     submitting,
     canSubmit,
@@ -2384,23 +2526,31 @@ function useSignupForm() {
   const [password, setPassword] = (0, import_react15.useState)("");
   const [submitting, setSubmitting] = (0, import_react15.useState)(false);
   const [error, setError] = (0, import_react15.useState)(null);
-  const nameError = (0, import_react15.useMemo)(() => {
+  const [touchedName, setTouchedName] = (0, import_react15.useState)(false);
+  const [touchedEmail, setTouchedEmail] = (0, import_react15.useState)(false);
+  const [touchedPassword, setTouchedPassword] = (0, import_react15.useState)(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react15.useState)(false);
+  const validateName = (0, import_react15.useMemo)(() => {
     if (name.length === 0) return null;
     if (name.trim().length < 2) return "Nome muito curto.";
     return null;
   }, [name]);
-  const emailError = (0, import_react15.useMemo)(() => {
+  const validateEmail = (0, import_react15.useMemo)(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE2.test(email)) return "Formato de e-mail inv\xE1lido.";
     return null;
   }, [email]);
-  const passwordError = (0, import_react15.useMemo)(() => {
+  const validatePassword = (0, import_react15.useMemo)(() => {
     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 = (0, import_react15.useCallback)(async () => {
+    setFormSubmitAttempted(true);
     if (!canSubmit) return false;
     setSubmitting(true);
     setError(null);
@@ -2418,12 +2568,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,
@@ -2442,13 +2596,17 @@ function useForgotForm() {
   const [submitting, setSubmitting] = (0, import_react16.useState)(false);
   const [sent, setSent] = (0, import_react16.useState)(false);
   const [error, setError] = (0, import_react16.useState)(null);
-  const emailError = (0, import_react16.useMemo)(() => {
+  const [touchedEmail, setTouchedEmail] = (0, import_react16.useState)(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react16.useState)(false);
+  const validateEmail = (0, import_react16.useMemo)(() => {
     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 = (0, import_react16.useCallback)(async () => {
+    setFormSubmitAttempted(true);
     if (!canSubmit) return false;
     setSubmitting(true);
     setError(null);
@@ -2467,6 +2625,8 @@ function useForgotForm() {
     email,
     setEmail,
     emailError,
+    markEmailTouched: () => setTouchedEmail(true),
+    formSubmitAttempted,
     submit,
     submitting,
     canSubmit,
@@ -2487,24 +2647,30 @@ function useResetForm() {
   const [submitting, setSubmitting] = (0, import_react17.useState)(false);
   const [done, setDone] = (0, import_react17.useState)(false);
   const [error, setError] = (0, import_react17.useState)(null);
+  const [touchedPassword, setTouchedPassword] = (0, import_react17.useState)(false);
+  const [touchedConfirm, setTouchedConfirm] = (0, import_react17.useState)(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react17.useState)(false);
   (0, import_react17.useEffect)(() => {
     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 = (0, import_react17.useMemo)(() => {
+  const validatePassword = (0, import_react17.useMemo)(() => {
     if (password.length === 0) return null;
     if (password.length < MIN_PASSWORD3) return `M\xEDnimo de ${MIN_PASSWORD3} caracteres.`;
     return null;
   }, [password]);
-  const confirmError = (0, import_react17.useMemo)(() => {
+  const validateConfirm = (0, import_react17.useMemo)(() => {
     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 = (0, import_react17.useCallback)(async () => {
+    setFormSubmitAttempted(true);
     if (!canSubmit || token === null) return;
     setSubmitting(true);
     setError(null);
@@ -2528,9 +2694,12 @@ function useResetForm() {
     password,
     setPassword,
     passwordError,
+    markPasswordTouched: () => setTouchedPassword(true),
     confirm,
     setConfirm,
     confirmError,
+    markConfirmTouched: () => setTouchedConfirm(true),
+    formSubmitAttempted,
     submit,
     submitting,
     canSubmit,
@@ -2677,20 +2846,20 @@ function useToast() {
 
 // src/RouteBoundary.tsx
 var import_react_router_dom3 = require("react-router-dom");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function RouteBoundary({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react_router_dom3.Routes, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_react_router_dom3.Routes, { children: [
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom3.Route, { path: "*", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DefaultNotFound, {}) })
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_router_dom3.Route, { path: "*", element: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(DefaultNotFound, {}) })
   ] });
 }
 function DefaultNotFound() {
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { role: "alert", children: "P\xE1gina n\xE3o encontrada" });
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { role: "alert", children: "P\xE1gina n\xE3o encontrada" });
 }
 
 // src/PreAuthShell.tsx
 var import_react_router_dom4 = require("react-router-dom");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function PreAuthShell({
   basename,
   testRouter,
@@ -2698,9 +2867,9 @@ function PreAuthShell({
   children
 }) {
   if (testRouter === "memory") {
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_router_dom4.MemoryRouter, { basename, initialEntries: testInitialEntries, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_router_dom4.Routes, { children }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_router_dom4.MemoryRouter, { basename, initialEntries: testInitialEntries, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_router_dom4.Routes, { children }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_router_dom4.BrowserRouter, { basename, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_react_router_dom4.Routes, { children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_router_dom4.BrowserRouter, { basename, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_react_router_dom4.Routes, { children }) });
 }
 
 // src/OnboardingFlow.tsx
@@ -2721,7 +2890,7 @@ function useOnboardingStep() {
 }
 
 // src/OnboardingFlow.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 var isFilled = (v) => v != null && v !== "";
 var CURRENT_STEP_FIELD = "currentStep";
 function readPersistedStepIdx(draft) {
@@ -2799,7 +2968,7 @@ function OnboardingFlow({
       `[hook-template] OnboardingFlow: missing screen component for step '${step.id}' (expected key '${step.screen}' in screens prop)`
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(OnboardingStepContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Screen, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(OnboardingStepContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Screen, {}) });
 }
 
 // src/hooks/useFeature.ts