cppay-sdk 0.0.2-beta.34 → 0.0.2-beta.36
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/{cppay-C_gp2ZZ3.js → cppay-DnoMkyVy.js} +1 -1
- package/dist/{cppay-BYRjTzRF.cjs → cppay-GXgivhbP.cjs} +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +1 -1
- package/dist/{locales-DGvDecya.js → locales-KW7cSv4d.js} +8 -8
- package/dist/locales-mdiXS8LU.cjs +1 -0
- package/dist/react.cjs +1 -1
- package/dist/react.d.ts +7 -11
- package/dist/react.js +206 -206
- package/dist/vue.cjs +1 -1
- package/dist/vue.d.ts +6 -12
- package/dist/vue.js +284 -278
- package/package.json +1 -1
- package/dist/locales-DAKREZkH.cjs +0 -1
package/dist/react.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { t as cppay_default } from "./cppay-
|
|
2
|
-
import { n as injectStyle, r as payment_dialog_default, t as getLocaleMessages } from "./locales-
|
|
1
|
+
import { t as cppay_default } from "./cppay-DnoMkyVy.js";
|
|
2
|
+
import { n as injectStyle, r as payment_dialog_default, t as getLocaleMessages } from "./locales-KW7cSv4d.js";
|
|
3
3
|
import * as QRCode from "qrcode";
|
|
4
4
|
import { EMPTY, defer, timer } from "rxjs";
|
|
5
5
|
import { expand, retry, switchMap, tap, timeout } from "rxjs/operators";
|
|
@@ -9,10 +9,10 @@ import { createAppKit } from "@reown/appkit";
|
|
|
9
9
|
import { EthersAdapter } from "@reown/appkit-adapter-ethers";
|
|
10
10
|
import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
|
|
11
11
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
12
|
-
var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount: _, intervalDays: ge, locale:
|
|
13
|
-
let
|
|
12
|
+
var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount: _, intervalDays: ge, locale: v = "zh-CN", onSuccess: _e, onExpired: ve, onFailed: ye, onError: y, Slots: b, onPaymentStepChange: x, onLoadingChange: be, onIsCheckingPaymentChange: xe, onErrorChange: S }) => {
|
|
13
|
+
let C = useMemo(() => new cppay_default(t, n), [t, n]), w = useMemo(() => getLocaleMessages(v), [v]), [T, E] = useState("select"), [D, Se] = useState(!1), [O, Ce] = useState(!1), [k, we] = useState(), [A, Te] = useState([]), [j, M] = useState(), [N, P] = useState(), [F, Ee] = useState(), [I, L] = useState(), [De, Oe] = useState(!1), [R, z] = useState(), [ke, Ae] = useState(""), [B, je] = useState(!1), [Me, V] = useState(!1), H = useRef(null), U = useRef(null), W = useRef(null);
|
|
14
14
|
useEffect(() => {
|
|
15
|
-
typeof window < "u" && !
|
|
15
|
+
typeof window < "u" && !H.current && (H.current = createAppKit({
|
|
16
16
|
debug: !1,
|
|
17
17
|
enableNetworkSwitch: !1,
|
|
18
18
|
adapters: [new EthersAdapter()],
|
|
@@ -33,24 +33,30 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
33
33
|
icons: ["https://cppay.com/icon.png"]
|
|
34
34
|
},
|
|
35
35
|
features: { analytics: !1 }
|
|
36
|
-
}),
|
|
37
|
-
e.isConnected ?
|
|
38
|
-
}),
|
|
36
|
+
}), L(H.current.getAddress()), z(H.current.getProvider("eip155")), H.current.subscribeAccount((e) => {
|
|
37
|
+
e.isConnected ? L(e.address) : (L(void 0), z(void 0));
|
|
38
|
+
}), H.current.subscribeProviders((e) => {
|
|
39
39
|
let t = e?.eip155;
|
|
40
40
|
z(t);
|
|
41
41
|
}));
|
|
42
|
-
}, [])
|
|
43
|
-
|
|
42
|
+
}, []), useEffect(() => {
|
|
43
|
+
be?.(D);
|
|
44
|
+
}, [D, be]), useEffect(() => {
|
|
45
|
+
xe?.(O);
|
|
46
|
+
}, [O, xe]), useEffect(() => {
|
|
47
|
+
S?.(k);
|
|
48
|
+
}, [k, S]);
|
|
49
|
+
let G = async () => {
|
|
44
50
|
try {
|
|
45
|
-
|
|
51
|
+
Oe(!0), we(void 0), H.current && await H.current.open();
|
|
46
52
|
} catch (e) {
|
|
47
53
|
console.error("钱包连接失败:", e);
|
|
48
|
-
let t = e instanceof Error ? e.message :
|
|
49
|
-
|
|
54
|
+
let t = e instanceof Error ? e.message : w.walletConnectionFailed;
|
|
55
|
+
S?.(t), y?.(e);
|
|
50
56
|
} finally {
|
|
51
|
-
|
|
57
|
+
Oe(!1);
|
|
52
58
|
}
|
|
53
|
-
}, K = useMemo(() =>
|
|
59
|
+
}, K = useMemo(() => A.find((e) => e.chain === j), [A, j]), q = useMemo(() => K?.tokens || [], [K]), J = useMemo(() => q.find((e) => e.symbol === N), [q, N]), Y = (e) => [
|
|
54
60
|
"USDT",
|
|
55
61
|
"USDC",
|
|
56
62
|
"BUSD",
|
|
@@ -61,53 +67,53 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
61
67
|
].includes(e.toUpperCase()) ? 2 : 6, X = (e, t) => {
|
|
62
68
|
let n = parseFloat(e);
|
|
63
69
|
return isNaN(n) ? "0" : n.toFixed(t).replace(/\.?0+$/, "");
|
|
64
|
-
},
|
|
65
|
-
if (e <= 0) return
|
|
70
|
+
}, Ne = (e) => {
|
|
71
|
+
if (e <= 0) return w.expired;
|
|
66
72
|
let t = Math.floor(e / 3600), n = Math.floor(e % 3600 / 60), r = e % 60;
|
|
67
|
-
return t > 0 ? `${t}${
|
|
68
|
-
},
|
|
69
|
-
|
|
73
|
+
return t > 0 ? `${t}${w.hours}${n}${w.minutes}${r}${w.seconds}` : `${n}${w.minutes}${r}${w.seconds}`;
|
|
74
|
+
}, Pe = (e) => {
|
|
75
|
+
W.current && clearInterval(W.current);
|
|
70
76
|
let t = () => {
|
|
71
77
|
let t = e - Math.floor(Date.now() / 1e3);
|
|
72
|
-
|
|
78
|
+
Ae(Ne(t)), t <= 0 && (E("expired"), x?.("expired"), Fe());
|
|
73
79
|
};
|
|
74
|
-
t(),
|
|
75
|
-
},
|
|
76
|
-
|
|
80
|
+
t(), W.current = setInterval(t, 1e3);
|
|
81
|
+
}, Fe = () => {
|
|
82
|
+
W.current &&= (clearInterval(W.current), null);
|
|
77
83
|
}, Z = useMemo(() => {
|
|
78
|
-
if (!
|
|
84
|
+
if (!N || !J) return "0";
|
|
79
85
|
let e = parseFloat(J.price);
|
|
80
86
|
if (isNaN(e) || e === 0) return "0";
|
|
81
|
-
let t = Y(
|
|
87
|
+
let t = Y(N);
|
|
82
88
|
return X((parseFloat(_) / e).toFixed(t), t);
|
|
83
89
|
}, [
|
|
84
90
|
_,
|
|
85
|
-
|
|
91
|
+
N,
|
|
86
92
|
J
|
|
87
|
-
]),
|
|
93
|
+
]), Ie = async () => {
|
|
88
94
|
try {
|
|
89
|
-
|
|
90
|
-
let e = await
|
|
91
|
-
|
|
95
|
+
S?.(void 0);
|
|
96
|
+
let e = await C.getSupportedChains();
|
|
97
|
+
Te(e), e.length > 0 && M(e[0].chain);
|
|
92
98
|
} catch (e) {
|
|
93
|
-
let t = e instanceof Error ? e.message :
|
|
94
|
-
|
|
99
|
+
let t = e instanceof Error ? e.message : w.loadPaymentNetworkFailed;
|
|
100
|
+
S?.(t), y?.(e);
|
|
95
101
|
}
|
|
96
|
-
},
|
|
102
|
+
}, Le = async (e) => {
|
|
97
103
|
if (R) try {
|
|
98
104
|
await R.request({
|
|
99
105
|
method: "wallet_switchEthereumChain",
|
|
100
106
|
params: [{ chainId: `0x${e.toString(16)}` }]
|
|
101
107
|
});
|
|
102
108
|
} catch (e) {
|
|
103
|
-
throw e.code === 4902 ? Error(
|
|
109
|
+
throw e.code === 4902 ? Error(w.pleaseAddNetwork) : e;
|
|
104
110
|
}
|
|
105
|
-
},
|
|
106
|
-
if (!(!
|
|
111
|
+
}, Re = async () => {
|
|
112
|
+
if (!(!I || !R || !Q.current || !J || !K)) try {
|
|
107
113
|
let e = Q.current;
|
|
108
|
-
await
|
|
114
|
+
await Le(K.chainId);
|
|
109
115
|
let t = createWalletClient({
|
|
110
|
-
account:
|
|
116
|
+
account: I,
|
|
111
117
|
transport: custom(R)
|
|
112
118
|
});
|
|
113
119
|
J.address ? await t.writeContract({
|
|
@@ -132,21 +138,21 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
132
138
|
to: e.receiveAddress,
|
|
133
139
|
value: parseUnits(e.paymentAmount, J.decimals),
|
|
134
140
|
chain: null
|
|
135
|
-
}),
|
|
141
|
+
}), Se(!1), Ce(!0);
|
|
136
142
|
} catch (e) {
|
|
137
143
|
console.error("钱包支付失败:", e);
|
|
138
|
-
let t = e instanceof Error ? e.message :
|
|
139
|
-
|
|
144
|
+
let t = e instanceof Error ? e.message : w.walletPaymentFailed;
|
|
145
|
+
S?.(t), y?.(e);
|
|
140
146
|
}
|
|
141
|
-
},
|
|
142
|
-
if (!(!
|
|
147
|
+
}, ze = async () => {
|
|
148
|
+
if (!(!I || !R || !Q.current || !J || !K)) try {
|
|
143
149
|
let e = Q.current;
|
|
144
|
-
await
|
|
150
|
+
await Le(K.chainId);
|
|
145
151
|
let t = createWalletClient({
|
|
146
|
-
account:
|
|
152
|
+
account: I,
|
|
147
153
|
transport: custom(R)
|
|
148
154
|
});
|
|
149
|
-
if (!J.address) throw Error(
|
|
155
|
+
if (!J.address) throw Error(w.subscriptionDoesNotSupportNative);
|
|
150
156
|
await t.writeContract({
|
|
151
157
|
address: J.address,
|
|
152
158
|
abi: [{
|
|
@@ -165,69 +171,69 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
165
171
|
functionName: "approve",
|
|
166
172
|
args: [e.spenderAddress, parseUnits(e.approveAmount, J.decimals)],
|
|
167
173
|
chain: null
|
|
168
|
-
}),
|
|
174
|
+
}), Se(!1), Ce(!0);
|
|
169
175
|
} catch (e) {
|
|
170
176
|
console.error("钱包授权失败:", e);
|
|
171
|
-
let t = e instanceof Error ? e.message :
|
|
172
|
-
|
|
177
|
+
let t = e instanceof Error ? e.message : w.walletPaymentFailed;
|
|
178
|
+
S?.(t), y?.(e);
|
|
173
179
|
}
|
|
174
|
-
},
|
|
175
|
-
if (!
|
|
176
|
-
let e =
|
|
177
|
-
|
|
180
|
+
}, Be = async () => {
|
|
181
|
+
if (!I) {
|
|
182
|
+
let e = w.pleaseConnectWallet;
|
|
183
|
+
S?.(e), y?.(Error(e));
|
|
178
184
|
return;
|
|
179
185
|
}
|
|
180
|
-
h === "one-time" ? await
|
|
181
|
-
}, Q = useRef(null),
|
|
182
|
-
if (!(!
|
|
183
|
-
|
|
186
|
+
h === "one-time" ? await Re() : h === "subscription" && await ze();
|
|
187
|
+
}, Q = useRef(null), Ve = async () => {
|
|
188
|
+
if (!(!j || !N)) try {
|
|
189
|
+
S?.(void 0);
|
|
184
190
|
let e = "";
|
|
185
|
-
h === "one-time" ? (Q.current = await
|
|
186
|
-
paymentChain:
|
|
187
|
-
paymentToken:
|
|
191
|
+
h === "one-time" ? (Q.current = await C.createOnetimePayment({
|
|
192
|
+
paymentChain: j,
|
|
193
|
+
paymentToken: N,
|
|
188
194
|
orderId: g,
|
|
189
195
|
amount: Z
|
|
190
|
-
}), e = `${
|
|
191
|
-
paymentChain:
|
|
192
|
-
paymentToken:
|
|
196
|
+
}), e = `${j.toLowerCase()}:${Q.current.receiveAddress}?amount=${Q.current.paymentAmount}`, Pe(Q.current.expireAt), $({ paymentId: Q.current.paymentId })) : h === "subscription" && (Q.current = await C.createSubscriptionPayment({
|
|
197
|
+
paymentChain: j,
|
|
198
|
+
paymentToken: N,
|
|
193
199
|
orderId: g,
|
|
194
200
|
amountOfUsd: Z,
|
|
195
201
|
intervalDays: ge || 30
|
|
196
|
-
}), e = `${
|
|
202
|
+
}), e = `${j.toLowerCase()}:${Q.current.spenderAddress}?amount=${Q.current.approveAmount}`, Pe(Q.current.expireAt), $({ subscriptionId: Q.current.subscriptionId })), E("payment"), x?.("payment"), Ee(await QRCode.toDataURL(e, {
|
|
197
203
|
width: 200,
|
|
198
204
|
margin: 2,
|
|
199
205
|
errorCorrectionLevel: "H"
|
|
200
206
|
}));
|
|
201
207
|
} catch (e) {
|
|
202
|
-
let t = e instanceof Error ? e.message :
|
|
203
|
-
|
|
208
|
+
let t = e instanceof Error ? e.message : w.createPaymentFailed;
|
|
209
|
+
S?.(t), y?.(e);
|
|
204
210
|
}
|
|
205
211
|
}, $ = (e) => {
|
|
206
|
-
|
|
207
|
-
let t = () => defer(() => h === "subscription" ?
|
|
208
|
-
|
|
209
|
-
(e.status === "paid" || e.status === "approved") && (
|
|
212
|
+
U.current?.unsubscribe();
|
|
213
|
+
let t = () => defer(() => h === "subscription" ? C.checkSubscriptionPaymentStatus(e) : C.checkOnetimePaymentStatus(e)).pipe(timeout(15e3), retry({ delay: 2e3 }));
|
|
214
|
+
U.current = t().pipe(expand((e) => e.status === "pending" ? timer(2e3).pipe(switchMap(() => t())) : EMPTY), tap((e) => {
|
|
215
|
+
(e.status === "paid" || e.status === "approved") && (E("success"), x?.("success"), _e?.(e)), e.status === "expired" && (E("expired"), x?.("expired"), ve?.(e)), e.status === "failed" && (E("failed"), x?.("failed"), ye?.(e));
|
|
210
216
|
})).subscribe({
|
|
211
217
|
error: (e) => {
|
|
212
218
|
if (Q.current) {
|
|
213
|
-
let t = e instanceof Error ? e.message :
|
|
214
|
-
|
|
219
|
+
let t = e instanceof Error ? e.message : w.checkPaymentStatusFailed;
|
|
220
|
+
E("error"), x?.("error"), we(t), y?.(e);
|
|
215
221
|
}
|
|
216
222
|
},
|
|
217
223
|
complete: () => {
|
|
218
|
-
|
|
224
|
+
U.current?.unsubscribe();
|
|
219
225
|
}
|
|
220
226
|
});
|
|
221
227
|
};
|
|
222
228
|
return useEffect(() => {
|
|
223
|
-
|
|
229
|
+
A.length === 0 && Ie();
|
|
224
230
|
}, []), useEffect(() => {
|
|
225
|
-
q.length > 0 &&
|
|
231
|
+
q.length > 0 && P(q[0].symbol);
|
|
226
232
|
}, [q]), useEffect(() => (g && $({ orderId: g }), () => {
|
|
227
|
-
|
|
233
|
+
U.current?.unsubscribe(), Fe();
|
|
228
234
|
}), [g]), /* @__PURE__ */ jsx("div", {
|
|
229
235
|
className: "_cppay-content",
|
|
230
|
-
children:
|
|
236
|
+
children: T === "success" ? /* @__PURE__ */ jsxs("div", {
|
|
231
237
|
className: "_cppay-state-container",
|
|
232
238
|
children: [
|
|
233
239
|
/* @__PURE__ */ jsx("div", {
|
|
@@ -236,14 +242,14 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
236
242
|
}),
|
|
237
243
|
/* @__PURE__ */ jsx("h3", {
|
|
238
244
|
className: "_cppay-state-title",
|
|
239
|
-
children: h === "subscription" ?
|
|
245
|
+
children: h === "subscription" ? w.authorizationSuccess : w.paymentSuccess
|
|
240
246
|
}),
|
|
241
247
|
/* @__PURE__ */ jsx("p", {
|
|
242
248
|
className: "_cppay-state-message",
|
|
243
|
-
children: h === "subscription" ?
|
|
249
|
+
children: h === "subscription" ? w.subscriptionActivated : w.transactionCompleted
|
|
244
250
|
})
|
|
245
251
|
]
|
|
246
|
-
}) :
|
|
252
|
+
}) : T === "expired" ? /* @__PURE__ */ jsxs("div", {
|
|
247
253
|
className: "_cppay-state-container",
|
|
248
254
|
children: [
|
|
249
255
|
/* @__PURE__ */ jsx("div", {
|
|
@@ -252,45 +258,47 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
252
258
|
}),
|
|
253
259
|
/* @__PURE__ */ jsx("h3", {
|
|
254
260
|
className: "_cppay-state-title",
|
|
255
|
-
children:
|
|
261
|
+
children: w.paymentExpired
|
|
256
262
|
}),
|
|
257
263
|
/* @__PURE__ */ jsx("button", {
|
|
258
|
-
onClick: () =>
|
|
259
|
-
|
|
264
|
+
onClick: () => {
|
|
265
|
+
E("select"), x?.("select");
|
|
266
|
+
},
|
|
267
|
+
disabled: D || O,
|
|
260
268
|
className: "_cppay-btn _cppay-btn-text",
|
|
261
|
-
children:
|
|
269
|
+
children: w.returnButton
|
|
262
270
|
})
|
|
263
271
|
]
|
|
264
|
-
}) :
|
|
272
|
+
}) : T === "error" ? /* @__PURE__ */ jsxs("div", {
|
|
265
273
|
className: "_cppay-state-container",
|
|
266
274
|
children: [/* @__PURE__ */ jsx("div", {
|
|
267
275
|
className: "_cppay-state-icon",
|
|
268
276
|
children: "❌"
|
|
269
277
|
}), /* @__PURE__ */ jsx("h3", {
|
|
270
278
|
className: "_cppay-state-title",
|
|
271
|
-
children:
|
|
279
|
+
children: k || w.error
|
|
272
280
|
})]
|
|
273
|
-
}) :
|
|
281
|
+
}) : T === "failed" ? /* @__PURE__ */ jsxs("div", {
|
|
274
282
|
className: "_cppay-state-container",
|
|
275
283
|
children: [/* @__PURE__ */ jsx("div", {
|
|
276
284
|
className: "_cppay-state-icon",
|
|
277
285
|
children: "❌"
|
|
278
286
|
}), /* @__PURE__ */ jsx("h3", {
|
|
279
287
|
className: "_cppay-state-title",
|
|
280
|
-
children:
|
|
288
|
+
children: w.paymentFailed
|
|
281
289
|
})]
|
|
282
|
-
}) :
|
|
283
|
-
|
|
290
|
+
}) : T === "select" ? /* @__PURE__ */ jsxs("div", { children: [
|
|
291
|
+
b?.ChooseTop,
|
|
284
292
|
/* @__PURE__ */ jsxs("div", {
|
|
285
293
|
className: "_cppay-section",
|
|
286
294
|
children: [/* @__PURE__ */ jsx("label", {
|
|
287
295
|
className: "_cppay-label",
|
|
288
|
-
children:
|
|
296
|
+
children: w.paymentNetwork
|
|
289
297
|
}), /* @__PURE__ */ jsx("div", {
|
|
290
298
|
className: "_cppay-grid",
|
|
291
|
-
children:
|
|
292
|
-
onClick: () =>
|
|
293
|
-
className: `_cppay-select-btn ${
|
|
299
|
+
children: A.map((e) => /* @__PURE__ */ jsxs("button", {
|
|
300
|
+
onClick: () => M(e.chain),
|
|
301
|
+
className: `_cppay-select-btn ${j === e.chain ? "_cppay-selected" : ""}`,
|
|
294
302
|
children: [e.icon && /* @__PURE__ */ jsx("img", {
|
|
295
303
|
src: e.icon,
|
|
296
304
|
alt: e.chain
|
|
@@ -302,12 +310,12 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
302
310
|
className: "_cppay-section",
|
|
303
311
|
children: [/* @__PURE__ */ jsx("label", {
|
|
304
312
|
className: "_cppay-label",
|
|
305
|
-
children:
|
|
313
|
+
children: w.paymentToken
|
|
306
314
|
}), /* @__PURE__ */ jsx("div", {
|
|
307
315
|
className: "_cppay-grid",
|
|
308
316
|
children: q.map((e) => /* @__PURE__ */ jsxs("button", {
|
|
309
|
-
onClick: () =>
|
|
310
|
-
className: `_cppay-select-btn ${
|
|
317
|
+
onClick: () => P(e.symbol),
|
|
318
|
+
className: `_cppay-select-btn ${N === e.symbol ? "_cppay-selected" : ""}`,
|
|
311
319
|
children: [e.icon && /* @__PURE__ */ jsx("img", {
|
|
312
320
|
src: e.icon,
|
|
313
321
|
alt: e.symbol
|
|
@@ -315,7 +323,7 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
315
323
|
}, e.symbol))
|
|
316
324
|
})]
|
|
317
325
|
}),
|
|
318
|
-
|
|
326
|
+
b?.ChooseBottom,
|
|
319
327
|
/* @__PURE__ */ jsx("div", {
|
|
320
328
|
className: "_cppay-section",
|
|
321
329
|
children: /* @__PURE__ */ jsx("div", {
|
|
@@ -324,7 +332,7 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
324
332
|
className: "_cppay-price-row",
|
|
325
333
|
children: [/* @__PURE__ */ jsx("span", {
|
|
326
334
|
className: "_cppay-price-label",
|
|
327
|
-
children:
|
|
335
|
+
children: w.paymentAmount
|
|
328
336
|
}), /* @__PURE__ */ jsxs("div", {
|
|
329
337
|
className: "_cppay-price-amount",
|
|
330
338
|
children: [/* @__PURE__ */ jsxs("div", {
|
|
@@ -332,7 +340,7 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
332
340
|
children: [
|
|
333
341
|
Z ?? "-",
|
|
334
342
|
" ",
|
|
335
|
-
|
|
343
|
+
N ?? ""
|
|
336
344
|
]
|
|
337
345
|
}), /* @__PURE__ */ jsxs("div", {
|
|
338
346
|
className: "_cppay-price-sub",
|
|
@@ -344,10 +352,10 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
344
352
|
}),
|
|
345
353
|
/* @__PURE__ */ jsxs("div", {
|
|
346
354
|
className: "_cppay-section",
|
|
347
|
-
children: [
|
|
355
|
+
children: [k && /* @__PURE__ */ jsxs("div", {
|
|
348
356
|
className: "_cppay-error-tooltip-wrapper",
|
|
349
|
-
onMouseEnter: () =>
|
|
350
|
-
onMouseLeave: () =>
|
|
357
|
+
onMouseEnter: () => V(!0),
|
|
358
|
+
onMouseLeave: () => V(!1),
|
|
351
359
|
children: [/* @__PURE__ */ jsxs("div", {
|
|
352
360
|
className: "_cppay-error-tooltip",
|
|
353
361
|
children: [/* @__PURE__ */ jsx("svg", {
|
|
@@ -358,16 +366,16 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
358
366
|
d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z",
|
|
359
367
|
clipRule: "evenodd"
|
|
360
368
|
})
|
|
361
|
-
}), /* @__PURE__ */ jsx("span", { children:
|
|
362
|
-
}),
|
|
369
|
+
}), /* @__PURE__ */ jsx("span", { children: k })]
|
|
370
|
+
}), Me && /* @__PURE__ */ jsx("div", {
|
|
363
371
|
className: "_cppay-error-tooltip-full",
|
|
364
|
-
children:
|
|
372
|
+
children: k
|
|
365
373
|
})]
|
|
366
374
|
}), /* @__PURE__ */ jsx("button", {
|
|
367
|
-
onClick:
|
|
368
|
-
disabled: !
|
|
375
|
+
onClick: Ve,
|
|
376
|
+
disabled: !j || !N || D,
|
|
369
377
|
className: "_cppay-btn _cppay-btn-primary",
|
|
370
|
-
children:
|
|
378
|
+
children: D ? w.processing : w.continuePayment
|
|
371
379
|
})]
|
|
372
380
|
})
|
|
373
381
|
] }) : /* @__PURE__ */ jsxs("div", { children: [
|
|
@@ -375,8 +383,8 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
375
383
|
className: "_cppay-qr-container",
|
|
376
384
|
children: /* @__PURE__ */ jsx("div", {
|
|
377
385
|
className: "_cppay-qr-code",
|
|
378
|
-
children:
|
|
379
|
-
src:
|
|
386
|
+
children: F && /* @__PURE__ */ jsx("img", {
|
|
387
|
+
src: F,
|
|
380
388
|
alt: "Payment QR Code",
|
|
381
389
|
className: "_cppay-qr-image"
|
|
382
390
|
})
|
|
@@ -393,7 +401,7 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
393
401
|
className: "_cppay-info-flex-child",
|
|
394
402
|
children: [/* @__PURE__ */ jsx("div", {
|
|
395
403
|
className: "_cppay-info-label",
|
|
396
|
-
children: h === "subscription" ?
|
|
404
|
+
children: h === "subscription" ? w.authorizationAmount : w.paymentAmount
|
|
397
405
|
}), /* @__PURE__ */ jsxs("div", {
|
|
398
406
|
className: "_cppay-info-value _cppay-info-value-flex",
|
|
399
407
|
children: [/* @__PURE__ */ jsx("span", { children: h === "subscription" ? `${X(Q.current.approveAmount, Y(J.symbol))} ${J.symbol}` : `${X(Q.current.paymentAmount, Y(J.symbol))} ${J.symbol}` }), /* @__PURE__ */ jsxs("span", { children: ["≈ $", _] })]
|
|
@@ -407,9 +415,9 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
407
415
|
className: "_cppay-info-flex-child",
|
|
408
416
|
children: [/* @__PURE__ */ jsxs("div", {
|
|
409
417
|
className: "_cppay-info-label _cppay-info-label-flex",
|
|
410
|
-
children: [/* @__PURE__ */ jsx("span", { children: h === "subscription" ?
|
|
418
|
+
children: [/* @__PURE__ */ jsx("span", { children: h === "subscription" ? w.authorizationContractAddress : w.paymentAddress }), ke && /* @__PURE__ */ jsxs("span", {
|
|
411
419
|
className: "_cppay-countdown",
|
|
412
|
-
children: ["⏰ ",
|
|
420
|
+
children: ["⏰ ", ke]
|
|
413
421
|
})]
|
|
414
422
|
}), /* @__PURE__ */ jsxs("div", {
|
|
415
423
|
className: "_cppay-address-row",
|
|
@@ -418,16 +426,16 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
418
426
|
if (!Q.current) return;
|
|
419
427
|
let e = h === "subscription" ? Q.current.spenderAddress : Q.current.receiveAddress;
|
|
420
428
|
if (e) try {
|
|
421
|
-
await navigator.clipboard.writeText(e),
|
|
422
|
-
|
|
429
|
+
await navigator.clipboard.writeText(e), je(!0), setTimeout(() => {
|
|
430
|
+
je(!1);
|
|
423
431
|
}, 2e3);
|
|
424
432
|
} catch (e) {
|
|
425
433
|
console.error("复制失败:", e);
|
|
426
434
|
}
|
|
427
435
|
},
|
|
428
|
-
className: `_cppay-copy-btn ${
|
|
429
|
-
title:
|
|
430
|
-
children:
|
|
436
|
+
className: `_cppay-copy-btn ${B ? "_cppay-copy-success" : ""}`,
|
|
437
|
+
title: B ? w.copied : w.copyAddress,
|
|
438
|
+
children: B ? /* @__PURE__ */ jsx("svg", {
|
|
431
439
|
className: "_cppay-copy-icon",
|
|
432
440
|
viewBox: "0 0 24 24",
|
|
433
441
|
fill: "currentColor",
|
|
@@ -455,18 +463,18 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
455
463
|
className: "_cppay-info-box _cppay-subscription-box",
|
|
456
464
|
children: [/* @__PURE__ */ jsx("div", {
|
|
457
465
|
className: "_cppay-info-label _cppay-subscription-label",
|
|
458
|
-
children:
|
|
466
|
+
children: w.subscriptionNotice
|
|
459
467
|
}), /* @__PURE__ */ jsx("div", {
|
|
460
468
|
className: "_cppay-info-value _cppay-subscription-message",
|
|
461
|
-
children:
|
|
469
|
+
children: w.subscriptionNoticeMessage
|
|
462
470
|
})]
|
|
463
471
|
})
|
|
464
472
|
]
|
|
465
473
|
}),
|
|
466
|
-
|
|
474
|
+
k && /* @__PURE__ */ jsxs("div", {
|
|
467
475
|
className: "_cppay-error-tooltip-wrapper",
|
|
468
|
-
onMouseEnter: () =>
|
|
469
|
-
onMouseLeave: () =>
|
|
476
|
+
onMouseEnter: () => V(!0),
|
|
477
|
+
onMouseLeave: () => V(!1),
|
|
470
478
|
children: [/* @__PURE__ */ jsxs("div", {
|
|
471
479
|
className: "_cppay-error-tooltip",
|
|
472
480
|
children: [/* @__PURE__ */ jsx("svg", {
|
|
@@ -477,30 +485,30 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
477
485
|
d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z",
|
|
478
486
|
clipRule: "evenodd"
|
|
479
487
|
})
|
|
480
|
-
}), /* @__PURE__ */ jsx("span", { children:
|
|
481
|
-
}),
|
|
488
|
+
}), /* @__PURE__ */ jsx("span", { children: k })]
|
|
489
|
+
}), Me && /* @__PURE__ */ jsx("div", {
|
|
482
490
|
className: "_cppay-error-tooltip-full",
|
|
483
|
-
children:
|
|
491
|
+
children: k
|
|
484
492
|
})]
|
|
485
493
|
}),
|
|
486
|
-
!
|
|
494
|
+
!O && /* @__PURE__ */ jsx("div", {
|
|
487
495
|
className: "_cppay-section",
|
|
488
|
-
children:
|
|
489
|
-
onClick:
|
|
490
|
-
disabled:
|
|
496
|
+
children: I ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("button", {
|
|
497
|
+
onClick: Be,
|
|
498
|
+
disabled: D,
|
|
491
499
|
className: "_cppay-btn _cppay-btn-primary",
|
|
492
|
-
children:
|
|
500
|
+
children: D ? h === "subscription" ? w.authorizing : w.processing : h === "subscription" ? `💳 ${w.connectWallet}` : `💳 ${w.walletPay}`
|
|
493
501
|
}), /* @__PURE__ */ jsxs("button", {
|
|
494
|
-
onClick:
|
|
495
|
-
disabled:
|
|
502
|
+
onClick: G,
|
|
503
|
+
disabled: D,
|
|
496
504
|
className: "_cppay-btn _cppay-wallet-address-btn",
|
|
497
|
-
title:
|
|
505
|
+
title: w.clickToModifyWallet,
|
|
498
506
|
children: [/* @__PURE__ */ jsxs("span", {
|
|
499
507
|
className: "_cppay-wallet-address-text",
|
|
500
508
|
children: [
|
|
501
|
-
|
|
509
|
+
I.slice(0, 10),
|
|
502
510
|
"...",
|
|
503
|
-
|
|
511
|
+
I.slice(-4)
|
|
504
512
|
]
|
|
505
513
|
}), /* @__PURE__ */ jsx("svg", {
|
|
506
514
|
className: "_cppay-wallet-arrow",
|
|
@@ -511,63 +519,58 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
511
519
|
children: /* @__PURE__ */ jsx("polyline", { points: "6 9 12 15 18 9" })
|
|
512
520
|
})]
|
|
513
521
|
})] }) : /* @__PURE__ */ jsx("button", {
|
|
514
|
-
onClick:
|
|
515
|
-
disabled:
|
|
522
|
+
onClick: G,
|
|
523
|
+
disabled: De,
|
|
516
524
|
className: "_cppay-btn _cppay-btn-secondary _cppay-connect-wallet-btn",
|
|
517
|
-
children: /* @__PURE__ */ jsx("span", { children:
|
|
525
|
+
children: /* @__PURE__ */ jsx("span", { children: De ? w.processing : `💳 ${w.connectWallet}` })
|
|
518
526
|
})
|
|
519
527
|
}),
|
|
520
528
|
/* @__PURE__ */ jsx("div", {
|
|
521
529
|
className: "_cppay-section",
|
|
522
530
|
children: /* @__PURE__ */ jsx("button", {
|
|
523
531
|
onClick: () => {
|
|
524
|
-
|
|
532
|
+
E("payment"), x?.("payment");
|
|
525
533
|
},
|
|
526
|
-
disabled:
|
|
534
|
+
disabled: O,
|
|
527
535
|
className: "_cppay-btn _cppay-btn-primary",
|
|
528
|
-
children:
|
|
536
|
+
children: O ? w.checking : w.completedPayment
|
|
529
537
|
})
|
|
530
538
|
}),
|
|
531
539
|
/* @__PURE__ */ jsx("hr", { className: "_cppay-divider" }),
|
|
532
540
|
/* @__PURE__ */ jsx("div", {
|
|
533
541
|
className: "_cppay-section",
|
|
534
542
|
children: /* @__PURE__ */ jsx("button", {
|
|
535
|
-
onClick: () =>
|
|
536
|
-
|
|
543
|
+
onClick: () => {
|
|
544
|
+
E("select"), x?.("select");
|
|
545
|
+
},
|
|
546
|
+
disabled: D || O,
|
|
537
547
|
className: "_cppay-btn _cppay-btn-text",
|
|
538
|
-
children:
|
|
548
|
+
children: w.changePaymentMethod
|
|
539
549
|
})
|
|
540
550
|
})
|
|
541
551
|
] })
|
|
542
552
|
});
|
|
543
|
-
}, PaymentDialog_default = ({ open: e, onClose: t, ott: n, apikey: i, plain:
|
|
544
|
-
let
|
|
553
|
+
}, PaymentDialog_default = ({ open: e, onClose: t, ott: n, apikey: i, plain: se, orderId: a, amount: o, intervalDays: s, locale: c, onExpired: l, onSuccess: ce, onFailed: le, onError: ue, Slots: de }) => {
|
|
554
|
+
let fe = useRef(!0), [pe, me] = useState("select"), [u, he] = useState(!1), [d, f] = useState(!1);
|
|
545
555
|
useEffect(() => {
|
|
546
|
-
|
|
547
|
-
let e = setTimeout(() => {
|
|
548
|
-
m();
|
|
549
|
-
}, 1e3);
|
|
550
|
-
return () => clearTimeout(e);
|
|
551
|
-
}
|
|
552
|
-
}, [d]), useEffect(() => {
|
|
553
|
-
e || (de("select"), he(void 0), fe(!1), pe(!1));
|
|
556
|
+
e ? fe.current = !0 : (me("select"), he(!1), f(!1), fe.current = !0);
|
|
554
557
|
}, [e]), useEffect(() => {
|
|
555
558
|
if (!e) return;
|
|
556
559
|
let t = (e) => {
|
|
557
|
-
e.key === "Escape" && !
|
|
560
|
+
e.key === "Escape" && !u && !d && p();
|
|
558
561
|
};
|
|
559
562
|
return window.addEventListener("keydown", t), () => window.removeEventListener("keydown", t);
|
|
560
563
|
}, [
|
|
561
564
|
e,
|
|
562
|
-
|
|
563
|
-
|
|
565
|
+
u,
|
|
566
|
+
d
|
|
564
567
|
]);
|
|
565
|
-
let
|
|
566
|
-
|
|
567
|
-
},
|
|
568
|
+
let p = () => {
|
|
569
|
+
u || d || t();
|
|
570
|
+
}, m = useMemo(() => getLocaleMessages(c), [c]);
|
|
568
571
|
return e ? /* @__PURE__ */ jsx("div", {
|
|
569
572
|
className: "_cppay-overlay",
|
|
570
|
-
onClick: (e) => e.target === e.currentTarget && !
|
|
573
|
+
onClick: (e) => e.target === e.currentTarget && !u && !d && p(),
|
|
571
574
|
children: /* @__PURE__ */ jsxs("div", {
|
|
572
575
|
className: "_cppay-dialog",
|
|
573
576
|
children: [/* @__PURE__ */ jsxs("div", {
|
|
@@ -575,18 +578,18 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
575
578
|
children: [/* @__PURE__ */ jsx("h2", {
|
|
576
579
|
className: "_cppay-title",
|
|
577
580
|
children: (() => {
|
|
578
|
-
switch (
|
|
579
|
-
case "success": return
|
|
580
|
-
case "expired": return
|
|
581
|
-
case "failed": return
|
|
582
|
-
case "error": return
|
|
583
|
-
case "payment": return
|
|
584
|
-
default: return
|
|
581
|
+
switch (pe) {
|
|
582
|
+
case "success": return m.paymentResult;
|
|
583
|
+
case "expired": return m.paymentExpired;
|
|
584
|
+
case "failed": return m.paymentFailed;
|
|
585
|
+
case "error": return m.error;
|
|
586
|
+
case "payment": return m.completePayment;
|
|
587
|
+
default: return m.selectPaymentMethod;
|
|
585
588
|
}
|
|
586
589
|
})()
|
|
587
590
|
}), /* @__PURE__ */ jsx("button", {
|
|
588
|
-
onClick:
|
|
589
|
-
disabled:
|
|
591
|
+
onClick: p,
|
|
592
|
+
disabled: u || d,
|
|
590
593
|
className: "_cppay-close-btn",
|
|
591
594
|
children: /* @__PURE__ */ jsx("svg", {
|
|
592
595
|
fill: "none",
|
|
@@ -603,65 +606,62 @@ var PaymentContent_default = ({ apikey: t, ott: n, plain: h, orderId: g, amount:
|
|
|
603
606
|
}), /* @__PURE__ */ jsx(PaymentContent_default, {
|
|
604
607
|
apikey: i,
|
|
605
608
|
ott: n,
|
|
606
|
-
plain:
|
|
607
|
-
orderId:
|
|
608
|
-
amount:
|
|
609
|
-
intervalDays:
|
|
610
|
-
locale:
|
|
611
|
-
onSuccess:
|
|
612
|
-
onExpired:
|
|
613
|
-
onFailed:
|
|
614
|
-
onError:
|
|
615
|
-
Slots:
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
isCheckingPayment: p,
|
|
620
|
-
error: me,
|
|
621
|
-
onErrorChange: he
|
|
609
|
+
plain: se,
|
|
610
|
+
orderId: a,
|
|
611
|
+
amount: o,
|
|
612
|
+
intervalDays: s,
|
|
613
|
+
locale: c,
|
|
614
|
+
onSuccess: ce,
|
|
615
|
+
onExpired: l,
|
|
616
|
+
onFailed: le,
|
|
617
|
+
onError: ue,
|
|
618
|
+
Slots: de,
|
|
619
|
+
onPaymentStepChange: me,
|
|
620
|
+
onLoadingChange: he,
|
|
621
|
+
onIsCheckingPaymentChange: f
|
|
622
622
|
})]
|
|
623
623
|
})
|
|
624
624
|
}) : null;
|
|
625
625
|
}, CppayContext = createContext(null);
|
|
626
626
|
const CppayProvider = ({ apikey: e, children: t }) => {
|
|
627
|
-
let [n, r] = useState(!1), [i,
|
|
628
|
-
|
|
629
|
-
}, []),
|
|
627
|
+
let [n, r] = useState(!1), [i, se] = useState(null), a = useCallback((e) => {
|
|
628
|
+
se(e), r(!0);
|
|
629
|
+
}, []), o = useCallback(() => {
|
|
630
630
|
r(!1);
|
|
631
|
-
}, []),
|
|
631
|
+
}, []), s = useCallback(() => {
|
|
632
632
|
r(!1);
|
|
633
|
-
}, []),
|
|
633
|
+
}, []), c = useCallback((e) => {
|
|
634
634
|
i?.onSuccess?.(e), setTimeout(() => r(!1), 1e3);
|
|
635
|
-
}, [i]),
|
|
635
|
+
}, [i]), l = useCallback((e) => {
|
|
636
636
|
i?.onExpired?.(e);
|
|
637
|
-
}, [i]), u = useCallback((e) => {
|
|
638
|
-
i?.onFailed?.(e);
|
|
639
637
|
}, [i]), ce = useCallback((e) => {
|
|
638
|
+
i?.onFailed?.(e);
|
|
639
|
+
}, [i]), le = useCallback((e) => {
|
|
640
640
|
i?.onError?.(e);
|
|
641
641
|
}, [i]);
|
|
642
642
|
return useEffect(() => {
|
|
643
643
|
if (!n) return;
|
|
644
644
|
let e = (e) => {
|
|
645
|
-
e.key === "Escape" &&
|
|
645
|
+
e.key === "Escape" && s();
|
|
646
646
|
};
|
|
647
647
|
return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
|
|
648
|
-
}, [n,
|
|
648
|
+
}, [n, s]), /* @__PURE__ */ jsxs(CppayContext.Provider, {
|
|
649
649
|
value: {
|
|
650
|
-
showPayment:
|
|
651
|
-
closePayment:
|
|
650
|
+
showPayment: a,
|
|
651
|
+
closePayment: o
|
|
652
652
|
},
|
|
653
653
|
children: [t, i && /* @__PURE__ */ jsx(PaymentDialog_default, {
|
|
654
654
|
open: n,
|
|
655
|
-
onClose:
|
|
655
|
+
onClose: s,
|
|
656
656
|
apikey: e,
|
|
657
657
|
plain: i.plain,
|
|
658
658
|
orderId: i.orderId,
|
|
659
659
|
amount: i.amount,
|
|
660
660
|
intervalDays: i.intervalDays,
|
|
661
|
-
onSuccess:
|
|
662
|
-
onExpired:
|
|
663
|
-
onFailed:
|
|
664
|
-
onError:
|
|
661
|
+
onSuccess: c,
|
|
662
|
+
onExpired: l,
|
|
663
|
+
onFailed: ce,
|
|
664
|
+
onError: le
|
|
665
665
|
})]
|
|
666
666
|
});
|
|
667
667
|
}, useCppayPayment = () => {
|