@swype-org/react-sdk 0.1.106 → 0.1.109
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 +196 -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 +196 -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,56 +2185,65 @@ 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
|
+
minHeight: "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
|
minHeight: "100%",
|
|
@@ -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,7 +5216,7 @@ 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
5221
|
if (step === "login" && !authenticated) {
|
|
5152
5222
|
return /* @__PURE__ */ jsx(
|
|
@@ -5234,7 +5304,7 @@ function StepRenderer({
|
|
|
5234
5304
|
}
|
|
5235
5305
|
if (step === "deposit") {
|
|
5236
5306
|
if (state.loadingData) {
|
|
5237
|
-
return /* @__PURE__ */ jsx(
|
|
5307
|
+
return /* @__PURE__ */ jsx(SwypeLoadingScreen, {});
|
|
5238
5308
|
}
|
|
5239
5309
|
const parsedAmt = depositAmount != null ? depositAmount : 5;
|
|
5240
5310
|
return /* @__PURE__ */ jsx(
|
|
@@ -5256,7 +5326,7 @@ function StepRenderer({
|
|
|
5256
5326
|
onLogout: handlers.onLogout,
|
|
5257
5327
|
onIncreaseLimit: handlers.onIncreaseLimit,
|
|
5258
5328
|
increasingLimit: state.increasingLimit,
|
|
5259
|
-
accounts:
|
|
5329
|
+
accounts: depositEligibleAccounts,
|
|
5260
5330
|
selectedAccountId: state.selectedAccountId,
|
|
5261
5331
|
onSelectAccount: handlers.onSelectAccount,
|
|
5262
5332
|
onAuthorizeAccount: handlers.onContinueConnection,
|
|
@@ -5332,7 +5402,7 @@ function StepRenderer({
|
|
|
5332
5402
|
onSwitchWallet: () => handlers.onNavigate("wallet-picker"),
|
|
5333
5403
|
onBack: onBack ?? (() => handlers.onLogout()),
|
|
5334
5404
|
onLogout: handlers.onLogout,
|
|
5335
|
-
accounts:
|
|
5405
|
+
accounts: depositEligibleAccounts,
|
|
5336
5406
|
selectedAccountId: state.selectedAccountId,
|
|
5337
5407
|
onSelectAccount: handlers.onSelectAccount,
|
|
5338
5408
|
onAuthorizeAccount: handlers.onContinueConnection,
|
|
@@ -5361,7 +5431,7 @@ var PaymentErrorBoundary = class extends Component {
|
|
|
5361
5431
|
if (!this.state.hasError) {
|
|
5362
5432
|
return this.props.children;
|
|
5363
5433
|
}
|
|
5364
|
-
return /* @__PURE__ */ jsxs("div", { style:
|
|
5434
|
+
return /* @__PURE__ */ jsxs("div", { style: containerStyle8, children: [
|
|
5365
5435
|
/* @__PURE__ */ jsx("div", { style: iconStyle4, children: /* @__PURE__ */ jsxs("svg", { width: "48", height: "48", viewBox: "0 0 24 24", fill: "none", children: [
|
|
5366
5436
|
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10", stroke: "#ef4444", strokeWidth: "1.5" }),
|
|
5367
5437
|
/* @__PURE__ */ jsx("path", { d: "M12 8v5", stroke: "#ef4444", strokeWidth: "1.5", strokeLinecap: "round" }),
|
|
@@ -5373,7 +5443,7 @@ var PaymentErrorBoundary = class extends Component {
|
|
|
5373
5443
|
] });
|
|
5374
5444
|
}
|
|
5375
5445
|
};
|
|
5376
|
-
var
|
|
5446
|
+
var containerStyle8 = {
|
|
5377
5447
|
display: "flex",
|
|
5378
5448
|
flexDirection: "column",
|
|
5379
5449
|
alignItems: "center",
|
|
@@ -5490,6 +5560,10 @@ function SwypePaymentInner({
|
|
|
5490
5560
|
),
|
|
5491
5561
|
[state.accounts]
|
|
5492
5562
|
);
|
|
5563
|
+
const depositEligibleAccounts = useMemo(
|
|
5564
|
+
() => getDepositEligibleAccounts(state.accounts),
|
|
5565
|
+
[state.accounts]
|
|
5566
|
+
);
|
|
5493
5567
|
const maxSourceBalance = useMemo(() => {
|
|
5494
5568
|
let max = 0;
|
|
5495
5569
|
for (const acct of state.accounts) {
|
|
@@ -5700,9 +5774,9 @@ function SwypePaymentInner({
|
|
|
5700
5774
|
fetchProviders(apiBaseUrl, token)
|
|
5701
5775
|
]);
|
|
5702
5776
|
const parsedAmt = depositAmount != null ? depositAmount : 0;
|
|
5703
|
-
const defaults =
|
|
5777
|
+
const defaults = resolveDepositSelection(accts, parsedAmt, state.selectedAccountId);
|
|
5704
5778
|
dispatch({ type: "ACCOUNTS_RELOADED", accounts: accts, providers: prov, defaults });
|
|
5705
|
-
}, [getAccessToken, state.activeCredentialId, apiBaseUrl, depositAmount]);
|
|
5779
|
+
}, [getAccessToken, state.activeCredentialId, state.selectedAccountId, apiBaseUrl, depositAmount]);
|
|
5706
5780
|
const handleAuthorizedMobileReturn = useCallback(async (authorizedTransfer, isSetup) => {
|
|
5707
5781
|
if (handlingMobileReturnRef.current) return;
|
|
5708
5782
|
handlingMobileReturnRef.current = true;
|
|
@@ -5758,10 +5832,10 @@ function SwypePaymentInner({
|
|
|
5758
5832
|
let effectiveSourceId = sourceOverrides?.sourceId ?? sourceId;
|
|
5759
5833
|
if (effectiveSourceType === "accountId") {
|
|
5760
5834
|
const acct = state.accounts.find((a) => a.id === effectiveSourceId);
|
|
5761
|
-
const
|
|
5762
|
-
if (
|
|
5835
|
+
const preferredWallet = acct ? getPreferredDepositWallet(acct, payAmount) : null;
|
|
5836
|
+
if (preferredWallet?.status === "ACTIVE") {
|
|
5763
5837
|
effectiveSourceType = "walletId";
|
|
5764
|
-
effectiveSourceId =
|
|
5838
|
+
effectiveSourceId = preferredWallet.id;
|
|
5765
5839
|
}
|
|
5766
5840
|
}
|
|
5767
5841
|
const t = await createTransfer(apiBaseUrl, token, {
|
|
@@ -5824,6 +5898,11 @@ function SwypePaymentInner({
|
|
|
5824
5898
|
dispatch({ type: "NAVIGATE", step: "create-passkey" });
|
|
5825
5899
|
return;
|
|
5826
5900
|
}
|
|
5901
|
+
const acct = state.accounts.find((a) => a.id === state.selectedAccountId);
|
|
5902
|
+
const matchedProvider = acct ? state.providers.find((p) => p.name === acct.name) : void 0;
|
|
5903
|
+
if (matchedProvider) {
|
|
5904
|
+
dispatch({ type: "SELECT_PROVIDER", providerId: matchedProvider.id });
|
|
5905
|
+
}
|
|
5827
5906
|
dispatch({ type: "SET_ERROR", error: null });
|
|
5828
5907
|
dispatch({ type: "SET_INCREASING_LIMIT", value: true });
|
|
5829
5908
|
try {
|
|
@@ -5847,7 +5926,7 @@ function SwypePaymentInner({
|
|
|
5847
5926
|
accountId: state.selectedAccountId,
|
|
5848
5927
|
sessionId: session.id,
|
|
5849
5928
|
deeplinkUri: session.uri,
|
|
5850
|
-
providerId: null,
|
|
5929
|
+
providerId: matchedProvider?.id ?? null,
|
|
5851
5930
|
isSetup: true
|
|
5852
5931
|
});
|
|
5853
5932
|
dispatch({ type: "MOBILE_DEEPLINK_READY", deeplinkUri: session.uri });
|
|
@@ -5868,6 +5947,8 @@ function SwypePaymentInner({
|
|
|
5868
5947
|
}, [
|
|
5869
5948
|
state.selectedAccountId,
|
|
5870
5949
|
state.activeCredentialId,
|
|
5950
|
+
state.accounts,
|
|
5951
|
+
state.providers,
|
|
5871
5952
|
apiBaseUrl,
|
|
5872
5953
|
getAccessToken,
|
|
5873
5954
|
authExecutor,
|
|
@@ -5980,14 +6061,14 @@ function SwypePaymentInner({
|
|
|
5980
6061
|
(accountId) => {
|
|
5981
6062
|
const acct = state.accounts.find((a) => a.id === accountId);
|
|
5982
6063
|
if (!acct) return;
|
|
5983
|
-
const activeWallet = acct
|
|
6064
|
+
const activeWallet = getPreferredDepositWallet(acct, depositAmount ?? 0);
|
|
5984
6065
|
dispatch({
|
|
5985
6066
|
type: "SELECT_ACCOUNT",
|
|
5986
6067
|
accountId,
|
|
5987
6068
|
walletId: activeWallet?.id ?? null
|
|
5988
6069
|
});
|
|
5989
6070
|
},
|
|
5990
|
-
[state.accounts]
|
|
6071
|
+
[state.accounts, depositAmount]
|
|
5991
6072
|
);
|
|
5992
6073
|
const handleNewPayment = useCallback(() => {
|
|
5993
6074
|
clearMobileFlowState();
|
|
@@ -6261,7 +6342,7 @@ function SwypePaymentInner({
|
|
|
6261
6342
|
]);
|
|
6262
6343
|
if (cancelled) return;
|
|
6263
6344
|
const parsedAmt = depositAmount != null ? depositAmount : 0;
|
|
6264
|
-
const defaults =
|
|
6345
|
+
const defaults = resolveDepositSelection(accts, parsedAmt, state.selectedAccountId);
|
|
6265
6346
|
const persisted = loadMobileFlowState();
|
|
6266
6347
|
const resolved = resolvePostAuthStep({
|
|
6267
6348
|
hasPasskey: !!state.activeCredentialId,
|
|
@@ -6308,6 +6389,7 @@ function SwypePaymentInner({
|
|
|
6308
6389
|
apiBaseUrl,
|
|
6309
6390
|
getAccessToken,
|
|
6310
6391
|
state.activeCredentialId,
|
|
6392
|
+
state.selectedAccountId,
|
|
6311
6393
|
depositAmount
|
|
6312
6394
|
]);
|
|
6313
6395
|
useEffect(() => {
|
|
@@ -6435,7 +6517,7 @@ function SwypePaymentInner({
|
|
|
6435
6517
|
initializedSelectSourceActionRef.current = pendingSelectSourceAction.id;
|
|
6436
6518
|
}, [pendingSelectSourceAction, selectSourceChoices, selectSourceRecommended]);
|
|
6437
6519
|
useEffect(() => {
|
|
6438
|
-
if (pendingSelectSourceAction && state.step === "processing") {
|
|
6520
|
+
if (pendingSelectSourceAction && (state.step === "processing" || state.step === "open-wallet")) {
|
|
6439
6521
|
preSelectSourceStepRef.current = state.step;
|
|
6440
6522
|
dispatch({ type: "NAVIGATE", step: "select-source" });
|
|
6441
6523
|
} else if (!pendingSelectSourceAction && state.step === "select-source") {
|
|
@@ -6504,6 +6586,7 @@ function SwypePaymentInner({
|
|
|
6504
6586
|
transferSigningSigning: transferSigning.signing,
|
|
6505
6587
|
transferSigningError: transferSigning.error,
|
|
6506
6588
|
pendingConnections,
|
|
6589
|
+
depositEligibleAccounts,
|
|
6507
6590
|
sourceName,
|
|
6508
6591
|
sourceAddress,
|
|
6509
6592
|
sourceVerified,
|
|
@@ -6526,6 +6609,6 @@ function SwypePaymentInner({
|
|
|
6526
6609
|
);
|
|
6527
6610
|
}
|
|
6528
6611
|
|
|
6529
|
-
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 };
|
|
6612
|
+
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 };
|
|
6530
6613
|
//# sourceMappingURL=index.js.map
|
|
6531
6614
|
//# sourceMappingURL=index.js.map
|