@hook-sdk/template 0.7.2 → 0.8.0

package/dist/index.d.cts

@@ -273,6 +273,13 @@ interface PixPending {
     qrCodePayload: string | null;
     qrCodeBase64: string | null;
     expiresAt: string | null;
+    /**
+     * Flipa `true` quando o polling detecta subscription ACTIVE/TRIAL (webhook
+     * PAYMENT_RECEIVED ou AUTHORIZATION_ACTIVATED chegou). UI deve renderizar
+     * confirmação visual nesse momento; após 2-3s chama `dismissPix` pra
+     * limpar o modal e deixar SubscriptionGate liberar o app.
+     */
+    paid: boolean;
 }
 /**
  * Hook headless pro Paywall. Expõe status atual da subscription + ação

package/dist/index.d.ts

@@ -273,6 +273,13 @@ interface PixPending {
     qrCodePayload: string | null;
     qrCodeBase64: string | null;
     expiresAt: string | null;
+    /**
+     * Flipa `true` quando o polling detecta subscription ACTIVE/TRIAL (webhook
+     * PAYMENT_RECEIVED ou AUTHORIZATION_ACTIVATED chegou). UI deve renderizar
+     * confirmação visual nesse momento; após 2-3s chama `dismissPix` pra
+     * limpar o modal e deixar SubscriptionGate liberar o app.
+     */
+    paid: boolean;
 }
 /**
  * Hook headless pro Paywall. Expõe status atual da subscription + ação

package/dist/index.js

@@ -1,5 +1,5 @@
 // src/AppRoot.tsx
-import { useCallback as useCallback7, useEffect as useEffect8, useRef as useRef3, useState as useState11 } from "react";
+import { useCallback as useCallback7, useEffect as useEffect8, useRef as useRef3, useState as useState12 } from "react";
 import { useHook as useHook8 } from "@hook-sdk/sdk";
 
 // src/internal/TemplateConfigContext.tsx
@@ -121,7 +121,8 @@ function usePaywallState() {
             method: "pix-auto",
             qrCodePayload: result.qrCodePayload,
             qrCodeBase64: result.qrCodeBase64,
-            expiresAt: null
+            expiresAt: null,
+            paid: false
           });
           setOpening(false);
           return;
@@ -132,7 +133,8 @@ function usePaywallState() {
             method: "pix-once",
             qrCodePayload: result.qrCodePayload,
             qrCodeBase64: result.qrCodeBase64,
-            expiresAt: result.expiresAt
+            expiresAt: result.expiresAt,
+            paid: false
           });
           setOpening(false);
           return;
@@ -156,7 +158,7 @@ function usePaywallState() {
   const subRef = useRef(subscription);
   subRef.current = subscription;
   useEffect2(() => {
-    if (!pixPending) return;
+    if (!pixPending || pixPending.paid) return;
     let attempts = 0;
     const MAX_ATTEMPTS = 60;
     let cancelled = false;
@@ -168,7 +170,7 @@ function usePaywallState() {
         if (cancelled) return;
         const s = subRef.current.status();
         if (s === "active" || s === "trialing") {
-          setPixPending(null);
+          setPixPending((prev) => prev ? { ...prev, paid: true } : prev);
           return;
         }
       } catch {
@@ -211,17 +213,37 @@ function SubscriptionGate({ Paywall, children }) {
 }
 
 // src/internal/PersistedKeysPrefetch.tsx
-import { useEffect as useEffect3 } from "react";
+import { useEffect as useEffect3, useState as useState3 } from "react";
 import { useHook as useHook3 } from "@hook-sdk/sdk";
 import { Fragment as Fragment3, jsx as jsx6 } from "react/jsx-runtime";
+var SAFETY_TIMEOUT_MS = 3e3;
 function PersistedKeysPrefetch({ children }) {
   const { appData } = useHook3();
   const config = useTemplateConfig();
+  const hasKeys = !!config.persistedKeys && config.persistedKeys.length > 0;
+  const [ready, setReady] = useState3(!hasKeys);
   useEffect3(() => {
     const keys = config.persistedKeys;
-    if (!keys || keys.length === 0) return;
+    if (!keys || keys.length === 0) {
+      setReady(true);
+      return;
+    }
+    let cancelled = false;
     appData.cache.startPrefetch(keys, (ks) => appData.bulkRead(ks));
+    void appData.cache.waitForPrimed(SAFETY_TIMEOUT_MS).then((result) => {
+      if (cancelled) return;
+      if (result === "timeout") {
+        console.warn(
+          `[@hook-sdk/template] PersistedKeysPrefetch: bulk-read n\xE3o completou em ${SAFETY_TIMEOUT_MS}ms. Liberando render mesmo assim \u2014 usePersistedState pode expor defaultValue at\xE9 o fetch terminar (G77).`
+        );
+      }
+      setReady(true);
+    });
+    return () => {
+      cancelled = true;
+    };
   }, [appData, config.persistedKeys]);
+  if (!ready) return null;
   return /* @__PURE__ */ jsx6(Fragment3, { children });
 }
 
