@b3dotfun/sdk 0.1.68-alpha.4 → 0.1.68-alpha.6
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/cjs/anyspend/react/components/AnySpend.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/AnySpend.js +128 -11
- package/dist/cjs/anyspend/react/components/checkout/AnySpendCheckout.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/checkout/AnySpendCheckout.js +2 -2
- package/dist/cjs/anyspend/react/components/checkout/AnySpendCheckoutTrigger.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/checkout/AnySpendCheckoutTrigger.js +2 -2
- package/dist/cjs/anyspend/react/components/checkout/CheckoutPaymentPanel.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/checkout/CheckoutPaymentPanel.js +2 -2
- package/dist/cjs/anyspend/react/components/checkout/FiatCheckoutPanel.d.ts +3 -1
- package/dist/cjs/anyspend/react/components/checkout/FiatCheckoutPanel.js +14 -13
- package/dist/cjs/anyspend/react/components/checkout/KycGate.d.ts +11 -0
- package/dist/cjs/anyspend/react/components/checkout/KycGate.js +181 -0
- package/dist/cjs/anyspend/react/hooks/index.d.ts +1 -0
- package/dist/cjs/anyspend/react/hooks/index.js +1 -0
- package/dist/cjs/anyspend/react/hooks/useAnyspendCreateOnrampOrder.js +9 -0
- package/dist/cjs/anyspend/react/hooks/useKycStatus.d.ts +42 -0
- package/dist/cjs/anyspend/react/hooks/useKycStatus.js +113 -0
- package/dist/cjs/anyspend/services/anyspend.d.ts +3 -1
- package/dist/cjs/anyspend/services/anyspend.js +2 -1
- package/dist/cjs/global-account/react/components/B3DynamicModal.js +1 -1
- package/dist/cjs/global-account/react/components/ManageAccount/BottomNavigation.js +3 -3
- package/dist/cjs/global-account/react/hooks/useAuth.js +1 -1
- package/dist/cjs/global-account/react/stores/useModalStore.d.ts +4 -0
- package/dist/cjs/global-account/react/stores/useModalStore.js +2 -0
- package/dist/cjs/global-account/react/utils/createWagmiConfig.d.ts +18 -0
- package/dist/cjs/global-account/react/utils/createWagmiConfig.js +17 -0
- package/dist/esm/anyspend/react/components/AnySpend.d.ts +3 -1
- package/dist/esm/anyspend/react/components/AnySpend.js +129 -12
- package/dist/esm/anyspend/react/components/checkout/AnySpendCheckout.d.ts +3 -1
- package/dist/esm/anyspend/react/components/checkout/AnySpendCheckout.js +2 -2
- package/dist/esm/anyspend/react/components/checkout/AnySpendCheckoutTrigger.d.ts +3 -1
- package/dist/esm/anyspend/react/components/checkout/AnySpendCheckoutTrigger.js +2 -2
- package/dist/esm/anyspend/react/components/checkout/CheckoutPaymentPanel.d.ts +3 -1
- package/dist/esm/anyspend/react/components/checkout/CheckoutPaymentPanel.js +2 -2
- package/dist/esm/anyspend/react/components/checkout/FiatCheckoutPanel.d.ts +3 -1
- package/dist/esm/anyspend/react/components/checkout/FiatCheckoutPanel.js +14 -13
- package/dist/esm/anyspend/react/components/checkout/KycGate.d.ts +11 -0
- package/dist/esm/anyspend/react/components/checkout/KycGate.js +145 -0
- package/dist/esm/anyspend/react/hooks/index.d.ts +1 -0
- package/dist/esm/anyspend/react/hooks/index.js +1 -0
- package/dist/esm/anyspend/react/hooks/useAnyspendCreateOnrampOrder.js +9 -0
- package/dist/esm/anyspend/react/hooks/useKycStatus.d.ts +42 -0
- package/dist/esm/anyspend/react/hooks/useKycStatus.js +107 -0
- package/dist/esm/anyspend/services/anyspend.d.ts +3 -1
- package/dist/esm/anyspend/services/anyspend.js +2 -1
- package/dist/esm/global-account/react/components/B3DynamicModal.js +1 -1
- package/dist/esm/global-account/react/components/ManageAccount/BottomNavigation.js +3 -3
- package/dist/esm/global-account/react/hooks/useAuth.js +2 -2
- package/dist/esm/global-account/react/stores/useModalStore.d.ts +4 -0
- package/dist/esm/global-account/react/stores/useModalStore.js +2 -0
- package/dist/esm/global-account/react/utils/createWagmiConfig.d.ts +18 -0
- package/dist/esm/global-account/react/utils/createWagmiConfig.js +16 -0
- package/dist/styles/index.css +1 -1
- package/dist/types/anyspend/react/components/AnySpend.d.ts +3 -1
- package/dist/types/anyspend/react/components/checkout/AnySpendCheckout.d.ts +3 -1
- package/dist/types/anyspend/react/components/checkout/AnySpendCheckoutTrigger.d.ts +3 -1
- package/dist/types/anyspend/react/components/checkout/CheckoutPaymentPanel.d.ts +3 -1
- package/dist/types/anyspend/react/components/checkout/FiatCheckoutPanel.d.ts +3 -1
- package/dist/types/anyspend/react/components/checkout/KycGate.d.ts +11 -0
- package/dist/types/anyspend/react/hooks/index.d.ts +1 -0
- package/dist/types/anyspend/react/hooks/useKycStatus.d.ts +42 -0
- package/dist/types/anyspend/services/anyspend.d.ts +3 -1
- package/dist/types/global-account/react/stores/useModalStore.d.ts +4 -0
- package/dist/types/global-account/react/utils/createWagmiConfig.d.ts +18 -0
- package/package.json +2 -1
- package/src/anyspend/react/components/AnySpend.tsx +150 -13
- package/src/anyspend/react/components/checkout/AnySpendCheckout.tsx +4 -0
- package/src/anyspend/react/components/checkout/AnySpendCheckoutTrigger.tsx +4 -0
- package/src/anyspend/react/components/checkout/CheckoutPaymentPanel.tsx +4 -0
- package/src/anyspend/react/components/checkout/FiatCheckoutPanel.tsx +19 -13
- package/src/anyspend/react/components/checkout/KycGate.tsx +351 -0
- package/src/anyspend/react/hooks/index.ts +1 -0
- package/src/anyspend/react/hooks/useAnyspendCreateOnrampOrder.ts +10 -0
- package/src/anyspend/react/hooks/useKycStatus.ts +140 -0
- package/src/anyspend/services/anyspend.ts +4 -0
- package/src/global-account/react/components/B3DynamicModal.tsx +0 -2
- package/src/global-account/react/components/ManageAccount/BottomNavigation.tsx +7 -7
- package/src/global-account/react/hooks/useAuth.ts +2 -2
- package/src/global-account/react/stores/useModalStore.ts +6 -0
- package/src/global-account/react/utils/createWagmiConfig.tsx +18 -0
|
@@ -0,0 +1,181 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
4
|
+
if (k2 === undefined) k2 = k;
|
|
5
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
6
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
7
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
8
|
+
}
|
|
9
|
+
Object.defineProperty(o, k2, desc);
|
|
10
|
+
}) : (function(o, m, k, k2) {
|
|
11
|
+
if (k2 === undefined) k2 = k;
|
|
12
|
+
o[k2] = m[k];
|
|
13
|
+
}));
|
|
14
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
15
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
16
|
+
}) : function(o, v) {
|
|
17
|
+
o["default"] = v;
|
|
18
|
+
});
|
|
19
|
+
var __importStar = (this && this.__importStar) || (function () {
|
|
20
|
+
var ownKeys = function(o) {
|
|
21
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
22
|
+
var ar = [];
|
|
23
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
24
|
+
return ar;
|
|
25
|
+
};
|
|
26
|
+
return ownKeys(o);
|
|
27
|
+
};
|
|
28
|
+
return function (mod) {
|
|
29
|
+
if (mod && mod.__esModule) return mod;
|
|
30
|
+
var result = {};
|
|
31
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
32
|
+
__setModuleDefault(result, mod);
|
|
33
|
+
return result;
|
|
34
|
+
};
|
|
35
|
+
})();
|
|
36
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
|
+
exports.KycGate = KycGate;
|
|
38
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
39
|
+
const cn_1 = require("../../../../shared/utils/cn");
|
|
40
|
+
const react_1 = require("../../../../global-account/react");
|
|
41
|
+
const b3Chain_1 = require("../../../../shared/constants/chains/b3Chain");
|
|
42
|
+
const lucide_react_1 = require("lucide-react");
|
|
43
|
+
const react_2 = require("motion/react");
|
|
44
|
+
const react_3 = require("react");
|
|
45
|
+
const useKycStatus_1 = require("../../hooks/useKycStatus");
|
|
46
|
+
function KycGate({ themeColor, classes, enabled = false, onStatusResolved }) {
|
|
47
|
+
const { isAuthenticated, isAuthenticating } = (0, react_1.useAuth)();
|
|
48
|
+
const { kycStatus, isLoadingKycStatus, refetchKycStatus } = (0, useKycStatus_1.useKycStatus)(enabled);
|
|
49
|
+
const { createInquiry, isCreatingInquiry } = (0, useKycStatus_1.useCreateKycInquiry)();
|
|
50
|
+
const { verifyKyc, isVerifying } = (0, useKycStatus_1.useVerifyKyc)();
|
|
51
|
+
const setB3ModalOpen = (0, react_1.useModalStore)(state => state.setB3ModalOpen);
|
|
52
|
+
const setB3ModalContentType = (0, react_1.useModalStore)(state => state.setB3ModalContentType);
|
|
53
|
+
const { partnerId } = (0, react_1.useB3Config)();
|
|
54
|
+
const [personaOpen, setPersonaOpen] = (0, react_3.useState)(false);
|
|
55
|
+
const [personaError, setPersonaError] = (0, react_3.useState)(null);
|
|
56
|
+
const [personaCancelled, setPersonaCancelled] = (0, react_3.useState)(false);
|
|
57
|
+
const prevStatusRef = (0, react_3.useRef)(null);
|
|
58
|
+
// Notify parent when status resolves
|
|
59
|
+
(0, react_3.useEffect)(() => {
|
|
60
|
+
if (!kycStatus)
|
|
61
|
+
return;
|
|
62
|
+
const currentStatus = kycStatus.status;
|
|
63
|
+
if (currentStatus === prevStatusRef.current)
|
|
64
|
+
return;
|
|
65
|
+
prevStatusRef.current = currentStatus;
|
|
66
|
+
if (!kycStatus.kycRequired || currentStatus === "approved") {
|
|
67
|
+
onStatusResolved(true);
|
|
68
|
+
}
|
|
69
|
+
}, [kycStatus, onStatusResolved]);
|
|
70
|
+
const openPersonaFlow = (0, react_3.useCallback)(async (config) => {
|
|
71
|
+
setPersonaOpen(true);
|
|
72
|
+
try {
|
|
73
|
+
// Dynamic import to keep bundle small
|
|
74
|
+
const { Client } = await Promise.resolve().then(() => __importStar(require("persona")));
|
|
75
|
+
const client = new Client({
|
|
76
|
+
inquiryId: config.inquiryId,
|
|
77
|
+
sessionToken: config.sessionToken,
|
|
78
|
+
environment: config.environment === "production" ? "production" : "sandbox",
|
|
79
|
+
onComplete: async ({ inquiryId }) => {
|
|
80
|
+
// Reopen the modal first so the user lands back in the checkout flow
|
|
81
|
+
setB3ModalOpen(true);
|
|
82
|
+
setPersonaOpen(false);
|
|
83
|
+
if (inquiryId) {
|
|
84
|
+
try {
|
|
85
|
+
const result = await verifyKyc(inquiryId);
|
|
86
|
+
if (result.status === "approved") {
|
|
87
|
+
onStatusResolved(true);
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
catch (err) {
|
|
91
|
+
setPersonaError(err instanceof Error ? err.message : "Verification check failed — please retry.");
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
refetchKycStatus();
|
|
95
|
+
},
|
|
96
|
+
onCancel: () => {
|
|
97
|
+
// Reopen the modal so the user can retry or cancel the purchase
|
|
98
|
+
setB3ModalOpen(true);
|
|
99
|
+
setPersonaOpen(false);
|
|
100
|
+
setPersonaCancelled(true);
|
|
101
|
+
},
|
|
102
|
+
onError: error => {
|
|
103
|
+
// Reopen the modal so the user sees the error and can retry
|
|
104
|
+
setB3ModalOpen(true);
|
|
105
|
+
setPersonaOpen(false);
|
|
106
|
+
setPersonaError(error?.message || "Verification encountered an error");
|
|
107
|
+
},
|
|
108
|
+
});
|
|
109
|
+
// Close the modal before opening Persona so its overlay is fully
|
|
110
|
+
// interactive — no Radix Dialog backdrop or z-index conflicts.
|
|
111
|
+
// The modal's contentType is preserved in Zustand and restored on reopen.
|
|
112
|
+
setB3ModalOpen(false);
|
|
113
|
+
client.open();
|
|
114
|
+
}
|
|
115
|
+
catch (error) {
|
|
116
|
+
setPersonaOpen(false);
|
|
117
|
+
setB3ModalOpen(true);
|
|
118
|
+
setPersonaError("Failed to load verification module");
|
|
119
|
+
}
|
|
120
|
+
}, [verifyKyc, onStatusResolved, refetchKycStatus, setB3ModalOpen]);
|
|
121
|
+
const handleStartVerification = (0, react_3.useCallback)(async () => {
|
|
122
|
+
setPersonaError(null);
|
|
123
|
+
setPersonaCancelled(false);
|
|
124
|
+
try {
|
|
125
|
+
const { inquiryId, sessionToken } = await createInquiry();
|
|
126
|
+
openPersonaFlow({
|
|
127
|
+
inquiryId,
|
|
128
|
+
sessionToken,
|
|
129
|
+
environment: kycStatus?.config?.environment,
|
|
130
|
+
});
|
|
131
|
+
}
|
|
132
|
+
catch (error) {
|
|
133
|
+
setPersonaError(error instanceof Error ? error.message : "Failed to start verification");
|
|
134
|
+
}
|
|
135
|
+
}, [createInquiry, kycStatus, openPersonaFlow]);
|
|
136
|
+
const handleSignIn = (0, react_3.useCallback)(() => {
|
|
137
|
+
setB3ModalContentType({ type: "signInWithB3", showBackButton: false, chain: b3Chain_1.thirdwebB3Chain, partnerId });
|
|
138
|
+
setB3ModalOpen(true);
|
|
139
|
+
}, [setB3ModalContentType, setB3ModalOpen, partnerId]);
|
|
140
|
+
const handleResumeVerification = (0, react_3.useCallback)(() => {
|
|
141
|
+
if (!kycStatus?.inquiry)
|
|
142
|
+
return;
|
|
143
|
+
setPersonaError(null);
|
|
144
|
+
setPersonaCancelled(false);
|
|
145
|
+
openPersonaFlow({
|
|
146
|
+
inquiryId: kycStatus.inquiry.inquiryId,
|
|
147
|
+
sessionToken: kycStatus.inquiry.sessionToken,
|
|
148
|
+
environment: kycStatus.config?.environment,
|
|
149
|
+
});
|
|
150
|
+
}, [kycStatus, openPersonaFlow]);
|
|
151
|
+
// Auth loading state
|
|
152
|
+
if (isAuthenticating) {
|
|
153
|
+
return ((0, jsx_runtime_1.jsxs)(react_2.motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.2, ease: "easeOut" }, className: (0, cn_1.cn)("anyspend-kyc-loading flex flex-col items-center gap-3 py-6", classes?.fiatPanel), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-5 w-5 animate-spin text-gray-400" }), (0, jsx_runtime_1.jsx)(react_1.TextShimmer, { duration: 1.5, className: "text-sm", children: "Checking authentication..." })] }));
|
|
154
|
+
}
|
|
155
|
+
// Not authenticated — prompt to login
|
|
156
|
+
if (!isAuthenticated) {
|
|
157
|
+
return ((0, jsx_runtime_1.jsxs)(react_2.motion.div, { initial: { opacity: 0, y: 8 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.25, ease: "easeOut" }, className: (0, cn_1.cn)("anyspend-kyc-auth flex flex-col items-center gap-4 py-2", classes?.fiatPanel), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.ShieldCheck, { className: "h-8 w-8 text-gray-400" }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: "Login required to pay with card" }), (0, jsx_runtime_1.jsx)("p", { className: "mt-1 text-xs text-gray-500 dark:text-gray-400", children: "Sign in to your B3 account to complete identity verification." })] }), (0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: themeColor || "hsl(var(--as-brand))", className: "w-full", textClassName: "text-white", onClick: handleSignIn, children: (0, jsx_runtime_1.jsxs)("span", { className: "flex items-center justify-center gap-2", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.ShieldCheck, { className: "h-4 w-4" }), "Sign In"] }) })] }));
|
|
158
|
+
}
|
|
159
|
+
// Loading KYC status state
|
|
160
|
+
if (isLoadingKycStatus) {
|
|
161
|
+
return ((0, jsx_runtime_1.jsxs)(react_2.motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.2, ease: "easeOut" }, className: (0, cn_1.cn)("anyspend-kyc-loading flex flex-col items-center gap-3 py-6", classes?.fiatPanel), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-5 w-5 animate-spin text-gray-400" }), (0, jsx_runtime_1.jsx)(react_1.TextShimmer, { duration: 1.5, className: "text-sm", children: "Checking verification status..." })] }));
|
|
162
|
+
}
|
|
163
|
+
// Not required or already approved — render nothing
|
|
164
|
+
if (!kycStatus?.kycRequired || kycStatus.status === "approved") {
|
|
165
|
+
return null;
|
|
166
|
+
}
|
|
167
|
+
// Persona flow is open - show loading
|
|
168
|
+
if (personaOpen) {
|
|
169
|
+
return ((0, jsx_runtime_1.jsxs)(react_2.motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.2, ease: "easeOut" }, className: (0, cn_1.cn)("anyspend-kyc-persona flex flex-col items-center gap-3 py-6", classes?.fiatPanel), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-5 w-5 animate-spin text-gray-400" }), (0, jsx_runtime_1.jsx)(react_1.TextShimmer, { duration: 1.5, className: "text-sm", children: "Identity verification in progress..." }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-gray-400 dark:text-gray-500", children: "Complete the verification in the popup window" })] }));
|
|
170
|
+
}
|
|
171
|
+
// Needs review or completed (submitted, awaiting Persona decision)
|
|
172
|
+
if (kycStatus.status === "needs_review" || kycStatus.status === "completed") {
|
|
173
|
+
return ((0, jsx_runtime_1.jsxs)(react_2.motion.div, { initial: { opacity: 0, y: 8 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.25, ease: "easeOut" }, className: (0, cn_1.cn)("anyspend-kyc-review flex flex-col items-center gap-3 py-2", classes?.fiatPanel), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Clock, { className: "h-8 w-8 text-amber-500" }), (0, jsx_runtime_1.jsx)("p", { className: "text-center text-sm font-medium text-amber-700 dark:text-amber-300", children: "Your verification is under review" }), (0, jsx_runtime_1.jsx)("p", { className: "text-center text-xs text-amber-600 dark:text-amber-400", children: "This usually takes a few minutes. Please check back shortly." }), (0, jsx_runtime_1.jsx)("button", { onClick: () => refetchKycStatus(), className: "mt-1 text-sm font-medium text-amber-700 underline hover:text-amber-800 dark:text-amber-300", children: "Check status" })] }));
|
|
174
|
+
}
|
|
175
|
+
// Pending (started before) - offer resume
|
|
176
|
+
if (kycStatus.status === "pending" && kycStatus.inquiry) {
|
|
177
|
+
return ((0, jsx_runtime_1.jsxs)(react_2.motion.div, { initial: { opacity: 0, y: 8 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.25, ease: "easeOut" }, className: (0, cn_1.cn)("anyspend-kyc-resume flex flex-col items-center gap-4 py-2", classes?.fiatPanel), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.ShieldCheck, { className: "h-8 w-8 text-blue-500" }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: "Continue verification" }), (0, jsx_runtime_1.jsx)("p", { className: "mt-1 text-xs text-gray-500 dark:text-gray-400", children: "You have an incomplete verification. Resume to continue." })] }), (0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: themeColor || "hsl(var(--as-brand))", className: "w-full", textClassName: "text-white", onClick: handleResumeVerification, disabled: isCreatingInquiry, children: (0, jsx_runtime_1.jsxs)("span", { className: "flex items-center justify-center gap-2", children: [isCreatingInquiry ? (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-4 w-4 animate-spin" }) : (0, jsx_runtime_1.jsx)(lucide_react_1.ShieldCheck, { className: "h-4 w-4" }), "Resume Verification"] }) })] }));
|
|
178
|
+
}
|
|
179
|
+
// Not verified / declined / expired - show verification prompt
|
|
180
|
+
return ((0, jsx_runtime_1.jsxs)(react_2.motion.div, { initial: { opacity: 0, y: 8 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.25, ease: "easeOut" }, className: (0, cn_1.cn)("anyspend-kyc-prompt flex flex-col items-center gap-4 py-2", classes?.fiatPanel), children: [(0, jsx_runtime_1.jsx)(lucide_react_1.ShieldCheck, { className: "h-8 w-8 text-blue-500" }), (0, jsx_runtime_1.jsxs)("div", { className: "text-center", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: "Identity verification required" }), (0, jsx_runtime_1.jsx)("p", { className: "mt-1 text-xs text-gray-500 dark:text-gray-400", children: "Card payments require a one-time identity check. This takes about 2 minutes." })] }), (0, jsx_runtime_1.jsxs)(react_2.AnimatePresence, { initial: false, children: [personaError && ((0, jsx_runtime_1.jsx)(react_2.motion.div, { initial: { opacity: 0, height: 0 }, animate: { opacity: 1, height: "auto" }, exit: { opacity: 0, height: 0 }, transition: { duration: 0.2, ease: "easeOut" }, style: { overflow: "hidden" }, className: "w-full rounded-lg border border-red-200 bg-red-50 px-3 py-2 dark:border-red-800 dark:bg-red-900/20", children: (0, jsx_runtime_1.jsx)("p", { className: "text-center text-sm text-red-600 dark:text-red-400", children: personaError }) }, "kyc-error")), personaCancelled && ((0, jsx_runtime_1.jsx)(react_2.motion.div, { initial: { opacity: 0, height: 0 }, animate: { opacity: 1, height: "auto" }, exit: { opacity: 0, height: 0 }, transition: { duration: 0.2, ease: "easeOut" }, style: { overflow: "hidden" }, className: "w-full rounded-lg border border-amber-200 bg-amber-50 px-3 py-2 dark:border-amber-800 dark:bg-amber-900/20", children: (0, jsx_runtime_1.jsx)("p", { className: "text-center text-sm text-amber-600 dark:text-amber-400", children: "Verification cancelled. Click below to try again." }) }, "kyc-cancelled"))] }), kycStatus.status === "declined" && ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-1.5 rounded-lg border border-red-200 bg-red-50 px-3 py-2 dark:border-red-800 dark:bg-red-900/20", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.AlertTriangle, { className: "h-3.5 w-3.5 text-red-500" }), (0, jsx_runtime_1.jsx)("p", { className: "text-xs text-red-600 dark:text-red-400", children: "Previous verification was declined. You may try again." })] })), (0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: themeColor || "hsl(var(--as-brand))", className: "w-full", textClassName: "text-white", onClick: handleStartVerification, disabled: isCreatingInquiry || isVerifying, children: (0, jsx_runtime_1.jsxs)("span", { className: "flex items-center justify-center gap-2", children: [isCreatingInquiry ? (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-4 w-4 animate-spin" }) : (0, jsx_runtime_1.jsx)(lucide_react_1.ShieldCheck, { className: "h-4 w-4" }), isCreatingInquiry ? "Starting..." : "Verify Identity"] }) })] }));
|
|
181
|
+
}
|
|
@@ -34,3 +34,4 @@ __exportStar(require("./useSigMint"), exports);
|
|
|
34
34
|
__exportStar(require("./useStripeClientSecret"), exports);
|
|
35
35
|
__exportStar(require("./useStripeSupport"), exports);
|
|
36
36
|
__exportStar(require("./useWatchTransfer"), exports);
|
|
37
|
+
__exportStar(require("./useKycStatus"), exports);
|
|
@@ -10,6 +10,7 @@ const react_query_1 = require("@tanstack/react-query");
|
|
|
10
10
|
const react_2 = require("react");
|
|
11
11
|
const viem_1 = require("viem");
|
|
12
12
|
const chains_1 = require("viem/chains");
|
|
13
|
+
const useKycStatus_1 = require("./useKycStatus");
|
|
13
14
|
const useValidatedClientReferenceId_1 = require("./useValidatedClientReferenceId");
|
|
14
15
|
/**
|
|
15
16
|
* Hook for creating onramp orders in the Anyspend protocol
|
|
@@ -18,6 +19,7 @@ const useValidatedClientReferenceId_1 = require("./useValidatedClientReferenceId
|
|
|
18
19
|
function useAnyspendCreateOnrampOrder({ onSuccess, onError } = {}) {
|
|
19
20
|
// Get B3 context values
|
|
20
21
|
const { partnerId } = (0, react_1.useB3Config)();
|
|
22
|
+
const { getHeaders: getWalletAuthHeaders } = (0, useKycStatus_1.useWalletAuthHeaders)();
|
|
21
23
|
// Get validated client reference ID from B3 context
|
|
22
24
|
const createValidatedClientReferenceId = (0, useValidatedClientReferenceId_1.useValidatedClientReferenceId)();
|
|
23
25
|
// Get fingerprint data
|
|
@@ -39,6 +41,12 @@ function useAnyspendCreateOnrampOrder({ onSuccess, onError } = {}) {
|
|
|
39
41
|
const srcChain = chains_1.base.id;
|
|
40
42
|
// Create order with USDC on Base as source
|
|
41
43
|
const srcAmountOnRampInWei = (0, viem_1.parseUnits)(srcFiatAmount, constants_1.USDC_BASE.decimals);
|
|
44
|
+
// For card payments, include wallet auth headers so the backend can verify
|
|
45
|
+
// KYC by the signing wallet address (may differ from the B3 JWT address).
|
|
46
|
+
let kycWalletHeaders;
|
|
47
|
+
if (onramp.vendor === "stripe-web2") {
|
|
48
|
+
kycWalletHeaders = await getWalletAuthHeaders().catch(() => undefined);
|
|
49
|
+
}
|
|
42
50
|
return await anyspend_1.anyspendService.createOrder({
|
|
43
51
|
recipientAddress: (0, utils_1.normalizeAddress)(recipientAddress),
|
|
44
52
|
type: orderType,
|
|
@@ -76,6 +84,7 @@ function useAnyspendCreateOnrampOrder({ onSuccess, onError } = {}) {
|
|
|
76
84
|
visitorData,
|
|
77
85
|
callbackMetadata: params.callbackMetadata,
|
|
78
86
|
feeOnTop: params.feeOnTop,
|
|
87
|
+
kycWalletHeaders,
|
|
79
88
|
});
|
|
80
89
|
}
|
|
81
90
|
catch (error) {
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
export interface KycStatusResponse {
|
|
2
|
+
kycRequired: boolean;
|
|
3
|
+
status: "not_verified" | "pending" | "completed" | "approved" | "declined" | "needs_review" | "expired";
|
|
4
|
+
inquiry?: {
|
|
5
|
+
inquiryId: string;
|
|
6
|
+
sessionToken: string;
|
|
7
|
+
};
|
|
8
|
+
config?: {
|
|
9
|
+
templateId: string;
|
|
10
|
+
environment: string;
|
|
11
|
+
};
|
|
12
|
+
}
|
|
13
|
+
interface KycInquiryResponse {
|
|
14
|
+
inquiryId: string;
|
|
15
|
+
sessionToken: string;
|
|
16
|
+
}
|
|
17
|
+
interface KycVerifyResponse {
|
|
18
|
+
status: string;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* Returns a function that builds the wallet-signature auth headers.
|
|
22
|
+
* Caches signatures for 4 minutes (server allows 5-minute window).
|
|
23
|
+
*/
|
|
24
|
+
export declare function useWalletAuthHeaders(): {
|
|
25
|
+
address: `0x${string}` | undefined;
|
|
26
|
+
getHeaders: () => Promise<Record<string, string>>;
|
|
27
|
+
};
|
|
28
|
+
export declare function useKycStatus(enabled?: boolean): {
|
|
29
|
+
kycStatus: KycStatusResponse | null;
|
|
30
|
+
isLoadingKycStatus: boolean;
|
|
31
|
+
kycStatusError: Error | null;
|
|
32
|
+
refetchKycStatus: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<KycStatusResponse, Error>>;
|
|
33
|
+
};
|
|
34
|
+
export declare function useCreateKycInquiry(): {
|
|
35
|
+
createInquiry: import("@tanstack/react-query").UseMutateAsyncFunction<KycInquiryResponse, Error, void, unknown>;
|
|
36
|
+
isCreatingInquiry: boolean;
|
|
37
|
+
};
|
|
38
|
+
export declare function useVerifyKyc(): {
|
|
39
|
+
verifyKyc: import("@tanstack/react-query").UseMutateAsyncFunction<KycVerifyResponse, Error, string, unknown>;
|
|
40
|
+
isVerifying: boolean;
|
|
41
|
+
};
|
|
42
|
+
export {};
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.useWalletAuthHeaders = useWalletAuthHeaders;
|
|
5
|
+
exports.useKycStatus = useKycStatus;
|
|
6
|
+
exports.useCreateKycInquiry = useCreateKycInquiry;
|
|
7
|
+
exports.useVerifyKyc = useVerifyKyc;
|
|
8
|
+
const constants_1 = require("../../../anyspend/constants");
|
|
9
|
+
const react_query_1 = require("@tanstack/react-query");
|
|
10
|
+
const react_1 = require("react");
|
|
11
|
+
const wagmi_1 = require("wagmi");
|
|
12
|
+
function buildWalletAuthMessage(walletAddress, timestamp) {
|
|
13
|
+
return `AnySpend wants to verify your identity for card payments.\n\nThis signature does not trigger a blockchain transaction or cost any gas.\n\nWallet: ${walletAddress.toLowerCase()}\nNonce: ${timestamp}`;
|
|
14
|
+
}
|
|
15
|
+
/** Module-level signature cache to avoid repeated wallet prompts within the 5-minute window. */
|
|
16
|
+
const headerCache = new Map();
|
|
17
|
+
/**
|
|
18
|
+
* Returns a function that builds the wallet-signature auth headers.
|
|
19
|
+
* Caches signatures for 4 minutes (server allows 5-minute window).
|
|
20
|
+
*/
|
|
21
|
+
function useWalletAuthHeaders() {
|
|
22
|
+
const { address } = (0, wagmi_1.useAccount)();
|
|
23
|
+
const { signMessageAsync } = (0, wagmi_1.useSignMessage)();
|
|
24
|
+
const getHeaders = (0, react_1.useCallback)(async () => {
|
|
25
|
+
if (!address)
|
|
26
|
+
throw new Error("No wallet connected");
|
|
27
|
+
const walletAddress = address.toLowerCase();
|
|
28
|
+
const cached = headerCache.get(walletAddress);
|
|
29
|
+
if (cached && Date.now() < cached.expiresAt)
|
|
30
|
+
return cached.headers;
|
|
31
|
+
const timestamp = Math.floor(Date.now() / 1000);
|
|
32
|
+
const message = buildWalletAuthMessage(walletAddress, timestamp);
|
|
33
|
+
const signature = await signMessageAsync({ message });
|
|
34
|
+
const headers = {
|
|
35
|
+
"X-Wallet-Address": walletAddress,
|
|
36
|
+
"X-Wallet-Signature": signature,
|
|
37
|
+
"X-Wallet-Timestamp": String(timestamp),
|
|
38
|
+
};
|
|
39
|
+
// Cache for 4 minutes so repeated fetches don't re-prompt the user
|
|
40
|
+
headerCache.set(walletAddress, { headers, expiresAt: Date.now() + 4 * 60 * 1000 });
|
|
41
|
+
return headers;
|
|
42
|
+
}, [address, signMessageAsync]);
|
|
43
|
+
return { address, getHeaders };
|
|
44
|
+
}
|
|
45
|
+
function useKycStatus(enabled = true) {
|
|
46
|
+
const { address, getHeaders } = useWalletAuthHeaders();
|
|
47
|
+
const { data, isLoading, error, refetch } = (0, react_query_1.useQuery)({
|
|
48
|
+
queryKey: ["kyc-status", address],
|
|
49
|
+
queryFn: async () => {
|
|
50
|
+
const headers = await getHeaders();
|
|
51
|
+
const response = await fetch(`${constants_1.ANYSPEND_MAINNET_BASE_URL}/kyc/status`, { headers });
|
|
52
|
+
const json = await response.json();
|
|
53
|
+
if (!response.ok)
|
|
54
|
+
throw new Error(json.message || "Failed to fetch KYC status");
|
|
55
|
+
return json.data;
|
|
56
|
+
},
|
|
57
|
+
enabled: enabled && !!address,
|
|
58
|
+
staleTime: 30000,
|
|
59
|
+
retry: 0,
|
|
60
|
+
refetchOnWindowFocus: false,
|
|
61
|
+
});
|
|
62
|
+
return {
|
|
63
|
+
kycStatus: data || null,
|
|
64
|
+
isLoadingKycStatus: isLoading,
|
|
65
|
+
kycStatusError: error,
|
|
66
|
+
refetchKycStatus: refetch,
|
|
67
|
+
};
|
|
68
|
+
}
|
|
69
|
+
function useCreateKycInquiry() {
|
|
70
|
+
const { address, getHeaders } = useWalletAuthHeaders();
|
|
71
|
+
const { mutateAsync, isPending } = (0, react_query_1.useMutation)({
|
|
72
|
+
mutationFn: async () => {
|
|
73
|
+
if (!address)
|
|
74
|
+
throw new Error("No wallet connected");
|
|
75
|
+
const headers = await getHeaders();
|
|
76
|
+
const response = await fetch(`${constants_1.ANYSPEND_MAINNET_BASE_URL}/kyc/inquiry`, {
|
|
77
|
+
method: "POST",
|
|
78
|
+
headers: { "Content-Type": "application/json", ...headers },
|
|
79
|
+
});
|
|
80
|
+
const json = await response.json();
|
|
81
|
+
if (!response.ok)
|
|
82
|
+
throw new Error(json.message || "Failed to create KYC inquiry");
|
|
83
|
+
return json.data;
|
|
84
|
+
},
|
|
85
|
+
});
|
|
86
|
+
return {
|
|
87
|
+
createInquiry: mutateAsync,
|
|
88
|
+
isCreatingInquiry: isPending,
|
|
89
|
+
};
|
|
90
|
+
}
|
|
91
|
+
function useVerifyKyc() {
|
|
92
|
+
const { address, getHeaders } = useWalletAuthHeaders();
|
|
93
|
+
const { mutateAsync, isPending } = (0, react_query_1.useMutation)({
|
|
94
|
+
mutationFn: async (inquiryId) => {
|
|
95
|
+
if (!address)
|
|
96
|
+
throw new Error("No wallet connected");
|
|
97
|
+
const headers = await getHeaders();
|
|
98
|
+
const response = await fetch(`${constants_1.ANYSPEND_MAINNET_BASE_URL}/kyc/verify`, {
|
|
99
|
+
method: "POST",
|
|
100
|
+
headers: { "Content-Type": "application/json", ...headers },
|
|
101
|
+
body: JSON.stringify({ inquiryId }),
|
|
102
|
+
});
|
|
103
|
+
const json = await response.json();
|
|
104
|
+
if (!response.ok)
|
|
105
|
+
throw new Error(json.message || "Failed to verify KYC");
|
|
106
|
+
return json.data;
|
|
107
|
+
},
|
|
108
|
+
});
|
|
109
|
+
return {
|
|
110
|
+
verifyKyc: mutateAsync,
|
|
111
|
+
isVerifying: isPending,
|
|
112
|
+
};
|
|
113
|
+
}
|
|
@@ -6,7 +6,7 @@ export declare const anyspendService: {
|
|
|
6
6
|
getTokenList: (chainId: number, query: string) => Promise<components["schemas"]["Token"][]>;
|
|
7
7
|
getToken: (chainId: number, tokenAddress: string) => Promise<components["schemas"]["Token"]>;
|
|
8
8
|
getQuote: (req: GetQuoteRequest, partnerId?: string) => Promise<GetQuoteResponse>;
|
|
9
|
-
createOrder: ({ recipientAddress, type, srcChain, dstChain, srcTokenAddress, dstTokenAddress, srcAmount, payload, onramp, metadata, creatorAddress, partnerId, clientReferenceId, visitorData, callbackMetadata, feeOnTop, }: {
|
|
9
|
+
createOrder: ({ recipientAddress, type, srcChain, dstChain, srcTokenAddress, dstTokenAddress, srcAmount, payload, onramp, metadata, creatorAddress, partnerId, clientReferenceId, visitorData, callbackMetadata, feeOnTop, kycWalletHeaders, }: {
|
|
10
10
|
recipientAddress: string;
|
|
11
11
|
type: string;
|
|
12
12
|
srcChain: number;
|
|
@@ -23,6 +23,8 @@ export declare const anyspendService: {
|
|
|
23
23
|
visitorData?: VisitorData;
|
|
24
24
|
callbackMetadata?: Record<string, unknown>;
|
|
25
25
|
feeOnTop?: boolean;
|
|
26
|
+
/** Wallet signature auth headers for KYC lookup (stripe-web2 orders only). */
|
|
27
|
+
kycWalletHeaders?: Record<string, string>;
|
|
26
28
|
}) => Promise<{
|
|
27
29
|
success: boolean;
|
|
28
30
|
message: string;
|
|
@@ -43,7 +43,7 @@ exports.anyspendService = {
|
|
|
43
43
|
return data;
|
|
44
44
|
},
|
|
45
45
|
// Order related
|
|
46
|
-
createOrder: async ({ recipientAddress, type, srcChain, dstChain, srcTokenAddress, dstTokenAddress, srcAmount, payload, onramp, metadata, creatorAddress, partnerId, clientReferenceId, visitorData, callbackMetadata, feeOnTop, }) => {
|
|
46
|
+
createOrder: async ({ recipientAddress, type, srcChain, dstChain, srcTokenAddress, dstTokenAddress, srcAmount, payload, onramp, metadata, creatorAddress, partnerId, clientReferenceId, visitorData, callbackMetadata, feeOnTop, kycWalletHeaders, }) => {
|
|
47
47
|
const accessToken = await app_1.default.authentication.getAccessToken();
|
|
48
48
|
const response = await fetch(`${constants_1.ANYSPEND_MAINNET_BASE_URL}/orders`, {
|
|
49
49
|
method: "POST",
|
|
@@ -52,6 +52,7 @@ exports.anyspendService = {
|
|
|
52
52
|
...(visitorData?.requestId && { "X-Fingerprint-Request-Id": visitorData.requestId }),
|
|
53
53
|
...(visitorData?.visitorId && { "X-Fingerprint-Visitor-Id": visitorData.visitorId }),
|
|
54
54
|
...(accessToken && { Authorization: `Bearer ${accessToken}` }),
|
|
55
|
+
...kycWalletHeaders,
|
|
55
56
|
},
|
|
56
57
|
body: JSON.stringify({
|
|
57
58
|
recipientAddress,
|
|
@@ -168,7 +168,7 @@ function B3DynamicModal() {
|
|
|
168
168
|
contentType?.type === "send" ||
|
|
169
169
|
contentType?.type === "avatarEditor" ||
|
|
170
170
|
contentType?.type === "notifications") &&
|
|
171
|
-
"p-0", "mx-auto w-full max-w-md sm:max-w-lg"), hideCloseButton: hideCloseButton, hideGABranding: isAnySpendType, onEscapeKeyDown: !isClosable ? e => e.preventDefault() : undefined,
|
|
171
|
+
"p-0", "mx-auto w-full max-w-md sm:max-w-lg"), hideCloseButton: hideCloseButton, hideGABranding: isAnySpendType, onEscapeKeyDown: !isClosable ? e => e.preventDefault() : undefined, children: [(0, jsx_runtime_1.jsx)(ModalTitle, { className: "sr-only hidden", children: contentType?.type || "Modal" }), (0, jsx_runtime_1.jsx)(ModalDescription, { className: "sr-only hidden", children: contentType?.type || "Modal Body" }), (0, jsx_runtime_1.jsxs)("div", { className: (0, cn_1.cn)("b3-modal-content no-scrollbar dark:bg-b3-background flex max-h-[90dvh] flex-col overflow-auto sm:max-h-[80dvh]"), children: [!hideCloseButton && ((0, jsx_runtime_1.jsxs)("button", { onClick: navigateBack, className: "flex items-center gap-2 px-6 py-4 text-gray-600 transition-colors hover:text-gray-900 dark:text-gray-400 dark:hover:text-white", children: [(0, jsx_runtime_1.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [(0, jsx_runtime_1.jsx)("path", { d: "M15.8337 10H4.16699", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), (0, jsx_runtime_1.jsx)("path", { d: "M10.0003 15.8334L4.16699 10L10.0003 4.16669", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }), (0, jsx_runtime_1.jsx)("span", { className: "font-inter text-sm font-semibold", children: "Back" })] })), (0, jsx_runtime_1.jsx)("div", { className: "flex-1", children: renderContent() }), (0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { children: toasts.length > 0 && ((0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: { height: 0 }, animate: { height: "auto" }, exit: { height: 0 }, transition: { duration: 0.3, ease: "easeInOut" }, className: "toast-section relative z-10 overflow-hidden bg-white dark:border-neutral-800 dark:bg-neutral-900", children: (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, transition: { duration: 0.2, delay: 0.1 }, className: "p-4 pt-0", children: (0, jsx_runtime_1.jsx)(index_1.ToastContainer, { toasts: toasts, onDismiss: removeToast, theme: theme }) }) })) })] })] }), isOpen && !isAnySpendType && ((0, jsx_runtime_1.jsx)("style", { children: `
|
|
172
172
|
.modal-inner-content {
|
|
173
173
|
transition: margin-bottom 0.3s ease-in-out;
|
|
174
174
|
margin-bottom: ${toasts.length > 0 ? "0px" : "23px"} !important;
|
|
@@ -3,13 +3,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
4
4
|
const react_1 = require("../../../../global-account/react");
|
|
5
5
|
const HomeIcon = () => {
|
|
6
|
-
return ((0, jsx_runtime_1.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", {
|
|
6
|
+
return ((0, jsx_runtime_1.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.5227 1.33636C12.1804 1.24368 11.8196 1.24368 11.4773 1.33636C11.08 1.44395 10.7454 1.7066 10.4784 1.91623L10.4038 1.97465L3.54376 7.31012C3.16713 7.6024 2.83532 7.85991 2.58806 8.19421C2.37107 8.48759 2.20942 8.8181 2.11106 9.1695C1.99898 9.56992 1.99943 9.98993 1.99995 10.4667L2.00002 17.8385C2 18.3657 1.99998 18.8204 2.03059 19.195C2.06289 19.5904 2.1342 19.9836 2.327 20.362C2.61462 20.9264 3.07356 21.3854 3.63805 21.673C4.01643 21.8658 4.40964 21.9371 4.80499 21.9694C5.17956 22 5.63431 22 6.16145 22H17.8386C18.3657 22 18.8205 22 19.195 21.9694C19.5904 21.9371 19.9836 21.8658 20.362 21.673C20.9265 21.3854 21.3854 20.9264 21.673 20.362C21.8658 19.9836 21.9371 19.5904 21.9694 19.195C22.0001 18.8204 22 18.3657 22 17.8386L22.0001 10.4667C22.0006 9.98993 22.0011 9.56992 21.889 9.1695C21.7906 8.8181 21.629 8.48759 21.412 8.19421C21.1647 7.8599 20.8329 7.6024 20.4563 7.31011L13.5963 1.97465L13.5216 1.91623C13.2546 1.7066 12.9201 1.44395 12.5227 1.33636ZM8.00003 16C7.44775 16 7.00003 16.4477 7.00003 17C7.00003 17.5523 7.44775 18 8.00003 18H16C16.5523 18 17 17.5523 17 17C17 16.4477 16.5523 16 16 16H8.00003Z", fill: "currentColor" }) }));
|
|
7
7
|
};
|
|
8
8
|
const SwapIcon = () => {
|
|
9
|
-
return ((0, jsx_runtime_1.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M20.4533 12.893C20.1755 15.5029 18.6968 17.9487 16.2498 19.3614C12.1843 21.7086 6.98576 20.3157 4.63855 16.2502L4.38855 15.8172M3.5465 11.107C3.8243 8.49711 5.30309 6.05138 7.75007 4.63862C11.8156 2.29141 17.0141 3.68434 19.3613 7.74983L19.6113 8.18285M3.49353 18.0661L4.22558 15.334L6.95763 16.0661M17.0428 7.93401L19.7748 8.66606L20.5069 5.93401", stroke: "currentColor",
|
|
9
|
+
return ((0, jsx_runtime_1.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { d: "M20.4533 12.893C20.1755 15.5029 18.6968 17.9487 16.2498 19.3614C12.1843 21.7086 6.98576 20.3157 4.63855 16.2502L4.38855 15.8172M3.5465 11.107C3.8243 8.49711 5.30309 6.05138 7.75007 4.63862C11.8156 2.29141 17.0141 3.68434 19.3613 7.74983L19.6113 8.18285M3.49353 18.0661L4.22558 15.334L6.95763 16.0661M17.0428 7.93401L19.7748 8.66606L20.5069 5.93401", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }));
|
|
10
10
|
};
|
|
11
11
|
const SettingsIcon = () => {
|
|
12
|
-
return ((0, jsx_runtime_1.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", {
|
|
12
|
+
return ((0, jsx_runtime_1.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: (0, jsx_runtime_1.jsx)("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M19.286 15.9606C19.2272 15.6362 19.2669 15.3016 19.4 15C19.5268 14.7042 19.7372 14.452 20.0055 14.2743C20.2738 14.0966 20.5882 14.0013 20.91 14H21C21.5304 14 22.0391 13.7893 22.4142 13.4142C22.7893 13.0391 23 12.5304 23 12C23 11.4696 22.7893 10.9609 22.4142 10.5858C22.0391 10.2107 21.5304 10 21 10H20.83C20.5082 9.99872 20.1938 9.90337 19.9255 9.72569C19.6572 9.54802 19.4468 9.29577 19.32 9V8.92C19.1869 8.61838 19.1472 8.28381 19.206 7.95941C19.2648 7.63502 19.4195 7.33568 19.65 7.1L19.71 7.04C19.896 6.85425 20.0435 6.63368 20.1441 6.39088C20.2448 6.14808 20.2966 5.88783 20.2966 5.625C20.2966 5.36217 20.2448 5.10192 20.1441 4.85912C20.0435 4.61632 19.896 4.39575 19.71 4.21C19.5243 4.02405 19.3037 3.87653 19.0609 3.77588C18.8181 3.67523 18.5578 3.62343 18.295 3.62343C18.0322 3.62343 17.7719 3.67523 17.5291 3.77588C17.2863 3.87653 17.0657 4.02405 16.88 4.21L16.82 4.27C16.5843 4.50054 16.285 4.65519 15.9606 4.714C15.6362 4.77282 15.3016 4.73312 15 4.6C14.7042 4.47324 14.452 4.26276 14.2743 3.99447C14.0966 3.72618 14.0013 3.41179 14 3.09V3C14 2.46957 13.7893 1.96086 13.4142 1.58579C13.0391 1.21071 12.5304 1 12 1C11.4696 1 10.9609 1.21071 10.5858 1.58579C10.2107 1.96086 10 2.46957 10 3V3.17C9.99872 3.49179 9.90337 3.80618 9.72569 4.07447C9.54802 4.34276 9.29577 4.55324 9 4.68H8.92C8.61838 4.81312 8.28381 4.85282 7.95941 4.794C7.63502 4.73519 7.33568 4.58054 7.1 4.35L7.04 4.29C6.85425 4.10405 6.63368 3.95653 6.39088 3.85588C6.14808 3.75523 5.88783 3.70343 5.625 3.70343C5.36217 3.70343 5.10192 3.75523 4.85912 3.85588C4.61632 3.95653 4.39575 4.10405 4.21 4.29C4.02405 4.47575 3.87653 4.69632 3.77588 4.93912C3.67523 5.18192 3.62343 5.44217 3.62343 5.705C3.62343 5.96783 3.67523 6.22808 3.77588 6.47088C3.87653 6.71368 4.02405 6.93425 4.21 7.12L4.27 7.18C4.50054 7.41568 4.65519 7.71502 4.714 8.03941C4.77282 8.36381 4.73312 8.69838 4.6 9C4.48572 9.31074 4.28059 9.5799 4.0113 9.77251C3.742 9.96512 3.42099 10.0723 3.09 10.08H3C2.46957 10.08 1.96086 10.2907 1.58579 10.6658C1.21071 11.0409 1 11.5496 1 12.08C1 12.6104 1.21071 13.1191 1.58579 13.4942C1.96086 13.8693 2.46957 14.08 3 14.08H3.17C3.49179 14.0813 3.80618 14.1766 4.07447 14.3543C4.34276 14.532 4.55324 14.7842 4.68 15.08C4.81312 15.3816 4.85282 15.7162 4.794 16.0406C4.73519 16.365 4.58054 16.6643 4.35 16.9L4.29 16.96C4.10405 17.1457 3.95653 17.3663 3.85588 17.6091C3.75523 17.8519 3.70343 18.1122 3.70343 18.375C3.70343 18.6378 3.75523 18.8981 3.85588 19.1409C3.95653 19.3837 4.10405 19.6043 4.29 19.79C4.47575 19.976 4.69632 20.1235 4.93912 20.2241C5.18192 20.3248 5.44217 20.3766 5.705 20.3766C5.96783 20.3766 6.22808 20.3248 6.47088 20.2241C6.71368 20.1235 6.93425 19.976 7.12 19.79L7.18 19.73C7.41568 19.4995 7.71502 19.3448 8.03941 19.286C8.36381 19.2272 8.69838 19.2669 9 19.4C9.31074 19.5143 9.5799 19.7194 9.77251 19.9887C9.96512 20.258 10.0723 20.579 10.08 20.91V21C10.08 21.5304 10.2907 22.0391 10.6658 22.4142C11.0409 22.7893 11.5496 23 12.08 23C12.6104 23 13.1191 22.7893 13.4942 22.4142C13.8693 22.0391 14.08 21.5304 14.08 21V20.83C14.0813 20.5082 14.1766 20.1938 14.3543 19.9255C14.532 19.6572 14.7842 19.4468 15.08 19.32C15.3816 19.1869 15.7162 19.1472 16.0406 19.206C16.365 19.2648 16.6643 19.4195 16.9 19.65L16.96 19.71C17.1457 19.896 17.3663 20.0435 17.6091 20.1441C17.8519 20.2448 18.1122 20.2966 18.375 20.2966C18.6378 20.2966 18.8981 20.2448 19.1409 20.1441C19.3837 20.0435 19.6043 19.896 19.79 19.71C19.976 19.5243 20.1235 19.3037 20.2241 19.0609C20.3248 18.8181 20.3766 18.5578 20.3766 18.295C20.3766 18.0322 20.3248 17.7719 20.2241 17.5291C20.1235 17.2863 19.976 17.0657 19.79 16.88L19.73 16.82C19.4995 16.5843 19.3448 16.285 19.286 15.9606ZM15 12C15 13.6569 13.6569 15 12 15C10.3431 15 9 13.6569 9 12C9 10.3431 10.3431 9 12 9C13.6569 9 15 10.3431 15 12Z", fill: "currentColor" }) }));
|
|
13
13
|
};
|
|
14
14
|
const BottomNavigation = () => {
|
|
15
15
|
const setB3ModalContentType = (0, react_1.useModalStore)(state => state.setB3ModalContentType);
|
|
@@ -44,7 +44,7 @@ function useAuth() {
|
|
|
44
44
|
const useAutoConnectLoadingPrevious = (0, react_2.useRef)(false);
|
|
45
45
|
const referralCode = (0, useSearchParamsSSR_1.useSearchParam)("referralCode");
|
|
46
46
|
const { partnerId } = (0, react_1.useB3Config)();
|
|
47
|
-
const wagmiConfig = (0, createWagmiConfig_1.
|
|
47
|
+
const wagmiConfig = (0, createWagmiConfig_1.getCachedWagmiConfig)({ partnerId });
|
|
48
48
|
const { connect } = (0, wagmi_1.useConnect)();
|
|
49
49
|
const activeWagmiAccount = (0, wagmi_1.useAccount)();
|
|
50
50
|
const { switchAccount } = (0, wagmi_1.useSwitchAccount)();
|
|
@@ -657,6 +657,10 @@ interface ModalState {
|
|
|
657
657
|
setLinkingState: (isLinking: boolean, method?: string | null) => void;
|
|
658
658
|
/** Function to update closable property of current content without adding to history */
|
|
659
659
|
setClosable: (closable: boolean) => void;
|
|
660
|
+
/** Whether a third-party iframe (e.g. Persona KYC) is currently active over the modal */
|
|
661
|
+
personaActive: boolean;
|
|
662
|
+
/** Function to mark a third-party iframe as active/inactive */
|
|
663
|
+
setPersonaActive: (active: boolean) => void;
|
|
660
664
|
}
|
|
661
665
|
/**
|
|
662
666
|
* Zustand store for managing modal state
|
|
@@ -39,4 +39,6 @@ exports.useModalStore = (0, zustand_1.create)(set => ({
|
|
|
39
39
|
setClosable: (closable) => set(state => ({
|
|
40
40
|
contentType: state.contentType ? { ...state.contentType, closable } : null,
|
|
41
41
|
})),
|
|
42
|
+
personaActive: false,
|
|
43
|
+
setPersonaActive: (active) => set({ personaActive: active }),
|
|
42
44
|
}));
|
|
@@ -25,3 +25,21 @@ export declare function createWagmiConfig(options: CreateWagmiConfigOptions): im
|
|
|
25
25
|
}, {
|
|
26
26
|
"thirdweb:lastChainId": number;
|
|
27
27
|
}>)[]>;
|
|
28
|
+
/**
|
|
29
|
+
* Returns a cached wagmi config for the given partnerId.
|
|
30
|
+
* Use this instead of calling createWagmiConfig() directly inside React components or hooks
|
|
31
|
+
* to avoid registering duplicate EventEmitter listeners on every render.
|
|
32
|
+
*/
|
|
33
|
+
export declare function getCachedWagmiConfig(options: CreateWagmiConfigOptions): import("wagmi").Config<readonly [import("viem").Chain, ...import("viem").Chain[]], {
|
|
34
|
+
[k: string]: import("viem").HttpTransport<undefined, false>;
|
|
35
|
+
}, (CreateConnectorFn | CreateConnectorFn<import("thirdweb/dist/types/adapters/eip1193").EIP1193Provider | undefined, {
|
|
36
|
+
connect<withCapabilities extends boolean = false>(parameters?: import("@thirdweb-dev/wagmi-adapter").ConnectionOptions<withCapabilities> | undefined): Promise<{
|
|
37
|
+
accounts: withCapabilities extends true ? readonly {
|
|
38
|
+
address: `0x${string}`;
|
|
39
|
+
capabilities: Record<string, unknown>;
|
|
40
|
+
}[] : readonly `0x${string}`[];
|
|
41
|
+
chainId: number;
|
|
42
|
+
}>;
|
|
43
|
+
}, {
|
|
44
|
+
"thirdweb:lastChainId": number;
|
|
45
|
+
}>)[]>;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.createWagmiConfig = createWagmiConfig;
|
|
4
|
+
exports.getCachedWagmiConfig = getCachedWagmiConfig;
|
|
4
5
|
const constants_1 = require("../../../shared/constants");
|
|
5
6
|
const supported_1 = require("../../../shared/constants/chains/supported");
|
|
6
7
|
const thirdweb_1 = require("../../../shared/utils/thirdweb");
|
|
@@ -30,3 +31,19 @@ function createWagmiConfig(options) {
|
|
|
30
31
|
connectors: finalConnectors,
|
|
31
32
|
});
|
|
32
33
|
}
|
|
34
|
+
/** Module-level cache — wagmi configs must not be recreated on every render. */
|
|
35
|
+
const wagmiConfigCache = new Map();
|
|
36
|
+
/**
|
|
37
|
+
* Returns a cached wagmi config for the given partnerId.
|
|
38
|
+
* Use this instead of calling createWagmiConfig() directly inside React components or hooks
|
|
39
|
+
* to avoid registering duplicate EventEmitter listeners on every render.
|
|
40
|
+
*/
|
|
41
|
+
function getCachedWagmiConfig(options) {
|
|
42
|
+
const key = options.partnerId;
|
|
43
|
+
let config = wagmiConfigCache.get(key);
|
|
44
|
+
if (!config) {
|
|
45
|
+
config = createWagmiConfig(options);
|
|
46
|
+
wagmiConfigCache.set(key, config);
|
|
47
|
+
}
|
|
48
|
+
return config;
|
|
49
|
+
}
|
|
@@ -18,7 +18,9 @@ export declare enum PanelView {
|
|
|
18
18
|
FIAT_PAYMENT_METHOD = 7,
|
|
19
19
|
POINTS_DETAIL = 8,
|
|
20
20
|
FEE_DETAIL = 9,
|
|
21
|
-
DIRECT_TRANSFER_SUCCESS = 10
|
|
21
|
+
DIRECT_TRANSFER_SUCCESS = 10,
|
|
22
|
+
FIAT_KYC = 11,
|
|
23
|
+
FIAT_AUTH = 12
|
|
22
24
|
}
|
|
23
25
|
export declare function AnySpend(props: {
|
|
24
26
|
mode?: "page" | "modal";
|