@hook-sdk/template 0.1.0

package/dist/index.cjs

@@ -0,0 +1,790 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  AppRoot: () => AppRoot,
+  DefaultForgotScreen: () => DefaultForgotScreen,
+  DefaultLoginScreen: () => DefaultLoginScreen,
+  DefaultPaywall: () => DefaultPaywall,
+  DefaultResetScreen: () => DefaultResetScreen,
+  DefaultSignupScreen: () => DefaultSignupScreen,
+  EmptyState: () => EmptyState,
+  ErrorBoundary: () => ErrorBoundary,
+  LoadingState: () => LoadingState,
+  useAuth: () => useAuth,
+  useAuthPrimitives: () => useAuthPrimitives,
+  useForgotForm: () => useForgotForm,
+  useLoginForm: () => useLoginForm,
+  usePaywallState: () => usePaywallState,
+  usePush: () => usePush,
+  useResetForm: () => useResetForm,
+  useSignupForm: () => useSignupForm,
+  useSubscription: () => useSubscription,
+  useToast: () => useToast
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/internal/TemplateConfigContext.tsx
+var import_react = require("react");
+var import_jsx_runtime = require("react/jsx-runtime");
+var TemplateConfigContext = (0, import_react.createContext)(null);
+function TemplateConfigProvider({
+  config,
+  children
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TemplateConfigContext.Provider, { value: config, children });
+}
+function useTemplateConfig() {
+  const ctx = (0, import_react.useContext)(TemplateConfigContext);
+  if (ctx === null) {
+    throw new Error("useTemplateConfig must be used inside <TemplateConfigProvider>");
+  }
+  return ctx;
+}
+
+// src/internal/ThemeProvider.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function ThemeProvider({ children }) {
+  const config = useTemplateConfig();
+  const style = {
+    "--hook-color-primary": config.theme.primary_color,
+    ...config.theme.background_color && {
+      "--hook-color-background": config.theme.background_color
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style, children });
+}
+
+// src/internal/AuthGate.tsx
+var import_react2 = require("react");
+
+// src/hooks/useAuth.ts
+var import_sdk = require("@hook-sdk/sdk");
+function useAuth() {
+  const { user, authStatus, auth } = (0, import_sdk.useHook)();
+  return {
+    user,
+    authStatus,
+    refresh: auth.refresh
+  };
+}
+
+// src/defaults/LoadingState.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function LoadingState({ message }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { role: "status", "aria-live": "polite", style: { padding: 24, textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: message ?? "Carregando..." }) });
+}
+
+// src/internal/AuthGate.tsx
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function detectResetFromUrl() {
+  if (typeof window === "undefined") return false;
+  const params = new URLSearchParams(window.location.search);
+  return params.get("token") !== null && params.get("screen") === "reset";
+}
+function AuthGate({ Login, Signup, Forgot, Reset, children }) {
+  const { user, authStatus } = useAuth();
+  const [screen, setScreen] = (0, import_react2.useState)(
+    () => detectResetFromUrl() ? "reset" : "login"
+  );
+  (0, import_react2.useEffect)(() => {
+    if (user && screen !== "login") {
+      setScreen("login");
+    }
+  }, [user, screen]);
+  (0, import_react2.useEffect)(() => {
+    const onPop = () => {
+      if (detectResetFromUrl()) setScreen("reset");
+    };
+    window.addEventListener("popstate", onPop);
+    return () => window.removeEventListener("popstate", onPop);
+  }, []);
+  if (authStatus === "loading") return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(LoadingState, {});
+  if (!user) {
+    if (screen === "reset") return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Reset, { onNavigate: setScreen });
+    if (screen === "signup") return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Signup, { onNavigate: setScreen });
+    if (screen === "forgot") return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Forgot, { onNavigate: setScreen });
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Login, { onNavigate: setScreen });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children });
+}
+
+// src/hooks/usePaywallState.ts
+var import_react3 = require("react");
+var import_sdk2 = require("@hook-sdk/sdk");
+function usePaywallState() {
+  const { subscription } = (0, import_sdk2.useHook)();
+  const [opening, setOpening] = (0, import_react3.useState)(false);
+  const [error, setError] = (0, import_react3.useState)(null);
+  const status = subscription.status();
+  const daysLeftInTrial = subscription.daysLeftInTrial();
+  const checkout = (0, import_react3.useCallback)(
+    async (args) => {
+      setOpening(true);
+      setError(null);
+      try {
+        const result = await subscription.checkoutCard({
+          cpf: args.cpf,
+          cycle: args.cycle ?? "MONTHLY"
+        });
+        window.location.href = result.invoiceUrl;
+      } catch (err) {
+        setError(err);
+        setOpening(false);
+      }
+    },
+    [subscription]
+  );
+  const cancel = (0, import_react3.useCallback)(async () => {
+    try {
+      await subscription.cancel();
+      await subscription.refresh();
+    } catch (err) {
+      setError(err);
+    }
+  }, [subscription]);
+  return { status, daysLeftInTrial, checkout, cancel, opening, error };
+}
+
+// src/internal/SubscriptionGate.tsx
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function SubscriptionGate({ Paywall, children }) {
+  const { status } = usePaywallState();
+  if (status === "expired" || status === "canceled" || status === "past_due") {
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Paywall, {});
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_jsx_runtime5.Fragment, { children });
+}
+
+// src/internal/PushPrompt.tsx
+function PushPrompt() {
+  return null;
+}
+
+// src/defaults/ErrorBoundary.tsx
+var import_react4 = require("react");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var ErrorBoundary = class extends import_react4.Component {
+  state = { error: null };
+  static getDerivedStateFromError(error) {
+    return { error };
+  }
+  componentDidCatch(error) {
+    console.error("[ErrorBoundary] caught", error);
+  }
+  render() {
+    if (this.state.error) {
+      return this.props.fallback ?? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { role: "alert", style: { padding: 24, textAlign: "center" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h2", { children: "Algo deu errado" }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { style: { opacity: 0.7 }, children: "Recarregue a p\xE1gina pra tentar de novo." })
+      ] });
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_jsx_runtime6.Fragment, { children: this.props.children });
+  }
+};
+
+// src/hooks/useLoginForm.ts
+var import_react5 = require("react");
+var import_sdk4 = require("@hook-sdk/sdk");
+
+// src/errors.ts
+var import_sdk3 = require("@hook-sdk/sdk");
+function mapSdkError(err) {
+  if (err instanceof import_sdk3.SdkRateLimitError) {
+    return {
+      code: "rate_limited",
+      message: `Aguarde ${err.retryAfter}s e tente novamente.`,
+      retryAfter: err.retryAfter
+    };
+  }
+  if (err instanceof import_sdk3.SdkAuthError) {
+    const detail = err.detail;
+    if (detail === "email_unverified") {
+      return { code: "email_unverified", message: "Confirme seu e-mail antes de entrar." };
+    }
+    if (detail === "account_locked") {
+      return { code: "account_locked", message: "Conta bloqueada. Contate o suporte." };
+    }
+    return { code: "invalid_credentials", message: "E-mail ou senha inv\xE1lidos." };
+  }
+  if (err instanceof import_sdk3.SdkError && err.httpStatus === 0) {
+    return { code: "network", message: "Sem conex\xE3o com o servidor. Verifique sua internet." };
+  }
+  if (err instanceof TypeError) {
+    return { code: "network", message: "Sem conex\xE3o com o servidor. Verifique sua internet." };
+  }
+  return { code: "server", message: "Algo deu errado. Tente novamente em instantes." };
+}
+
+// src/hooks/useLoginForm.ts
+var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+var MIN_PASSWORD = 8;
+function useLoginForm() {
+  const { auth } = (0, import_sdk4.useHook)();
+  const [email, setEmail] = (0, import_react5.useState)("");
+  const [password, setPassword] = (0, import_react5.useState)("");
+  const [submitting, setSubmitting] = (0, import_react5.useState)(false);
+  const [error, setError] = (0, import_react5.useState)(null);
+  const emailError = (0, import_react5.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_react5.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 submit = (0, import_react5.useCallback)(async () => {
+    if (!canSubmit) return;
+    setSubmitting(true);
+    setError(null);
+    try {
+      await auth.login({ email, password });
+    } catch (err) {
+      setError(mapSdkError(err));
+    } finally {
+      setSubmitting(false);
+    }
+  }, [auth, email, password, canSubmit]);
+  return {
+    email,
+    setEmail,
+    emailError,
+    password,
+    setPassword,
+    passwordError,
+    submit,
+    submitting,
+    canSubmit,
+    error
+  };
+}
+
+// src/defaults/DefaultLoginScreen.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function DefaultLoginScreen({ onNavigate }) {
+  const { name } = useTemplateConfig();
+  const f = useLoginForm();
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h1", { style: { marginBottom: 8 }, children: name }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Entre na sua conta" }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("form", { onSubmit: (e) => {
+      e.preventDefault();
+      void f.submit();
+    }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { style: { display: "block", marginBottom: 12 }, children: [
+        "E-mail",
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          "input",
+          {
+            "data-testid": "login-email",
+            type: "email",
+            value: f.email,
+            onChange: (e) => f.setEmail(e.target.value),
+            style: { display: "block", width: "100%" }
+          }
+        ),
+        f.emailError && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("small", { style: { color: "#c00" }, children: f.emailError })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { style: { display: "block", marginBottom: 12 }, children: [
+        "Senha",
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          "input",
+          {
+            "data-testid": "login-password",
+            type: "password",
+            value: f.password,
+            onChange: (e) => f.setPassword(e.target.value),
+            style: { display: "block", width: "100%" }
+          }
+        ),
+        f.passwordError && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("small", { style: { color: "#c00" }, children: f.passwordError })
+      ] }),
+      f.error && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        "button",
+        {
+          "data-testid": "login-submit",
+          type: "submit",
+          disabled: !f.canSubmit,
+          style: {
+            width: "100%",
+            padding: 12,
+            background: "var(--hook-color-primary)",
+            color: "#fff",
+            border: "none",
+            borderRadius: 8,
+            opacity: f.canSubmit ? 1 : 0.5
+          },
+          children: f.submitting ? "Entrando..." : "Entrar"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { marginTop: 16, display: "flex", justifyContent: "space-between" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { "data-testid": "login-goto-signup", type: "button", onClick: () => onNavigate("signup"), style: { background: "none", border: "none", cursor: "pointer" }, children: "Criar conta" }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("button", { "data-testid": "login-goto-forgot", type: "button", onClick: () => onNavigate("forgot"), style: { background: "none", border: "none", cursor: "pointer" }, children: "Esqueci senha" })
+    ] })
+  ] });
+}
+
+// src/hooks/useSignupForm.ts
+var import_react6 = require("react");
+var import_sdk5 = require("@hook-sdk/sdk");
+var EMAIL_RE2 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+var MIN_PASSWORD2 = 8;
+function useSignupForm() {
+  const { auth } = (0, import_sdk5.useHook)();
+  const [name, setName] = (0, import_react6.useState)("");
+  const [email, setEmail] = (0, import_react6.useState)("");
+  const [password, setPassword] = (0, import_react6.useState)("");
+  const [submitting, setSubmitting] = (0, import_react6.useState)(false);
+  const [error, setError] = (0, import_react6.useState)(null);
+  const nameError = (0, import_react6.useMemo)(() => {
+    if (name.length === 0) return null;
+    if (name.trim().length < 2) return "Nome muito curto.";
+    return null;
+  }, [name]);
+  const emailError = (0, import_react6.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_react6.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 submit = (0, import_react6.useCallback)(async () => {
+    if (!canSubmit) return;
+    setSubmitting(true);
+    setError(null);
+    try {
+      await auth.signup({ name, email, password });
+    } catch (err) {
+      setError(mapSdkError(err));
+    } finally {
+      setSubmitting(false);
+    }
+  }, [auth, name, email, password, canSubmit]);
+  return {
+    name,
+    setName,
+    nameError,
+    email,
+    setEmail,
+    emailError,
+    password,
+    setPassword,
+    passwordError,
+    submit,
+    submitting,
+    canSubmit,
+    error
+  };
+}
+
+// src/defaults/DefaultSignupScreen.tsx
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function DefaultSignupScreen({ onNavigate }) {
+  const { name } = useTemplateConfig();
+  const f = useSignupForm();
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h1", { style: { marginBottom: 8 }, children: name }),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Criar sua conta" }),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("form", { onSubmit: (e) => {
+      e.preventDefault();
+      void f.submit();
+    }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("label", { style: { display: "block", marginBottom: 12 }, children: [
+        "Nome",
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("input", { "data-testid": "signup-name", value: f.name, onChange: (e) => f.setName(e.target.value), style: { display: "block", width: "100%" } }),
+        f.nameError && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("small", { style: { color: "#c00" }, children: f.nameError })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("label", { style: { display: "block", marginBottom: 12 }, children: [
+        "E-mail",
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("input", { "data-testid": "signup-email", type: "email", value: f.email, onChange: (e) => f.setEmail(e.target.value), style: { display: "block", width: "100%" } }),
+        f.emailError && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("small", { style: { color: "#c00" }, children: f.emailError })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("label", { style: { display: "block", marginBottom: 12 }, children: [
+        "Senha",
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("input", { "data-testid": "signup-password", type: "password", value: f.password, onChange: (e) => f.setPassword(e.target.value), style: { display: "block", width: "100%" } }),
+        f.passwordError && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("small", { style: { color: "#c00" }, children: f.passwordError })
+      ] }),
+      f.error && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
+      /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { "data-testid": "signup-submit", type: "submit", disabled: !f.canSubmit, style: { width: "100%", padding: 12, background: "var(--hook-color-primary)", color: "#fff", border: "none", borderRadius: 8, opacity: f.canSubmit ? 1 : 0.5 }, children: f.submitting ? "Criando..." : "Criar conta" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { style: { marginTop: 16 }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("button", { "data-testid": "signup-goto-login", type: "button", onClick: () => onNavigate("login"), style: { background: "none", border: "none", cursor: "pointer" }, children: "J\xE1 tem conta? Entre" }) })
+  ] });
+}
+
+// src/hooks/useForgotForm.ts
+var import_react7 = require("react");
+var import_sdk6 = require("@hook-sdk/sdk");
+var EMAIL_RE3 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+function useForgotForm() {
+  const { auth } = (0, import_sdk6.useHook)();
+  const [email, setEmail] = (0, import_react7.useState)("");
+  const [submitting, setSubmitting] = (0, import_react7.useState)(false);
+  const [sent, setSent] = (0, import_react7.useState)(false);
+  const [error, setError] = (0, import_react7.useState)(null);
+  const emailError = (0, import_react7.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 submit = (0, import_react7.useCallback)(async () => {
+    if (!canSubmit) return;
+    setSubmitting(true);
+    setError(null);
+    try {
+      await auth.forgot({ email });
+      setSent(true);
+    } catch (err) {
+      setError(mapSdkError(err));
+    } finally {
+      setSubmitting(false);
+    }
+  }, [auth, email, canSubmit]);
+  return {
+    email,
+    setEmail,
+    emailError,
+    submit,
+    submitting,
+    canSubmit,
+    sent,
+    error
+  };
+}
+
+// src/defaults/DefaultForgotScreen.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function DefaultForgotScreen({ onNavigate }) {
+  const { name } = useTemplateConfig();
+  const f = useForgotForm();
+  if (f.sent) {
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto", textAlign: "center" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h1", { children: "Verifique seu e-mail" }),
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { style: { opacity: 0.7 }, children: "Enviamos um link pra redefinir sua senha." }),
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { "data-testid": "forgot-back-login", type: "button", onClick: () => onNavigate("login"), children: "Voltar pro login" })
+    ] });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("h1", { style: { marginBottom: 8 }, children: name }),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Redefinir senha" }),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("form", { onSubmit: (e) => {
+      e.preventDefault();
+      void f.submit();
+    }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { style: { display: "block", marginBottom: 12 }, children: [
+        "E-mail",
+        /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("input", { "data-testid": "forgot-email", type: "email", value: f.email, onChange: (e) => f.setEmail(e.target.value), style: { display: "block", width: "100%" } }),
+        f.emailError && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("small", { style: { color: "#c00" }, children: f.emailError })
+      ] }),
+      f.error && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { "data-testid": "forgot-submit", type: "submit", disabled: !f.canSubmit, style: { width: "100%", padding: 12, background: "var(--hook-color-primary)", color: "#fff", border: "none", borderRadius: 8, opacity: f.canSubmit ? 1 : 0.5 }, children: f.submitting ? "Enviando..." : "Enviar link" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { style: { marginTop: 16 }, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("button", { "data-testid": "forgot-goto-login", type: "button", onClick: () => onNavigate("login"), style: { background: "none", border: "none", cursor: "pointer" }, children: "Voltar pro login" }) })
+  ] });
+}
+
+// src/hooks/useResetForm.ts
+var import_react8 = require("react");
+var import_sdk7 = require("@hook-sdk/sdk");
+var MIN_PASSWORD3 = 12;
+function useResetForm() {
+  const { auth } = (0, import_sdk7.useHook)();
+  const [token, setToken] = (0, import_react8.useState)(null);
+  const [password, setPassword] = (0, import_react8.useState)("");
+  const [confirm, setConfirm] = (0, import_react8.useState)("");
+  const [submitting, setSubmitting] = (0, import_react8.useState)(false);
+  const [done, setDone] = (0, import_react8.useState)(false);
+  const [error, setError] = (0, import_react8.useState)(null);
+  (0, import_react8.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_react8.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_react8.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 submit = (0, import_react8.useCallback)(async () => {
+    if (!canSubmit || token === null) return;
+    setSubmitting(true);
+    setError(null);
+    try {
+      await auth.reset({ token, newPassword: password });
+      setDone(true);
+      if (typeof window !== "undefined") {
+        const url = new URL(window.location.href);
+        url.searchParams.delete("token");
+        url.searchParams.delete("screen");
+        window.history.replaceState({}, "", url.toString());
+      }
+    } catch (err) {
+      setError(mapSdkError(err));
+    } finally {
+      setSubmitting(false);
+    }
+  }, [auth, token, password, canSubmit]);
+  return {
+    token,
+    password,
+    setPassword,
+    passwordError,
+    confirm,
+    setConfirm,
+    confirmError,
+    submit,
+    submitting,
+    canSubmit,
+    done,
+    error
+  };
+}
+
+// src/defaults/DefaultResetScreen.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+function DefaultResetScreen({ onNavigate }) {
+  const { name } = useTemplateConfig();
+  const f = useResetForm();
+  if (f.done) {
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto", textAlign: "center" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h1", { children: "Senha alterada" }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { style: { opacity: 0.7 }, children: "Agora \xE9 s\xF3 fazer login com a nova senha." }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("button", { "data-testid": "reset-back-login", type: "button", onClick: () => onNavigate("login"), children: "Ir pro login" })
+    ] });
+  }
+  if (f.token === null) {
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto", textAlign: "center" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h1", { children: "Link inv\xE1lido" }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { style: { opacity: 0.7 }, children: "Pe\xE7a um novo link de reset." }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("button", { "data-testid": "reset-goto-forgot", type: "button", onClick: () => onNavigate("forgot"), children: "Pedir novo link" })
+    ] });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("main", { style: { padding: 24, maxWidth: 360, margin: "0 auto" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("h1", { style: { marginBottom: 8 }, children: name }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("p", { style: { opacity: 0.7, marginBottom: 24 }, children: "Escolha uma nova senha" }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("form", { onSubmit: (e) => {
+      e.preventDefault();
+      void f.submit();
+    }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("label", { style: { display: "block", marginBottom: 12 }, children: [
+        "Nova senha",
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("input", { "data-testid": "reset-password", type: "password", value: f.password, onChange: (e) => f.setPassword(e.target.value), style: { display: "block", width: "100%" }, autoComplete: "new-password" }),
+        f.passwordError && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("small", { style: { color: "#c00" }, children: f.passwordError })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("label", { style: { display: "block", marginBottom: 12 }, children: [
+        "Confirmar senha",
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("input", { "data-testid": "reset-confirm", type: "password", value: f.confirm, onChange: (e) => f.setConfirm(e.target.value), style: { display: "block", width: "100%" }, autoComplete: "new-password" }),
+        f.confirmError && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("small", { style: { color: "#c00" }, children: f.confirmError })
+      ] }),
+      f.error && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: f.error.message }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("button", { "data-testid": "reset-submit", type: "submit", disabled: !f.canSubmit, style: { width: "100%", padding: 12, background: "var(--hook-color-primary)", color: "#fff", border: "none", borderRadius: 8, opacity: f.canSubmit ? 1 : 0.5 }, children: f.submitting ? "Alterando..." : "Alterar senha" })
+    ] })
+  ] });
+}
+
+// src/defaults/DefaultPaywall.tsx
+var import_react9 = require("react");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+function DefaultPaywall() {
+  const config = useTemplateConfig();
+  const { checkout, opening, error } = usePaywallState();
+  const p = config.subscription.paywall_config;
+  const [cpf, setCpf] = (0, import_react9.useState)("");
+  const cpfDigits = cpf.replace(/\D/g, "");
+  const canCheckout = cpfDigits.length === 11 && !opening;
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("main", { style: { padding: 24, maxWidth: 440, margin: "0 auto", textAlign: "center" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("h1", { style: { marginBottom: 8 }, children: p.title }),
+    p.subtitle && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { style: { opacity: 0.7, marginBottom: 24 }, children: p.subtitle }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("ul", { style: { listStyle: "none", padding: 0, textAlign: "left", marginBottom: 24 }, children: p.benefits.map((b) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("li", { style: { padding: "8px 0", display: "flex", alignItems: "center" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { "aria-hidden": true, style: { marginRight: 8 }, children: "\u2713" }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { children: b })
+    ] }, b)) }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: { textAlign: "left", marginBottom: 16 }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("label", { style: { display: "block", fontSize: 14, opacity: 0.7, marginBottom: 4 }, children: "Seu CPF (pra emiss\xE3o de recibo)" }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+        "input",
+        {
+          "data-testid": "paywall-cpf",
+          type: "text",
+          inputMode: "numeric",
+          placeholder: "000.000.000-00",
+          value: cpf,
+          onChange: (e) => setCpf(e.target.value),
+          style: { width: "100%", padding: 10, fontSize: 14, borderRadius: 8, border: "1px solid #ccc" }
+        }
+      )
+    ] }),
+    error && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { role: "alert", style: { color: "#c00", marginBottom: 12 }, children: error.message }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      "button",
+      {
+        "data-testid": "paywall-cta",
+        type: "button",
+        onClick: () => void checkout({ cpf: cpfDigits }),
+        disabled: !canCheckout,
+        style: {
+          width: "100%",
+          padding: 14,
+          background: "var(--hook-color-primary)",
+          color: "#fff",
+          border: "none",
+          borderRadius: 8,
+          opacity: canCheckout ? 1 : 0.5,
+          fontSize: 16,
+          fontWeight: 600
+        },
+        children: opening ? "Abrindo..." : p.cta
+      }
+    ),
+    p.priceHint && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { style: { opacity: 0.6, marginTop: 12 }, children: p.priceHint }),
+    p.footerNote && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { style: { opacity: 0.5, marginTop: 16, fontSize: 12 }, children: p.footerNote })
+  ] });
+}
+
+// src/AppRoot.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
+function AppRoot({
+  config,
+  children,
+  Login = DefaultLoginScreen,
+  Signup = DefaultSignupScreen,
+  Forgot = DefaultForgotScreen,
+  Reset = DefaultResetScreen,
+  Paywall = DefaultPaywall
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(TemplateConfigProvider, { config, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ErrorBoundary, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ThemeProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(AuthGate, { Login, Signup, Forgot, Reset, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SubscriptionGate, { Paywall, children: [
+    children,
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(PushPrompt, {})
+  ] }) }) }) }) });
+}
+
+// src/defaults/EmptyState.tsx
+var import_jsx_runtime13 = require("react/jsx-runtime");
+function EmptyState({ title, description, action }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("h2", { style: { marginBottom: 8 }, children: title }),
+    description && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { style: { opacity: 0.7 }, children: description }),
+    action && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { style: { marginTop: 16 }, children: action })
+  ] });
+}
+
+// src/hooks/useAuthPrimitives.ts
+var import_react10 = require("react");
+var import_sdk8 = require("@hook-sdk/sdk");
+var warned = false;
+function useAuthPrimitives() {
+  const { auth } = (0, import_sdk8.useHook)();
+  (0, import_react10.useEffect)(() => {
+    if (!warned && process.env.NODE_ENV !== "production") {
+      warned = true;
+      console.warn(
+        "[@hook-sdk/template] useAuthPrimitives() \xE9 escape hatch. Pra login/signup/forgot, use useLoginForm/useSignupForm/useForgotForm. Docs: docs/19-golden-template.md#escape-hatch"
+      );
+    }
+  }, []);
+  return {
+    login: auth.login,
+    signup: auth.signup,
+    logout: auth.logout,
+    logoutAll: auth.logoutAll,
+    forgot: auth.forgot,
+    resendVerify: auth.resendVerify,
+    changePassword: auth.changePassword,
+    changeEmail: auth.changeEmail,
+    refresh: auth.refresh
+  };
+}
+
+// src/hooks/useSubscription.ts
+var import_sdk9 = require("@hook-sdk/sdk");
+function useSubscription() {
+  const { subscription } = (0, import_sdk9.useHook)();
+  return {
+    status: subscription.status()
+  };
+}
+
+// src/hooks/usePush.ts
+var import_sdk10 = require("@hook-sdk/sdk");
+function usePush() {
+  const { push } = (0, import_sdk10.useHook)();
+  return {
+    status: push.status(),
+    subscribe: push.subscribe,
+    unsubscribe: push.unsubscribe
+  };
+}
+
+// src/hooks/useToast.ts
+var import_react11 = require("react");
+function useToast() {
+  const [items, setItems] = (0, import_react11.useState)([]);
+  const show = (0, import_react11.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_react11.useCallback)((id) => {
+    setItems((prev) => prev.filter((t) => t.id !== id));
+  }, []);
+  return { items, show, dismiss };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AppRoot,
+  DefaultForgotScreen,
+  DefaultLoginScreen,
+  DefaultPaywall,
+  DefaultResetScreen,
+  DefaultSignupScreen,
+  EmptyState,
+  ErrorBoundary,
+  LoadingState,
+  useAuth,
+  useAuthPrimitives,
+  useForgotForm,
+  useLoginForm,
+  usePaywallState,
+  usePush,
+  useResetForm,
+  useSignupForm,
+  useSubscription,
+  useToast
+});
+//# sourceMappingURL=index.cjs.map