@hook-sdk/template 0.28.2 → 0.28.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +589 -533
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +492 -436
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -105,14 +105,14 @@ __export(index_exports, {
|
|
|
105
105
|
useSignupForm: () => useSignupForm,
|
|
106
106
|
useSubscription: () => useSubscription,
|
|
107
107
|
useToast: () => useToast,
|
|
108
|
-
useTrackOnboardingStep: () =>
|
|
108
|
+
useTrackOnboardingStep: () => import_sdk26.useTrackOnboardingStep
|
|
109
109
|
});
|
|
110
110
|
module.exports = __toCommonJS(index_exports);
|
|
111
111
|
|
|
112
112
|
// src/AppRoot.tsx
|
|
113
|
-
var
|
|
113
|
+
var import_react16 = require("react");
|
|
114
114
|
var import_react_router_dom2 = require("react-router-dom");
|
|
115
|
-
var
|
|
115
|
+
var import_sdk9 = require("@hook-sdk/sdk");
|
|
116
116
|
|
|
117
117
|
// src/config/AppConfigContext.tsx
|
|
118
118
|
var import_react = require("react");
|
|
@@ -2144,10 +2144,54 @@ function SessionExpiredBanner() {
|
|
|
2144
2144
|
] });
|
|
2145
2145
|
}
|
|
2146
2146
|
|
|
2147
|
-
// src/
|
|
2147
|
+
// src/internal/EmailVerifyBanner.tsx
|
|
2148
2148
|
var import_react11 = require("react");
|
|
2149
|
+
var import_sdk5 = require("@hook-sdk/sdk");
|
|
2149
2150
|
var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
2150
|
-
|
|
2151
|
+
function EmailVerifyBanner() {
|
|
2152
|
+
const { user, auth } = (0, import_sdk5.useHook)();
|
|
2153
|
+
const [sending, setSending] = (0, import_react11.useState)(false);
|
|
2154
|
+
const [sent, setSent] = (0, import_react11.useState)(false);
|
|
2155
|
+
if (!user || user.emailVerified) return null;
|
|
2156
|
+
async function handleResend() {
|
|
2157
|
+
if (sending || sent) return;
|
|
2158
|
+
setSending(true);
|
|
2159
|
+
try {
|
|
2160
|
+
await auth.resendVerify();
|
|
2161
|
+
setSent(true);
|
|
2162
|
+
} catch {
|
|
2163
|
+
} finally {
|
|
2164
|
+
setSending(false);
|
|
2165
|
+
}
|
|
2166
|
+
}
|
|
2167
|
+
const label = sent ? "Enviado!" : sending ? "Enviando..." : "Reenviar link";
|
|
2168
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
|
|
2169
|
+
"div",
|
|
2170
|
+
{
|
|
2171
|
+
role: "status",
|
|
2172
|
+
"data-testid": "email-verify-banner",
|
|
2173
|
+
className: "sticky top-0 inset-x-0 z-50 bg-yellow-100 text-yellow-900 border-b border-yellow-200 px-4 py-2 flex items-center justify-between gap-3 text-sm",
|
|
2174
|
+
children: [
|
|
2175
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { children: "Confirma teu e-mail pra liberar tudo." }),
|
|
2176
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
|
2177
|
+
"button",
|
|
2178
|
+
{
|
|
2179
|
+
type: "button",
|
|
2180
|
+
onClick: handleResend,
|
|
2181
|
+
disabled: sending || sent,
|
|
2182
|
+
className: "px-3 py-1 rounded text-xs font-medium bg-yellow-900 text-yellow-50 hover:bg-yellow-800 disabled:opacity-60 disabled:cursor-not-allowed",
|
|
2183
|
+
children: label
|
|
2184
|
+
}
|
|
2185
|
+
)
|
|
2186
|
+
]
|
|
2187
|
+
}
|
|
2188
|
+
);
|
|
2189
|
+
}
|
|
2190
|
+
|
|
2191
|
+
// src/defaults/ErrorBoundary.tsx
|
|
2192
|
+
var import_react12 = require("react");
|
|
2193
|
+
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
2194
|
+
var ErrorBoundary = class extends import_react12.Component {
|
|
2151
2195
|
state = { error: null };
|
|
2152
2196
|
static getDerivedStateFromError(error) {
|
|
2153
2197
|
return { error };
|
|
@@ -2164,21 +2208,21 @@ var ErrorBoundary = class extends import_react11.Component {
|
|
|
2164
2208
|
}
|
|
2165
2209
|
render() {
|
|
2166
2210
|
if (this.state.error) {
|
|
2167
|
-
return this.props.fallback ?? /* @__PURE__ */ (0,
|
|
2168
|
-
/* @__PURE__ */ (0,
|
|
2169
|
-
/* @__PURE__ */ (0,
|
|
2211
|
+
return this.props.fallback ?? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { role: "alert", style: { padding: 24, textAlign: "center" }, children: [
|
|
2212
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("h2", { children: "Algo deu errado" }),
|
|
2213
|
+
/* @__PURE__ */ (0, import_jsx_runtime19.jsx)("p", { style: { opacity: 0.7 }, children: "Recarregue a p\xE1gina pra tentar de novo." })
|
|
2170
2214
|
] });
|
|
2171
2215
|
}
|
|
2172
|
-
return /* @__PURE__ */ (0,
|
|
2216
|
+
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_jsx_runtime19.Fragment, { children: this.props.children });
|
|
2173
2217
|
}
|
|
2174
2218
|
};
|
|
2175
2219
|
|
|
2176
2220
|
// src/i18n/I18nProvider.tsx
|
|
2177
|
-
var
|
|
2221
|
+
var import_react13 = require("react");
|
|
2178
2222
|
var import_i18next = __toESM(require("i18next"), 1);
|
|
2179
2223
|
var import_react_i18next = require("react-i18next");
|
|
2180
|
-
var
|
|
2181
|
-
var
|
|
2224
|
+
var import_sdk6 = require("@hook-sdk/sdk");
|
|
2225
|
+
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
2182
2226
|
function ensureInitialized(defaultLocale, supportedLocales, resources, initialLocale) {
|
|
2183
2227
|
if (import_i18next.default.isInitialized) return;
|
|
2184
2228
|
import_i18next.default.use(import_react_i18next.initReactI18next).init({
|
|
@@ -2200,14 +2244,14 @@ function I18nProvider({
|
|
|
2200
2244
|
resources,
|
|
2201
2245
|
children
|
|
2202
2246
|
}) {
|
|
2203
|
-
const [userLocale] = (0,
|
|
2247
|
+
const [userLocale] = (0, import_sdk6.usePersistedState)("user-locale", defaultLocale);
|
|
2204
2248
|
ensureInitialized(defaultLocale, supportedLocales, resources, userLocale);
|
|
2205
|
-
(0,
|
|
2249
|
+
(0, import_react13.useEffect)(() => {
|
|
2206
2250
|
if (import_i18next.default.isInitialized && import_i18next.default.language !== userLocale) {
|
|
2207
2251
|
import_i18next.default.changeLanguage(userLocale);
|
|
2208
2252
|
}
|
|
2209
2253
|
}, [userLocale]);
|
|
2210
|
-
return /* @__PURE__ */ (0,
|
|
2254
|
+
return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_react_i18next.I18nextProvider, { i18n: import_i18next.default, children });
|
|
2211
2255
|
}
|
|
2212
2256
|
|
|
2213
2257
|
// src/dev/env.ts
|
|
@@ -2218,9 +2262,9 @@ function isDevToolsEnabled() {
|
|
|
2218
2262
|
}
|
|
2219
2263
|
|
|
2220
2264
|
// src/dev/DevSkipOnboardingFab.tsx
|
|
2221
|
-
var
|
|
2222
|
-
var
|
|
2223
|
-
var
|
|
2265
|
+
var import_react14 = require("react");
|
|
2266
|
+
var import_sdk7 = require("@hook-sdk/sdk");
|
|
2267
|
+
var import_jsx_runtime21 = require("react/jsx-runtime");
|
|
2224
2268
|
var STORAGE_KEY = "hook_dev_skip_email";
|
|
2225
2269
|
var TEST_EMAIL_DOMAIN = "@hook.test";
|
|
2226
2270
|
var TEST_PASSWORD = "SkipTest!2026";
|
|
@@ -2287,25 +2331,25 @@ var STYLES = {
|
|
|
2287
2331
|
};
|
|
2288
2332
|
var CONFIRM_TIMEOUT_MS = 3e3;
|
|
2289
2333
|
function DevSkipOnboardingFab({ defaults }) {
|
|
2290
|
-
const hook = (0,
|
|
2334
|
+
const hook = (0, import_sdk7.useHook)();
|
|
2291
2335
|
const { slug } = useAppConfig();
|
|
2292
|
-
const [state, setState] = (0,
|
|
2293
|
-
const [errorMsg, setErrorMsg] = (0,
|
|
2294
|
-
const timerRef = (0,
|
|
2336
|
+
const [state, setState] = (0, import_react14.useState)("idle");
|
|
2337
|
+
const [errorMsg, setErrorMsg] = (0, import_react14.useState)(null);
|
|
2338
|
+
const timerRef = (0, import_react14.useRef)(null);
|
|
2295
2339
|
const isAuthed = hook.authStatus === "authenticated";
|
|
2296
|
-
const [onboarding] = (0,
|
|
2340
|
+
const [onboarding] = (0, import_sdk7.usePersistedState)(
|
|
2297
2341
|
"onboarding_data",
|
|
2298
2342
|
null,
|
|
2299
2343
|
{ enabled: isAuthed }
|
|
2300
2344
|
);
|
|
2301
2345
|
const onboardingCompleted = isAuthed && onboarding?.onboarding_completed === true;
|
|
2302
|
-
const clearTimer = (0,
|
|
2346
|
+
const clearTimer = (0, import_react14.useCallback)(() => {
|
|
2303
2347
|
if (timerRef.current) {
|
|
2304
2348
|
clearTimeout(timerRef.current);
|
|
2305
2349
|
timerRef.current = null;
|
|
2306
2350
|
}
|
|
2307
2351
|
}, []);
|
|
2308
|
-
const onClick = (0,
|
|
2352
|
+
const onClick = (0, import_react14.useCallback)(async () => {
|
|
2309
2353
|
if (state === "busy") return;
|
|
2310
2354
|
if (state === "idle" || state === "error") {
|
|
2311
2355
|
setState("confirm");
|
|
@@ -2335,7 +2379,7 @@ function DevSkipOnboardingFab({ defaults }) {
|
|
|
2335
2379
|
...state === "confirm" || state === "error" ? STYLES.confirm : {},
|
|
2336
2380
|
...state === "busy" ? STYLES.busy : {}
|
|
2337
2381
|
};
|
|
2338
|
-
return /* @__PURE__ */ (0,
|
|
2382
|
+
return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
|
|
2339
2383
|
"button",
|
|
2340
2384
|
{
|
|
2341
2385
|
type: "button",
|
|
@@ -2350,21 +2394,21 @@ function DevSkipOnboardingFab({ defaults }) {
|
|
|
2350
2394
|
}
|
|
2351
2395
|
|
|
2352
2396
|
// src/internal/PaymentReturnHandler.tsx
|
|
2353
|
-
var
|
|
2354
|
-
var
|
|
2355
|
-
var
|
|
2397
|
+
var import_react15 = require("react");
|
|
2398
|
+
var import_sdk8 = require("@hook-sdk/sdk");
|
|
2399
|
+
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
2356
2400
|
var BACKOFF_MS = [2e3, 5e3, 1e4, 2e4, 4e4];
|
|
2357
2401
|
var MAX_CYCLES = 3;
|
|
2358
2402
|
var SUPPORT_MAILTO = "mailto:suporte@usehook.net?subject=Pagamento%20pendente";
|
|
2359
2403
|
function PaymentReturnHandler({ children }) {
|
|
2360
|
-
const { subscription, track: track2 } = (0,
|
|
2361
|
-
const subRef = (0,
|
|
2404
|
+
const { subscription, track: track2 } = (0, import_sdk8.useHook)();
|
|
2405
|
+
const subRef = (0, import_react15.useRef)(subscription);
|
|
2362
2406
|
subRef.current = subscription;
|
|
2363
|
-
const runIdRef = (0,
|
|
2364
|
-
const cyclesRef = (0,
|
|
2365
|
-
const startMsRef = (0,
|
|
2366
|
-
const [state, setState] = (0,
|
|
2367
|
-
const runPoll = (0,
|
|
2407
|
+
const runIdRef = (0, import_react15.useRef)(0);
|
|
2408
|
+
const cyclesRef = (0, import_react15.useRef)(0);
|
|
2409
|
+
const startMsRef = (0, import_react15.useRef)(0);
|
|
2410
|
+
const [state, setState] = (0, import_react15.useState)("idle");
|
|
2411
|
+
const runPoll = (0, import_react15.useCallback)(() => {
|
|
2368
2412
|
const runId = ++runIdRef.current;
|
|
2369
2413
|
const isFirstRun = cyclesRef.current === 0;
|
|
2370
2414
|
cyclesRef.current += 1;
|
|
@@ -2412,7 +2456,7 @@ function PaymentReturnHandler({ children }) {
|
|
|
2412
2456
|
};
|
|
2413
2457
|
void tick();
|
|
2414
2458
|
}, [track2]);
|
|
2415
|
-
(0,
|
|
2459
|
+
(0, import_react15.useEffect)(() => {
|
|
2416
2460
|
if (typeof window === "undefined") return;
|
|
2417
2461
|
const url = new URL(window.location.href);
|
|
2418
2462
|
if (url.searchParams.get("paymentReturn") !== "1") return;
|
|
@@ -2422,26 +2466,26 @@ function PaymentReturnHandler({ children }) {
|
|
|
2422
2466
|
runIdRef.current++;
|
|
2423
2467
|
};
|
|
2424
2468
|
}, [runPoll]);
|
|
2425
|
-
const goHome = (0,
|
|
2469
|
+
const goHome = (0, import_react15.useCallback)(() => {
|
|
2426
2470
|
const cleanUrl = new URL(window.location.href);
|
|
2427
2471
|
cleanUrl.searchParams.delete("paymentReturn");
|
|
2428
2472
|
cleanUrl.pathname = "/app/home";
|
|
2429
2473
|
window.location.href = cleanUrl.toString();
|
|
2430
2474
|
}, []);
|
|
2431
2475
|
if (state === "confirming") {
|
|
2432
|
-
return /* @__PURE__ */ (0,
|
|
2476
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: "Confirmando pagamento\u2026" });
|
|
2433
2477
|
}
|
|
2434
2478
|
if (state === "waiting") {
|
|
2435
|
-
return /* @__PURE__ */ (0,
|
|
2436
|
-
/* @__PURE__ */ (0,
|
|
2437
|
-
/* @__PURE__ */ (0,
|
|
2479
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { maxWidth: 320, textAlign: "center", lineHeight: 1.5 }, children: [
|
|
2480
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { marginBottom: 16 }, children: "Pagamento aceito. Estamos confirmando com o banco \u2014 pode levar alguns minutos." }),
|
|
2481
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { type: "button", onClick: runPoll, style: buttonStyle, children: "Atualizar" })
|
|
2438
2482
|
] }) });
|
|
2439
2483
|
}
|
|
2440
2484
|
if (state === "timeout") {
|
|
2441
|
-
return /* @__PURE__ */ (0,
|
|
2442
|
-
/* @__PURE__ */ (0,
|
|
2443
|
-
/* @__PURE__ */ (0,
|
|
2444
|
-
/* @__PURE__ */ (0,
|
|
2485
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { role: "alert", "aria-live": "assertive", style: overlayStyle2, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { maxWidth: 360, textAlign: "center", lineHeight: 1.5 }, children: [
|
|
2486
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.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." }),
|
|
2487
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
|
|
2488
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
2445
2489
|
"button",
|
|
2446
2490
|
{
|
|
2447
2491
|
type: "button",
|
|
@@ -2454,7 +2498,7 @@ function PaymentReturnHandler({ children }) {
|
|
|
2454
2498
|
children: "Tentar de novo"
|
|
2455
2499
|
}
|
|
2456
2500
|
),
|
|
2457
|
-
/* @__PURE__ */ (0,
|
|
2501
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
2458
2502
|
"button",
|
|
2459
2503
|
{
|
|
2460
2504
|
type: "button",
|
|
@@ -2464,7 +2508,7 @@ function PaymentReturnHandler({ children }) {
|
|
|
2464
2508
|
children: "Voltar pro app"
|
|
2465
2509
|
}
|
|
2466
2510
|
),
|
|
2467
|
-
/* @__PURE__ */ (0,
|
|
2511
|
+
/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
|
|
2468
2512
|
"a",
|
|
2469
2513
|
{
|
|
2470
2514
|
href: SUPPORT_MAILTO,
|
|
@@ -2476,7 +2520,7 @@ function PaymentReturnHandler({ children }) {
|
|
|
2476
2520
|
] })
|
|
2477
2521
|
] }) });
|
|
2478
2522
|
}
|
|
2479
|
-
return /* @__PURE__ */ (0,
|
|
2523
|
+
return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_jsx_runtime22.Fragment, { children });
|
|
2480
2524
|
}
|
|
2481
2525
|
var overlayStyle2 = {
|
|
2482
2526
|
position: "fixed",
|
|
@@ -2515,7 +2559,7 @@ var linkStyle = {
|
|
|
2515
2559
|
};
|
|
2516
2560
|
|
|
2517
2561
|
// src/AppRoot.tsx
|
|
2518
|
-
var
|
|
2562
|
+
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
2519
2563
|
function buildLegacyConfigShim(config) {
|
|
2520
2564
|
const paywall = config.paywall;
|
|
2521
2565
|
const isFree = paywall.mode === "free";
|
|
@@ -2589,19 +2633,22 @@ function AppRoot(props) {
|
|
|
2589
2633
|
"[hook-template] <AppRoot>: PreAuthFlow slot prop is required when config.onboarding.trigger === 'pre_signup_custom'."
|
|
2590
2634
|
);
|
|
2591
2635
|
}
|
|
2592
|
-
const legacyShim = (0,
|
|
2636
|
+
const legacyShim = (0, import_react16.useMemo)(() => buildLegacyConfigShim(config), [config]);
|
|
2593
2637
|
const Router = testRouter === "memory" ? import_react_router_dom2.MemoryRouter : import_react_router_dom2.BrowserRouter;
|
|
2594
2638
|
const basename = `/app/${config.slug}`;
|
|
2595
2639
|
const routerProps = testRouter === "memory" ? { basename, initialEntries: testInitialEntries } : { basename };
|
|
2596
2640
|
const position = config.install_prompt?.position ?? "post-paywall";
|
|
2597
|
-
const subscriptionGated = /* @__PURE__ */ (0,
|
|
2598
|
-
|
|
2599
|
-
/* @__PURE__ */ (0,
|
|
2600
|
-
|
|
2601
|
-
|
|
2602
|
-
/* @__PURE__ */ (0,
|
|
2603
|
-
|
|
2604
|
-
|
|
2641
|
+
const subscriptionGated = /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(SubscriptionGate, { Paywall: Paywall2 ?? FallbackPaywall, children: [
|
|
2642
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(EmailVerifyBanner, {}),
|
|
2643
|
+
position === "post-paywall" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(InstallGate, { position: "post-paywall", children: [
|
|
2644
|
+
children,
|
|
2645
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PushPrompt, {})
|
|
2646
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_jsx_runtime23.Fragment, { children: [
|
|
2647
|
+
children,
|
|
2648
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PushPrompt, {})
|
|
2649
|
+
] })
|
|
2650
|
+
] });
|
|
2651
|
+
const authGated = /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
2605
2652
|
AuthGated,
|
|
2606
2653
|
{
|
|
2607
2654
|
config,
|
|
@@ -2616,13 +2663,13 @@ function AppRoot(props) {
|
|
|
2616
2663
|
children: subscriptionGated
|
|
2617
2664
|
}
|
|
2618
2665
|
);
|
|
2619
|
-
const routedTree = /* @__PURE__ */ (0,
|
|
2620
|
-
/* @__PURE__ */ (0,
|
|
2621
|
-
/* @__PURE__ */ (0,
|
|
2622
|
-
position === "pre-auth" ? /* @__PURE__ */ (0,
|
|
2623
|
-
isDevToolsEnabled() && devSkipOnboarding ? /* @__PURE__ */ (0,
|
|
2666
|
+
const routedTree = /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Router, { ...routerProps, children: [
|
|
2667
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DeepLinkHandler, { deepLinks: config.deepLinks }),
|
|
2668
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(SessionExpiredBanner, {}),
|
|
2669
|
+
position === "pre-auth" ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(InstallGate, { position: "pre-auth", children: authGated }) : authGated,
|
|
2670
|
+
isDevToolsEnabled() && devSkipOnboarding ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(DevSkipOnboardingFab, { defaults: devSkipOnboarding.defaults }) : null
|
|
2624
2671
|
] });
|
|
2625
|
-
return /* @__PURE__ */ (0,
|
|
2672
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ErrorBoundary, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(AppConfigProvider, { config, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(TemplateConfigProvider, { config: legacyShim, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(ThemeProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PersistenceRegistry, { config: config.persistedKeys, children: config.i18n ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
|
|
2626
2673
|
I18nProvider,
|
|
2627
2674
|
{
|
|
2628
2675
|
defaultLocale: config.i18n.defaultLocale,
|
|
@@ -2642,46 +2689,46 @@ function AuthGated({
|
|
|
2642
2689
|
EmailVerify,
|
|
2643
2690
|
PreAuthFlow
|
|
2644
2691
|
}) {
|
|
2645
|
-
const { authStatus } = (0,
|
|
2692
|
+
const { authStatus } = (0, import_sdk9.useHook)();
|
|
2646
2693
|
if (authStatus === "loading") return null;
|
|
2647
2694
|
if (authStatus !== "authenticated") {
|
|
2648
2695
|
if (config.authFlow.signupMode === "pay_first" && PreAuthFlow) {
|
|
2649
|
-
return /* @__PURE__ */ (0,
|
|
2650
|
-
/* @__PURE__ */ (0,
|
|
2651
|
-
/* @__PURE__ */ (0,
|
|
2652
|
-
/* @__PURE__ */ (0,
|
|
2653
|
-
EmailVerify ? /* @__PURE__ */ (0,
|
|
2654
|
-
/* @__PURE__ */ (0,
|
|
2696
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react_router_dom2.Routes, { children: [
|
|
2697
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/signin", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Login, {}) }),
|
|
2698
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Forgot, {}) }),
|
|
2699
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Reset, {}) }),
|
|
2700
|
+
EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(EmailVerify, {}) }) : null,
|
|
2701
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/*", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PreAuthFlow, {}) })
|
|
2655
2702
|
] });
|
|
2656
2703
|
}
|
|
2657
2704
|
if (config.onboarding?.trigger === "pre_signup_custom" && PreAuthFlow) {
|
|
2658
|
-
return /* @__PURE__ */ (0,
|
|
2659
|
-
/* @__PURE__ */ (0,
|
|
2660
|
-
/* @__PURE__ */ (0,
|
|
2661
|
-
/* @__PURE__ */ (0,
|
|
2662
|
-
/* @__PURE__ */ (0,
|
|
2663
|
-
EmailVerify ? /* @__PURE__ */ (0,
|
|
2664
|
-
/* @__PURE__ */ (0,
|
|
2705
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react_router_dom2.Routes, { children: [
|
|
2706
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/signin", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Login, {}) }),
|
|
2707
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/signup", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Signup, {}) }),
|
|
2708
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Forgot, {}) }),
|
|
2709
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Reset, {}) }),
|
|
2710
|
+
EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(EmailVerify, {}) }) : null,
|
|
2711
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/*", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(PreAuthFlow, {}) })
|
|
2665
2712
|
] });
|
|
2666
2713
|
}
|
|
2667
|
-
return /* @__PURE__ */ (0,
|
|
2668
|
-
/* @__PURE__ */ (0,
|
|
2669
|
-
/* @__PURE__ */ (0,
|
|
2670
|
-
/* @__PURE__ */ (0,
|
|
2671
|
-
/* @__PURE__ */ (0,
|
|
2672
|
-
EmailVerify ? /* @__PURE__ */ (0,
|
|
2673
|
-
/* @__PURE__ */ (0,
|
|
2714
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_react_router_dom2.Routes, { children: [
|
|
2715
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Login, {}) }),
|
|
2716
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/signup", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Signup, {}) }),
|
|
2717
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/forgot", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Forgot, {}) }),
|
|
2718
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/reset", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Reset, {}) }),
|
|
2719
|
+
EmailVerify ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "/verify", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(EmailVerify, {}) }) : null,
|
|
2720
|
+
/* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Route, { path: "*", element: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_react_router_dom2.Navigate, { to: "/", replace: true }) })
|
|
2674
2721
|
] });
|
|
2675
2722
|
}
|
|
2676
|
-
return /* @__PURE__ */ (0,
|
|
2723
|
+
return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_jsx_runtime23.Fragment, { children });
|
|
2677
2724
|
}
|
|
2678
2725
|
function FallbackPaywall() {
|
|
2679
2726
|
return null;
|
|
2680
2727
|
}
|
|
2681
2728
|
|
|
2682
2729
|
// src/hooks/usePush.ts
|
|
2683
|
-
var
|
|
2684
|
-
var
|
|
2730
|
+
var import_react17 = require("react");
|
|
2731
|
+
var import_sdk10 = require("@hook-sdk/sdk");
|
|
2685
2732
|
var DISMISS_STORAGE_KEY = "push:dismissed-until";
|
|
2686
2733
|
var DISMISS_TTL_MS2 = 7 * 24 * 60 * 60 * 1e3;
|
|
2687
2734
|
function detectIosNeedsInstall() {
|
|
@@ -2725,12 +2772,12 @@ function deriveState(push) {
|
|
|
2725
2772
|
return { kind: "prompt" };
|
|
2726
2773
|
}
|
|
2727
2774
|
function usePush() {
|
|
2728
|
-
const { push } = (0,
|
|
2729
|
-
const [state, setState] = (0,
|
|
2730
|
-
(0,
|
|
2775
|
+
const { push } = (0, import_sdk10.useHook)();
|
|
2776
|
+
const [state, setState] = (0, import_react17.useState)(() => deriveState(push));
|
|
2777
|
+
(0, import_react17.useEffect)(() => {
|
|
2731
2778
|
setState(deriveState(push));
|
|
2732
2779
|
}, [push]);
|
|
2733
|
-
const subscribe = (0,
|
|
2780
|
+
const subscribe = (0, import_react17.useCallback)(async () => {
|
|
2734
2781
|
try {
|
|
2735
2782
|
await push.subscribe();
|
|
2736
2783
|
setState({ kind: "subscribed" });
|
|
@@ -2742,7 +2789,7 @@ function usePush() {
|
|
|
2742
2789
|
throw e;
|
|
2743
2790
|
}
|
|
2744
2791
|
}, [push]);
|
|
2745
|
-
const unsubscribe = (0,
|
|
2792
|
+
const unsubscribe = (0, import_react17.useCallback)(async () => {
|
|
2746
2793
|
try {
|
|
2747
2794
|
await push.unsubscribe();
|
|
2748
2795
|
setState({ kind: "prompt" });
|
|
@@ -2751,7 +2798,7 @@ function usePush() {
|
|
|
2751
2798
|
throw e;
|
|
2752
2799
|
}
|
|
2753
2800
|
}, [push]);
|
|
2754
|
-
const dismiss = (0,
|
|
2801
|
+
const dismiss = (0, import_react17.useCallback)(() => {
|
|
2755
2802
|
if (typeof localStorage !== "undefined") {
|
|
2756
2803
|
try {
|
|
2757
2804
|
localStorage.setItem(DISMISS_STORAGE_KEY, String(Date.now() + DISMISS_TTL_MS2));
|
|
@@ -2764,27 +2811,27 @@ function usePush() {
|
|
|
2764
2811
|
}
|
|
2765
2812
|
|
|
2766
2813
|
// src/components/PushPrompt.tsx
|
|
2767
|
-
var
|
|
2814
|
+
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
2768
2815
|
function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, className }) {
|
|
2769
2816
|
const { state, subscribe } = usePush();
|
|
2770
2817
|
if (state.kind === "denied" || state.kind === "dismissed" || state.kind === "subscribed") {
|
|
2771
2818
|
return null;
|
|
2772
2819
|
}
|
|
2773
2820
|
if (state.kind === "ios_needs_install") {
|
|
2774
|
-
return /* @__PURE__ */ (0,
|
|
2775
|
-
/* @__PURE__ */ (0,
|
|
2776
|
-
/* @__PURE__ */ (0,
|
|
2777
|
-
onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ (0,
|
|
2821
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
|
|
2822
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("h3", { children: texts.iosInstallTitle }),
|
|
2823
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { children: texts.iosInstallBody }),
|
|
2824
|
+
onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
|
|
2778
2825
|
] });
|
|
2779
2826
|
}
|
|
2780
2827
|
if (state.kind === "unsupported") {
|
|
2781
|
-
return /* @__PURE__ */ (0,
|
|
2828
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className, role: "region", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { children: texts.unsupportedBody }) });
|
|
2782
2829
|
}
|
|
2783
2830
|
if (state.kind === "error") {
|
|
2784
|
-
return /* @__PURE__ */ (0,
|
|
2831
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("p", { children: state.message }) });
|
|
2785
2832
|
}
|
|
2786
|
-
return /* @__PURE__ */ (0,
|
|
2787
|
-
/* @__PURE__ */ (0,
|
|
2833
|
+
return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className, role: "region", children: [
|
|
2834
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
|
|
2788
2835
|
"button",
|
|
2789
2836
|
{
|
|
2790
2837
|
type: "button",
|
|
@@ -2798,71 +2845,71 @@ function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, clas
|
|
|
2798
2845
|
children: texts.cta
|
|
2799
2846
|
}
|
|
2800
2847
|
),
|
|
2801
|
-
onDeclined && /* @__PURE__ */ (0,
|
|
2848
|
+
onDeclined && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
|
|
2802
2849
|
] });
|
|
2803
2850
|
}
|
|
2804
2851
|
|
|
2805
2852
|
// src/components/LanguageSwitcher.tsx
|
|
2806
|
-
var
|
|
2807
|
-
var
|
|
2853
|
+
var import_sdk11 = require("@hook-sdk/sdk");
|
|
2854
|
+
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
2808
2855
|
function LanguageSwitcher({ id, className, label = "Language" }) {
|
|
2809
2856
|
const config = useAppConfig();
|
|
2810
2857
|
const i18nConfig = config.i18n;
|
|
2811
|
-
const [userLocale, setUserLocale] = (0,
|
|
2858
|
+
const [userLocale, setUserLocale] = (0, import_sdk11.usePersistedState)(
|
|
2812
2859
|
"user-locale",
|
|
2813
2860
|
i18nConfig?.defaultLocale ?? "en-US"
|
|
2814
2861
|
);
|
|
2815
2862
|
if (!i18nConfig) return null;
|
|
2816
|
-
return /* @__PURE__ */ (0,
|
|
2817
|
-
label ? /* @__PURE__ */ (0,
|
|
2818
|
-
/* @__PURE__ */ (0,
|
|
2863
|
+
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("label", { className, children: [
|
|
2864
|
+
label ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { children: label }) : null,
|
|
2865
|
+
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
|
|
2819
2866
|
"select",
|
|
2820
2867
|
{
|
|
2821
2868
|
id,
|
|
2822
2869
|
value: userLocale,
|
|
2823
2870
|
onChange: (e) => setUserLocale(e.target.value),
|
|
2824
2871
|
"data-testid": "language-switcher",
|
|
2825
|
-
children: i18nConfig.supportedLocales.map((loc) => /* @__PURE__ */ (0,
|
|
2872
|
+
children: i18nConfig.supportedLocales.map((loc) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("option", { value: loc, children: loc }, loc))
|
|
2826
2873
|
}
|
|
2827
2874
|
)
|
|
2828
2875
|
] });
|
|
2829
2876
|
}
|
|
2830
2877
|
|
|
2831
2878
|
// src/defaults/LoadingState.tsx
|
|
2832
|
-
var
|
|
2879
|
+
var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
2833
2880
|
function LoadingState({ message }) {
|
|
2834
|
-
return /* @__PURE__ */ (0,
|
|
2881
|
+
return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("div", { role: "status", "aria-live": "polite", style: { padding: 24, textAlign: "center" }, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("span", { children: message ?? "Carregando..." }) });
|
|
2835
2882
|
}
|
|
2836
2883
|
|
|
2837
2884
|
// src/defaults/EmptyState.tsx
|
|
2838
|
-
var
|
|
2885
|
+
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
2839
2886
|
function EmptyState({ title, description, action }) {
|
|
2840
|
-
return /* @__PURE__ */ (0,
|
|
2841
|
-
/* @__PURE__ */ (0,
|
|
2842
|
-
description && /* @__PURE__ */ (0,
|
|
2843
|
-
action && /* @__PURE__ */ (0,
|
|
2887
|
+
return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
|
|
2888
|
+
/* @__PURE__ */ (0, import_jsx_runtime27.jsx)("h2", { style: { marginBottom: 8 }, children: title }),
|
|
2889
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("p", { style: { opacity: 0.7 }, children: description }),
|
|
2890
|
+
action && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { style: { marginTop: 16 }, children: action })
|
|
2844
2891
|
] });
|
|
2845
2892
|
}
|
|
2846
2893
|
|
|
2847
2894
|
// src/defaults/CheckoutPageDefault.tsx
|
|
2848
|
-
var
|
|
2895
|
+
var import_react19 = require("react");
|
|
2849
2896
|
var import_react_router_dom3 = require("react-router-dom");
|
|
2850
2897
|
|
|
2851
2898
|
// src/hooks/useCheckoutForm.ts
|
|
2852
|
-
var
|
|
2853
|
-
var
|
|
2899
|
+
var import_react18 = require("react");
|
|
2900
|
+
var import_sdk13 = require("@hook-sdk/sdk");
|
|
2854
2901
|
|
|
2855
2902
|
// src/errors.ts
|
|
2856
|
-
var
|
|
2903
|
+
var import_sdk12 = require("@hook-sdk/sdk");
|
|
2857
2904
|
function mapSdkError(err) {
|
|
2858
|
-
if (err instanceof
|
|
2905
|
+
if (err instanceof import_sdk12.SdkRateLimitError) {
|
|
2859
2906
|
return {
|
|
2860
2907
|
code: "rate_limited",
|
|
2861
2908
|
message: `Aguarde ${err.retryAfter}s e tente novamente.`,
|
|
2862
2909
|
retryAfter: err.retryAfter
|
|
2863
2910
|
};
|
|
2864
2911
|
}
|
|
2865
|
-
if (err instanceof
|
|
2912
|
+
if (err instanceof import_sdk12.SdkAuthError) {
|
|
2866
2913
|
const detail = err.detail;
|
|
2867
2914
|
if (detail === "email_unverified") {
|
|
2868
2915
|
return { code: "email_unverified", message: "Confirme seu e-mail antes de entrar." };
|
|
@@ -2872,7 +2919,10 @@ function mapSdkError(err) {
|
|
|
2872
2919
|
}
|
|
2873
2920
|
return { code: "invalid_credentials", message: "E-mail ou senha inv\xE1lidos." };
|
|
2874
2921
|
}
|
|
2875
|
-
if (err instanceof
|
|
2922
|
+
if (err instanceof import_sdk12.SdkValidationError && err.code === "auth.email_taken") {
|
|
2923
|
+
return { code: "email_taken", message: "Esse e-mail j\xE1 tem conta." };
|
|
2924
|
+
}
|
|
2925
|
+
if (err instanceof import_sdk12.SdkError && err.httpStatus === 0) {
|
|
2876
2926
|
return { code: "network", message: "Sem conex\xE3o com o servidor. Verifique sua internet." };
|
|
2877
2927
|
}
|
|
2878
2928
|
if (err instanceof TypeError) {
|
|
@@ -2886,37 +2936,37 @@ var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
|
2886
2936
|
var PHONE_RE = /^[0-9()+\-\s]{8,20}$/;
|
|
2887
2937
|
var CHECK_DEBOUNCE_MS = 400;
|
|
2888
2938
|
function useCheckoutForm(args) {
|
|
2889
|
-
const { auth } = (0,
|
|
2890
|
-
const [name, setName] = (0,
|
|
2891
|
-
const [email, setEmail] = (0,
|
|
2892
|
-
const [emailConfirm, setEmailConfirm] = (0,
|
|
2893
|
-
const [phone, setPhone] = (0,
|
|
2894
|
-
const [cpf, setCpf] = (0,
|
|
2895
|
-
const [method, setMethod] = (0,
|
|
2896
|
-
const [cycle, setCycle] = (0,
|
|
2897
|
-
const [card, setCardState] = (0,
|
|
2939
|
+
const { auth } = (0, import_sdk13.useHook)();
|
|
2940
|
+
const [name, setName] = (0, import_react18.useState)("");
|
|
2941
|
+
const [email, setEmail] = (0, import_react18.useState)("");
|
|
2942
|
+
const [emailConfirm, setEmailConfirm] = (0, import_react18.useState)("");
|
|
2943
|
+
const [phone, setPhone] = (0, import_react18.useState)("");
|
|
2944
|
+
const [cpf, setCpf] = (0, import_react18.useState)("");
|
|
2945
|
+
const [method, setMethod] = (0, import_react18.useState)(args.defaultMethod);
|
|
2946
|
+
const [cycle, setCycle] = (0, import_react18.useState)(args.defaultCycle);
|
|
2947
|
+
const [card, setCardState] = (0, import_react18.useState)({
|
|
2898
2948
|
number: "",
|
|
2899
2949
|
expiryMonth: "",
|
|
2900
2950
|
expiryYear: "",
|
|
2901
2951
|
ccv: "",
|
|
2902
2952
|
holderName: ""
|
|
2903
2953
|
});
|
|
2904
|
-
const setCard = (0,
|
|
2954
|
+
const setCard = (0, import_react18.useCallback)((patch) => {
|
|
2905
2955
|
setCardState((prev) => ({ ...prev, ...patch }));
|
|
2906
2956
|
}, []);
|
|
2907
|
-
const [touchedName, setTouchedName] = (0,
|
|
2908
|
-
const [touchedEmail, setTouchedEmail] = (0,
|
|
2909
|
-
const [touchedEmailConfirm, setTouchedEmailConfirm] = (0,
|
|
2910
|
-
const [touchedPhone, setTouchedPhone] = (0,
|
|
2911
|
-
const [touchedCpf, setTouchedCpf] = (0,
|
|
2912
|
-
const [formSubmitAttempted, setFormSubmitAttempted] = (0,
|
|
2913
|
-
const [submitting, setSubmitting] = (0,
|
|
2914
|
-
const [error, setError] = (0,
|
|
2915
|
-
const [emailTaken, setEmailTaken] = (0,
|
|
2916
|
-
const [loginUrl, setLoginUrl] = (0,
|
|
2917
|
-
const [emailStatus, setEmailStatus] = (0,
|
|
2918
|
-
const lastCheckedEmail = (0,
|
|
2919
|
-
(0,
|
|
2957
|
+
const [touchedName, setTouchedName] = (0, import_react18.useState)(false);
|
|
2958
|
+
const [touchedEmail, setTouchedEmail] = (0, import_react18.useState)(false);
|
|
2959
|
+
const [touchedEmailConfirm, setTouchedEmailConfirm] = (0, import_react18.useState)(false);
|
|
2960
|
+
const [touchedPhone, setTouchedPhone] = (0, import_react18.useState)(false);
|
|
2961
|
+
const [touchedCpf, setTouchedCpf] = (0, import_react18.useState)(false);
|
|
2962
|
+
const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react18.useState)(false);
|
|
2963
|
+
const [submitting, setSubmitting] = (0, import_react18.useState)(false);
|
|
2964
|
+
const [error, setError] = (0, import_react18.useState)(null);
|
|
2965
|
+
const [emailTaken, setEmailTaken] = (0, import_react18.useState)(false);
|
|
2966
|
+
const [loginUrl, setLoginUrl] = (0, import_react18.useState)(null);
|
|
2967
|
+
const [emailStatus, setEmailStatus] = (0, import_react18.useState)("idle");
|
|
2968
|
+
const lastCheckedEmail = (0, import_react18.useRef)("");
|
|
2969
|
+
(0, import_react18.useEffect)(() => {
|
|
2920
2970
|
if (!email || !EMAIL_RE.test(email)) {
|
|
2921
2971
|
setEmailStatus("idle");
|
|
2922
2972
|
return;
|
|
@@ -2934,27 +2984,27 @@ function useCheckoutForm(args) {
|
|
|
2934
2984
|
}, CHECK_DEBOUNCE_MS);
|
|
2935
2985
|
return () => clearTimeout(timer);
|
|
2936
2986
|
}, [email, auth]);
|
|
2937
|
-
const validateName = (0,
|
|
2987
|
+
const validateName = (0, import_react18.useMemo)(() => {
|
|
2938
2988
|
if (name.length === 0) return null;
|
|
2939
2989
|
if (name.trim().length < 2) return "Nome muito curto.";
|
|
2940
2990
|
return null;
|
|
2941
2991
|
}, [name]);
|
|
2942
|
-
const validateEmail = (0,
|
|
2992
|
+
const validateEmail = (0, import_react18.useMemo)(() => {
|
|
2943
2993
|
if (email.length === 0) return null;
|
|
2944
2994
|
if (!EMAIL_RE.test(email)) return "Formato de e-mail inv\xE1lido.";
|
|
2945
2995
|
return null;
|
|
2946
2996
|
}, [email]);
|
|
2947
|
-
const validateEmailConfirm = (0,
|
|
2997
|
+
const validateEmailConfirm = (0, import_react18.useMemo)(() => {
|
|
2948
2998
|
if (emailConfirm.length === 0) return null;
|
|
2949
2999
|
if (emailConfirm !== email) return "Os e-mails n\xE3o coincidem.";
|
|
2950
3000
|
return null;
|
|
2951
3001
|
}, [emailConfirm, email]);
|
|
2952
|
-
const validatePhone = (0,
|
|
3002
|
+
const validatePhone = (0, import_react18.useMemo)(() => {
|
|
2953
3003
|
if (phone.length === 0) return null;
|
|
2954
3004
|
if (!PHONE_RE.test(phone)) return "Telefone inv\xE1lido.";
|
|
2955
3005
|
return null;
|
|
2956
3006
|
}, [phone]);
|
|
2957
|
-
const validateCpf = (0,
|
|
3007
|
+
const validateCpf = (0, import_react18.useMemo)(() => {
|
|
2958
3008
|
if (cpf.length === 0) return null;
|
|
2959
3009
|
const digits = cpf.replace(/\D/g, "");
|
|
2960
3010
|
if (digits.length !== 11) return "CPF deve ter 11 d\xEDgitos.";
|
|
@@ -2969,7 +3019,7 @@ function useCheckoutForm(args) {
|
|
|
2969
3019
|
const cpfError = touchedCpf || formSubmitAttempted ? validateCpf : null;
|
|
2970
3020
|
const phoneOk = method === "pix-auto" ? phone === "" || PHONE_RE.test(phone) : PHONE_RE.test(phone);
|
|
2971
3021
|
const canSubmit = name.trim().length >= 2 && EMAIL_RE.test(email) && (emailConfirm === "" || emailConfirm === email) && phoneOk && validateCpf === null && cpf.replace(/\D/g, "").length === 11 && emailStatus !== "exists" && !submitting && (method !== "card" || card.number.length >= 12 && card.ccv.length >= 3 && card.expiryMonth.length >= 1 && card.expiryYear.length >= 2 && card.holderName.length >= 1);
|
|
2972
|
-
const submit = (0,
|
|
3022
|
+
const submit = (0, import_react18.useCallback)(async () => {
|
|
2973
3023
|
setFormSubmitAttempted(true);
|
|
2974
3024
|
setError(null);
|
|
2975
3025
|
setEmailTaken(false);
|
|
@@ -2998,10 +3048,16 @@ function useCheckoutForm(args) {
|
|
|
2998
3048
|
name: card.holderName || name.trim(),
|
|
2999
3049
|
email,
|
|
3000
3050
|
cpfCnpj: cpf.replace(/\D/g, ""),
|
|
3001
|
-
//
|
|
3002
|
-
//
|
|
3003
|
-
|
|
3004
|
-
|
|
3051
|
+
// Plan-V 0.28.4 — Asaas's `creditCardHolderInfo.postalCode`
|
|
3052
|
+
// rejects all-zeros with `tokenize_failed:invalid_holderInfo`
|
|
3053
|
+
// ("O CEP informado é inválido."). The default CheckoutPage
|
|
3054
|
+
// doesn't collect CEP from the user (reference design skipped
|
|
3055
|
+
// it), so ship a known-valid placeholder. Apps that need real
|
|
3056
|
+
// customer addresses must override CheckoutPageDefault and
|
|
3057
|
+
// collect CEP — see personalburn's PaywallStepPagamento for
|
|
3058
|
+
// the pattern.
|
|
3059
|
+
postalCode: "01001000",
|
|
3060
|
+
addressNumber: "100",
|
|
3005
3061
|
phone
|
|
3006
3062
|
}
|
|
3007
3063
|
};
|
|
@@ -3019,7 +3075,7 @@ function useCheckoutForm(args) {
|
|
|
3019
3075
|
const result = await auth.subscribeAnonymous(args2);
|
|
3020
3076
|
return result;
|
|
3021
3077
|
} catch (err) {
|
|
3022
|
-
if (err instanceof
|
|
3078
|
+
if (err instanceof import_sdk13.EmailTakenError) {
|
|
3023
3079
|
setEmailTaken(true);
|
|
3024
3080
|
setLoginUrl(err.loginUrl);
|
|
3025
3081
|
setEmailStatus("exists");
|
|
@@ -3076,14 +3132,14 @@ function mod11(digits, len) {
|
|
|
3076
3132
|
}
|
|
3077
3133
|
|
|
3078
3134
|
// src/hooks/usePlan.ts
|
|
3079
|
-
var
|
|
3135
|
+
var import_sdk14 = require("@hook-sdk/sdk");
|
|
3080
3136
|
function usePlan() {
|
|
3081
|
-
const { plan } = (0,
|
|
3137
|
+
const { plan } = (0, import_sdk14.useHook)();
|
|
3082
3138
|
return plan;
|
|
3083
3139
|
}
|
|
3084
3140
|
|
|
3085
3141
|
// src/defaults/CheckoutPageDefault.tsx
|
|
3086
|
-
var
|
|
3142
|
+
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
3087
3143
|
var INTENT_KEY = "hook:paywall:intent";
|
|
3088
3144
|
var PIX_PAYLOAD_KEY = "hook:paywall:pix-pending";
|
|
3089
3145
|
function readIntent() {
|
|
@@ -3131,18 +3187,18 @@ function detectCardBrand(num) {
|
|
|
3131
3187
|
function CheckoutPageDefault() {
|
|
3132
3188
|
const navigate = (0, import_react_router_dom3.useNavigate)();
|
|
3133
3189
|
const plan = usePlan();
|
|
3134
|
-
const intent = (0,
|
|
3190
|
+
const intent = (0, import_react19.useMemo)(readIntent, []);
|
|
3135
3191
|
const defaultMethod = intent.method === "pix-auto" ? "pix-auto" : "card";
|
|
3136
3192
|
const defaultCycle = intent.cycle === "MONTHLY" ? "MONTHLY" : "YEARLY";
|
|
3137
3193
|
const form = useCheckoutForm({ defaultMethod, defaultCycle });
|
|
3138
|
-
const [expiryMmAa, setExpiryMmAa] = (0,
|
|
3139
|
-
(0,
|
|
3194
|
+
const [expiryMmAa, setExpiryMmAa] = (0, import_react19.useState)("");
|
|
3195
|
+
(0, import_react19.useEffect)(() => {
|
|
3140
3196
|
const { month, year } = parseExpiryMmAa(expiryMmAa);
|
|
3141
3197
|
if (month !== form.card.expiryMonth || year !== form.card.expiryYear) {
|
|
3142
3198
|
form.setCard({ expiryMonth: month, expiryYear: year });
|
|
3143
3199
|
}
|
|
3144
3200
|
}, [expiryMmAa]);
|
|
3145
|
-
(0,
|
|
3201
|
+
(0, import_react19.useEffect)(() => {
|
|
3146
3202
|
if (form.emailTaken && form.loginUrl) {
|
|
3147
3203
|
const t = setTimeout(() => navigate(form.loginUrl), 1200);
|
|
3148
3204
|
return () => clearTimeout(t);
|
|
@@ -3154,16 +3210,16 @@ function CheckoutPageDefault() {
|
|
|
3154
3210
|
trialDays: plan.data.trialDays
|
|
3155
3211
|
} : null;
|
|
3156
3212
|
const annual = form.cycle === "YEARLY";
|
|
3157
|
-
const cyclePrice = (0,
|
|
3213
|
+
const cyclePrice = (0, import_react19.useMemo)(() => {
|
|
3158
3214
|
if (!planInfo) return null;
|
|
3159
3215
|
return annual ? planInfo.yearlyPriceCents ?? planInfo.priceCents * 12 : planInfo.priceCents;
|
|
3160
3216
|
}, [planInfo, annual]);
|
|
3161
|
-
const monthlyText = (0,
|
|
3217
|
+
const monthlyText = (0, import_react19.useMemo)(() => {
|
|
3162
3218
|
if (!planInfo) return "";
|
|
3163
3219
|
const monthly = annual && planInfo.yearlyPriceCents ? Math.round(planInfo.yearlyPriceCents / 12) : planInfo.priceCents;
|
|
3164
3220
|
return formatBrl(monthly);
|
|
3165
3221
|
}, [planInfo, annual]);
|
|
3166
|
-
const todayCents = (0,
|
|
3222
|
+
const todayCents = (0, import_react19.useMemo)(() => {
|
|
3167
3223
|
if (form.method === "pix-auto") return cyclePrice ?? 0;
|
|
3168
3224
|
const trialDays2 = planInfo?.trialDays ?? 0;
|
|
3169
3225
|
if (trialDays2 > 0) return 0;
|
|
@@ -3171,7 +3227,7 @@ function CheckoutPageDefault() {
|
|
|
3171
3227
|
}, [form.method, cyclePrice, planInfo]);
|
|
3172
3228
|
const todayAmount = formatBrl(todayCents);
|
|
3173
3229
|
const cyclePriceText = cyclePrice !== null ? formatBrl(cyclePrice) : "";
|
|
3174
|
-
const annualSavingsCents = (0,
|
|
3230
|
+
const annualSavingsCents = (0, import_react19.useMemo)(() => {
|
|
3175
3231
|
if (!planInfo || !planInfo.yearlyPriceCents) return 0;
|
|
3176
3232
|
return planInfo.priceCents * 12 - planInfo.yearlyPriceCents;
|
|
3177
3233
|
}, [planInfo]);
|
|
@@ -3199,57 +3255,57 @@ function CheckoutPageDefault() {
|
|
|
3199
3255
|
}
|
|
3200
3256
|
navigate(result.redirect.replace(/^.*\/app\/[^/]+/, "") || "/");
|
|
3201
3257
|
}
|
|
3202
|
-
return /* @__PURE__ */ (0,
|
|
3203
|
-
form.emailTaken ? /* @__PURE__ */ (0,
|
|
3258
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex-1 flex flex-col bg-background min-h-0", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("form", { onSubmit, className: "flex-1 overflow-y-auto", children: [
|
|
3259
|
+
form.emailTaken ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "px-5 pt-4", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { role: "alert", className: "rounded-2xl bg-destructive/10 p-4 text-sm text-destructive border border-destructive/20", children: [
|
|
3204
3260
|
"Esse e-mail j\xE1 tem conta nesse app.",
|
|
3205
3261
|
" ",
|
|
3206
|
-
/* @__PURE__ */ (0,
|
|
3262
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("a", { href: form.loginUrl ?? "/signin", className: "underline font-semibold", children: "Entrar agora" })
|
|
3207
3263
|
] }) }) : null,
|
|
3208
|
-
form.error ? /* @__PURE__ */ (0,
|
|
3209
|
-
/* @__PURE__ */ (0,
|
|
3210
|
-
/* @__PURE__ */ (0,
|
|
3211
|
-
/* @__PURE__ */ (0,
|
|
3212
|
-
/* @__PURE__ */ (0,
|
|
3264
|
+
form.error ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "px-5 pt-4", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { role: "alert", className: "rounded-2xl bg-destructive/10 p-4 text-sm text-destructive border border-destructive/20", children: form.error.message || "N\xE3o foi poss\xEDvel concluir o pagamento. Tente novamente." }) }) : null,
|
|
3265
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "px-5 pt-4", children: form.method === "card" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "rounded-2xl bg-card border-[1.5px] border-foreground p-3.5", children: [
|
|
3266
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-2 mb-2", children: [
|
|
3267
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ShieldIcon, { className: "w-4 h-4" }),
|
|
3268
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "text-sm font-bold", children: "Voc\xEA N\xC3O ser\xE1 cobrada hoje" })
|
|
3213
3269
|
] }),
|
|
3214
|
-
/* @__PURE__ */ (0,
|
|
3215
|
-
/* @__PURE__ */ (0,
|
|
3216
|
-
/* @__PURE__ */ (0,
|
|
3217
|
-
/* @__PURE__ */ (0,
|
|
3270
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex justify-between items-baseline text-sm text-muted-foreground", children: [
|
|
3271
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { children: "R$ 0,00 agora" }),
|
|
3272
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "opacity-50", children: "\xB7" }),
|
|
3273
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { children: [
|
|
3218
3274
|
monthlyText,
|
|
3219
3275
|
"/m\xEAs ap\xF3s ",
|
|
3220
3276
|
trialDays,
|
|
3221
3277
|
" dias"
|
|
3222
3278
|
] })
|
|
3223
3279
|
] }),
|
|
3224
|
-
/* @__PURE__ */ (0,
|
|
3225
|
-
/* @__PURE__ */ (0,
|
|
3280
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "mt-2.5 text-[11px] text-muted-foreground flex items-center gap-1.5", children: [
|
|
3281
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(BellIcon, { className: "w-2.5 h-2.5" }),
|
|
3226
3282
|
"Avisamos por email 2 dias antes da primeira cobran\xE7a"
|
|
3227
3283
|
] })
|
|
3228
|
-
] }) : /* @__PURE__ */ (0,
|
|
3229
|
-
/* @__PURE__ */ (0,
|
|
3230
|
-
/* @__PURE__ */ (0,
|
|
3231
|
-
/* @__PURE__ */ (0,
|
|
3284
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "rounded-2xl p-3.5 bg-emerald-50 border-[1.5px] border-emerald-600/60", children: [
|
|
3285
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-2 mb-2 text-emerald-900", children: [
|
|
3286
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ShieldIcon, { className: "w-4 h-4" }),
|
|
3287
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-sm font-bold", children: [
|
|
3232
3288
|
"Garantia incondicional de ",
|
|
3233
3289
|
trialDays,
|
|
3234
3290
|
" dias"
|
|
3235
3291
|
] })
|
|
3236
3292
|
] }),
|
|
3237
|
-
/* @__PURE__ */ (0,
|
|
3293
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-sm text-emerald-900 leading-snug", children: [
|
|
3238
3294
|
"Voc\xEA paga ",
|
|
3239
|
-
/* @__PURE__ */ (0,
|
|
3295
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("b", { children: todayAmount }),
|
|
3240
3296
|
" agora via Pix.",
|
|
3241
|
-
/* @__PURE__ */ (0,
|
|
3297
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("br", {}),
|
|
3242
3298
|
"N\xE3o gostou em ",
|
|
3243
3299
|
trialDays,
|
|
3244
3300
|
" dias? Devolvemos ",
|
|
3245
|
-
/* @__PURE__ */ (0,
|
|
3301
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("b", { children: "100%" }),
|
|
3246
3302
|
" sem perguntas \u2014 direto pelo app."
|
|
3247
3303
|
] })
|
|
3248
3304
|
] }) }),
|
|
3249
|
-
/* @__PURE__ */ (0,
|
|
3250
|
-
/* @__PURE__ */ (0,
|
|
3251
|
-
/* @__PURE__ */ (0,
|
|
3252
|
-
/* @__PURE__ */ (0,
|
|
3305
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("section", { className: "px-5 pt-5", children: [
|
|
3306
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("h2", { className: "font-display text-2xl mb-3.5 leading-tight text-foreground", children: "Quase l\xE1." }),
|
|
3307
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldLabel, { children: "Email" }),
|
|
3308
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3253
3309
|
FieldInput,
|
|
3254
3310
|
{
|
|
3255
3311
|
type: "email",
|
|
@@ -3266,10 +3322,10 @@ function CheckoutPageDefault() {
|
|
|
3266
3322
|
valid: form.emailStatus === "available"
|
|
3267
3323
|
}
|
|
3268
3324
|
),
|
|
3269
|
-
!form.emailError && /* @__PURE__ */ (0,
|
|
3270
|
-
/* @__PURE__ */ (0,
|
|
3271
|
-
/* @__PURE__ */ (0,
|
|
3272
|
-
/* @__PURE__ */ (0,
|
|
3325
|
+
!form.emailError && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldHint, { children: form.emailStatus === "checking" ? "Verificando\u2026" : form.emailStatus === "available" ? "\u2713 Dispon\xEDvel" : "Voc\xEA vai usar este email para entrar no app" }),
|
|
3326
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "h-3" }),
|
|
3327
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldLabel, { children: "Nome completo" }),
|
|
3328
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3273
3329
|
FieldInput,
|
|
3274
3330
|
{
|
|
3275
3331
|
type: "text",
|
|
@@ -3282,9 +3338,9 @@ function CheckoutPageDefault() {
|
|
|
3282
3338
|
valid: !!form.name && !form.nameError
|
|
3283
3339
|
}
|
|
3284
3340
|
),
|
|
3285
|
-
/* @__PURE__ */ (0,
|
|
3286
|
-
/* @__PURE__ */ (0,
|
|
3287
|
-
/* @__PURE__ */ (0,
|
|
3341
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "h-3" }),
|
|
3342
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldLabel, { children: "CPF" }),
|
|
3343
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3288
3344
|
FieldInput,
|
|
3289
3345
|
{
|
|
3290
3346
|
type: "text",
|
|
@@ -3297,10 +3353,10 @@ function CheckoutPageDefault() {
|
|
|
3297
3353
|
valid: !!form.cpf && !form.cpfError
|
|
3298
3354
|
}
|
|
3299
3355
|
),
|
|
3300
|
-
form.method === "card" ? /* @__PURE__ */ (0,
|
|
3301
|
-
/* @__PURE__ */ (0,
|
|
3302
|
-
/* @__PURE__ */ (0,
|
|
3303
|
-
/* @__PURE__ */ (0,
|
|
3356
|
+
form.method === "card" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
|
|
3357
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "h-3" }),
|
|
3358
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldLabel, { children: "Telefone" }),
|
|
3359
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3304
3360
|
FieldInput,
|
|
3305
3361
|
{
|
|
3306
3362
|
type: "tel",
|
|
@@ -3314,29 +3370,29 @@ function CheckoutPageDefault() {
|
|
|
3314
3370
|
valid: !!form.phone && !form.phoneError
|
|
3315
3371
|
}
|
|
3316
3372
|
),
|
|
3317
|
-
!form.phoneError && /* @__PURE__ */ (0,
|
|
3373
|
+
!form.phoneError && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldHint, { children: "Usado pra confirmar pagamento e tratar disputas." })
|
|
3318
3374
|
] }) : null
|
|
3319
3375
|
] }),
|
|
3320
|
-
/* @__PURE__ */ (0,
|
|
3321
|
-
/* @__PURE__ */ (0,
|
|
3322
|
-
/* @__PURE__ */ (0,
|
|
3323
|
-
/* @__PURE__ */ (0,
|
|
3376
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("section", { className: "px-5 pt-5", children: [
|
|
3377
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldLabel, { children: "Forma de pagamento" }),
|
|
3378
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { role: "tablist", className: "flex gap-1.5 bg-muted p-1 rounded-xl", children: [
|
|
3379
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3324
3380
|
TabButton,
|
|
3325
3381
|
{
|
|
3326
3382
|
active: form.method === "card",
|
|
3327
3383
|
onClick: () => form.setMethod("card"),
|
|
3328
|
-
icon: /* @__PURE__ */ (0,
|
|
3384
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(CardIcon, { className: "w-3.5 h-3.5" }),
|
|
3329
3385
|
label: "Cart\xE3o",
|
|
3330
3386
|
subtitle: trialDays > 0 ? `${trialDays} dias gr\xE1tis` : "pague hoje",
|
|
3331
3387
|
subtitleActiveClass: "text-emerald-700"
|
|
3332
3388
|
}
|
|
3333
3389
|
),
|
|
3334
|
-
/* @__PURE__ */ (0,
|
|
3390
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3335
3391
|
TabButton,
|
|
3336
3392
|
{
|
|
3337
3393
|
active: form.method === "pix-auto",
|
|
3338
3394
|
onClick: () => form.setMethod("pix-auto"),
|
|
3339
|
-
icon: /* @__PURE__ */ (0,
|
|
3395
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(PixIcon, { className: "w-3.5 h-3.5" }),
|
|
3340
3396
|
label: "Pix",
|
|
3341
3397
|
subtitle: `pague hoje \xB7 garantia ${trialDays}d`,
|
|
3342
3398
|
subtitleActiveClass: "text-foreground/70"
|
|
@@ -3344,10 +3400,10 @@ function CheckoutPageDefault() {
|
|
|
3344
3400
|
)
|
|
3345
3401
|
] })
|
|
3346
3402
|
] }),
|
|
3347
|
-
form.method === "card" ? /* @__PURE__ */ (0,
|
|
3348
|
-
/* @__PURE__ */ (0,
|
|
3349
|
-
/* @__PURE__ */ (0,
|
|
3350
|
-
/* @__PURE__ */ (0,
|
|
3403
|
+
form.method === "card" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("section", { className: "px-5 pt-3.5", children: [
|
|
3404
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldLabel, { children: "N\xFAmero do cart\xE3o" }),
|
|
3405
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "relative", children: [
|
|
3406
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3351
3407
|
FieldInput,
|
|
3352
3408
|
{
|
|
3353
3409
|
type: "text",
|
|
@@ -3359,13 +3415,13 @@ function CheckoutPageDefault() {
|
|
|
3359
3415
|
style: cardBrand ? { paddingRight: "4.5rem" } : void 0
|
|
3360
3416
|
}
|
|
3361
3417
|
),
|
|
3362
|
-
cardBrand && /* @__PURE__ */ (0,
|
|
3418
|
+
cardBrand && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "absolute right-3 top-1/2 -translate-y-1/2 text-[10px] font-bold tracking-wide px-1.5 py-0.5 rounded bg-muted text-muted-foreground", children: cardBrand })
|
|
3363
3419
|
] }),
|
|
3364
|
-
/* @__PURE__ */ (0,
|
|
3365
|
-
/* @__PURE__ */ (0,
|
|
3366
|
-
/* @__PURE__ */ (0,
|
|
3367
|
-
/* @__PURE__ */ (0,
|
|
3368
|
-
/* @__PURE__ */ (0,
|
|
3420
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "h-3" }),
|
|
3421
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex gap-2.5", children: [
|
|
3422
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex-1", children: [
|
|
3423
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldLabel, { children: "Validade" }),
|
|
3424
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3369
3425
|
FieldInput,
|
|
3370
3426
|
{
|
|
3371
3427
|
type: "text",
|
|
@@ -3377,9 +3433,9 @@ function CheckoutPageDefault() {
|
|
|
3377
3433
|
}
|
|
3378
3434
|
)
|
|
3379
3435
|
] }),
|
|
3380
|
-
/* @__PURE__ */ (0,
|
|
3381
|
-
/* @__PURE__ */ (0,
|
|
3382
|
-
/* @__PURE__ */ (0,
|
|
3436
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex-1", children: [
|
|
3437
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldLabel, { children: "CVV" }),
|
|
3438
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3383
3439
|
FieldInput,
|
|
3384
3440
|
{
|
|
3385
3441
|
type: "text",
|
|
@@ -3392,9 +3448,9 @@ function CheckoutPageDefault() {
|
|
|
3392
3448
|
)
|
|
3393
3449
|
] })
|
|
3394
3450
|
] }),
|
|
3395
|
-
/* @__PURE__ */ (0,
|
|
3396
|
-
/* @__PURE__ */ (0,
|
|
3397
|
-
/* @__PURE__ */ (0,
|
|
3451
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "h-3" }),
|
|
3452
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(FieldLabel, { children: "Nome no cart\xE3o" }),
|
|
3453
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3398
3454
|
FieldInput,
|
|
3399
3455
|
{
|
|
3400
3456
|
type: "text",
|
|
@@ -3404,89 +3460,89 @@ function CheckoutPageDefault() {
|
|
|
3404
3460
|
onChange: (v) => form.setCard({ holderName: v })
|
|
3405
3461
|
}
|
|
3406
3462
|
)
|
|
3407
|
-
] }) : /* @__PURE__ */ (0,
|
|
3408
|
-
/* @__PURE__ */ (0,
|
|
3409
|
-
/* @__PURE__ */ (0,
|
|
3410
|
-
/* @__PURE__ */ (0,
|
|
3411
|
-
/* @__PURE__ */ (0,
|
|
3463
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("section", { className: "px-5 pt-3.5", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "rounded-2xl bg-card border border-border p-3.5 flex gap-3.5 items-center", children: [
|
|
3464
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "w-[72px] h-[72px] rounded-xl shrink-0 border-2 border-foreground relative overflow-hidden bg-muted", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 w-[22px] h-[22px] bg-background flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(PixIcon, { className: "w-3.5 h-3.5 text-foreground" }) }) }),
|
|
3465
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex-1", children: [
|
|
3466
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "text-xs font-bold uppercase tracking-wider text-muted-foreground", children: "pagamento em segundos" }),
|
|
3467
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-sm text-foreground mt-1 leading-snug", children: [
|
|
3412
3468
|
"Geramos seu ",
|
|
3413
|
-
/* @__PURE__ */ (0,
|
|
3469
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("b", { children: "QR Pix" }),
|
|
3414
3470
|
" no pr\xF3ximo passo. Pague pelo app do banco e seu acesso libera ",
|
|
3415
|
-
/* @__PURE__ */ (0,
|
|
3471
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("b", { children: "imediatamente" }),
|
|
3416
3472
|
"."
|
|
3417
3473
|
] })
|
|
3418
3474
|
] })
|
|
3419
3475
|
] }) }),
|
|
3420
|
-
/* @__PURE__ */ (0,
|
|
3421
|
-
/* @__PURE__ */ (0,
|
|
3422
|
-
/* @__PURE__ */ (0,
|
|
3423
|
-
/* @__PURE__ */ (0,
|
|
3424
|
-
/* @__PURE__ */ (0,
|
|
3476
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("section", { className: "px-5 pt-5", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "bg-muted rounded-2xl p-4", children: [
|
|
3477
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex justify-between mb-2.5", children: [
|
|
3478
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { children: [
|
|
3479
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "text-sm font-semibold text-foreground", children: annual ? "Plano Anual" : "Plano Mensal" }),
|
|
3480
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "text-[11px] text-muted-foreground", children: "Coach" })
|
|
3425
3481
|
] }),
|
|
3426
|
-
/* @__PURE__ */ (0,
|
|
3427
|
-
/* @__PURE__ */ (0,
|
|
3482
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-right", children: [
|
|
3483
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-sm font-bold text-foreground", children: [
|
|
3428
3484
|
cyclePriceText,
|
|
3429
3485
|
"/",
|
|
3430
3486
|
annual ? "ano" : "m\xEAs"
|
|
3431
3487
|
] }),
|
|
3432
|
-
annual && annualSavingsCents > 0 && /* @__PURE__ */ (0,
|
|
3488
|
+
annual && annualSavingsCents > 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-[11px] text-emerald-700 font-semibold", children: [
|
|
3433
3489
|
"economia ",
|
|
3434
3490
|
formatBrl(annualSavingsCents)
|
|
3435
3491
|
] })
|
|
3436
3492
|
] })
|
|
3437
3493
|
] }),
|
|
3438
|
-
/* @__PURE__ */ (0,
|
|
3439
|
-
/* @__PURE__ */ (0,
|
|
3440
|
-
/* @__PURE__ */ (0,
|
|
3441
|
-
/* @__PURE__ */ (0,
|
|
3442
|
-
form.method === "card" && trialDays > 0 && /* @__PURE__ */ (0,
|
|
3494
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "h-px bg-border my-3" }),
|
|
3495
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex justify-between items-baseline", children: [
|
|
3496
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { children: [
|
|
3497
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "text-sm font-bold text-foreground", children: "Voc\xEA paga hoje" }),
|
|
3498
|
+
form.method === "card" && trialDays > 0 && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-[11px] text-muted-foreground mt-0.5", children: [
|
|
3443
3499
|
"cobran\xE7a inicia no dia ",
|
|
3444
3500
|
trialDays
|
|
3445
3501
|
] }),
|
|
3446
|
-
form.method === "pix-auto" && /* @__PURE__ */ (0,
|
|
3502
|
+
form.method === "pix-auto" && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-[11px] text-emerald-700 mt-0.5 font-semibold", children: [
|
|
3447
3503
|
"reembolso garantido at\xE9 o dia ",
|
|
3448
3504
|
trialDays
|
|
3449
3505
|
] })
|
|
3450
3506
|
] }),
|
|
3451
|
-
/* @__PURE__ */ (0,
|
|
3507
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "text-2xl font-bold font-display tracking-tight text-foreground", children: todayAmount })
|
|
3452
3508
|
] })
|
|
3453
3509
|
] }) }),
|
|
3454
|
-
/* @__PURE__ */ (0,
|
|
3455
|
-
/* @__PURE__ */ (0,
|
|
3456
|
-
/* @__PURE__ */ (0,
|
|
3510
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "h-4" }),
|
|
3511
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "sticky bottom-0 px-5 pt-3.5 pb-6 bg-gradient-to-b from-transparent to-background", children: [
|
|
3512
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3457
3513
|
"button",
|
|
3458
3514
|
{
|
|
3459
3515
|
type: "submit",
|
|
3460
3516
|
disabled: !form.canSubmit,
|
|
3461
3517
|
className: "w-full rounded-full bg-primary text-primary-foreground min-h-14 px-5 text-base font-bold inline-flex items-center justify-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed shadow-lg",
|
|
3462
|
-
children: form.submitting ? /* @__PURE__ */ (0,
|
|
3463
|
-
/* @__PURE__ */ (0,
|
|
3518
|
+
children: form.submitting ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
|
|
3519
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(Spinner2, {}),
|
|
3464
3520
|
" ",
|
|
3465
3521
|
form.method === "pix-auto" ? "Gerando QR\u2026" : "Confirmando\u2026"
|
|
3466
|
-
] }) : form.method === "card" ? /* @__PURE__ */ (0,
|
|
3467
|
-
/* @__PURE__ */ (0,
|
|
3522
|
+
] }) : form.method === "card" ? /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
|
|
3523
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(LockIcon, { className: "w-3.5 h-3.5" }),
|
|
3468
3524
|
" Confirmar e come\xE7ar gr\xE1tis"
|
|
3469
|
-
] }) : /* @__PURE__ */ (0,
|
|
3470
|
-
/* @__PURE__ */ (0,
|
|
3525
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
|
|
3526
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(PixIcon, { className: "w-3.5 h-3.5" }),
|
|
3471
3527
|
" Gerar QR \xB7 pagar ",
|
|
3472
3528
|
todayAmount
|
|
3473
3529
|
] })
|
|
3474
3530
|
}
|
|
3475
3531
|
),
|
|
3476
|
-
/* @__PURE__ */ (0,
|
|
3532
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "text-center mt-2.5 text-xs text-muted-foreground", children: [
|
|
3477
3533
|
"Ao continuar, voc\xEA concorda com nossos ",
|
|
3478
|
-
/* @__PURE__ */ (0,
|
|
3534
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("u", { children: "Termos" }),
|
|
3479
3535
|
". Pagamento seguro Asaas."
|
|
3480
3536
|
] }),
|
|
3481
|
-
/* @__PURE__ */ (0,
|
|
3482
|
-
/* @__PURE__ */ (0,
|
|
3483
|
-
/* @__PURE__ */ (0,
|
|
3537
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "mt-3 flex items-center justify-center gap-3.5 text-[11px] text-muted-foreground", children: [
|
|
3538
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { className: "inline-flex items-center gap-1", children: [
|
|
3539
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(LockIcon, { className: "w-2.5 h-2.5 opacity-60" }),
|
|
3484
3540
|
" SSL 256-bit"
|
|
3485
3541
|
] }),
|
|
3486
|
-
/* @__PURE__ */ (0,
|
|
3487
|
-
/* @__PURE__ */ (0,
|
|
3488
|
-
/* @__PURE__ */ (0,
|
|
3489
|
-
/* @__PURE__ */ (0,
|
|
3542
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "w-px h-2.5 bg-border" }),
|
|
3543
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { children: "Pagamento via Asaas" }),
|
|
3544
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "w-px h-2.5 bg-border" }),
|
|
3545
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { children: [
|
|
3490
3546
|
"Garantia ",
|
|
3491
3547
|
trialDays,
|
|
3492
3548
|
" dias"
|
|
@@ -3496,13 +3552,13 @@ function CheckoutPageDefault() {
|
|
|
3496
3552
|
] }) });
|
|
3497
3553
|
}
|
|
3498
3554
|
function FieldLabel({ children }) {
|
|
3499
|
-
return /* @__PURE__ */ (0,
|
|
3555
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground mb-1.5", children });
|
|
3500
3556
|
}
|
|
3501
3557
|
function FieldInput(props) {
|
|
3502
3558
|
const baseClass = "w-full px-4 rounded-xl bg-card text-base text-foreground outline-none border-[1.5px] transition-colors";
|
|
3503
3559
|
const stateClass = props.error ? "border-destructive focus:border-destructive" : props.valid ? "border-emerald-600 focus:border-emerald-700" : "border-border focus:border-foreground";
|
|
3504
|
-
return /* @__PURE__ */ (0,
|
|
3505
|
-
/* @__PURE__ */ (0,
|
|
3560
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(import_jsx_runtime28.Fragment, { children: [
|
|
3561
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3506
3562
|
"input",
|
|
3507
3563
|
{
|
|
3508
3564
|
type: props.type ?? "text",
|
|
@@ -3519,14 +3575,14 @@ function FieldInput(props) {
|
|
|
3519
3575
|
className: `${baseClass} ${stateClass}`
|
|
3520
3576
|
}
|
|
3521
3577
|
),
|
|
3522
|
-
props.error ? /* @__PURE__ */ (0,
|
|
3578
|
+
props.error ? /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "mt-1.5 text-xs text-destructive font-medium", children: props.error }) : null
|
|
3523
3579
|
] });
|
|
3524
3580
|
}
|
|
3525
3581
|
function FieldHint({ children }) {
|
|
3526
|
-
return /* @__PURE__ */ (0,
|
|
3582
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "mt-1.5 text-xs text-muted-foreground", children });
|
|
3527
3583
|
}
|
|
3528
3584
|
function TabButton({ active, onClick, icon, label, subtitle, subtitleActiveClass }) {
|
|
3529
|
-
return /* @__PURE__ */ (0,
|
|
3585
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
|
|
3530
3586
|
"button",
|
|
3531
3587
|
{
|
|
3532
3588
|
type: "button",
|
|
@@ -3536,45 +3592,45 @@ function TabButton({ active, onClick, icon, label, subtitle, subtitleActiveClass
|
|
|
3536
3592
|
className: `flex-1 flex flex-col items-center justify-center gap-0.5 py-2.5 px-1.5 rounded-lg text-sm font-semibold transition-colors ${active ? "bg-card text-foreground shadow-sm" : "bg-transparent text-muted-foreground"}`,
|
|
3537
3593
|
style: { minHeight: 56 },
|
|
3538
3594
|
children: [
|
|
3539
|
-
/* @__PURE__ */ (0,
|
|
3595
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { className: "inline-flex items-center gap-1.5", children: [
|
|
3540
3596
|
icon,
|
|
3541
3597
|
" ",
|
|
3542
3598
|
label
|
|
3543
3599
|
] }),
|
|
3544
|
-
/* @__PURE__ */ (0,
|
|
3600
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: `text-[10px] font-medium ${active ? subtitleActiveClass : "text-muted-foreground/70"}`, children: subtitle })
|
|
3545
3601
|
]
|
|
3546
3602
|
}
|
|
3547
3603
|
);
|
|
3548
3604
|
}
|
|
3549
3605
|
function CardIcon({ className }) {
|
|
3550
|
-
return /* @__PURE__ */ (0,
|
|
3551
|
-
/* @__PURE__ */ (0,
|
|
3552
|
-
/* @__PURE__ */ (0,
|
|
3606
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
3607
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("rect", { x: "2.5", y: "5.5", width: "19", height: "13", rx: "2.5" }),
|
|
3608
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M2.5 10h19" })
|
|
3553
3609
|
] });
|
|
3554
3610
|
}
|
|
3555
3611
|
function PixIcon({ className }) {
|
|
3556
|
-
return /* @__PURE__ */ (0,
|
|
3612
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("svg", { className, viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M12 2L2 12l10 10 10-10L12 2zm0 4.83L17.17 12 12 17.17 6.83 12 12 6.83z" }) });
|
|
3557
3613
|
}
|
|
3558
3614
|
function LockIcon({ className }) {
|
|
3559
|
-
return /* @__PURE__ */ (0,
|
|
3560
|
-
/* @__PURE__ */ (0,
|
|
3561
|
-
/* @__PURE__ */ (0,
|
|
3615
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
3616
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("rect", { x: "4", y: "10", width: "16", height: "11", rx: "2.5" }),
|
|
3617
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M7.5 10V7a4.5 4.5 0 119 0v3" })
|
|
3562
3618
|
] });
|
|
3563
3619
|
}
|
|
3564
3620
|
function ShieldIcon({ className }) {
|
|
3565
|
-
return /* @__PURE__ */ (0,
|
|
3566
|
-
/* @__PURE__ */ (0,
|
|
3567
|
-
/* @__PURE__ */ (0,
|
|
3621
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
3622
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M12 2.5l8 3v6c0 5-3.5 8.5-8 10-4.5-1.5-8-5-8-10v-6l8-3z" }),
|
|
3623
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M9 12l2 2 4-4" })
|
|
3568
3624
|
] });
|
|
3569
3625
|
}
|
|
3570
3626
|
function BellIcon({ className }) {
|
|
3571
|
-
return /* @__PURE__ */ (0,
|
|
3572
|
-
/* @__PURE__ */ (0,
|
|
3573
|
-
/* @__PURE__ */ (0,
|
|
3627
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
3628
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M6 17V11a6 6 0 1112 0v6l1.5 2H4.5L6 17z" }),
|
|
3629
|
+
/* @__PURE__ */ (0, import_jsx_runtime28.jsx)("path", { d: "M10 21a2 2 0 004 0" })
|
|
3574
3630
|
] });
|
|
3575
3631
|
}
|
|
3576
3632
|
function Spinner2() {
|
|
3577
|
-
return /* @__PURE__ */ (0,
|
|
3633
|
+
return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
|
|
3578
3634
|
"span",
|
|
3579
3635
|
{
|
|
3580
3636
|
className: "w-4 h-4 rounded-full border-2 border-white/40 border-t-white",
|
|
@@ -3584,10 +3640,10 @@ function Spinner2() {
|
|
|
3584
3640
|
}
|
|
3585
3641
|
|
|
3586
3642
|
// src/defaults/PixWaitingPageDefault.tsx
|
|
3587
|
-
var
|
|
3643
|
+
var import_react20 = require("react");
|
|
3588
3644
|
var import_react_router_dom4 = require("react-router-dom");
|
|
3589
|
-
var
|
|
3590
|
-
var
|
|
3645
|
+
var import_sdk15 = require("@hook-sdk/sdk");
|
|
3646
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
3591
3647
|
var PIX_PAYLOAD_KEY2 = "hook:paywall:pix-pending";
|
|
3592
3648
|
var TIMEOUT_MS = 30 * 60 * 1e3;
|
|
3593
3649
|
function readPixPayload() {
|
|
@@ -3609,19 +3665,19 @@ function clearPixPayload() {
|
|
|
3609
3665
|
}
|
|
3610
3666
|
function PixWaitingPageDefault() {
|
|
3611
3667
|
const navigate = (0, import_react_router_dom4.useNavigate)();
|
|
3612
|
-
const { subscription } = (0,
|
|
3613
|
-
const payload = (0,
|
|
3614
|
-
const [copied, setCopied] = (0,
|
|
3615
|
-
const [timedOut, setTimedOut] = (0,
|
|
3616
|
-
(0,
|
|
3668
|
+
const { subscription } = (0, import_sdk15.useHook)();
|
|
3669
|
+
const payload = (0, import_react20.useMemo)(readPixPayload, []);
|
|
3670
|
+
const [copied, setCopied] = (0, import_react20.useState)(false);
|
|
3671
|
+
const [timedOut, setTimedOut] = (0, import_react20.useState)(false);
|
|
3672
|
+
(0, import_react20.useEffect)(() => {
|
|
3617
3673
|
if (!payload) navigate("/paywall/checkout", { replace: true });
|
|
3618
3674
|
}, [payload, navigate]);
|
|
3619
|
-
(0,
|
|
3675
|
+
(0, import_react20.useEffect)(() => {
|
|
3620
3676
|
const t = setTimeout(() => setTimedOut(true), TIMEOUT_MS);
|
|
3621
3677
|
return () => clearTimeout(t);
|
|
3622
3678
|
}, []);
|
|
3623
3679
|
const hasAccess = subscription.hasAccess;
|
|
3624
|
-
(0,
|
|
3680
|
+
(0, import_react20.useEffect)(() => {
|
|
3625
3681
|
if (hasAccess) {
|
|
3626
3682
|
clearPixPayload();
|
|
3627
3683
|
navigate("/", { replace: true });
|
|
@@ -3638,10 +3694,10 @@ function PixWaitingPageDefault() {
|
|
|
3638
3694
|
}
|
|
3639
3695
|
if (!payload) return null;
|
|
3640
3696
|
if (timedOut) {
|
|
3641
|
-
return /* @__PURE__ */ (0,
|
|
3642
|
-
/* @__PURE__ */ (0,
|
|
3643
|
-
/* @__PURE__ */ (0,
|
|
3644
|
-
/* @__PURE__ */ (0,
|
|
3697
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex-1 flex flex-col items-center justify-center px-6 py-10 text-center bg-background space-y-4", children: [
|
|
3698
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h1", { className: "font-display text-2xl text-foreground", children: "PIX expirado" }),
|
|
3699
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-sm text-muted-foreground", children: "O tempo pra pagar acabou. Gere um novo PIX." }),
|
|
3700
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
3645
3701
|
"button",
|
|
3646
3702
|
{
|
|
3647
3703
|
onClick: () => {
|
|
@@ -3654,20 +3710,20 @@ function PixWaitingPageDefault() {
|
|
|
3654
3710
|
)
|
|
3655
3711
|
] });
|
|
3656
3712
|
}
|
|
3657
|
-
return /* @__PURE__ */ (0,
|
|
3658
|
-
/* @__PURE__ */ (0,
|
|
3659
|
-
/* @__PURE__ */ (0,
|
|
3660
|
-
/* @__PURE__ */ (0,
|
|
3713
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex-1 flex flex-col items-center px-6 py-8 bg-background space-y-6", children: [
|
|
3714
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("header", { className: "text-center space-y-2", children: [
|
|
3715
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("h1", { className: "font-display text-2xl text-foreground", children: "Pague o PIX" }),
|
|
3716
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-sm text-muted-foreground", children: "Escaneie o QR Code no app do seu banco. O acesso libera assim que confirmarmos o pagamento." })
|
|
3661
3717
|
] }),
|
|
3662
|
-
payload.base64 ? /* @__PURE__ */ (0,
|
|
3718
|
+
payload.base64 ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
3663
3719
|
"img",
|
|
3664
3720
|
{
|
|
3665
3721
|
src: `data:image/png;base64,${payload.base64}`,
|
|
3666
3722
|
alt: "QR Code PIX",
|
|
3667
3723
|
className: "w-64 h-64 rounded-2xl border border-border bg-card p-2"
|
|
3668
3724
|
}
|
|
3669
|
-
) : /* @__PURE__ */ (0,
|
|
3670
|
-
payload.payload ? /* @__PURE__ */ (0,
|
|
3725
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "w-64 h-64 rounded-2xl border border-border bg-card flex items-center justify-center text-sm text-muted-foreground", children: "QR indispon\xEDvel" }),
|
|
3726
|
+
payload.payload ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
3671
3727
|
"button",
|
|
3672
3728
|
{
|
|
3673
3729
|
onClick: copyPayload,
|
|
@@ -3675,34 +3731,34 @@ function PixWaitingPageDefault() {
|
|
|
3675
3731
|
children: copied ? "\u2713 Copiado!" : "Copiar c\xF3digo PIX"
|
|
3676
3732
|
}
|
|
3677
3733
|
) : null,
|
|
3678
|
-
/* @__PURE__ */ (0,
|
|
3679
|
-
/* @__PURE__ */ (0,
|
|
3734
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
|
|
3735
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "inline-block w-2 h-2 rounded-full bg-primary animate-pulse" }),
|
|
3680
3736
|
"Aguardando pagamento\u2026"
|
|
3681
3737
|
] }),
|
|
3682
|
-
/* @__PURE__ */ (0,
|
|
3738
|
+
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)("p", { className: "text-center text-xs text-muted-foreground", children: "Pode fechar essa janela \u2014 tamb\xE9m enviamos um link de acesso pro seu e-mail." })
|
|
3683
3739
|
] });
|
|
3684
3740
|
}
|
|
3685
3741
|
|
|
3686
3742
|
// src/hooks/useLoginForm.ts
|
|
3687
|
-
var
|
|
3688
|
-
var
|
|
3743
|
+
var import_react21 = require("react");
|
|
3744
|
+
var import_sdk16 = require("@hook-sdk/sdk");
|
|
3689
3745
|
var EMAIL_RE2 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
3690
3746
|
var MIN_PASSWORD = 8;
|
|
3691
3747
|
function useLoginForm() {
|
|
3692
|
-
const { auth } = (0,
|
|
3693
|
-
const [email, setEmail] = (0,
|
|
3694
|
-
const [password, setPassword] = (0,
|
|
3695
|
-
const [submitting, setSubmitting] = (0,
|
|
3696
|
-
const [error, setError] = (0,
|
|
3697
|
-
const [touchedEmail, setTouchedEmail] = (0,
|
|
3698
|
-
const [touchedPassword, setTouchedPassword] = (0,
|
|
3699
|
-
const [formSubmitAttempted, setFormSubmitAttempted] = (0,
|
|
3700
|
-
const validateEmail = (0,
|
|
3748
|
+
const { auth } = (0, import_sdk16.useHook)();
|
|
3749
|
+
const [email, setEmail] = (0, import_react21.useState)("");
|
|
3750
|
+
const [password, setPassword] = (0, import_react21.useState)("");
|
|
3751
|
+
const [submitting, setSubmitting] = (0, import_react21.useState)(false);
|
|
3752
|
+
const [error, setError] = (0, import_react21.useState)(null);
|
|
3753
|
+
const [touchedEmail, setTouchedEmail] = (0, import_react21.useState)(false);
|
|
3754
|
+
const [touchedPassword, setTouchedPassword] = (0, import_react21.useState)(false);
|
|
3755
|
+
const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react21.useState)(false);
|
|
3756
|
+
const validateEmail = (0, import_react21.useMemo)(() => {
|
|
3701
3757
|
if (email.length === 0) return null;
|
|
3702
3758
|
if (!EMAIL_RE2.test(email)) return "Formato de e-mail inv\xE1lido.";
|
|
3703
3759
|
return null;
|
|
3704
3760
|
}, [email]);
|
|
3705
|
-
const validatePassword = (0,
|
|
3761
|
+
const validatePassword = (0, import_react21.useMemo)(() => {
|
|
3706
3762
|
if (password.length === 0) return null;
|
|
3707
3763
|
if (password.length < MIN_PASSWORD) return `M\xEDnimo de ${MIN_PASSWORD} caracteres.`;
|
|
3708
3764
|
return null;
|
|
@@ -3710,7 +3766,7 @@ function useLoginForm() {
|
|
|
3710
3766
|
const emailError = touchedEmail || formSubmitAttempted ? validateEmail : null;
|
|
3711
3767
|
const passwordError = touchedPassword || formSubmitAttempted ? validatePassword : null;
|
|
3712
3768
|
const canSubmit = email.length > 0 && password.length >= MIN_PASSWORD && validateEmail === null && validatePassword === null && !submitting;
|
|
3713
|
-
const submit = (0,
|
|
3769
|
+
const submit = (0, import_react21.useCallback)(async () => {
|
|
3714
3770
|
setFormSubmitAttempted(true);
|
|
3715
3771
|
if (!canSubmit) return false;
|
|
3716
3772
|
setSubmitting(true);
|
|
@@ -3744,32 +3800,32 @@ function useLoginForm() {
|
|
|
3744
3800
|
}
|
|
3745
3801
|
|
|
3746
3802
|
// src/hooks/useSignupForm.ts
|
|
3747
|
-
var
|
|
3748
|
-
var
|
|
3803
|
+
var import_react22 = require("react");
|
|
3804
|
+
var import_sdk17 = require("@hook-sdk/sdk");
|
|
3749
3805
|
var EMAIL_RE3 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
3750
3806
|
var MIN_PASSWORD2 = 8;
|
|
3751
3807
|
function useSignupForm() {
|
|
3752
|
-
const { auth } = (0,
|
|
3753
|
-
const [name, setName] = (0,
|
|
3754
|
-
const [email, setEmail] = (0,
|
|
3755
|
-
const [password, setPassword] = (0,
|
|
3756
|
-
const [submitting, setSubmitting] = (0,
|
|
3757
|
-
const [error, setError] = (0,
|
|
3758
|
-
const [touchedName, setTouchedName] = (0,
|
|
3759
|
-
const [touchedEmail, setTouchedEmail] = (0,
|
|
3760
|
-
const [touchedPassword, setTouchedPassword] = (0,
|
|
3761
|
-
const [formSubmitAttempted, setFormSubmitAttempted] = (0,
|
|
3762
|
-
const validateName = (0,
|
|
3808
|
+
const { auth } = (0, import_sdk17.useHook)();
|
|
3809
|
+
const [name, setName] = (0, import_react22.useState)("");
|
|
3810
|
+
const [email, setEmail] = (0, import_react22.useState)("");
|
|
3811
|
+
const [password, setPassword] = (0, import_react22.useState)("");
|
|
3812
|
+
const [submitting, setSubmitting] = (0, import_react22.useState)(false);
|
|
3813
|
+
const [error, setError] = (0, import_react22.useState)(null);
|
|
3814
|
+
const [touchedName, setTouchedName] = (0, import_react22.useState)(false);
|
|
3815
|
+
const [touchedEmail, setTouchedEmail] = (0, import_react22.useState)(false);
|
|
3816
|
+
const [touchedPassword, setTouchedPassword] = (0, import_react22.useState)(false);
|
|
3817
|
+
const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react22.useState)(false);
|
|
3818
|
+
const validateName = (0, import_react22.useMemo)(() => {
|
|
3763
3819
|
if (name.length === 0) return null;
|
|
3764
3820
|
if (name.trim().length < 2) return "Nome muito curto.";
|
|
3765
3821
|
return null;
|
|
3766
3822
|
}, [name]);
|
|
3767
|
-
const validateEmail = (0,
|
|
3823
|
+
const validateEmail = (0, import_react22.useMemo)(() => {
|
|
3768
3824
|
if (email.length === 0) return null;
|
|
3769
3825
|
if (!EMAIL_RE3.test(email)) return "Formato de e-mail inv\xE1lido.";
|
|
3770
3826
|
return null;
|
|
3771
3827
|
}, [email]);
|
|
3772
|
-
const validatePassword = (0,
|
|
3828
|
+
const validatePassword = (0, import_react22.useMemo)(() => {
|
|
3773
3829
|
if (password.length === 0) return null;
|
|
3774
3830
|
if (password.length < MIN_PASSWORD2) return `M\xEDnimo de ${MIN_PASSWORD2} caracteres.`;
|
|
3775
3831
|
return null;
|
|
@@ -3778,7 +3834,7 @@ function useSignupForm() {
|
|
|
3778
3834
|
const emailError = touchedEmail || formSubmitAttempted ? validateEmail : null;
|
|
3779
3835
|
const passwordError = touchedPassword || formSubmitAttempted ? validatePassword : null;
|
|
3780
3836
|
const canSubmit = name.trim().length >= 2 && email.length > 0 && password.length >= MIN_PASSWORD2 && validateName === null && validateEmail === null && validatePassword === null && !submitting;
|
|
3781
|
-
const submit = (0,
|
|
3837
|
+
const submit = (0, import_react22.useCallback)(async () => {
|
|
3782
3838
|
setFormSubmitAttempted(true);
|
|
3783
3839
|
if (!canSubmit) return false;
|
|
3784
3840
|
setSubmitting(true);
|
|
@@ -3816,25 +3872,25 @@ function useSignupForm() {
|
|
|
3816
3872
|
}
|
|
3817
3873
|
|
|
3818
3874
|
// src/hooks/useForgotForm.ts
|
|
3819
|
-
var
|
|
3820
|
-
var
|
|
3875
|
+
var import_react23 = require("react");
|
|
3876
|
+
var import_sdk18 = require("@hook-sdk/sdk");
|
|
3821
3877
|
var EMAIL_RE4 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
3822
3878
|
function useForgotForm() {
|
|
3823
|
-
const { auth } = (0,
|
|
3824
|
-
const [email, setEmail] = (0,
|
|
3825
|
-
const [submitting, setSubmitting] = (0,
|
|
3826
|
-
const [sent, setSent] = (0,
|
|
3827
|
-
const [error, setError] = (0,
|
|
3828
|
-
const [touchedEmail, setTouchedEmail] = (0,
|
|
3829
|
-
const [formSubmitAttempted, setFormSubmitAttempted] = (0,
|
|
3830
|
-
const validateEmail = (0,
|
|
3879
|
+
const { auth } = (0, import_sdk18.useHook)();
|
|
3880
|
+
const [email, setEmail] = (0, import_react23.useState)("");
|
|
3881
|
+
const [submitting, setSubmitting] = (0, import_react23.useState)(false);
|
|
3882
|
+
const [sent, setSent] = (0, import_react23.useState)(false);
|
|
3883
|
+
const [error, setError] = (0, import_react23.useState)(null);
|
|
3884
|
+
const [touchedEmail, setTouchedEmail] = (0, import_react23.useState)(false);
|
|
3885
|
+
const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react23.useState)(false);
|
|
3886
|
+
const validateEmail = (0, import_react23.useMemo)(() => {
|
|
3831
3887
|
if (email.length === 0) return null;
|
|
3832
3888
|
if (!EMAIL_RE4.test(email)) return "Formato de e-mail inv\xE1lido.";
|
|
3833
3889
|
return null;
|
|
3834
3890
|
}, [email]);
|
|
3835
3891
|
const emailError = touchedEmail || formSubmitAttempted ? validateEmail : null;
|
|
3836
3892
|
const canSubmit = email.length > 0 && validateEmail === null && !submitting;
|
|
3837
|
-
const submit = (0,
|
|
3893
|
+
const submit = (0, import_react23.useCallback)(async () => {
|
|
3838
3894
|
setFormSubmitAttempted(true);
|
|
3839
3895
|
if (!canSubmit) return false;
|
|
3840
3896
|
setSubmitting(true);
|
|
@@ -3865,32 +3921,32 @@ function useForgotForm() {
|
|
|
3865
3921
|
}
|
|
3866
3922
|
|
|
3867
3923
|
// src/hooks/useResetForm.ts
|
|
3868
|
-
var
|
|
3869
|
-
var
|
|
3870
|
-
var MIN_PASSWORD3 =
|
|
3924
|
+
var import_react24 = require("react");
|
|
3925
|
+
var import_sdk19 = require("@hook-sdk/sdk");
|
|
3926
|
+
var MIN_PASSWORD3 = 8;
|
|
3871
3927
|
function useResetForm() {
|
|
3872
|
-
const { auth } = (0,
|
|
3873
|
-
const [token, setToken] = (0,
|
|
3874
|
-
const [password, setPassword] = (0,
|
|
3875
|
-
const [confirm, setConfirm] = (0,
|
|
3876
|
-
const [submitting, setSubmitting] = (0,
|
|
3877
|
-
const [done, setDone] = (0,
|
|
3878
|
-
const [error, setError] = (0,
|
|
3879
|
-
const [touchedPassword, setTouchedPassword] = (0,
|
|
3880
|
-
const [touchedConfirm, setTouchedConfirm] = (0,
|
|
3881
|
-
const [formSubmitAttempted, setFormSubmitAttempted] = (0,
|
|
3882
|
-
(0,
|
|
3928
|
+
const { auth } = (0, import_sdk19.useHook)();
|
|
3929
|
+
const [token, setToken] = (0, import_react24.useState)(null);
|
|
3930
|
+
const [password, setPassword] = (0, import_react24.useState)("");
|
|
3931
|
+
const [confirm, setConfirm] = (0, import_react24.useState)("");
|
|
3932
|
+
const [submitting, setSubmitting] = (0, import_react24.useState)(false);
|
|
3933
|
+
const [done, setDone] = (0, import_react24.useState)(false);
|
|
3934
|
+
const [error, setError] = (0, import_react24.useState)(null);
|
|
3935
|
+
const [touchedPassword, setTouchedPassword] = (0, import_react24.useState)(false);
|
|
3936
|
+
const [touchedConfirm, setTouchedConfirm] = (0, import_react24.useState)(false);
|
|
3937
|
+
const [formSubmitAttempted, setFormSubmitAttempted] = (0, import_react24.useState)(false);
|
|
3938
|
+
(0, import_react24.useEffect)(() => {
|
|
3883
3939
|
if (typeof window === "undefined") return;
|
|
3884
3940
|
const params = new URLSearchParams(window.location.search);
|
|
3885
3941
|
const t = params.get("token");
|
|
3886
3942
|
setToken(t && t.length > 0 ? t : null);
|
|
3887
3943
|
}, []);
|
|
3888
|
-
const validatePassword = (0,
|
|
3944
|
+
const validatePassword = (0, import_react24.useMemo)(() => {
|
|
3889
3945
|
if (password.length === 0) return null;
|
|
3890
3946
|
if (password.length < MIN_PASSWORD3) return `M\xEDnimo de ${MIN_PASSWORD3} caracteres.`;
|
|
3891
3947
|
return null;
|
|
3892
3948
|
}, [password]);
|
|
3893
|
-
const validateConfirm = (0,
|
|
3949
|
+
const validateConfirm = (0, import_react24.useMemo)(() => {
|
|
3894
3950
|
if (confirm.length === 0) return null;
|
|
3895
3951
|
if (confirm !== password) return "Senhas n\xE3o coincidem.";
|
|
3896
3952
|
return null;
|
|
@@ -3898,7 +3954,7 @@ function useResetForm() {
|
|
|
3898
3954
|
const passwordError = touchedPassword || formSubmitAttempted ? validatePassword : null;
|
|
3899
3955
|
const confirmError = touchedConfirm || formSubmitAttempted ? validateConfirm : null;
|
|
3900
3956
|
const canSubmit = token !== null && password.length >= MIN_PASSWORD3 && confirm === password && validatePassword === null && validateConfirm === null && !submitting && !done;
|
|
3901
|
-
const submit = (0,
|
|
3957
|
+
const submit = (0, import_react24.useCallback)(async () => {
|
|
3902
3958
|
setFormSubmitAttempted(true);
|
|
3903
3959
|
if (!canSubmit || token === null) return;
|
|
3904
3960
|
setSubmitting(true);
|
|
@@ -3966,12 +4022,12 @@ function discountPercent(anchorCents, realCents) {
|
|
|
3966
4022
|
}
|
|
3967
4023
|
|
|
3968
4024
|
// src/hooks/useAuthPrimitives.ts
|
|
3969
|
-
var
|
|
3970
|
-
var
|
|
4025
|
+
var import_react25 = require("react");
|
|
4026
|
+
var import_sdk20 = require("@hook-sdk/sdk");
|
|
3971
4027
|
var warned = false;
|
|
3972
4028
|
function useAuthPrimitives() {
|
|
3973
|
-
const { auth } = (0,
|
|
3974
|
-
(0,
|
|
4029
|
+
const { auth } = (0, import_sdk20.useHook)();
|
|
4030
|
+
(0, import_react25.useEffect)(() => {
|
|
3975
4031
|
if (!warned && process.env.NODE_ENV !== "production") {
|
|
3976
4032
|
warned = true;
|
|
3977
4033
|
console.warn(
|
|
@@ -3993,9 +4049,9 @@ function useAuthPrimitives() {
|
|
|
3993
4049
|
}
|
|
3994
4050
|
|
|
3995
4051
|
// src/hooks/useAuth.ts
|
|
3996
|
-
var
|
|
4052
|
+
var import_sdk21 = require("@hook-sdk/sdk");
|
|
3997
4053
|
function useAuth() {
|
|
3998
|
-
const { user, authStatus, auth } = (0,
|
|
4054
|
+
const { user, authStatus, auth } = (0, import_sdk21.useHook)();
|
|
3999
4055
|
return {
|
|
4000
4056
|
user,
|
|
4001
4057
|
authStatus,
|
|
@@ -4004,26 +4060,26 @@ function useAuth() {
|
|
|
4004
4060
|
}
|
|
4005
4061
|
|
|
4006
4062
|
// src/index.ts
|
|
4007
|
-
var
|
|
4063
|
+
var import_sdk26 = require("@hook-sdk/sdk");
|
|
4008
4064
|
|
|
4009
4065
|
// src/hooks/useSubscription.ts
|
|
4010
|
-
var
|
|
4066
|
+
var import_sdk22 = require("@hook-sdk/sdk");
|
|
4011
4067
|
function useSubscription() {
|
|
4012
|
-
const { subscription } = (0,
|
|
4068
|
+
const { subscription } = (0, import_sdk22.useHook)();
|
|
4013
4069
|
return {
|
|
4014
4070
|
status: subscription.status()
|
|
4015
4071
|
};
|
|
4016
4072
|
}
|
|
4017
4073
|
|
|
4018
4074
|
// src/hooks/useReminders.ts
|
|
4019
|
-
var
|
|
4020
|
-
var
|
|
4075
|
+
var import_react26 = require("react");
|
|
4076
|
+
var import_sdk23 = require("@hook-sdk/sdk");
|
|
4021
4077
|
function useReminders() {
|
|
4022
|
-
const { push } = (0,
|
|
4078
|
+
const { push } = (0, import_sdk23.useHook)();
|
|
4023
4079
|
const r = push.reminders;
|
|
4024
|
-
const [reminders, setReminders] = (0,
|
|
4025
|
-
const [loading, setLoading] = (0,
|
|
4026
|
-
const reload = (0,
|
|
4080
|
+
const [reminders, setReminders] = (0, import_react26.useState)([]);
|
|
4081
|
+
const [loading, setLoading] = (0, import_react26.useState)(true);
|
|
4082
|
+
const reload = (0, import_react26.useCallback)(async () => {
|
|
4027
4083
|
setLoading(true);
|
|
4028
4084
|
try {
|
|
4029
4085
|
const next = await r.list();
|
|
@@ -4032,38 +4088,38 @@ function useReminders() {
|
|
|
4032
4088
|
setLoading(false);
|
|
4033
4089
|
}
|
|
4034
4090
|
}, [r]);
|
|
4035
|
-
(0,
|
|
4091
|
+
(0, import_react26.useEffect)(() => {
|
|
4036
4092
|
void reload();
|
|
4037
4093
|
}, [reload]);
|
|
4038
|
-
const setReminder = (0,
|
|
4094
|
+
const setReminder = (0, import_react26.useCallback)(async (input) => {
|
|
4039
4095
|
await r.set(input);
|
|
4040
4096
|
await reload();
|
|
4041
4097
|
}, [r, reload]);
|
|
4042
|
-
const deleteReminder = (0,
|
|
4098
|
+
const deleteReminder = (0, import_react26.useCallback)(async (slot) => {
|
|
4043
4099
|
await r.delete(slot);
|
|
4044
4100
|
await reload();
|
|
4045
4101
|
}, [r, reload]);
|
|
4046
|
-
const schedule = (0,
|
|
4102
|
+
const schedule = (0, import_react26.useCallback)(async (items) => {
|
|
4047
4103
|
return r.schedule(items);
|
|
4048
4104
|
}, [r]);
|
|
4049
|
-
const setFallbacks = (0,
|
|
4105
|
+
const setFallbacks = (0, import_react26.useCallback)(async (items) => {
|
|
4050
4106
|
return r.setFallbacks(items);
|
|
4051
4107
|
}, [r]);
|
|
4052
4108
|
return { reminders, loading, setReminder, deleteReminder, schedule, setFallbacks };
|
|
4053
4109
|
}
|
|
4054
4110
|
|
|
4055
4111
|
// src/hooks/useToast.ts
|
|
4056
|
-
var
|
|
4112
|
+
var import_react27 = require("react");
|
|
4057
4113
|
function useToast() {
|
|
4058
|
-
const [items, setItems] = (0,
|
|
4059
|
-
const show = (0,
|
|
4114
|
+
const [items, setItems] = (0, import_react27.useState)([]);
|
|
4115
|
+
const show = (0, import_react27.useCallback)((message, kind = "info") => {
|
|
4060
4116
|
const id = `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
|
|
4061
4117
|
setItems((prev) => [...prev, { id, message, kind }]);
|
|
4062
4118
|
setTimeout(() => {
|
|
4063
4119
|
setItems((prev) => prev.filter((t) => t.id !== id));
|
|
4064
4120
|
}, 4e3);
|
|
4065
4121
|
}, []);
|
|
4066
|
-
const dismiss = (0,
|
|
4122
|
+
const dismiss = (0, import_react27.useCallback)((id) => {
|
|
4067
4123
|
setItems((prev) => prev.filter((t) => t.id !== id));
|
|
4068
4124
|
}, []);
|
|
4069
4125
|
return { items, show, dismiss };
|
|
@@ -4071,20 +4127,20 @@ function useToast() {
|
|
|
4071
4127
|
|
|
4072
4128
|
// src/RouteBoundary.tsx
|
|
4073
4129
|
var import_react_router_dom5 = require("react-router-dom");
|
|
4074
|
-
var
|
|
4130
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
4075
4131
|
function RouteBoundary({ children }) {
|
|
4076
|
-
return /* @__PURE__ */ (0,
|
|
4132
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_react_router_dom5.Routes, { children: [
|
|
4077
4133
|
children,
|
|
4078
|
-
/* @__PURE__ */ (0,
|
|
4134
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react_router_dom5.Route, { path: "*", element: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(DefaultNotFound, {}) })
|
|
4079
4135
|
] });
|
|
4080
4136
|
}
|
|
4081
4137
|
function DefaultNotFound() {
|
|
4082
|
-
return /* @__PURE__ */ (0,
|
|
4138
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { role: "alert", children: "P\xE1gina n\xE3o encontrada" });
|
|
4083
4139
|
}
|
|
4084
4140
|
|
|
4085
4141
|
// src/PreAuthShell.tsx
|
|
4086
4142
|
var import_react_router_dom6 = require("react-router-dom");
|
|
4087
|
-
var
|
|
4143
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
4088
4144
|
function PreAuthShell({
|
|
4089
4145
|
basename,
|
|
4090
4146
|
testRouter,
|
|
@@ -4092,20 +4148,20 @@ function PreAuthShell({
|
|
|
4092
4148
|
children
|
|
4093
4149
|
}) {
|
|
4094
4150
|
if (testRouter === "memory") {
|
|
4095
|
-
return /* @__PURE__ */ (0,
|
|
4151
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_router_dom6.MemoryRouter, { basename, initialEntries: testInitialEntries, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_router_dom6.Routes, { children }) });
|
|
4096
4152
|
}
|
|
4097
|
-
return /* @__PURE__ */ (0,
|
|
4153
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_router_dom6.BrowserRouter, { basename, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_react_router_dom6.Routes, { children }) });
|
|
4098
4154
|
}
|
|
4099
4155
|
|
|
4100
4156
|
// src/OnboardingFlow.tsx
|
|
4101
|
-
var
|
|
4102
|
-
var
|
|
4157
|
+
var import_react29 = require("react");
|
|
4158
|
+
var import_sdk24 = require("@hook-sdk/sdk");
|
|
4103
4159
|
|
|
4104
4160
|
// src/hooks/useOnboardingStep.ts
|
|
4105
|
-
var
|
|
4106
|
-
var OnboardingStepContext = (0,
|
|
4161
|
+
var import_react28 = require("react");
|
|
4162
|
+
var OnboardingStepContext = (0, import_react28.createContext)(null);
|
|
4107
4163
|
function useOnboardingStep() {
|
|
4108
|
-
const ctx = (0,
|
|
4164
|
+
const ctx = (0, import_react28.useContext)(OnboardingStepContext);
|
|
4109
4165
|
if (!ctx) {
|
|
4110
4166
|
throw new Error(
|
|
4111
4167
|
"[hook-template] useOnboardingStep must be used inside <OnboardingFlow>. (G75)"
|
|
@@ -4115,7 +4171,7 @@ function useOnboardingStep() {
|
|
|
4115
4171
|
}
|
|
4116
4172
|
|
|
4117
4173
|
// src/OnboardingFlow.tsx
|
|
4118
|
-
var
|
|
4174
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
4119
4175
|
var isFilled = (v) => v != null && v !== "";
|
|
4120
4176
|
var CURRENT_STEP_FIELD = "currentStep";
|
|
4121
4177
|
function readPersistedStepIdx(draft) {
|
|
@@ -4128,12 +4184,12 @@ function OnboardingFlow({
|
|
|
4128
4184
|
onComplete,
|
|
4129
4185
|
persistKey
|
|
4130
4186
|
}) {
|
|
4131
|
-
const [draft, setDraft, status] = (0,
|
|
4132
|
-
const draftRef = (0,
|
|
4187
|
+
const [draft, setDraft, status] = (0, import_sdk24.usePersistedState)(persistKey, {});
|
|
4188
|
+
const draftRef = (0, import_react29.useRef)(draft);
|
|
4133
4189
|
draftRef.current = draft;
|
|
4134
4190
|
const idx = readPersistedStepIdx(draft);
|
|
4135
4191
|
const clampedIdx = Math.min(Math.max(idx, 0), Math.max(steps.length - 1, 0));
|
|
4136
|
-
const setIdx = (0,
|
|
4192
|
+
const setIdx = (0, import_react29.useCallback)(
|
|
4137
4193
|
(n) => {
|
|
4138
4194
|
setDraft((prev) => {
|
|
4139
4195
|
const prevIdx = readPersistedStepIdx(prev);
|
|
@@ -4143,7 +4199,7 @@ function OnboardingFlow({
|
|
|
4143
4199
|
},
|
|
4144
4200
|
[setDraft]
|
|
4145
4201
|
);
|
|
4146
|
-
const setValue = (0,
|
|
4202
|
+
const setValue = (0, import_react29.useCallback)(
|
|
4147
4203
|
(patch) => {
|
|
4148
4204
|
draftRef.current = { ...draftRef.current, ...patch };
|
|
4149
4205
|
setDraft((prev) => ({ ...prev, ...patch }));
|
|
@@ -4151,9 +4207,9 @@ function OnboardingFlow({
|
|
|
4151
4207
|
[setDraft]
|
|
4152
4208
|
);
|
|
4153
4209
|
const step = steps[clampedIdx];
|
|
4154
|
-
const hookCtx = (0,
|
|
4210
|
+
const hookCtx = (0, import_sdk24.useHook)();
|
|
4155
4211
|
const track2 = typeof hookCtx.track === "function" ? hookCtx.track : void 0;
|
|
4156
|
-
(0,
|
|
4212
|
+
(0, import_react29.useEffect)(() => {
|
|
4157
4213
|
if (status.loading) return;
|
|
4158
4214
|
if (!step) return;
|
|
4159
4215
|
if (!track2) return;
|
|
@@ -4163,11 +4219,11 @@ function OnboardingFlow({
|
|
|
4163
4219
|
total_steps: steps.length
|
|
4164
4220
|
});
|
|
4165
4221
|
}, [step?.id, clampedIdx, steps.length, status.loading, track2]);
|
|
4166
|
-
const valid = (0,
|
|
4222
|
+
const valid = (0, import_react29.useMemo)(
|
|
4167
4223
|
() => step ? (step.validates ?? []).every((field) => isFilled(draft[field])) : false,
|
|
4168
4224
|
[draft, step]
|
|
4169
4225
|
);
|
|
4170
|
-
const next = (0,
|
|
4226
|
+
const next = (0, import_react29.useCallback)(() => {
|
|
4171
4227
|
if (!step) return;
|
|
4172
4228
|
const current = draftRef.current;
|
|
4173
4229
|
const validNow = (step.validates ?? []).every((field) => isFilled(current[field]));
|
|
@@ -4178,8 +4234,8 @@ function OnboardingFlow({
|
|
|
4178
4234
|
setIdx(clampedIdx + 1);
|
|
4179
4235
|
}
|
|
4180
4236
|
}, [clampedIdx, onComplete, step, steps.length, setIdx]);
|
|
4181
|
-
const prevStep = (0,
|
|
4182
|
-
const ctx = (0,
|
|
4237
|
+
const prevStep = (0, import_react29.useCallback)(() => setIdx((i) => Math.max(0, i - 1)), [setIdx]);
|
|
4238
|
+
const ctx = (0, import_react29.useMemo)(
|
|
4183
4239
|
() => ({
|
|
4184
4240
|
stepIndex: clampedIdx,
|
|
4185
4241
|
totalSteps: steps.length,
|
|
@@ -4205,7 +4261,7 @@ function OnboardingFlow({
|
|
|
4205
4261
|
`[hook-template] OnboardingFlow: missing screen component for step '${step.id}' (expected key '${step.screen}' in screens prop)`
|
|
4206
4262
|
);
|
|
4207
4263
|
}
|
|
4208
|
-
return /* @__PURE__ */ (0,
|
|
4264
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(OnboardingStepContext.Provider, { value: ctx, children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Screen, {}) });
|
|
4209
4265
|
}
|
|
4210
4266
|
|
|
4211
4267
|
// src/hooks/useFeature.ts
|
|
@@ -4215,22 +4271,22 @@ function useFeature(name) {
|
|
|
4215
4271
|
}
|
|
4216
4272
|
|
|
4217
4273
|
// src/components/paywall/Paywall.tsx
|
|
4218
|
-
var
|
|
4219
|
-
var
|
|
4274
|
+
var import_react32 = require("react");
|
|
4275
|
+
var import_sdk25 = require("@hook-sdk/sdk");
|
|
4220
4276
|
|
|
4221
4277
|
// src/components/paywall/PaywallProvider.tsx
|
|
4222
|
-
var
|
|
4223
|
-
var
|
|
4224
|
-
var PaywallContext = (0,
|
|
4278
|
+
var import_react30 = require("react");
|
|
4279
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
4280
|
+
var PaywallContext = (0, import_react30.createContext)(null);
|
|
4225
4281
|
function PaywallProvider({ children }) {
|
|
4226
4282
|
const state = usePaywallState();
|
|
4227
|
-
return /* @__PURE__ */ (0,
|
|
4283
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(PaywallContext.Provider, { value: state, children });
|
|
4228
4284
|
}
|
|
4229
4285
|
|
|
4230
4286
|
// src/components/paywall/usePaywallContext.ts
|
|
4231
|
-
var
|
|
4287
|
+
var import_react31 = require("react");
|
|
4232
4288
|
function usePaywallContext() {
|
|
4233
|
-
const ctx = (0,
|
|
4289
|
+
const ctx = (0, import_react31.useContext)(PaywallContext);
|
|
4234
4290
|
if (!ctx) {
|
|
4235
4291
|
throw new Error("usePaywallContext must be used within <PaywallProvider>");
|
|
4236
4292
|
}
|
|
@@ -4238,7 +4294,7 @@ function usePaywallContext() {
|
|
|
4238
4294
|
}
|
|
4239
4295
|
|
|
4240
4296
|
// src/components/paywall/PaywallMethodTabs.tsx
|
|
4241
|
-
var
|
|
4297
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
4242
4298
|
function PaywallMethodTabs({
|
|
4243
4299
|
labels,
|
|
4244
4300
|
className,
|
|
@@ -4247,10 +4303,10 @@ function PaywallMethodTabs({
|
|
|
4247
4303
|
}) {
|
|
4248
4304
|
const { methods, selectedMethod, selectMethod } = usePaywallContext();
|
|
4249
4305
|
if (methods.length < 2) return null;
|
|
4250
|
-
return /* @__PURE__ */ (0,
|
|
4306
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { role: "tablist", "aria-label": "M\xE9todo de pagamento", className, children: methods.map((m) => {
|
|
4251
4307
|
const active = m === selectedMethod;
|
|
4252
4308
|
const label = labels[m] ?? m;
|
|
4253
|
-
return /* @__PURE__ */ (0,
|
|
4309
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
4254
4310
|
"button",
|
|
4255
4311
|
{
|
|
4256
4312
|
type: "button",
|
|
@@ -4268,16 +4324,16 @@ function PaywallMethodTabs({
|
|
|
4268
4324
|
}
|
|
4269
4325
|
|
|
4270
4326
|
// src/components/paywall/PaywallMethodContent.tsx
|
|
4271
|
-
var
|
|
4327
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
4272
4328
|
function PaywallMethodContent({ copy, className, rowClassName }) {
|
|
4273
4329
|
const { selectedMethod, hasConsumedTrial } = usePaywallContext();
|
|
4274
4330
|
const useCardConsumed = selectedMethod === "card" && hasConsumedTrial && copy.cardConsumedTrial;
|
|
4275
4331
|
const rows = useCardConsumed ? copy.cardConsumedTrial.bodyRows : selectedMethod === "pix-auto" || selectedMethod === "pix-once" ? copy.pix.bodyRows : copy.card.bodyRows;
|
|
4276
|
-
return /* @__PURE__ */ (0,
|
|
4332
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { role: "tabpanel", id: `paywall-tab-${selectedMethod}`, className, children: rows.map((row, i) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: rowClassName, children: row }, i)) });
|
|
4277
4333
|
}
|
|
4278
4334
|
|
|
4279
4335
|
// src/components/paywall/PaywallCyclePicker.tsx
|
|
4280
|
-
var
|
|
4336
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
4281
4337
|
var VARIANT_CLASSES = {
|
|
4282
4338
|
default: { card: "", cardSelected: "" },
|
|
4283
4339
|
"premium-gold": {
|
|
@@ -4302,7 +4358,7 @@ function PaywallCyclePicker({
|
|
|
4302
4358
|
const { cycle: selected, setCycle, plan, anchorPriceCents } = ctx;
|
|
4303
4359
|
const cycles = ["MONTHLY", "YEARLY"];
|
|
4304
4360
|
if (render) {
|
|
4305
|
-
return /* @__PURE__ */ (0,
|
|
4361
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className, children: render({ cycles, selected, setCycle, plan, anchorPriceCents }) });
|
|
4306
4362
|
}
|
|
4307
4363
|
if (cycles.length < 2) return null;
|
|
4308
4364
|
const v = VARIANT_CLASSES[variant];
|
|
@@ -4312,7 +4368,7 @@ function PaywallCyclePicker({
|
|
|
4312
4368
|
const yearlyCents = plan?.yearlyCents ?? 0;
|
|
4313
4369
|
const anchorMonthly = plan?.anchorMonthlyCents ?? null;
|
|
4314
4370
|
const anchorYearly = plan?.anchorYearlyCents ?? null;
|
|
4315
|
-
return /* @__PURE__ */ (0,
|
|
4371
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
4316
4372
|
"div",
|
|
4317
4373
|
{
|
|
4318
4374
|
role: "radiogroup",
|
|
@@ -4324,7 +4380,7 @@ function PaywallCyclePicker({
|
|
|
4324
4380
|
const suffix = c === "YEARLY" ? labels.annualSuffix : labels.monthlySuffix;
|
|
4325
4381
|
const mainCents = c === "YEARLY" ? Math.round(yearlyCents / 12) : monthlyCents;
|
|
4326
4382
|
const anchorCents = c === "YEARLY" ? anchorYearly : anchorMonthly;
|
|
4327
|
-
return /* @__PURE__ */ (0,
|
|
4383
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
4328
4384
|
"button",
|
|
4329
4385
|
{
|
|
4330
4386
|
type: "button",
|
|
@@ -4337,10 +4393,10 @@ function PaywallCyclePicker({
|
|
|
4337
4393
|
active ? composedCardSelectedClassName : ""
|
|
4338
4394
|
].filter(Boolean).join(" "),
|
|
4339
4395
|
children: [
|
|
4340
|
-
/* @__PURE__ */ (0,
|
|
4341
|
-
/* @__PURE__ */ (0,
|
|
4342
|
-
/* @__PURE__ */ (0,
|
|
4343
|
-
anchorCents != null && anchorCents > mainCents ? /* @__PURE__ */ (0,
|
|
4396
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "font-bold text-base leading-tight", children: formatBRL(mainCents) }),
|
|
4397
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-xs opacity-70 leading-tight", children: suffix }),
|
|
4398
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-xs opacity-60 leading-tight", children: label }),
|
|
4399
|
+
anchorCents != null && anchorCents > mainCents ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: anchorClassName ?? "text-xs opacity-50", children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("s", { children: formatBRL(anchorCents) }) }) : null
|
|
4344
4400
|
]
|
|
4345
4401
|
},
|
|
4346
4402
|
c
|
|
@@ -4351,7 +4407,7 @@ function PaywallCyclePicker({
|
|
|
4351
4407
|
}
|
|
4352
4408
|
|
|
4353
4409
|
// src/components/paywall/Paywall.tsx
|
|
4354
|
-
var
|
|
4410
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
4355
4411
|
var NBSP = "\xA0";
|
|
4356
4412
|
function Paywall({
|
|
4357
4413
|
copy,
|
|
@@ -4359,7 +4415,7 @@ function Paywall({
|
|
|
4359
4415
|
slots = {},
|
|
4360
4416
|
onBeforeCheckout
|
|
4361
4417
|
}) {
|
|
4362
|
-
return /* @__PURE__ */ (0,
|
|
4418
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(PaywallProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
4363
4419
|
PaywallInner,
|
|
4364
4420
|
{
|
|
4365
4421
|
copy,
|
|
@@ -4375,11 +4431,11 @@ function PaywallInner({
|
|
|
4375
4431
|
slots = {},
|
|
4376
4432
|
onBeforeCheckout
|
|
4377
4433
|
}) {
|
|
4378
|
-
const { track: track2 } = (0,
|
|
4434
|
+
const { track: track2 } = (0, import_sdk25.useHook)();
|
|
4379
4435
|
const s = usePaywallContext();
|
|
4380
4436
|
const priceLabel = formatBRL(s.currentPriceCents).replace(new RegExp(NBSP, "g"), " ");
|
|
4381
4437
|
const trialDaysCardLabel = String(s.trialDaysCard);
|
|
4382
|
-
const ctaLabel = (0,
|
|
4438
|
+
const ctaLabel = (0, import_react32.useMemo)(() => {
|
|
4383
4439
|
if (s.isFree) return copy.freeCta ?? "Come\xE7ar agora";
|
|
4384
4440
|
if (s.selectedMethod === "card") {
|
|
4385
4441
|
if (s.hasConsumedTrial && copy.cardConsumedTrial) {
|
|
@@ -4406,11 +4462,11 @@ function PaywallInner({
|
|
|
4406
4462
|
priceLabel,
|
|
4407
4463
|
trialDaysCardLabel
|
|
4408
4464
|
]);
|
|
4409
|
-
const switchHint = (0,
|
|
4465
|
+
const switchHint = (0, import_react32.useMemo)(() => {
|
|
4410
4466
|
if (s.methods.length < 2) return void 0;
|
|
4411
4467
|
return s.selectedMethod === "card" ? copy.card.switchHint : copy.pix.switchHint;
|
|
4412
4468
|
}, [s.methods.length, s.selectedMethod, copy]);
|
|
4413
|
-
(0,
|
|
4469
|
+
(0, import_react32.useEffect)(() => {
|
|
4414
4470
|
if (!s.initialLoadComplete) return;
|
|
4415
4471
|
track2("paywall_view", {
|
|
4416
4472
|
default_method: s.selectedMethod,
|
|
@@ -4432,15 +4488,15 @@ function PaywallInner({
|
|
|
4432
4488
|
await s.submit();
|
|
4433
4489
|
};
|
|
4434
4490
|
const ctaTheme = s.selectedMethod === "card" ? themeClasses.ctaCard : themeClasses.ctaPix;
|
|
4435
|
-
return /* @__PURE__ */ (0,
|
|
4491
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: themeClasses.container, children: [
|
|
4436
4492
|
slots.heroSlot,
|
|
4437
|
-
/* @__PURE__ */ (0,
|
|
4438
|
-
/* @__PURE__ */ (0,
|
|
4493
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("h1", { className: themeClasses.headline, children: copy.headline }),
|
|
4494
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("ul", { children: copy.features.map((f) => /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("li", { className: themeClasses.feature, children: [
|
|
4439
4495
|
"\u2713 ",
|
|
4440
|
-
/* @__PURE__ */ (0,
|
|
4496
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { children: f })
|
|
4441
4497
|
] }, f)) }),
|
|
4442
|
-
copy.socialProof ? /* @__PURE__ */ (0,
|
|
4443
|
-
slots.cyclePickerSlot ?? /* @__PURE__ */ (0,
|
|
4498
|
+
copy.socialProof ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: themeClasses.socialProof, children: copy.socialProof }) : null,
|
|
4499
|
+
slots.cyclePickerSlot ?? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
4444
4500
|
PaywallCyclePicker,
|
|
4445
4501
|
{
|
|
4446
4502
|
labels: copy.cycle,
|
|
@@ -4449,7 +4505,7 @@ function PaywallInner({
|
|
|
4449
4505
|
anchorClassName: themeClasses.anchorPrice
|
|
4450
4506
|
}
|
|
4451
4507
|
),
|
|
4452
|
-
/* @__PURE__ */ (0,
|
|
4508
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
4453
4509
|
PaywallMethodTabs,
|
|
4454
4510
|
{
|
|
4455
4511
|
labels: { "pix-auto": copy.pix.tabLabel, card: copy.card.tabLabel },
|
|
@@ -4458,7 +4514,7 @@ function PaywallInner({
|
|
|
4458
4514
|
tabActiveClassName: themeClasses.tabActive
|
|
4459
4515
|
}
|
|
4460
4516
|
),
|
|
4461
|
-
/* @__PURE__ */ (0,
|
|
4517
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
4462
4518
|
PaywallMethodContent,
|
|
4463
4519
|
{
|
|
4464
4520
|
copy: {
|
|
@@ -4476,8 +4532,8 @@ function PaywallInner({
|
|
|
4476
4532
|
}
|
|
4477
4533
|
),
|
|
4478
4534
|
slots.beforeCtaSlot,
|
|
4479
|
-
/* @__PURE__ */ (0,
|
|
4480
|
-
/* @__PURE__ */ (0,
|
|
4535
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { children: [
|
|
4536
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
4481
4537
|
"button",
|
|
4482
4538
|
{
|
|
4483
4539
|
type: "button",
|
|
@@ -4489,8 +4545,8 @@ function PaywallInner({
|
|
|
4489
4545
|
children: s.submitting ? "Abrindo checkout\u2026" : ctaLabel
|
|
4490
4546
|
}
|
|
4491
4547
|
),
|
|
4492
|
-
switchHint ? /* @__PURE__ */ (0,
|
|
4493
|
-
/* @__PURE__ */ (0,
|
|
4548
|
+
switchHint ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: themeClasses.switchHint, children: switchHint }) : null,
|
|
4549
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)("p", { className: themeClasses.trustLine, children: copy.trustLine })
|
|
4494
4550
|
] })
|
|
4495
4551
|
] });
|
|
4496
4552
|
}
|
|
@@ -4507,7 +4563,7 @@ function interpolateCopy(m, price, days) {
|
|
|
4507
4563
|
}
|
|
4508
4564
|
|
|
4509
4565
|
// src/components/paywall/PaywallCta.tsx
|
|
4510
|
-
var
|
|
4566
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
4511
4567
|
function PaywallCta({
|
|
4512
4568
|
ctaLabel,
|
|
4513
4569
|
loadingLabel,
|
|
@@ -4520,8 +4576,8 @@ function PaywallCta({
|
|
|
4520
4576
|
}) {
|
|
4521
4577
|
const { submit, submitting } = usePaywallContext();
|
|
4522
4578
|
const label = submitting && loadingLabel ? loadingLabel : ctaLabel;
|
|
4523
|
-
return /* @__PURE__ */ (0,
|
|
4524
|
-
/* @__PURE__ */ (0,
|
|
4579
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className, children: [
|
|
4580
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
4525
4581
|
"button",
|
|
4526
4582
|
{
|
|
4527
4583
|
type: "button",
|
|
@@ -4533,20 +4589,20 @@ function PaywallCta({
|
|
|
4533
4589
|
children: label
|
|
4534
4590
|
}
|
|
4535
4591
|
),
|
|
4536
|
-
switchHint ? /* @__PURE__ */ (0,
|
|
4537
|
-
/* @__PURE__ */ (0,
|
|
4592
|
+
switchHint ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: switchHintClassName, children: switchHint }) : null,
|
|
4593
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("p", { className: trustClassName, children: trustLine })
|
|
4538
4594
|
] });
|
|
4539
4595
|
}
|
|
4540
4596
|
|
|
4541
4597
|
// src/components/paywall/blocks/PaywallEyebrow.tsx
|
|
4542
|
-
var
|
|
4598
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
4543
4599
|
var DEFAULT_EYEBROW_CLASSES = "text-xs uppercase tracking-widest font-semibold opacity-70";
|
|
4544
4600
|
function PaywallEyebrow({ text, className }) {
|
|
4545
|
-
return /* @__PURE__ */ (0,
|
|
4601
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: [DEFAULT_EYEBROW_CLASSES, className].filter(Boolean).join(" "), children: text });
|
|
4546
4602
|
}
|
|
4547
4603
|
|
|
4548
4604
|
// src/components/paywall/blocks/PaywallHero.tsx
|
|
4549
|
-
var
|
|
4605
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
4550
4606
|
var DEFAULT_GRADIENT = "absolute inset-0 bg-gradient-to-t from-black/70 via-black/20 to-transparent";
|
|
4551
4607
|
function PaywallHero({
|
|
4552
4608
|
src,
|
|
@@ -4560,15 +4616,15 @@ function PaywallHero({
|
|
|
4560
4616
|
render
|
|
4561
4617
|
}) {
|
|
4562
4618
|
if (render) {
|
|
4563
|
-
return /* @__PURE__ */ (0,
|
|
4619
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className, children: render({ src, headline }) });
|
|
4564
4620
|
}
|
|
4565
|
-
return /* @__PURE__ */ (0,
|
|
4621
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
4566
4622
|
"div",
|
|
4567
4623
|
{
|
|
4568
4624
|
className: ["relative overflow-hidden", className].filter(Boolean).join(" "),
|
|
4569
4625
|
style: { aspectRatio },
|
|
4570
4626
|
children: [
|
|
4571
|
-
/* @__PURE__ */ (0,
|
|
4627
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
4572
4628
|
"img",
|
|
4573
4629
|
{
|
|
4574
4630
|
src,
|
|
@@ -4576,8 +4632,8 @@ function PaywallHero({
|
|
|
4576
4632
|
className: ["absolute inset-0 w-full h-full object-cover", imgClassName].filter(Boolean).join(" ")
|
|
4577
4633
|
}
|
|
4578
4634
|
),
|
|
4579
|
-
/* @__PURE__ */ (0,
|
|
4580
|
-
headline ? /* @__PURE__ */ (0,
|
|
4635
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: gradientClassName ?? DEFAULT_GRADIENT, "aria-hidden": "true" }),
|
|
4636
|
+
headline ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
4581
4637
|
"h1",
|
|
4582
4638
|
{
|
|
4583
4639
|
className: ["absolute bottom-0 left-0 right-0 p-4 text-white font-bold text-2xl", headlineClassName].filter(Boolean).join(" "),
|
|
@@ -4590,15 +4646,15 @@ function PaywallHero({
|
|
|
4590
4646
|
}
|
|
4591
4647
|
|
|
4592
4648
|
// src/components/paywall/blocks/PaywallHeadline.tsx
|
|
4593
|
-
var
|
|
4649
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
4594
4650
|
var DEFAULT_HEADLINE_CLASSES = "text-2xl font-bold leading-tight";
|
|
4595
4651
|
function PaywallHeadline({ text, className, as = "h1" }) {
|
|
4596
4652
|
const Tag = as;
|
|
4597
|
-
return /* @__PURE__ */ (0,
|
|
4653
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Tag, { className: [DEFAULT_HEADLINE_CLASSES, className].filter(Boolean).join(" "), children: text });
|
|
4598
4654
|
}
|
|
4599
4655
|
|
|
4600
4656
|
// src/components/paywall/blocks/PaywallPriceHeadline.tsx
|
|
4601
|
-
var
|
|
4657
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
4602
4658
|
var DEFAULT_CLASS = "text-2xl font-bold leading-tight";
|
|
4603
4659
|
var CYCLE_LABEL = {
|
|
4604
4660
|
MONTHLY: "mensal",
|
|
@@ -4618,16 +4674,16 @@ function PaywallPriceHeadline({
|
|
|
4618
4674
|
const rootClasses = [DEFAULT_CLASS, className].filter(Boolean).join(" ");
|
|
4619
4675
|
if (render) {
|
|
4620
4676
|
const RootTag2 = as;
|
|
4621
|
-
return /* @__PURE__ */ (0,
|
|
4677
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(RootTag2, { className: [className].filter(Boolean).join(" ") || void 0, children: render({ pricePerDay, currentMonthlyEquivCents: monthlyEquiv, cycle }) });
|
|
4622
4678
|
}
|
|
4623
4679
|
const text = template.replaceAll("{pricePerDay}", pricePerDay).replaceAll("{currentMonthlyEquiv}", formatBRL(monthlyEquiv)).replaceAll("{cycle}", cycleLabel);
|
|
4624
4680
|
const RootTag = as;
|
|
4625
|
-
return /* @__PURE__ */ (0,
|
|
4681
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(RootTag, { className: rootClasses, children: text });
|
|
4626
4682
|
}
|
|
4627
4683
|
|
|
4628
4684
|
// src/components/paywall/blocks/PaywallCountdown.tsx
|
|
4629
|
-
var
|
|
4630
|
-
var
|
|
4685
|
+
var import_react33 = require("react");
|
|
4686
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
4631
4687
|
var DEFAULT_COUNTDOWN_CLASSES = "font-mono tabular-nums";
|
|
4632
4688
|
function resolveDeadlineMs(deadline) {
|
|
4633
4689
|
if (deadline instanceof Date) return deadline.getTime();
|
|
@@ -4664,13 +4720,13 @@ function PaywallCountdown({
|
|
|
4664
4720
|
className,
|
|
4665
4721
|
render
|
|
4666
4722
|
}) {
|
|
4667
|
-
const deadlineMsRef = (0,
|
|
4723
|
+
const deadlineMsRef = (0, import_react33.useRef)(null);
|
|
4668
4724
|
if (deadlineMsRef.current === null) {
|
|
4669
4725
|
deadlineMsRef.current = resolveDeadlineMs(deadline);
|
|
4670
4726
|
}
|
|
4671
|
-
const [state, setState] = (0,
|
|
4672
|
-
const expiredCalledRef = (0,
|
|
4673
|
-
(0,
|
|
4727
|
+
const [state, setState] = (0, import_react33.useState)(() => computeRemaining(deadlineMsRef.current));
|
|
4728
|
+
const expiredCalledRef = (0, import_react33.useRef)(false);
|
|
4729
|
+
(0, import_react33.useEffect)(() => {
|
|
4674
4730
|
if (state.expired) {
|
|
4675
4731
|
if (!expiredCalledRef.current) {
|
|
4676
4732
|
expiredCalledRef.current = true;
|
|
@@ -4690,14 +4746,14 @@ function PaywallCountdown({
|
|
|
4690
4746
|
return () => clearInterval(id);
|
|
4691
4747
|
}, [state.expired]);
|
|
4692
4748
|
if (render) {
|
|
4693
|
-
return /* @__PURE__ */ (0,
|
|
4749
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className, children: render(state) });
|
|
4694
4750
|
}
|
|
4695
4751
|
const formatted = format === "h:m:s" ? `${pad(state.h)}:${pad(state.m)}:${pad(state.s)}` : `${pad(state.h * 60 + state.m)}:${pad(state.s)}`;
|
|
4696
|
-
return /* @__PURE__ */ (0,
|
|
4752
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: [DEFAULT_COUNTDOWN_CLASSES, className].filter(Boolean).join(" "), children: formatted });
|
|
4697
4753
|
}
|
|
4698
4754
|
|
|
4699
4755
|
// src/components/paywall/blocks/PaywallFeatures.tsx
|
|
4700
|
-
var
|
|
4756
|
+
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
4701
4757
|
function PaywallFeatures({
|
|
4702
4758
|
items,
|
|
4703
4759
|
IconComponent,
|
|
@@ -4708,19 +4764,19 @@ function PaywallFeatures({
|
|
|
4708
4764
|
renderItem
|
|
4709
4765
|
}) {
|
|
4710
4766
|
if (render) {
|
|
4711
|
-
return /* @__PURE__ */ (0,
|
|
4767
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className, children: render({ items }) });
|
|
4712
4768
|
}
|
|
4713
4769
|
if (renderItem) {
|
|
4714
|
-
return /* @__PURE__ */ (0,
|
|
4770
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("ul", { className, children: items.map((item, idx) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("li", { children: renderItem(item, idx) }, idx)) });
|
|
4715
4771
|
}
|
|
4716
|
-
return /* @__PURE__ */ (0,
|
|
4717
|
-
IconComponent ? /* @__PURE__ */ (0,
|
|
4718
|
-
/* @__PURE__ */ (0,
|
|
4772
|
+
return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("ul", { className, children: items.map((item, idx) => /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("li", { className: itemClassName, children: [
|
|
4773
|
+
IconComponent ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(IconComponent, { className: iconClassName }) : /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: iconClassName, "aria-hidden": "true", children: "\u2713" }),
|
|
4774
|
+
/* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { children: item })
|
|
4719
4775
|
] }, idx)) });
|
|
4720
4776
|
}
|
|
4721
4777
|
|
|
4722
4778
|
// src/components/paywall/blocks/PaywallFeaturesCard.tsx
|
|
4723
|
-
var
|
|
4779
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
4724
4780
|
var DEFAULT_CARD_CLASSES = "rounded-xl border p-4";
|
|
4725
4781
|
function PaywallFeaturesCard({
|
|
4726
4782
|
title,
|
|
@@ -4731,20 +4787,20 @@ function PaywallFeaturesCard({
|
|
|
4731
4787
|
itemClassName,
|
|
4732
4788
|
renderItem
|
|
4733
4789
|
}) {
|
|
4734
|
-
return /* @__PURE__ */ (0,
|
|
4735
|
-
title ? /* @__PURE__ */ (0,
|
|
4736
|
-
/* @__PURE__ */ (0,
|
|
4737
|
-
(item, idx) => renderItem ? /* @__PURE__ */ (0,
|
|
4738
|
-
/* @__PURE__ */ (0,
|
|
4790
|
+
return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: [DEFAULT_CARD_CLASSES, cardClassName].filter(Boolean).join(" "), children: [
|
|
4791
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: ["font-semibold mb-2", titleClassName].filter(Boolean).join(" "), children: title }) : null,
|
|
4792
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("ul", { children: items.map(
|
|
4793
|
+
(item, idx) => renderItem ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("li", { children: renderItem(item, idx) }, idx) : /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("li", { className: itemClassName, children: [
|
|
4794
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { "aria-hidden": "true", children: "\u2022" }),
|
|
4739
4795
|
" ",
|
|
4740
|
-
/* @__PURE__ */ (0,
|
|
4796
|
+
/* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { children: item })
|
|
4741
4797
|
] }, idx)
|
|
4742
4798
|
) })
|
|
4743
4799
|
] }) });
|
|
4744
4800
|
}
|
|
4745
4801
|
|
|
4746
4802
|
// src/components/paywall/blocks/PaywallTrophyBadge.tsx
|
|
4747
|
-
var
|
|
4803
|
+
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
4748
4804
|
var DEFAULT_CHIP_CLASSES = "inline-flex items-center gap-1 px-3 py-1 rounded-full bg-yellow-100 text-yellow-900 text-sm font-medium";
|
|
4749
4805
|
var FLOATING_CLASSES = "absolute top-2 right-2 z-10 shadow-md";
|
|
4750
4806
|
function PaywallTrophyBadge({
|
|
@@ -4755,21 +4811,21 @@ function PaywallTrophyBadge({
|
|
|
4755
4811
|
render
|
|
4756
4812
|
}) {
|
|
4757
4813
|
if (render) {
|
|
4758
|
-
return /* @__PURE__ */ (0,
|
|
4814
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className, children: render({ text }) });
|
|
4759
4815
|
}
|
|
4760
4816
|
const rootClasses = [
|
|
4761
4817
|
DEFAULT_CHIP_CLASSES,
|
|
4762
4818
|
floating ? FLOATING_CLASSES : "",
|
|
4763
4819
|
className
|
|
4764
4820
|
].filter(Boolean).join(" ");
|
|
4765
|
-
return /* @__PURE__ */ (0,
|
|
4766
|
-
/* @__PURE__ */ (0,
|
|
4767
|
-
/* @__PURE__ */ (0,
|
|
4821
|
+
return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: rootClasses, children: [
|
|
4822
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: iconClassName, "aria-hidden": "true", children: "\u{1F3C6}" }),
|
|
4823
|
+
/* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { children: text })
|
|
4768
4824
|
] });
|
|
4769
4825
|
}
|
|
4770
4826
|
|
|
4771
4827
|
// src/components/paywall/blocks/PaywallAnchorPrice.tsx
|
|
4772
|
-
var
|
|
4828
|
+
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
4773
4829
|
var DEFAULT_CLASS2 = "text-sm opacity-60 line-through";
|
|
4774
4830
|
function PaywallAnchorPrice({
|
|
4775
4831
|
className,
|
|
@@ -4783,13 +4839,13 @@ function PaywallAnchorPrice({
|
|
|
4783
4839
|
const formatted = formatBRL(anchorPriceCents);
|
|
4784
4840
|
const rootClasses = [DEFAULT_CLASS2, className].filter(Boolean).join(" ");
|
|
4785
4841
|
if (render) {
|
|
4786
|
-
return /* @__PURE__ */ (0,
|
|
4842
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: className || void 0, children: render({ anchorCents: anchorPriceCents, formatted }) });
|
|
4787
4843
|
}
|
|
4788
|
-
return /* @__PURE__ */ (0,
|
|
4844
|
+
return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: rootClasses, children: formatted });
|
|
4789
4845
|
}
|
|
4790
4846
|
|
|
4791
4847
|
// src/components/paywall/blocks/PaywallTestimonials.tsx
|
|
4792
|
-
var
|
|
4848
|
+
var import_jsx_runtime48 = require("react/jsx-runtime");
|
|
4793
4849
|
var DEFAULT_ROOT = "flex gap-3 overflow-x-auto snap-x snap-mandatory pb-2";
|
|
4794
4850
|
var DEFAULT_CARD = "snap-start shrink-0 w-72 rounded-2xl border p-4 flex flex-col gap-2";
|
|
4795
4851
|
var DEFAULT_AVATAR = "w-10 h-10 rounded-full object-cover";
|
|
@@ -4815,13 +4871,13 @@ function PaywallTestimonials({
|
|
|
4815
4871
|
const quoteClasses = [DEFAULT_QUOTE, quoteClassName].filter(Boolean).join(" ");
|
|
4816
4872
|
const nameClasses = [DEFAULT_NAME, nameClassName].filter(Boolean).join(" ");
|
|
4817
4873
|
const starsClasses = [DEFAULT_STARS, starsClassName].filter(Boolean).join(" ");
|
|
4818
|
-
return /* @__PURE__ */ (0,
|
|
4874
|
+
return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: rootClasses, children: items.map((item, idx) => {
|
|
4819
4875
|
if (renderItem) return renderItem(item, idx);
|
|
4820
4876
|
const filled = clampStars(item.stars);
|
|
4821
4877
|
const empty = 5 - filled;
|
|
4822
|
-
return /* @__PURE__ */ (0,
|
|
4823
|
-
/* @__PURE__ */ (0,
|
|
4824
|
-
item.avatar ? /* @__PURE__ */ (0,
|
|
4878
|
+
return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: cardClasses, children: [
|
|
4879
|
+
/* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "flex items-center gap-2", children: [
|
|
4880
|
+
item.avatar ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
|
|
4825
4881
|
"img",
|
|
4826
4882
|
{
|
|
4827
4883
|
src: item.avatar,
|
|
@@ -4831,19 +4887,19 @@ function PaywallTestimonials({
|
|
|
4831
4887
|
"aria-hidden": "true"
|
|
4832
4888
|
}
|
|
4833
4889
|
) : null,
|
|
4834
|
-
/* @__PURE__ */ (0,
|
|
4890
|
+
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: nameClasses, children: item.name })
|
|
4835
4891
|
] }),
|
|
4836
|
-
/* @__PURE__ */ (0,
|
|
4892
|
+
/* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: starsClasses, "aria-label": `${filled} de 5 estrelas`, children: [
|
|
4837
4893
|
"\u2605".repeat(filled),
|
|
4838
4894
|
"\u2606".repeat(empty)
|
|
4839
4895
|
] }),
|
|
4840
|
-
/* @__PURE__ */ (0,
|
|
4896
|
+
/* @__PURE__ */ (0, import_jsx_runtime48.jsx)("p", { className: quoteClasses, children: item.quote })
|
|
4841
4897
|
] }, idx);
|
|
4842
4898
|
}) });
|
|
4843
4899
|
}
|
|
4844
4900
|
|
|
4845
4901
|
// src/components/paywall/blocks/PaywallStatsRow.tsx
|
|
4846
|
-
var
|
|
4902
|
+
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
4847
4903
|
var DEFAULT_ROOT2 = "grid grid-cols-3 gap-4";
|
|
4848
4904
|
var DEFAULT_CELL = "flex flex-col items-center text-center";
|
|
4849
4905
|
var DEFAULT_VALUE = "text-2xl font-bold";
|
|
@@ -4860,18 +4916,18 @@ function PaywallStatsRow({
|
|
|
4860
4916
|
const cellClasses = [DEFAULT_CELL, cellClassName].filter(Boolean).join(" ");
|
|
4861
4917
|
const valueClasses = [DEFAULT_VALUE, valueClassName].filter(Boolean).join(" ");
|
|
4862
4918
|
const labelClasses = [DEFAULT_LABEL, labelClassName].filter(Boolean).join(" ");
|
|
4863
|
-
return /* @__PURE__ */ (0,
|
|
4919
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: rootClasses, children: stats.map((stat, idx) => {
|
|
4864
4920
|
if (renderCell) return renderCell(stat, idx);
|
|
4865
|
-
return /* @__PURE__ */ (0,
|
|
4866
|
-
stat.icon ? /* @__PURE__ */ (0,
|
|
4867
|
-
/* @__PURE__ */ (0,
|
|
4868
|
-
/* @__PURE__ */ (0,
|
|
4921
|
+
return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: cellClasses, children: [
|
|
4922
|
+
stat.icon ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { "aria-hidden": "true", children: stat.icon }) : null,
|
|
4923
|
+
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: valueClasses, children: stat.value }),
|
|
4924
|
+
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)("div", { className: labelClasses, children: stat.label })
|
|
4869
4925
|
] }, idx);
|
|
4870
4926
|
}) });
|
|
4871
4927
|
}
|
|
4872
4928
|
|
|
4873
4929
|
// src/components/paywall/blocks/PaywallFinePrint.tsx
|
|
4874
|
-
var
|
|
4930
|
+
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
4875
4931
|
var DEFAULT_CLASS3 = "text-xs opacity-60 leading-snug";
|
|
4876
4932
|
var CYCLE_LABEL2 = {
|
|
4877
4933
|
MONTHLY: "mensal",
|
|
@@ -4894,7 +4950,7 @@ function PaywallFinePrint({
|
|
|
4894
4950
|
const priceFormatted = formatBRL(currentPriceCents ?? 0);
|
|
4895
4951
|
const rootClasses = [DEFAULT_CLASS3, className].filter(Boolean).join(" ");
|
|
4896
4952
|
if (render) {
|
|
4897
|
-
return /* @__PURE__ */ (0,
|
|
4953
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className: className || void 0, children: render({
|
|
4898
4954
|
currentPriceCents: currentPriceCents ?? 0,
|
|
4899
4955
|
cycle,
|
|
4900
4956
|
trialDays: trialDays ?? 0,
|
|
@@ -4902,11 +4958,11 @@ function PaywallFinePrint({
|
|
|
4902
4958
|
}) });
|
|
4903
4959
|
}
|
|
4904
4960
|
const text = template.replaceAll("{price}", priceFormatted).replaceAll("{trialDays}", String(trialDays ?? 0)).replaceAll("{cycle}", cycleLabel);
|
|
4905
|
-
return /* @__PURE__ */ (0,
|
|
4961
|
+
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className: rootClasses, children: text });
|
|
4906
4962
|
}
|
|
4907
4963
|
|
|
4908
4964
|
// src/components/paywall/blocks/PaywallTrustLine.tsx
|
|
4909
|
-
var
|
|
4965
|
+
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
4910
4966
|
var DEFAULT_ROOT3 = "flex items-center gap-3";
|
|
4911
4967
|
var DEFAULT_ITEM = "flex items-center gap-1.5 text-xs";
|
|
4912
4968
|
function PaywallTrustLine({
|
|
@@ -4917,17 +4973,17 @@ function PaywallTrustLine({
|
|
|
4917
4973
|
}) {
|
|
4918
4974
|
const rootClasses = [DEFAULT_ROOT3, className].filter(Boolean).join(" ");
|
|
4919
4975
|
const itemClasses = [DEFAULT_ITEM, itemClassName].filter(Boolean).join(" ");
|
|
4920
|
-
return /* @__PURE__ */ (0,
|
|
4976
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: rootClasses, children: items.map((item, idx) => {
|
|
4921
4977
|
if (renderItem) return renderItem(item, idx);
|
|
4922
|
-
return /* @__PURE__ */ (0,
|
|
4923
|
-
/* @__PURE__ */ (0,
|
|
4924
|
-
/* @__PURE__ */ (0,
|
|
4978
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("span", { className: itemClasses, children: [
|
|
4979
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { "aria-hidden": "true", children: item.icon }),
|
|
4980
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { children: item.text })
|
|
4925
4981
|
] }, idx);
|
|
4926
4982
|
}) });
|
|
4927
4983
|
}
|
|
4928
4984
|
|
|
4929
4985
|
// src/components/paywall/blocks/PaywallStickyFooter.tsx
|
|
4930
|
-
var
|
|
4986
|
+
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
4931
4987
|
var DEFAULT_CLASSES = "sticky bottom-0 left-0 right-0 bg-background";
|
|
4932
4988
|
var SAFE_AREA_CLASS = "pb-[env(safe-area-inset-bottom)]";
|
|
4933
4989
|
function PaywallStickyFooter({
|
|
@@ -4936,7 +4992,7 @@ function PaywallStickyFooter({
|
|
|
4936
4992
|
safeAreaInsets = true
|
|
4937
4993
|
}) {
|
|
4938
4994
|
const classes = [DEFAULT_CLASSES, safeAreaInsets ? SAFE_AREA_CLASS : null, className].filter(Boolean).join(" ");
|
|
4939
|
-
return /* @__PURE__ */ (0,
|
|
4995
|
+
return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: classes, children });
|
|
4940
4996
|
}
|
|
4941
4997
|
// Annotate the CommonJS export names for ESM import in node:
|
|
4942
4998
|
0 && (module.exports = {
|