@hook-sdk/template 0.28.1 → 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 +606 -530
- 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 +509 -433
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
// src/AppRoot.tsx
|
|
2
2
|
import { useMemo as useMemo3 } from "react";
|
|
3
3
|
import { BrowserRouter, MemoryRouter, Navigate, Route, Routes } from "react-router-dom";
|
|
4
|
-
import { useHook as
|
|
4
|
+
import { useHook as useHook8 } from "@hook-sdk/sdk";
|
|
5
5
|
|
|
6
6
|
// src/config/AppConfigContext.tsx
|
|
7
7
|
import { createContext, useContext } from "react";
|
|
@@ -2033,9 +2033,53 @@ function SessionExpiredBanner() {
|
|
|
2033
2033
|
] });
|
|
2034
2034
|
}
|
|
2035
2035
|
|
|
2036
|
+
// src/internal/EmailVerifyBanner.tsx
|
|
2037
|
+
import { useState as useState5 } from "react";
|
|
2038
|
+
import { useHook as useHook5 } from "@hook-sdk/sdk";
|
|
2039
|
+
import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
2040
|
+
function EmailVerifyBanner() {
|
|
2041
|
+
const { user, auth } = useHook5();
|
|
2042
|
+
const [sending, setSending] = useState5(false);
|
|
2043
|
+
const [sent, setSent] = useState5(false);
|
|
2044
|
+
if (!user || user.emailVerified) return null;
|
|
2045
|
+
async function handleResend() {
|
|
2046
|
+
if (sending || sent) return;
|
|
2047
|
+
setSending(true);
|
|
2048
|
+
try {
|
|
2049
|
+
await auth.resendVerify();
|
|
2050
|
+
setSent(true);
|
|
2051
|
+
} catch {
|
|
2052
|
+
} finally {
|
|
2053
|
+
setSending(false);
|
|
2054
|
+
}
|
|
2055
|
+
}
|
|
2056
|
+
const label = sent ? "Enviado!" : sending ? "Enviando..." : "Reenviar link";
|
|
2057
|
+
return /* @__PURE__ */ jsxs12(
|
|
2058
|
+
"div",
|
|
2059
|
+
{
|
|
2060
|
+
role: "status",
|
|
2061
|
+
"data-testid": "email-verify-banner",
|
|
2062
|
+
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",
|
|
2063
|
+
children: [
|
|
2064
|
+
/* @__PURE__ */ jsx18("span", { children: "Confirma teu e-mail pra liberar tudo." }),
|
|
2065
|
+
/* @__PURE__ */ jsx18(
|
|
2066
|
+
"button",
|
|
2067
|
+
{
|
|
2068
|
+
type: "button",
|
|
2069
|
+
onClick: handleResend,
|
|
2070
|
+
disabled: sending || sent,
|
|
2071
|
+
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",
|
|
2072
|
+
children: label
|
|
2073
|
+
}
|
|
2074
|
+
)
|
|
2075
|
+
]
|
|
2076
|
+
}
|
|
2077
|
+
);
|
|
2078
|
+
}
|
|
2079
|
+
|
|
2036
2080
|
// src/defaults/ErrorBoundary.tsx
|
|
2037
2081
|
import { Component } from "react";
|
|
2038
|
-
import { Fragment as Fragment4, jsx as
|
|
2082
|
+
import { Fragment as Fragment4, jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
2039
2083
|
var ErrorBoundary = class extends Component {
|
|
2040
2084
|
state = { error: null };
|
|
2041
2085
|
static getDerivedStateFromError(error) {
|
|
@@ -2053,12 +2097,12 @@ var ErrorBoundary = class extends Component {
|
|
|
2053
2097
|
}
|
|
2054
2098
|
render() {
|
|
2055
2099
|
if (this.state.error) {
|
|
2056
|
-
return this.props.fallback ?? /* @__PURE__ */
|
|
2057
|
-
/* @__PURE__ */
|
|
2058
|
-
/* @__PURE__ */
|
|
2100
|
+
return this.props.fallback ?? /* @__PURE__ */ jsxs13("div", { role: "alert", style: { padding: 24, textAlign: "center" }, children: [
|
|
2101
|
+
/* @__PURE__ */ jsx19("h2", { children: "Algo deu errado" }),
|
|
2102
|
+
/* @__PURE__ */ jsx19("p", { style: { opacity: 0.7 }, children: "Recarregue a p\xE1gina pra tentar de novo." })
|
|
2059
2103
|
] });
|
|
2060
2104
|
}
|
|
2061
|
-
return /* @__PURE__ */
|
|
2105
|
+
return /* @__PURE__ */ jsx19(Fragment4, { children: this.props.children });
|
|
2062
2106
|
}
|
|
2063
2107
|
};
|
|
2064
2108
|
|
|
@@ -2067,7 +2111,7 @@ import { useEffect as useEffect7 } from "react";
|
|
|
2067
2111
|
import i18n from "i18next";
|
|
2068
2112
|
import { I18nextProvider, initReactI18next } from "react-i18next";
|
|
2069
2113
|
import { usePersistedState } from "@hook-sdk/sdk";
|
|
2070
|
-
import { jsx as
|
|
2114
|
+
import { jsx as jsx20 } from "react/jsx-runtime";
|
|
2071
2115
|
function ensureInitialized(defaultLocale, supportedLocales, resources, initialLocale) {
|
|
2072
2116
|
if (i18n.isInitialized) return;
|
|
2073
2117
|
i18n.use(initReactI18next).init({
|
|
@@ -2096,7 +2140,7 @@ function I18nProvider({
|
|
|
2096
2140
|
i18n.changeLanguage(userLocale);
|
|
2097
2141
|
}
|
|
2098
2142
|
}, [userLocale]);
|
|
2099
|
-
return /* @__PURE__ */
|
|
2143
|
+
return /* @__PURE__ */ jsx20(I18nextProvider, { i18n, children });
|
|
2100
2144
|
}
|
|
2101
2145
|
|
|
2102
2146
|
// src/dev/env.ts
|
|
@@ -2107,9 +2151,9 @@ function isDevToolsEnabled() {
|
|
|
2107
2151
|
}
|
|
2108
2152
|
|
|
2109
2153
|
// src/dev/DevSkipOnboardingFab.tsx
|
|
2110
|
-
import { useCallback as useCallback3, useRef as useRef4, useState as
|
|
2111
|
-
import { useHook as
|
|
2112
|
-
import { jsx as
|
|
2154
|
+
import { useCallback as useCallback3, useRef as useRef4, useState as useState6 } from "react";
|
|
2155
|
+
import { useHook as useHook6, usePersistedState as usePersistedState2 } from "@hook-sdk/sdk";
|
|
2156
|
+
import { jsx as jsx21 } from "react/jsx-runtime";
|
|
2113
2157
|
var STORAGE_KEY = "hook_dev_skip_email";
|
|
2114
2158
|
var TEST_EMAIL_DOMAIN = "@hook.test";
|
|
2115
2159
|
var TEST_PASSWORD = "SkipTest!2026";
|
|
@@ -2176,10 +2220,10 @@ var STYLES = {
|
|
|
2176
2220
|
};
|
|
2177
2221
|
var CONFIRM_TIMEOUT_MS = 3e3;
|
|
2178
2222
|
function DevSkipOnboardingFab({ defaults }) {
|
|
2179
|
-
const hook =
|
|
2223
|
+
const hook = useHook6();
|
|
2180
2224
|
const { slug } = useAppConfig();
|
|
2181
|
-
const [state, setState] =
|
|
2182
|
-
const [errorMsg, setErrorMsg] =
|
|
2225
|
+
const [state, setState] = useState6("idle");
|
|
2226
|
+
const [errorMsg, setErrorMsg] = useState6(null);
|
|
2183
2227
|
const timerRef = useRef4(null);
|
|
2184
2228
|
const isAuthed = hook.authStatus === "authenticated";
|
|
2185
2229
|
const [onboarding] = usePersistedState2(
|
|
@@ -2224,7 +2268,7 @@ function DevSkipOnboardingFab({ defaults }) {
|
|
|
2224
2268
|
...state === "confirm" || state === "error" ? STYLES.confirm : {},
|
|
2225
2269
|
...state === "busy" ? STYLES.busy : {}
|
|
2226
2270
|
};
|
|
2227
|
-
return /* @__PURE__ */
|
|
2271
|
+
return /* @__PURE__ */ jsx21(
|
|
2228
2272
|
"button",
|
|
2229
2273
|
{
|
|
2230
2274
|
type: "button",
|
|
@@ -2239,20 +2283,20 @@ function DevSkipOnboardingFab({ defaults }) {
|
|
|
2239
2283
|
}
|
|
2240
2284
|
|
|
2241
2285
|
// src/internal/PaymentReturnHandler.tsx
|
|
2242
|
-
import { useCallback as useCallback4, useEffect as useEffect8, useRef as useRef5, useState as
|
|
2243
|
-
import { useHook as
|
|
2244
|
-
import { Fragment as Fragment5, jsx as
|
|
2286
|
+
import { useCallback as useCallback4, useEffect as useEffect8, useRef as useRef5, useState as useState7 } from "react";
|
|
2287
|
+
import { useHook as useHook7 } from "@hook-sdk/sdk";
|
|
2288
|
+
import { Fragment as Fragment5, jsx as jsx22, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2245
2289
|
var BACKOFF_MS = [2e3, 5e3, 1e4, 2e4, 4e4];
|
|
2246
2290
|
var MAX_CYCLES = 3;
|
|
2247
2291
|
var SUPPORT_MAILTO = "mailto:suporte@usehook.net?subject=Pagamento%20pendente";
|
|
2248
2292
|
function PaymentReturnHandler({ children }) {
|
|
2249
|
-
const { subscription, track: track2 } =
|
|
2293
|
+
const { subscription, track: track2 } = useHook7();
|
|
2250
2294
|
const subRef = useRef5(subscription);
|
|
2251
2295
|
subRef.current = subscription;
|
|
2252
2296
|
const runIdRef = useRef5(0);
|
|
2253
2297
|
const cyclesRef = useRef5(0);
|
|
2254
2298
|
const startMsRef = useRef5(0);
|
|
2255
|
-
const [state, setState] =
|
|
2299
|
+
const [state, setState] = useState7("idle");
|
|
2256
2300
|
const runPoll = useCallback4(() => {
|
|
2257
2301
|
const runId = ++runIdRef.current;
|
|
2258
2302
|
const isFirstRun = cyclesRef.current === 0;
|
|
@@ -2318,19 +2362,19 @@ function PaymentReturnHandler({ children }) {
|
|
|
2318
2362
|
window.location.href = cleanUrl.toString();
|
|
2319
2363
|
}, []);
|
|
2320
2364
|
if (state === "confirming") {
|
|
2321
|
-
return /* @__PURE__ */
|
|
2365
|
+
return /* @__PURE__ */ jsx22("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: "Confirmando pagamento\u2026" });
|
|
2322
2366
|
}
|
|
2323
2367
|
if (state === "waiting") {
|
|
2324
|
-
return /* @__PURE__ */
|
|
2325
|
-
/* @__PURE__ */
|
|
2326
|
-
/* @__PURE__ */
|
|
2368
|
+
return /* @__PURE__ */ jsx22("div", { role: "status", "aria-live": "polite", style: overlayStyle2, children: /* @__PURE__ */ jsxs14("div", { style: { maxWidth: 320, textAlign: "center", lineHeight: 1.5 }, children: [
|
|
2369
|
+
/* @__PURE__ */ jsx22("div", { style: { marginBottom: 16 }, children: "Pagamento aceito. Estamos confirmando com o banco \u2014 pode levar alguns minutos." }),
|
|
2370
|
+
/* @__PURE__ */ jsx22("button", { type: "button", onClick: runPoll, style: buttonStyle, children: "Atualizar" })
|
|
2327
2371
|
] }) });
|
|
2328
2372
|
}
|
|
2329
2373
|
if (state === "timeout") {
|
|
2330
|
-
return /* @__PURE__ */
|
|
2331
|
-
/* @__PURE__ */
|
|
2332
|
-
/* @__PURE__ */
|
|
2333
|
-
/* @__PURE__ */
|
|
2374
|
+
return /* @__PURE__ */ jsx22("div", { role: "alert", "aria-live": "assertive", style: overlayStyle2, children: /* @__PURE__ */ jsxs14("div", { style: { maxWidth: 360, textAlign: "center", lineHeight: 1.5 }, children: [
|
|
2375
|
+
/* @__PURE__ */ jsx22("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." }),
|
|
2376
|
+
/* @__PURE__ */ jsxs14("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
|
|
2377
|
+
/* @__PURE__ */ jsx22(
|
|
2334
2378
|
"button",
|
|
2335
2379
|
{
|
|
2336
2380
|
type: "button",
|
|
@@ -2343,7 +2387,7 @@ function PaymentReturnHandler({ children }) {
|
|
|
2343
2387
|
children: "Tentar de novo"
|
|
2344
2388
|
}
|
|
2345
2389
|
),
|
|
2346
|
-
/* @__PURE__ */
|
|
2390
|
+
/* @__PURE__ */ jsx22(
|
|
2347
2391
|
"button",
|
|
2348
2392
|
{
|
|
2349
2393
|
type: "button",
|
|
@@ -2353,7 +2397,7 @@ function PaymentReturnHandler({ children }) {
|
|
|
2353
2397
|
children: "Voltar pro app"
|
|
2354
2398
|
}
|
|
2355
2399
|
),
|
|
2356
|
-
/* @__PURE__ */
|
|
2400
|
+
/* @__PURE__ */ jsx22(
|
|
2357
2401
|
"a",
|
|
2358
2402
|
{
|
|
2359
2403
|
href: SUPPORT_MAILTO,
|
|
@@ -2365,7 +2409,7 @@ function PaymentReturnHandler({ children }) {
|
|
|
2365
2409
|
] })
|
|
2366
2410
|
] }) });
|
|
2367
2411
|
}
|
|
2368
|
-
return /* @__PURE__ */
|
|
2412
|
+
return /* @__PURE__ */ jsx22(Fragment5, { children });
|
|
2369
2413
|
}
|
|
2370
2414
|
var overlayStyle2 = {
|
|
2371
2415
|
position: "fixed",
|
|
@@ -2404,7 +2448,7 @@ var linkStyle = {
|
|
|
2404
2448
|
};
|
|
2405
2449
|
|
|
2406
2450
|
// src/AppRoot.tsx
|
|
2407
|
-
import { Fragment as Fragment6, jsx as
|
|
2451
|
+
import { Fragment as Fragment6, jsx as jsx23, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2408
2452
|
function buildLegacyConfigShim(config) {
|
|
2409
2453
|
const paywall = config.paywall;
|
|
2410
2454
|
const isFree = paywall.mode === "free";
|
|
@@ -2483,14 +2527,17 @@ function AppRoot(props) {
|
|
|
2483
2527
|
const basename = `/app/${config.slug}`;
|
|
2484
2528
|
const routerProps = testRouter === "memory" ? { basename, initialEntries: testInitialEntries } : { basename };
|
|
2485
2529
|
const position = config.install_prompt?.position ?? "post-paywall";
|
|
2486
|
-
const subscriptionGated = /* @__PURE__ */
|
|
2487
|
-
|
|
2488
|
-
/* @__PURE__ */
|
|
2489
|
-
|
|
2490
|
-
|
|
2491
|
-
/* @__PURE__ */
|
|
2492
|
-
|
|
2493
|
-
|
|
2530
|
+
const subscriptionGated = /* @__PURE__ */ jsxs15(SubscriptionGate, { Paywall: Paywall2 ?? FallbackPaywall, children: [
|
|
2531
|
+
/* @__PURE__ */ jsx23(EmailVerifyBanner, {}),
|
|
2532
|
+
position === "post-paywall" ? /* @__PURE__ */ jsxs15(InstallGate, { position: "post-paywall", children: [
|
|
2533
|
+
children,
|
|
2534
|
+
/* @__PURE__ */ jsx23(PushPrompt, {})
|
|
2535
|
+
] }) : /* @__PURE__ */ jsxs15(Fragment6, { children: [
|
|
2536
|
+
children,
|
|
2537
|
+
/* @__PURE__ */ jsx23(PushPrompt, {})
|
|
2538
|
+
] })
|
|
2539
|
+
] });
|
|
2540
|
+
const authGated = /* @__PURE__ */ jsx23(
|
|
2494
2541
|
AuthGated,
|
|
2495
2542
|
{
|
|
2496
2543
|
config,
|
|
@@ -2505,13 +2552,13 @@ function AppRoot(props) {
|
|
|
2505
2552
|
children: subscriptionGated
|
|
2506
2553
|
}
|
|
2507
2554
|
);
|
|
2508
|
-
const routedTree = /* @__PURE__ */
|
|
2509
|
-
/* @__PURE__ */
|
|
2510
|
-
/* @__PURE__ */
|
|
2511
|
-
position === "pre-auth" ? /* @__PURE__ */
|
|
2512
|
-
isDevToolsEnabled() && devSkipOnboarding ? /* @__PURE__ */
|
|
2555
|
+
const routedTree = /* @__PURE__ */ jsxs15(Router, { ...routerProps, children: [
|
|
2556
|
+
/* @__PURE__ */ jsx23(DeepLinkHandler, { deepLinks: config.deepLinks }),
|
|
2557
|
+
/* @__PURE__ */ jsx23(SessionExpiredBanner, {}),
|
|
2558
|
+
position === "pre-auth" ? /* @__PURE__ */ jsx23(InstallGate, { position: "pre-auth", children: authGated }) : authGated,
|
|
2559
|
+
isDevToolsEnabled() && devSkipOnboarding ? /* @__PURE__ */ jsx23(DevSkipOnboardingFab, { defaults: devSkipOnboarding.defaults }) : null
|
|
2513
2560
|
] });
|
|
2514
|
-
return /* @__PURE__ */
|
|
2561
|
+
return /* @__PURE__ */ jsx23(ErrorBoundary, { children: /* @__PURE__ */ jsx23(AppConfigProvider, { config, children: /* @__PURE__ */ jsx23(TemplateConfigProvider, { config: legacyShim, children: /* @__PURE__ */ jsx23(ThemeProvider, { children: /* @__PURE__ */ jsx23(PersistenceRegistry, { config: config.persistedKeys, children: config.i18n ? /* @__PURE__ */ jsx23(
|
|
2515
2562
|
I18nProvider,
|
|
2516
2563
|
{
|
|
2517
2564
|
defaultLocale: config.i18n.defaultLocale,
|
|
@@ -2531,46 +2578,46 @@ function AuthGated({
|
|
|
2531
2578
|
EmailVerify,
|
|
2532
2579
|
PreAuthFlow
|
|
2533
2580
|
}) {
|
|
2534
|
-
const { authStatus } =
|
|
2581
|
+
const { authStatus } = useHook8();
|
|
2535
2582
|
if (authStatus === "loading") return null;
|
|
2536
2583
|
if (authStatus !== "authenticated") {
|
|
2537
2584
|
if (config.authFlow.signupMode === "pay_first" && PreAuthFlow) {
|
|
2538
|
-
return /* @__PURE__ */
|
|
2539
|
-
/* @__PURE__ */
|
|
2540
|
-
/* @__PURE__ */
|
|
2541
|
-
/* @__PURE__ */
|
|
2542
|
-
EmailVerify ? /* @__PURE__ */
|
|
2543
|
-
/* @__PURE__ */
|
|
2585
|
+
return /* @__PURE__ */ jsxs15(Routes, { children: [
|
|
2586
|
+
/* @__PURE__ */ jsx23(Route, { path: "/signin", element: /* @__PURE__ */ jsx23(Login, {}) }),
|
|
2587
|
+
/* @__PURE__ */ jsx23(Route, { path: "/forgot", element: /* @__PURE__ */ jsx23(Forgot, {}) }),
|
|
2588
|
+
/* @__PURE__ */ jsx23(Route, { path: "/reset", element: /* @__PURE__ */ jsx23(Reset, {}) }),
|
|
2589
|
+
EmailVerify ? /* @__PURE__ */ jsx23(Route, { path: "/verify", element: /* @__PURE__ */ jsx23(EmailVerify, {}) }) : null,
|
|
2590
|
+
/* @__PURE__ */ jsx23(Route, { path: "/*", element: /* @__PURE__ */ jsx23(PreAuthFlow, {}) })
|
|
2544
2591
|
] });
|
|
2545
2592
|
}
|
|
2546
2593
|
if (config.onboarding?.trigger === "pre_signup_custom" && PreAuthFlow) {
|
|
2547
|
-
return /* @__PURE__ */
|
|
2548
|
-
/* @__PURE__ */
|
|
2549
|
-
/* @__PURE__ */
|
|
2550
|
-
/* @__PURE__ */
|
|
2551
|
-
/* @__PURE__ */
|
|
2552
|
-
EmailVerify ? /* @__PURE__ */
|
|
2553
|
-
/* @__PURE__ */
|
|
2594
|
+
return /* @__PURE__ */ jsxs15(Routes, { children: [
|
|
2595
|
+
/* @__PURE__ */ jsx23(Route, { path: "/signin", element: /* @__PURE__ */ jsx23(Login, {}) }),
|
|
2596
|
+
/* @__PURE__ */ jsx23(Route, { path: "/signup", element: /* @__PURE__ */ jsx23(Signup, {}) }),
|
|
2597
|
+
/* @__PURE__ */ jsx23(Route, { path: "/forgot", element: /* @__PURE__ */ jsx23(Forgot, {}) }),
|
|
2598
|
+
/* @__PURE__ */ jsx23(Route, { path: "/reset", element: /* @__PURE__ */ jsx23(Reset, {}) }),
|
|
2599
|
+
EmailVerify ? /* @__PURE__ */ jsx23(Route, { path: "/verify", element: /* @__PURE__ */ jsx23(EmailVerify, {}) }) : null,
|
|
2600
|
+
/* @__PURE__ */ jsx23(Route, { path: "/*", element: /* @__PURE__ */ jsx23(PreAuthFlow, {}) })
|
|
2554
2601
|
] });
|
|
2555
2602
|
}
|
|
2556
|
-
return /* @__PURE__ */
|
|
2557
|
-
/* @__PURE__ */
|
|
2558
|
-
/* @__PURE__ */
|
|
2559
|
-
/* @__PURE__ */
|
|
2560
|
-
/* @__PURE__ */
|
|
2561
|
-
EmailVerify ? /* @__PURE__ */
|
|
2562
|
-
/* @__PURE__ */
|
|
2603
|
+
return /* @__PURE__ */ jsxs15(Routes, { children: [
|
|
2604
|
+
/* @__PURE__ */ jsx23(Route, { path: "/", element: /* @__PURE__ */ jsx23(Login, {}) }),
|
|
2605
|
+
/* @__PURE__ */ jsx23(Route, { path: "/signup", element: /* @__PURE__ */ jsx23(Signup, {}) }),
|
|
2606
|
+
/* @__PURE__ */ jsx23(Route, { path: "/forgot", element: /* @__PURE__ */ jsx23(Forgot, {}) }),
|
|
2607
|
+
/* @__PURE__ */ jsx23(Route, { path: "/reset", element: /* @__PURE__ */ jsx23(Reset, {}) }),
|
|
2608
|
+
EmailVerify ? /* @__PURE__ */ jsx23(Route, { path: "/verify", element: /* @__PURE__ */ jsx23(EmailVerify, {}) }) : null,
|
|
2609
|
+
/* @__PURE__ */ jsx23(Route, { path: "*", element: /* @__PURE__ */ jsx23(Navigate, { to: "/", replace: true }) })
|
|
2563
2610
|
] });
|
|
2564
2611
|
}
|
|
2565
|
-
return /* @__PURE__ */
|
|
2612
|
+
return /* @__PURE__ */ jsx23(Fragment6, { children });
|
|
2566
2613
|
}
|
|
2567
2614
|
function FallbackPaywall() {
|
|
2568
2615
|
return null;
|
|
2569
2616
|
}
|
|
2570
2617
|
|
|
2571
2618
|
// src/hooks/usePush.ts
|
|
2572
|
-
import { useCallback as useCallback5, useEffect as useEffect9, useState as
|
|
2573
|
-
import { useHook as
|
|
2619
|
+
import { useCallback as useCallback5, useEffect as useEffect9, useState as useState8 } from "react";
|
|
2620
|
+
import { useHook as useHook9 } from "@hook-sdk/sdk";
|
|
2574
2621
|
var DISMISS_STORAGE_KEY = "push:dismissed-until";
|
|
2575
2622
|
var DISMISS_TTL_MS2 = 7 * 24 * 60 * 60 * 1e3;
|
|
2576
2623
|
function detectIosNeedsInstall() {
|
|
@@ -2614,8 +2661,8 @@ function deriveState(push) {
|
|
|
2614
2661
|
return { kind: "prompt" };
|
|
2615
2662
|
}
|
|
2616
2663
|
function usePush() {
|
|
2617
|
-
const { push } =
|
|
2618
|
-
const [state, setState] =
|
|
2664
|
+
const { push } = useHook9();
|
|
2665
|
+
const [state, setState] = useState8(() => deriveState(push));
|
|
2619
2666
|
useEffect9(() => {
|
|
2620
2667
|
setState(deriveState(push));
|
|
2621
2668
|
}, [push]);
|
|
@@ -2653,27 +2700,27 @@ function usePush() {
|
|
|
2653
2700
|
}
|
|
2654
2701
|
|
|
2655
2702
|
// src/components/PushPrompt.tsx
|
|
2656
|
-
import { jsx as
|
|
2703
|
+
import { jsx as jsx24, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2657
2704
|
function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, className }) {
|
|
2658
2705
|
const { state, subscribe } = usePush();
|
|
2659
2706
|
if (state.kind === "denied" || state.kind === "dismissed" || state.kind === "subscribed") {
|
|
2660
2707
|
return null;
|
|
2661
2708
|
}
|
|
2662
2709
|
if (state.kind === "ios_needs_install") {
|
|
2663
|
-
return /* @__PURE__ */
|
|
2664
|
-
/* @__PURE__ */
|
|
2665
|
-
/* @__PURE__ */
|
|
2666
|
-
onInstallRequested && texts.iosInstallCta && /* @__PURE__ */
|
|
2710
|
+
return /* @__PURE__ */ jsxs16("div", { className, role: "region", "aria-label": texts.iosInstallTitle, children: [
|
|
2711
|
+
/* @__PURE__ */ jsx24("h3", { children: texts.iosInstallTitle }),
|
|
2712
|
+
/* @__PURE__ */ jsx24("p", { children: texts.iosInstallBody }),
|
|
2713
|
+
onInstallRequested && texts.iosInstallCta && /* @__PURE__ */ jsx24("button", { onClick: onInstallRequested, children: texts.iosInstallCta })
|
|
2667
2714
|
] });
|
|
2668
2715
|
}
|
|
2669
2716
|
if (state.kind === "unsupported") {
|
|
2670
|
-
return /* @__PURE__ */
|
|
2717
|
+
return /* @__PURE__ */ jsx24("div", { className, role: "region", children: /* @__PURE__ */ jsx24("p", { children: texts.unsupportedBody }) });
|
|
2671
2718
|
}
|
|
2672
2719
|
if (state.kind === "error") {
|
|
2673
|
-
return /* @__PURE__ */
|
|
2720
|
+
return /* @__PURE__ */ jsx24("div", { className, role: "region", "aria-label": "error", children: /* @__PURE__ */ jsx24("p", { children: state.message }) });
|
|
2674
2721
|
}
|
|
2675
|
-
return /* @__PURE__ */
|
|
2676
|
-
/* @__PURE__ */
|
|
2722
|
+
return /* @__PURE__ */ jsxs16("div", { className, role: "region", children: [
|
|
2723
|
+
/* @__PURE__ */ jsx24(
|
|
2677
2724
|
"button",
|
|
2678
2725
|
{
|
|
2679
2726
|
type: "button",
|
|
@@ -2687,13 +2734,13 @@ function PushPrompt2({ texts, onSubscribed, onDeclined, onInstallRequested, clas
|
|
|
2687
2734
|
children: texts.cta
|
|
2688
2735
|
}
|
|
2689
2736
|
),
|
|
2690
|
-
onDeclined && /* @__PURE__ */
|
|
2737
|
+
onDeclined && /* @__PURE__ */ jsx24("button", { type: "button", onClick: onDeclined, children: texts.declineCta })
|
|
2691
2738
|
] });
|
|
2692
2739
|
}
|
|
2693
2740
|
|
|
2694
2741
|
// src/components/LanguageSwitcher.tsx
|
|
2695
2742
|
import { usePersistedState as usePersistedState3 } from "@hook-sdk/sdk";
|
|
2696
|
-
import { jsx as
|
|
2743
|
+
import { jsx as jsx25, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2697
2744
|
function LanguageSwitcher({ id, className, label = "Language" }) {
|
|
2698
2745
|
const config = useAppConfig();
|
|
2699
2746
|
const i18nConfig = config.i18n;
|
|
@@ -2702,50 +2749,50 @@ function LanguageSwitcher({ id, className, label = "Language" }) {
|
|
|
2702
2749
|
i18nConfig?.defaultLocale ?? "en-US"
|
|
2703
2750
|
);
|
|
2704
2751
|
if (!i18nConfig) return null;
|
|
2705
|
-
return /* @__PURE__ */
|
|
2706
|
-
label ? /* @__PURE__ */
|
|
2707
|
-
/* @__PURE__ */
|
|
2752
|
+
return /* @__PURE__ */ jsxs17("label", { className, children: [
|
|
2753
|
+
label ? /* @__PURE__ */ jsx25("span", { children: label }) : null,
|
|
2754
|
+
/* @__PURE__ */ jsx25(
|
|
2708
2755
|
"select",
|
|
2709
2756
|
{
|
|
2710
2757
|
id,
|
|
2711
2758
|
value: userLocale,
|
|
2712
2759
|
onChange: (e) => setUserLocale(e.target.value),
|
|
2713
2760
|
"data-testid": "language-switcher",
|
|
2714
|
-
children: i18nConfig.supportedLocales.map((loc) => /* @__PURE__ */
|
|
2761
|
+
children: i18nConfig.supportedLocales.map((loc) => /* @__PURE__ */ jsx25("option", { value: loc, children: loc }, loc))
|
|
2715
2762
|
}
|
|
2716
2763
|
)
|
|
2717
2764
|
] });
|
|
2718
2765
|
}
|
|
2719
2766
|
|
|
2720
2767
|
// src/defaults/LoadingState.tsx
|
|
2721
|
-
import { jsx as
|
|
2768
|
+
import { jsx as jsx26 } from "react/jsx-runtime";
|
|
2722
2769
|
function LoadingState({ message }) {
|
|
2723
|
-
return /* @__PURE__ */
|
|
2770
|
+
return /* @__PURE__ */ jsx26("div", { role: "status", "aria-live": "polite", style: { padding: 24, textAlign: "center" }, children: /* @__PURE__ */ jsx26("span", { children: message ?? "Carregando..." }) });
|
|
2724
2771
|
}
|
|
2725
2772
|
|
|
2726
2773
|
// src/defaults/EmptyState.tsx
|
|
2727
|
-
import { jsx as
|
|
2774
|
+
import { jsx as jsx27, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
2728
2775
|
function EmptyState({ title, description, action }) {
|
|
2729
|
-
return /* @__PURE__ */
|
|
2730
|
-
/* @__PURE__ */
|
|
2731
|
-
description && /* @__PURE__ */
|
|
2732
|
-
action && /* @__PURE__ */
|
|
2776
|
+
return /* @__PURE__ */ jsxs18("div", { role: "status", style: { padding: 32, textAlign: "center" }, children: [
|
|
2777
|
+
/* @__PURE__ */ jsx27("h2", { style: { marginBottom: 8 }, children: title }),
|
|
2778
|
+
description && /* @__PURE__ */ jsx27("p", { style: { opacity: 0.7 }, children: description }),
|
|
2779
|
+
action && /* @__PURE__ */ jsx27("div", { style: { marginTop: 16 }, children: action })
|
|
2733
2780
|
] });
|
|
2734
2781
|
}
|
|
2735
2782
|
|
|
2736
2783
|
// src/defaults/CheckoutPageDefault.tsx
|
|
2737
|
-
import { useEffect as useEffect11, useMemo as useMemo5, useState as
|
|
2784
|
+
import { useEffect as useEffect11, useMemo as useMemo5, useState as useState10 } from "react";
|
|
2738
2785
|
import { useNavigate as useNavigate2 } from "react-router-dom";
|
|
2739
2786
|
|
|
2740
2787
|
// src/hooks/useCheckoutForm.ts
|
|
2741
|
-
import { useCallback as useCallback6, useEffect as useEffect10, useMemo as useMemo4, useRef as useRef6, useState as
|
|
2788
|
+
import { useCallback as useCallback6, useEffect as useEffect10, useMemo as useMemo4, useRef as useRef6, useState as useState9 } from "react";
|
|
2742
2789
|
import {
|
|
2743
|
-
useHook as
|
|
2790
|
+
useHook as useHook10,
|
|
2744
2791
|
EmailTakenError
|
|
2745
2792
|
} from "@hook-sdk/sdk";
|
|
2746
2793
|
|
|
2747
2794
|
// src/errors.ts
|
|
2748
|
-
import { SdkError, SdkAuthError, SdkRateLimitError } from "@hook-sdk/sdk";
|
|
2795
|
+
import { SdkError, SdkAuthError, SdkRateLimitError, SdkValidationError } from "@hook-sdk/sdk";
|
|
2749
2796
|
function mapSdkError(err) {
|
|
2750
2797
|
if (err instanceof SdkRateLimitError) {
|
|
2751
2798
|
return {
|
|
@@ -2764,6 +2811,9 @@ function mapSdkError(err) {
|
|
|
2764
2811
|
}
|
|
2765
2812
|
return { code: "invalid_credentials", message: "E-mail ou senha inv\xE1lidos." };
|
|
2766
2813
|
}
|
|
2814
|
+
if (err instanceof SdkValidationError && err.code === "auth.email_taken") {
|
|
2815
|
+
return { code: "email_taken", message: "Esse e-mail j\xE1 tem conta." };
|
|
2816
|
+
}
|
|
2767
2817
|
if (err instanceof SdkError && err.httpStatus === 0) {
|
|
2768
2818
|
return { code: "network", message: "Sem conex\xE3o com o servidor. Verifique sua internet." };
|
|
2769
2819
|
}
|
|
@@ -2778,15 +2828,15 @@ var EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
|
2778
2828
|
var PHONE_RE = /^[0-9()+\-\s]{8,20}$/;
|
|
2779
2829
|
var CHECK_DEBOUNCE_MS = 400;
|
|
2780
2830
|
function useCheckoutForm(args) {
|
|
2781
|
-
const { auth } =
|
|
2782
|
-
const [name, setName] =
|
|
2783
|
-
const [email, setEmail] =
|
|
2784
|
-
const [emailConfirm, setEmailConfirm] =
|
|
2785
|
-
const [phone, setPhone] =
|
|
2786
|
-
const [cpf, setCpf] =
|
|
2787
|
-
const [method, setMethod] =
|
|
2788
|
-
const [cycle, setCycle] =
|
|
2789
|
-
const [card, setCardState] =
|
|
2831
|
+
const { auth } = useHook10();
|
|
2832
|
+
const [name, setName] = useState9("");
|
|
2833
|
+
const [email, setEmail] = useState9("");
|
|
2834
|
+
const [emailConfirm, setEmailConfirm] = useState9("");
|
|
2835
|
+
const [phone, setPhone] = useState9("");
|
|
2836
|
+
const [cpf, setCpf] = useState9("");
|
|
2837
|
+
const [method, setMethod] = useState9(args.defaultMethod);
|
|
2838
|
+
const [cycle, setCycle] = useState9(args.defaultCycle);
|
|
2839
|
+
const [card, setCardState] = useState9({
|
|
2790
2840
|
number: "",
|
|
2791
2841
|
expiryMonth: "",
|
|
2792
2842
|
expiryYear: "",
|
|
@@ -2796,17 +2846,17 @@ function useCheckoutForm(args) {
|
|
|
2796
2846
|
const setCard = useCallback6((patch) => {
|
|
2797
2847
|
setCardState((prev) => ({ ...prev, ...patch }));
|
|
2798
2848
|
}, []);
|
|
2799
|
-
const [touchedName, setTouchedName] =
|
|
2800
|
-
const [touchedEmail, setTouchedEmail] =
|
|
2801
|
-
const [touchedEmailConfirm, setTouchedEmailConfirm] =
|
|
2802
|
-
const [touchedPhone, setTouchedPhone] =
|
|
2803
|
-
const [touchedCpf, setTouchedCpf] =
|
|
2804
|
-
const [formSubmitAttempted, setFormSubmitAttempted] =
|
|
2805
|
-
const [submitting, setSubmitting] =
|
|
2806
|
-
const [error, setError] =
|
|
2807
|
-
const [emailTaken, setEmailTaken] =
|
|
2808
|
-
const [loginUrl, setLoginUrl] =
|
|
2809
|
-
const [emailStatus, setEmailStatus] =
|
|
2849
|
+
const [touchedName, setTouchedName] = useState9(false);
|
|
2850
|
+
const [touchedEmail, setTouchedEmail] = useState9(false);
|
|
2851
|
+
const [touchedEmailConfirm, setTouchedEmailConfirm] = useState9(false);
|
|
2852
|
+
const [touchedPhone, setTouchedPhone] = useState9(false);
|
|
2853
|
+
const [touchedCpf, setTouchedCpf] = useState9(false);
|
|
2854
|
+
const [formSubmitAttempted, setFormSubmitAttempted] = useState9(false);
|
|
2855
|
+
const [submitting, setSubmitting] = useState9(false);
|
|
2856
|
+
const [error, setError] = useState9(null);
|
|
2857
|
+
const [emailTaken, setEmailTaken] = useState9(false);
|
|
2858
|
+
const [loginUrl, setLoginUrl] = useState9(null);
|
|
2859
|
+
const [emailStatus, setEmailStatus] = useState9("idle");
|
|
2810
2860
|
const lastCheckedEmail = useRef6("");
|
|
2811
2861
|
useEffect10(() => {
|
|
2812
2862
|
if (!email || !EMAIL_RE.test(email)) {
|
|
@@ -2859,7 +2909,8 @@ function useCheckoutForm(args) {
|
|
|
2859
2909
|
const emailConfirmError = touchedEmailConfirm || formSubmitAttempted ? validateEmailConfirm : null;
|
|
2860
2910
|
const phoneError = touchedPhone || formSubmitAttempted ? validatePhone : null;
|
|
2861
2911
|
const cpfError = touchedCpf || formSubmitAttempted ? validateCpf : null;
|
|
2862
|
-
const
|
|
2912
|
+
const phoneOk = method === "pix-auto" ? phone === "" || PHONE_RE.test(phone) : PHONE_RE.test(phone);
|
|
2913
|
+
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);
|
|
2863
2914
|
const submit = useCallback6(async () => {
|
|
2864
2915
|
setFormSubmitAttempted(true);
|
|
2865
2916
|
setError(null);
|
|
@@ -2889,10 +2940,16 @@ function useCheckoutForm(args) {
|
|
|
2889
2940
|
name: card.holderName || name.trim(),
|
|
2890
2941
|
email,
|
|
2891
2942
|
cpfCnpj: cpf.replace(/\D/g, ""),
|
|
2892
|
-
//
|
|
2893
|
-
//
|
|
2894
|
-
|
|
2895
|
-
|
|
2943
|
+
// Plan-V 0.28.4 — Asaas's `creditCardHolderInfo.postalCode`
|
|
2944
|
+
// rejects all-zeros with `tokenize_failed:invalid_holderInfo`
|
|
2945
|
+
// ("O CEP informado é inválido."). The default CheckoutPage
|
|
2946
|
+
// doesn't collect CEP from the user (reference design skipped
|
|
2947
|
+
// it), so ship a known-valid placeholder. Apps that need real
|
|
2948
|
+
// customer addresses must override CheckoutPageDefault and
|
|
2949
|
+
// collect CEP — see personalburn's PaywallStepPagamento for
|
|
2950
|
+
// the pattern.
|
|
2951
|
+
postalCode: "01001000",
|
|
2952
|
+
addressNumber: "100",
|
|
2896
2953
|
phone
|
|
2897
2954
|
}
|
|
2898
2955
|
};
|
|
@@ -2967,14 +3024,14 @@ function mod11(digits, len) {
|
|
|
2967
3024
|
}
|
|
2968
3025
|
|
|
2969
3026
|
// src/hooks/usePlan.ts
|
|
2970
|
-
import { useHook as
|
|
3027
|
+
import { useHook as useHook11 } from "@hook-sdk/sdk";
|
|
2971
3028
|
function usePlan() {
|
|
2972
|
-
const { plan } =
|
|
3029
|
+
const { plan } = useHook11();
|
|
2973
3030
|
return plan;
|
|
2974
3031
|
}
|
|
2975
3032
|
|
|
2976
3033
|
// src/defaults/CheckoutPageDefault.tsx
|
|
2977
|
-
import { Fragment as Fragment7, jsx as
|
|
3034
|
+
import { Fragment as Fragment7, jsx as jsx28, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
2978
3035
|
var INTENT_KEY = "hook:paywall:intent";
|
|
2979
3036
|
var PIX_PAYLOAD_KEY = "hook:paywall:pix-pending";
|
|
2980
3037
|
function readIntent() {
|
|
@@ -3026,7 +3083,7 @@ function CheckoutPageDefault() {
|
|
|
3026
3083
|
const defaultMethod = intent.method === "pix-auto" ? "pix-auto" : "card";
|
|
3027
3084
|
const defaultCycle = intent.cycle === "MONTHLY" ? "MONTHLY" : "YEARLY";
|
|
3028
3085
|
const form = useCheckoutForm({ defaultMethod, defaultCycle });
|
|
3029
|
-
const [expiryMmAa, setExpiryMmAa] =
|
|
3086
|
+
const [expiryMmAa, setExpiryMmAa] = useState10("");
|
|
3030
3087
|
useEffect11(() => {
|
|
3031
3088
|
const { month, year } = parseExpiryMmAa(expiryMmAa);
|
|
3032
3089
|
if (month !== form.card.expiryMonth || year !== form.card.expiryYear) {
|
|
@@ -3090,57 +3147,57 @@ function CheckoutPageDefault() {
|
|
|
3090
3147
|
}
|
|
3091
3148
|
navigate(result.redirect.replace(/^.*\/app\/[^/]+/, "") || "/");
|
|
3092
3149
|
}
|
|
3093
|
-
return /* @__PURE__ */
|
|
3094
|
-
form.emailTaken ? /* @__PURE__ */
|
|
3150
|
+
return /* @__PURE__ */ jsx28("div", { className: "flex-1 flex flex-col bg-background min-h-0", children: /* @__PURE__ */ jsxs19("form", { onSubmit, className: "flex-1 overflow-y-auto", children: [
|
|
3151
|
+
form.emailTaken ? /* @__PURE__ */ jsx28("div", { className: "px-5 pt-4", children: /* @__PURE__ */ jsxs19("div", { role: "alert", className: "rounded-2xl bg-destructive/10 p-4 text-sm text-destructive border border-destructive/20", children: [
|
|
3095
3152
|
"Esse e-mail j\xE1 tem conta nesse app.",
|
|
3096
3153
|
" ",
|
|
3097
|
-
/* @__PURE__ */
|
|
3154
|
+
/* @__PURE__ */ jsx28("a", { href: form.loginUrl ?? "/signin", className: "underline font-semibold", children: "Entrar agora" })
|
|
3098
3155
|
] }) }) : null,
|
|
3099
|
-
form.error ? /* @__PURE__ */
|
|
3100
|
-
/* @__PURE__ */
|
|
3101
|
-
/* @__PURE__ */
|
|
3102
|
-
/* @__PURE__ */
|
|
3103
|
-
/* @__PURE__ */
|
|
3156
|
+
form.error ? /* @__PURE__ */ jsx28("div", { className: "px-5 pt-4", children: /* @__PURE__ */ jsx28("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,
|
|
3157
|
+
/* @__PURE__ */ jsx28("div", { className: "px-5 pt-4", children: form.method === "card" ? /* @__PURE__ */ jsxs19("div", { className: "rounded-2xl bg-card border-[1.5px] border-foreground p-3.5", children: [
|
|
3158
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex items-center gap-2 mb-2", children: [
|
|
3159
|
+
/* @__PURE__ */ jsx28(ShieldIcon, { className: "w-4 h-4" }),
|
|
3160
|
+
/* @__PURE__ */ jsx28("div", { className: "text-sm font-bold", children: "Voc\xEA N\xC3O ser\xE1 cobrada hoje" })
|
|
3104
3161
|
] }),
|
|
3105
|
-
/* @__PURE__ */
|
|
3106
|
-
/* @__PURE__ */
|
|
3107
|
-
/* @__PURE__ */
|
|
3108
|
-
/* @__PURE__ */
|
|
3162
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex justify-between items-baseline text-sm text-muted-foreground", children: [
|
|
3163
|
+
/* @__PURE__ */ jsx28("span", { children: "R$ 0,00 agora" }),
|
|
3164
|
+
/* @__PURE__ */ jsx28("span", { className: "opacity-50", children: "\xB7" }),
|
|
3165
|
+
/* @__PURE__ */ jsxs19("span", { children: [
|
|
3109
3166
|
monthlyText,
|
|
3110
3167
|
"/m\xEAs ap\xF3s ",
|
|
3111
3168
|
trialDays,
|
|
3112
3169
|
" dias"
|
|
3113
3170
|
] })
|
|
3114
3171
|
] }),
|
|
3115
|
-
/* @__PURE__ */
|
|
3116
|
-
/* @__PURE__ */
|
|
3172
|
+
/* @__PURE__ */ jsxs19("div", { className: "mt-2.5 text-[11px] text-muted-foreground flex items-center gap-1.5", children: [
|
|
3173
|
+
/* @__PURE__ */ jsx28(BellIcon, { className: "w-2.5 h-2.5" }),
|
|
3117
3174
|
"Avisamos por email 2 dias antes da primeira cobran\xE7a"
|
|
3118
3175
|
] })
|
|
3119
|
-
] }) : /* @__PURE__ */
|
|
3120
|
-
/* @__PURE__ */
|
|
3121
|
-
/* @__PURE__ */
|
|
3122
|
-
/* @__PURE__ */
|
|
3176
|
+
] }) : /* @__PURE__ */ jsxs19("div", { className: "rounded-2xl p-3.5 bg-emerald-50 border-[1.5px] border-emerald-600/60", children: [
|
|
3177
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex items-center gap-2 mb-2 text-emerald-900", children: [
|
|
3178
|
+
/* @__PURE__ */ jsx28(ShieldIcon, { className: "w-4 h-4" }),
|
|
3179
|
+
/* @__PURE__ */ jsxs19("div", { className: "text-sm font-bold", children: [
|
|
3123
3180
|
"Garantia incondicional de ",
|
|
3124
3181
|
trialDays,
|
|
3125
3182
|
" dias"
|
|
3126
3183
|
] })
|
|
3127
3184
|
] }),
|
|
3128
|
-
/* @__PURE__ */
|
|
3185
|
+
/* @__PURE__ */ jsxs19("div", { className: "text-sm text-emerald-900 leading-snug", children: [
|
|
3129
3186
|
"Voc\xEA paga ",
|
|
3130
|
-
/* @__PURE__ */
|
|
3187
|
+
/* @__PURE__ */ jsx28("b", { children: todayAmount }),
|
|
3131
3188
|
" agora via Pix.",
|
|
3132
|
-
/* @__PURE__ */
|
|
3189
|
+
/* @__PURE__ */ jsx28("br", {}),
|
|
3133
3190
|
"N\xE3o gostou em ",
|
|
3134
3191
|
trialDays,
|
|
3135
3192
|
" dias? Devolvemos ",
|
|
3136
|
-
/* @__PURE__ */
|
|
3193
|
+
/* @__PURE__ */ jsx28("b", { children: "100%" }),
|
|
3137
3194
|
" sem perguntas \u2014 direto pelo app."
|
|
3138
3195
|
] })
|
|
3139
3196
|
] }) }),
|
|
3140
|
-
/* @__PURE__ */
|
|
3141
|
-
/* @__PURE__ */
|
|
3142
|
-
/* @__PURE__ */
|
|
3143
|
-
/* @__PURE__ */
|
|
3197
|
+
/* @__PURE__ */ jsxs19("section", { className: "px-5 pt-5", children: [
|
|
3198
|
+
/* @__PURE__ */ jsx28("h2", { className: "font-display text-2xl mb-3.5 leading-tight text-foreground", children: "Quase l\xE1." }),
|
|
3199
|
+
/* @__PURE__ */ jsx28(FieldLabel, { children: "Email" }),
|
|
3200
|
+
/* @__PURE__ */ jsx28(
|
|
3144
3201
|
FieldInput,
|
|
3145
3202
|
{
|
|
3146
3203
|
type: "email",
|
|
@@ -3157,10 +3214,10 @@ function CheckoutPageDefault() {
|
|
|
3157
3214
|
valid: form.emailStatus === "available"
|
|
3158
3215
|
}
|
|
3159
3216
|
),
|
|
3160
|
-
!form.emailError && /* @__PURE__ */
|
|
3161
|
-
/* @__PURE__ */
|
|
3162
|
-
/* @__PURE__ */
|
|
3163
|
-
/* @__PURE__ */
|
|
3217
|
+
!form.emailError && /* @__PURE__ */ jsx28(FieldHint, { children: form.emailStatus === "checking" ? "Verificando\u2026" : form.emailStatus === "available" ? "\u2713 Dispon\xEDvel" : "Voc\xEA vai usar este email para entrar no app" }),
|
|
3218
|
+
/* @__PURE__ */ jsx28("div", { className: "h-3" }),
|
|
3219
|
+
/* @__PURE__ */ jsx28(FieldLabel, { children: "Nome completo" }),
|
|
3220
|
+
/* @__PURE__ */ jsx28(
|
|
3164
3221
|
FieldInput,
|
|
3165
3222
|
{
|
|
3166
3223
|
type: "text",
|
|
@@ -3173,9 +3230,9 @@ function CheckoutPageDefault() {
|
|
|
3173
3230
|
valid: !!form.name && !form.nameError
|
|
3174
3231
|
}
|
|
3175
3232
|
),
|
|
3176
|
-
/* @__PURE__ */
|
|
3177
|
-
/* @__PURE__ */
|
|
3178
|
-
/* @__PURE__ */
|
|
3233
|
+
/* @__PURE__ */ jsx28("div", { className: "h-3" }),
|
|
3234
|
+
/* @__PURE__ */ jsx28(FieldLabel, { children: "CPF" }),
|
|
3235
|
+
/* @__PURE__ */ jsx28(
|
|
3179
3236
|
FieldInput,
|
|
3180
3237
|
{
|
|
3181
3238
|
type: "text",
|
|
@@ -3187,28 +3244,47 @@ function CheckoutPageDefault() {
|
|
|
3187
3244
|
error: form.cpfError,
|
|
3188
3245
|
valid: !!form.cpf && !form.cpfError
|
|
3189
3246
|
}
|
|
3190
|
-
)
|
|
3247
|
+
),
|
|
3248
|
+
form.method === "card" ? /* @__PURE__ */ jsxs19(Fragment7, { children: [
|
|
3249
|
+
/* @__PURE__ */ jsx28("div", { className: "h-3" }),
|
|
3250
|
+
/* @__PURE__ */ jsx28(FieldLabel, { children: "Telefone" }),
|
|
3251
|
+
/* @__PURE__ */ jsx28(
|
|
3252
|
+
FieldInput,
|
|
3253
|
+
{
|
|
3254
|
+
type: "tel",
|
|
3255
|
+
inputMode: "tel",
|
|
3256
|
+
autoComplete: "tel",
|
|
3257
|
+
placeholder: "(11) 99999-9999",
|
|
3258
|
+
value: form.phone,
|
|
3259
|
+
onChange: form.setPhone,
|
|
3260
|
+
onBlur: form.markPhoneTouched,
|
|
3261
|
+
error: form.phoneError,
|
|
3262
|
+
valid: !!form.phone && !form.phoneError
|
|
3263
|
+
}
|
|
3264
|
+
),
|
|
3265
|
+
!form.phoneError && /* @__PURE__ */ jsx28(FieldHint, { children: "Usado pra confirmar pagamento e tratar disputas." })
|
|
3266
|
+
] }) : null
|
|
3191
3267
|
] }),
|
|
3192
|
-
/* @__PURE__ */
|
|
3193
|
-
/* @__PURE__ */
|
|
3194
|
-
/* @__PURE__ */
|
|
3195
|
-
/* @__PURE__ */
|
|
3268
|
+
/* @__PURE__ */ jsxs19("section", { className: "px-5 pt-5", children: [
|
|
3269
|
+
/* @__PURE__ */ jsx28(FieldLabel, { children: "Forma de pagamento" }),
|
|
3270
|
+
/* @__PURE__ */ jsxs19("div", { role: "tablist", className: "flex gap-1.5 bg-muted p-1 rounded-xl", children: [
|
|
3271
|
+
/* @__PURE__ */ jsx28(
|
|
3196
3272
|
TabButton,
|
|
3197
3273
|
{
|
|
3198
3274
|
active: form.method === "card",
|
|
3199
3275
|
onClick: () => form.setMethod("card"),
|
|
3200
|
-
icon: /* @__PURE__ */
|
|
3276
|
+
icon: /* @__PURE__ */ jsx28(CardIcon, { className: "w-3.5 h-3.5" }),
|
|
3201
3277
|
label: "Cart\xE3o",
|
|
3202
3278
|
subtitle: trialDays > 0 ? `${trialDays} dias gr\xE1tis` : "pague hoje",
|
|
3203
3279
|
subtitleActiveClass: "text-emerald-700"
|
|
3204
3280
|
}
|
|
3205
3281
|
),
|
|
3206
|
-
/* @__PURE__ */
|
|
3282
|
+
/* @__PURE__ */ jsx28(
|
|
3207
3283
|
TabButton,
|
|
3208
3284
|
{
|
|
3209
3285
|
active: form.method === "pix-auto",
|
|
3210
3286
|
onClick: () => form.setMethod("pix-auto"),
|
|
3211
|
-
icon: /* @__PURE__ */
|
|
3287
|
+
icon: /* @__PURE__ */ jsx28(PixIcon, { className: "w-3.5 h-3.5" }),
|
|
3212
3288
|
label: "Pix",
|
|
3213
3289
|
subtitle: `pague hoje \xB7 garantia ${trialDays}d`,
|
|
3214
3290
|
subtitleActiveClass: "text-foreground/70"
|
|
@@ -3216,10 +3292,10 @@ function CheckoutPageDefault() {
|
|
|
3216
3292
|
)
|
|
3217
3293
|
] })
|
|
3218
3294
|
] }),
|
|
3219
|
-
form.method === "card" ? /* @__PURE__ */
|
|
3220
|
-
/* @__PURE__ */
|
|
3221
|
-
/* @__PURE__ */
|
|
3222
|
-
/* @__PURE__ */
|
|
3295
|
+
form.method === "card" ? /* @__PURE__ */ jsxs19("section", { className: "px-5 pt-3.5", children: [
|
|
3296
|
+
/* @__PURE__ */ jsx28(FieldLabel, { children: "N\xFAmero do cart\xE3o" }),
|
|
3297
|
+
/* @__PURE__ */ jsxs19("div", { className: "relative", children: [
|
|
3298
|
+
/* @__PURE__ */ jsx28(
|
|
3223
3299
|
FieldInput,
|
|
3224
3300
|
{
|
|
3225
3301
|
type: "text",
|
|
@@ -3231,13 +3307,13 @@ function CheckoutPageDefault() {
|
|
|
3231
3307
|
style: cardBrand ? { paddingRight: "4.5rem" } : void 0
|
|
3232
3308
|
}
|
|
3233
3309
|
),
|
|
3234
|
-
cardBrand && /* @__PURE__ */
|
|
3310
|
+
cardBrand && /* @__PURE__ */ jsx28("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 })
|
|
3235
3311
|
] }),
|
|
3236
|
-
/* @__PURE__ */
|
|
3237
|
-
/* @__PURE__ */
|
|
3238
|
-
/* @__PURE__ */
|
|
3239
|
-
/* @__PURE__ */
|
|
3240
|
-
/* @__PURE__ */
|
|
3312
|
+
/* @__PURE__ */ jsx28("div", { className: "h-3" }),
|
|
3313
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex gap-2.5", children: [
|
|
3314
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex-1", children: [
|
|
3315
|
+
/* @__PURE__ */ jsx28(FieldLabel, { children: "Validade" }),
|
|
3316
|
+
/* @__PURE__ */ jsx28(
|
|
3241
3317
|
FieldInput,
|
|
3242
3318
|
{
|
|
3243
3319
|
type: "text",
|
|
@@ -3249,9 +3325,9 @@ function CheckoutPageDefault() {
|
|
|
3249
3325
|
}
|
|
3250
3326
|
)
|
|
3251
3327
|
] }),
|
|
3252
|
-
/* @__PURE__ */
|
|
3253
|
-
/* @__PURE__ */
|
|
3254
|
-
/* @__PURE__ */
|
|
3328
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex-1", children: [
|
|
3329
|
+
/* @__PURE__ */ jsx28(FieldLabel, { children: "CVV" }),
|
|
3330
|
+
/* @__PURE__ */ jsx28(
|
|
3255
3331
|
FieldInput,
|
|
3256
3332
|
{
|
|
3257
3333
|
type: "text",
|
|
@@ -3264,9 +3340,9 @@ function CheckoutPageDefault() {
|
|
|
3264
3340
|
)
|
|
3265
3341
|
] })
|
|
3266
3342
|
] }),
|
|
3267
|
-
/* @__PURE__ */
|
|
3268
|
-
/* @__PURE__ */
|
|
3269
|
-
/* @__PURE__ */
|
|
3343
|
+
/* @__PURE__ */ jsx28("div", { className: "h-3" }),
|
|
3344
|
+
/* @__PURE__ */ jsx28(FieldLabel, { children: "Nome no cart\xE3o" }),
|
|
3345
|
+
/* @__PURE__ */ jsx28(
|
|
3270
3346
|
FieldInput,
|
|
3271
3347
|
{
|
|
3272
3348
|
type: "text",
|
|
@@ -3276,89 +3352,89 @@ function CheckoutPageDefault() {
|
|
|
3276
3352
|
onChange: (v) => form.setCard({ holderName: v })
|
|
3277
3353
|
}
|
|
3278
3354
|
)
|
|
3279
|
-
] }) : /* @__PURE__ */
|
|
3280
|
-
/* @__PURE__ */
|
|
3281
|
-
/* @__PURE__ */
|
|
3282
|
-
/* @__PURE__ */
|
|
3283
|
-
/* @__PURE__ */
|
|
3355
|
+
] }) : /* @__PURE__ */ jsx28("section", { className: "px-5 pt-3.5", children: /* @__PURE__ */ jsxs19("div", { className: "rounded-2xl bg-card border border-border p-3.5 flex gap-3.5 items-center", children: [
|
|
3356
|
+
/* @__PURE__ */ jsx28("div", { className: "w-[72px] h-[72px] rounded-xl shrink-0 border-2 border-foreground relative overflow-hidden bg-muted", children: /* @__PURE__ */ jsx28("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__ */ jsx28(PixIcon, { className: "w-3.5 h-3.5 text-foreground" }) }) }),
|
|
3357
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex-1", children: [
|
|
3358
|
+
/* @__PURE__ */ jsx28("div", { className: "text-xs font-bold uppercase tracking-wider text-muted-foreground", children: "pagamento em segundos" }),
|
|
3359
|
+
/* @__PURE__ */ jsxs19("div", { className: "text-sm text-foreground mt-1 leading-snug", children: [
|
|
3284
3360
|
"Geramos seu ",
|
|
3285
|
-
/* @__PURE__ */
|
|
3361
|
+
/* @__PURE__ */ jsx28("b", { children: "QR Pix" }),
|
|
3286
3362
|
" no pr\xF3ximo passo. Pague pelo app do banco e seu acesso libera ",
|
|
3287
|
-
/* @__PURE__ */
|
|
3363
|
+
/* @__PURE__ */ jsx28("b", { children: "imediatamente" }),
|
|
3288
3364
|
"."
|
|
3289
3365
|
] })
|
|
3290
3366
|
] })
|
|
3291
3367
|
] }) }),
|
|
3292
|
-
/* @__PURE__ */
|
|
3293
|
-
/* @__PURE__ */
|
|
3294
|
-
/* @__PURE__ */
|
|
3295
|
-
/* @__PURE__ */
|
|
3296
|
-
/* @__PURE__ */
|
|
3368
|
+
/* @__PURE__ */ jsx28("section", { className: "px-5 pt-5", children: /* @__PURE__ */ jsxs19("div", { className: "bg-muted rounded-2xl p-4", children: [
|
|
3369
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex justify-between mb-2.5", children: [
|
|
3370
|
+
/* @__PURE__ */ jsxs19("div", { children: [
|
|
3371
|
+
/* @__PURE__ */ jsx28("div", { className: "text-sm font-semibold text-foreground", children: annual ? "Plano Anual" : "Plano Mensal" }),
|
|
3372
|
+
/* @__PURE__ */ jsx28("div", { className: "text-[11px] text-muted-foreground", children: "Coach" })
|
|
3297
3373
|
] }),
|
|
3298
|
-
/* @__PURE__ */
|
|
3299
|
-
/* @__PURE__ */
|
|
3374
|
+
/* @__PURE__ */ jsxs19("div", { className: "text-right", children: [
|
|
3375
|
+
/* @__PURE__ */ jsxs19("div", { className: "text-sm font-bold text-foreground", children: [
|
|
3300
3376
|
cyclePriceText,
|
|
3301
3377
|
"/",
|
|
3302
3378
|
annual ? "ano" : "m\xEAs"
|
|
3303
3379
|
] }),
|
|
3304
|
-
annual && annualSavingsCents > 0 && /* @__PURE__ */
|
|
3380
|
+
annual && annualSavingsCents > 0 && /* @__PURE__ */ jsxs19("div", { className: "text-[11px] text-emerald-700 font-semibold", children: [
|
|
3305
3381
|
"economia ",
|
|
3306
3382
|
formatBrl(annualSavingsCents)
|
|
3307
3383
|
] })
|
|
3308
3384
|
] })
|
|
3309
3385
|
] }),
|
|
3310
|
-
/* @__PURE__ */
|
|
3311
|
-
/* @__PURE__ */
|
|
3312
|
-
/* @__PURE__ */
|
|
3313
|
-
/* @__PURE__ */
|
|
3314
|
-
form.method === "card" && trialDays > 0 && /* @__PURE__ */
|
|
3386
|
+
/* @__PURE__ */ jsx28("div", { className: "h-px bg-border my-3" }),
|
|
3387
|
+
/* @__PURE__ */ jsxs19("div", { className: "flex justify-between items-baseline", children: [
|
|
3388
|
+
/* @__PURE__ */ jsxs19("div", { children: [
|
|
3389
|
+
/* @__PURE__ */ jsx28("div", { className: "text-sm font-bold text-foreground", children: "Voc\xEA paga hoje" }),
|
|
3390
|
+
form.method === "card" && trialDays > 0 && /* @__PURE__ */ jsxs19("div", { className: "text-[11px] text-muted-foreground mt-0.5", children: [
|
|
3315
3391
|
"cobran\xE7a inicia no dia ",
|
|
3316
3392
|
trialDays
|
|
3317
3393
|
] }),
|
|
3318
|
-
form.method === "pix-auto" && /* @__PURE__ */
|
|
3394
|
+
form.method === "pix-auto" && /* @__PURE__ */ jsxs19("div", { className: "text-[11px] text-emerald-700 mt-0.5 font-semibold", children: [
|
|
3319
3395
|
"reembolso garantido at\xE9 o dia ",
|
|
3320
3396
|
trialDays
|
|
3321
3397
|
] })
|
|
3322
3398
|
] }),
|
|
3323
|
-
/* @__PURE__ */
|
|
3399
|
+
/* @__PURE__ */ jsx28("div", { className: "text-2xl font-bold font-display tracking-tight text-foreground", children: todayAmount })
|
|
3324
3400
|
] })
|
|
3325
3401
|
] }) }),
|
|
3326
|
-
/* @__PURE__ */
|
|
3327
|
-
/* @__PURE__ */
|
|
3328
|
-
/* @__PURE__ */
|
|
3402
|
+
/* @__PURE__ */ jsx28("div", { className: "h-4" }),
|
|
3403
|
+
/* @__PURE__ */ jsxs19("div", { className: "sticky bottom-0 px-5 pt-3.5 pb-6 bg-gradient-to-b from-transparent to-background", children: [
|
|
3404
|
+
/* @__PURE__ */ jsx28(
|
|
3329
3405
|
"button",
|
|
3330
3406
|
{
|
|
3331
3407
|
type: "submit",
|
|
3332
3408
|
disabled: !form.canSubmit,
|
|
3333
3409
|
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",
|
|
3334
|
-
children: form.submitting ? /* @__PURE__ */
|
|
3335
|
-
/* @__PURE__ */
|
|
3410
|
+
children: form.submitting ? /* @__PURE__ */ jsxs19(Fragment7, { children: [
|
|
3411
|
+
/* @__PURE__ */ jsx28(Spinner2, {}),
|
|
3336
3412
|
" ",
|
|
3337
3413
|
form.method === "pix-auto" ? "Gerando QR\u2026" : "Confirmando\u2026"
|
|
3338
|
-
] }) : form.method === "card" ? /* @__PURE__ */
|
|
3339
|
-
/* @__PURE__ */
|
|
3414
|
+
] }) : form.method === "card" ? /* @__PURE__ */ jsxs19(Fragment7, { children: [
|
|
3415
|
+
/* @__PURE__ */ jsx28(LockIcon, { className: "w-3.5 h-3.5" }),
|
|
3340
3416
|
" Confirmar e come\xE7ar gr\xE1tis"
|
|
3341
|
-
] }) : /* @__PURE__ */
|
|
3342
|
-
/* @__PURE__ */
|
|
3417
|
+
] }) : /* @__PURE__ */ jsxs19(Fragment7, { children: [
|
|
3418
|
+
/* @__PURE__ */ jsx28(PixIcon, { className: "w-3.5 h-3.5" }),
|
|
3343
3419
|
" Gerar QR \xB7 pagar ",
|
|
3344
3420
|
todayAmount
|
|
3345
3421
|
] })
|
|
3346
3422
|
}
|
|
3347
3423
|
),
|
|
3348
|
-
/* @__PURE__ */
|
|
3424
|
+
/* @__PURE__ */ jsxs19("div", { className: "text-center mt-2.5 text-xs text-muted-foreground", children: [
|
|
3349
3425
|
"Ao continuar, voc\xEA concorda com nossos ",
|
|
3350
|
-
/* @__PURE__ */
|
|
3426
|
+
/* @__PURE__ */ jsx28("u", { children: "Termos" }),
|
|
3351
3427
|
". Pagamento seguro Asaas."
|
|
3352
3428
|
] }),
|
|
3353
|
-
/* @__PURE__ */
|
|
3354
|
-
/* @__PURE__ */
|
|
3355
|
-
/* @__PURE__ */
|
|
3429
|
+
/* @__PURE__ */ jsxs19("div", { className: "mt-3 flex items-center justify-center gap-3.5 text-[11px] text-muted-foreground", children: [
|
|
3430
|
+
/* @__PURE__ */ jsxs19("span", { className: "inline-flex items-center gap-1", children: [
|
|
3431
|
+
/* @__PURE__ */ jsx28(LockIcon, { className: "w-2.5 h-2.5 opacity-60" }),
|
|
3356
3432
|
" SSL 256-bit"
|
|
3357
3433
|
] }),
|
|
3358
|
-
/* @__PURE__ */
|
|
3359
|
-
/* @__PURE__ */
|
|
3360
|
-
/* @__PURE__ */
|
|
3361
|
-
/* @__PURE__ */
|
|
3434
|
+
/* @__PURE__ */ jsx28("span", { className: "w-px h-2.5 bg-border" }),
|
|
3435
|
+
/* @__PURE__ */ jsx28("span", { children: "Pagamento via Asaas" }),
|
|
3436
|
+
/* @__PURE__ */ jsx28("span", { className: "w-px h-2.5 bg-border" }),
|
|
3437
|
+
/* @__PURE__ */ jsxs19("span", { children: [
|
|
3362
3438
|
"Garantia ",
|
|
3363
3439
|
trialDays,
|
|
3364
3440
|
" dias"
|
|
@@ -3368,13 +3444,13 @@ function CheckoutPageDefault() {
|
|
|
3368
3444
|
] }) });
|
|
3369
3445
|
}
|
|
3370
3446
|
function FieldLabel({ children }) {
|
|
3371
|
-
return /* @__PURE__ */
|
|
3447
|
+
return /* @__PURE__ */ jsx28("div", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground mb-1.5", children });
|
|
3372
3448
|
}
|
|
3373
3449
|
function FieldInput(props) {
|
|
3374
3450
|
const baseClass = "w-full px-4 rounded-xl bg-card text-base text-foreground outline-none border-[1.5px] transition-colors";
|
|
3375
3451
|
const stateClass = props.error ? "border-destructive focus:border-destructive" : props.valid ? "border-emerald-600 focus:border-emerald-700" : "border-border focus:border-foreground";
|
|
3376
|
-
return /* @__PURE__ */
|
|
3377
|
-
/* @__PURE__ */
|
|
3452
|
+
return /* @__PURE__ */ jsxs19(Fragment7, { children: [
|
|
3453
|
+
/* @__PURE__ */ jsx28(
|
|
3378
3454
|
"input",
|
|
3379
3455
|
{
|
|
3380
3456
|
type: props.type ?? "text",
|
|
@@ -3391,14 +3467,14 @@ function FieldInput(props) {
|
|
|
3391
3467
|
className: `${baseClass} ${stateClass}`
|
|
3392
3468
|
}
|
|
3393
3469
|
),
|
|
3394
|
-
props.error ? /* @__PURE__ */
|
|
3470
|
+
props.error ? /* @__PURE__ */ jsx28("div", { className: "mt-1.5 text-xs text-destructive font-medium", children: props.error }) : null
|
|
3395
3471
|
] });
|
|
3396
3472
|
}
|
|
3397
3473
|
function FieldHint({ children }) {
|
|
3398
|
-
return /* @__PURE__ */
|
|
3474
|
+
return /* @__PURE__ */ jsx28("div", { className: "mt-1.5 text-xs text-muted-foreground", children });
|
|
3399
3475
|
}
|
|
3400
3476
|
function TabButton({ active, onClick, icon, label, subtitle, subtitleActiveClass }) {
|
|
3401
|
-
return /* @__PURE__ */
|
|
3477
|
+
return /* @__PURE__ */ jsxs19(
|
|
3402
3478
|
"button",
|
|
3403
3479
|
{
|
|
3404
3480
|
type: "button",
|
|
@@ -3408,45 +3484,45 @@ function TabButton({ active, onClick, icon, label, subtitle, subtitleActiveClass
|
|
|
3408
3484
|
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"}`,
|
|
3409
3485
|
style: { minHeight: 56 },
|
|
3410
3486
|
children: [
|
|
3411
|
-
/* @__PURE__ */
|
|
3487
|
+
/* @__PURE__ */ jsxs19("span", { className: "inline-flex items-center gap-1.5", children: [
|
|
3412
3488
|
icon,
|
|
3413
3489
|
" ",
|
|
3414
3490
|
label
|
|
3415
3491
|
] }),
|
|
3416
|
-
/* @__PURE__ */
|
|
3492
|
+
/* @__PURE__ */ jsx28("span", { className: `text-[10px] font-medium ${active ? subtitleActiveClass : "text-muted-foreground/70"}`, children: subtitle })
|
|
3417
3493
|
]
|
|
3418
3494
|
}
|
|
3419
3495
|
);
|
|
3420
3496
|
}
|
|
3421
3497
|
function CardIcon({ className }) {
|
|
3422
|
-
return /* @__PURE__ */
|
|
3423
|
-
/* @__PURE__ */
|
|
3424
|
-
/* @__PURE__ */
|
|
3498
|
+
return /* @__PURE__ */ jsxs19("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
3499
|
+
/* @__PURE__ */ jsx28("rect", { x: "2.5", y: "5.5", width: "19", height: "13", rx: "2.5" }),
|
|
3500
|
+
/* @__PURE__ */ jsx28("path", { d: "M2.5 10h19" })
|
|
3425
3501
|
] });
|
|
3426
3502
|
}
|
|
3427
3503
|
function PixIcon({ className }) {
|
|
3428
|
-
return /* @__PURE__ */
|
|
3504
|
+
return /* @__PURE__ */ jsx28("svg", { className, viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ jsx28("path", { d: "M12 2L2 12l10 10 10-10L12 2zm0 4.83L17.17 12 12 17.17 6.83 12 12 6.83z" }) });
|
|
3429
3505
|
}
|
|
3430
3506
|
function LockIcon({ className }) {
|
|
3431
|
-
return /* @__PURE__ */
|
|
3432
|
-
/* @__PURE__ */
|
|
3433
|
-
/* @__PURE__ */
|
|
3507
|
+
return /* @__PURE__ */ jsxs19("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
3508
|
+
/* @__PURE__ */ jsx28("rect", { x: "4", y: "10", width: "16", height: "11", rx: "2.5" }),
|
|
3509
|
+
/* @__PURE__ */ jsx28("path", { d: "M7.5 10V7a4.5 4.5 0 119 0v3" })
|
|
3434
3510
|
] });
|
|
3435
3511
|
}
|
|
3436
3512
|
function ShieldIcon({ className }) {
|
|
3437
|
-
return /* @__PURE__ */
|
|
3438
|
-
/* @__PURE__ */
|
|
3439
|
-
/* @__PURE__ */
|
|
3513
|
+
return /* @__PURE__ */ jsxs19("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
3514
|
+
/* @__PURE__ */ jsx28("path", { d: "M12 2.5l8 3v6c0 5-3.5 8.5-8 10-4.5-1.5-8-5-8-10v-6l8-3z" }),
|
|
3515
|
+
/* @__PURE__ */ jsx28("path", { d: "M9 12l2 2 4-4" })
|
|
3440
3516
|
] });
|
|
3441
3517
|
}
|
|
3442
3518
|
function BellIcon({ className }) {
|
|
3443
|
-
return /* @__PURE__ */
|
|
3444
|
-
/* @__PURE__ */
|
|
3445
|
-
/* @__PURE__ */
|
|
3519
|
+
return /* @__PURE__ */ jsxs19("svg", { className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
3520
|
+
/* @__PURE__ */ jsx28("path", { d: "M6 17V11a6 6 0 1112 0v6l1.5 2H4.5L6 17z" }),
|
|
3521
|
+
/* @__PURE__ */ jsx28("path", { d: "M10 21a2 2 0 004 0" })
|
|
3446
3522
|
] });
|
|
3447
3523
|
}
|
|
3448
3524
|
function Spinner2() {
|
|
3449
|
-
return /* @__PURE__ */
|
|
3525
|
+
return /* @__PURE__ */ jsx28(
|
|
3450
3526
|
"span",
|
|
3451
3527
|
{
|
|
3452
3528
|
className: "w-4 h-4 rounded-full border-2 border-white/40 border-t-white",
|
|
@@ -3456,10 +3532,10 @@ function Spinner2() {
|
|
|
3456
3532
|
}
|
|
3457
3533
|
|
|
3458
3534
|
// src/defaults/PixWaitingPageDefault.tsx
|
|
3459
|
-
import { useEffect as useEffect12, useMemo as useMemo6, useState as
|
|
3535
|
+
import { useEffect as useEffect12, useMemo as useMemo6, useState as useState11 } from "react";
|
|
3460
3536
|
import { useNavigate as useNavigate3 } from "react-router-dom";
|
|
3461
|
-
import { useHook as
|
|
3462
|
-
import { jsx as
|
|
3537
|
+
import { useHook as useHook12 } from "@hook-sdk/sdk";
|
|
3538
|
+
import { jsx as jsx29, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
3463
3539
|
var PIX_PAYLOAD_KEY2 = "hook:paywall:pix-pending";
|
|
3464
3540
|
var TIMEOUT_MS = 30 * 60 * 1e3;
|
|
3465
3541
|
function readPixPayload() {
|
|
@@ -3481,10 +3557,10 @@ function clearPixPayload() {
|
|
|
3481
3557
|
}
|
|
3482
3558
|
function PixWaitingPageDefault() {
|
|
3483
3559
|
const navigate = useNavigate3();
|
|
3484
|
-
const { subscription } =
|
|
3560
|
+
const { subscription } = useHook12();
|
|
3485
3561
|
const payload = useMemo6(readPixPayload, []);
|
|
3486
|
-
const [copied, setCopied] =
|
|
3487
|
-
const [timedOut, setTimedOut] =
|
|
3562
|
+
const [copied, setCopied] = useState11(false);
|
|
3563
|
+
const [timedOut, setTimedOut] = useState11(false);
|
|
3488
3564
|
useEffect12(() => {
|
|
3489
3565
|
if (!payload) navigate("/paywall/checkout", { replace: true });
|
|
3490
3566
|
}, [payload, navigate]);
|
|
@@ -3510,10 +3586,10 @@ function PixWaitingPageDefault() {
|
|
|
3510
3586
|
}
|
|
3511
3587
|
if (!payload) return null;
|
|
3512
3588
|
if (timedOut) {
|
|
3513
|
-
return /* @__PURE__ */
|
|
3514
|
-
/* @__PURE__ */
|
|
3515
|
-
/* @__PURE__ */
|
|
3516
|
-
/* @__PURE__ */
|
|
3589
|
+
return /* @__PURE__ */ jsxs20("div", { className: "flex-1 flex flex-col items-center justify-center px-6 py-10 text-center bg-background space-y-4", children: [
|
|
3590
|
+
/* @__PURE__ */ jsx29("h1", { className: "font-display text-2xl text-foreground", children: "PIX expirado" }),
|
|
3591
|
+
/* @__PURE__ */ jsx29("p", { className: "text-sm text-muted-foreground", children: "O tempo pra pagar acabou. Gere um novo PIX." }),
|
|
3592
|
+
/* @__PURE__ */ jsx29(
|
|
3517
3593
|
"button",
|
|
3518
3594
|
{
|
|
3519
3595
|
onClick: () => {
|
|
@@ -3526,20 +3602,20 @@ function PixWaitingPageDefault() {
|
|
|
3526
3602
|
)
|
|
3527
3603
|
] });
|
|
3528
3604
|
}
|
|
3529
|
-
return /* @__PURE__ */
|
|
3530
|
-
/* @__PURE__ */
|
|
3531
|
-
/* @__PURE__ */
|
|
3532
|
-
/* @__PURE__ */
|
|
3605
|
+
return /* @__PURE__ */ jsxs20("div", { className: "flex-1 flex flex-col items-center px-6 py-8 bg-background space-y-6", children: [
|
|
3606
|
+
/* @__PURE__ */ jsxs20("header", { className: "text-center space-y-2", children: [
|
|
3607
|
+
/* @__PURE__ */ jsx29("h1", { className: "font-display text-2xl text-foreground", children: "Pague o PIX" }),
|
|
3608
|
+
/* @__PURE__ */ jsx29("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." })
|
|
3533
3609
|
] }),
|
|
3534
|
-
payload.base64 ? /* @__PURE__ */
|
|
3610
|
+
payload.base64 ? /* @__PURE__ */ jsx29(
|
|
3535
3611
|
"img",
|
|
3536
3612
|
{
|
|
3537
3613
|
src: `data:image/png;base64,${payload.base64}`,
|
|
3538
3614
|
alt: "QR Code PIX",
|
|
3539
3615
|
className: "w-64 h-64 rounded-2xl border border-border bg-card p-2"
|
|
3540
3616
|
}
|
|
3541
|
-
) : /* @__PURE__ */
|
|
3542
|
-
payload.payload ? /* @__PURE__ */
|
|
3617
|
+
) : /* @__PURE__ */ jsx29("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" }),
|
|
3618
|
+
payload.payload ? /* @__PURE__ */ jsx29(
|
|
3543
3619
|
"button",
|
|
3544
3620
|
{
|
|
3545
3621
|
onClick: copyPayload,
|
|
@@ -3547,28 +3623,28 @@ function PixWaitingPageDefault() {
|
|
|
3547
3623
|
children: copied ? "\u2713 Copiado!" : "Copiar c\xF3digo PIX"
|
|
3548
3624
|
}
|
|
3549
3625
|
) : null,
|
|
3550
|
-
/* @__PURE__ */
|
|
3551
|
-
/* @__PURE__ */
|
|
3626
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
|
|
3627
|
+
/* @__PURE__ */ jsx29("span", { className: "inline-block w-2 h-2 rounded-full bg-primary animate-pulse" }),
|
|
3552
3628
|
"Aguardando pagamento\u2026"
|
|
3553
3629
|
] }),
|
|
3554
|
-
/* @__PURE__ */
|
|
3630
|
+
/* @__PURE__ */ jsx29("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." })
|
|
3555
3631
|
] });
|
|
3556
3632
|
}
|
|
3557
3633
|
|
|
3558
3634
|
// src/hooks/useLoginForm.ts
|
|
3559
|
-
import { useCallback as useCallback7, useMemo as useMemo7, useState as
|
|
3560
|
-
import { useHook as
|
|
3635
|
+
import { useCallback as useCallback7, useMemo as useMemo7, useState as useState12 } from "react";
|
|
3636
|
+
import { useHook as useHook13 } from "@hook-sdk/sdk";
|
|
3561
3637
|
var EMAIL_RE2 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
3562
3638
|
var MIN_PASSWORD = 8;
|
|
3563
3639
|
function useLoginForm() {
|
|
3564
|
-
const { auth } =
|
|
3565
|
-
const [email, setEmail] =
|
|
3566
|
-
const [password, setPassword] =
|
|
3567
|
-
const [submitting, setSubmitting] =
|
|
3568
|
-
const [error, setError] =
|
|
3569
|
-
const [touchedEmail, setTouchedEmail] =
|
|
3570
|
-
const [touchedPassword, setTouchedPassword] =
|
|
3571
|
-
const [formSubmitAttempted, setFormSubmitAttempted] =
|
|
3640
|
+
const { auth } = useHook13();
|
|
3641
|
+
const [email, setEmail] = useState12("");
|
|
3642
|
+
const [password, setPassword] = useState12("");
|
|
3643
|
+
const [submitting, setSubmitting] = useState12(false);
|
|
3644
|
+
const [error, setError] = useState12(null);
|
|
3645
|
+
const [touchedEmail, setTouchedEmail] = useState12(false);
|
|
3646
|
+
const [touchedPassword, setTouchedPassword] = useState12(false);
|
|
3647
|
+
const [formSubmitAttempted, setFormSubmitAttempted] = useState12(false);
|
|
3572
3648
|
const validateEmail = useMemo7(() => {
|
|
3573
3649
|
if (email.length === 0) return null;
|
|
3574
3650
|
if (!EMAIL_RE2.test(email)) return "Formato de e-mail inv\xE1lido.";
|
|
@@ -3616,21 +3692,21 @@ function useLoginForm() {
|
|
|
3616
3692
|
}
|
|
3617
3693
|
|
|
3618
3694
|
// src/hooks/useSignupForm.ts
|
|
3619
|
-
import { useCallback as useCallback8, useMemo as useMemo8, useState as
|
|
3620
|
-
import { useHook as
|
|
3695
|
+
import { useCallback as useCallback8, useMemo as useMemo8, useState as useState13 } from "react";
|
|
3696
|
+
import { useHook as useHook14 } from "@hook-sdk/sdk";
|
|
3621
3697
|
var EMAIL_RE3 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
3622
3698
|
var MIN_PASSWORD2 = 8;
|
|
3623
3699
|
function useSignupForm() {
|
|
3624
|
-
const { auth } =
|
|
3625
|
-
const [name, setName] =
|
|
3626
|
-
const [email, setEmail] =
|
|
3627
|
-
const [password, setPassword] =
|
|
3628
|
-
const [submitting, setSubmitting] =
|
|
3629
|
-
const [error, setError] =
|
|
3630
|
-
const [touchedName, setTouchedName] =
|
|
3631
|
-
const [touchedEmail, setTouchedEmail] =
|
|
3632
|
-
const [touchedPassword, setTouchedPassword] =
|
|
3633
|
-
const [formSubmitAttempted, setFormSubmitAttempted] =
|
|
3700
|
+
const { auth } = useHook14();
|
|
3701
|
+
const [name, setName] = useState13("");
|
|
3702
|
+
const [email, setEmail] = useState13("");
|
|
3703
|
+
const [password, setPassword] = useState13("");
|
|
3704
|
+
const [submitting, setSubmitting] = useState13(false);
|
|
3705
|
+
const [error, setError] = useState13(null);
|
|
3706
|
+
const [touchedName, setTouchedName] = useState13(false);
|
|
3707
|
+
const [touchedEmail, setTouchedEmail] = useState13(false);
|
|
3708
|
+
const [touchedPassword, setTouchedPassword] = useState13(false);
|
|
3709
|
+
const [formSubmitAttempted, setFormSubmitAttempted] = useState13(false);
|
|
3634
3710
|
const validateName = useMemo8(() => {
|
|
3635
3711
|
if (name.length === 0) return null;
|
|
3636
3712
|
if (name.trim().length < 2) return "Nome muito curto.";
|
|
@@ -3688,17 +3764,17 @@ function useSignupForm() {
|
|
|
3688
3764
|
}
|
|
3689
3765
|
|
|
3690
3766
|
// src/hooks/useForgotForm.ts
|
|
3691
|
-
import { useCallback as useCallback9, useMemo as useMemo9, useState as
|
|
3692
|
-
import { useHook as
|
|
3767
|
+
import { useCallback as useCallback9, useMemo as useMemo9, useState as useState14 } from "react";
|
|
3768
|
+
import { useHook as useHook15 } from "@hook-sdk/sdk";
|
|
3693
3769
|
var EMAIL_RE4 = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
3694
3770
|
function useForgotForm() {
|
|
3695
|
-
const { auth } =
|
|
3696
|
-
const [email, setEmail] =
|
|
3697
|
-
const [submitting, setSubmitting] =
|
|
3698
|
-
const [sent, setSent] =
|
|
3699
|
-
const [error, setError] =
|
|
3700
|
-
const [touchedEmail, setTouchedEmail] =
|
|
3701
|
-
const [formSubmitAttempted, setFormSubmitAttempted] =
|
|
3771
|
+
const { auth } = useHook15();
|
|
3772
|
+
const [email, setEmail] = useState14("");
|
|
3773
|
+
const [submitting, setSubmitting] = useState14(false);
|
|
3774
|
+
const [sent, setSent] = useState14(false);
|
|
3775
|
+
const [error, setError] = useState14(null);
|
|
3776
|
+
const [touchedEmail, setTouchedEmail] = useState14(false);
|
|
3777
|
+
const [formSubmitAttempted, setFormSubmitAttempted] = useState14(false);
|
|
3702
3778
|
const validateEmail = useMemo9(() => {
|
|
3703
3779
|
if (email.length === 0) return null;
|
|
3704
3780
|
if (!EMAIL_RE4.test(email)) return "Formato de e-mail inv\xE1lido.";
|
|
@@ -3737,20 +3813,20 @@ function useForgotForm() {
|
|
|
3737
3813
|
}
|
|
3738
3814
|
|
|
3739
3815
|
// src/hooks/useResetForm.ts
|
|
3740
|
-
import { useCallback as useCallback10, useEffect as useEffect13, useMemo as useMemo10, useState as
|
|
3741
|
-
import { useHook as
|
|
3742
|
-
var MIN_PASSWORD3 =
|
|
3816
|
+
import { useCallback as useCallback10, useEffect as useEffect13, useMemo as useMemo10, useState as useState15 } from "react";
|
|
3817
|
+
import { useHook as useHook16 } from "@hook-sdk/sdk";
|
|
3818
|
+
var MIN_PASSWORD3 = 8;
|
|
3743
3819
|
function useResetForm() {
|
|
3744
|
-
const { auth } =
|
|
3745
|
-
const [token, setToken] =
|
|
3746
|
-
const [password, setPassword] =
|
|
3747
|
-
const [confirm, setConfirm] =
|
|
3748
|
-
const [submitting, setSubmitting] =
|
|
3749
|
-
const [done, setDone] =
|
|
3750
|
-
const [error, setError] =
|
|
3751
|
-
const [touchedPassword, setTouchedPassword] =
|
|
3752
|
-
const [touchedConfirm, setTouchedConfirm] =
|
|
3753
|
-
const [formSubmitAttempted, setFormSubmitAttempted] =
|
|
3820
|
+
const { auth } = useHook16();
|
|
3821
|
+
const [token, setToken] = useState15(null);
|
|
3822
|
+
const [password, setPassword] = useState15("");
|
|
3823
|
+
const [confirm, setConfirm] = useState15("");
|
|
3824
|
+
const [submitting, setSubmitting] = useState15(false);
|
|
3825
|
+
const [done, setDone] = useState15(false);
|
|
3826
|
+
const [error, setError] = useState15(null);
|
|
3827
|
+
const [touchedPassword, setTouchedPassword] = useState15(false);
|
|
3828
|
+
const [touchedConfirm, setTouchedConfirm] = useState15(false);
|
|
3829
|
+
const [formSubmitAttempted, setFormSubmitAttempted] = useState15(false);
|
|
3754
3830
|
useEffect13(() => {
|
|
3755
3831
|
if (typeof window === "undefined") return;
|
|
3756
3832
|
const params = new URLSearchParams(window.location.search);
|
|
@@ -3839,10 +3915,10 @@ function discountPercent(anchorCents, realCents) {
|
|
|
3839
3915
|
|
|
3840
3916
|
// src/hooks/useAuthPrimitives.ts
|
|
3841
3917
|
import { useEffect as useEffect14 } from "react";
|
|
3842
|
-
import { useHook as
|
|
3918
|
+
import { useHook as useHook17 } from "@hook-sdk/sdk";
|
|
3843
3919
|
var warned = false;
|
|
3844
3920
|
function useAuthPrimitives() {
|
|
3845
|
-
const { auth } =
|
|
3921
|
+
const { auth } = useHook17();
|
|
3846
3922
|
useEffect14(() => {
|
|
3847
3923
|
if (!warned && process.env.NODE_ENV !== "production") {
|
|
3848
3924
|
warned = true;
|
|
@@ -3865,9 +3941,9 @@ function useAuthPrimitives() {
|
|
|
3865
3941
|
}
|
|
3866
3942
|
|
|
3867
3943
|
// src/hooks/useAuth.ts
|
|
3868
|
-
import { useHook as
|
|
3944
|
+
import { useHook as useHook18 } from "@hook-sdk/sdk";
|
|
3869
3945
|
function useAuth() {
|
|
3870
|
-
const { user, authStatus, auth } =
|
|
3946
|
+
const { user, authStatus, auth } = useHook18();
|
|
3871
3947
|
return {
|
|
3872
3948
|
user,
|
|
3873
3949
|
authStatus,
|
|
@@ -3879,22 +3955,22 @@ function useAuth() {
|
|
|
3879
3955
|
import { useTrackOnboardingStep } from "@hook-sdk/sdk";
|
|
3880
3956
|
|
|
3881
3957
|
// src/hooks/useSubscription.ts
|
|
3882
|
-
import { useHook as
|
|
3958
|
+
import { useHook as useHook19 } from "@hook-sdk/sdk";
|
|
3883
3959
|
function useSubscription() {
|
|
3884
|
-
const { subscription } =
|
|
3960
|
+
const { subscription } = useHook19();
|
|
3885
3961
|
return {
|
|
3886
3962
|
status: subscription.status()
|
|
3887
3963
|
};
|
|
3888
3964
|
}
|
|
3889
3965
|
|
|
3890
3966
|
// src/hooks/useReminders.ts
|
|
3891
|
-
import { useCallback as useCallback11, useEffect as useEffect15, useState as
|
|
3892
|
-
import { useHook as
|
|
3967
|
+
import { useCallback as useCallback11, useEffect as useEffect15, useState as useState16 } from "react";
|
|
3968
|
+
import { useHook as useHook20 } from "@hook-sdk/sdk";
|
|
3893
3969
|
function useReminders() {
|
|
3894
|
-
const { push } =
|
|
3970
|
+
const { push } = useHook20();
|
|
3895
3971
|
const r = push.reminders;
|
|
3896
|
-
const [reminders, setReminders] =
|
|
3897
|
-
const [loading, setLoading] =
|
|
3972
|
+
const [reminders, setReminders] = useState16([]);
|
|
3973
|
+
const [loading, setLoading] = useState16(true);
|
|
3898
3974
|
const reload = useCallback11(async () => {
|
|
3899
3975
|
setLoading(true);
|
|
3900
3976
|
try {
|
|
@@ -3925,9 +4001,9 @@ function useReminders() {
|
|
|
3925
4001
|
}
|
|
3926
4002
|
|
|
3927
4003
|
// src/hooks/useToast.ts
|
|
3928
|
-
import { useCallback as useCallback12, useState as
|
|
4004
|
+
import { useCallback as useCallback12, useState as useState17 } from "react";
|
|
3929
4005
|
function useToast() {
|
|
3930
|
-
const [items, setItems] =
|
|
4006
|
+
const [items, setItems] = useState17([]);
|
|
3931
4007
|
const show = useCallback12((message, kind = "info") => {
|
|
3932
4008
|
const id = `${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
|
|
3933
4009
|
setItems((prev) => [...prev, { id, message, kind }]);
|
|
@@ -3943,20 +4019,20 @@ function useToast() {
|
|
|
3943
4019
|
|
|
3944
4020
|
// src/RouteBoundary.tsx
|
|
3945
4021
|
import { Routes as Routes2, Route as Route2 } from "react-router-dom";
|
|
3946
|
-
import { jsx as
|
|
4022
|
+
import { jsx as jsx30, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
3947
4023
|
function RouteBoundary({ children }) {
|
|
3948
|
-
return /* @__PURE__ */
|
|
4024
|
+
return /* @__PURE__ */ jsxs21(Routes2, { children: [
|
|
3949
4025
|
children,
|
|
3950
|
-
/* @__PURE__ */
|
|
4026
|
+
/* @__PURE__ */ jsx30(Route2, { path: "*", element: /* @__PURE__ */ jsx30(DefaultNotFound, {}) })
|
|
3951
4027
|
] });
|
|
3952
4028
|
}
|
|
3953
4029
|
function DefaultNotFound() {
|
|
3954
|
-
return /* @__PURE__ */
|
|
4030
|
+
return /* @__PURE__ */ jsx30("div", { role: "alert", children: "P\xE1gina n\xE3o encontrada" });
|
|
3955
4031
|
}
|
|
3956
4032
|
|
|
3957
4033
|
// src/PreAuthShell.tsx
|
|
3958
4034
|
import { BrowserRouter as BrowserRouter2, MemoryRouter as MemoryRouter2, Routes as Routes3 } from "react-router-dom";
|
|
3959
|
-
import { jsx as
|
|
4035
|
+
import { jsx as jsx31 } from "react/jsx-runtime";
|
|
3960
4036
|
function PreAuthShell({
|
|
3961
4037
|
basename,
|
|
3962
4038
|
testRouter,
|
|
@@ -3964,14 +4040,14 @@ function PreAuthShell({
|
|
|
3964
4040
|
children
|
|
3965
4041
|
}) {
|
|
3966
4042
|
if (testRouter === "memory") {
|
|
3967
|
-
return /* @__PURE__ */
|
|
4043
|
+
return /* @__PURE__ */ jsx31(MemoryRouter2, { basename, initialEntries: testInitialEntries, children: /* @__PURE__ */ jsx31(Routes3, { children }) });
|
|
3968
4044
|
}
|
|
3969
|
-
return /* @__PURE__ */
|
|
4045
|
+
return /* @__PURE__ */ jsx31(BrowserRouter2, { basename, children: /* @__PURE__ */ jsx31(Routes3, { children }) });
|
|
3970
4046
|
}
|
|
3971
4047
|
|
|
3972
4048
|
// src/OnboardingFlow.tsx
|
|
3973
4049
|
import { useCallback as useCallback13, useEffect as useEffect16, useMemo as useMemo11, useRef as useRef7 } from "react";
|
|
3974
|
-
import { usePersistedState as usePersistedState4, useHook as
|
|
4050
|
+
import { usePersistedState as usePersistedState4, useHook as useHook21 } from "@hook-sdk/sdk";
|
|
3975
4051
|
|
|
3976
4052
|
// src/hooks/useOnboardingStep.ts
|
|
3977
4053
|
import { createContext as createContext3, useContext as useContext4 } from "react";
|
|
@@ -3987,7 +4063,7 @@ function useOnboardingStep() {
|
|
|
3987
4063
|
}
|
|
3988
4064
|
|
|
3989
4065
|
// src/OnboardingFlow.tsx
|
|
3990
|
-
import { jsx as
|
|
4066
|
+
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
3991
4067
|
var isFilled = (v) => v != null && v !== "";
|
|
3992
4068
|
var CURRENT_STEP_FIELD = "currentStep";
|
|
3993
4069
|
function readPersistedStepIdx(draft) {
|
|
@@ -4023,7 +4099,7 @@ function OnboardingFlow({
|
|
|
4023
4099
|
[setDraft]
|
|
4024
4100
|
);
|
|
4025
4101
|
const step = steps[clampedIdx];
|
|
4026
|
-
const hookCtx =
|
|
4102
|
+
const hookCtx = useHook21();
|
|
4027
4103
|
const track2 = typeof hookCtx.track === "function" ? hookCtx.track : void 0;
|
|
4028
4104
|
useEffect16(() => {
|
|
4029
4105
|
if (status.loading) return;
|
|
@@ -4077,7 +4153,7 @@ function OnboardingFlow({
|
|
|
4077
4153
|
`[hook-template] OnboardingFlow: missing screen component for step '${step.id}' (expected key '${step.screen}' in screens prop)`
|
|
4078
4154
|
);
|
|
4079
4155
|
}
|
|
4080
|
-
return /* @__PURE__ */
|
|
4156
|
+
return /* @__PURE__ */ jsx32(OnboardingStepContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx32(Screen, {}) });
|
|
4081
4157
|
}
|
|
4082
4158
|
|
|
4083
4159
|
// src/hooks/useFeature.ts
|
|
@@ -4088,15 +4164,15 @@ function useFeature(name) {
|
|
|
4088
4164
|
|
|
4089
4165
|
// src/components/paywall/Paywall.tsx
|
|
4090
4166
|
import { useEffect as useEffect17, useMemo as useMemo12 } from "react";
|
|
4091
|
-
import { useHook as
|
|
4167
|
+
import { useHook as useHook22 } from "@hook-sdk/sdk";
|
|
4092
4168
|
|
|
4093
4169
|
// src/components/paywall/PaywallProvider.tsx
|
|
4094
4170
|
import { createContext as createContext4 } from "react";
|
|
4095
|
-
import { jsx as
|
|
4171
|
+
import { jsx as jsx33 } from "react/jsx-runtime";
|
|
4096
4172
|
var PaywallContext = createContext4(null);
|
|
4097
4173
|
function PaywallProvider({ children }) {
|
|
4098
4174
|
const state = usePaywallState();
|
|
4099
|
-
return /* @__PURE__ */
|
|
4175
|
+
return /* @__PURE__ */ jsx33(PaywallContext.Provider, { value: state, children });
|
|
4100
4176
|
}
|
|
4101
4177
|
|
|
4102
4178
|
// src/components/paywall/usePaywallContext.ts
|
|
@@ -4110,7 +4186,7 @@ function usePaywallContext() {
|
|
|
4110
4186
|
}
|
|
4111
4187
|
|
|
4112
4188
|
// src/components/paywall/PaywallMethodTabs.tsx
|
|
4113
|
-
import { jsx as
|
|
4189
|
+
import { jsx as jsx34 } from "react/jsx-runtime";
|
|
4114
4190
|
function PaywallMethodTabs({
|
|
4115
4191
|
labels,
|
|
4116
4192
|
className,
|
|
@@ -4119,10 +4195,10 @@ function PaywallMethodTabs({
|
|
|
4119
4195
|
}) {
|
|
4120
4196
|
const { methods, selectedMethod, selectMethod } = usePaywallContext();
|
|
4121
4197
|
if (methods.length < 2) return null;
|
|
4122
|
-
return /* @__PURE__ */
|
|
4198
|
+
return /* @__PURE__ */ jsx34("div", { role: "tablist", "aria-label": "M\xE9todo de pagamento", className, children: methods.map((m) => {
|
|
4123
4199
|
const active = m === selectedMethod;
|
|
4124
4200
|
const label = labels[m] ?? m;
|
|
4125
|
-
return /* @__PURE__ */
|
|
4201
|
+
return /* @__PURE__ */ jsx34(
|
|
4126
4202
|
"button",
|
|
4127
4203
|
{
|
|
4128
4204
|
type: "button",
|
|
@@ -4140,16 +4216,16 @@ function PaywallMethodTabs({
|
|
|
4140
4216
|
}
|
|
4141
4217
|
|
|
4142
4218
|
// src/components/paywall/PaywallMethodContent.tsx
|
|
4143
|
-
import { jsx as
|
|
4219
|
+
import { jsx as jsx35 } from "react/jsx-runtime";
|
|
4144
4220
|
function PaywallMethodContent({ copy, className, rowClassName }) {
|
|
4145
4221
|
const { selectedMethod, hasConsumedTrial } = usePaywallContext();
|
|
4146
4222
|
const useCardConsumed = selectedMethod === "card" && hasConsumedTrial && copy.cardConsumedTrial;
|
|
4147
4223
|
const rows = useCardConsumed ? copy.cardConsumedTrial.bodyRows : selectedMethod === "pix-auto" || selectedMethod === "pix-once" ? copy.pix.bodyRows : copy.card.bodyRows;
|
|
4148
|
-
return /* @__PURE__ */
|
|
4224
|
+
return /* @__PURE__ */ jsx35("div", { role: "tabpanel", id: `paywall-tab-${selectedMethod}`, className, children: rows.map((row, i) => /* @__PURE__ */ jsx35("div", { className: rowClassName, children: row }, i)) });
|
|
4149
4225
|
}
|
|
4150
4226
|
|
|
4151
4227
|
// src/components/paywall/PaywallCyclePicker.tsx
|
|
4152
|
-
import { jsx as
|
|
4228
|
+
import { jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
4153
4229
|
var VARIANT_CLASSES = {
|
|
4154
4230
|
default: { card: "", cardSelected: "" },
|
|
4155
4231
|
"premium-gold": {
|
|
@@ -4174,7 +4250,7 @@ function PaywallCyclePicker({
|
|
|
4174
4250
|
const { cycle: selected, setCycle, plan, anchorPriceCents } = ctx;
|
|
4175
4251
|
const cycles = ["MONTHLY", "YEARLY"];
|
|
4176
4252
|
if (render) {
|
|
4177
|
-
return /* @__PURE__ */
|
|
4253
|
+
return /* @__PURE__ */ jsx36("div", { className, children: render({ cycles, selected, setCycle, plan, anchorPriceCents }) });
|
|
4178
4254
|
}
|
|
4179
4255
|
if (cycles.length < 2) return null;
|
|
4180
4256
|
const v = VARIANT_CLASSES[variant];
|
|
@@ -4184,7 +4260,7 @@ function PaywallCyclePicker({
|
|
|
4184
4260
|
const yearlyCents = plan?.yearlyCents ?? 0;
|
|
4185
4261
|
const anchorMonthly = plan?.anchorMonthlyCents ?? null;
|
|
4186
4262
|
const anchorYearly = plan?.anchorYearlyCents ?? null;
|
|
4187
|
-
return /* @__PURE__ */
|
|
4263
|
+
return /* @__PURE__ */ jsx36(
|
|
4188
4264
|
"div",
|
|
4189
4265
|
{
|
|
4190
4266
|
role: "radiogroup",
|
|
@@ -4196,7 +4272,7 @@ function PaywallCyclePicker({
|
|
|
4196
4272
|
const suffix = c === "YEARLY" ? labels.annualSuffix : labels.monthlySuffix;
|
|
4197
4273
|
const mainCents = c === "YEARLY" ? Math.round(yearlyCents / 12) : monthlyCents;
|
|
4198
4274
|
const anchorCents = c === "YEARLY" ? anchorYearly : anchorMonthly;
|
|
4199
|
-
return /* @__PURE__ */
|
|
4275
|
+
return /* @__PURE__ */ jsxs22(
|
|
4200
4276
|
"button",
|
|
4201
4277
|
{
|
|
4202
4278
|
type: "button",
|
|
@@ -4209,10 +4285,10 @@ function PaywallCyclePicker({
|
|
|
4209
4285
|
active ? composedCardSelectedClassName : ""
|
|
4210
4286
|
].filter(Boolean).join(" "),
|
|
4211
4287
|
children: [
|
|
4212
|
-
/* @__PURE__ */
|
|
4213
|
-
/* @__PURE__ */
|
|
4214
|
-
/* @__PURE__ */
|
|
4215
|
-
anchorCents != null && anchorCents > mainCents ? /* @__PURE__ */
|
|
4288
|
+
/* @__PURE__ */ jsx36("span", { className: "font-bold text-base leading-tight", children: formatBRL(mainCents) }),
|
|
4289
|
+
/* @__PURE__ */ jsx36("span", { className: "text-xs opacity-70 leading-tight", children: suffix }),
|
|
4290
|
+
/* @__PURE__ */ jsx36("span", { className: "text-xs opacity-60 leading-tight", children: label }),
|
|
4291
|
+
anchorCents != null && anchorCents > mainCents ? /* @__PURE__ */ jsx36("span", { className: anchorClassName ?? "text-xs opacity-50", children: /* @__PURE__ */ jsx36("s", { children: formatBRL(anchorCents) }) }) : null
|
|
4216
4292
|
]
|
|
4217
4293
|
},
|
|
4218
4294
|
c
|
|
@@ -4223,7 +4299,7 @@ function PaywallCyclePicker({
|
|
|
4223
4299
|
}
|
|
4224
4300
|
|
|
4225
4301
|
// src/components/paywall/Paywall.tsx
|
|
4226
|
-
import { jsx as
|
|
4302
|
+
import { jsx as jsx37, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
4227
4303
|
var NBSP = "\xA0";
|
|
4228
4304
|
function Paywall({
|
|
4229
4305
|
copy,
|
|
@@ -4231,7 +4307,7 @@ function Paywall({
|
|
|
4231
4307
|
slots = {},
|
|
4232
4308
|
onBeforeCheckout
|
|
4233
4309
|
}) {
|
|
4234
|
-
return /* @__PURE__ */
|
|
4310
|
+
return /* @__PURE__ */ jsx37(PaywallProvider, { children: /* @__PURE__ */ jsx37(
|
|
4235
4311
|
PaywallInner,
|
|
4236
4312
|
{
|
|
4237
4313
|
copy,
|
|
@@ -4247,7 +4323,7 @@ function PaywallInner({
|
|
|
4247
4323
|
slots = {},
|
|
4248
4324
|
onBeforeCheckout
|
|
4249
4325
|
}) {
|
|
4250
|
-
const { track: track2 } =
|
|
4326
|
+
const { track: track2 } = useHook22();
|
|
4251
4327
|
const s = usePaywallContext();
|
|
4252
4328
|
const priceLabel = formatBRL(s.currentPriceCents).replace(new RegExp(NBSP, "g"), " ");
|
|
4253
4329
|
const trialDaysCardLabel = String(s.trialDaysCard);
|
|
@@ -4304,15 +4380,15 @@ function PaywallInner({
|
|
|
4304
4380
|
await s.submit();
|
|
4305
4381
|
};
|
|
4306
4382
|
const ctaTheme = s.selectedMethod === "card" ? themeClasses.ctaCard : themeClasses.ctaPix;
|
|
4307
|
-
return /* @__PURE__ */
|
|
4383
|
+
return /* @__PURE__ */ jsxs23("div", { className: themeClasses.container, children: [
|
|
4308
4384
|
slots.heroSlot,
|
|
4309
|
-
/* @__PURE__ */
|
|
4310
|
-
/* @__PURE__ */
|
|
4385
|
+
/* @__PURE__ */ jsx37("h1", { className: themeClasses.headline, children: copy.headline }),
|
|
4386
|
+
/* @__PURE__ */ jsx37("ul", { children: copy.features.map((f) => /* @__PURE__ */ jsxs23("li", { className: themeClasses.feature, children: [
|
|
4311
4387
|
"\u2713 ",
|
|
4312
|
-
/* @__PURE__ */
|
|
4388
|
+
/* @__PURE__ */ jsx37("span", { children: f })
|
|
4313
4389
|
] }, f)) }),
|
|
4314
|
-
copy.socialProof ? /* @__PURE__ */
|
|
4315
|
-
slots.cyclePickerSlot ?? /* @__PURE__ */
|
|
4390
|
+
copy.socialProof ? /* @__PURE__ */ jsx37("p", { className: themeClasses.socialProof, children: copy.socialProof }) : null,
|
|
4391
|
+
slots.cyclePickerSlot ?? /* @__PURE__ */ jsx37(
|
|
4316
4392
|
PaywallCyclePicker,
|
|
4317
4393
|
{
|
|
4318
4394
|
labels: copy.cycle,
|
|
@@ -4321,7 +4397,7 @@ function PaywallInner({
|
|
|
4321
4397
|
anchorClassName: themeClasses.anchorPrice
|
|
4322
4398
|
}
|
|
4323
4399
|
),
|
|
4324
|
-
/* @__PURE__ */
|
|
4400
|
+
/* @__PURE__ */ jsx37(
|
|
4325
4401
|
PaywallMethodTabs,
|
|
4326
4402
|
{
|
|
4327
4403
|
labels: { "pix-auto": copy.pix.tabLabel, card: copy.card.tabLabel },
|
|
@@ -4330,7 +4406,7 @@ function PaywallInner({
|
|
|
4330
4406
|
tabActiveClassName: themeClasses.tabActive
|
|
4331
4407
|
}
|
|
4332
4408
|
),
|
|
4333
|
-
/* @__PURE__ */
|
|
4409
|
+
/* @__PURE__ */ jsx37(
|
|
4334
4410
|
PaywallMethodContent,
|
|
4335
4411
|
{
|
|
4336
4412
|
copy: {
|
|
@@ -4348,8 +4424,8 @@ function PaywallInner({
|
|
|
4348
4424
|
}
|
|
4349
4425
|
),
|
|
4350
4426
|
slots.beforeCtaSlot,
|
|
4351
|
-
/* @__PURE__ */
|
|
4352
|
-
/* @__PURE__ */
|
|
4427
|
+
/* @__PURE__ */ jsxs23("div", { children: [
|
|
4428
|
+
/* @__PURE__ */ jsx37(
|
|
4353
4429
|
"button",
|
|
4354
4430
|
{
|
|
4355
4431
|
type: "button",
|
|
@@ -4361,8 +4437,8 @@ function PaywallInner({
|
|
|
4361
4437
|
children: s.submitting ? "Abrindo checkout\u2026" : ctaLabel
|
|
4362
4438
|
}
|
|
4363
4439
|
),
|
|
4364
|
-
switchHint ? /* @__PURE__ */
|
|
4365
|
-
/* @__PURE__ */
|
|
4440
|
+
switchHint ? /* @__PURE__ */ jsx37("p", { className: themeClasses.switchHint, children: switchHint }) : null,
|
|
4441
|
+
/* @__PURE__ */ jsx37("p", { className: themeClasses.trustLine, children: copy.trustLine })
|
|
4366
4442
|
] })
|
|
4367
4443
|
] });
|
|
4368
4444
|
}
|
|
@@ -4379,7 +4455,7 @@ function interpolateCopy(m, price, days) {
|
|
|
4379
4455
|
}
|
|
4380
4456
|
|
|
4381
4457
|
// src/components/paywall/PaywallCta.tsx
|
|
4382
|
-
import { jsx as
|
|
4458
|
+
import { jsx as jsx38, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
4383
4459
|
function PaywallCta({
|
|
4384
4460
|
ctaLabel,
|
|
4385
4461
|
loadingLabel,
|
|
@@ -4392,8 +4468,8 @@ function PaywallCta({
|
|
|
4392
4468
|
}) {
|
|
4393
4469
|
const { submit, submitting } = usePaywallContext();
|
|
4394
4470
|
const label = submitting && loadingLabel ? loadingLabel : ctaLabel;
|
|
4395
|
-
return /* @__PURE__ */
|
|
4396
|
-
/* @__PURE__ */
|
|
4471
|
+
return /* @__PURE__ */ jsxs24("div", { className, children: [
|
|
4472
|
+
/* @__PURE__ */ jsx38(
|
|
4397
4473
|
"button",
|
|
4398
4474
|
{
|
|
4399
4475
|
type: "button",
|
|
@@ -4405,20 +4481,20 @@ function PaywallCta({
|
|
|
4405
4481
|
children: label
|
|
4406
4482
|
}
|
|
4407
4483
|
),
|
|
4408
|
-
switchHint ? /* @__PURE__ */
|
|
4409
|
-
/* @__PURE__ */
|
|
4484
|
+
switchHint ? /* @__PURE__ */ jsx38("p", { className: switchHintClassName, children: switchHint }) : null,
|
|
4485
|
+
/* @__PURE__ */ jsx38("p", { className: trustClassName, children: trustLine })
|
|
4410
4486
|
] });
|
|
4411
4487
|
}
|
|
4412
4488
|
|
|
4413
4489
|
// src/components/paywall/blocks/PaywallEyebrow.tsx
|
|
4414
|
-
import { jsx as
|
|
4490
|
+
import { jsx as jsx39 } from "react/jsx-runtime";
|
|
4415
4491
|
var DEFAULT_EYEBROW_CLASSES = "text-xs uppercase tracking-widest font-semibold opacity-70";
|
|
4416
4492
|
function PaywallEyebrow({ text, className }) {
|
|
4417
|
-
return /* @__PURE__ */
|
|
4493
|
+
return /* @__PURE__ */ jsx39("div", { className: [DEFAULT_EYEBROW_CLASSES, className].filter(Boolean).join(" "), children: text });
|
|
4418
4494
|
}
|
|
4419
4495
|
|
|
4420
4496
|
// src/components/paywall/blocks/PaywallHero.tsx
|
|
4421
|
-
import { jsx as
|
|
4497
|
+
import { jsx as jsx40, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
4422
4498
|
var DEFAULT_GRADIENT = "absolute inset-0 bg-gradient-to-t from-black/70 via-black/20 to-transparent";
|
|
4423
4499
|
function PaywallHero({
|
|
4424
4500
|
src,
|
|
@@ -4432,15 +4508,15 @@ function PaywallHero({
|
|
|
4432
4508
|
render
|
|
4433
4509
|
}) {
|
|
4434
4510
|
if (render) {
|
|
4435
|
-
return /* @__PURE__ */
|
|
4511
|
+
return /* @__PURE__ */ jsx40("div", { className, children: render({ src, headline }) });
|
|
4436
4512
|
}
|
|
4437
|
-
return /* @__PURE__ */
|
|
4513
|
+
return /* @__PURE__ */ jsxs25(
|
|
4438
4514
|
"div",
|
|
4439
4515
|
{
|
|
4440
4516
|
className: ["relative overflow-hidden", className].filter(Boolean).join(" "),
|
|
4441
4517
|
style: { aspectRatio },
|
|
4442
4518
|
children: [
|
|
4443
|
-
/* @__PURE__ */
|
|
4519
|
+
/* @__PURE__ */ jsx40(
|
|
4444
4520
|
"img",
|
|
4445
4521
|
{
|
|
4446
4522
|
src,
|
|
@@ -4448,8 +4524,8 @@ function PaywallHero({
|
|
|
4448
4524
|
className: ["absolute inset-0 w-full h-full object-cover", imgClassName].filter(Boolean).join(" ")
|
|
4449
4525
|
}
|
|
4450
4526
|
),
|
|
4451
|
-
/* @__PURE__ */
|
|
4452
|
-
headline ? /* @__PURE__ */
|
|
4527
|
+
/* @__PURE__ */ jsx40("div", { className: gradientClassName ?? DEFAULT_GRADIENT, "aria-hidden": "true" }),
|
|
4528
|
+
headline ? /* @__PURE__ */ jsx40(
|
|
4453
4529
|
"h1",
|
|
4454
4530
|
{
|
|
4455
4531
|
className: ["absolute bottom-0 left-0 right-0 p-4 text-white font-bold text-2xl", headlineClassName].filter(Boolean).join(" "),
|
|
@@ -4462,15 +4538,15 @@ function PaywallHero({
|
|
|
4462
4538
|
}
|
|
4463
4539
|
|
|
4464
4540
|
// src/components/paywall/blocks/PaywallHeadline.tsx
|
|
4465
|
-
import { jsx as
|
|
4541
|
+
import { jsx as jsx41 } from "react/jsx-runtime";
|
|
4466
4542
|
var DEFAULT_HEADLINE_CLASSES = "text-2xl font-bold leading-tight";
|
|
4467
4543
|
function PaywallHeadline({ text, className, as = "h1" }) {
|
|
4468
4544
|
const Tag = as;
|
|
4469
|
-
return /* @__PURE__ */
|
|
4545
|
+
return /* @__PURE__ */ jsx41(Tag, { className: [DEFAULT_HEADLINE_CLASSES, className].filter(Boolean).join(" "), children: text });
|
|
4470
4546
|
}
|
|
4471
4547
|
|
|
4472
4548
|
// src/components/paywall/blocks/PaywallPriceHeadline.tsx
|
|
4473
|
-
import { jsx as
|
|
4549
|
+
import { jsx as jsx42 } from "react/jsx-runtime";
|
|
4474
4550
|
var DEFAULT_CLASS = "text-2xl font-bold leading-tight";
|
|
4475
4551
|
var CYCLE_LABEL = {
|
|
4476
4552
|
MONTHLY: "mensal",
|
|
@@ -4490,16 +4566,16 @@ function PaywallPriceHeadline({
|
|
|
4490
4566
|
const rootClasses = [DEFAULT_CLASS, className].filter(Boolean).join(" ");
|
|
4491
4567
|
if (render) {
|
|
4492
4568
|
const RootTag2 = as;
|
|
4493
|
-
return /* @__PURE__ */
|
|
4569
|
+
return /* @__PURE__ */ jsx42(RootTag2, { className: [className].filter(Boolean).join(" ") || void 0, children: render({ pricePerDay, currentMonthlyEquivCents: monthlyEquiv, cycle }) });
|
|
4494
4570
|
}
|
|
4495
4571
|
const text = template.replaceAll("{pricePerDay}", pricePerDay).replaceAll("{currentMonthlyEquiv}", formatBRL(monthlyEquiv)).replaceAll("{cycle}", cycleLabel);
|
|
4496
4572
|
const RootTag = as;
|
|
4497
|
-
return /* @__PURE__ */
|
|
4573
|
+
return /* @__PURE__ */ jsx42(RootTag, { className: rootClasses, children: text });
|
|
4498
4574
|
}
|
|
4499
4575
|
|
|
4500
4576
|
// src/components/paywall/blocks/PaywallCountdown.tsx
|
|
4501
|
-
import { useEffect as useEffect18, useRef as useRef8, useState as
|
|
4502
|
-
import { jsx as
|
|
4577
|
+
import { useEffect as useEffect18, useRef as useRef8, useState as useState18 } from "react";
|
|
4578
|
+
import { jsx as jsx43 } from "react/jsx-runtime";
|
|
4503
4579
|
var DEFAULT_COUNTDOWN_CLASSES = "font-mono tabular-nums";
|
|
4504
4580
|
function resolveDeadlineMs(deadline) {
|
|
4505
4581
|
if (deadline instanceof Date) return deadline.getTime();
|
|
@@ -4540,7 +4616,7 @@ function PaywallCountdown({
|
|
|
4540
4616
|
if (deadlineMsRef.current === null) {
|
|
4541
4617
|
deadlineMsRef.current = resolveDeadlineMs(deadline);
|
|
4542
4618
|
}
|
|
4543
|
-
const [state, setState] =
|
|
4619
|
+
const [state, setState] = useState18(() => computeRemaining(deadlineMsRef.current));
|
|
4544
4620
|
const expiredCalledRef = useRef8(false);
|
|
4545
4621
|
useEffect18(() => {
|
|
4546
4622
|
if (state.expired) {
|
|
@@ -4562,14 +4638,14 @@ function PaywallCountdown({
|
|
|
4562
4638
|
return () => clearInterval(id);
|
|
4563
4639
|
}, [state.expired]);
|
|
4564
4640
|
if (render) {
|
|
4565
|
-
return /* @__PURE__ */
|
|
4641
|
+
return /* @__PURE__ */ jsx43("div", { className, children: render(state) });
|
|
4566
4642
|
}
|
|
4567
4643
|
const formatted = format === "h:m:s" ? `${pad(state.h)}:${pad(state.m)}:${pad(state.s)}` : `${pad(state.h * 60 + state.m)}:${pad(state.s)}`;
|
|
4568
|
-
return /* @__PURE__ */
|
|
4644
|
+
return /* @__PURE__ */ jsx43("div", { className: [DEFAULT_COUNTDOWN_CLASSES, className].filter(Boolean).join(" "), children: formatted });
|
|
4569
4645
|
}
|
|
4570
4646
|
|
|
4571
4647
|
// src/components/paywall/blocks/PaywallFeatures.tsx
|
|
4572
|
-
import { jsx as
|
|
4648
|
+
import { jsx as jsx44, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
4573
4649
|
function PaywallFeatures({
|
|
4574
4650
|
items,
|
|
4575
4651
|
IconComponent,
|
|
@@ -4580,19 +4656,19 @@ function PaywallFeatures({
|
|
|
4580
4656
|
renderItem
|
|
4581
4657
|
}) {
|
|
4582
4658
|
if (render) {
|
|
4583
|
-
return /* @__PURE__ */
|
|
4659
|
+
return /* @__PURE__ */ jsx44("div", { className, children: render({ items }) });
|
|
4584
4660
|
}
|
|
4585
4661
|
if (renderItem) {
|
|
4586
|
-
return /* @__PURE__ */
|
|
4662
|
+
return /* @__PURE__ */ jsx44("ul", { className, children: items.map((item, idx) => /* @__PURE__ */ jsx44("li", { children: renderItem(item, idx) }, idx)) });
|
|
4587
4663
|
}
|
|
4588
|
-
return /* @__PURE__ */
|
|
4589
|
-
IconComponent ? /* @__PURE__ */
|
|
4590
|
-
/* @__PURE__ */
|
|
4664
|
+
return /* @__PURE__ */ jsx44("ul", { className, children: items.map((item, idx) => /* @__PURE__ */ jsxs26("li", { className: itemClassName, children: [
|
|
4665
|
+
IconComponent ? /* @__PURE__ */ jsx44(IconComponent, { className: iconClassName }) : /* @__PURE__ */ jsx44("span", { className: iconClassName, "aria-hidden": "true", children: "\u2713" }),
|
|
4666
|
+
/* @__PURE__ */ jsx44("span", { children: item })
|
|
4591
4667
|
] }, idx)) });
|
|
4592
4668
|
}
|
|
4593
4669
|
|
|
4594
4670
|
// src/components/paywall/blocks/PaywallFeaturesCard.tsx
|
|
4595
|
-
import { jsx as
|
|
4671
|
+
import { jsx as jsx45, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
4596
4672
|
var DEFAULT_CARD_CLASSES = "rounded-xl border p-4";
|
|
4597
4673
|
function PaywallFeaturesCard({
|
|
4598
4674
|
title,
|
|
@@ -4603,20 +4679,20 @@ function PaywallFeaturesCard({
|
|
|
4603
4679
|
itemClassName,
|
|
4604
4680
|
renderItem
|
|
4605
4681
|
}) {
|
|
4606
|
-
return /* @__PURE__ */
|
|
4607
|
-
title ? /* @__PURE__ */
|
|
4608
|
-
/* @__PURE__ */
|
|
4609
|
-
(item, idx) => renderItem ? /* @__PURE__ */
|
|
4610
|
-
/* @__PURE__ */
|
|
4682
|
+
return /* @__PURE__ */ jsx45("div", { className, children: /* @__PURE__ */ jsxs27("div", { className: [DEFAULT_CARD_CLASSES, cardClassName].filter(Boolean).join(" "), children: [
|
|
4683
|
+
title ? /* @__PURE__ */ jsx45("div", { className: ["font-semibold mb-2", titleClassName].filter(Boolean).join(" "), children: title }) : null,
|
|
4684
|
+
/* @__PURE__ */ jsx45("ul", { children: items.map(
|
|
4685
|
+
(item, idx) => renderItem ? /* @__PURE__ */ jsx45("li", { children: renderItem(item, idx) }, idx) : /* @__PURE__ */ jsxs27("li", { className: itemClassName, children: [
|
|
4686
|
+
/* @__PURE__ */ jsx45("span", { "aria-hidden": "true", children: "\u2022" }),
|
|
4611
4687
|
" ",
|
|
4612
|
-
/* @__PURE__ */
|
|
4688
|
+
/* @__PURE__ */ jsx45("span", { children: item })
|
|
4613
4689
|
] }, idx)
|
|
4614
4690
|
) })
|
|
4615
4691
|
] }) });
|
|
4616
4692
|
}
|
|
4617
4693
|
|
|
4618
4694
|
// src/components/paywall/blocks/PaywallTrophyBadge.tsx
|
|
4619
|
-
import { jsx as
|
|
4695
|
+
import { jsx as jsx46, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
4620
4696
|
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";
|
|
4621
4697
|
var FLOATING_CLASSES = "absolute top-2 right-2 z-10 shadow-md";
|
|
4622
4698
|
function PaywallTrophyBadge({
|
|
@@ -4627,21 +4703,21 @@ function PaywallTrophyBadge({
|
|
|
4627
4703
|
render
|
|
4628
4704
|
}) {
|
|
4629
4705
|
if (render) {
|
|
4630
|
-
return /* @__PURE__ */
|
|
4706
|
+
return /* @__PURE__ */ jsx46("div", { className, children: render({ text }) });
|
|
4631
4707
|
}
|
|
4632
4708
|
const rootClasses = [
|
|
4633
4709
|
DEFAULT_CHIP_CLASSES,
|
|
4634
4710
|
floating ? FLOATING_CLASSES : "",
|
|
4635
4711
|
className
|
|
4636
4712
|
].filter(Boolean).join(" ");
|
|
4637
|
-
return /* @__PURE__ */
|
|
4638
|
-
/* @__PURE__ */
|
|
4639
|
-
/* @__PURE__ */
|
|
4713
|
+
return /* @__PURE__ */ jsxs28("div", { className: rootClasses, children: [
|
|
4714
|
+
/* @__PURE__ */ jsx46("span", { className: iconClassName, "aria-hidden": "true", children: "\u{1F3C6}" }),
|
|
4715
|
+
/* @__PURE__ */ jsx46("span", { children: text })
|
|
4640
4716
|
] });
|
|
4641
4717
|
}
|
|
4642
4718
|
|
|
4643
4719
|
// src/components/paywall/blocks/PaywallAnchorPrice.tsx
|
|
4644
|
-
import { jsx as
|
|
4720
|
+
import { jsx as jsx47 } from "react/jsx-runtime";
|
|
4645
4721
|
var DEFAULT_CLASS2 = "text-sm opacity-60 line-through";
|
|
4646
4722
|
function PaywallAnchorPrice({
|
|
4647
4723
|
className,
|
|
@@ -4655,13 +4731,13 @@ function PaywallAnchorPrice({
|
|
|
4655
4731
|
const formatted = formatBRL(anchorPriceCents);
|
|
4656
4732
|
const rootClasses = [DEFAULT_CLASS2, className].filter(Boolean).join(" ");
|
|
4657
4733
|
if (render) {
|
|
4658
|
-
return /* @__PURE__ */
|
|
4734
|
+
return /* @__PURE__ */ jsx47("span", { className: className || void 0, children: render({ anchorCents: anchorPriceCents, formatted }) });
|
|
4659
4735
|
}
|
|
4660
|
-
return /* @__PURE__ */
|
|
4736
|
+
return /* @__PURE__ */ jsx47("span", { className: rootClasses, children: formatted });
|
|
4661
4737
|
}
|
|
4662
4738
|
|
|
4663
4739
|
// src/components/paywall/blocks/PaywallTestimonials.tsx
|
|
4664
|
-
import { jsx as
|
|
4740
|
+
import { jsx as jsx48, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
4665
4741
|
var DEFAULT_ROOT = "flex gap-3 overflow-x-auto snap-x snap-mandatory pb-2";
|
|
4666
4742
|
var DEFAULT_CARD = "snap-start shrink-0 w-72 rounded-2xl border p-4 flex flex-col gap-2";
|
|
4667
4743
|
var DEFAULT_AVATAR = "w-10 h-10 rounded-full object-cover";
|
|
@@ -4687,13 +4763,13 @@ function PaywallTestimonials({
|
|
|
4687
4763
|
const quoteClasses = [DEFAULT_QUOTE, quoteClassName].filter(Boolean).join(" ");
|
|
4688
4764
|
const nameClasses = [DEFAULT_NAME, nameClassName].filter(Boolean).join(" ");
|
|
4689
4765
|
const starsClasses = [DEFAULT_STARS, starsClassName].filter(Boolean).join(" ");
|
|
4690
|
-
return /* @__PURE__ */
|
|
4766
|
+
return /* @__PURE__ */ jsx48("div", { className: rootClasses, children: items.map((item, idx) => {
|
|
4691
4767
|
if (renderItem) return renderItem(item, idx);
|
|
4692
4768
|
const filled = clampStars(item.stars);
|
|
4693
4769
|
const empty = 5 - filled;
|
|
4694
|
-
return /* @__PURE__ */
|
|
4695
|
-
/* @__PURE__ */
|
|
4696
|
-
item.avatar ? /* @__PURE__ */
|
|
4770
|
+
return /* @__PURE__ */ jsxs29("div", { className: cardClasses, children: [
|
|
4771
|
+
/* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-2", children: [
|
|
4772
|
+
item.avatar ? /* @__PURE__ */ jsx48(
|
|
4697
4773
|
"img",
|
|
4698
4774
|
{
|
|
4699
4775
|
src: item.avatar,
|
|
@@ -4703,19 +4779,19 @@ function PaywallTestimonials({
|
|
|
4703
4779
|
"aria-hidden": "true"
|
|
4704
4780
|
}
|
|
4705
4781
|
) : null,
|
|
4706
|
-
/* @__PURE__ */
|
|
4782
|
+
/* @__PURE__ */ jsx48("div", { className: nameClasses, children: item.name })
|
|
4707
4783
|
] }),
|
|
4708
|
-
/* @__PURE__ */
|
|
4784
|
+
/* @__PURE__ */ jsxs29("div", { className: starsClasses, "aria-label": `${filled} de 5 estrelas`, children: [
|
|
4709
4785
|
"\u2605".repeat(filled),
|
|
4710
4786
|
"\u2606".repeat(empty)
|
|
4711
4787
|
] }),
|
|
4712
|
-
/* @__PURE__ */
|
|
4788
|
+
/* @__PURE__ */ jsx48("p", { className: quoteClasses, children: item.quote })
|
|
4713
4789
|
] }, idx);
|
|
4714
4790
|
}) });
|
|
4715
4791
|
}
|
|
4716
4792
|
|
|
4717
4793
|
// src/components/paywall/blocks/PaywallStatsRow.tsx
|
|
4718
|
-
import { jsx as
|
|
4794
|
+
import { jsx as jsx49, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
4719
4795
|
var DEFAULT_ROOT2 = "grid grid-cols-3 gap-4";
|
|
4720
4796
|
var DEFAULT_CELL = "flex flex-col items-center text-center";
|
|
4721
4797
|
var DEFAULT_VALUE = "text-2xl font-bold";
|
|
@@ -4732,18 +4808,18 @@ function PaywallStatsRow({
|
|
|
4732
4808
|
const cellClasses = [DEFAULT_CELL, cellClassName].filter(Boolean).join(" ");
|
|
4733
4809
|
const valueClasses = [DEFAULT_VALUE, valueClassName].filter(Boolean).join(" ");
|
|
4734
4810
|
const labelClasses = [DEFAULT_LABEL, labelClassName].filter(Boolean).join(" ");
|
|
4735
|
-
return /* @__PURE__ */
|
|
4811
|
+
return /* @__PURE__ */ jsx49("div", { className: rootClasses, children: stats.map((stat, idx) => {
|
|
4736
4812
|
if (renderCell) return renderCell(stat, idx);
|
|
4737
|
-
return /* @__PURE__ */
|
|
4738
|
-
stat.icon ? /* @__PURE__ */
|
|
4739
|
-
/* @__PURE__ */
|
|
4740
|
-
/* @__PURE__ */
|
|
4813
|
+
return /* @__PURE__ */ jsxs30("div", { className: cellClasses, children: [
|
|
4814
|
+
stat.icon ? /* @__PURE__ */ jsx49("div", { "aria-hidden": "true", children: stat.icon }) : null,
|
|
4815
|
+
/* @__PURE__ */ jsx49("div", { className: valueClasses, children: stat.value }),
|
|
4816
|
+
/* @__PURE__ */ jsx49("div", { className: labelClasses, children: stat.label })
|
|
4741
4817
|
] }, idx);
|
|
4742
4818
|
}) });
|
|
4743
4819
|
}
|
|
4744
4820
|
|
|
4745
4821
|
// src/components/paywall/blocks/PaywallFinePrint.tsx
|
|
4746
|
-
import { jsx as
|
|
4822
|
+
import { jsx as jsx50 } from "react/jsx-runtime";
|
|
4747
4823
|
var DEFAULT_CLASS3 = "text-xs opacity-60 leading-snug";
|
|
4748
4824
|
var CYCLE_LABEL2 = {
|
|
4749
4825
|
MONTHLY: "mensal",
|
|
@@ -4766,7 +4842,7 @@ function PaywallFinePrint({
|
|
|
4766
4842
|
const priceFormatted = formatBRL(currentPriceCents ?? 0);
|
|
4767
4843
|
const rootClasses = [DEFAULT_CLASS3, className].filter(Boolean).join(" ");
|
|
4768
4844
|
if (render) {
|
|
4769
|
-
return /* @__PURE__ */
|
|
4845
|
+
return /* @__PURE__ */ jsx50("p", { className: className || void 0, children: render({
|
|
4770
4846
|
currentPriceCents: currentPriceCents ?? 0,
|
|
4771
4847
|
cycle,
|
|
4772
4848
|
trialDays: trialDays ?? 0,
|
|
@@ -4774,11 +4850,11 @@ function PaywallFinePrint({
|
|
|
4774
4850
|
}) });
|
|
4775
4851
|
}
|
|
4776
4852
|
const text = template.replaceAll("{price}", priceFormatted).replaceAll("{trialDays}", String(trialDays ?? 0)).replaceAll("{cycle}", cycleLabel);
|
|
4777
|
-
return /* @__PURE__ */
|
|
4853
|
+
return /* @__PURE__ */ jsx50("p", { className: rootClasses, children: text });
|
|
4778
4854
|
}
|
|
4779
4855
|
|
|
4780
4856
|
// src/components/paywall/blocks/PaywallTrustLine.tsx
|
|
4781
|
-
import { jsx as
|
|
4857
|
+
import { jsx as jsx51, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
4782
4858
|
var DEFAULT_ROOT3 = "flex items-center gap-3";
|
|
4783
4859
|
var DEFAULT_ITEM = "flex items-center gap-1.5 text-xs";
|
|
4784
4860
|
function PaywallTrustLine({
|
|
@@ -4789,17 +4865,17 @@ function PaywallTrustLine({
|
|
|
4789
4865
|
}) {
|
|
4790
4866
|
const rootClasses = [DEFAULT_ROOT3, className].filter(Boolean).join(" ");
|
|
4791
4867
|
const itemClasses = [DEFAULT_ITEM, itemClassName].filter(Boolean).join(" ");
|
|
4792
|
-
return /* @__PURE__ */
|
|
4868
|
+
return /* @__PURE__ */ jsx51("div", { className: rootClasses, children: items.map((item, idx) => {
|
|
4793
4869
|
if (renderItem) return renderItem(item, idx);
|
|
4794
|
-
return /* @__PURE__ */
|
|
4795
|
-
/* @__PURE__ */
|
|
4796
|
-
/* @__PURE__ */
|
|
4870
|
+
return /* @__PURE__ */ jsxs31("span", { className: itemClasses, children: [
|
|
4871
|
+
/* @__PURE__ */ jsx51("span", { "aria-hidden": "true", children: item.icon }),
|
|
4872
|
+
/* @__PURE__ */ jsx51("span", { children: item.text })
|
|
4797
4873
|
] }, idx);
|
|
4798
4874
|
}) });
|
|
4799
4875
|
}
|
|
4800
4876
|
|
|
4801
4877
|
// src/components/paywall/blocks/PaywallStickyFooter.tsx
|
|
4802
|
-
import { jsx as
|
|
4878
|
+
import { jsx as jsx52 } from "react/jsx-runtime";
|
|
4803
4879
|
var DEFAULT_CLASSES = "sticky bottom-0 left-0 right-0 bg-background";
|
|
4804
4880
|
var SAFE_AREA_CLASS = "pb-[env(safe-area-inset-bottom)]";
|
|
4805
4881
|
function PaywallStickyFooter({
|
|
@@ -4808,7 +4884,7 @@ function PaywallStickyFooter({
|
|
|
4808
4884
|
safeAreaInsets = true
|
|
4809
4885
|
}) {
|
|
4810
4886
|
const classes = [DEFAULT_CLASSES, safeAreaInsets ? SAFE_AREA_CLASS : null, className].filter(Boolean).join(" ");
|
|
4811
|
-
return /* @__PURE__ */
|
|
4887
|
+
return /* @__PURE__ */ jsx52("div", { className: classes, children });
|
|
4812
4888
|
}
|
|
4813
4889
|
export {
|
|
4814
4890
|
AppConfigProvider,
|