@swype-org/react-sdk 0.1.59 → 0.1.64
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 +377 -69
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +26 -5
- package/dist/index.d.ts +26 -5
- package/dist/index.js +377 -70
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -677,7 +677,7 @@ function createPasskeyViaPopup(options) {
|
|
|
677
677
|
return new Promise((resolve, reject) => {
|
|
678
678
|
const encoded = btoa(JSON.stringify(options));
|
|
679
679
|
const popupUrl = `${window.location.origin}/passkey-register#${encoded}`;
|
|
680
|
-
const popup = window.open(popupUrl, "swype-passkey"
|
|
680
|
+
const popup = window.open(popupUrl, "swype-passkey");
|
|
681
681
|
if (!popup) {
|
|
682
682
|
reject(new Error("Pop-up blocked. Please allow pop-ups for this site and try again."));
|
|
683
683
|
return;
|
|
@@ -1941,10 +1941,20 @@ function LimitSlider({
|
|
|
1941
1941
|
}
|
|
1942
1942
|
)
|
|
1943
1943
|
] }),
|
|
1944
|
-
ticks && ticks.length > 0 && /* @__PURE__ */ jsx("div", { style: ticksStyle, children: ticks.map((tick) =>
|
|
1945
|
-
|
|
1946
|
-
|
|
1947
|
-
|
|
1944
|
+
ticks && ticks.length > 0 && /* @__PURE__ */ jsx("div", { style: ticksStyle, children: ticks.map((tick, i) => {
|
|
1945
|
+
const pctPos = (tick - min) / (max - min) * 100;
|
|
1946
|
+
const isFirst = i === 0;
|
|
1947
|
+
const isLast = i === ticks.length - 1;
|
|
1948
|
+
const label = tick % 1 === 0 ? `$${tick}` : `$${tick.toFixed(2)}`;
|
|
1949
|
+
return /* @__PURE__ */ jsx(
|
|
1950
|
+
"span",
|
|
1951
|
+
{
|
|
1952
|
+
style: tickLabelStyle(tokens.textMuted, pctPos, isFirst, isLast),
|
|
1953
|
+
children: label
|
|
1954
|
+
},
|
|
1955
|
+
tick
|
|
1956
|
+
);
|
|
1957
|
+
}) }),
|
|
1948
1958
|
/* @__PURE__ */ jsx("style", { children: sliderThumbCss(tokens.accent) })
|
|
1949
1959
|
] });
|
|
1950
1960
|
}
|
|
@@ -1985,14 +1995,18 @@ var rangeInputStyle = {
|
|
|
1985
1995
|
background: "transparent"
|
|
1986
1996
|
};
|
|
1987
1997
|
var ticksStyle = {
|
|
1988
|
-
|
|
1989
|
-
|
|
1998
|
+
position: "relative",
|
|
1999
|
+
height: 18,
|
|
1990
2000
|
marginTop: 6
|
|
1991
2001
|
};
|
|
1992
|
-
var tickLabelStyle = (color) => ({
|
|
2002
|
+
var tickLabelStyle = (color, pct, isFirst, isLast) => ({
|
|
2003
|
+
position: "absolute",
|
|
2004
|
+
left: `${pct}%`,
|
|
2005
|
+
transform: isFirst ? "none" : isLast ? "translateX(-100%)" : "translateX(-50%)",
|
|
1993
2006
|
fontSize: "0.72rem",
|
|
1994
2007
|
fontWeight: 500,
|
|
1995
|
-
color
|
|
2008
|
+
color,
|
|
2009
|
+
whiteSpace: "nowrap"
|
|
1996
2010
|
});
|
|
1997
2011
|
var sliderThumbCss = (accent) => `
|
|
1998
2012
|
.swype-slider-wrap input[type="range"]::-webkit-slider-runnable-track {
|
|
@@ -3005,11 +3019,13 @@ function SetupScreen({
|
|
|
3005
3019
|
onSetupOneTap,
|
|
3006
3020
|
onBack,
|
|
3007
3021
|
onLogout,
|
|
3022
|
+
onAdvanced,
|
|
3023
|
+
selectedSourceLabel,
|
|
3008
3024
|
loading,
|
|
3009
3025
|
error
|
|
3010
3026
|
}) {
|
|
3011
3027
|
const { tokens } = useSwypeConfig();
|
|
3012
|
-
const effectiveMax = Math.min(DEFAULT_MAX, availableBalance > 0 ? availableBalance : DEFAULT_MAX);
|
|
3028
|
+
const effectiveMax = Math.floor(Math.min(DEFAULT_MAX, availableBalance > 0 ? availableBalance : DEFAULT_MAX) * 100) / 100;
|
|
3013
3029
|
const effectiveMin = Math.min(ABSOLUTE_MIN, effectiveMax);
|
|
3014
3030
|
const sliderStep = effectiveMax <= 10 ? 0.5 : effectiveMax <= 50 ? 1 : 5;
|
|
3015
3031
|
const ticks = buildTicks(effectiveMin, effectiveMax);
|
|
@@ -3048,18 +3064,30 @@ function SetupScreen({
|
|
|
3048
3064
|
] })
|
|
3049
3065
|
] })
|
|
3050
3066
|
] }),
|
|
3051
|
-
tokenCount > 0 && /* @__PURE__ */ jsxs(
|
|
3052
|
-
|
|
3053
|
-
|
|
3054
|
-
|
|
3055
|
-
|
|
3056
|
-
|
|
3067
|
+
tokenCount > 0 && /* @__PURE__ */ jsxs(
|
|
3068
|
+
"button",
|
|
3069
|
+
{
|
|
3070
|
+
type: "button",
|
|
3071
|
+
onClick: onAdvanced,
|
|
3072
|
+
style: tokenBadgeButtonStyle(tokens, !!onAdvanced),
|
|
3073
|
+
children: [
|
|
3074
|
+
/* @__PURE__ */ jsx("span", { style: tokenDotStyle(tokens.accent) }),
|
|
3075
|
+
tokenCount,
|
|
3076
|
+
" ",
|
|
3077
|
+
/* @__PURE__ */ jsx("span", { style: chevronStyle, children: ">" })
|
|
3078
|
+
]
|
|
3079
|
+
}
|
|
3080
|
+
)
|
|
3081
|
+
] }),
|
|
3082
|
+
selectedSourceLabel && /* @__PURE__ */ jsxs("div", { style: selectedSourceStyle(tokens.textSecondary), children: [
|
|
3083
|
+
"Source: ",
|
|
3084
|
+
/* @__PURE__ */ jsx("strong", { children: selectedSourceLabel })
|
|
3057
3085
|
] }),
|
|
3058
3086
|
/* @__PURE__ */ jsxs("div", { style: limitSectionStyle, children: [
|
|
3059
3087
|
/* @__PURE__ */ jsx("div", { style: limitLabelStyle(tokens.textMuted), children: "Your One-Tap limit" }),
|
|
3060
3088
|
/* @__PURE__ */ jsxs("div", { style: limitValueStyle(tokens.text), children: [
|
|
3061
3089
|
"$",
|
|
3062
|
-
limit
|
|
3090
|
+
limit.toFixed(2)
|
|
3063
3091
|
] }),
|
|
3064
3092
|
/* @__PURE__ */ jsx(
|
|
3065
3093
|
LimitSlider,
|
|
@@ -3134,7 +3162,7 @@ var balanceValueStyle = (color) => ({
|
|
|
3134
3162
|
fontWeight: 700,
|
|
3135
3163
|
color
|
|
3136
3164
|
});
|
|
3137
|
-
var
|
|
3165
|
+
var tokenBadgeButtonStyle = (tokens, clickable) => ({
|
|
3138
3166
|
display: "flex",
|
|
3139
3167
|
alignItems: "center",
|
|
3140
3168
|
gap: 4,
|
|
@@ -3142,7 +3170,16 @@ var tokenBadgeStyle = (tokens) => ({
|
|
|
3142
3170
|
color: tokens.textMuted,
|
|
3143
3171
|
border: `1px solid ${tokens.border}`,
|
|
3144
3172
|
borderRadius: 999,
|
|
3145
|
-
padding: "4px 10px"
|
|
3173
|
+
padding: "4px 10px",
|
|
3174
|
+
background: "transparent",
|
|
3175
|
+
fontFamily: "inherit",
|
|
3176
|
+
cursor: clickable ? "pointer" : "default"
|
|
3177
|
+
});
|
|
3178
|
+
var selectedSourceStyle = (color) => ({
|
|
3179
|
+
fontSize: "0.8rem",
|
|
3180
|
+
color,
|
|
3181
|
+
marginBottom: 16,
|
|
3182
|
+
textAlign: "center"
|
|
3146
3183
|
});
|
|
3147
3184
|
var tokenDotStyle = (color) => ({
|
|
3148
3185
|
width: 8,
|
|
@@ -3307,7 +3344,7 @@ function DepositScreen({
|
|
|
3307
3344
|
] })
|
|
3308
3345
|
] })
|
|
3309
3346
|
] }),
|
|
3310
|
-
tokenCount > 0 && /* @__PURE__ */ jsxs("div", { style:
|
|
3347
|
+
tokenCount > 0 && /* @__PURE__ */ jsxs("div", { style: tokenBadgeStyle(tokens), children: [
|
|
3311
3348
|
/* @__PURE__ */ jsx("span", { style: tokenDotStyle2(tokens.accent) }),
|
|
3312
3349
|
tokenCount,
|
|
3313
3350
|
" ",
|
|
@@ -3370,7 +3407,7 @@ var balanceAmountStyle = {
|
|
|
3370
3407
|
fontSize: "1rem",
|
|
3371
3408
|
fontWeight: 700
|
|
3372
3409
|
};
|
|
3373
|
-
var
|
|
3410
|
+
var tokenBadgeStyle = (tokens) => ({
|
|
3374
3411
|
display: "flex",
|
|
3375
3412
|
alignItems: "center",
|
|
3376
3413
|
gap: 4,
|
|
@@ -3775,6 +3812,228 @@ var radioDotStyle = (color) => ({
|
|
|
3775
3812
|
borderRadius: "50%",
|
|
3776
3813
|
background: color
|
|
3777
3814
|
});
|
|
3815
|
+
function AdvancedSourceScreen({
|
|
3816
|
+
choices,
|
|
3817
|
+
selectedChainName,
|
|
3818
|
+
selectedTokenSymbol,
|
|
3819
|
+
onSelectSource,
|
|
3820
|
+
onBack
|
|
3821
|
+
}) {
|
|
3822
|
+
const { tokens } = useSwypeConfig();
|
|
3823
|
+
const [expandedChain, setExpandedChain] = useState(
|
|
3824
|
+
selectedChainName || (choices[0]?.chainName ?? null)
|
|
3825
|
+
);
|
|
3826
|
+
const [localChain, setLocalChain] = useState(selectedChainName);
|
|
3827
|
+
const [localToken, setLocalToken] = useState(selectedTokenSymbol);
|
|
3828
|
+
const canConfirm = !!localChain && !!localToken;
|
|
3829
|
+
const handleChainToggle = (chainName) => {
|
|
3830
|
+
setExpandedChain((prev) => prev === chainName ? null : chainName);
|
|
3831
|
+
};
|
|
3832
|
+
const handleTokenSelect = (chainName, tokenSymbol) => {
|
|
3833
|
+
setLocalChain(chainName);
|
|
3834
|
+
setLocalToken(tokenSymbol);
|
|
3835
|
+
setExpandedChain(chainName);
|
|
3836
|
+
};
|
|
3837
|
+
return /* @__PURE__ */ jsxs(
|
|
3838
|
+
ScreenLayout,
|
|
3839
|
+
{
|
|
3840
|
+
footer: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3841
|
+
/* @__PURE__ */ jsx(
|
|
3842
|
+
PrimaryButton,
|
|
3843
|
+
{
|
|
3844
|
+
onClick: () => onSelectSource(localChain, localToken),
|
|
3845
|
+
disabled: !canConfirm,
|
|
3846
|
+
children: "Select Source"
|
|
3847
|
+
}
|
|
3848
|
+
),
|
|
3849
|
+
/* @__PURE__ */ jsx(PoweredByFooter, {})
|
|
3850
|
+
] }),
|
|
3851
|
+
children: [
|
|
3852
|
+
/* @__PURE__ */ jsx(
|
|
3853
|
+
ScreenHeader,
|
|
3854
|
+
{
|
|
3855
|
+
title: "Swype Setup",
|
|
3856
|
+
onBack,
|
|
3857
|
+
right: /* @__PURE__ */ jsx("span", { style: advancedBadgeStyle(tokens.accent), children: "Advanced" })
|
|
3858
|
+
}
|
|
3859
|
+
),
|
|
3860
|
+
/* @__PURE__ */ jsx("h2", { style: headingStyle7(tokens.text), children: "Set up One-Tap deposits" }),
|
|
3861
|
+
/* @__PURE__ */ jsx("p", { style: subtitleStyle8(tokens.textSecondary), children: "Select a token source for your One-Tap deposits." }),
|
|
3862
|
+
/* @__PURE__ */ jsx("label", { style: labelStyle3(tokens.textSecondary), children: "Select tokens to approve" }),
|
|
3863
|
+
/* @__PURE__ */ jsx("div", { style: chainListStyle, children: choices.map((chain) => {
|
|
3864
|
+
const isExpanded = expandedChain === chain.chainName;
|
|
3865
|
+
const chainHasSelection = localChain === chain.chainName;
|
|
3866
|
+
return /* @__PURE__ */ jsxs("div", { style: chainCardStyle(tokens), children: [
|
|
3867
|
+
/* @__PURE__ */ jsxs(
|
|
3868
|
+
"button",
|
|
3869
|
+
{
|
|
3870
|
+
type: "button",
|
|
3871
|
+
onClick: () => handleChainToggle(chain.chainName),
|
|
3872
|
+
style: chainHeaderStyle(tokens),
|
|
3873
|
+
children: [
|
|
3874
|
+
/* @__PURE__ */ jsxs("div", { style: chainHeaderLeftStyle, children: [
|
|
3875
|
+
/* @__PURE__ */ jsx("span", { style: chainNameStyle(tokens.text), children: chain.chainName }),
|
|
3876
|
+
/* @__PURE__ */ jsxs("span", { style: chainBalanceStyle(tokens.textMuted), children: [
|
|
3877
|
+
"$",
|
|
3878
|
+
chain.balance.toLocaleString("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 })
|
|
3879
|
+
] })
|
|
3880
|
+
] }),
|
|
3881
|
+
/* @__PURE__ */ jsx("span", { style: chevronIconStyle(isExpanded, tokens.textMuted), children: isExpanded ? "\u25BE" : "\u25B8" })
|
|
3882
|
+
]
|
|
3883
|
+
}
|
|
3884
|
+
),
|
|
3885
|
+
isExpanded && /* @__PURE__ */ jsx("div", { style: tokenListStyle, children: chain.tokens.map((token) => {
|
|
3886
|
+
const isSelected = chainHasSelection && localToken === token.tokenSymbol;
|
|
3887
|
+
return /* @__PURE__ */ jsxs(
|
|
3888
|
+
"button",
|
|
3889
|
+
{
|
|
3890
|
+
type: "button",
|
|
3891
|
+
onClick: () => handleTokenSelect(chain.chainName, token.tokenSymbol),
|
|
3892
|
+
style: tokenRowStyle(tokens, isSelected),
|
|
3893
|
+
children: [
|
|
3894
|
+
/* @__PURE__ */ jsxs("div", { style: tokenInfoStyle, children: [
|
|
3895
|
+
/* @__PURE__ */ jsx("span", { style: tokenSymbolStyle(tokens.text), children: token.tokenSymbol }),
|
|
3896
|
+
/* @__PURE__ */ jsxs("span", { style: tokenBalStyle(tokens.textMuted), children: [
|
|
3897
|
+
"Balance: ",
|
|
3898
|
+
token.balance.toLocaleString("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 }),
|
|
3899
|
+
" ",
|
|
3900
|
+
token.tokenSymbol
|
|
3901
|
+
] })
|
|
3902
|
+
] }),
|
|
3903
|
+
/* @__PURE__ */ jsx("div", { style: radioStyle2(tokens, isSelected), children: isSelected && /* @__PURE__ */ jsx("div", { style: radioDotStyle2(tokens.accent) }) })
|
|
3904
|
+
]
|
|
3905
|
+
},
|
|
3906
|
+
token.tokenSymbol
|
|
3907
|
+
);
|
|
3908
|
+
}) })
|
|
3909
|
+
] }, chain.chainName);
|
|
3910
|
+
}) })
|
|
3911
|
+
]
|
|
3912
|
+
}
|
|
3913
|
+
);
|
|
3914
|
+
}
|
|
3915
|
+
var advancedBadgeStyle = (color) => ({
|
|
3916
|
+
fontSize: "0.72rem",
|
|
3917
|
+
fontWeight: 600,
|
|
3918
|
+
color,
|
|
3919
|
+
border: `1px solid ${color}`,
|
|
3920
|
+
borderRadius: 999,
|
|
3921
|
+
padding: "3px 10px",
|
|
3922
|
+
letterSpacing: "0.02em"
|
|
3923
|
+
});
|
|
3924
|
+
var headingStyle7 = (color) => ({
|
|
3925
|
+
fontSize: "1.3rem",
|
|
3926
|
+
fontWeight: 700,
|
|
3927
|
+
letterSpacing: "-0.02em",
|
|
3928
|
+
color,
|
|
3929
|
+
margin: "8px 0 4px"
|
|
3930
|
+
});
|
|
3931
|
+
var subtitleStyle8 = (color) => ({
|
|
3932
|
+
fontSize: "0.86rem",
|
|
3933
|
+
color,
|
|
3934
|
+
margin: "0 0 20px",
|
|
3935
|
+
lineHeight: 1.5
|
|
3936
|
+
});
|
|
3937
|
+
var labelStyle3 = (color) => ({
|
|
3938
|
+
display: "block",
|
|
3939
|
+
fontSize: "0.75rem",
|
|
3940
|
+
fontWeight: 600,
|
|
3941
|
+
color,
|
|
3942
|
+
textTransform: "uppercase",
|
|
3943
|
+
letterSpacing: "0.05em",
|
|
3944
|
+
marginBottom: 10
|
|
3945
|
+
});
|
|
3946
|
+
var chainListStyle = {
|
|
3947
|
+
display: "flex",
|
|
3948
|
+
flexDirection: "column",
|
|
3949
|
+
gap: 10
|
|
3950
|
+
};
|
|
3951
|
+
var chainCardStyle = (tokens) => ({
|
|
3952
|
+
border: `1px solid ${tokens.border}`,
|
|
3953
|
+
borderRadius: 14,
|
|
3954
|
+
overflow: "hidden",
|
|
3955
|
+
background: tokens.bgInput
|
|
3956
|
+
});
|
|
3957
|
+
var chainHeaderStyle = (tokens, _expanded) => ({
|
|
3958
|
+
display: "flex",
|
|
3959
|
+
alignItems: "center",
|
|
3960
|
+
justifyContent: "space-between",
|
|
3961
|
+
width: "100%",
|
|
3962
|
+
padding: "14px 16px",
|
|
3963
|
+
background: tokens.bgInput,
|
|
3964
|
+
border: "none",
|
|
3965
|
+
cursor: "pointer",
|
|
3966
|
+
fontFamily: "inherit",
|
|
3967
|
+
textAlign: "left"
|
|
3968
|
+
});
|
|
3969
|
+
var chainHeaderLeftStyle = {
|
|
3970
|
+
display: "flex",
|
|
3971
|
+
flexDirection: "column",
|
|
3972
|
+
gap: 2
|
|
3973
|
+
};
|
|
3974
|
+
var chainNameStyle = (color) => ({
|
|
3975
|
+
fontSize: "0.92rem",
|
|
3976
|
+
fontWeight: 600,
|
|
3977
|
+
color
|
|
3978
|
+
});
|
|
3979
|
+
var chainBalanceStyle = (color) => ({
|
|
3980
|
+
fontSize: "0.76rem",
|
|
3981
|
+
color
|
|
3982
|
+
});
|
|
3983
|
+
var chevronIconStyle = (_expanded, color) => ({
|
|
3984
|
+
fontSize: "0.9rem",
|
|
3985
|
+
color,
|
|
3986
|
+
transition: "transform 0.15s ease"
|
|
3987
|
+
});
|
|
3988
|
+
var tokenListStyle = {
|
|
3989
|
+
padding: "0 12px 12px",
|
|
3990
|
+
display: "flex",
|
|
3991
|
+
flexDirection: "column",
|
|
3992
|
+
gap: 6
|
|
3993
|
+
};
|
|
3994
|
+
var tokenRowStyle = (tokens, selected) => ({
|
|
3995
|
+
display: "flex",
|
|
3996
|
+
alignItems: "center",
|
|
3997
|
+
justifyContent: "space-between",
|
|
3998
|
+
padding: "12px 14px",
|
|
3999
|
+
background: tokens.bgCard,
|
|
4000
|
+
border: `1.5px solid ${selected ? tokens.accent : tokens.border}`,
|
|
4001
|
+
borderRadius: 10,
|
|
4002
|
+
cursor: "pointer",
|
|
4003
|
+
fontFamily: "inherit",
|
|
4004
|
+
textAlign: "left",
|
|
4005
|
+
transition: "border-color 0.15s ease"
|
|
4006
|
+
});
|
|
4007
|
+
var tokenInfoStyle = {
|
|
4008
|
+
display: "flex",
|
|
4009
|
+
flexDirection: "column",
|
|
4010
|
+
gap: 2
|
|
4011
|
+
};
|
|
4012
|
+
var tokenSymbolStyle = (color) => ({
|
|
4013
|
+
fontSize: "0.88rem",
|
|
4014
|
+
fontWeight: 600,
|
|
4015
|
+
color
|
|
4016
|
+
});
|
|
4017
|
+
var tokenBalStyle = (color) => ({
|
|
4018
|
+
fontSize: "0.74rem",
|
|
4019
|
+
color
|
|
4020
|
+
});
|
|
4021
|
+
var radioStyle2 = (tokens, selected) => ({
|
|
4022
|
+
width: 20,
|
|
4023
|
+
height: 20,
|
|
4024
|
+
borderRadius: "50%",
|
|
4025
|
+
border: `2px solid ${selected ? tokens.accent : tokens.border}`,
|
|
4026
|
+
display: "flex",
|
|
4027
|
+
alignItems: "center",
|
|
4028
|
+
justifyContent: "center",
|
|
4029
|
+
flexShrink: 0
|
|
4030
|
+
});
|
|
4031
|
+
var radioDotStyle2 = (color) => ({
|
|
4032
|
+
width: 10,
|
|
4033
|
+
height: 10,
|
|
4034
|
+
borderRadius: "50%",
|
|
4035
|
+
background: color
|
|
4036
|
+
});
|
|
3778
4037
|
var STEP_LABELS = ["Creating transfer", "Verifying", "Sent", "Done"];
|
|
3779
4038
|
var PHASE_ACTIVE_INDEX = {
|
|
3780
4039
|
creating: 0,
|
|
@@ -3800,7 +4059,7 @@ function TransferStatusScreen({
|
|
|
3800
4059
|
/* @__PURE__ */ jsx(ScreenHeader, { right: /* @__PURE__ */ jsx(SettingsMenu, { onLogout }) }),
|
|
3801
4060
|
/* @__PURE__ */ jsxs("div", { style: contentStyle5, children: [
|
|
3802
4061
|
/* @__PURE__ */ jsx(Spinner, { size: 48 }),
|
|
3803
|
-
/* @__PURE__ */ jsx("h2", { style:
|
|
4062
|
+
/* @__PURE__ */ jsx("h2", { style: headingStyle8(tokens.text), children: "Processing Transfer..." }),
|
|
3804
4063
|
error && /* @__PURE__ */ jsx("div", { style: errorBannerStyle5(tokens), children: error }),
|
|
3805
4064
|
/* @__PURE__ */ jsx("div", { style: stepsWrapStyle, children: /* @__PURE__ */ jsx(StepList, { steps }) }),
|
|
3806
4065
|
/* @__PURE__ */ jsx("p", { style: waitHintStyle(tokens.textMuted), children: "Usually takes a few seconds" })
|
|
@@ -3816,7 +4075,7 @@ var contentStyle5 = {
|
|
|
3816
4075
|
textAlign: "center",
|
|
3817
4076
|
padding: "0 24px"
|
|
3818
4077
|
};
|
|
3819
|
-
var
|
|
4078
|
+
var headingStyle8 = (color) => ({
|
|
3820
4079
|
fontSize: "1.45rem",
|
|
3821
4080
|
fontWeight: 700,
|
|
3822
4081
|
letterSpacing: "-0.02em",
|
|
@@ -3859,10 +4118,7 @@ function OpenWalletScreen({
|
|
|
3859
4118
|
useEffect(() => {
|
|
3860
4119
|
if (loading || !deeplinkUri || autoOpenedRef.current === deeplinkUri) return;
|
|
3861
4120
|
autoOpenedRef.current = deeplinkUri;
|
|
3862
|
-
|
|
3863
|
-
if (!opened && window === window.parent) {
|
|
3864
|
-
window.location.href = deeplinkUri;
|
|
3865
|
-
}
|
|
4121
|
+
window.location.href = deeplinkUri;
|
|
3866
4122
|
}, [loading, deeplinkUri]);
|
|
3867
4123
|
const handleOpen = useCallback(() => {
|
|
3868
4124
|
const opened = window.open(deeplinkUri, "_blank");
|
|
@@ -3884,8 +4140,8 @@ function OpenWalletScreen({
|
|
|
3884
4140
|
/* @__PURE__ */ jsx(ScreenHeader, { right: /* @__PURE__ */ jsx(SettingsMenu, { onLogout }) }),
|
|
3885
4141
|
/* @__PURE__ */ jsxs("div", { style: contentStyle6, children: [
|
|
3886
4142
|
logoSrc ? /* @__PURE__ */ jsx("img", { src: logoSrc, alt: displayName, style: logoStyle }) : /* @__PURE__ */ jsx(Spinner, { size: 48 }),
|
|
3887
|
-
/* @__PURE__ */ jsx("h2", { style:
|
|
3888
|
-
/* @__PURE__ */ jsx("p", { style:
|
|
4143
|
+
/* @__PURE__ */ jsx("h2", { style: headingStyle9(tokens.text), children: loading ? "Connecting..." : `Open ${displayName}` }),
|
|
4144
|
+
/* @__PURE__ */ jsx("p", { style: subtitleStyle9(tokens.textSecondary), children: loading ? "Creating transfer and preparing your wallet link..." : `Continue in ${displayName} to authorize this connection.` }),
|
|
3889
4145
|
!loading && /* @__PURE__ */ jsxs("div", { style: waitingBadgeStyle(tokens), children: [
|
|
3890
4146
|
/* @__PURE__ */ jsx(Spinner, { size: 14 }),
|
|
3891
4147
|
/* @__PURE__ */ jsx("span", { children: "Waiting for authorization..." })
|
|
@@ -3910,14 +4166,14 @@ var logoStyle = {
|
|
|
3910
4166
|
borderRadius: 14,
|
|
3911
4167
|
objectFit: "contain"
|
|
3912
4168
|
};
|
|
3913
|
-
var
|
|
4169
|
+
var headingStyle9 = (color) => ({
|
|
3914
4170
|
fontSize: "1.45rem",
|
|
3915
4171
|
fontWeight: 700,
|
|
3916
4172
|
letterSpacing: "-0.02em",
|
|
3917
4173
|
color,
|
|
3918
4174
|
margin: "20px 0 8px"
|
|
3919
4175
|
});
|
|
3920
|
-
var
|
|
4176
|
+
var subtitleStyle9 = (color) => ({
|
|
3921
4177
|
fontSize: "0.9rem",
|
|
3922
4178
|
color,
|
|
3923
4179
|
margin: "0 0 24px",
|
|
@@ -3963,8 +4219,8 @@ function ConfirmSignScreen({
|
|
|
3963
4219
|
/* @__PURE__ */ jsx(ScreenHeader, { right: /* @__PURE__ */ jsx(SettingsMenu, { onLogout }) }),
|
|
3964
4220
|
/* @__PURE__ */ jsxs("div", { style: contentStyle7, children: [
|
|
3965
4221
|
logoSrc ? /* @__PURE__ */ jsx("img", { src: logoSrc, alt: displayName, style: logoStyle2 }) : /* @__PURE__ */ jsx(Spinner, { size: 48 }),
|
|
3966
|
-
/* @__PURE__ */ jsx("h2", { style:
|
|
3967
|
-
/* @__PURE__ */ jsxs("p", { style:
|
|
4222
|
+
/* @__PURE__ */ jsx("h2", { style: headingStyle10(tokens.text), children: "Wallet authorized" }),
|
|
4223
|
+
/* @__PURE__ */ jsxs("p", { style: subtitleStyle10(tokens.textSecondary), children: [
|
|
3968
4224
|
displayName,
|
|
3969
4225
|
" approved the connection. Tap below to confirm your payment."
|
|
3970
4226
|
] }),
|
|
@@ -3992,14 +4248,14 @@ var logoStyle2 = {
|
|
|
3992
4248
|
borderRadius: 14,
|
|
3993
4249
|
objectFit: "contain"
|
|
3994
4250
|
};
|
|
3995
|
-
var
|
|
4251
|
+
var headingStyle10 = (color) => ({
|
|
3996
4252
|
fontSize: "1.45rem",
|
|
3997
4253
|
fontWeight: 700,
|
|
3998
4254
|
letterSpacing: "-0.02em",
|
|
3999
4255
|
color,
|
|
4000
4256
|
margin: "20px 0 8px"
|
|
4001
4257
|
});
|
|
4002
|
-
var
|
|
4258
|
+
var subtitleStyle10 = (color) => ({
|
|
4003
4259
|
fontSize: "0.9rem",
|
|
4004
4260
|
color,
|
|
4005
4261
|
margin: "0 0 24px",
|
|
@@ -4058,7 +4314,7 @@ var PaymentErrorBoundary = class extends Component {
|
|
|
4058
4314
|
/* @__PURE__ */ jsx("path", { d: "M12 8v5", stroke: "#ef4444", strokeWidth: "1.5", strokeLinecap: "round" }),
|
|
4059
4315
|
/* @__PURE__ */ jsx("circle", { cx: "12", cy: "16", r: "0.75", fill: "#ef4444" })
|
|
4060
4316
|
] }) }),
|
|
4061
|
-
/* @__PURE__ */ jsx("h2", { style:
|
|
4317
|
+
/* @__PURE__ */ jsx("h2", { style: headingStyle11, children: "Something went wrong" }),
|
|
4062
4318
|
/* @__PURE__ */ jsx("p", { style: messageStyle, children: "An unexpected error occurred. Please try again." }),
|
|
4063
4319
|
/* @__PURE__ */ jsx("button", { type: "button", onClick: this.handleReset, style: buttonStyle3, children: "Try again" })
|
|
4064
4320
|
] });
|
|
@@ -4078,7 +4334,7 @@ var containerStyle8 = {
|
|
|
4078
4334
|
var iconStyle4 = {
|
|
4079
4335
|
marginBottom: 20
|
|
4080
4336
|
};
|
|
4081
|
-
var
|
|
4337
|
+
var headingStyle11 = {
|
|
4082
4338
|
fontSize: "1.25rem",
|
|
4083
4339
|
fontWeight: 700,
|
|
4084
4340
|
color: "#1a1a1a",
|
|
@@ -4101,13 +4357,6 @@ var buttonStyle3 = {
|
|
|
4101
4357
|
fontFamily: "inherit",
|
|
4102
4358
|
cursor: "pointer"
|
|
4103
4359
|
};
|
|
4104
|
-
function isInIframe() {
|
|
4105
|
-
try {
|
|
4106
|
-
return typeof window !== "undefined" && window !== window.top;
|
|
4107
|
-
} catch {
|
|
4108
|
-
return true;
|
|
4109
|
-
}
|
|
4110
|
-
}
|
|
4111
4360
|
var ACTIVE_CREDENTIAL_STORAGE_KEY = "swype_active_credential_id";
|
|
4112
4361
|
var MOBILE_FLOW_STORAGE_KEY = "swype_mobile_flow";
|
|
4113
4362
|
var MIN_SEND_AMOUNT_USD = 0.25;
|
|
@@ -4200,6 +4449,24 @@ function buildSelectSourceChoices(options) {
|
|
|
4200
4449
|
}
|
|
4201
4450
|
return chainChoices;
|
|
4202
4451
|
}
|
|
4452
|
+
function resolvePostAuthStep(state) {
|
|
4453
|
+
if (!state.hasPasskey) {
|
|
4454
|
+
return { step: "create-passkey", clearPersistedFlow: false };
|
|
4455
|
+
}
|
|
4456
|
+
const hasActiveWallet = state.accounts.some(
|
|
4457
|
+
(a) => a.wallets.some((w) => w.status === "ACTIVE")
|
|
4458
|
+
);
|
|
4459
|
+
if (state.persistedMobileFlow) {
|
|
4460
|
+
if (hasActiveWallet && !state.mobileSetupInProgress) {
|
|
4461
|
+
return { step: "deposit", clearPersistedFlow: true };
|
|
4462
|
+
}
|
|
4463
|
+
return { step: "open-wallet", clearPersistedFlow: false };
|
|
4464
|
+
}
|
|
4465
|
+
if ((state.accounts.length === 0 || !hasActiveWallet) && !state.connectingNewAccount) {
|
|
4466
|
+
return { step: "wallet-picker", clearPersistedFlow: false };
|
|
4467
|
+
}
|
|
4468
|
+
return { step: "deposit", clearPersistedFlow: false };
|
|
4469
|
+
}
|
|
4203
4470
|
function SwypePayment(props) {
|
|
4204
4471
|
const resetKey = useRef(0);
|
|
4205
4472
|
const handleBoundaryReset = useCallback(() => {
|
|
@@ -4374,19 +4641,47 @@ function SwypePaymentInner({
|
|
|
4374
4641
|
let cancelled = false;
|
|
4375
4642
|
setError(null);
|
|
4376
4643
|
resetHeadlessLogin();
|
|
4377
|
-
const restoreOrDeposit = () => {
|
|
4644
|
+
const restoreOrDeposit = async (credId, token) => {
|
|
4378
4645
|
const persisted = loadMobileFlowState();
|
|
4379
|
-
|
|
4646
|
+
let accts = [];
|
|
4647
|
+
try {
|
|
4648
|
+
accts = await fetchAccounts(apiBaseUrl, token, credId);
|
|
4649
|
+
if (cancelled) return;
|
|
4650
|
+
} catch {
|
|
4651
|
+
}
|
|
4652
|
+
const resolved = resolvePostAuthStep({
|
|
4653
|
+
hasPasskey: true,
|
|
4654
|
+
accounts: accts,
|
|
4655
|
+
persistedMobileFlow: persisted,
|
|
4656
|
+
mobileSetupInProgress: false,
|
|
4657
|
+
connectingNewAccount: false
|
|
4658
|
+
});
|
|
4659
|
+
if (resolved.clearPersistedFlow) {
|
|
4660
|
+
clearMobileFlowState();
|
|
4661
|
+
}
|
|
4662
|
+
if (resolved.step === "open-wallet" && persisted) {
|
|
4663
|
+
try {
|
|
4664
|
+
const existingTransfer = await fetchTransfer(apiBaseUrl, token, persisted.transferId);
|
|
4665
|
+
if (cancelled) return;
|
|
4666
|
+
const terminalStatuses = ["AUTHORIZED", "COMPLETED", "FAILED"];
|
|
4667
|
+
if (terminalStatuses.includes(existingTransfer.status)) {
|
|
4668
|
+
clearMobileFlowState();
|
|
4669
|
+
setStep("deposit");
|
|
4670
|
+
return;
|
|
4671
|
+
}
|
|
4672
|
+
} catch {
|
|
4673
|
+
clearMobileFlowState();
|
|
4674
|
+
setStep("deposit");
|
|
4675
|
+
return;
|
|
4676
|
+
}
|
|
4380
4677
|
setMobileFlow(true);
|
|
4381
4678
|
setDeeplinkUri(persisted.deeplinkUri);
|
|
4382
4679
|
setSelectedProviderId(persisted.providerId);
|
|
4383
4680
|
pollingTransferIdRef.current = persisted.transferId;
|
|
4384
4681
|
mobileSetupFlowRef.current = persisted.isSetup;
|
|
4385
|
-
setStep("open-wallet");
|
|
4386
4682
|
polling.startPolling(persisted.transferId);
|
|
4387
|
-
} else {
|
|
4388
|
-
setStep("deposit");
|
|
4389
4683
|
}
|
|
4684
|
+
setStep(resolved.step);
|
|
4390
4685
|
};
|
|
4391
4686
|
const checkPasskey = async () => {
|
|
4392
4687
|
try {
|
|
@@ -4403,7 +4698,7 @@ function SwypePaymentInner({
|
|
|
4403
4698
|
return;
|
|
4404
4699
|
}
|
|
4405
4700
|
if (activeCredentialId && allPasskeys.some((p) => p.credentialId === activeCredentialId)) {
|
|
4406
|
-
restoreOrDeposit();
|
|
4701
|
+
await restoreOrDeposit(activeCredentialId, token);
|
|
4407
4702
|
return;
|
|
4408
4703
|
}
|
|
4409
4704
|
if (cancelled) return;
|
|
@@ -4413,7 +4708,7 @@ function SwypePaymentInner({
|
|
|
4413
4708
|
if (matched) {
|
|
4414
4709
|
setActiveCredentialId(matched);
|
|
4415
4710
|
window.localStorage.setItem(ACTIVE_CREDENTIAL_STORAGE_KEY, matched);
|
|
4416
|
-
restoreOrDeposit();
|
|
4711
|
+
await restoreOrDeposit(matched, token);
|
|
4417
4712
|
return;
|
|
4418
4713
|
}
|
|
4419
4714
|
setStep("create-passkey");
|
|
@@ -4454,14 +4749,25 @@ function SwypePaymentInner({
|
|
|
4454
4749
|
if (defaults) {
|
|
4455
4750
|
setSelectedAccountId(defaults.accountId);
|
|
4456
4751
|
setSelectedWalletId(defaults.walletId);
|
|
4457
|
-
} else if (prov.length > 0) {
|
|
4752
|
+
} else if (prov.length > 0 && !connectingNewAccount) {
|
|
4458
4753
|
setSelectedProviderId(prov[0].id);
|
|
4459
4754
|
}
|
|
4460
|
-
const
|
|
4461
|
-
|
|
4462
|
-
|
|
4463
|
-
|
|
4464
|
-
|
|
4755
|
+
const persisted = loadMobileFlowState();
|
|
4756
|
+
const resolved = resolvePostAuthStep({
|
|
4757
|
+
hasPasskey: !!activeCredentialId,
|
|
4758
|
+
accounts: accts,
|
|
4759
|
+
persistedMobileFlow: persisted,
|
|
4760
|
+
mobileSetupInProgress: mobileSetupFlowRef.current,
|
|
4761
|
+
connectingNewAccount
|
|
4762
|
+
});
|
|
4763
|
+
if (resolved.clearPersistedFlow) {
|
|
4764
|
+
clearMobileFlowState();
|
|
4765
|
+
setMobileFlow(false);
|
|
4766
|
+
setDeeplinkUri(null);
|
|
4767
|
+
}
|
|
4768
|
+
const correctableSteps = ["deposit", "wallet-picker", "open-wallet"];
|
|
4769
|
+
if (correctableSteps.includes(step)) {
|
|
4770
|
+
setStep(resolved.step);
|
|
4465
4771
|
}
|
|
4466
4772
|
} catch (err) {
|
|
4467
4773
|
if (!cancelled) {
|
|
@@ -4728,12 +5034,10 @@ function SwypePaymentInner({
|
|
|
4728
5034
|
persistMobileFlowState({
|
|
4729
5035
|
transferId: t.id,
|
|
4730
5036
|
deeplinkUri: uri,
|
|
4731
|
-
providerId: selectedProviderId,
|
|
5037
|
+
providerId: sourceOverrides?.sourceType === "providerId" ? sourceOverrides.sourceId : selectedProviderId,
|
|
4732
5038
|
isSetup: mobileSetupFlowRef.current
|
|
4733
5039
|
});
|
|
4734
|
-
|
|
4735
|
-
window.location.href = uri;
|
|
4736
|
-
}
|
|
5040
|
+
window.location.href = uri;
|
|
4737
5041
|
return;
|
|
4738
5042
|
} else {
|
|
4739
5043
|
await authExecutor.executeSession(t);
|
|
@@ -4774,15 +5078,18 @@ function SwypePaymentInner({
|
|
|
4774
5078
|
setActiveCredentialId(credentialId);
|
|
4775
5079
|
window.localStorage.setItem(ACTIVE_CREDENTIAL_STORAGE_KEY, credentialId);
|
|
4776
5080
|
setPasskeyPopupNeeded(false);
|
|
4777
|
-
const
|
|
4778
|
-
|
|
4779
|
-
|
|
4780
|
-
|
|
4781
|
-
|
|
4782
|
-
|
|
4783
|
-
|
|
5081
|
+
const resolved = resolvePostAuthStep({
|
|
5082
|
+
hasPasskey: true,
|
|
5083
|
+
accounts,
|
|
5084
|
+
persistedMobileFlow: loadMobileFlowState(),
|
|
5085
|
+
mobileSetupInProgress: mobileSetupFlowRef.current,
|
|
5086
|
+
connectingNewAccount
|
|
5087
|
+
});
|
|
5088
|
+
if (resolved.clearPersistedFlow) {
|
|
5089
|
+
clearMobileFlowState();
|
|
4784
5090
|
}
|
|
4785
|
-
|
|
5091
|
+
setStep(resolved.step);
|
|
5092
|
+
}, [getAccessToken, apiBaseUrl, accounts, connectingNewAccount]);
|
|
4786
5093
|
const handleRegisterPasskey = useCallback(async () => {
|
|
4787
5094
|
setRegisteringPasskey(true);
|
|
4788
5095
|
setError(null);
|
|
@@ -5101,6 +5408,6 @@ function SwypePaymentInner({
|
|
|
5101
5408
|
return null;
|
|
5102
5409
|
}
|
|
5103
5410
|
|
|
5104
|
-
export { CreatePasskeyScreen, IconCircle, OutlineButton, PasskeyIframeBlockedError, PoweredByFooter, PrimaryButton, ScreenHeader, ScreenLayout, SelectSourceScreen, SettingsMenu, SetupScreen, Spinner, StepList, SwypePayment, SwypeProvider, buildPasskeyPopupOptions, createPasskeyCredential, createPasskeyViaPopup, darkTheme, deviceHasPasskey, findDevicePasskey, getTheme, lightTheme, api_exports as swypeApi, useAuthorizationExecutor, useSwypeConfig, useSwypeDepositAmount, useTransferPolling, useTransferSigning };
|
|
5411
|
+
export { AdvancedSourceScreen, CreatePasskeyScreen, IconCircle, OutlineButton, PasskeyIframeBlockedError, PoweredByFooter, PrimaryButton, ScreenHeader, ScreenLayout, SelectSourceScreen, SettingsMenu, SetupScreen, Spinner, StepList, SwypePayment, SwypeProvider, buildPasskeyPopupOptions, createPasskeyCredential, createPasskeyViaPopup, darkTheme, deviceHasPasskey, findDevicePasskey, getTheme, lightTheme, api_exports as swypeApi, useAuthorizationExecutor, useSwypeConfig, useSwypeDepositAmount, useTransferPolling, useTransferSigning };
|
|
5105
5412
|
//# sourceMappingURL=index.js.map
|
|
5106
5413
|
//# sourceMappingURL=index.js.map
|