@swype-org/react-sdk 0.1.107 → 0.1.110
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 +192 -112
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +3 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.js +192 -113
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1808,43 +1808,71 @@ function clearMobileFlowState() {
|
|
|
1808
1808
|
} catch {
|
|
1809
1809
|
}
|
|
1810
1810
|
}
|
|
1811
|
-
function
|
|
1812
|
-
|
|
1813
|
-
|
|
1814
|
-
|
|
1815
|
-
|
|
1816
|
-
|
|
1817
|
-
|
|
1818
|
-
|
|
1819
|
-
|
|
1820
|
-
|
|
1821
|
-
|
|
1822
|
-
|
|
1811
|
+
function getWalletAddress(wallet) {
|
|
1812
|
+
const address = wallet.name.trim();
|
|
1813
|
+
return address.length > 0 ? address : null;
|
|
1814
|
+
}
|
|
1815
|
+
function getAddressableWallets(account) {
|
|
1816
|
+
return account.wallets.filter((wallet) => getWalletAddress(wallet) != null);
|
|
1817
|
+
}
|
|
1818
|
+
function hasActiveDepositWallet(account) {
|
|
1819
|
+
return getAddressableWallets(account).some((wallet) => wallet.status === "ACTIVE");
|
|
1820
|
+
}
|
|
1821
|
+
function getPreferredDepositWallet(account, transferAmount) {
|
|
1822
|
+
const wallets = getAddressableWallets(account);
|
|
1823
|
+
if (wallets.length === 0) return null;
|
|
1824
|
+
for (const wallet of wallets) {
|
|
1825
|
+
if (wallet.status === "ACTIVE" && wallet.sources.some((source) => source.balance.available.amount >= transferAmount)) {
|
|
1826
|
+
return wallet;
|
|
1823
1827
|
}
|
|
1824
1828
|
}
|
|
1825
|
-
let bestAccount = null;
|
|
1826
1829
|
let bestWallet = null;
|
|
1827
1830
|
let bestBalance = -1;
|
|
1828
1831
|
let bestIsActive = false;
|
|
1829
|
-
for (const
|
|
1830
|
-
|
|
1831
|
-
|
|
1832
|
-
|
|
1833
|
-
|
|
1834
|
-
|
|
1835
|
-
|
|
1836
|
-
bestWallet = wallet;
|
|
1837
|
-
bestIsActive = isActive;
|
|
1838
|
-
}
|
|
1832
|
+
for (const wallet of wallets) {
|
|
1833
|
+
const walletBal = wallet.balance.available.amount;
|
|
1834
|
+
const isActive = wallet.status === "ACTIVE";
|
|
1835
|
+
if (walletBal > bestBalance || walletBal === bestBalance && isActive && !bestIsActive) {
|
|
1836
|
+
bestBalance = walletBal;
|
|
1837
|
+
bestWallet = wallet;
|
|
1838
|
+
bestIsActive = isActive;
|
|
1839
1839
|
}
|
|
1840
1840
|
}
|
|
1841
|
-
|
|
1842
|
-
|
|
1843
|
-
|
|
1844
|
-
|
|
1845
|
-
|
|
1841
|
+
return bestWallet ?? wallets[0];
|
|
1842
|
+
}
|
|
1843
|
+
function getDepositEligibleAccounts(accounts) {
|
|
1844
|
+
return accounts.filter((account) => getAddressableWallets(account).length > 0);
|
|
1845
|
+
}
|
|
1846
|
+
function resolveDepositSelection(accounts, transferAmount, selectedAccountId) {
|
|
1847
|
+
const eligibleAccounts = getDepositEligibleAccounts(accounts);
|
|
1848
|
+
if (eligibleAccounts.length === 0) return null;
|
|
1849
|
+
if (selectedAccountId) {
|
|
1850
|
+
const selectedAccount = eligibleAccounts.find((account) => account.id === selectedAccountId);
|
|
1851
|
+
if (selectedAccount) {
|
|
1852
|
+
const preferredWallet = getPreferredDepositWallet(selectedAccount, transferAmount);
|
|
1853
|
+
return {
|
|
1854
|
+
accountId: selectedAccount.id,
|
|
1855
|
+
walletId: preferredWallet?.id ?? null
|
|
1856
|
+
};
|
|
1857
|
+
}
|
|
1858
|
+
}
|
|
1859
|
+
for (const account of eligibleAccounts) {
|
|
1860
|
+
const fullyEligibleWallet = getAddressableWallets(account).find(
|
|
1861
|
+
(wallet) => wallet.status === "ACTIVE" && wallet.sources.some((source) => source.balance.available.amount >= transferAmount)
|
|
1862
|
+
);
|
|
1863
|
+
if (fullyEligibleWallet) {
|
|
1864
|
+
return {
|
|
1865
|
+
accountId: account.id,
|
|
1866
|
+
walletId: fullyEligibleWallet.id
|
|
1867
|
+
};
|
|
1868
|
+
}
|
|
1846
1869
|
}
|
|
1847
|
-
|
|
1870
|
+
const fallbackAccount = eligibleAccounts[0];
|
|
1871
|
+
const fallbackWallet = getPreferredDepositWallet(fallbackAccount, transferAmount);
|
|
1872
|
+
return {
|
|
1873
|
+
accountId: fallbackAccount.id,
|
|
1874
|
+
walletId: fallbackWallet?.id ?? null
|
|
1875
|
+
};
|
|
1848
1876
|
}
|
|
1849
1877
|
function parseRawBalance(rawBalance, decimals) {
|
|
1850
1878
|
const parsed = Number(rawBalance);
|
|
@@ -2157,59 +2185,68 @@ function paymentReducer(state, action) {
|
|
|
2157
2185
|
return state;
|
|
2158
2186
|
}
|
|
2159
2187
|
}
|
|
2160
|
-
|
|
2161
|
-
|
|
2162
|
-
|
|
2163
|
-
|
|
2164
|
-
{
|
|
2165
|
-
style:
|
|
2166
|
-
|
|
2167
|
-
|
|
2168
|
-
|
|
2169
|
-
|
|
2170
|
-
},
|
|
2171
|
-
children: [
|
|
2172
|
-
/* @__PURE__ */ jsx(
|
|
2173
|
-
"div",
|
|
2174
|
-
{
|
|
2175
|
-
style: {
|
|
2176
|
-
width: size,
|
|
2177
|
-
height: size,
|
|
2178
|
-
border: `4px solid ${tokens.bgInput}`,
|
|
2179
|
-
borderTopColor: tokens.accent,
|
|
2180
|
-
borderRightColor: tokens.accent + "66",
|
|
2181
|
-
borderRadius: "50%",
|
|
2182
|
-
boxShadow: "inset 0 0 0 1px rgba(255,255,255,0.1)",
|
|
2183
|
-
animation: "swype-spin 0.9s linear infinite"
|
|
2184
|
-
}
|
|
2185
|
-
}
|
|
2186
|
-
),
|
|
2187
|
-
label && /* @__PURE__ */ jsx("p", { style: { color: tokens.textSecondary, fontSize: "0.875rem", margin: 0 }, children: label }),
|
|
2188
|
-
/* @__PURE__ */ jsx("style", { children: `
|
|
2189
|
-
@keyframes swype-spin {
|
|
2188
|
+
var ACCENT = "#28b67a";
|
|
2189
|
+
var BG_RING = "#d2e4ea";
|
|
2190
|
+
function SwypeLoadingScreen() {
|
|
2191
|
+
return /* @__PURE__ */ jsxs("div", { style: containerStyle, children: [
|
|
2192
|
+
/* @__PURE__ */ jsxs("div", { style: contentStyle, children: [
|
|
2193
|
+
/* @__PURE__ */ jsx("p", { style: wordmarkStyle, children: "swype" }),
|
|
2194
|
+
/* @__PURE__ */ jsx("div", { style: spinnerStyle })
|
|
2195
|
+
] }),
|
|
2196
|
+
/* @__PURE__ */ jsx("style", { children: `
|
|
2197
|
+
@keyframes swype-loading-spin {
|
|
2190
2198
|
to { transform: rotate(360deg); }
|
|
2191
2199
|
}
|
|
2192
2200
|
` })
|
|
2193
|
-
|
|
2194
|
-
}
|
|
2195
|
-
);
|
|
2201
|
+
] });
|
|
2196
2202
|
}
|
|
2203
|
+
var containerStyle = {
|
|
2204
|
+
display: "flex",
|
|
2205
|
+
alignItems: "center",
|
|
2206
|
+
justifyContent: "center",
|
|
2207
|
+
height: "100%",
|
|
2208
|
+
flex: 1,
|
|
2209
|
+
background: "transparent"
|
|
2210
|
+
};
|
|
2211
|
+
var contentStyle = {
|
|
2212
|
+
display: "flex",
|
|
2213
|
+
flexDirection: "column",
|
|
2214
|
+
alignItems: "center",
|
|
2215
|
+
gap: 16
|
|
2216
|
+
};
|
|
2217
|
+
var wordmarkStyle = {
|
|
2218
|
+
fontSize: 28,
|
|
2219
|
+
fontWeight: 700,
|
|
2220
|
+
letterSpacing: "-0.04em",
|
|
2221
|
+
color: ACCENT,
|
|
2222
|
+
margin: 0,
|
|
2223
|
+
fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif'
|
|
2224
|
+
};
|
|
2225
|
+
var spinnerStyle = {
|
|
2226
|
+
width: 44,
|
|
2227
|
+
height: 44,
|
|
2228
|
+
border: `4px solid ${BG_RING}`,
|
|
2229
|
+
borderTopColor: ACCENT,
|
|
2230
|
+
borderRightColor: `${ACCENT}66`,
|
|
2231
|
+
borderRadius: "50%",
|
|
2232
|
+
animation: "swype-loading-spin 0.9s linear infinite"
|
|
2233
|
+
};
|
|
2197
2234
|
var FOOTER_CSS = `
|
|
2198
2235
|
.swype-screen-footer {
|
|
2199
2236
|
padding-bottom: max(24px, env(safe-area-inset-bottom, 24px));
|
|
2200
2237
|
}`;
|
|
2201
2238
|
function ScreenLayout({ children, footer }) {
|
|
2202
2239
|
const { tokens } = useSwypeConfig();
|
|
2203
|
-
return /* @__PURE__ */ jsxs("div", { style:
|
|
2240
|
+
return /* @__PURE__ */ jsxs("div", { style: containerStyle2(tokens.bgCard), children: [
|
|
2204
2241
|
/* @__PURE__ */ jsx("div", { style: bodyStyle, children }),
|
|
2205
2242
|
footer && /* @__PURE__ */ jsx("div", { className: "swype-screen-footer", style: footerStyle, children: footer }),
|
|
2206
2243
|
/* @__PURE__ */ jsx("style", { children: FOOTER_CSS })
|
|
2207
2244
|
] });
|
|
2208
2245
|
}
|
|
2209
|
-
var
|
|
2246
|
+
var containerStyle2 = (bg) => ({
|
|
2210
2247
|
display: "flex",
|
|
2211
2248
|
flexDirection: "column",
|
|
2212
|
-
|
|
2249
|
+
height: "100%",
|
|
2213
2250
|
maxWidth: 420,
|
|
2214
2251
|
width: "100%",
|
|
2215
2252
|
margin: "0 auto",
|
|
@@ -2276,7 +2313,7 @@ var badgeStyle = (color) => ({
|
|
|
2276
2313
|
});
|
|
2277
2314
|
function PoweredByFooter() {
|
|
2278
2315
|
const { tokens } = useSwypeConfig();
|
|
2279
|
-
return /* @__PURE__ */ jsxs("div", { style:
|
|
2316
|
+
return /* @__PURE__ */ jsxs("div", { style: containerStyle3(tokens.textMuted), children: [
|
|
2280
2317
|
/* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsx(
|
|
2281
2318
|
"path",
|
|
2282
2319
|
{
|
|
@@ -2289,7 +2326,7 @@ function PoweredByFooter() {
|
|
|
2289
2326
|
/* @__PURE__ */ jsx("span", { children: "Non-custodial" })
|
|
2290
2327
|
] });
|
|
2291
2328
|
}
|
|
2292
|
-
var
|
|
2329
|
+
var containerStyle3 = (color) => ({
|
|
2293
2330
|
display: "flex",
|
|
2294
2331
|
alignItems: "center",
|
|
2295
2332
|
justifyContent: "center",
|
|
@@ -2375,12 +2412,12 @@ var defaultIcon = /* @__PURE__ */ jsx("svg", { width: "18", height: "18", viewBo
|
|
|
2375
2412
|
) });
|
|
2376
2413
|
function InfoBanner({ children, icon }) {
|
|
2377
2414
|
const { tokens } = useSwypeConfig();
|
|
2378
|
-
return /* @__PURE__ */ jsxs("div", { style:
|
|
2415
|
+
return /* @__PURE__ */ jsxs("div", { style: containerStyle4(tokens.accent), children: [
|
|
2379
2416
|
/* @__PURE__ */ jsx("span", { style: iconStyle, children: icon ?? defaultIcon }),
|
|
2380
2417
|
/* @__PURE__ */ jsx("span", { style: textStyle, children })
|
|
2381
2418
|
] });
|
|
2382
2419
|
}
|
|
2383
|
-
var
|
|
2420
|
+
var containerStyle4 = (accent) => ({
|
|
2384
2421
|
display: "flex",
|
|
2385
2422
|
alignItems: "flex-start",
|
|
2386
2423
|
gap: 10,
|
|
@@ -2398,7 +2435,7 @@ var iconStyle = {
|
|
|
2398
2435
|
};
|
|
2399
2436
|
var textStyle = { flex: 1 };
|
|
2400
2437
|
function WarningBanner({ title, children }) {
|
|
2401
|
-
return /* @__PURE__ */ jsxs("div", { style:
|
|
2438
|
+
return /* @__PURE__ */ jsxs("div", { style: containerStyle5, children: [
|
|
2402
2439
|
/* @__PURE__ */ jsxs("div", { style: headerStyle2, children: [
|
|
2403
2440
|
/* @__PURE__ */ jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", style: iconStyle2, children: /* @__PURE__ */ jsx("path", { d: "M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z", fill: "#F57C00" }) }),
|
|
2404
2441
|
/* @__PURE__ */ jsx("strong", { children: title })
|
|
@@ -2406,7 +2443,7 @@ function WarningBanner({ title, children }) {
|
|
|
2406
2443
|
/* @__PURE__ */ jsx("div", { style: bodyStyle2, children })
|
|
2407
2444
|
] });
|
|
2408
2445
|
}
|
|
2409
|
-
var
|
|
2446
|
+
var containerStyle5 = {
|
|
2410
2447
|
padding: "14px 16px",
|
|
2411
2448
|
background: "#FFF8E1",
|
|
2412
2449
|
border: "1px solid #FFE082",
|
|
@@ -2478,7 +2515,7 @@ function OtpInput({ value, onChange, length = 6, disabled }) {
|
|
|
2478
2515
|
onChange(pasted);
|
|
2479
2516
|
focusInput(Math.min(pasted.length, length - 1));
|
|
2480
2517
|
}, [onChange, length, focusInput]);
|
|
2481
|
-
return /* @__PURE__ */ jsx("div", { style:
|
|
2518
|
+
return /* @__PURE__ */ jsx("div", { style: containerStyle6, children: digits.map((digit, i) => /* @__PURE__ */ jsx(
|
|
2482
2519
|
"input",
|
|
2483
2520
|
{
|
|
2484
2521
|
ref: (el) => {
|
|
@@ -2499,7 +2536,7 @@ function OtpInput({ value, onChange, length = 6, disabled }) {
|
|
|
2499
2536
|
i
|
|
2500
2537
|
)) });
|
|
2501
2538
|
}
|
|
2502
|
-
var
|
|
2539
|
+
var containerStyle6 = {
|
|
2503
2540
|
display: "flex",
|
|
2504
2541
|
gap: 8,
|
|
2505
2542
|
justifyContent: "center",
|
|
@@ -2571,9 +2608,6 @@ var KNOWN_LOGOS = {
|
|
|
2571
2608
|
base: BASE_LOGO,
|
|
2572
2609
|
"trust wallet": TRUST_WALLET_LOGO
|
|
2573
2610
|
};
|
|
2574
|
-
function hasActiveWallet2(account) {
|
|
2575
|
-
return account.wallets.some((w) => w.status === "ACTIVE");
|
|
2576
|
-
}
|
|
2577
2611
|
function SourceCard({
|
|
2578
2612
|
name,
|
|
2579
2613
|
address,
|
|
@@ -2662,10 +2696,11 @@ function SourceCard({
|
|
|
2662
2696
|
] }),
|
|
2663
2697
|
open && hasDropdown && /* @__PURE__ */ jsxs("div", { style: dropdownStyle(tokens), children: [
|
|
2664
2698
|
accounts.map((account) => {
|
|
2665
|
-
const
|
|
2699
|
+
const preferredWallet = getPreferredDepositWallet(account, depositAmount ?? 0);
|
|
2700
|
+
const active = hasActiveDepositWallet(account);
|
|
2666
2701
|
const isSelected = account.id === selectedAccountId;
|
|
2667
2702
|
const displayName = account.nickname ?? account.name;
|
|
2668
|
-
const walletAddress =
|
|
2703
|
+
const walletAddress = preferredWallet ? getWalletAddress(preferredWallet) : null;
|
|
2669
2704
|
const hasAllowance = active && account.remainingAllowance != null;
|
|
2670
2705
|
const exceedsLimit = hasAllowance && depositAmount != null && depositAmount > account.remainingAllowance;
|
|
2671
2706
|
return /* @__PURE__ */ jsxs(
|
|
@@ -3001,7 +3036,7 @@ function SettingsMenu({ onLogout }) {
|
|
|
3001
3036
|
document.addEventListener("mousedown", handleClickOutside);
|
|
3002
3037
|
return () => document.removeEventListener("mousedown", handleClickOutside);
|
|
3003
3038
|
}, [open]);
|
|
3004
|
-
return /* @__PURE__ */ jsxs("div", { ref: menuRef, style:
|
|
3039
|
+
return /* @__PURE__ */ jsxs("div", { ref: menuRef, style: containerStyle7, children: [
|
|
3005
3040
|
/* @__PURE__ */ jsx("button", { type: "button", onClick: toggle, style: triggerStyle(tokens.text), "aria-label": "Settings", children: /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", children: [
|
|
3006
3041
|
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "5", r: "2", fill: "currentColor" }),
|
|
3007
3042
|
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "2", fill: "currentColor" }),
|
|
@@ -3028,7 +3063,7 @@ function SettingsMenu({ onLogout }) {
|
|
|
3028
3063
|
) })
|
|
3029
3064
|
] });
|
|
3030
3065
|
}
|
|
3031
|
-
var
|
|
3066
|
+
var containerStyle7 = {
|
|
3032
3067
|
position: "relative"
|
|
3033
3068
|
};
|
|
3034
3069
|
var triggerStyle = (color) => ({
|
|
@@ -3115,7 +3150,7 @@ function LoginScreen({
|
|
|
3115
3150
|
right: merchantInitials ? /* @__PURE__ */ jsx("div", { style: avatarStyle(tokens), children: merchantInitials }) : void 0
|
|
3116
3151
|
}
|
|
3117
3152
|
),
|
|
3118
|
-
/* @__PURE__ */ jsxs("div", { style:
|
|
3153
|
+
/* @__PURE__ */ jsxs("div", { style: contentStyle2, children: [
|
|
3119
3154
|
/* @__PURE__ */ jsx("div", { style: iconBoxStyle(tokens.accent), children: /* @__PURE__ */ jsx("span", { style: iconLetterStyle, children: "S" }) }),
|
|
3120
3155
|
/* @__PURE__ */ jsx("h2", { style: headingStyle(tokens.text), children: "One-time setup.\nOne-tap deposits after." }),
|
|
3121
3156
|
/* @__PURE__ */ jsx("p", { style: subtitleStyle(tokens.textSecondary), children: "Protected by Face ID." }),
|
|
@@ -3158,7 +3193,7 @@ function socialLabel(provider) {
|
|
|
3158
3193
|
return "X";
|
|
3159
3194
|
}
|
|
3160
3195
|
}
|
|
3161
|
-
var
|
|
3196
|
+
var contentStyle2 = {
|
|
3162
3197
|
textAlign: "center",
|
|
3163
3198
|
flex: 1,
|
|
3164
3199
|
display: "flex",
|
|
@@ -3334,7 +3369,7 @@ function OtpVerifyScreen({
|
|
|
3334
3369
|
}, [cooldown, onResend]);
|
|
3335
3370
|
return /* @__PURE__ */ jsxs(ScreenLayout, { footer: /* @__PURE__ */ jsx(PoweredByFooter, {}), children: [
|
|
3336
3371
|
/* @__PURE__ */ jsx(ScreenHeader, { onBack }),
|
|
3337
|
-
/* @__PURE__ */ jsxs("div", { style:
|
|
3372
|
+
/* @__PURE__ */ jsxs("div", { style: contentStyle3, children: [
|
|
3338
3373
|
/* @__PURE__ */ jsx(IconCircle, { variant: "accent", size: 56, children: /* @__PURE__ */ jsx("svg", { width: "28", height: "28", viewBox: "0 0 24 24", fill: "none", children: /* @__PURE__ */ jsx(
|
|
3339
3374
|
"path",
|
|
3340
3375
|
{
|
|
@@ -3367,7 +3402,7 @@ function OtpVerifyScreen({
|
|
|
3367
3402
|
] })
|
|
3368
3403
|
] });
|
|
3369
3404
|
}
|
|
3370
|
-
var
|
|
3405
|
+
var contentStyle3 = {
|
|
3371
3406
|
textAlign: "center",
|
|
3372
3407
|
display: "flex",
|
|
3373
3408
|
flexDirection: "column",
|
|
@@ -3441,7 +3476,7 @@ function CreatePasskeyScreen({
|
|
|
3441
3476
|
] }),
|
|
3442
3477
|
children: [
|
|
3443
3478
|
/* @__PURE__ */ jsx(ScreenHeader, { onBack }),
|
|
3444
|
-
/* @__PURE__ */ jsxs("div", { style:
|
|
3479
|
+
/* @__PURE__ */ jsxs("div", { style: contentStyle4, children: [
|
|
3445
3480
|
/* @__PURE__ */ jsx(IconCircle, { variant: "accent", size: 64, children: /* @__PURE__ */ jsxs("svg", { width: "36", height: "36", viewBox: "0 0 24 24", fill: "none", children: [
|
|
3446
3481
|
/* @__PURE__ */ jsx("rect", { x: "4", y: "4", width: "16", height: "16", rx: "3", stroke: tokens.accent, strokeWidth: "1.5", strokeDasharray: "3 2" }),
|
|
3447
3482
|
/* @__PURE__ */ jsx("circle", { cx: "9", cy: "10", r: "1", fill: tokens.accent }),
|
|
@@ -3457,7 +3492,7 @@ function CreatePasskeyScreen({
|
|
|
3457
3492
|
}
|
|
3458
3493
|
);
|
|
3459
3494
|
}
|
|
3460
|
-
var
|
|
3495
|
+
var contentStyle4 = {
|
|
3461
3496
|
textAlign: "center",
|
|
3462
3497
|
flex: 1,
|
|
3463
3498
|
display: "flex",
|
|
@@ -3491,6 +3526,43 @@ var errorBannerStyle2 = (tokens) => ({
|
|
|
3491
3526
|
width: "100%",
|
|
3492
3527
|
textAlign: "left"
|
|
3493
3528
|
});
|
|
3529
|
+
function Spinner({ size = 40, label }) {
|
|
3530
|
+
const { tokens } = useSwypeConfig();
|
|
3531
|
+
return /* @__PURE__ */ jsxs(
|
|
3532
|
+
"div",
|
|
3533
|
+
{
|
|
3534
|
+
style: {
|
|
3535
|
+
display: "flex",
|
|
3536
|
+
flexDirection: "column",
|
|
3537
|
+
alignItems: "center",
|
|
3538
|
+
gap: "12px"
|
|
3539
|
+
},
|
|
3540
|
+
children: [
|
|
3541
|
+
/* @__PURE__ */ jsx(
|
|
3542
|
+
"div",
|
|
3543
|
+
{
|
|
3544
|
+
style: {
|
|
3545
|
+
width: size,
|
|
3546
|
+
height: size,
|
|
3547
|
+
border: `4px solid ${tokens.bgInput}`,
|
|
3548
|
+
borderTopColor: tokens.accent,
|
|
3549
|
+
borderRightColor: tokens.accent + "66",
|
|
3550
|
+
borderRadius: "50%",
|
|
3551
|
+
boxShadow: "inset 0 0 0 1px rgba(255,255,255,0.1)",
|
|
3552
|
+
animation: "swype-spin 0.9s linear infinite"
|
|
3553
|
+
}
|
|
3554
|
+
}
|
|
3555
|
+
),
|
|
3556
|
+
label && /* @__PURE__ */ jsx("p", { style: { color: tokens.textSecondary, fontSize: "0.875rem", margin: 0 }, children: label }),
|
|
3557
|
+
/* @__PURE__ */ jsx("style", { children: `
|
|
3558
|
+
@keyframes swype-spin {
|
|
3559
|
+
to { transform: rotate(360deg); }
|
|
3560
|
+
}
|
|
3561
|
+
` })
|
|
3562
|
+
]
|
|
3563
|
+
}
|
|
3564
|
+
);
|
|
3565
|
+
}
|
|
3494
3566
|
var WALLET_EMOJIS = {
|
|
3495
3567
|
rabby: "\u{1F430}",
|
|
3496
3568
|
ora: "\u2666\uFE0F",
|
|
@@ -4332,7 +4404,7 @@ function SuccessScreen({
|
|
|
4332
4404
|
right: /* @__PURE__ */ jsx(SettingsMenu, { onLogout })
|
|
4333
4405
|
}
|
|
4334
4406
|
),
|
|
4335
|
-
/* @__PURE__ */ jsxs("div", { style:
|
|
4407
|
+
/* @__PURE__ */ jsxs("div", { style: contentStyle5, children: [
|
|
4336
4408
|
succeeded ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
4337
4409
|
/* @__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 }) }) }),
|
|
4338
4410
|
/* @__PURE__ */ jsxs("h2", { style: headingStyle6(tokens.text), children: [
|
|
@@ -4379,7 +4451,7 @@ function SuccessScreen({
|
|
|
4379
4451
|
}
|
|
4380
4452
|
);
|
|
4381
4453
|
}
|
|
4382
|
-
var
|
|
4454
|
+
var contentStyle5 = {
|
|
4383
4455
|
flex: 1,
|
|
4384
4456
|
display: "flex",
|
|
4385
4457
|
flexDirection: "column",
|
|
@@ -4870,7 +4942,7 @@ function TransferStatusScreen({
|
|
|
4870
4942
|
const steps = buildSteps(phase);
|
|
4871
4943
|
return /* @__PURE__ */ jsxs(ScreenLayout, { children: [
|
|
4872
4944
|
/* @__PURE__ */ jsx(ScreenHeader, { right: /* @__PURE__ */ jsx(SettingsMenu, { onLogout }) }),
|
|
4873
|
-
/* @__PURE__ */ jsxs("div", { style:
|
|
4945
|
+
/* @__PURE__ */ jsxs("div", { style: contentStyle6, children: [
|
|
4874
4946
|
/* @__PURE__ */ jsx(Spinner, { size: 48 }),
|
|
4875
4947
|
/* @__PURE__ */ jsx("h2", { style: headingStyle8(tokens.text), children: "Processing Transfer..." }),
|
|
4876
4948
|
error && /* @__PURE__ */ jsx("div", { style: errorBannerStyle5(tokens), children: error }),
|
|
@@ -4879,7 +4951,7 @@ function TransferStatusScreen({
|
|
|
4879
4951
|
] })
|
|
4880
4952
|
] });
|
|
4881
4953
|
}
|
|
4882
|
-
var
|
|
4954
|
+
var contentStyle6 = {
|
|
4883
4955
|
flex: 1,
|
|
4884
4956
|
display: "flex",
|
|
4885
4957
|
flexDirection: "column",
|
|
@@ -4955,7 +5027,7 @@ function OpenWalletScreen({
|
|
|
4955
5027
|
] }),
|
|
4956
5028
|
children: [
|
|
4957
5029
|
/* @__PURE__ */ jsx(ScreenHeader, { right: /* @__PURE__ */ jsx(SettingsMenu, { onLogout }) }),
|
|
4958
|
-
/* @__PURE__ */ jsxs("div", { style:
|
|
5030
|
+
/* @__PURE__ */ jsxs("div", { style: contentStyle7, children: [
|
|
4959
5031
|
logoSrc ? /* @__PURE__ */ jsx("img", { src: logoSrc, alt: displayName, style: logoStyle }) : /* @__PURE__ */ jsx(Spinner, { size: 48 }),
|
|
4960
5032
|
/* @__PURE__ */ jsx("h2", { style: headingStyle9(tokens.text), children: loading ? "Connecting..." : `Open ${displayName}` }),
|
|
4961
5033
|
/* @__PURE__ */ jsx("p", { style: subtitleStyle9(tokens.textSecondary), children: loading ? "Creating transfer and preparing your wallet link..." : `Continue in ${displayName} to authorize this connection.` }),
|
|
@@ -4968,7 +5040,7 @@ function OpenWalletScreen({
|
|
|
4968
5040
|
}
|
|
4969
5041
|
);
|
|
4970
5042
|
}
|
|
4971
|
-
var
|
|
5043
|
+
var contentStyle7 = {
|
|
4972
5044
|
flex: 1,
|
|
4973
5045
|
display: "flex",
|
|
4974
5046
|
flexDirection: "column",
|
|
@@ -5039,7 +5111,7 @@ function ConfirmSignScreen({
|
|
|
5039
5111
|
] }),
|
|
5040
5112
|
children: [
|
|
5041
5113
|
/* @__PURE__ */ jsx(ScreenHeader, { right: /* @__PURE__ */ jsx(SettingsMenu, { onLogout }) }),
|
|
5042
|
-
/* @__PURE__ */ jsxs("div", { style:
|
|
5114
|
+
/* @__PURE__ */ jsxs("div", { style: contentStyle8, children: [
|
|
5043
5115
|
logoSrc ? /* @__PURE__ */ jsx("img", { src: logoSrc, alt: displayName, style: logoStyle2 }) : /* @__PURE__ */ jsx(Spinner, { size: 48 }),
|
|
5044
5116
|
/* @__PURE__ */ jsx("h2", { style: headingStyle10(tokens.text), children: "Wallet authorized" }),
|
|
5045
5117
|
/* @__PURE__ */ jsxs("p", { style: subtitleStyle10(tokens.textSecondary), children: [
|
|
@@ -5055,7 +5127,7 @@ function ConfirmSignScreen({
|
|
|
5055
5127
|
}
|
|
5056
5128
|
);
|
|
5057
5129
|
}
|
|
5058
|
-
var
|
|
5130
|
+
var contentStyle8 = {
|
|
5059
5131
|
flex: 1,
|
|
5060
5132
|
display: "flex",
|
|
5061
5133
|
flexDirection: "column",
|
|
@@ -5111,9 +5183,6 @@ var errorStyle2 = (color) => ({
|
|
|
5111
5183
|
color: "#ef4444",
|
|
5112
5184
|
margin: "8px 0 0"
|
|
5113
5185
|
});
|
|
5114
|
-
function CenteredSpinner({ label }) {
|
|
5115
|
-
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 }) }) });
|
|
5116
|
-
}
|
|
5117
5186
|
function StepRenderer({
|
|
5118
5187
|
state,
|
|
5119
5188
|
ready,
|
|
@@ -5125,6 +5194,7 @@ function StepRenderer({
|
|
|
5125
5194
|
transferSigningSigning,
|
|
5126
5195
|
transferSigningError,
|
|
5127
5196
|
pendingConnections,
|
|
5197
|
+
depositEligibleAccounts,
|
|
5128
5198
|
sourceName,
|
|
5129
5199
|
sourceAddress,
|
|
5130
5200
|
sourceVerified,
|
|
@@ -5146,9 +5216,12 @@ function StepRenderer({
|
|
|
5146
5216
|
}) {
|
|
5147
5217
|
const { step } = state;
|
|
5148
5218
|
if (!ready) {
|
|
5149
|
-
return /* @__PURE__ */ jsx(
|
|
5219
|
+
return /* @__PURE__ */ jsx(SwypeLoadingScreen, {});
|
|
5150
5220
|
}
|
|
5151
|
-
if (step === "login"
|
|
5221
|
+
if (step === "login") {
|
|
5222
|
+
if (authenticated) {
|
|
5223
|
+
return /* @__PURE__ */ jsx(SwypeLoadingScreen, {});
|
|
5224
|
+
}
|
|
5152
5225
|
return /* @__PURE__ */ jsx(
|
|
5153
5226
|
LoginScreen,
|
|
5154
5227
|
{
|
|
@@ -5234,7 +5307,7 @@ function StepRenderer({
|
|
|
5234
5307
|
}
|
|
5235
5308
|
if (step === "deposit") {
|
|
5236
5309
|
if (state.loadingData) {
|
|
5237
|
-
return /* @__PURE__ */ jsx(
|
|
5310
|
+
return /* @__PURE__ */ jsx(SwypeLoadingScreen, {});
|
|
5238
5311
|
}
|
|
5239
5312
|
const parsedAmt = depositAmount != null ? depositAmount : 5;
|
|
5240
5313
|
return /* @__PURE__ */ jsx(
|
|
@@ -5256,7 +5329,7 @@ function StepRenderer({
|
|
|
5256
5329
|
onLogout: handlers.onLogout,
|
|
5257
5330
|
onIncreaseLimit: handlers.onIncreaseLimit,
|
|
5258
5331
|
increasingLimit: state.increasingLimit,
|
|
5259
|
-
accounts:
|
|
5332
|
+
accounts: depositEligibleAccounts,
|
|
5260
5333
|
selectedAccountId: state.selectedAccountId,
|
|
5261
5334
|
onSelectAccount: handlers.onSelectAccount,
|
|
5262
5335
|
onAuthorizeAccount: handlers.onContinueConnection,
|
|
@@ -5332,7 +5405,7 @@ function StepRenderer({
|
|
|
5332
5405
|
onSwitchWallet: () => handlers.onNavigate("wallet-picker"),
|
|
5333
5406
|
onBack: onBack ?? (() => handlers.onLogout()),
|
|
5334
5407
|
onLogout: handlers.onLogout,
|
|
5335
|
-
accounts:
|
|
5408
|
+
accounts: depositEligibleAccounts,
|
|
5336
5409
|
selectedAccountId: state.selectedAccountId,
|
|
5337
5410
|
onSelectAccount: handlers.onSelectAccount,
|
|
5338
5411
|
onAuthorizeAccount: handlers.onContinueConnection,
|
|
@@ -5361,7 +5434,7 @@ var PaymentErrorBoundary = class extends Component {
|
|
|
5361
5434
|
if (!this.state.hasError) {
|
|
5362
5435
|
return this.props.children;
|
|
5363
5436
|
}
|
|
5364
|
-
return /* @__PURE__ */ jsxs("div", { style:
|
|
5437
|
+
return /* @__PURE__ */ jsxs("div", { style: containerStyle8, children: [
|
|
5365
5438
|
/* @__PURE__ */ jsx("div", { style: iconStyle4, children: /* @__PURE__ */ jsxs("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "none", children: [
|
|
5366
5439
|
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10", stroke: "#ef4444", strokeWidth: "1.5" }),
|
|
5367
5440
|
/* @__PURE__ */ jsx("path", { d: "M12 8v5", stroke: "#ef4444", strokeWidth: "1.5", strokeLinecap: "round" }),
|
|
@@ -5373,7 +5446,7 @@ var PaymentErrorBoundary = class extends Component {
|
|
|
5373
5446
|
] });
|
|
5374
5447
|
}
|
|
5375
5448
|
};
|
|
5376
|
-
var
|
|
5449
|
+
var containerStyle8 = {
|
|
5377
5450
|
display: "flex",
|
|
5378
5451
|
flexDirection: "column",
|
|
5379
5452
|
alignItems: "center",
|
|
@@ -5490,6 +5563,10 @@ function SwypePaymentInner({
|
|
|
5490
5563
|
),
|
|
5491
5564
|
[state.accounts]
|
|
5492
5565
|
);
|
|
5566
|
+
const depositEligibleAccounts = useMemo(
|
|
5567
|
+
() => getDepositEligibleAccounts(state.accounts),
|
|
5568
|
+
[state.accounts]
|
|
5569
|
+
);
|
|
5493
5570
|
const maxSourceBalance = useMemo(() => {
|
|
5494
5571
|
let max = 0;
|
|
5495
5572
|
for (const acct of state.accounts) {
|
|
@@ -5700,9 +5777,9 @@ function SwypePaymentInner({
|
|
|
5700
5777
|
fetchProviders(apiBaseUrl, token)
|
|
5701
5778
|
]);
|
|
5702
5779
|
const parsedAmt = depositAmount != null ? depositAmount : 0;
|
|
5703
|
-
const defaults =
|
|
5780
|
+
const defaults = resolveDepositSelection(accts, parsedAmt, state.selectedAccountId);
|
|
5704
5781
|
dispatch({ type: "ACCOUNTS_RELOADED", accounts: accts, providers: prov, defaults });
|
|
5705
|
-
}, [getAccessToken, state.activeCredentialId, apiBaseUrl, depositAmount]);
|
|
5782
|
+
}, [getAccessToken, state.activeCredentialId, state.selectedAccountId, apiBaseUrl, depositAmount]);
|
|
5706
5783
|
const handleAuthorizedMobileReturn = useCallback(async (authorizedTransfer, isSetup) => {
|
|
5707
5784
|
if (handlingMobileReturnRef.current) return;
|
|
5708
5785
|
handlingMobileReturnRef.current = true;
|
|
@@ -5758,10 +5835,10 @@ function SwypePaymentInner({
|
|
|
5758
5835
|
let effectiveSourceId = sourceOverrides?.sourceId ?? sourceId;
|
|
5759
5836
|
if (effectiveSourceType === "accountId") {
|
|
5760
5837
|
const acct = state.accounts.find((a) => a.id === effectiveSourceId);
|
|
5761
|
-
const
|
|
5762
|
-
if (
|
|
5838
|
+
const preferredWallet = acct ? getPreferredDepositWallet(acct, payAmount) : null;
|
|
5839
|
+
if (preferredWallet?.status === "ACTIVE") {
|
|
5763
5840
|
effectiveSourceType = "walletId";
|
|
5764
|
-
effectiveSourceId =
|
|
5841
|
+
effectiveSourceId = preferredWallet.id;
|
|
5765
5842
|
}
|
|
5766
5843
|
}
|
|
5767
5844
|
const t = await createTransfer(apiBaseUrl, token, {
|
|
@@ -5987,14 +6064,14 @@ function SwypePaymentInner({
|
|
|
5987
6064
|
(accountId) => {
|
|
5988
6065
|
const acct = state.accounts.find((a) => a.id === accountId);
|
|
5989
6066
|
if (!acct) return;
|
|
5990
|
-
const activeWallet = acct
|
|
6067
|
+
const activeWallet = getPreferredDepositWallet(acct, depositAmount ?? 0);
|
|
5991
6068
|
dispatch({
|
|
5992
6069
|
type: "SELECT_ACCOUNT",
|
|
5993
6070
|
accountId,
|
|
5994
6071
|
walletId: activeWallet?.id ?? null
|
|
5995
6072
|
});
|
|
5996
6073
|
},
|
|
5997
|
-
[state.accounts]
|
|
6074
|
+
[state.accounts, depositAmount]
|
|
5998
6075
|
);
|
|
5999
6076
|
const handleNewPayment = useCallback(() => {
|
|
6000
6077
|
clearMobileFlowState();
|
|
@@ -6268,7 +6345,7 @@ function SwypePaymentInner({
|
|
|
6268
6345
|
]);
|
|
6269
6346
|
if (cancelled) return;
|
|
6270
6347
|
const parsedAmt = depositAmount != null ? depositAmount : 0;
|
|
6271
|
-
const defaults =
|
|
6348
|
+
const defaults = resolveDepositSelection(accts, parsedAmt, state.selectedAccountId);
|
|
6272
6349
|
const persisted = loadMobileFlowState();
|
|
6273
6350
|
const resolved = resolvePostAuthStep({
|
|
6274
6351
|
hasPasskey: !!state.activeCredentialId,
|
|
@@ -6315,6 +6392,7 @@ function SwypePaymentInner({
|
|
|
6315
6392
|
apiBaseUrl,
|
|
6316
6393
|
getAccessToken,
|
|
6317
6394
|
state.activeCredentialId,
|
|
6395
|
+
state.selectedAccountId,
|
|
6318
6396
|
depositAmount
|
|
6319
6397
|
]);
|
|
6320
6398
|
useEffect(() => {
|
|
@@ -6511,6 +6589,7 @@ function SwypePaymentInner({
|
|
|
6511
6589
|
transferSigningSigning: transferSigning.signing,
|
|
6512
6590
|
transferSigningError: transferSigning.error,
|
|
6513
6591
|
pendingConnections,
|
|
6592
|
+
depositEligibleAccounts,
|
|
6514
6593
|
sourceName,
|
|
6515
6594
|
sourceAddress,
|
|
6516
6595
|
sourceVerified,
|
|
@@ -6533,6 +6612,6 @@ function SwypePaymentInner({
|
|
|
6533
6612
|
);
|
|
6534
6613
|
}
|
|
6535
6614
|
|
|
6536
|
-
export { AdvancedSourceScreen, CreatePasskeyScreen, IconCircle, InfoBanner, OutlineButton, PasskeyIframeBlockedError, PoweredByFooter, PrimaryButton, ScreenHeader, ScreenLayout, SelectSourceScreen, SettingsMenu, SetupScreen, Spinner, StepList, SwypePayment, SwypeProvider, buildPasskeyPopupOptions, createPasskeyCredential, createPasskeyViaPopup, darkTheme, deviceHasPasskey, findDevicePasskey, findDevicePasskeyViaPopup, getTheme, lightTheme, resolvePasskeyRpId, api_exports as swypeApi, useAuthorizationExecutor, useSwypeConfig, useSwypeDepositAmount, useTransferPolling, useTransferSigning };
|
|
6615
|
+
export { AdvancedSourceScreen, CreatePasskeyScreen, IconCircle, InfoBanner, OutlineButton, PasskeyIframeBlockedError, PoweredByFooter, PrimaryButton, ScreenHeader, ScreenLayout, SelectSourceScreen, SettingsMenu, SetupScreen, Spinner, StepList, SwypeLoadingScreen, SwypePayment, SwypeProvider, buildPasskeyPopupOptions, createPasskeyCredential, createPasskeyViaPopup, darkTheme, deviceHasPasskey, findDevicePasskey, findDevicePasskeyViaPopup, getTheme, lightTheme, resolvePasskeyRpId, api_exports as swypeApi, useAuthorizationExecutor, useSwypeConfig, useSwypeDepositAmount, useTransferPolling, useTransferSigning };
|
|
6537
6616
|
//# sourceMappingURL=index.js.map
|
|
6538
6617
|
//# sourceMappingURL=index.js.map
|