@swype-org/react-sdk 0.1.77 → 0.1.80
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 +125 -9
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +125 -9
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -689,6 +689,11 @@ function isInCrossOriginIframe() {
|
|
|
689
689
|
return true;
|
|
690
690
|
}
|
|
691
691
|
}
|
|
692
|
+
function isSafari() {
|
|
693
|
+
if (typeof navigator === "undefined") return false;
|
|
694
|
+
const ua = navigator.userAgent;
|
|
695
|
+
return /Safari/i.test(ua) && !/Chrome|CriOS|Chromium|Edg|OPR|Firefox/i.test(ua);
|
|
696
|
+
}
|
|
692
697
|
var POPUP_RESULT_TIMEOUT_MS = 12e4;
|
|
693
698
|
var POPUP_CLOSED_POLL_MS = 500;
|
|
694
699
|
function createPasskeyViaPopup(options) {
|
|
@@ -3239,12 +3244,15 @@ function DepositScreen({
|
|
|
3239
3244
|
onChangeSource,
|
|
3240
3245
|
onSwitchWallet,
|
|
3241
3246
|
onBack,
|
|
3242
|
-
onLogout
|
|
3247
|
+
onLogout,
|
|
3248
|
+
onIncreaseLimit,
|
|
3249
|
+
increasingLimit
|
|
3243
3250
|
}) {
|
|
3244
3251
|
const { tokens } = useSwypeConfig();
|
|
3245
3252
|
const amount = initialAmount;
|
|
3246
3253
|
const isLowBalance = availableBalance < MIN_DEPOSIT;
|
|
3247
|
-
const
|
|
3254
|
+
const exceedsLimit = amount > remainingLimit && !isLowBalance;
|
|
3255
|
+
const canDeposit = amount >= MIN_DEPOSIT && !exceedsLimit && !isLowBalance && !processing;
|
|
3248
3256
|
const headerTitle = merchantName ? `Deposit to ${merchantName}` : "Deposit";
|
|
3249
3257
|
if (isLowBalance) {
|
|
3250
3258
|
return /* @__PURE__ */ jsxs(
|
|
@@ -3302,11 +3310,22 @@ function DepositScreen({
|
|
|
3302
3310
|
ScreenLayout,
|
|
3303
3311
|
{
|
|
3304
3312
|
footer: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3305
|
-
/* @__PURE__ */ jsxs(
|
|
3306
|
-
"
|
|
3307
|
-
|
|
3313
|
+
exceedsLimit && onIncreaseLimit ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3314
|
+
/* @__PURE__ */ jsx(PrimaryButton, { onClick: onIncreaseLimit, loading: increasingLimit, children: "Increase limit" }),
|
|
3315
|
+
/* @__PURE__ */ jsxs("p", { style: limitExceededHintStyle(tokens.warning), children: [
|
|
3316
|
+
"Your deposit of $",
|
|
3317
|
+
amount.toFixed(2),
|
|
3318
|
+
" exceeds your One-Tap limit of $",
|
|
3319
|
+
remainingLimit.toFixed(2),
|
|
3320
|
+
". Increase your limit to continue."
|
|
3321
|
+
] })
|
|
3322
|
+
] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3323
|
+
/* @__PURE__ */ jsxs(PrimaryButton, { onClick: () => onDeposit(amount), disabled: !canDeposit, loading: processing, children: [
|
|
3324
|
+
"Deposit $",
|
|
3325
|
+
amount.toFixed(2)
|
|
3326
|
+
] }),
|
|
3327
|
+
/* @__PURE__ */ jsx("p", { style: noApprovalStyle(tokens.textMuted), children: "No approval needed \xB7 within your One-Tap limit" })
|
|
3308
3328
|
] }),
|
|
3309
|
-
/* @__PURE__ */ jsx("p", { style: noApprovalStyle(tokens.textMuted), children: "No approval needed \xB7 within your One-Tap limit" }),
|
|
3310
3329
|
/* @__PURE__ */ jsxs("p", { style: routeStyle(tokens.textMuted), children: [
|
|
3311
3330
|
"From ",
|
|
3312
3331
|
sourceName,
|
|
@@ -3454,6 +3473,13 @@ var noApprovalStyle = (color) => ({
|
|
|
3454
3473
|
color,
|
|
3455
3474
|
margin: "12px 0 2px"
|
|
3456
3475
|
});
|
|
3476
|
+
var limitExceededHintStyle = (color) => ({
|
|
3477
|
+
textAlign: "center",
|
|
3478
|
+
fontSize: "0.78rem",
|
|
3479
|
+
color,
|
|
3480
|
+
margin: "12px 0 2px",
|
|
3481
|
+
lineHeight: 1.5
|
|
3482
|
+
});
|
|
3457
3483
|
var routeStyle = (color) => ({
|
|
3458
3484
|
textAlign: "center",
|
|
3459
3485
|
fontSize: "0.75rem",
|
|
@@ -4517,7 +4543,9 @@ function SwypePaymentInner({
|
|
|
4517
4543
|
const [transfer, setTransfer] = useState(null);
|
|
4518
4544
|
const [creatingTransfer, setCreatingTransfer] = useState(false);
|
|
4519
4545
|
const [registeringPasskey, setRegisteringPasskey] = useState(false);
|
|
4520
|
-
const [passkeyPopupNeeded, setPasskeyPopupNeeded] = useState(
|
|
4546
|
+
const [passkeyPopupNeeded, setPasskeyPopupNeeded] = useState(
|
|
4547
|
+
() => isSafari() && isInCrossOriginIframe()
|
|
4548
|
+
);
|
|
4521
4549
|
const [activeCredentialId, setActiveCredentialId] = useState(() => {
|
|
4522
4550
|
if (typeof window === "undefined") return null;
|
|
4523
4551
|
return window.localStorage.getItem(ACTIVE_CREDENTIAL_STORAGE_KEY);
|
|
@@ -4584,7 +4612,7 @@ function SwypePaymentInner({
|
|
|
4584
4612
|
try {
|
|
4585
4613
|
await reloadAccounts();
|
|
4586
4614
|
resetDataLoadingState();
|
|
4587
|
-
setTransfer(
|
|
4615
|
+
setTransfer(authorizedTransfer);
|
|
4588
4616
|
setError(null);
|
|
4589
4617
|
setDeeplinkUri(null);
|
|
4590
4618
|
setMobileFlow(false);
|
|
@@ -4723,6 +4751,17 @@ function SwypePaymentInner({
|
|
|
4723
4751
|
if (resolved.clearPersistedFlow) {
|
|
4724
4752
|
clearMobileFlowState();
|
|
4725
4753
|
}
|
|
4754
|
+
if (resolved.step === "deposit" && persisted && persisted.isSetup) {
|
|
4755
|
+
try {
|
|
4756
|
+
const existingTransfer = await fetchTransfer(apiBaseUrl, token, persisted.transferId);
|
|
4757
|
+
if (cancelled) return;
|
|
4758
|
+
if (existingTransfer.status === "AUTHORIZED") {
|
|
4759
|
+
await handleAuthorizedMobileReturn(existingTransfer, true);
|
|
4760
|
+
return;
|
|
4761
|
+
}
|
|
4762
|
+
} catch {
|
|
4763
|
+
}
|
|
4764
|
+
}
|
|
4726
4765
|
if (resolved.step === "open-wallet" && persisted) {
|
|
4727
4766
|
try {
|
|
4728
4767
|
const existingTransfer = await fetchTransfer(apiBaseUrl, token, persisted.transferId);
|
|
@@ -5189,6 +5228,81 @@ function SwypePaymentInner({
|
|
|
5189
5228
|
merchantAuthorization,
|
|
5190
5229
|
transfer
|
|
5191
5230
|
]);
|
|
5231
|
+
const [increasingLimit, setIncreasingLimit] = useState(false);
|
|
5232
|
+
const handleIncreaseLimit = useCallback(async () => {
|
|
5233
|
+
const parsedAmount = depositAmount ?? 5;
|
|
5234
|
+
if (!sourceId) {
|
|
5235
|
+
setError("No account or provider selected.");
|
|
5236
|
+
return;
|
|
5237
|
+
}
|
|
5238
|
+
if (!activeCredentialId) {
|
|
5239
|
+
setError("Create a passkey on this device before continuing.");
|
|
5240
|
+
setStep("create-passkey");
|
|
5241
|
+
return;
|
|
5242
|
+
}
|
|
5243
|
+
setError(null);
|
|
5244
|
+
setIncreasingLimit(true);
|
|
5245
|
+
try {
|
|
5246
|
+
const token = await getAccessToken();
|
|
5247
|
+
if (!token) throw new Error("Not authenticated");
|
|
5248
|
+
let effectiveSourceType = sourceType;
|
|
5249
|
+
let effectiveSourceId = sourceId;
|
|
5250
|
+
if (effectiveSourceType === "accountId") {
|
|
5251
|
+
const acct = accounts.find((a) => a.id === effectiveSourceId);
|
|
5252
|
+
const activeWallet = acct?.wallets.find((w) => w.status === "ACTIVE");
|
|
5253
|
+
if (activeWallet) {
|
|
5254
|
+
effectiveSourceType = "walletId";
|
|
5255
|
+
effectiveSourceId = activeWallet.id;
|
|
5256
|
+
}
|
|
5257
|
+
}
|
|
5258
|
+
const t = await createTransfer(apiBaseUrl, token, {
|
|
5259
|
+
id: idempotencyKey,
|
|
5260
|
+
credentialId: activeCredentialId,
|
|
5261
|
+
merchantAuthorization,
|
|
5262
|
+
sourceType: effectiveSourceType,
|
|
5263
|
+
sourceId: effectiveSourceId,
|
|
5264
|
+
destination,
|
|
5265
|
+
amount: parsedAmount
|
|
5266
|
+
});
|
|
5267
|
+
setTransfer(t);
|
|
5268
|
+
if (t.authorizationSessions && t.authorizationSessions.length > 0) {
|
|
5269
|
+
const uri = t.authorizationSessions[0].uri;
|
|
5270
|
+
setMobileFlow(true);
|
|
5271
|
+
pollingTransferIdRef.current = t.id;
|
|
5272
|
+
mobileSetupFlowRef.current = true;
|
|
5273
|
+
handlingMobileReturnRef.current = false;
|
|
5274
|
+
polling.startPolling(t.id);
|
|
5275
|
+
setDeeplinkUri(uri);
|
|
5276
|
+
persistMobileFlowState({
|
|
5277
|
+
transferId: t.id,
|
|
5278
|
+
deeplinkUri: uri,
|
|
5279
|
+
providerId: selectedProviderId,
|
|
5280
|
+
isSetup: true
|
|
5281
|
+
});
|
|
5282
|
+
triggerDeeplink(uri);
|
|
5283
|
+
}
|
|
5284
|
+
} catch (err) {
|
|
5285
|
+
const msg = err instanceof Error ? err.message : "Failed to increase limit";
|
|
5286
|
+
setError(msg);
|
|
5287
|
+
onError?.(msg);
|
|
5288
|
+
} finally {
|
|
5289
|
+
setIncreasingLimit(false);
|
|
5290
|
+
}
|
|
5291
|
+
}, [
|
|
5292
|
+
depositAmount,
|
|
5293
|
+
sourceId,
|
|
5294
|
+
sourceType,
|
|
5295
|
+
activeCredentialId,
|
|
5296
|
+
apiBaseUrl,
|
|
5297
|
+
getAccessToken,
|
|
5298
|
+
accounts,
|
|
5299
|
+
polling,
|
|
5300
|
+
onError,
|
|
5301
|
+
idempotencyKey,
|
|
5302
|
+
merchantAuthorization,
|
|
5303
|
+
destination,
|
|
5304
|
+
selectedProviderId
|
|
5305
|
+
]);
|
|
5192
5306
|
const completePasskeyRegistration = useCallback(async (credentialId, publicKey) => {
|
|
5193
5307
|
const token = await getAccessToken();
|
|
5194
5308
|
if (!token) throw new Error("Not authenticated");
|
|
@@ -5450,7 +5564,9 @@ function SwypePaymentInner({
|
|
|
5450
5564
|
onChangeSource: () => setStep("wallet-picker"),
|
|
5451
5565
|
onSwitchWallet: () => setStep("wallet-picker"),
|
|
5452
5566
|
onBack: onBack ?? (() => handleLogout()),
|
|
5453
|
-
onLogout: handleLogout
|
|
5567
|
+
onLogout: handleLogout,
|
|
5568
|
+
onIncreaseLimit: handleIncreaseLimit,
|
|
5569
|
+
increasingLimit
|
|
5454
5570
|
}
|
|
5455
5571
|
);
|
|
5456
5572
|
}
|