@swype-org/react-sdk 0.1.42 → 0.1.44
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 +23 -256
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +16 -2
- package/dist/index.d.ts +16 -2
- package/dist/index.js +23 -257
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -198,7 +198,7 @@ interface UserConfig {
|
|
|
198
198
|
/** Theme mode */
|
|
199
199
|
type ThemeMode = 'light' | 'dark';
|
|
200
200
|
/** Steps in the payment flow */
|
|
201
|
-
type PaymentStep = 'login' | 'otp-verify' | 'create-passkey' | 'wallet-picker' | '
|
|
201
|
+
type PaymentStep = 'login' | 'otp-verify' | 'create-passkey' | 'wallet-picker' | 'deposit' | 'low-balance' | 'processing' | 'select-source' | 'success';
|
|
202
202
|
/** User-selected advanced settings for chain/asset override */
|
|
203
203
|
interface AdvancedSettings {
|
|
204
204
|
/** Override asset (e.g. 'USDC', 'USDT'). Null = let backend decide. */
|
|
@@ -559,6 +559,20 @@ interface SpinnerProps {
|
|
|
559
559
|
}
|
|
560
560
|
declare function Spinner({ size, label }: SpinnerProps): react_jsx_runtime.JSX.Element;
|
|
561
561
|
|
|
562
|
+
interface SetupScreenProps {
|
|
563
|
+
availableBalance: number;
|
|
564
|
+
/** Number of tokens/chains available */
|
|
565
|
+
tokenCount: number;
|
|
566
|
+
/** Source wallet/account name */
|
|
567
|
+
sourceName?: string;
|
|
568
|
+
onSetupOneTap: (limit: number) => void;
|
|
569
|
+
onBack: () => void;
|
|
570
|
+
onLogout: () => void;
|
|
571
|
+
loading?: boolean;
|
|
572
|
+
error: string | null;
|
|
573
|
+
}
|
|
574
|
+
declare function SetupScreen({ availableBalance, tokenCount, sourceName, onSetupOneTap, onBack, onLogout, loading, error, }: SetupScreenProps): react_jsx_runtime.JSX.Element;
|
|
575
|
+
|
|
562
576
|
interface ChainChoice {
|
|
563
577
|
chainName: string;
|
|
564
578
|
balance: number;
|
|
@@ -582,4 +596,4 @@ interface SelectSourceScreenProps {
|
|
|
582
596
|
}
|
|
583
597
|
declare function SelectSourceScreen({ choices, selectedChainName, selectedTokenSymbol, recommended, onChainChange, onTokenChange, onConfirm, onLogout, }: SelectSourceScreenProps): react_jsx_runtime.JSX.Element;
|
|
584
598
|
|
|
585
|
-
export { type Account, type ActionExecutionResult, type AdvancedSettings, type Amount, type AuthorizationAction, type AuthorizationSession, type AuthorizationSessionDetail, type Chain, type Destination, type ErrorResponse, IconCircle, type ListResponse, type MerchantAuthorization, type MerchantPublicKey, OutlineButton, type PaymentStep, PoweredByFooter, PrimaryButton, type Provider, ScreenHeader, ScreenLayout, SelectSourceScreen, SettingsMenu, type SourceOption, type SourceSelection, type SourceType, Spinner, type StepItem, StepList, SwypePayment, type SwypePaymentProps, SwypeProvider, type SwypeProviderProps, type ThemeMode, type ThemeTokens, type TokenBalance, type Transfer, type TransferDestination, type UserConfig, type Wallet, type WalletSource, type WalletToken, createPasskeyCredential, darkTheme, deviceHasPasskey, findDevicePasskey, getTheme, lightTheme, api as swypeApi, useAuthorizationExecutor, useSwypeConfig, useSwypeDepositAmount, useTransferPolling, useTransferSigning };
|
|
599
|
+
export { type Account, type ActionExecutionResult, type AdvancedSettings, type Amount, type AuthorizationAction, type AuthorizationSession, type AuthorizationSessionDetail, type Chain, type Destination, type ErrorResponse, IconCircle, type ListResponse, type MerchantAuthorization, type MerchantPublicKey, OutlineButton, type PaymentStep, PoweredByFooter, PrimaryButton, type Provider, ScreenHeader, ScreenLayout, SelectSourceScreen, SettingsMenu, SetupScreen, type SourceOption, type SourceSelection, type SourceType, Spinner, type StepItem, StepList, SwypePayment, type SwypePaymentProps, SwypeProvider, type SwypeProviderProps, type ThemeMode, type ThemeTokens, type TokenBalance, type Transfer, type TransferDestination, type UserConfig, type Wallet, type WalletSource, type WalletToken, createPasskeyCredential, darkTheme, deviceHasPasskey, findDevicePasskey, getTheme, lightTheme, api as swypeApi, useAuthorizationExecutor, useSwypeConfig, useSwypeDepositAmount, useTransferPolling, useTransferSigning };
|
package/dist/index.d.ts
CHANGED
|
@@ -198,7 +198,7 @@ interface UserConfig {
|
|
|
198
198
|
/** Theme mode */
|
|
199
199
|
type ThemeMode = 'light' | 'dark';
|
|
200
200
|
/** Steps in the payment flow */
|
|
201
|
-
type PaymentStep = 'login' | 'otp-verify' | 'create-passkey' | 'wallet-picker' | '
|
|
201
|
+
type PaymentStep = 'login' | 'otp-verify' | 'create-passkey' | 'wallet-picker' | 'deposit' | 'low-balance' | 'processing' | 'select-source' | 'success';
|
|
202
202
|
/** User-selected advanced settings for chain/asset override */
|
|
203
203
|
interface AdvancedSettings {
|
|
204
204
|
/** Override asset (e.g. 'USDC', 'USDT'). Null = let backend decide. */
|
|
@@ -559,6 +559,20 @@ interface SpinnerProps {
|
|
|
559
559
|
}
|
|
560
560
|
declare function Spinner({ size, label }: SpinnerProps): react_jsx_runtime.JSX.Element;
|
|
561
561
|
|
|
562
|
+
interface SetupScreenProps {
|
|
563
|
+
availableBalance: number;
|
|
564
|
+
/** Number of tokens/chains available */
|
|
565
|
+
tokenCount: number;
|
|
566
|
+
/** Source wallet/account name */
|
|
567
|
+
sourceName?: string;
|
|
568
|
+
onSetupOneTap: (limit: number) => void;
|
|
569
|
+
onBack: () => void;
|
|
570
|
+
onLogout: () => void;
|
|
571
|
+
loading?: boolean;
|
|
572
|
+
error: string | null;
|
|
573
|
+
}
|
|
574
|
+
declare function SetupScreen({ availableBalance, tokenCount, sourceName, onSetupOneTap, onBack, onLogout, loading, error, }: SetupScreenProps): react_jsx_runtime.JSX.Element;
|
|
575
|
+
|
|
562
576
|
interface ChainChoice {
|
|
563
577
|
chainName: string;
|
|
564
578
|
balance: number;
|
|
@@ -582,4 +596,4 @@ interface SelectSourceScreenProps {
|
|
|
582
596
|
}
|
|
583
597
|
declare function SelectSourceScreen({ choices, selectedChainName, selectedTokenSymbol, recommended, onChainChange, onTokenChange, onConfirm, onLogout, }: SelectSourceScreenProps): react_jsx_runtime.JSX.Element;
|
|
584
598
|
|
|
585
|
-
export { type Account, type ActionExecutionResult, type AdvancedSettings, type Amount, type AuthorizationAction, type AuthorizationSession, type AuthorizationSessionDetail, type Chain, type Destination, type ErrorResponse, IconCircle, type ListResponse, type MerchantAuthorization, type MerchantPublicKey, OutlineButton, type PaymentStep, PoweredByFooter, PrimaryButton, type Provider, ScreenHeader, ScreenLayout, SelectSourceScreen, SettingsMenu, type SourceOption, type SourceSelection, type SourceType, Spinner, type StepItem, StepList, SwypePayment, type SwypePaymentProps, SwypeProvider, type SwypeProviderProps, type ThemeMode, type ThemeTokens, type TokenBalance, type Transfer, type TransferDestination, type UserConfig, type Wallet, type WalletSource, type WalletToken, createPasskeyCredential, darkTheme, deviceHasPasskey, findDevicePasskey, getTheme, lightTheme, api as swypeApi, useAuthorizationExecutor, useSwypeConfig, useSwypeDepositAmount, useTransferPolling, useTransferSigning };
|
|
599
|
+
export { type Account, type ActionExecutionResult, type AdvancedSettings, type Amount, type AuthorizationAction, type AuthorizationSession, type AuthorizationSessionDetail, type Chain, type Destination, type ErrorResponse, IconCircle, type ListResponse, type MerchantAuthorization, type MerchantPublicKey, OutlineButton, type PaymentStep, PoweredByFooter, PrimaryButton, type Provider, ScreenHeader, ScreenLayout, SelectSourceScreen, SettingsMenu, SetupScreen, type SourceOption, type SourceSelection, type SourceType, Spinner, type StepItem, StepList, SwypePayment, type SwypePaymentProps, SwypeProvider, type SwypeProviderProps, type ThemeMode, type ThemeTokens, type TokenBalance, type Transfer, type TransferDestination, type UserConfig, type Wallet, type WalletSource, type WalletToken, createPasskeyCredential, darkTheme, deviceHasPasskey, findDevicePasskey, getTheme, lightTheme, api as swypeApi, useAuthorizationExecutor, useSwypeConfig, useSwypeDepositAmount, useTransferPolling, useTransferSigning };
|
package/dist/index.js
CHANGED
|
@@ -3082,108 +3082,6 @@ var linkStyle = (color) => ({
|
|
|
3082
3082
|
padding: 0,
|
|
3083
3083
|
marginBottom: 16
|
|
3084
3084
|
});
|
|
3085
|
-
function SetupStatusScreen({
|
|
3086
|
-
complete,
|
|
3087
|
-
limit,
|
|
3088
|
-
tokensApproved,
|
|
3089
|
-
merchantName,
|
|
3090
|
-
onContinue,
|
|
3091
|
-
onLogout,
|
|
3092
|
-
error
|
|
3093
|
-
}) {
|
|
3094
|
-
const { tokens } = useSwypeConfig();
|
|
3095
|
-
const steps = complete ? [
|
|
3096
|
-
{
|
|
3097
|
-
label: "One-Tap ready",
|
|
3098
|
-
detail: `$${limit} limit \xB7 ${tokensApproved} token${tokensApproved !== 1 ? "s" : ""} approved`,
|
|
3099
|
-
status: "complete"
|
|
3100
|
-
},
|
|
3101
|
-
{ label: "Done", status: "complete" }
|
|
3102
|
-
] : [
|
|
3103
|
-
{
|
|
3104
|
-
label: "Setting up Wallet",
|
|
3105
|
-
status: "active"
|
|
3106
|
-
},
|
|
3107
|
-
{ label: "Done", status: "pending" }
|
|
3108
|
-
];
|
|
3109
|
-
return /* @__PURE__ */ jsxs(
|
|
3110
|
-
ScreenLayout,
|
|
3111
|
-
{
|
|
3112
|
-
footer: complete ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3113
|
-
/* @__PURE__ */ jsx(PrimaryButton, { onClick: onContinue, children: merchantName ? `Return to ${merchantName}` : "Continue" }),
|
|
3114
|
-
/* @__PURE__ */ jsx("p", { style: swipeHintStyle(tokens.textMuted), children: "Swipe to deposit \u2014 no approvals needed." })
|
|
3115
|
-
] }) : void 0,
|
|
3116
|
-
children: [
|
|
3117
|
-
/* @__PURE__ */ jsx(ScreenHeader, { right: /* @__PURE__ */ jsx(SettingsMenu, { onLogout }) }),
|
|
3118
|
-
/* @__PURE__ */ jsxs("div", { style: contentStyle4, children: [
|
|
3119
|
-
complete ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3120
|
-
/* @__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 }) }) }),
|
|
3121
|
-
/* @__PURE__ */ jsx("h2", { style: headingStyle6(tokens.text), children: "You're all set!" })
|
|
3122
|
-
] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
3123
|
-
/* @__PURE__ */ jsx(Spinner, { size: 48 }),
|
|
3124
|
-
/* @__PURE__ */ jsx("h2", { style: headingStyle6(tokens.text), children: "Setting up One-Tap..." })
|
|
3125
|
-
] }),
|
|
3126
|
-
error && /* @__PURE__ */ jsx("div", { style: errorBannerStyle4(tokens), children: error }),
|
|
3127
|
-
/* @__PURE__ */ jsx("div", { style: stepsWrapStyle, children: /* @__PURE__ */ jsx(StepList, { steps }) }),
|
|
3128
|
-
!complete && /* @__PURE__ */ jsx("p", { style: waitHintStyle(tokens.textMuted), children: "Usually takes a few seconds" }),
|
|
3129
|
-
complete && /* @__PURE__ */ jsx("p", { style: readyHintStyle(tokens.textSecondary), children: "You can now deposit instantly from any partner app." })
|
|
3130
|
-
] })
|
|
3131
|
-
]
|
|
3132
|
-
}
|
|
3133
|
-
);
|
|
3134
|
-
}
|
|
3135
|
-
var contentStyle4 = {
|
|
3136
|
-
flex: 1,
|
|
3137
|
-
display: "flex",
|
|
3138
|
-
flexDirection: "column",
|
|
3139
|
-
alignItems: "center",
|
|
3140
|
-
justifyContent: "center",
|
|
3141
|
-
textAlign: "center",
|
|
3142
|
-
padding: "0 24px 32px"
|
|
3143
|
-
};
|
|
3144
|
-
var headingStyle6 = (color) => ({
|
|
3145
|
-
fontSize: "1.45rem",
|
|
3146
|
-
fontWeight: 700,
|
|
3147
|
-
letterSpacing: "-0.02em",
|
|
3148
|
-
color,
|
|
3149
|
-
margin: "20px 0 16px"
|
|
3150
|
-
});
|
|
3151
|
-
var errorBannerStyle4 = (tokens) => ({
|
|
3152
|
-
background: tokens.errorBg,
|
|
3153
|
-
border: `1px solid ${tokens.error}66`,
|
|
3154
|
-
borderRadius: 16,
|
|
3155
|
-
padding: "11px 14px",
|
|
3156
|
-
color: tokens.error,
|
|
3157
|
-
fontSize: "0.84rem",
|
|
3158
|
-
marginBottom: 14,
|
|
3159
|
-
lineHeight: 1.5,
|
|
3160
|
-
width: "100%",
|
|
3161
|
-
textAlign: "left"
|
|
3162
|
-
});
|
|
3163
|
-
var stepsWrapStyle = {
|
|
3164
|
-
width: "100%",
|
|
3165
|
-
maxWidth: 280,
|
|
3166
|
-
textAlign: "left",
|
|
3167
|
-
marginBottom: 16
|
|
3168
|
-
};
|
|
3169
|
-
var waitHintStyle = (color) => ({
|
|
3170
|
-
fontSize: "0.82rem",
|
|
3171
|
-
color,
|
|
3172
|
-
margin: 0
|
|
3173
|
-
});
|
|
3174
|
-
var readyHintStyle = (color) => ({
|
|
3175
|
-
fontSize: "0.88rem",
|
|
3176
|
-
color,
|
|
3177
|
-
margin: "8px 0 0",
|
|
3178
|
-
lineHeight: 1.5,
|
|
3179
|
-
maxWidth: 280
|
|
3180
|
-
});
|
|
3181
|
-
var swipeHintStyle = (color) => ({
|
|
3182
|
-
textAlign: "center",
|
|
3183
|
-
fontSize: "0.8rem",
|
|
3184
|
-
color,
|
|
3185
|
-
margin: "12px 0 0"
|
|
3186
|
-
});
|
|
3187
3085
|
var MIN_DEPOSIT = 0.25;
|
|
3188
3086
|
function DepositScreen({
|
|
3189
3087
|
merchantName,
|
|
@@ -3333,7 +3231,7 @@ function DepositScreen({
|
|
|
3333
3231
|
"%)"
|
|
3334
3232
|
] }) : /* @__PURE__ */ jsx("div", { style: detailRowStyle(tokens.textMuted), children: "Fees calculated at time of transfer" })
|
|
3335
3233
|
] }),
|
|
3336
|
-
error && /* @__PURE__ */ jsx("div", { style:
|
|
3234
|
+
error && /* @__PURE__ */ jsx("div", { style: errorBannerStyle4(tokens), children: error })
|
|
3337
3235
|
]
|
|
3338
3236
|
}
|
|
3339
3237
|
);
|
|
@@ -3401,7 +3299,7 @@ var detailRowStyle = (color) => ({
|
|
|
3401
3299
|
color,
|
|
3402
3300
|
marginBottom: 4
|
|
3403
3301
|
});
|
|
3404
|
-
var
|
|
3302
|
+
var errorBannerStyle4 = (tokens) => ({
|
|
3405
3303
|
background: tokens.errorBg,
|
|
3406
3304
|
border: `1px solid ${tokens.error}66`,
|
|
3407
3305
|
borderRadius: 16,
|
|
@@ -3490,9 +3388,9 @@ function SuccessScreen({
|
|
|
3490
3388
|
right: /* @__PURE__ */ jsx(SettingsMenu, { onLogout })
|
|
3491
3389
|
}
|
|
3492
3390
|
),
|
|
3493
|
-
/* @__PURE__ */ jsxs("div", { style:
|
|
3391
|
+
/* @__PURE__ */ jsxs("div", { style: contentStyle4, children: [
|
|
3494
3392
|
/* @__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 }) }) }),
|
|
3495
|
-
/* @__PURE__ */ jsxs("h2", { style:
|
|
3393
|
+
/* @__PURE__ */ jsxs("h2", { style: headingStyle6(tokens.text), children: [
|
|
3496
3394
|
"$",
|
|
3497
3395
|
amount.toFixed(2),
|
|
3498
3396
|
" deposited"
|
|
@@ -3531,14 +3429,14 @@ function SuccessScreen({
|
|
|
3531
3429
|
}
|
|
3532
3430
|
);
|
|
3533
3431
|
}
|
|
3534
|
-
var
|
|
3432
|
+
var contentStyle4 = {
|
|
3535
3433
|
flex: 1,
|
|
3536
3434
|
display: "flex",
|
|
3537
3435
|
flexDirection: "column",
|
|
3538
3436
|
alignItems: "center",
|
|
3539
3437
|
paddingTop: 16
|
|
3540
3438
|
};
|
|
3541
|
-
var
|
|
3439
|
+
var headingStyle6 = (color) => ({
|
|
3542
3440
|
fontSize: "1.5rem",
|
|
3543
3441
|
fontWeight: 700,
|
|
3544
3442
|
letterSpacing: "-0.02em",
|
|
@@ -3801,16 +3699,16 @@ function TransferStatusScreen({
|
|
|
3801
3699
|
const steps = buildSteps(phase);
|
|
3802
3700
|
return /* @__PURE__ */ jsxs(ScreenLayout, { children: [
|
|
3803
3701
|
/* @__PURE__ */ jsx(ScreenHeader, { right: /* @__PURE__ */ jsx(SettingsMenu, { onLogout }) }),
|
|
3804
|
-
/* @__PURE__ */ jsxs("div", { style:
|
|
3702
|
+
/* @__PURE__ */ jsxs("div", { style: contentStyle5, children: [
|
|
3805
3703
|
/* @__PURE__ */ jsx(Spinner, { size: 48 }),
|
|
3806
|
-
/* @__PURE__ */ jsx("h2", { style:
|
|
3807
|
-
error && /* @__PURE__ */ jsx("div", { style:
|
|
3808
|
-
/* @__PURE__ */ jsx("div", { style:
|
|
3809
|
-
/* @__PURE__ */ jsx("p", { style:
|
|
3704
|
+
/* @__PURE__ */ jsx("h2", { style: headingStyle7(tokens.text), children: "Processing Transfer..." }),
|
|
3705
|
+
error && /* @__PURE__ */ jsx("div", { style: errorBannerStyle5(tokens), children: error }),
|
|
3706
|
+
/* @__PURE__ */ jsx("div", { style: stepsWrapStyle, children: /* @__PURE__ */ jsx(StepList, { steps }) }),
|
|
3707
|
+
/* @__PURE__ */ jsx("p", { style: waitHintStyle(tokens.textMuted), children: "Usually takes a few seconds" })
|
|
3810
3708
|
] })
|
|
3811
3709
|
] });
|
|
3812
3710
|
}
|
|
3813
|
-
var
|
|
3711
|
+
var contentStyle5 = {
|
|
3814
3712
|
flex: 1,
|
|
3815
3713
|
display: "flex",
|
|
3816
3714
|
flexDirection: "column",
|
|
@@ -3819,14 +3717,14 @@ var contentStyle6 = {
|
|
|
3819
3717
|
textAlign: "center",
|
|
3820
3718
|
padding: "0 24px"
|
|
3821
3719
|
};
|
|
3822
|
-
var
|
|
3720
|
+
var headingStyle7 = (color) => ({
|
|
3823
3721
|
fontSize: "1.45rem",
|
|
3824
3722
|
fontWeight: 700,
|
|
3825
3723
|
letterSpacing: "-0.02em",
|
|
3826
3724
|
color,
|
|
3827
3725
|
margin: "20px 0 16px"
|
|
3828
3726
|
});
|
|
3829
|
-
var
|
|
3727
|
+
var errorBannerStyle5 = (tokens) => ({
|
|
3830
3728
|
background: tokens.errorBg,
|
|
3831
3729
|
border: `1px solid ${tokens.error}66`,
|
|
3832
3730
|
borderRadius: 16,
|
|
@@ -3838,13 +3736,13 @@ var errorBannerStyle6 = (tokens) => ({
|
|
|
3838
3736
|
width: "100%",
|
|
3839
3737
|
textAlign: "left"
|
|
3840
3738
|
});
|
|
3841
|
-
var
|
|
3739
|
+
var stepsWrapStyle = {
|
|
3842
3740
|
width: "100%",
|
|
3843
3741
|
maxWidth: 280,
|
|
3844
3742
|
textAlign: "left",
|
|
3845
3743
|
marginBottom: 16
|
|
3846
3744
|
};
|
|
3847
|
-
var
|
|
3745
|
+
var waitHintStyle = (color) => ({
|
|
3848
3746
|
fontSize: "0.82rem",
|
|
3849
3747
|
color,
|
|
3850
3748
|
margin: 0
|
|
@@ -3968,10 +3866,7 @@ function SwypePayment({
|
|
|
3968
3866
|
const [verificationTarget, setVerificationTarget] = useState(null);
|
|
3969
3867
|
const [otpCode, setOtpCode] = useState("");
|
|
3970
3868
|
const [oneTapLimit, setOneTapLimit] = useState(100);
|
|
3971
|
-
const [setupComplete, setSetupComplete] = useState(false);
|
|
3972
|
-
const [setupStepLabel, setSetupStepLabel] = useState(void 0);
|
|
3973
3869
|
const [mobileFlow, setMobileFlow] = useState(false);
|
|
3974
|
-
const [mobileSetupFlow, setMobileSetupFlow] = useState(false);
|
|
3975
3870
|
const pollingTransferIdRef = useRef(null);
|
|
3976
3871
|
const mobileSigningTransferIdRef = useRef(null);
|
|
3977
3872
|
const processingStartedAtRef = useRef(null);
|
|
@@ -3984,7 +3879,7 @@ function SwypePayment({
|
|
|
3984
3879
|
const transferSigning = useTransferSigning();
|
|
3985
3880
|
const sourceType = connectingNewAccount ? "providerId" : selectedWalletId ? "walletId" : selectedAccountId ? "accountId" : "providerId";
|
|
3986
3881
|
const sourceId = connectingNewAccount ? selectedProviderId ?? "" : selectedWalletId ? selectedWalletId : selectedAccountId ? selectedAccountId : selectedProviderId ?? "";
|
|
3987
|
-
|
|
3882
|
+
useCallback(async () => {
|
|
3988
3883
|
const token = await getAccessToken();
|
|
3989
3884
|
if (!token || !activeCredentialId) return;
|
|
3990
3885
|
const [accts, prov] = await Promise.all([
|
|
@@ -4212,24 +4107,7 @@ function SwypePayment({
|
|
|
4212
4107
|
return () => window.clearTimeout(timeoutId);
|
|
4213
4108
|
}, [step, polling.transfer, transfer, polling.stopPolling, onError]);
|
|
4214
4109
|
useEffect(() => {
|
|
4215
|
-
if (!
|
|
4216
|
-
const polledTransfer = polling.transfer;
|
|
4217
|
-
if (!polledTransfer) return;
|
|
4218
|
-
if (polledTransfer.status !== "AUTHORIZED" && polledTransfer.status !== "COMPLETED") return;
|
|
4219
|
-
polling.stopPolling();
|
|
4220
|
-
setMobileFlow(false);
|
|
4221
|
-
setMobileSetupFlow(false);
|
|
4222
|
-
const finishSetup = async () => {
|
|
4223
|
-
try {
|
|
4224
|
-
await reloadAccounts();
|
|
4225
|
-
} catch {
|
|
4226
|
-
}
|
|
4227
|
-
setStep("deposit");
|
|
4228
|
-
};
|
|
4229
|
-
void finishSetup();
|
|
4230
|
-
}, [mobileSetupFlow, polling, reloadAccounts]);
|
|
4231
|
-
useEffect(() => {
|
|
4232
|
-
if (!mobileFlow || mobileSetupFlow) return;
|
|
4110
|
+
if (!mobileFlow) return;
|
|
4233
4111
|
const polledTransfer = polling.transfer;
|
|
4234
4112
|
if (!polledTransfer || polledTransfer.status !== "AUTHORIZED") return;
|
|
4235
4113
|
if (transferSigning.signing) return;
|
|
@@ -4247,7 +4125,7 @@ function SwypePayment({
|
|
|
4247
4125
|
}
|
|
4248
4126
|
};
|
|
4249
4127
|
void sign();
|
|
4250
|
-
}, [mobileFlow,
|
|
4128
|
+
}, [mobileFlow, polling.transfer, transferSigning, onError]);
|
|
4251
4129
|
useEffect(() => {
|
|
4252
4130
|
if (!mobileFlow) return;
|
|
4253
4131
|
const transferIdToResume = pollingTransferIdRef.current ?? transfer?.id;
|
|
@@ -4295,7 +4173,7 @@ function SwypePayment({
|
|
|
4295
4173
|
initializedSelectSourceActionRef.current = pendingSelectSourceAction.id;
|
|
4296
4174
|
}, [pendingSelectSourceAction, selectSourceChoices, selectSourceRecommended]);
|
|
4297
4175
|
useEffect(() => {
|
|
4298
|
-
if (pendingSelectSourceAction &&
|
|
4176
|
+
if (pendingSelectSourceAction && step === "processing") {
|
|
4299
4177
|
preSelectSourceStepRef.current = step;
|
|
4300
4178
|
setStep("select-source");
|
|
4301
4179
|
} else if (!pendingSelectSourceAction && step === "select-source") {
|
|
@@ -4303,22 +4181,6 @@ function SwypePayment({
|
|
|
4303
4181
|
preSelectSourceStepRef.current = null;
|
|
4304
4182
|
}
|
|
4305
4183
|
}, [pendingSelectSourceAction, step]);
|
|
4306
|
-
const SETUP_ACTION_LABELS = useMemo(() => ({
|
|
4307
|
-
OPEN_PROVIDER: "Connecting wallet",
|
|
4308
|
-
SELECT_SOURCE: "Selecting source",
|
|
4309
|
-
SWITCH_CHAIN: "Switching network",
|
|
4310
|
-
APPROVE_PERMIT2: "Approving tokens",
|
|
4311
|
-
SIGN_PERMIT2: "Signing permit",
|
|
4312
|
-
DEPLOY_SMART_ACCOUNT: "Setting up account",
|
|
4313
|
-
CREATE_SMART_ACCOUNT: "Creating account"
|
|
4314
|
-
}), []);
|
|
4315
|
-
useEffect(() => {
|
|
4316
|
-
if (step !== "setup-status") return;
|
|
4317
|
-
const actionType = authExecutor.currentAction?.type;
|
|
4318
|
-
if (!actionType) return;
|
|
4319
|
-
const label = SETUP_ACTION_LABELS[actionType];
|
|
4320
|
-
if (label) setSetupStepLabel(label);
|
|
4321
|
-
}, [step, authExecutor.currentAction, SETUP_ACTION_LABELS]);
|
|
4322
4184
|
const handleSelectSourceChainChange = useCallback(
|
|
4323
4185
|
(chainName) => {
|
|
4324
4186
|
setSelectSourceChainName(chainName);
|
|
@@ -4507,74 +4369,11 @@ function SwypePayment({
|
|
|
4507
4369
|
setStep("deposit");
|
|
4508
4370
|
}
|
|
4509
4371
|
}, [accounts]);
|
|
4510
|
-
const handleSetupOneTap = useCallback(async (limit) => {
|
|
4511
|
-
setOneTapLimit(limit);
|
|
4512
|
-
setStep("setup-status");
|
|
4513
|
-
setSetupComplete(false);
|
|
4514
|
-
setSetupStepLabel("Preparing");
|
|
4515
|
-
setError(null);
|
|
4516
|
-
try {
|
|
4517
|
-
const token = await getAccessToken();
|
|
4518
|
-
if (!token) throw new Error("Not authenticated");
|
|
4519
|
-
if (!sourceId) {
|
|
4520
|
-
throw new Error("No wallet selected for setup.");
|
|
4521
|
-
}
|
|
4522
|
-
await updateUserConfig(apiBaseUrl, token, { defaultAllowance: limit });
|
|
4523
|
-
const setupAmount = depositAmount ?? MIN_SEND_AMOUNT_USD;
|
|
4524
|
-
const t = await createTransfer(apiBaseUrl, token, {
|
|
4525
|
-
id: idempotencyKey,
|
|
4526
|
-
credentialId: activeCredentialId ?? "",
|
|
4527
|
-
merchantAuthorization,
|
|
4528
|
-
sourceType,
|
|
4529
|
-
sourceId,
|
|
4530
|
-
destination,
|
|
4531
|
-
amount: setupAmount
|
|
4532
|
-
});
|
|
4533
|
-
if (t.authorizationSessions && t.authorizationSessions.length > 0) {
|
|
4534
|
-
const shouldUseConnector = shouldUseWalletConnector({
|
|
4535
|
-
useWalletConnector,
|
|
4536
|
-
userAgent: typeof navigator === "undefined" ? void 0 : navigator.userAgent
|
|
4537
|
-
});
|
|
4538
|
-
if (!shouldUseConnector) {
|
|
4539
|
-
setMobileFlow(true);
|
|
4540
|
-
setMobileSetupFlow(true);
|
|
4541
|
-
pollingTransferIdRef.current = t.id;
|
|
4542
|
-
polling.startPolling(t.id);
|
|
4543
|
-
window.location.href = t.authorizationSessions[0].uri;
|
|
4544
|
-
return;
|
|
4545
|
-
} else {
|
|
4546
|
-
await authExecutor.executeSession(t);
|
|
4547
|
-
}
|
|
4548
|
-
}
|
|
4549
|
-
await reloadAccounts();
|
|
4550
|
-
setSetupStepLabel(void 0);
|
|
4551
|
-
setSetupComplete(true);
|
|
4552
|
-
} catch (err) {
|
|
4553
|
-
const msg = err instanceof Error ? err.message : "Setup failed";
|
|
4554
|
-
setError(msg);
|
|
4555
|
-
onError?.(msg);
|
|
4556
|
-
}
|
|
4557
|
-
}, [
|
|
4558
|
-
getAccessToken,
|
|
4559
|
-
idempotencyKey,
|
|
4560
|
-
sourceId,
|
|
4561
|
-
sourceType,
|
|
4562
|
-
activeCredentialId,
|
|
4563
|
-
destination,
|
|
4564
|
-
apiBaseUrl,
|
|
4565
|
-
merchantAuthorization,
|
|
4566
|
-
useWalletConnector,
|
|
4567
|
-
authExecutor,
|
|
4568
|
-
polling,
|
|
4569
|
-
onError,
|
|
4570
|
-
depositAmount,
|
|
4571
|
-
reloadAccounts
|
|
4572
|
-
]);
|
|
4573
4372
|
const handleSelectProvider = useCallback((providerId) => {
|
|
4574
4373
|
setSelectedProviderId(providerId);
|
|
4575
4374
|
setSelectedAccountId(null);
|
|
4576
4375
|
setConnectingNewAccount(true);
|
|
4577
|
-
setStep("
|
|
4376
|
+
setStep("deposit");
|
|
4578
4377
|
}, []);
|
|
4579
4378
|
const handleContinueConnection = useCallback(
|
|
4580
4379
|
(accountId) => {
|
|
@@ -4582,7 +4381,7 @@ function SwypePayment({
|
|
|
4582
4381
|
setSelectedAccountId(accountId);
|
|
4583
4382
|
setSelectedWalletId(acct?.wallets[0]?.id ?? null);
|
|
4584
4383
|
setConnectingNewAccount(false);
|
|
4585
|
-
setStep("
|
|
4384
|
+
setStep("deposit");
|
|
4586
4385
|
},
|
|
4587
4386
|
[accounts]
|
|
4588
4387
|
);
|
|
@@ -4592,13 +4391,11 @@ function SwypePayment({
|
|
|
4592
4391
|
setError(null);
|
|
4593
4392
|
setAmount(depositAmount != null ? depositAmount.toString() : "");
|
|
4594
4393
|
setMobileFlow(false);
|
|
4595
|
-
setMobileSetupFlow(false);
|
|
4596
4394
|
processingStartedAtRef.current = null;
|
|
4597
4395
|
pollingTransferIdRef.current = null;
|
|
4598
4396
|
mobileSigningTransferIdRef.current = null;
|
|
4599
4397
|
setConnectingNewAccount(false);
|
|
4600
4398
|
setSelectedWalletId(null);
|
|
4601
|
-
setSetupComplete(false);
|
|
4602
4399
|
if (accounts.length > 0) setSelectedAccountId(accounts[0].id);
|
|
4603
4400
|
}, [depositAmount, accounts]);
|
|
4604
4401
|
const handleLogout = useCallback(async () => {
|
|
@@ -4625,8 +4422,6 @@ function SwypePayment({
|
|
|
4625
4422
|
setConnectingNewAccount(false);
|
|
4626
4423
|
setAmount(depositAmount != null ? depositAmount.toString() : "");
|
|
4627
4424
|
setMobileFlow(false);
|
|
4628
|
-
setMobileSetupFlow(false);
|
|
4629
|
-
setSetupComplete(false);
|
|
4630
4425
|
resetHeadlessLogin();
|
|
4631
4426
|
}, [logout, polling, depositAmount, resetHeadlessLogin]);
|
|
4632
4427
|
if (!ready) {
|
|
@@ -4696,35 +4491,6 @@ function SwypePayment({
|
|
|
4696
4491
|
}
|
|
4697
4492
|
);
|
|
4698
4493
|
}
|
|
4699
|
-
if (step === "setup") {
|
|
4700
|
-
return /* @__PURE__ */ jsx(
|
|
4701
|
-
SetupScreen,
|
|
4702
|
-
{
|
|
4703
|
-
availableBalance: maxSourceBalance,
|
|
4704
|
-
tokenCount,
|
|
4705
|
-
sourceName,
|
|
4706
|
-
onSetupOneTap: handleSetupOneTap,
|
|
4707
|
-
onBack: () => setStep("wallet-picker"),
|
|
4708
|
-
onLogout: handleLogout,
|
|
4709
|
-
loading: loadingData,
|
|
4710
|
-
error
|
|
4711
|
-
}
|
|
4712
|
-
);
|
|
4713
|
-
}
|
|
4714
|
-
if (step === "setup-status") {
|
|
4715
|
-
return /* @__PURE__ */ jsx(
|
|
4716
|
-
SetupStatusScreen,
|
|
4717
|
-
{
|
|
4718
|
-
complete: setupComplete,
|
|
4719
|
-
limit: oneTapLimit,
|
|
4720
|
-
tokensApproved: tokenCount,
|
|
4721
|
-
merchantName,
|
|
4722
|
-
onContinue: () => setStep("deposit"),
|
|
4723
|
-
onLogout: handleLogout,
|
|
4724
|
-
error
|
|
4725
|
-
}
|
|
4726
|
-
);
|
|
4727
|
-
}
|
|
4728
4494
|
if (step === "deposit") {
|
|
4729
4495
|
if (loadingData) {
|
|
4730
4496
|
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: "Loading..." }) }) });
|
|
@@ -4829,6 +4595,6 @@ function SwypePayment({
|
|
|
4829
4595
|
return null;
|
|
4830
4596
|
}
|
|
4831
4597
|
|
|
4832
|
-
export { IconCircle, OutlineButton, PoweredByFooter, PrimaryButton, ScreenHeader, ScreenLayout, SelectSourceScreen, SettingsMenu, Spinner, StepList, SwypePayment, SwypeProvider, createPasskeyCredential, darkTheme, deviceHasPasskey, findDevicePasskey, getTheme, lightTheme, api_exports as swypeApi, useAuthorizationExecutor, useSwypeConfig, useSwypeDepositAmount, useTransferPolling, useTransferSigning };
|
|
4598
|
+
export { IconCircle, OutlineButton, PoweredByFooter, PrimaryButton, ScreenHeader, ScreenLayout, SelectSourceScreen, SettingsMenu, SetupScreen, Spinner, StepList, SwypePayment, SwypeProvider, createPasskeyCredential, darkTheme, deviceHasPasskey, findDevicePasskey, getTheme, lightTheme, api_exports as swypeApi, useAuthorizationExecutor, useSwypeConfig, useSwypeDepositAmount, useTransferPolling, useTransferSigning };
|
|
4833
4599
|
//# sourceMappingURL=index.js.map
|
|
4834
4600
|
//# sourceMappingURL=index.js.map
|