@hook-sdk/template 0.20.0 → 0.22.0

package/dist/index.cjs

@@ -34,6 +34,7 @@ __export(index_exports, {
   AppConfigSchema: () => AppConfigSchema,
   AppRoot: () => AppRoot,
   DeepLinkHandler: () => DeepLinkHandler,
+  DevSkipOnboardingFab: () => DevSkipOnboardingFab,
   EmptyState: () => EmptyState,
   ErrorBoundary: () => ErrorBoundary,
   I18nProvider: () => I18nProvider,
@@ -43,6 +44,11 @@ __export(index_exports, {
   LoadingState: () => LoadingState,
   OnboardingFlow: () => OnboardingFlow,
   PaymentReturnHandler: () => PaymentReturnHandler,
+  Paywall: () => Paywall,
+  PaywallCta: () => PaywallCta,
+  PaywallCyclePicker: () => PaywallCyclePicker,
+  PaywallMethodContent: () => PaywallMethodContent,
+  PaywallMethodTabs: () => PaywallMethodTabs,
   PersistenceRegistry: () => PersistenceRegistry,
   PreAuthShell: () => PreAuthShell,
   PushPrompt: () => PushPrompt2,
@@ -57,10 +63,12 @@ __export(index_exports, {
   detectStandalone: () => detectStandalone,
   discountPercent: () => discountPercent,
   formatBRL: () => formatBRL,
+  isDevToolsEnabled: () => isDevToolsEnabled,
   monthlyFromYearly: () => monthlyFromYearly,
   parseAppConfig: () => parseAppConfig,
   shouldBlockInstall: () => shouldBlockInstall,
   shouldShowPermanentOption: () => shouldShowPermanentOption,
+  skipOnboarding: () => skipOnboarding,
   useAppConfig: () => useAppConfig,
   useAuth: () => useAuth,
   useAuthPrimitives: () => useAuthPrimitives,
@@ -77,14 +85,14 @@ __export(index_exports, {
   useSignupForm: () => useSignupForm,
   useSubscription: () => useSubscription,
   useToast: () => useToast,
-  useTrackOnboardingStep: () => import_sdk21.useTrackOnboardingStep
+  useTrackOnboardingStep: () => import_sdk23.useTrackOnboardingStep
 });
 module.exports = __toCommonJS(index_exports);
 
 // src/AppRoot.tsx
-var import_react14 = require("react");
+var import_react15 = require("react");
 var import_react_router_dom2 = require("react-router-dom");
-var import_sdk7 = require("@hook-sdk/sdk");
+var import_sdk8 = require("@hook-sdk/sdk");
 
 // src/config/AppConfigContext.tsx
 var import_react = require("react");
@@ -118,7 +126,16 @@ var AuthFlowSchema = import_zod.z.object({
 });
 var PaywallNonFreeSchema = import_zod.z.object({
   mode: import_zod.z.enum(["trial", "pay_first"]),
+  // Legacy flat trial — fallback when per-method fields aren't set.
   trialDays: import_zod.z.number().int().nonnegative().optional(),
+  // Per-method trial (ADR-022 Amendment 2026-05-12 + G154). PIX Auto can't
+  // offer trial on Asaas today (Jornada 2 unavailable), so apps that mix
+  // methods must split the value to avoid bait-and-switch on PIX shoppers.
+  trialDaysCard: import_zod.z.number().int().nonnegative().optional(),
+  trialDaysPix: import_zod.z.number().int().nonnegative().optional(),
+  // Which method the paywall preselects. null/undefined = no preselection
+  // (user picks). Per-app override reflects audience, not Hook bias.
+  defaultMethod: import_zod.z.enum(["card", "pix-auto", "pix-once"]).nullable().optional(),
   cycles: import_zod.z.array(import_zod.z.enum(["MONTHLY", "YEARLY"])).min(1),
   prices: import_zod.z.object({
     monthlyCents: import_zod.z.number().int().nonnegative(),
@@ -369,10 +386,11 @@ function usePaywallState() {
     () => declaredMethods.filter((m) => isMethodAvailable(availability, m)),
     [declaredMethods, availability]
   );
-  const defaultMethod = methods[0] ?? declaredMethods[0] ?? "card";
+  const configDefault = !isFree && "defaultMethod" in paywall ? paywall.defaultMethod ?? null : null;
+  const defaultMethod = (configDefault && methods.includes(configDefault) ? configDefault : null) ?? methods[0] ?? declaredMethods[0] ?? "card";
   const [selectedMethodRaw, setSelectedMethod] = (0, import_react6.useState)(defaultMethod);
   const selectedMethod = methods.includes(selectedMethodRaw) ? selectedMethodRaw : methods[0] ?? selectedMethodRaw;
-  const initialCycle = isFree ? "MONTHLY" : paywall.cycles[0] ?? "MONTHLY";
+  const initialCycle = isFree ? "MONTHLY" : paywall.cycles.includes("YEARLY") ? "YEARLY" : paywall.cycles[0] ?? "MONTHLY";
   const [cycle, setCycle] = (0, import_react6.useState)(initialCycle);
   const cpfRequired = !isFree && paywall.requiresCpf;
   const [cpf, setCpf] = (0, import_react6.useState)("");
@@ -390,6 +408,22 @@ function usePaywallState() {
   const [submitting, setSubmitting] = (0, import_react6.useState)(false);
   const status = subscription.status();
   const daysLeftInTrial = subscription.daysLeftInTrial();
+  const trialDaysForMethod = (0, import_react6.useCallback)(
+    (method) => {
+      if (isFree) return 0;
+      if (method === "card") {
+        if (typeof paywall.trialDaysCard === "number") return paywall.trialDaysCard;
+        if (typeof paywall.trialDays === "number") return paywall.trialDays;
+        return 7;
+      }
+      if (typeof paywall.trialDaysPix === "number") return paywall.trialDaysPix;
+      if (typeof paywall.trialDays === "number") return paywall.trialDays;
+      return 0;
+    },
+    [isFree, paywall]
+  );
+  const trialDaysCard = trialDaysForMethod("card");
+  const trialDaysPix = trialDaysForMethod("pix-auto");
   const initialLoadComplete = subscription.initialLoadComplete;
   const hasAccess = subscription.hasAccess;
   const pixPending = (0, import_react6.useMemo)(() => {
@@ -429,6 +463,40 @@ function usePaywallState() {
       discountPercent: discount
     };
   }, [paywall, cycle, isFree]);
+  const hasConsumedTrial = (0, import_react6.useMemo)(() => {
+    return ["active", "trialing", "past_due", "canceled", "expired"].includes(status);
+  }, [status]);
+  const currentPriceCents = (0, import_react6.useMemo)(() => {
+    if (isFree) return 0;
+    return cycle === "YEARLY" ? paywall.prices.yearlyCents : paywall.prices.monthlyCents;
+  }, [paywall, cycle, isFree]);
+  const currentMonthlyEquivCents = (0, import_react6.useMemo)(() => {
+    if (isFree) return 0;
+    if (cycle === "YEARLY") return Math.round(paywall.prices.yearlyCents / 12);
+    return paywall.prices.monthlyCents;
+  }, [paywall, cycle, isFree]);
+  const anchorPriceCents = (0, import_react6.useMemo)(() => {
+    if (isFree) return null;
+    const a = paywall.anchorPrices;
+    if (!a) return null;
+    return cycle === "YEARLY" ? a.yearlyCents : a.monthlyCents;
+  }, [paywall, cycle, isFree]);
+  const selectMethod = (0, import_react6.useCallback)(
+    (next) => {
+      if (next === selectedMethod) return;
+      track2("paywall_method_tab_clicked", { method: next, from_method: selectedMethod });
+      setSelectedMethod(next);
+    },
+    [selectedMethod, track2]
+  );
+  const selectCycle = (0, import_react6.useCallback)(
+    (next) => {
+      if (next === cycle) return;
+      track2("paywall_cycle_clicked", { cycle: next, from_cycle: cycle });
+      setCycle(next);
+    },
+    [cycle, track2]
+  );
   const useDefaultMessages = paywall.mode !== "free" && paywall.errorMessages === "default";
   const buildError = (0, import_react6.useCallback)(
     (code, fallbackMessage) => ({
@@ -623,6 +691,20 @@ function usePaywallState() {
     methods,
     selectedMethod,
     setSelectedMethod,
+    // Conversion-max derivations (template 0.21)
+    hasConsumedTrial,
+    currentPriceCents,
+    currentMonthlyEquivCents,
+    anchorPriceCents,
+    selectMethod,
+    selectCycle,
+    isFree,
+    // Per-method trial (ADR-022 Amendment 2026-05-12). Use these to render
+    // asymmetric copy per method card on the paywall — never a global
+    // "free trial!" headline when both methods are visible.
+    trialDaysForMethod,
+    trialDaysCard,
+    trialDaysPix,
     // Form state
     cpfState,
     cardState,
@@ -654,13 +736,13 @@ var BLOCKING = /* @__PURE__ */ new Set([
   "canceled",
   "none"
 ]);
-function SubscriptionGate({ Paywall, children }) {
+function SubscriptionGate({ Paywall: Paywall2, children }) {
   const { mode } = useTemplateConfig();
   const { status, hasAccess, initialLoadComplete } = usePaywallState();
   if (mode === "free") return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children });
   if (!initialLoadComplete && status === "none") return null;
   if (hasAccess === true && status !== "none") return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children });
-  if (BLOCKING.has(status)) return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Paywall, {});
+  if (BLOCKING.has(status)) return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Paywall2, {});
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children });
 }
 
@@ -2106,22 +2188,156 @@ function I18nProvider({
   return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react_i18next.I18nextProvider, { i18n: import_i18next.default, children });
 }
 
-// src/internal/PaymentReturnHandler.tsx
+// src/dev/env.ts
+var import_meta = {};
+function isDevToolsEnabled() {
+  const meta = import_meta;
+  if (meta.env?.VITE_HOOK_DEV_TOOLS !== "1") return false;
+  if (typeof window === "undefined") return false;
+  const host = window.location.hostname;
+  return host.includes(".staging.") || host === "localhost" || host === "127.0.0.1";
+}
+
+// src/dev/DevSkipOnboardingFab.tsx
 var import_react13 = require("react");
 var import_sdk6 = require("@hook-sdk/sdk");
 var import_jsx_runtime20 = require("react/jsx-runtime");
+var STORAGE_KEY = "hook_dev_skip_email";
+var TEST_EMAIL_DOMAIN = "@hook.test";
+var TEST_PASSWORD = "SkipTest!2026";
+function makeEmail() {
+  return `ryan+skip-${Date.now()}${TEST_EMAIL_DOMAIN}`;
+}
+async function ensureSignedIn(hook, maxAttempts = 3) {
+  if (hook.authStatus === "authenticated") return null;
+  let lastErr;
+  for (let i = 0; i < maxAttempts; i += 1) {
+    const email = makeEmail();
+    try {
+      await hook.auth.signup({ email, password: TEST_PASSWORD, name: "Ryan Test" });
+      try {
+        window.sessionStorage.setItem(STORAGE_KEY, email);
+      } catch {
+      }
+      return email;
+    } catch (err) {
+      lastErr = err;
+      await new Promise((r) => setTimeout(r, 30));
+    }
+  }
+  throw lastErr ?? new Error("signup failed after retries");
+}
+async function skipOnboarding(hook, defaults, appSlug) {
+  const { __seed, ...rest } = defaults;
+  await ensureSignedIn(hook);
+  await hook.appData.set("onboarding_data", {
+    ...rest,
+    onboarding_completed: true
+  });
+  if (__seed) {
+    await __seed(hook);
+  }
+  console.info("[hook-template] dev_skip_onboarding fired", {
+    app_slug: appSlug,
+    hostname: window.location.hostname
+  });
+  window.location.assign(`/app/${appSlug}/`);
+}
+var STYLES = {
+  base: {
+    position: "fixed",
+    bottom: "16px",
+    right: "16px",
+    zIndex: 2147483647,
+    padding: "10px 14px",
+    borderRadius: "999px",
+    border: "none",
+    background: "#F59E0B",
+    color: "#111827",
+    fontWeight: 600,
+    fontSize: "13px",
+    fontFamily: "system-ui, -apple-system, sans-serif",
+    boxShadow: "0 4px 14px rgba(0, 0, 0, 0.25)",
+    cursor: "pointer",
+    display: "flex",
+    alignItems: "center",
+    gap: "6px"
+  },
+  confirm: { background: "#DC2626", color: "#FFFFFF" },
+  busy: { opacity: 0.6, cursor: "wait" }
+};
+var CONFIRM_TIMEOUT_MS = 3e3;
+function DevSkipOnboardingFab({ defaults }) {
+  const hook = (0, import_sdk6.useHook)();
+  const { slug } = useAppConfig();
+  const [state, setState] = (0, import_react13.useState)("idle");
+  const [errorMsg, setErrorMsg] = (0, import_react13.useState)(null);
+  const timerRef = (0, import_react13.useRef)(null);
+  const clearTimer = (0, import_react13.useCallback)(() => {
+    if (timerRef.current) {
+      clearTimeout(timerRef.current);
+      timerRef.current = null;
+    }
+  }, []);
+  const onClick = (0, import_react13.useCallback)(async () => {
+    if (state === "busy") return;
+    if (state === "idle" || state === "error") {
+      setState("confirm");
+      setErrorMsg(null);
+      clearTimer();
+      timerRef.current = setTimeout(() => setState("idle"), CONFIRM_TIMEOUT_MS);
+      return;
+    }
+    clearTimer();
+    setState("busy");
+    try {
+      await skipOnboarding(hook, defaults, slug);
+    } catch (err) {
+      setState("error");
+      setErrorMsg(err instanceof Error ? err.message : String(err));
+    }
+  }, [state, hook, defaults, slug, clearTimer]);
+  const label = (() => {
+    if (state === "busy") return "skipping\u2026";
+    if (state === "confirm") return "tap again to confirm";
+    if (state === "error") return `failed \u2014 tap to retry`;
+    return hook.authStatus === "authenticated" ? "\u26A1 skip onboarding" : "\u26A1 skip + signup";
+  })();
+  const style = {
+    ...STYLES.base,
+    ...state === "confirm" || state === "error" ? STYLES.confirm : {},
+    ...state === "busy" ? STYLES.busy : {}
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    "button",
+    {
+      type: "button",
+      "data-testid": "dev-skip-onboarding-fab",
+      "aria-label": "Skip onboarding (staging dev only)",
+      style,
+      onClick,
+      title: errorMsg ?? void 0,
+      children: label
+    }
+  );
+}
+
+// src/internal/PaymentReturnHandler.tsx
+var import_react14 = require("react");
+var import_sdk7 = require("@hook-sdk/sdk");
+var import_jsx_runtime21 = 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, track: track2 } = (0, import_sdk6.useHook)();
-  const subRef = (0, import_react13.useRef)(subscription);
+  const { subscription, track: track2 } = (0, import_sdk7.useHook)();
+  const subRef = (0, import_react14.useRef)(subscription);
   subRef.current = subscription;
-  const runIdRef = (0, import_react13.useRef)(0);
-  const cyclesRef = (0, import_react13.useRef)(0);
-  const startMsRef = (0, import_react13.useRef)(0);
-  const [state, setState] = (0, import_react13.useState)("idle");
-  const runPoll = (0, import_react13.useCallback)(() => {
+  const runIdRef = (0, import_react14.useRef)(0);
+  const cyclesRef = (0, import_react14.useRef)(0);
+  const startMsRef = (0, import_react14.useRef)(0);
+  const [state, setState] = (0, import_react14.useState)("idle");
+  const runPoll = (0, import_react14.useCallback)(() => {
     const runId = ++runIdRef.current;
     const isFirstRun = cyclesRef.current === 0;
     cyclesRef.current += 1;
@@ -2169,7 +2385,7 @@ function PaymentReturnHandler({ children }) {
     };
     void tick();
   }, [track2]);
-  (0, import_react13.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     if (typeof window === "undefined") return;
     const url = new URL(window.location.href);
     if (url.searchParams.get("paymentReturn") !== "1") return;
@@ -2179,26 +2395,26 @@ function PaymentReturnHandler({ children }) {
       runIdRef.current++;
     };
   }, [runPoll]);
-  const goHome = (0, import_react13.useCallback)(() => {
+  const goHome = (0, import_react14.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_runtime20.jsx)("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: "Confirmando pagamento\u2026" });
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: "Confirmando pagamento\u2026" });
   }
   if (state === "waiting") {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { maxWidth: 320, textAlign: "center", lineHeight: 1.5 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { marginBottom: 16 }, children: "Pagamento aceito. Estamos confirmando com o banco \u2014 pode levar alguns minutos." }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { type: "button", onClick: runPoll, style: buttonStyle, children: "Atualizar" })
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { maxWidth: 320, textAlign: "center", lineHeight: 1.5 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { marginBottom: 16 }, children: "Pagamento aceito. Estamos confirmando com o banco \u2014 pode levar alguns minutos." }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { type: "button", onClick: runPoll, style: buttonStyle, children: "Atualizar" })
     ] }) });
   }
   if (state === "timeout") {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { role: "alert", "aria-live": "assertive", style: overlayStyle2, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { maxWidth: 360, textAlign: "center", lineHeight: 1.5 }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.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_runtime20.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { role: "alert", "aria-live": "assertive", style: overlayStyle2, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { maxWidth: 360, textAlign: "center", lineHeight: 1.5 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.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_runtime21.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           "button",
           {
             type: "button",
@@ -2211,7 +2427,7 @@ function PaymentReturnHandler({ children }) {
             children: "Tentar de novo"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           "button",
           {
             type: "button",
@@ -2221,7 +2437,7 @@ function PaymentReturnHandler({ children }) {
             children: "Voltar pro app"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           "a",
           {
             href: SUPPORT_MAILTO,
@@ -2233,7 +2449,7 @@ function PaymentReturnHandler({ children }) {
       ] })
     ] }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_jsx_runtime20.Fragment, { children });
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_jsx_runtime21.Fragment, { children });
 }
 var overlayStyle2 = {
   position: "fixed",
@@ -2272,7 +2488,7 @@ var linkStyle = {
 };
 
 // src/AppRoot.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 function buildLegacyConfigShim(config) {
   const paywall = config.paywall;
   const isFree = paywall.mode === "free";
@@ -2320,9 +2536,10 @@ function AppRoot(props) {
     Forgot,
     Reset,
     EmailVerify,
-    Paywall,
+    Paywall: Paywall2,
     Onboarding,
-    PreAuthFlow
+    PreAuthFlow,
+    devSkipOnboarding
   } = props;
   if (!Login || !Signup || !Forgot || !Reset) {
     throw new Error(
@@ -2330,7 +2547,7 @@ function AppRoot(props) {
     );
   }
   const config = parseAppConfig(rawConfig);
-  if (config.paywall.mode !== "free" && !Paywall) {
+  if (config.paywall.mode !== "free" && !Paywall2) {
     throw new Error(
       "[hook-template] <AppRoot>: Paywall slot prop is required when config.paywall.mode != 'free'."
     );
@@ -2345,19 +2562,19 @@ function AppRoot(props) {
       "[hook-template] <AppRoot>: PreAuthFlow slot prop is required when config.onboarding.trigger === 'pre_signup_custom'."
     );
   }
-  const legacyShim = (0, import_react14.useMemo)(() => buildLegacyConfigShim(config), [config]);
+  const legacyShim = (0, import_react15.useMemo)(() => buildLegacyConfigShim(config), [config]);
   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 };
   const position = config.install_prompt?.position ?? "post-paywall";
-  const subscriptionGated = /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SubscriptionGate, { Paywall: Paywall ?? FallbackPaywall, children: position === "post-paywall" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(InstallGate, { position: "post-paywall", children: [
+  const subscriptionGated = /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SubscriptionGate, { Paywall: Paywall2 ?? FallbackPaywall, children: position === "post-paywall" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(InstallGate, { position: "post-paywall", children: [
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PushPrompt, {})
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PushPrompt, {})
+  ] }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PushPrompt, {})
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PushPrompt, {})
   ] }) });
-  const authGated = /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  const authGated = /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     AuthGated,
     {
       config,
@@ -2366,18 +2583,19 @@ function AppRoot(props) {
       Forgot,
       Reset,
       EmailVerify,
-      Paywall,
+      Paywall: Paywall2,
       Onboarding,
       PreAuthFlow,
       children: subscriptionGated
     }
   );
-  const routedTree = /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Router, { ...routerProps, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DeepLinkHandler, { deepLinks: config.deepLinks }),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SessionExpiredBanner, {}),
-    position === "pre-auth" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(InstallGate, { position: "pre-auth", children: authGated }) : authGated
+  const routedTree = /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Router, { ...routerProps, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DeepLinkHandler, { deepLinks: config.deepLinks }),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SessionExpiredBanner, {}),
+    position === "pre-auth" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(InstallGate, { position: "pre-auth", children: authGated }) : authGated,
+    isDevToolsEnabled() && devSkipOnboarding ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(DevSkipOnboardingFab, { defaults: devSkipOnboarding.defaults }) : null
   ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ErrorBoundary, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(AppConfigProvider, { config, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(TemplateConfigProvider, { config: legacyShim, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(ThemeProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PersistenceRegistry, { config: config.persistedKeys, children: config.i18n ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ErrorBoundary, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(AppConfigProvider, { config, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(TemplateConfigProvider, { config: legacyShim, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(ThemeProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PersistenceRegistry, { config: config.persistedKeys, children: config.i18n ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
     I18nProvider,
     {
       defaultLocale: config.i18n.defaultLocale,
@@ -2397,37 +2615,37 @@ function AuthGated({
   EmailVerify,
   PreAuthFlow
 }) {
-  const { authStatus } = (0, import_sdk7.useHook)();
+  const { authStatus } = (0, import_sdk8.useHook)();
   if (authStatus === "loading") return null;
   if (authStatus !== "authenticated") {
     if (config.onboarding?.trigger === "pre_signup_custom" && PreAuthFlow) {
-      return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react_router_dom2.Routes, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/signin", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Login, {}) }),
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/signup", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Signup, {}) }),
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Forgot, {}) }),
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Reset, {}) }),
-        EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(EmailVerify, {}) }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/*", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PreAuthFlow, {}) })
+      return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_react_router_dom2.Routes, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/signin", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Login, {}) }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/signup", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Signup, {}) }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Forgot, {}) }),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Reset, {}) }),
+        EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(EmailVerify, {}) }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/*", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PreAuthFlow, {}) })
       ] });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_react_router_dom2.Routes, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Login, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/signup", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Signup, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Forgot, {}) }),
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Reset, {}) }),
-      EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(EmailVerify, {}) }) : null,
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Route, { path: "*", element: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react_router_dom2.Navigate, { to: "/", replace: true }) })
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_react_router_dom2.Routes, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Login, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/signup", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Signup, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Forgot, {}) }),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Reset, {}) }),
+      EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(EmailVerify, {}) }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Route, { path: "*", element: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_react_router_dom2.Navigate, { to: "/", replace: true }) })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_jsx_runtime21.Fragment, { children });
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_jsx_runtime22.Fragment, { children });
 }
 function FallbackPaywall() {
   return null;
 }
 
 // src/hooks/usePush.ts
-var import_react15 = require("react");
-var import_sdk8 = require("@hook-sdk/sdk");
+var import_react16 = require("react");
+var import_sdk9 = require("@hook-sdk/sdk");
 var DISMISS_STORAGE_KEY = "push:dismissed-until";
 var DISMISS_TTL_MS2 = 7 * 24 * 60 * 60 * 1e3;
 function detectIosNeedsInstall() {
@@ -2471,12 +2689,12 @@ function deriveState(push) {
   return { kind: "prompt" };
 }
 function usePush() {
-  const { push } = (0, import_sdk8.useHook)();
-  const [state, setState] = (0, import_react15.useState)(() => deriveState(push));
-  (0, import_react15.useEffect)(() => {
+  const { push } = (0, import_sdk9.useHook)();
+  const [state, setState] = (0, import_react16.useState)(() => deriveState(push));
+  (0, import_react16.useEffect)(() => {
     setState(deriveState(push));
   }, [push]);
-  const subscribe = (0, import_react15.useCallback)(async () => {
+  const subscribe = (0, import_react16.useCallback)(async () => {
     try {
       await push.subscribe();
       setState({ kind: "subscribed" });
@@ -2488,7 +2706,7 @@ function usePush() {
       throw e;
     }
   }, [push]);
-  const unsubscribe = (0, import_react15.useCallback)(async () => {
+  const unsubscribe = (0, import_react16.useCallback)(async () => {
     try {
       await push.unsubscribe();
       setState({ kind: "prompt" });
@@ -2497,7 +2715,7 @@ function usePush() {
       throw e;
     }
   }, [push]);
-  const dismiss = (0, import_react15.useCallback)(() => {
+  const dismiss = (0, import_react16.useCallback)(() => {
     if (typeof localStorage !== "undefined") {
       try {
         localStorage.setItem(DISMISS_STORAGE_KEY, String(Date.now() + DISMISS_TTL_MS2));
@@ -2510,27 +2728,27 @@ function usePush() {
 }
 
 // src/components/PushPrompt.tsx
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, className }) {
   const { state, subscribe } = usePush();
   if (state.kind === "denied" || state.kind === "dismissed" || state.kind === "subscribed") {
     return null;
   }
   if (state.kind === "ios_needs_install") {
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("h3", { children: texts.iosInstallTitle }),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { children: texts.iosInstallBody }),
-      onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("h3", { children: texts.iosInstallTitle }),
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { children: texts.iosInstallBody }),
+      onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
     ] });
   }
   if (state.kind === "unsupported") {
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className, role: "region", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { children: texts.unsupportedBody }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className, role: "region", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { children: texts.unsupportedBody }) });
   }
   if (state.kind === "error") {
-    return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { children: state.message }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { children: state.message }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className, role: "region", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className, role: "region", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
       "button",
       {
         type: "button",
@@ -2544,67 +2762,67 @@ function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, clas
         children: texts.cta
       }
     ),
-    onDeclined && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
+    onDeclined && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
   ] });
 }
 
 // src/components/LanguageSwitcher.tsx
-var import_sdk9 = require("@hook-sdk/sdk");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_sdk10 = require("@hook-sdk/sdk");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function LanguageSwitcher({ id, className, label = "Language" }) {
   const config = useAppConfig();
   const i18nConfig = config.i18n;
-  const [userLocale, setUserLocale] = (0, import_sdk9.usePersistedState)(
+  const [userLocale, setUserLocale] = (0, import_sdk10.usePersistedState)(
     "user-locale",
     i18nConfig?.defaultLocale ?? "en-US"
   );
   if (!i18nConfig) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("label", { className, children: [
-    label ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: label }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("label", { className, children: [
+    label ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: label }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
       "select",
       {
         id,
         value: userLocale,
         onChange: (e) => setUserLocale(e.target.value),
         "data-testid": "language-switcher",
-        children: i18nConfig.supportedLocales.map((loc) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("option", { value: loc, children: loc }, loc))
+        children: i18nConfig.supportedLocales.map((loc) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("option", { value: loc, children: loc }, loc))
       }
     )
   ] });
 }
 
 // src/defaults/LoadingState.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function LoadingState({ message }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { role: "status", "aria-live": "polite", style: { padding: 24, textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { children: message ?? "Carregando..." }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { role: "status", "aria-live": "polite", style: { padding: 24, textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { children: message ?? "Carregando..." }) });
 }
 
 // src/defaults/EmptyState.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 function EmptyState({ title, description, action }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("h2", { style: { marginBottom: 8 }, children: title }),
-    description && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("p", { style: { opacity: 0.7 }, children: description }),
-    action && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { style: { marginTop: 16 }, children: action })
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("h2", { style: { marginBottom: 8 }, children: title }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("p", { style: { opacity: 0.7 }, children: description }),
+    action && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { style: { marginTop: 16 }, children: action })
   ] });
 }
 
 // src/hooks/useLoginForm.ts
-var import_react16 = require("react");
-var import_sdk11 = require("@hook-sdk/sdk");
+var import_react17 = require("react");
+var import_sdk12 = require("@hook-sdk/sdk");
 
 // src/errors.ts
-var import_sdk10 = require("@hook-sdk/sdk");
+var import_sdk11 = require("@hook-sdk/sdk");
 function mapSdkError(err) {
-  if (err instanceof import_sdk10.SdkRateLimitError) {
+  if (err instanceof import_sdk11.SdkRateLimitError) {
     return {
       code: "rate_limited",
       message: `Aguarde ${err.retryAfter}s e tente novamente.`,
       retryAfter: err.retryAfter
     };
   }
-  if (err instanceof import_sdk10.SdkAuthError) {
+  if (err instanceof import_sdk11.SdkAuthError) {
     const detail = err.detail;
     if (detail === "email_unverified") {
       return { code: "email_unverified", message: "Confirme seu e-mail antes de entrar." };
@@ -2614,7 +2832,7 @@ function mapSdkError(err) {
     }
     return { code: "invalid_credentials", message: "E-mail ou senha inv\xE1lidos." };
   }
-  if (err instanceof import_sdk10.SdkError && err.httpStatus === 0) {
+  if (err instanceof import_sdk11.SdkError && err.httpStatus === 0) {
     return { code: "network", message: "Sem conex\xE3o com o servidor. Verifique sua internet." };
   }
   if (err instanceof TypeError) {
@@ -2627,20 +2845,20 @@ function mapSdkError(err) {
 var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 var MIN_PASSWORD = 8;
 function useLoginForm() {
-  const { auth } = (0, import_sdk11.useHook)();
-  const [email, setEmail] = (0, import_react16.useState)("");
-  const [password, setPassword] = (0, import_react16.useState)("");
-  const [submitting, setSubmitting] = (0, import_react16.useState)(false);
-  const [error, setError] = (0, import_react16.useState)(null);
-  const [touchedEmail, setTouchedEmail] = (0, import_react16.useState)(false);
-  const [touchedPassword, setTouchedPassword] = (0, import_react16.useState)(false);
-  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react16.useState)(false);
-  const validateEmail = (0, import_react16.useMemo)(() => {
+  const { auth } = (0, import_sdk12.useHook)();
+  const [email, setEmail] = (0, import_react17.useState)("");
+  const [password, setPassword] = (0, import_react17.useState)("");
+  const [submitting, setSubmitting] = (0, import_react17.useState)(false);
+  const [error, setError] = (0, import_react17.useState)(null);
+  const [touchedEmail, setTouchedEmail] = (0, import_react17.useState)(false);
+  const [touchedPassword, setTouchedPassword] = (0, import_react17.useState)(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react17.useState)(false);
+  const validateEmail = (0, import_react17.useMemo)(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE.test(email)) return "Formato de e-mail inv\xE1lido.";
     return null;
   }, [email]);
-  const validatePassword = (0, import_react16.useMemo)(() => {
+  const validatePassword = (0, import_react17.useMemo)(() => {
     if (password.length === 0) return null;
     if (password.length < MIN_PASSWORD) return `M\xEDnimo de ${MIN_PASSWORD} caracteres.`;
     return null;
@@ -2648,7 +2866,7 @@ function useLoginForm() {
   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_react16.useCallback)(async () => {
+  const submit = (0, import_react17.useCallback)(async () => {
     setFormSubmitAttempted(true);
     if (!canSubmit) return false;
     setSubmitting(true);
@@ -2682,32 +2900,32 @@ function useLoginForm() {
 }
 
 // src/hooks/useSignupForm.ts
-var import_react17 = require("react");
-var import_sdk12 = require("@hook-sdk/sdk");
+var import_react18 = require("react");
+var import_sdk13 = require("@hook-sdk/sdk");
 var EMAIL_RE2 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 var MIN_PASSWORD2 = 8;
 function useSignupForm() {
-  const { auth } = (0, import_sdk12.useHook)();
-  const [name, setName] = (0, import_react17.useState)("");
-  const [email, setEmail] = (0, import_react17.useState)("");
-  const [password, setPassword] = (0, import_react17.useState)("");
-  const [submitting, setSubmitting] = (0, import_react17.useState)(false);
-  const [error, setError] = (0, import_react17.useState)(null);
-  const [touchedName, setTouchedName] = (0, import_react17.useState)(false);
-  const [touchedEmail, setTouchedEmail] = (0, import_react17.useState)(false);
-  const [touchedPassword, setTouchedPassword] = (0, import_react17.useState)(false);
-  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react17.useState)(false);
-  const validateName = (0, import_react17.useMemo)(() => {
+  const { auth } = (0, import_sdk13.useHook)();
+  const [name, setName] = (0, import_react18.useState)("");
+  const [email, setEmail] = (0, import_react18.useState)("");
+  const [password, setPassword] = (0, import_react18.useState)("");
+  const [submitting, setSubmitting] = (0, import_react18.useState)(false);
+  const [error, setError] = (0, import_react18.useState)(null);
+  const [touchedName, setTouchedName] = (0, import_react18.useState)(false);
+  const [touchedEmail, setTouchedEmail] = (0, import_react18.useState)(false);
+  const [touchedPassword, setTouchedPassword] = (0, import_react18.useState)(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react18.useState)(false);
+  const validateName = (0, import_react18.useMemo)(() => {
     if (name.length === 0) return null;
     if (name.trim().length < 2) return "Nome muito curto.";
     return null;
   }, [name]);
-  const validateEmail = (0, import_react17.useMemo)(() => {
+  const validateEmail = (0, import_react18.useMemo)(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE2.test(email)) return "Formato de e-mail inv\xE1lido.";
     return null;
   }, [email]);
-  const validatePassword = (0, import_react17.useMemo)(() => {
+  const validatePassword = (0, import_react18.useMemo)(() => {
     if (password.length === 0) return null;
     if (password.length < MIN_PASSWORD2) return `M\xEDnimo de ${MIN_PASSWORD2} caracteres.`;
     return null;
@@ -2716,7 +2934,7 @@ function useSignupForm() {
   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_react17.useCallback)(async () => {
+  const submit = (0, import_react18.useCallback)(async () => {
     setFormSubmitAttempted(true);
     if (!canSubmit) return false;
     setSubmitting(true);
@@ -2754,25 +2972,25 @@ function useSignupForm() {
 }
 
 // src/hooks/useForgotForm.ts
-var import_react18 = require("react");
-var import_sdk13 = require("@hook-sdk/sdk");
+var import_react19 = require("react");
+var import_sdk14 = require("@hook-sdk/sdk");
 var EMAIL_RE3 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
 function useForgotForm() {
-  const { auth } = (0, import_sdk13.useHook)();
-  const [email, setEmail] = (0, import_react18.useState)("");
-  const [submitting, setSubmitting] = (0, import_react18.useState)(false);
-  const [sent, setSent] = (0, import_react18.useState)(false);
-  const [error, setError] = (0, import_react18.useState)(null);
-  const [touchedEmail, setTouchedEmail] = (0, import_react18.useState)(false);
-  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react18.useState)(false);
-  const validateEmail = (0, import_react18.useMemo)(() => {
+  const { auth } = (0, import_sdk14.useHook)();
+  const [email, setEmail] = (0, import_react19.useState)("");
+  const [submitting, setSubmitting] = (0, import_react19.useState)(false);
+  const [sent, setSent] = (0, import_react19.useState)(false);
+  const [error, setError] = (0, import_react19.useState)(null);
+  const [touchedEmail, setTouchedEmail] = (0, import_react19.useState)(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react19.useState)(false);
+  const validateEmail = (0, import_react19.useMemo)(() => {
     if (email.length === 0) return null;
     if (!EMAIL_RE3.test(email)) return "Formato de e-mail inv\xE1lido.";
     return null;
   }, [email]);
   const emailError = touchedEmail || formSubmitAttempted ? validateEmail : null;
   const canSubmit = email.length > 0 && validateEmail === null && !submitting;
-  const submit = (0, import_react18.useCallback)(async () => {
+  const submit = (0, import_react19.useCallback)(async () => {
     setFormSubmitAttempted(true);
     if (!canSubmit) return false;
     setSubmitting(true);
@@ -2803,32 +3021,32 @@ function useForgotForm() {
 }
 
 // src/hooks/useResetForm.ts
-var import_react19 = require("react");
-var import_sdk14 = require("@hook-sdk/sdk");
+var import_react20 = require("react");
+var import_sdk15 = require("@hook-sdk/sdk");
 var MIN_PASSWORD3 = 12;
 function useResetForm() {
-  const { auth } = (0, import_sdk14.useHook)();
-  const [token, setToken] = (0, import_react19.useState)(null);
-  const [password, setPassword] = (0, import_react19.useState)("");
-  const [confirm, setConfirm] = (0, import_react19.useState)("");
-  const [submitting, setSubmitting] = (0, import_react19.useState)(false);
-  const [done, setDone] = (0, import_react19.useState)(false);
-  const [error, setError] = (0, import_react19.useState)(null);
-  const [touchedPassword, setTouchedPassword] = (0, import_react19.useState)(false);
-  const [touchedConfirm, setTouchedConfirm] = (0, import_react19.useState)(false);
-  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react19.useState)(false);
-  (0, import_react19.useEffect)(() => {
+  const { auth } = (0, import_sdk15.useHook)();
+  const [token, setToken] = (0, import_react20.useState)(null);
+  const [password, setPassword] = (0, import_react20.useState)("");
+  const [confirm, setConfirm] = (0, import_react20.useState)("");
+  const [submitting, setSubmitting] = (0, import_react20.useState)(false);
+  const [done, setDone] = (0, import_react20.useState)(false);
+  const [error, setError] = (0, import_react20.useState)(null);
+  const [touchedPassword, setTouchedPassword] = (0, import_react20.useState)(false);
+  const [touchedConfirm, setTouchedConfirm] = (0, import_react20.useState)(false);
+  const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react20.useState)(false);
+  (0, import_react20.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 validatePassword = (0, import_react19.useMemo)(() => {
+  const validatePassword = (0, import_react20.useMemo)(() => {
     if (password.length === 0) return null;
     if (password.length < MIN_PASSWORD3) return `M\xEDnimo de ${MIN_PASSWORD3} caracteres.`;
     return null;
   }, [password]);
-  const validateConfirm = (0, import_react19.useMemo)(() => {
+  const validateConfirm = (0, import_react20.useMemo)(() => {
     if (confirm.length === 0) return null;
     if (confirm !== password) return "Senhas n\xE3o coincidem.";
     return null;
@@ -2836,7 +3054,7 @@ function useResetForm() {
   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_react19.useCallback)(async () => {
+  const submit = (0, import_react20.useCallback)(async () => {
     setFormSubmitAttempted(true);
     if (!canSubmit || token === null) return;
     setSubmitting(true);
@@ -2876,9 +3094,9 @@ function useResetForm() {
 }
 
 // src/hooks/usePlan.ts
-var import_sdk15 = require("@hook-sdk/sdk");
+var import_sdk16 = require("@hook-sdk/sdk");
 function usePlan() {
-  const { plan } = (0, import_sdk15.useHook)();
+  const { plan } = (0, import_sdk16.useHook)();
   return plan;
 }
 
@@ -2911,12 +3129,12 @@ function discountPercent(anchorCents, realCents) {
 }
 
 // src/hooks/useAuthPrimitives.ts
-var import_react20 = require("react");
-var import_sdk16 = require("@hook-sdk/sdk");
+var import_react21 = require("react");
+var import_sdk17 = require("@hook-sdk/sdk");
 var warned = false;
 function useAuthPrimitives() {
-  const { auth } = (0, import_sdk16.useHook)();
-  (0, import_react20.useEffect)(() => {
+  const { auth } = (0, import_sdk17.useHook)();
+  (0, import_react21.useEffect)(() => {
     if (!warned && process.env.NODE_ENV !== "production") {
       warned = true;
       console.warn(
@@ -2938,9 +3156,9 @@ function useAuthPrimitives() {
 }
 
 // src/hooks/useAuth.ts
-var import_sdk17 = require("@hook-sdk/sdk");
+var import_sdk18 = require("@hook-sdk/sdk");
 function useAuth() {
-  const { user, authStatus, auth } = (0, import_sdk17.useHook)();
+  const { user, authStatus, auth } = (0, import_sdk18.useHook)();
   return {
     user,
     authStatus,
@@ -2949,26 +3167,26 @@ function useAuth() {
 }
 
 // src/index.ts
-var import_sdk21 = require("@hook-sdk/sdk");
+var import_sdk23 = require("@hook-sdk/sdk");
 
 // src/hooks/useSubscription.ts
-var import_sdk18 = require("@hook-sdk/sdk");
+var import_sdk19 = require("@hook-sdk/sdk");
 function useSubscription() {
-  const { subscription } = (0, import_sdk18.useHook)();
+  const { subscription } = (0, import_sdk19.useHook)();
   return {
     status: subscription.status()
   };
 }
 
 // src/hooks/useReminders.ts
-var import_react21 = require("react");
-var import_sdk19 = require("@hook-sdk/sdk");
+var import_react22 = require("react");
+var import_sdk20 = require("@hook-sdk/sdk");
 function useReminders() {
-  const { push } = (0, import_sdk19.useHook)();
+  const { push } = (0, import_sdk20.useHook)();
   const r = push.reminders;
-  const [reminders, setReminders] = (0, import_react21.useState)([]);
-  const [loading, setLoading] = (0, import_react21.useState)(true);
-  const reload = (0, import_react21.useCallback)(async () => {
+  const [reminders, setReminders] = (0, import_react22.useState)([]);
+  const [loading, setLoading] = (0, import_react22.useState)(true);
+  const reload = (0, import_react22.useCallback)(async () => {
     setLoading(true);
     try {
       const next = await r.list();
@@ -2977,38 +3195,38 @@ function useReminders() {
       setLoading(false);
     }
   }, [r]);
-  (0, import_react21.useEffect)(() => {
+  (0, import_react22.useEffect)(() => {
     void reload();
   }, [reload]);
-  const setReminder = (0, import_react21.useCallback)(async (input) => {
+  const setReminder = (0, import_react22.useCallback)(async (input) => {
     await r.set(input);
     await reload();
   }, [r, reload]);
-  const deleteReminder = (0, import_react21.useCallback)(async (slot) => {
+  const deleteReminder = (0, import_react22.useCallback)(async (slot) => {
     await r.delete(slot);
     await reload();
   }, [r, reload]);
-  const schedule = (0, import_react21.useCallback)(async (items) => {
+  const schedule = (0, import_react22.useCallback)(async (items) => {
     return r.schedule(items);
   }, [r]);
-  const setFallbacks = (0, import_react21.useCallback)(async (items) => {
+  const setFallbacks = (0, import_react22.useCallback)(async (items) => {
     return r.setFallbacks(items);
   }, [r]);
   return { reminders, loading, setReminder, deleteReminder, schedule, setFallbacks };
 }
 
 // src/hooks/useToast.ts
-var import_react22 = require("react");
+var import_react23 = require("react");
 function useToast() {
-  const [items, setItems] = (0, import_react22.useState)([]);
-  const show = (0, import_react22.useCallback)((message, kind = "info") => {
+  const [items, setItems] = (0, import_react23.useState)([]);
+  const show = (0, import_react23.useCallback)((message, kind = "info") => {
     const id = `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
     setItems((prev) => [...prev, { id, message, kind }]);
     setTimeout(() => {
       setItems((prev) => prev.filter((t) => t.id !== id));
     }, 4e3);
   }, []);
-  const dismiss = (0, import_react22.useCallback)((id) => {
+  const dismiss = (0, import_react23.useCallback)((id) => {
     setItems((prev) => prev.filter((t) => t.id !== id));
   }, []);
   return { items, show, dismiss };
@@ -3016,20 +3234,20 @@ function useToast() {
 
 // src/RouteBoundary.tsx
 var import_react_router_dom3 = require("react-router-dom");
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 function RouteBoundary({ children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_router_dom3.Routes, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(import_react_router_dom3.Routes, { children: [
     children,
-    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_router_dom3.Route, { path: "*", element: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(DefaultNotFound, {}) })
+    /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_router_dom3.Route, { path: "*", element: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(DefaultNotFound, {}) })
   ] });
 }
 function DefaultNotFound() {
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { role: "alert", children: "P\xE1gina n\xE3o encontrada" });
+  return /* @__PURE__ */ (0, import_jsx_runtime27.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_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 function PreAuthShell({
   basename,
   testRouter,
@@ -3037,20 +3255,20 @@ function PreAuthShell({
   children
 }) {
   if (testRouter === "memory") {
-    return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_router_dom4.MemoryRouter, { basename, initialEntries: testInitialEntries, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_router_dom4.Routes, { children }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_router_dom4.MemoryRouter, { basename, initialEntries: testInitialEntries, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_router_dom4.Routes, { children }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_router_dom4.BrowserRouter, { basename, children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_react_router_dom4.Routes, { children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_router_dom4.BrowserRouter, { basename, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_react_router_dom4.Routes, { children }) });
 }
 
 // src/OnboardingFlow.tsx
-var import_react24 = require("react");
-var import_sdk20 = require("@hook-sdk/sdk");
+var import_react25 = require("react");
+var import_sdk21 = require("@hook-sdk/sdk");
 
 // src/hooks/useOnboardingStep.ts
-var import_react23 = require("react");
-var OnboardingStepContext = (0, import_react23.createContext)(null);
+var import_react24 = require("react");
+var OnboardingStepContext = (0, import_react24.createContext)(null);
 function useOnboardingStep() {
-  const ctx = (0, import_react23.useContext)(OnboardingStepContext);
+  const ctx = (0, import_react24.useContext)(OnboardingStepContext);
   if (!ctx) {
     throw new Error(
       "[hook-template] useOnboardingStep must be used inside <OnboardingFlow>. (G75)"
@@ -3060,7 +3278,7 @@ function useOnboardingStep() {
 }
 
 // src/OnboardingFlow.tsx
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var isFilled = (v) => v != null && v !== "";
 var CURRENT_STEP_FIELD = "currentStep";
 function readPersistedStepIdx(draft) {
@@ -3073,12 +3291,12 @@ function OnboardingFlow({
   onComplete,
   persistKey
 }) {
-  const [draft, setDraft, status] = (0, import_sdk20.usePersistedState)(persistKey, {});
-  const draftRef = (0, import_react24.useRef)(draft);
+  const [draft, setDraft, status] = (0, import_sdk21.usePersistedState)(persistKey, {});
+  const draftRef = (0, import_react25.useRef)(draft);
   draftRef.current = draft;
   const idx = readPersistedStepIdx(draft);
   const clampedIdx = Math.min(Math.max(idx, 0), Math.max(steps.length - 1, 0));
-  const setIdx = (0, import_react24.useCallback)(
+  const setIdx = (0, import_react25.useCallback)(
     (n) => {
       setDraft((prev) => {
         const prevIdx = readPersistedStepIdx(prev);
@@ -3088,7 +3306,7 @@ function OnboardingFlow({
     },
     [setDraft]
   );
-  const setValue = (0, import_react24.useCallback)(
+  const setValue = (0, import_react25.useCallback)(
     (patch) => {
       draftRef.current = { ...draftRef.current, ...patch };
       setDraft((prev) => ({ ...prev, ...patch }));
@@ -3096,9 +3314,9 @@ function OnboardingFlow({
     [setDraft]
   );
   const step = steps[clampedIdx];
-  const hookCtx = (0, import_sdk20.useHook)();
+  const hookCtx = (0, import_sdk21.useHook)();
   const track2 = typeof hookCtx.track === "function" ? hookCtx.track : void 0;
-  (0, import_react24.useEffect)(() => {
+  (0, import_react25.useEffect)(() => {
     if (status.loading) return;
     if (!step) return;
     if (!track2) return;
@@ -3108,11 +3326,11 @@ function OnboardingFlow({
       total_steps: steps.length
     });
   }, [step?.id, clampedIdx, steps.length, status.loading, track2]);
-  const valid = (0, import_react24.useMemo)(
+  const valid = (0, import_react25.useMemo)(
     () => step ? (step.validates ?? []).every((field) => isFilled(draft[field])) : false,
     [draft, step]
   );
-  const next = (0, import_react24.useCallback)(() => {
+  const next = (0, import_react25.useCallback)(() => {
     if (!step) return;
     const current = draftRef.current;
     const validNow = (step.validates ?? []).every((field) => isFilled(current[field]));
@@ -3123,8 +3341,8 @@ function OnboardingFlow({
       setIdx(clampedIdx + 1);
     }
   }, [clampedIdx, onComplete, step, steps.length, setIdx]);
-  const prevStep = (0, import_react24.useCallback)(() => setIdx((i) => Math.max(0, i - 1)), [setIdx]);
-  const ctx = (0, import_react24.useMemo)(
+  const prevStep = (0, import_react25.useCallback)(() => setIdx((i) => Math.max(0, i - 1)), [setIdx]);
+  const ctx = (0, import_react25.useMemo)(
     () => ({
       stepIndex: clampedIdx,
       totalSteps: steps.length,
@@ -3150,7 +3368,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_runtime28.jsx)(OnboardingStepContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Screen, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(OnboardingStepContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Screen, {}) });
 }
 
 // src/hooks/useFeature.ts
@@ -3158,12 +3376,299 @@ function useFeature(name) {
   const config = useAppConfig();
   return Array.isArray(config.features_enabled) && config.features_enabled.includes(name);
 }
+
+// src/components/paywall/Paywall.tsx
+var import_react26 = require("react");
+var import_sdk22 = require("@hook-sdk/sdk");
+
+// src/components/paywall/PaywallMethodTabs.tsx
+var import_jsx_runtime30 = require("react/jsx-runtime");
+function PaywallMethodTabs({
+  methods,
+  selected,
+  onSelect,
+  labels,
+  className,
+  tabClassName,
+  tabActiveClassName
+}) {
+  if (methods.length < 2) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { role: "tablist", "aria-label": "M\xE9todo de pagamento", className, children: methods.map((m) => {
+    const active = m === selected;
+    const label = labels[m] ?? m;
+    return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+      "button",
+      {
+        type: "button",
+        role: "tab",
+        "aria-selected": active,
+        "aria-controls": `paywall-tab-${m}`,
+        tabIndex: active ? 0 : -1,
+        onClick: () => onSelect(m),
+        className: [tabClassName, active ? tabActiveClassName : ""].filter(Boolean).join(" "),
+        children: label
+      },
+      m
+    );
+  }) });
+}
+
+// src/components/paywall/PaywallMethodContent.tsx
+var import_jsx_runtime31 = require("react/jsx-runtime");
+function PaywallMethodContent({
+  method,
+  copy,
+  hasConsumedTrial = false,
+  className,
+  rowClassName
+}) {
+  const useCardConsumed = method === "card" && hasConsumedTrial && copy.cardConsumedTrial;
+  const rows = useCardConsumed ? copy.cardConsumedTrial.bodyRows : method === "pix-auto" || method === "pix-once" ? copy.pix.bodyRows : copy.card.bodyRows;
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { role: "tabpanel", id: `paywall-tab-${method}`, className, children: rows.map((row, i) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: rowClassName, children: row }, i)) });
+}
+
+// src/components/paywall/PaywallCyclePicker.tsx
+var import_jsx_runtime32 = require("react/jsx-runtime");
+function PaywallCyclePicker({
+  cycles,
+  selected,
+  onSelect,
+  priceCentsByCycle,
+  anchorCentsByCycle,
+  monthlyEquivByCycle,
+  labels,
+  className,
+  cardClassName,
+  cardSelectedClassName,
+  anchorClassName
+}) {
+  if (cycles.length < 2) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { role: "radiogroup", "aria-label": "Ciclo de cobran\xE7a", className, children: cycles.map((c) => {
+    const active = c === selected;
+    const label = c === "YEARLY" ? labels.annualLabel : labels.monthlyLabel;
+    const suffix = c === "YEARLY" ? labels.annualSuffix : labels.monthlySuffix;
+    const mainCents = c === "YEARLY" ? monthlyEquivByCycle[c] : priceCentsByCycle[c];
+    const anchorCents = anchorCentsByCycle[c];
+    return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+      "button",
+      {
+        type: "button",
+        role: "radio",
+        "aria-checked": active,
+        onClick: () => onSelect(c),
+        className: ["flex flex-col items-center gap-0.5", cardClassName, active ? cardSelectedClassName : ""].filter(Boolean).join(" "),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "font-bold text-base leading-tight", children: formatBRL(mainCents) }),
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-xs opacity-70 leading-tight", children: suffix }),
+          /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "text-xs opacity-60 leading-tight", children: label }),
+          anchorCents != null && anchorCents > mainCents ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: anchorClassName ?? "text-xs opacity-50", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("s", { children: formatBRL(anchorCents) }) }) : null
+        ]
+      },
+      c
+    );
+  }) });
+}
+
+// src/components/paywall/PaywallCta.tsx
+var import_jsx_runtime33 = require("react/jsx-runtime");
+function PaywallCta({
+  ctaLabel,
+  loadingLabel,
+  switchHint,
+  trustLine,
+  onClick,
+  disabled = false,
+  loading = false,
+  className,
+  buttonClassName,
+  switchHintClassName,
+  trustClassName
+}) {
+  const label = loading && loadingLabel ? loadingLabel : ctaLabel;
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+      "button",
+      {
+        type: "button",
+        onClick,
+        disabled: disabled || loading,
+        className: buttonClassName,
+        children: label
+      }
+    ),
+    switchHint ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("p", { className: switchHintClassName, children: switchHint }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("p", { className: trustClassName, children: trustLine })
+  ] });
+}
+
+// src/components/paywall/Paywall.tsx
+var import_jsx_runtime34 = require("react/jsx-runtime");
+var NBSP = "\xA0";
+function Paywall({
+  copy,
+  themeClasses = {},
+  slots = {},
+  onBeforeCheckout
+}) {
+  const { track: track2 } = (0, import_sdk22.useHook)();
+  const s = usePaywallState();
+  const priceLabel = formatBRL(s.currentPriceCents).replace(new RegExp(NBSP, "g"), " ");
+  const monthlyEquivLabel = formatBRL(s.currentMonthlyEquivCents).replace(new RegExp(NBSP, "g"), " ");
+  const trialDaysCardLabel = String(s.trialDaysCard);
+  const ctaLabel = (0, import_react26.useMemo)(() => {
+    if (s.isFree) return copy.freeCta ?? "Come\xE7ar agora";
+    if (s.selectedMethod === "card") {
+      if (s.hasConsumedTrial && copy.cardConsumedTrial) {
+        return interp(copy.cardConsumedTrial.ctaTemplate, { price: priceLabel, days: trialDaysCardLabel });
+      }
+      if (s.trialDaysCard > 0) {
+        return interp(copy.card.ctaTemplate, { price: priceLabel, days: trialDaysCardLabel });
+      }
+      return copy.cardConsumedTrial ? interp(copy.cardConsumedTrial.ctaTemplate, { price: priceLabel, days: trialDaysCardLabel }) : `Assinar por ${priceLabel}`;
+    }
+    return interp(copy.pix.ctaTemplate, { price: priceLabel, days: trialDaysCardLabel });
+  }, [
+    s.isFree,
+    s.selectedMethod,
+    s.hasConsumedTrial,
+    s.trialDaysCard,
+    copy,
+    priceLabel,
+    trialDaysCardLabel
+  ]);
+  const switchHint = (0, import_react26.useMemo)(() => {
+    if (s.methods.length < 2) return void 0;
+    return s.selectedMethod === "card" ? copy.card.switchHint : copy.pix.switchHint;
+  }, [s.methods.length, s.selectedMethod, copy]);
+  (0, import_react26.useEffect)(() => {
+    if (!s.initialLoadComplete) return;
+    track2("paywall_view", {
+      default_method: s.selectedMethod,
+      default_cycle: s.cycle,
+      available_methods: s.methods
+    });
+  }, [s.initialLoadComplete]);
+  const handleCta = async () => {
+    track2("paywall_cta_clicked", {
+      method: s.selectedMethod,
+      cycle: s.cycle,
+      price_cents: s.currentPriceCents,
+      had_consumed_trial: s.hasConsumedTrial
+    });
+    if (onBeforeCheckout) {
+      await onBeforeCheckout(s.selectedMethod, s.cycle);
+      return;
+    }
+    await s.submit();
+  };
+  const ctaTheme = s.selectedMethod === "card" ? themeClasses.ctaCard : themeClasses.ctaPix;
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: themeClasses.container, children: [
+    slots.heroSlot,
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("h1", { className: themeClasses.headline, children: copy.headline }),
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("ul", { children: copy.features.map((f) => /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("li", { className: themeClasses.feature, children: [
+      "\u2713 ",
+      /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { children: f })
+    ] }, f)) }),
+    copy.socialProof ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: themeClasses.socialProof, children: copy.socialProof }) : null,
+    slots.cyclePickerSlot ?? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      PaywallCyclePicker,
+      {
+        cycles: ["MONTHLY", "YEARLY"],
+        selected: s.cycle,
+        onSelect: s.selectCycle,
+        priceCentsByCycle: {
+          MONTHLY: priceCentsForCycle(s, "MONTHLY"),
+          YEARLY: priceCentsForCycle(s, "YEARLY")
+        },
+        anchorCentsByCycle: {
+          MONTHLY: anchorForCycle(s, "MONTHLY"),
+          YEARLY: anchorForCycle(s, "YEARLY")
+        },
+        monthlyEquivByCycle: {
+          MONTHLY: priceCentsForCycle(s, "MONTHLY"),
+          YEARLY: Math.round(priceCentsForCycle(s, "YEARLY") / 12)
+        },
+        labels: copy.cycle,
+        cardClassName: themeClasses.cycleCard,
+        cardSelectedClassName: themeClasses.cycleCardSelected,
+        anchorClassName: themeClasses.anchorPrice
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      PaywallMethodTabs,
+      {
+        methods: s.methods,
+        selected: s.selectedMethod,
+        onSelect: s.selectMethod,
+        labels: { "pix-auto": copy.pix.tabLabel, card: copy.card.tabLabel },
+        className: themeClasses.tabs,
+        tabClassName: themeClasses.tab,
+        tabActiveClassName: themeClasses.tabActive
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      PaywallMethodContent,
+      {
+        method: s.selectedMethod,
+        copy: {
+          pix: interpolateCopy(copy.pix, priceLabel, trialDaysCardLabel),
+          card: interpolateCopy(copy.card, priceLabel, trialDaysCardLabel),
+          cardConsumedTrial: copy.cardConsumedTrial ? {
+            bodyRows: copy.cardConsumedTrial.bodyRows.map(
+              (r) => interp(r, { price: priceLabel, days: trialDaysCardLabel })
+            ),
+            ctaTemplate: copy.cardConsumedTrial.ctaTemplate
+          } : void 0
+        },
+        hasConsumedTrial: s.hasConsumedTrial,
+        className: themeClasses.tabContent,
+        rowClassName: themeClasses.tabContentRow
+      }
+    ),
+    slots.beforeCtaSlot,
+    /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+      PaywallCta,
+      {
+        ctaLabel,
+        loadingLabel: "Abrindo checkout\u2026",
+        switchHint,
+        trustLine: copy.trustLine,
+        onClick: handleCta,
+        disabled: s.submitting,
+        loading: s.submitting,
+        buttonClassName: ctaTheme,
+        switchHintClassName: themeClasses.switchHint,
+        trustClassName: themeClasses.trustLine
+      }
+    )
+  ] });
+}
+function interp(tpl, vars) {
+  return tpl.replace(/\{(\w+)\}/g, (_m, k) => vars[k] ?? "");
+}
+function interpolateCopy(m, price, days) {
+  return {
+    tabLabel: m.tabLabel,
+    bodyRows: m.bodyRows.map((r) => interp(r, { price, days })),
+    ctaTemplate: m.ctaTemplate,
+    switchHint: m.switchHint
+  };
+}
+function priceCentsForCycle(s, c) {
+  return s.plan ? c === "YEARLY" ? s.plan.yearlyCents ?? 0 : s.plan.monthlyCents : 0;
+}
+function anchorForCycle(s, c) {
+  if (!s.plan) return null;
+  if (c === "YEARLY") return s.plan.anchorYearlyCents ?? null;
+  return s.plan.anchorMonthlyCents ?? null;
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AppConfigProvider,
   AppConfigSchema,
   AppRoot,
   DeepLinkHandler,
+  DevSkipOnboardingFab,
   EmptyState,
   ErrorBoundary,
   I18nProvider,
@@ -3173,6 +3678,11 @@ function useFeature(name) {
   LoadingState,
   OnboardingFlow,
   PaymentReturnHandler,
+  Paywall,
+  PaywallCta,
+  PaywallCyclePicker,
+  PaywallMethodContent,
+  PaywallMethodTabs,
   PersistenceRegistry,
   PreAuthShell,
   PushPrompt,
@@ -3187,10 +3697,12 @@ function useFeature(name) {
   detectStandalone,
   discountPercent,
   formatBRL,
+  isDevToolsEnabled,
   monthlyFromYearly,
   parseAppConfig,
   shouldBlockInstall,
   shouldShowPermanentOption,
+  skipOnboarding,
   useAppConfig,
   useAuth,
   useAuthPrimitives,