@swype-org/react-sdk 0.1.68 → 0.1.70
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 +59 -28
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +59 -28
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1615,6 +1615,9 @@ function resolvePostAuthStep(state) {
|
|
|
1615
1615
|
}
|
|
1616
1616
|
return { step: "open-wallet", clearPersistedFlow: false };
|
|
1617
1617
|
}
|
|
1618
|
+
if (state.mobileSetupInProgress && !hasActiveWallet(state.accounts)) {
|
|
1619
|
+
return { step: "open-wallet", clearPersistedFlow: false };
|
|
1620
|
+
}
|
|
1618
1621
|
if ((state.accounts.length === 0 || !hasActiveWallet(state.accounts)) && !state.connectingNewAccount) {
|
|
1619
1622
|
return { step: "wallet-picker", clearPersistedFlow: false };
|
|
1620
1623
|
}
|
|
@@ -1630,6 +1633,9 @@ function resolveRestoredMobileFlow(transferStatus, isSetup) {
|
|
|
1630
1633
|
if (transferStatus === "FAILED") {
|
|
1631
1634
|
return { kind: "resume-failed", step: "success", clearPersistedFlow: true };
|
|
1632
1635
|
}
|
|
1636
|
+
if (transferStatus === "SENDING" || transferStatus === "SENT") {
|
|
1637
|
+
return { kind: "resume-processing", step: "processing", clearPersistedFlow: true };
|
|
1638
|
+
}
|
|
1633
1639
|
if (isSetup) {
|
|
1634
1640
|
return { kind: "resume-stale-setup", step: "wallet-picker", clearPersistedFlow: true };
|
|
1635
1641
|
}
|
|
@@ -3421,6 +3427,8 @@ var outlineBtnWrapStyle = {
|
|
|
3421
3427
|
function SuccessScreen({
|
|
3422
3428
|
amount,
|
|
3423
3429
|
currency,
|
|
3430
|
+
succeeded,
|
|
3431
|
+
error,
|
|
3424
3432
|
merchantName,
|
|
3425
3433
|
sourceName,
|
|
3426
3434
|
remainingLimit,
|
|
@@ -3431,7 +3439,8 @@ function SuccessScreen({
|
|
|
3431
3439
|
autoCloseSeconds
|
|
3432
3440
|
}) {
|
|
3433
3441
|
const { tokens } = useSwypeConfig();
|
|
3434
|
-
const
|
|
3442
|
+
const effectiveAutoClose = succeeded ? autoCloseSeconds : void 0;
|
|
3443
|
+
const [countdown, setCountdown] = useState(effectiveAutoClose ?? 0);
|
|
3435
3444
|
const doneCalledRef = useRef(false);
|
|
3436
3445
|
const handleDone = useCallback(() => {
|
|
3437
3446
|
if (doneCalledRef.current) return;
|
|
@@ -3439,7 +3448,7 @@ function SuccessScreen({
|
|
|
3439
3448
|
onDone();
|
|
3440
3449
|
}, [onDone]);
|
|
3441
3450
|
useEffect(() => {
|
|
3442
|
-
if (!
|
|
3451
|
+
if (!effectiveAutoClose || effectiveAutoClose <= 0) return;
|
|
3443
3452
|
const intervalId = window.setInterval(() => {
|
|
3444
3453
|
setCountdown((prev) => {
|
|
3445
3454
|
if (prev <= 1) {
|
|
@@ -3450,18 +3459,18 @@ function SuccessScreen({
|
|
|
3450
3459
|
});
|
|
3451
3460
|
}, 1e3);
|
|
3452
3461
|
return () => window.clearInterval(intervalId);
|
|
3453
|
-
}, [
|
|
3462
|
+
}, [effectiveAutoClose]);
|
|
3454
3463
|
useEffect(() => {
|
|
3455
|
-
if (
|
|
3464
|
+
if (effectiveAutoClose && countdown === 0) {
|
|
3456
3465
|
handleDone();
|
|
3457
3466
|
}
|
|
3458
|
-
}, [
|
|
3467
|
+
}, [effectiveAutoClose, countdown, handleDone]);
|
|
3459
3468
|
return /* @__PURE__ */ jsxs(
|
|
3460
3469
|
ScreenLayout,
|
|
3461
3470
|
{
|
|
3462
3471
|
footer: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3463
|
-
/* @__PURE__ */ jsx(PrimaryButton, { onClick: handleDone, children: "Done" }),
|
|
3464
|
-
|
|
3472
|
+
/* @__PURE__ */ jsx(PrimaryButton, { onClick: handleDone, children: succeeded ? "Done" : "Try again" }),
|
|
3473
|
+
effectiveAutoClose != null && effectiveAutoClose > 0 && /* @__PURE__ */ jsxs("p", { style: countdownStyle(tokens.textMuted), children: [
|
|
3465
3474
|
"Returning to app in ",
|
|
3466
3475
|
countdown,
|
|
3467
3476
|
"s\u2026"
|
|
@@ -3477,26 +3486,32 @@ function SuccessScreen({
|
|
|
3477
3486
|
}
|
|
3478
3487
|
),
|
|
3479
3488
|
/* @__PURE__ */ jsxs("div", { style: contentStyle4, children: [
|
|
3480
|
-
|
|
3481
|
-
|
|
3482
|
-
"
|
|
3483
|
-
|
|
3484
|
-
|
|
3485
|
-
|
|
3486
|
-
|
|
3487
|
-
|
|
3488
|
-
|
|
3489
|
+
succeeded ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3490
|
+
/* @__PURE__ */ jsx(IconCircle, { variant: "success", size: 64, children: /* @__PURE__ */ jsx("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsx("path", { d: "M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z", fill: tokens.success }) }) }),
|
|
3491
|
+
/* @__PURE__ */ jsxs("h2", { style: headingStyle6(tokens.text), children: [
|
|
3492
|
+
"$",
|
|
3493
|
+
amount.toFixed(2),
|
|
3494
|
+
" deposited"
|
|
3495
|
+
] }),
|
|
3496
|
+
merchantName && /* @__PURE__ */ jsxs("p", { style: subtitleStyle6(tokens.textSecondary), children: [
|
|
3497
|
+
"to ",
|
|
3498
|
+
merchantName
|
|
3499
|
+
] })
|
|
3500
|
+
] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3501
|
+
/* @__PURE__ */ jsx(IconCircle, { variant: "error", size: 64, children: /* @__PURE__ */ jsx("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z", fill: tokens.error }) }) }),
|
|
3502
|
+
/* @__PURE__ */ jsx("h2", { style: headingStyle6(tokens.text), children: "Transfer failed" }),
|
|
3503
|
+
error && /* @__PURE__ */ jsx("p", { style: subtitleStyle6(tokens.error), children: error })
|
|
3489
3504
|
] }),
|
|
3490
3505
|
/* @__PURE__ */ jsxs("div", { style: summaryCardStyle(tokens), children: [
|
|
3491
3506
|
sourceName && /* @__PURE__ */ jsxs("div", { style: summaryRowStyle, children: [
|
|
3492
3507
|
/* @__PURE__ */ jsx("span", { style: summaryLabelStyle(tokens.textMuted), children: "From" }),
|
|
3493
3508
|
/* @__PURE__ */ jsx("span", { style: summaryValueStyle(tokens.text), children: sourceName })
|
|
3494
3509
|
] }),
|
|
3495
|
-
/* @__PURE__ */ jsxs("div", { style: summaryRowStyle, children: [
|
|
3510
|
+
succeeded && /* @__PURE__ */ jsxs("div", { style: summaryRowStyle, children: [
|
|
3496
3511
|
/* @__PURE__ */ jsx("span", { style: summaryLabelStyle(tokens.textMuted), children: "Time" }),
|
|
3497
3512
|
/* @__PURE__ */ jsx("span", { style: summaryValueStyle(tokens.text), children: "just now" })
|
|
3498
3513
|
] }),
|
|
3499
|
-
remainingLimit != null && /* @__PURE__ */ jsxs("div", { style: summaryRowStyle, children: [
|
|
3514
|
+
succeeded && remainingLimit != null && /* @__PURE__ */ jsxs("div", { style: summaryRowStyle, children: [
|
|
3500
3515
|
/* @__PURE__ */ jsx("span", { style: summaryLabelStyle(tokens.textMuted), children: "Remaining limit" }),
|
|
3501
3516
|
/* @__PURE__ */ jsxs("span", { style: { ...summaryValueStyle(tokens.text), color: tokens.accent }, children: [
|
|
3502
3517
|
"$",
|
|
@@ -3504,7 +3519,7 @@ function SuccessScreen({
|
|
|
3504
3519
|
] })
|
|
3505
3520
|
] })
|
|
3506
3521
|
] }),
|
|
3507
|
-
onIncreaseLimits && /* @__PURE__ */ jsxs("div", { style: upsellCardStyle(tokens), children: [
|
|
3522
|
+
succeeded && onIncreaseLimits && /* @__PURE__ */ jsxs("div", { style: upsellCardStyle(tokens), children: [
|
|
3508
3523
|
/* @__PURE__ */ jsxs("div", { style: upsellHeaderStyle, children: [
|
|
3509
3524
|
/* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", style: { marginRight: 6 }, children: /* @__PURE__ */ jsx("path", { d: "M7 14l5-5 5 5", stroke: tokens.accent, strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }),
|
|
3510
3525
|
/* @__PURE__ */ jsx("strong", { children: "Want higher limits?" })
|
|
@@ -3986,12 +4001,11 @@ var radioDotStyle2 = (color) => ({
|
|
|
3986
4001
|
borderRadius: "50%",
|
|
3987
4002
|
background: color
|
|
3988
4003
|
});
|
|
3989
|
-
var STEP_LABELS = ["Creating transfer", "Verifying", "Sent"
|
|
4004
|
+
var STEP_LABELS = ["Creating transfer", "Verifying", "Sent"];
|
|
3990
4005
|
var PHASE_ACTIVE_INDEX = {
|
|
3991
4006
|
creating: 0,
|
|
3992
4007
|
verifying: 1,
|
|
3993
|
-
sent: 2
|
|
3994
|
-
done: 4
|
|
4008
|
+
sent: 2
|
|
3995
4009
|
};
|
|
3996
4010
|
function buildSteps(phase) {
|
|
3997
4011
|
const activeIdx = PHASE_ACTIVE_INDEX[phase];
|
|
@@ -4510,13 +4524,13 @@ function SwypePaymentInner({
|
|
|
4510
4524
|
polling.startPolling(persisted.transferId);
|
|
4511
4525
|
}, [polling]);
|
|
4512
4526
|
const handleAuthorizedMobileReturn = useCallback(async (authorizedTransfer, isSetup) => {
|
|
4513
|
-
setTransfer(authorizedTransfer);
|
|
4514
4527
|
polling.stopPolling();
|
|
4515
4528
|
if (isSetup) {
|
|
4516
4529
|
mobileSetupFlowRef.current = false;
|
|
4517
4530
|
clearMobileFlowState();
|
|
4518
4531
|
try {
|
|
4519
4532
|
await reloadAccounts();
|
|
4533
|
+
setTransfer(null);
|
|
4520
4534
|
setError(null);
|
|
4521
4535
|
setDeeplinkUri(null);
|
|
4522
4536
|
setMobileFlow(false);
|
|
@@ -4529,6 +4543,7 @@ function SwypePaymentInner({
|
|
|
4529
4543
|
}
|
|
4530
4544
|
return;
|
|
4531
4545
|
}
|
|
4546
|
+
setTransfer(authorizedTransfer);
|
|
4532
4547
|
mobileSetupFlowRef.current = false;
|
|
4533
4548
|
clearMobileFlowState();
|
|
4534
4549
|
setError(null);
|
|
@@ -4645,6 +4660,7 @@ function SwypePaymentInner({
|
|
|
4645
4660
|
hasPasskey: true,
|
|
4646
4661
|
accounts: accts,
|
|
4647
4662
|
persistedMobileFlow: persisted,
|
|
4663
|
+
mobileSetupInProgress: false,
|
|
4648
4664
|
connectingNewAccount: false
|
|
4649
4665
|
});
|
|
4650
4666
|
if (resolved.clearPersistedFlow) {
|
|
@@ -4685,6 +4701,16 @@ function SwypePaymentInner({
|
|
|
4685
4701
|
setStep("success");
|
|
4686
4702
|
return;
|
|
4687
4703
|
}
|
|
4704
|
+
if (mobileResolution.kind === "resume-processing") {
|
|
4705
|
+
clearMobileFlowState();
|
|
4706
|
+
setMobileFlow(false);
|
|
4707
|
+
setDeeplinkUri(null);
|
|
4708
|
+
setTransfer(existingTransfer);
|
|
4709
|
+
setError(null);
|
|
4710
|
+
setStep("processing");
|
|
4711
|
+
polling.startPolling(existingTransfer.id);
|
|
4712
|
+
return;
|
|
4713
|
+
}
|
|
4688
4714
|
if (mobileResolution.kind === "resume-stale-setup") {
|
|
4689
4715
|
clearMobileFlowState();
|
|
4690
4716
|
if (!cancelled) setStep("wallet-picker");
|
|
@@ -5181,6 +5207,7 @@ function SwypePaymentInner({
|
|
|
5181
5207
|
processingStartedAtRef.current = null;
|
|
5182
5208
|
pollingTransferIdRef.current = null;
|
|
5183
5209
|
mobileSigningTransferIdRef.current = null;
|
|
5210
|
+
preSelectSourceStepRef.current = null;
|
|
5184
5211
|
setConnectingNewAccount(false);
|
|
5185
5212
|
setSelectedWalletId(null);
|
|
5186
5213
|
if (accounts.length > 0) setSelectedAccountId(accounts[0].id);
|
|
@@ -5211,6 +5238,7 @@ function SwypePaymentInner({
|
|
|
5211
5238
|
setAmount(depositAmount != null ? depositAmount.toString() : "");
|
|
5212
5239
|
setMobileFlow(false);
|
|
5213
5240
|
setDeeplinkUri(null);
|
|
5241
|
+
preSelectSourceStepRef.current = null;
|
|
5214
5242
|
resetHeadlessLogin();
|
|
5215
5243
|
}, [logout, polling, depositAmount, resetHeadlessLogin]);
|
|
5216
5244
|
const handleConfirmSign = useCallback(async () => {
|
|
@@ -5221,12 +5249,13 @@ function SwypePaymentInner({
|
|
|
5221
5249
|
setTransfer(signedTransfer);
|
|
5222
5250
|
clearMobileFlowState();
|
|
5223
5251
|
setStep("processing");
|
|
5252
|
+
polling.startPolling(t.id);
|
|
5224
5253
|
} catch (err) {
|
|
5225
5254
|
const msg = err instanceof Error ? err.message : "Failed to sign transfer";
|
|
5226
5255
|
setError(msg);
|
|
5227
5256
|
onError?.(msg);
|
|
5228
5257
|
}
|
|
5229
|
-
}, [transfer, polling.transfer, transferSigning, onError]);
|
|
5258
|
+
}, [transfer, polling.transfer, polling.startPolling, transferSigning, onError]);
|
|
5230
5259
|
if (!ready) {
|
|
5231
5260
|
return /* @__PURE__ */ jsx(ScreenLayout, { children: /* @__PURE__ */ jsx("div", { style: { textAlign: "center", padding: "48px 0", flex: 1, display: "flex", alignItems: "center", justifyContent: "center" }, children: /* @__PURE__ */ jsx(Spinner, { label: "Initializing..." }) }) });
|
|
5232
5261
|
}
|
|
@@ -5351,7 +5380,7 @@ function SwypePaymentInner({
|
|
|
5351
5380
|
}
|
|
5352
5381
|
if (step === "processing") {
|
|
5353
5382
|
const polledStatus = polling.transfer?.status;
|
|
5354
|
-
const transferPhase = creatingTransfer ? "creating" :
|
|
5383
|
+
const transferPhase = creatingTransfer ? "creating" : polledStatus === "SENDING" || polledStatus === "SENT" ? "sent" : "verifying";
|
|
5355
5384
|
return /* @__PURE__ */ jsx(
|
|
5356
5385
|
TransferStatusScreen,
|
|
5357
5386
|
{
|
|
@@ -5382,7 +5411,7 @@ function SwypePaymentInner({
|
|
|
5382
5411
|
);
|
|
5383
5412
|
}
|
|
5384
5413
|
if (step === "success") {
|
|
5385
|
-
transfer?.status === "COMPLETED";
|
|
5414
|
+
const succeeded = transfer?.status === "COMPLETED";
|
|
5386
5415
|
const displayAmount = transfer?.amount?.amount ?? 0;
|
|
5387
5416
|
const displayCurrency = transfer?.amount?.currency ?? "USD";
|
|
5388
5417
|
return /* @__PURE__ */ jsx(
|
|
@@ -5390,12 +5419,14 @@ function SwypePaymentInner({
|
|
|
5390
5419
|
{
|
|
5391
5420
|
amount: displayAmount,
|
|
5392
5421
|
currency: displayCurrency,
|
|
5422
|
+
succeeded,
|
|
5423
|
+
error,
|
|
5393
5424
|
merchantName,
|
|
5394
5425
|
sourceName,
|
|
5395
|
-
remainingLimit: (() => {
|
|
5426
|
+
remainingLimit: succeeded ? (() => {
|
|
5396
5427
|
const limit = selectedAccount?.remainingAllowance ?? oneTapLimit;
|
|
5397
5428
|
return limit > displayAmount ? limit - displayAmount : 0;
|
|
5398
|
-
})(),
|
|
5429
|
+
})() : void 0,
|
|
5399
5430
|
onDone: onDismiss ?? handleNewPayment,
|
|
5400
5431
|
onLogout: handleLogout,
|
|
5401
5432
|
autoCloseSeconds
|