@@ -234,7 +256,7 @@ function PushPrompt() {
 import { useEffect as useEffect5, useRef as useRef2 } from "react";
 
 // src/hooks/useInstallPrompt.ts
-import { useCallback as useCallback2, useEffect as useEffect4, useState as useState3 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect4, useState as useState4 } from "react";
 var IOS_RE = /iPad|iPhone|iPod/;
 var IOS_NON_SAFARI_RE = /CriOS|FxiOS|EdgiOS/;
 var ANDROID_RE = /Android/;
@@ -367,17 +389,17 @@ function useInstallPrompt(slug) {
   const iosBrowser = detectIOSBrowser(ua);
   const androidBrowser = detectAndroidBrowser(ua);
   const inAppApp = detectInAppApp(ua);
-  const [isInstallable, setIsInstallable] = useState3(() => {
+  const [isInstallable, setIsInstallable] = useState4(() => {
     if (typeof window === "undefined") return false;
     return window.__pwaInstallPrompt != null;
   });
-  const [isInstalled, setIsInstalled] = useState3(() => {
+  const [isInstalled, setIsInstalled] = useState4(() => {
     const { installed } = detectStandalone();
     return installed || readInstalledMarker(slug);
   });
-  const [isDismissedSession, setIsDismissedSession] = useState3(() => readSessionSkip(slug));
-  const [isDismissedPermanent, setIsDismissedPermanent] = useState3(() => readPermanentDismiss(slug).dismissed);
-  const [skipCount, setSkipCount] = useState3(() => readSkipCount(slug));
+  const [isDismissedSession, setIsDismissedSession] = useState4(() => readSessionSkip(slug));
+  const [isDismissedPermanent, setIsDismissedPermanent] = useState4(() => readPermanentDismiss(slug).dismissed);
+  const [skipCount, setSkipCount] = useState4(() => readSkipCount(slug));
   useEffect4(() => {
     if (typeof window === "undefined") return;
     if (window.__pwaInstallPrompt) {
@@ -1232,7 +1254,7 @@ function IOSOtherVariant({
 }
 
 // src/components/InstallGate/variants/InAppBrowserVariant.tsx
-import { useState as useState4 } from "react";
+import { useState as useState5 } from "react";
 import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
 function InAppBrowserVariant({
   state,
@@ -1242,7 +1264,7 @@ function InAppBrowserVariant({
   const appCopy = INSTALL_COPY.inApp[app] ?? INSTALL_COPY.inApp.other;
   const copy = INSTALL_COPY.inApp;
   const showPermanent = shouldShowPermanentOption(state);
-  const [copied, setCopied] = useState4(false);
+  const [copied, setCopied] = useState5(false);
   const handleCopy = async () => {
     await actions.copyLink();
     setCopied(true);
@@ -1511,7 +1533,7 @@ var ErrorBoundary = class extends Component {
 };
 
 // src/hooks/useLoginForm.ts
-import { useCallback as useCallback3, useMemo as useMemo2, useState as useState5 } from "react";
+import { useCallback as useCallback3, useMemo as useMemo2, useState as useState6 } from "react";
 import { useHook as useHook4 } from "@hook-sdk/sdk";
 
 // src/errors.ts
@@ -1548,10 +1570,10 @@ var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 var MIN_PASSWORD = 8;
 function useLoginForm() {
   const { auth } = useHook4();
-  const [email, setEmail] = useState5("");
-  const [password, setPassword] = useState5("");
-  const [submitting, setSubmitting] = useState5(false);
-  const [error, setError] = useState5(null);
+  const [email, setEmail] = useState6("");
+  const [password, setPassword] = useState6("");
+  const [submitting, setSubmitting] = useState6(false);
+  const [error, setError] = useState6(null);
   const emailError = useMemo2(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE.test(email)) return "Formato de e-mail inv\xE1lido.";
@@ -1662,7 +1684,7 @@ function GoogleGlyph() {
 }
 
 // src/internal/OAuthErrorBanner.tsx
-import { useEffect as useEffect6, useState as useState6 } from "react";
+import { useEffect as useEffect6, useState as useState7 } from "react";
 import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
 var ERROR_MESSAGES = {
   invalid_state: "Sess\xE3o expirou, tente de novo.",
@@ -1683,7 +1705,7 @@ function stripErrorFromUrl() {
   window.history.replaceState({}, "", url.toString());
 }
 function OAuthErrorBanner() {
-  const [code, setCode] = useState6(() => readErrorCode());
+  const [code, setCode] = useState7(() => readErrorCode());
   useEffect6(() => {
     if (code !== null) stripErrorFromUrl();
   }, [code]);
@@ -1817,17 +1839,17 @@ function DefaultLoginScreen({ onNavigate }) {
 }
 
 // src/hooks/useSignupForm.ts
-import { useCallback as useCallback4, useMemo as useMemo3, useState as useState7 } from "react";
+import { useCallback as useCallback4, useMemo as useMemo3, useState as useState8 } from "react";
 import { useHook as useHook5 } from "@hook-sdk/sdk";
 var EMAIL_RE2 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 var MIN_PASSWORD2 = 8;
 function useSignupForm() {
   const { auth } = useHook5();
-  const [name, setName] = useState7("");
-  const [email, setEmail] = useState7("");
-  const [password, setPassword] = useState7("");
-  const [submitting, setSubmitting] = useState7(false);
-  const [error, setError] = useState7(null);
+  const [name, setName] = useState8("");
+  const [email, setEmail] = useState8("");
+  const [password, setPassword] = useState8("");
+  const [submitting, setSubmitting] = useState8(false);
+  const [error, setError] = useState8(null);
   const nameError = useMemo3(() => {
     if (name.length === 0) return null;
     if (name.trim().length < 2) return "Nome muito curto.";
@@ -1932,15 +1954,15 @@ function DefaultSignupScreen({ onNavigate }) {
 }
 
 // src/hooks/useForgotForm.ts
-import { useCallback as useCallback5, useMemo as useMemo4, useState as useState8 } from "react";
+import { useCallback as useCallback5, useMemo as useMemo4, useState as useState9 } from "react";
 import { useHook as useHook6 } from "@hook-sdk/sdk";
 var EMAIL_RE3 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 function useForgotForm() {
   const { auth } = useHook6();
-  const [email, setEmail] = useState8("");
-  const [submitting, setSubmitting] = useState8(false);
-  const [sent, setSent] = useState8(false);
-  const [error, setError] = useState8(null);
+  const [email, setEmail] = useState9("");
+  const [submitting, setSubmitting] = useState9(false);
+  const [sent, setSent] = useState9(false);
+  const [error, setError] = useState9(null);
   const emailError = useMemo4(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE3.test(email)) return "Formato de e-mail inv\xE1lido.";
@@ -2006,17 +2028,17 @@ function DefaultForgotScreen({ onNavigate }) {
 }
 
 // src/hooks/useResetForm.ts
-import { useCallback as useCallback6, useEffect as useEffect7, useMemo as useMemo5, useState as useState9 } from "react";
+import { useCallback as useCallback6, useEffect as useEffect7, useMemo as useMemo5, useState as useState10 } from "react";
 import { useHook as useHook7 } from "@hook-sdk/sdk";
 var MIN_PASSWORD3 = 12;
 function useResetForm() {
   const { auth } = useHook7();
-  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);
+  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);
   useEffect7(() => {
     if (typeof window === "undefined") return;
     const params = new URLSearchParams(window.location.search);
@@ -2112,13 +2134,13 @@ function DefaultResetScreen({ onNavigate }) {
 }
 
 // src/defaults/DefaultPaywall.tsx
-import { useState as useState10 } from "react";
+import { useState as useState11 } from "react";
 import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
 function DefaultPaywall() {
   const config = useTemplateConfig();
   const { checkout, opening, error } = usePaywallState();
   const p = config.subscription.paywall_config;
-  const [cpf, setCpf] = useState10("");
+  const [cpf, setCpf] = useState11("");
   const cpfDigits = cpf.replace(/\D/g, "");
   const canCheckout = cpfDigits.length === 11 && !opening;
   return /* @__PURE__ */ jsxs18("main", { style: { padding: 24, maxWidth: 440, margin: "0 auto", textAlign: "center" }, children: [
@@ -2178,7 +2200,7 @@ function PaymentReturnHandler({ children }) {
   const subRef = useRef3(subscription);
   subRef.current = subscription;
   const runIdRef = useRef3(0);
-  const [state, setState] = useState11("idle");
+  const [state, setState] = useState12("idle");
   const runPoll = useCallback7(() => {
     const runId = ++runIdRef.current;
     setState("confirming");
@@ -2282,7 +2304,7 @@ function AppRoot({
 }
 
 // src/hooks/usePush.ts
-import { useCallback as useCallback8, useEffect as useEffect9, useState as useState12 } from "react";
+import { useCallback as useCallback8, useEffect as useEffect9, useState as useState13 } from "react";
 import { useHook as useHook9 } from "@hook-sdk/sdk";
 function detectIosNeedsInstall() {
   if (typeof navigator === "undefined" || typeof window === "undefined") return false;
@@ -2310,7 +2332,7 @@ function deriveState(push) {
 }
 function usePush() {
   const { push } = useHook9();
-  const [state, setState] = useState12(() => deriveState(push));
+  const [state, setState] = useState13(() => deriveState(push));
   useEffect9(() => {
     setState(deriveState(push));
   }, [push]);
@@ -2463,13 +2485,13 @@ function useSubscription() {
 }
 
 // src/hooks/useReminders.ts
-import { useCallback as useCallback9, useEffect as useEffect11, useState as useState13 } from "react";
+import { useCallback as useCallback9, useEffect as useEffect11, useState as useState14 } from "react";
 import { useHook as useHook13 } from "@hook-sdk/sdk";
 function useReminders() {
   const { push } = useHook13();
   const r = push.reminders;
-  const [reminders, setReminders] = useState13([]);
-  const [loading, setLoading] = useState13(true);
+  const [reminders, setReminders] = useState14([]);
+  const [loading, setLoading] = useState14(true);
   const reload = useCallback9(async () => {
     setLoading(true);
     try {
@@ -2500,9 +2522,9 @@ function useReminders() {
 }
 
 // src/hooks/useToast.ts
-import { useCallback as useCallback10, useState as useState14 } from "react";
+import { useCallback as useCallback10, useState as useState15 } from "react";
 function useToast() {
-  const [items, setItems] = useState14([]);
+  const [items, setItems] = useState15([]);
   const show = useCallback10((message, kind = "info") => {
     const id = `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
     setItems((prev) => [...prev, { id, message, kind }]);