@unifold/connect-react 0.1.68-beta.2 → 0.1.69
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/README.md +12 -0
- package/dist/index.d.mts +6 -0
- package/dist/index.d.ts +6 -0
- package/dist/index.js +1380 -971
- package/dist/index.mjs +1536 -1127
- package/dist/styles-base.css +1 -1
- package/dist/styles.css +1 -1
- package/package.json +4 -4
package/dist/index.js
CHANGED
|
@@ -6190,7 +6190,9 @@ var import_jsx_runtime18 = require("react/jsx-runtime");
|
|
|
6190
6190
|
var React211 = __toESM(require("react"), 1);
|
|
6191
6191
|
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
6192
6192
|
var import_jsx_runtime20 = require("react/jsx-runtime");
|
|
6193
|
+
var React52 = __toESM(require("react"), 1);
|
|
6193
6194
|
var import_react9 = require("react");
|
|
6195
|
+
var import_react_query3 = require("@tanstack/react-query");
|
|
6194
6196
|
|
|
6195
6197
|
// ../core/dist/index.mjs
|
|
6196
6198
|
var import_react_query2 = require("@tanstack/react-query");
|
|
@@ -6484,6 +6486,27 @@ async function getFiatCurrencies(publishableKey) {
|
|
|
6484
6486
|
}
|
|
6485
6487
|
return response.json();
|
|
6486
6488
|
}
|
|
6489
|
+
async function getFiatExchangeRates(options = {}, publishableKey) {
|
|
6490
|
+
const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
|
|
6491
|
+
validatePublishableKey(pk);
|
|
6492
|
+
const params = new URLSearchParams();
|
|
6493
|
+
if (options.currencies && options.currencies.length > 0) {
|
|
6494
|
+
params.set("currencies", options.currencies.join(","));
|
|
6495
|
+
}
|
|
6496
|
+
const queryString = params.toString();
|
|
6497
|
+
const url = `${API_BASE_URL}/v1/public/exchange_rates/fiat_currencies${queryString ? `?${queryString}` : ""}`;
|
|
6498
|
+
const response = await fetch(url, {
|
|
6499
|
+
method: "GET",
|
|
6500
|
+
headers: {
|
|
6501
|
+
accept: "application/json",
|
|
6502
|
+
"x-publishable-key": pk
|
|
6503
|
+
}
|
|
6504
|
+
});
|
|
6505
|
+
if (!response.ok) {
|
|
6506
|
+
throw new Error(`Failed to fetch fiat exchange rates: ${response.statusText}`);
|
|
6507
|
+
}
|
|
6508
|
+
return response.json();
|
|
6509
|
+
}
|
|
6487
6510
|
async function getOnrampQuotes(request, publishableKey) {
|
|
6488
6511
|
const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
|
|
6489
6512
|
validatePublishableKey(pk);
|
|
@@ -7165,6 +7188,7 @@ async function stripeGetDefaultToken(params, publishableKey) {
|
|
|
7165
7188
|
chain_type: params.chainType
|
|
7166
7189
|
});
|
|
7167
7190
|
if (params.countryCode) query.append("country_code", params.countryCode);
|
|
7191
|
+
if (params.subdivisionCode) query.append("subdivision_code", params.subdivisionCode);
|
|
7168
7192
|
const response = await fetch(
|
|
7169
7193
|
`${API_BASE_URL}${HEADLESS_STRIPE_BASE}/default_token?${query.toString()}`,
|
|
7170
7194
|
{
|
|
@@ -7803,7 +7827,7 @@ var en_default = {
|
|
|
7803
7827
|
var i18n = en_default;
|
|
7804
7828
|
|
|
7805
7829
|
// ../ui-react/dist/index.mjs
|
|
7806
|
-
var
|
|
7830
|
+
var import_react_query4 = require("@tanstack/react-query");
|
|
7807
7831
|
var import_react10 = require("react");
|
|
7808
7832
|
var import_react11 = require("react");
|
|
7809
7833
|
var import_react12 = require("react");
|
|
@@ -7812,7 +7836,7 @@ var React42 = __toESM(require("react"), 1);
|
|
|
7812
7836
|
var import_jsx_runtime22 = require("react/jsx-runtime");
|
|
7813
7837
|
var import_jsx_runtime23 = require("react/jsx-runtime");
|
|
7814
7838
|
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
7815
|
-
var
|
|
7839
|
+
var import_react_query5 = require("@tanstack/react-query");
|
|
7816
7840
|
var import_react13 = require("react");
|
|
7817
7841
|
var import_jsx_runtime25 = require("react/jsx-runtime");
|
|
7818
7842
|
var import_react14 = require("react");
|
|
@@ -7822,12 +7846,12 @@ var import_jsx_runtime26 = require("react/jsx-runtime");
|
|
|
7822
7846
|
var import_jsx_runtime27 = require("react/jsx-runtime");
|
|
7823
7847
|
var import_jsx_runtime28 = require("react/jsx-runtime");
|
|
7824
7848
|
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
7825
|
-
var
|
|
7849
|
+
var React62 = __toESM(require("react"), 1);
|
|
7826
7850
|
var import_react17 = require("react");
|
|
7827
|
-
var import_react_query5 = require("@tanstack/react-query");
|
|
7828
|
-
var import_react18 = require("react");
|
|
7829
7851
|
var import_react_query6 = require("@tanstack/react-query");
|
|
7852
|
+
var import_react18 = require("react");
|
|
7830
7853
|
var import_react_query7 = require("@tanstack/react-query");
|
|
7854
|
+
var import_react_query8 = require("@tanstack/react-query");
|
|
7831
7855
|
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
7832
7856
|
var import_react19 = require("react");
|
|
7833
7857
|
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
@@ -7836,20 +7860,20 @@ var import_react21 = require("react");
|
|
|
7836
7860
|
var import_qr_code_styling = __toESM(require_qr_code_styling(), 1);
|
|
7837
7861
|
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
7838
7862
|
var import_react22 = require("react");
|
|
7839
|
-
var
|
|
7863
|
+
var import_react_query9 = require("@tanstack/react-query");
|
|
7840
7864
|
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
7841
7865
|
var import_react23 = require("react");
|
|
7842
|
-
var
|
|
7866
|
+
var import_react_query10 = require("@tanstack/react-query");
|
|
7843
7867
|
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
7844
7868
|
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
7845
|
-
var React62 = __toESM(require("react"), 1);
|
|
7846
|
-
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
7847
7869
|
var React72 = __toESM(require("react"), 1);
|
|
7848
|
-
var
|
|
7870
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
7849
7871
|
var React82 = __toESM(require("react"), 1);
|
|
7872
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
7873
|
+
var React92 = __toESM(require("react"), 1);
|
|
7850
7874
|
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
7875
|
+
var React112 = __toESM(require("react"), 1);
|
|
7851
7876
|
var React102 = __toESM(require("react"), 1);
|
|
7852
|
-
var React92 = __toESM(require("react"), 1);
|
|
7853
7877
|
|
|
7854
7878
|
// ../../node_modules/.pnpm/@radix-ui+react-slot@1.2.4_@types+react@19.2.9_react@19.2.3/node_modules/@radix-ui/react-slot/dist/index.mjs
|
|
7855
7879
|
var React25 = __toESM(require("react"), 1);
|
|
@@ -7997,15 +8021,15 @@ var cva = (base, config) => (props) => {
|
|
|
7997
8021
|
// ../ui-react/dist/index.mjs
|
|
7998
8022
|
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
7999
8023
|
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
8000
|
-
var React112 = __toESM(require("react"), 1);
|
|
8001
|
-
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
8002
8024
|
var React122 = __toESM(require("react"), 1);
|
|
8003
|
-
var
|
|
8025
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
8004
8026
|
var React132 = __toESM(require("react"), 1);
|
|
8005
|
-
var
|
|
8027
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
8006
8028
|
var React142 = __toESM(require("react"), 1);
|
|
8029
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
8030
|
+
var React152 = __toESM(require("react"), 1);
|
|
8007
8031
|
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
8008
|
-
var
|
|
8032
|
+
var React292 = __toESM(require("react"), 1);
|
|
8009
8033
|
|
|
8010
8034
|
// ../../node_modules/.pnpm/mipd@0.0.7_typescript@5.9.3/node_modules/mipd/dist/esm/utils.js
|
|
8011
8035
|
function requestProviders(listener) {
|
|
@@ -8062,51 +8086,50 @@ function createStore() {
|
|
|
8062
8086
|
}
|
|
8063
8087
|
|
|
8064
8088
|
// ../ui-react/dist/index.mjs
|
|
8065
|
-
var React152 = __toESM(require("react"), 1);
|
|
8066
8089
|
var React162 = __toESM(require("react"), 1);
|
|
8067
|
-
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
8068
8090
|
var React172 = __toESM(require("react"), 1);
|
|
8069
|
-
var
|
|
8091
|
+
var import_jsx_runtime45 = require("react/jsx-runtime");
|
|
8070
8092
|
var React182 = __toESM(require("react"), 1);
|
|
8071
|
-
var
|
|
8093
|
+
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
8072
8094
|
var React192 = __toESM(require("react"), 1);
|
|
8073
|
-
var
|
|
8095
|
+
var import_jsx_runtime47 = require("react/jsx-runtime");
|
|
8074
8096
|
var React202 = __toESM(require("react"), 1);
|
|
8075
|
-
var
|
|
8097
|
+
var import_jsx_runtime48 = require("react/jsx-runtime");
|
|
8076
8098
|
var React212 = __toESM(require("react"), 1);
|
|
8077
|
-
var
|
|
8099
|
+
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
8078
8100
|
var React222 = __toESM(require("react"), 1);
|
|
8079
|
-
var
|
|
8101
|
+
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
8080
8102
|
var React232 = __toESM(require("react"), 1);
|
|
8081
|
-
var
|
|
8103
|
+
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
8082
8104
|
var React242 = __toESM(require("react"), 1);
|
|
8083
|
-
var
|
|
8105
|
+
var import_jsx_runtime52 = require("react/jsx-runtime");
|
|
8084
8106
|
var React252 = __toESM(require("react"), 1);
|
|
8085
|
-
var
|
|
8107
|
+
var import_jsx_runtime53 = require("react/jsx-runtime");
|
|
8086
8108
|
var React262 = __toESM(require("react"), 1);
|
|
8087
|
-
var
|
|
8109
|
+
var import_jsx_runtime54 = require("react/jsx-runtime");
|
|
8088
8110
|
var React272 = __toESM(require("react"), 1);
|
|
8111
|
+
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
8112
|
+
var React282 = __toESM(require("react"), 1);
|
|
8089
8113
|
var import_jsx_runtime56 = require("react/jsx-runtime");
|
|
8090
8114
|
var import_jsx_runtime57 = require("react/jsx-runtime");
|
|
8091
8115
|
var import_jsx_runtime58 = require("react/jsx-runtime");
|
|
8092
|
-
var
|
|
8116
|
+
var React302 = __toESM(require("react"), 1);
|
|
8093
8117
|
var import_jsx_runtime59 = require("react/jsx-runtime");
|
|
8094
8118
|
var import_react24 = require("react");
|
|
8095
8119
|
var import_jsx_runtime60 = require("react/jsx-runtime");
|
|
8096
8120
|
var import_react25 = require("react");
|
|
8097
8121
|
var import_jsx_runtime61 = require("react/jsx-runtime");
|
|
8098
8122
|
var import_react26 = require("react");
|
|
8099
|
-
var import_react_query10 = require("@tanstack/react-query");
|
|
8100
8123
|
var import_react_query11 = require("@tanstack/react-query");
|
|
8101
8124
|
var import_react_query12 = require("@tanstack/react-query");
|
|
8102
|
-
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
8103
8125
|
var import_react_query13 = require("@tanstack/react-query");
|
|
8126
|
+
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
8104
8127
|
var import_react_query14 = require("@tanstack/react-query");
|
|
8105
8128
|
var import_react_query15 = require("@tanstack/react-query");
|
|
8106
8129
|
var import_react_query16 = require("@tanstack/react-query");
|
|
8107
8130
|
var import_react27 = require("react");
|
|
8108
8131
|
var import_react28 = require("react");
|
|
8109
|
-
var
|
|
8132
|
+
var React322 = __toESM(require("react"), 1);
|
|
8110
8133
|
var import_jsx_runtime63 = require("react/jsx-runtime");
|
|
8111
8134
|
var import_jsx_runtime64 = require("react/jsx-runtime");
|
|
8112
8135
|
var import_jsx_runtime65 = require("react/jsx-runtime");
|
|
@@ -10116,7 +10139,7 @@ var import_react30 = require("react");
|
|
|
10116
10139
|
var import_jsx_runtime67 = require("react/jsx-runtime");
|
|
10117
10140
|
var import_jsx_runtime68 = require("react/jsx-runtime");
|
|
10118
10141
|
var import_react31 = require("react");
|
|
10119
|
-
var
|
|
10142
|
+
var React332 = __toESM(require("react"), 1);
|
|
10120
10143
|
|
|
10121
10144
|
// ../../node_modules/.pnpm/@radix-ui+react-tooltip@1.2.8_@types+react-dom@19.2.3_@types+react@19.2.9__@types+react@19.2._udyjcec5g7ve3mpsxbgla63vgi/node_modules/@radix-ui/react-tooltip/dist/index.mjs
|
|
10122
10145
|
var React31 = __toESM(require("react"), 1);
|
|
@@ -12858,7 +12881,7 @@ var import_react_query17 = require("@tanstack/react-query");
|
|
|
12858
12881
|
var import_jsx_runtime70 = require("react/jsx-runtime");
|
|
12859
12882
|
var import_jsx_runtime71 = require("react/jsx-runtime");
|
|
12860
12883
|
var import_react32 = require("react");
|
|
12861
|
-
var
|
|
12884
|
+
var React342 = __toESM(require("react"), 1);
|
|
12862
12885
|
|
|
12863
12886
|
// ../../node_modules/.pnpm/@radix-ui+react-select@2.2.6_@types+react-dom@19.2.3_@types+react@19.2.9__@types+react@19.2.9_cot3leusltbsophitaz3dgdqdm/node_modules/@radix-ui/react-select/dist/index.mjs
|
|
12864
12887
|
var React35 = __toESM(require("react"), 1);
|
|
@@ -14095,7 +14118,7 @@ var Separator = SelectSeparator;
|
|
|
14095
14118
|
// ../ui-react/dist/index.mjs
|
|
14096
14119
|
var import_jsx_runtime72 = require("react/jsx-runtime");
|
|
14097
14120
|
var import_jsx_runtime73 = require("react/jsx-runtime");
|
|
14098
|
-
var
|
|
14121
|
+
var React352 = __toESM(require("react"), 1);
|
|
14099
14122
|
var import_react_query18 = require("@tanstack/react-query");
|
|
14100
14123
|
var import_react_query19 = require("@tanstack/react-query");
|
|
14101
14124
|
var import_jsx_runtime74 = require("react/jsx-runtime");
|
|
@@ -14556,6 +14579,7 @@ var DialogContent2 = React36.forwardRef(({ className, style, children, omitOverl
|
|
|
14556
14579
|
className: cn(
|
|
14557
14580
|
portalContainer ? "uf-absolute" : "uf-fixed",
|
|
14558
14581
|
"uf-bottom-0 uf-left-0 uf-right-0 uf-top-0 uf-z-50 uf-grid uf-w-full uf-max-w-full uf-h-full",
|
|
14582
|
+
"focus:uf-outline-none focus-visible:uf-outline-none",
|
|
14559
14583
|
!portalContainer && "sm:uf-left-[50%] sm:uf-top-[50%] sm:uf-bottom-auto sm:uf-right-auto sm:uf-translate-x-[-50%] sm:uf-translate-y-[-50%] sm:uf-h-auto",
|
|
14560
14584
|
"uf-border uf-bg-background",
|
|
14561
14585
|
omitOverlayEmbed ? "uf-gap-0 uf-p-0" : "uf-gap-4 uf-p-6 uf-shadow-lg uf-duration-200",
|
|
@@ -14571,6 +14595,14 @@ var DialogContent2 = React36.forwardRef(({ className, style, children, omitOverl
|
|
|
14571
14595
|
),
|
|
14572
14596
|
style: {
|
|
14573
14597
|
"--uf-container-radius": `${components.container.borderRadius}px`,
|
|
14598
|
+
// Radix traps focus and, when the focused control unmounts during an
|
|
14599
|
+
// in-modal screen transition, moves focus onto this container. Modern
|
|
14600
|
+
// browsers paint the default focus ring via `:focus-visible`, which
|
|
14601
|
+
// flashes a highlight around the whole modal until focus settles on
|
|
14602
|
+
// the next screen. Suppress it inline so it works regardless of the
|
|
14603
|
+
// Tailwind build (the container is a programmatic focus target, not an
|
|
14604
|
+
// interactive control, so it should never show a focus ring).
|
|
14605
|
+
outline: "none",
|
|
14574
14606
|
...portalContainer ? { display: "flex", flexDirection: "column" } : {},
|
|
14575
14607
|
...style
|
|
14576
14608
|
},
|
|
@@ -14667,7 +14699,7 @@ function useDepositAddress(params) {
|
|
|
14667
14699
|
contractCalls,
|
|
14668
14700
|
enabled = true
|
|
14669
14701
|
} = params;
|
|
14670
|
-
return (0,
|
|
14702
|
+
return (0, import_react_query4.useQuery)({
|
|
14671
14703
|
queryKey: [
|
|
14672
14704
|
"unifold",
|
|
14673
14705
|
"depositAddress",
|
|
@@ -15294,7 +15326,7 @@ function useUserIp2() {
|
|
|
15294
15326
|
data: userIpInfo,
|
|
15295
15327
|
isLoading,
|
|
15296
15328
|
error
|
|
15297
|
-
} = (0,
|
|
15329
|
+
} = (0, import_react_query5.useQuery)({
|
|
15298
15330
|
queryKey: ["unifold", "userIpInfo"],
|
|
15299
15331
|
queryFn: async () => {
|
|
15300
15332
|
const data = await getIpAddress();
|
|
@@ -16568,13 +16600,25 @@ function BuyWithCard({
|
|
|
16568
16600
|
wallets: externalWallets,
|
|
16569
16601
|
assetCdnUrl,
|
|
16570
16602
|
hideDepositFlowInfo = false,
|
|
16571
|
-
hideDisplayDescription = false
|
|
16603
|
+
hideDisplayDescription = false,
|
|
16604
|
+
prefilledAmountUsd
|
|
16572
16605
|
}) {
|
|
16573
16606
|
const { colors: colors2, fonts, components } = useTheme();
|
|
16574
|
-
const
|
|
16607
|
+
const cleanedPrefilledAmountUsd = React52.useMemo(() => {
|
|
16608
|
+
if (!prefilledAmountUsd) return "";
|
|
16609
|
+
return prefilledAmountUsd.replace(/[^0-9.]/g, "");
|
|
16610
|
+
}, [prefilledAmountUsd]);
|
|
16611
|
+
const parsedPrefilledAmountUsd = React52.useMemo(() => {
|
|
16612
|
+
const parsed = parseFloat(cleanedPrefilledAmountUsd);
|
|
16613
|
+
return Number.isFinite(parsed) && parsed > 0 ? parsed : null;
|
|
16614
|
+
}, [cleanedPrefilledAmountUsd]);
|
|
16615
|
+
const shouldAutoConvertPrefilledRef = (0, import_react9.useRef)(!!cleanedPrefilledAmountUsd);
|
|
16616
|
+
const [amount, setAmount] = (0, import_react9.useState)(() => cleanedPrefilledAmountUsd);
|
|
16575
16617
|
const [currency, setCurrency] = (0, import_react9.useState)("usd");
|
|
16576
16618
|
const [hasManualCurrencySelection, setHasManualCurrencySelection] = (0, import_react9.useState)(false);
|
|
16577
|
-
const [hasManualAmountEntry, setHasManualAmountEntry] = (0, import_react9.useState)(
|
|
16619
|
+
const [hasManualAmountEntry, setHasManualAmountEntry] = (0, import_react9.useState)(
|
|
16620
|
+
() => !!cleanedPrefilledAmountUsd
|
|
16621
|
+
);
|
|
16578
16622
|
const [showCurrencyModal, setShowCurrencyModal] = (0, import_react9.useState)(false);
|
|
16579
16623
|
const [quotes, setQuotes] = (0, import_react9.useState)([]);
|
|
16580
16624
|
const [quotesLoading, setQuotesLoading] = (0, import_react9.useState)(false);
|
|
@@ -16631,6 +16675,71 @@ function BuyWithCard({
|
|
|
16631
16675
|
const [preferredCurrencyCodes, setPreferredCurrencyCodes] = (0, import_react9.useState)([]);
|
|
16632
16676
|
const [currenciesLoading, setCurrenciesLoading] = (0, import_react9.useState)(true);
|
|
16633
16677
|
const [destinationToken, setDestinationToken] = (0, import_react9.useState)(null);
|
|
16678
|
+
(0, import_react9.useEffect)(() => {
|
|
16679
|
+
const hasPrefilledAmount = !!cleanedPrefilledAmountUsd;
|
|
16680
|
+
shouldAutoConvertPrefilledRef.current = hasPrefilledAmount;
|
|
16681
|
+
if (!hasPrefilledAmount) return;
|
|
16682
|
+
setAmount(cleanedPrefilledAmountUsd);
|
|
16683
|
+
setHasManualAmountEntry(true);
|
|
16684
|
+
}, [cleanedPrefilledAmountUsd]);
|
|
16685
|
+
const { data: fiatExchangeRatesResponse, isLoading: isFiatExchangeRatesLoading } = (0, import_react_query3.useQuery)({
|
|
16686
|
+
queryKey: ["fiat-exchange-rates", publishableKey],
|
|
16687
|
+
staleTime: 3e4,
|
|
16688
|
+
refetchInterval: 3e4,
|
|
16689
|
+
queryFn: async () => {
|
|
16690
|
+
try {
|
|
16691
|
+
return await getFiatExchangeRates({}, publishableKey);
|
|
16692
|
+
} catch (error) {
|
|
16693
|
+
console.error("Error fetching fiat exchange rates:", error);
|
|
16694
|
+
return { base_currency: "usd", rates: {} };
|
|
16695
|
+
}
|
|
16696
|
+
}
|
|
16697
|
+
});
|
|
16698
|
+
const fiatExchangeRates = fiatExchangeRatesResponse?.rates ?? {};
|
|
16699
|
+
const convertAmountBetweenCurrencies = React52.useCallback(
|
|
16700
|
+
(rawAmount, fromCurrencyCode, toCurrencyCode) => {
|
|
16701
|
+
const parsedAmount = parseFloat(rawAmount);
|
|
16702
|
+
if (!Number.isFinite(parsedAmount) || parsedAmount <= 0) return null;
|
|
16703
|
+
const fromCode = fromCurrencyCode.toLowerCase();
|
|
16704
|
+
const toCode = toCurrencyCode.toLowerCase();
|
|
16705
|
+
const fromRate = fromCode === "usd" ? 1 : fiatExchangeRates[fromCode];
|
|
16706
|
+
const toRate = toCode === "usd" ? 1 : fiatExchangeRates[toCode];
|
|
16707
|
+
if (!Number.isFinite(fromRate) || fromRate <= 0) return null;
|
|
16708
|
+
if (!Number.isFinite(toRate) || toRate <= 0) return null;
|
|
16709
|
+
const usdAmount = parsedAmount / fromRate;
|
|
16710
|
+
return parseFloat((usdAmount * toRate).toFixed(2)).toString();
|
|
16711
|
+
},
|
|
16712
|
+
[fiatExchangeRates]
|
|
16713
|
+
);
|
|
16714
|
+
const getConvertedPrefilledAmount = React52.useCallback(
|
|
16715
|
+
(targetCurrencyCode) => {
|
|
16716
|
+
if (!parsedPrefilledAmountUsd) return null;
|
|
16717
|
+
const normalizedTargetCurrency = targetCurrencyCode.toLowerCase();
|
|
16718
|
+
const rate = normalizedTargetCurrency === "usd" ? 1 : fiatExchangeRates[normalizedTargetCurrency];
|
|
16719
|
+
if (!Number.isFinite(rate) || rate <= 0) return null;
|
|
16720
|
+
return parseFloat((parsedPrefilledAmountUsd * rate).toFixed(2)).toString();
|
|
16721
|
+
},
|
|
16722
|
+
[parsedPrefilledAmountUsd, fiatExchangeRates]
|
|
16723
|
+
);
|
|
16724
|
+
(0, import_react9.useEffect)(() => {
|
|
16725
|
+
if (!cleanedPrefilledAmountUsd || !shouldAutoConvertPrefilledRef.current) return;
|
|
16726
|
+
const convertedAmount = getConvertedPrefilledAmount(currency);
|
|
16727
|
+
if (!convertedAmount) {
|
|
16728
|
+
if (isFiatExchangeRatesLoading) return;
|
|
16729
|
+
const targetCurrency = currency.toLowerCase();
|
|
16730
|
+
if (targetCurrency !== "usd") {
|
|
16731
|
+
setCurrency("usd");
|
|
16732
|
+
}
|
|
16733
|
+
return;
|
|
16734
|
+
}
|
|
16735
|
+
setAmount(convertedAmount);
|
|
16736
|
+
setHasManualAmountEntry(true);
|
|
16737
|
+
}, [
|
|
16738
|
+
cleanedPrefilledAmountUsd,
|
|
16739
|
+
currency,
|
|
16740
|
+
getConvertedPrefilledAmount,
|
|
16741
|
+
isFiatExchangeRatesLoading
|
|
16742
|
+
]);
|
|
16634
16743
|
const depositWalletId = defaultToken ? getWalletByChainType(wallets, defaultToken.destination_token_metadata.chain_type)?.id : void 0;
|
|
16635
16744
|
const { executions, isPolling, showWaitingUi } = useDepositPolling({
|
|
16636
16745
|
userId,
|
|
@@ -16661,6 +16770,7 @@ function BuyWithCard({
|
|
|
16661
16770
|
}, [publishableKey]);
|
|
16662
16771
|
(0, import_react9.useEffect)(() => {
|
|
16663
16772
|
if (hasManualCurrencySelection) return;
|
|
16773
|
+
if (hasManualAmountEntry && !shouldAutoConvertPrefilledRef.current) return;
|
|
16664
16774
|
if (fiatCurrencies.length === 0 || !userIpInfo?.alpha2) return;
|
|
16665
16775
|
const userCountryCode = userIpInfo.alpha2;
|
|
16666
16776
|
const matchingCurrency = fiatCurrencies.find((c) => c.country_codes.includes(userCountryCode));
|
|
@@ -16679,7 +16789,15 @@ function BuyWithCard({
|
|
|
16679
16789
|
const prevCurrencyRef = (0, import_react9.useRef)(null);
|
|
16680
16790
|
(0, import_react9.useEffect)(() => {
|
|
16681
16791
|
if (fiatCurrencies.length === 0) return;
|
|
16792
|
+
if (shouldAutoConvertPrefilledRef.current) {
|
|
16793
|
+
prevCurrencyRef.current = currency;
|
|
16794
|
+
return;
|
|
16795
|
+
}
|
|
16682
16796
|
if (prevCurrencyRef.current !== null && prevCurrencyRef.current !== currency) {
|
|
16797
|
+
if (hasManualAmountEntry) {
|
|
16798
|
+
prevCurrencyRef.current = currency;
|
|
16799
|
+
return;
|
|
16800
|
+
}
|
|
16683
16801
|
const currentCurrency = fiatCurrencies.find(
|
|
16684
16802
|
(c) => c.currency_code.toLowerCase() === currency.toLowerCase()
|
|
16685
16803
|
);
|
|
@@ -16688,7 +16806,7 @@ function BuyWithCard({
|
|
|
16688
16806
|
}
|
|
16689
16807
|
}
|
|
16690
16808
|
prevCurrencyRef.current = currency;
|
|
16691
|
-
}, [currency]);
|
|
16809
|
+
}, [currency, fiatCurrencies, hasManualAmountEntry]);
|
|
16692
16810
|
(0, import_react9.useEffect)(() => {
|
|
16693
16811
|
async function fetchDestinationToken() {
|
|
16694
16812
|
try {
|
|
@@ -16865,6 +16983,7 @@ function BuyWithCard({
|
|
|
16865
16983
|
return () => clearInterval(timer);
|
|
16866
16984
|
}, [quotes.length, amount]);
|
|
16867
16985
|
const handleAmountChange = (value) => {
|
|
16986
|
+
shouldAutoConvertPrefilledRef.current = false;
|
|
16868
16987
|
if (value === "") {
|
|
16869
16988
|
setAmount(value);
|
|
16870
16989
|
setHasManualAmountEntry(true);
|
|
@@ -16878,6 +16997,7 @@ function BuyWithCard({
|
|
|
16878
16997
|
}
|
|
16879
16998
|
};
|
|
16880
16999
|
const handleQuickAmount = (quickAmount) => {
|
|
17000
|
+
shouldAutoConvertPrefilledRef.current = false;
|
|
16881
17001
|
setAmount(quickAmount.toString());
|
|
16882
17002
|
setHasManualAmountEntry(true);
|
|
16883
17003
|
};
|
|
@@ -17481,8 +17601,43 @@ function BuyWithCard({
|
|
|
17481
17601
|
preferredCurrencyCodes,
|
|
17482
17602
|
selectedCurrency: currency,
|
|
17483
17603
|
onSelectCurrency: (currencyCode) => {
|
|
17484
|
-
|
|
17604
|
+
const nextCurrency = currencyCode.toLowerCase();
|
|
17605
|
+
if (nextCurrency === currency.toLowerCase()) {
|
|
17606
|
+
setHasManualCurrencySelection(true);
|
|
17607
|
+
return;
|
|
17608
|
+
}
|
|
17609
|
+
const currentCurrency = currency;
|
|
17485
17610
|
setHasManualCurrencySelection(true);
|
|
17611
|
+
if (shouldAutoConvertPrefilledRef.current) {
|
|
17612
|
+
const convertedAmount = getConvertedPrefilledAmount(nextCurrency);
|
|
17613
|
+
if (convertedAmount) {
|
|
17614
|
+
setCurrency(nextCurrency);
|
|
17615
|
+
setAmount(convertedAmount);
|
|
17616
|
+
setHasManualAmountEntry(true);
|
|
17617
|
+
} else {
|
|
17618
|
+
if (isFiatExchangeRatesLoading) return;
|
|
17619
|
+
const fallbackUsdAmount = getConvertedPrefilledAmount("usd");
|
|
17620
|
+
setCurrency("usd");
|
|
17621
|
+
if (fallbackUsdAmount) {
|
|
17622
|
+
setAmount(fallbackUsdAmount);
|
|
17623
|
+
setHasManualAmountEntry(true);
|
|
17624
|
+
}
|
|
17625
|
+
}
|
|
17626
|
+
return;
|
|
17627
|
+
}
|
|
17628
|
+
if (hasManualAmountEntry && amount) {
|
|
17629
|
+
const convertedAmount = convertAmountBetweenCurrencies(
|
|
17630
|
+
amount,
|
|
17631
|
+
currentCurrency,
|
|
17632
|
+
nextCurrency
|
|
17633
|
+
);
|
|
17634
|
+
if (convertedAmount) {
|
|
17635
|
+
setCurrency(nextCurrency);
|
|
17636
|
+
setAmount(convertedAmount);
|
|
17637
|
+
}
|
|
17638
|
+
return;
|
|
17639
|
+
}
|
|
17640
|
+
setCurrency(nextCurrency);
|
|
17486
17641
|
},
|
|
17487
17642
|
themeClass
|
|
17488
17643
|
}
|
|
@@ -17535,7 +17690,7 @@ function useCoinbaseLegalAgreements({
|
|
|
17535
17690
|
publishableKey,
|
|
17536
17691
|
enabled = true
|
|
17537
17692
|
}) {
|
|
17538
|
-
return (0,
|
|
17693
|
+
return (0, import_react_query6.useQuery)({
|
|
17539
17694
|
queryKey: ["unifold", "coinbaseLegalAgreements", publishableKey],
|
|
17540
17695
|
queryFn: () => getCoinbaseLegalAgreements(publishableKey),
|
|
17541
17696
|
enabled: enabled && !!publishableKey,
|
|
@@ -17553,7 +17708,7 @@ function useApplePayLimits({
|
|
|
17553
17708
|
enabled = true
|
|
17554
17709
|
}) {
|
|
17555
17710
|
const phoneValid = US_E164_REGEX.test(phone);
|
|
17556
|
-
return (0,
|
|
17711
|
+
return (0, import_react_query7.useQuery)({
|
|
17557
17712
|
queryKey: ["unifold", "applePayLimits", phone, publishableKey],
|
|
17558
17713
|
queryFn: ({ signal }) => getCoinbaseApplePayLimits(phone, publishableKey, signal),
|
|
17559
17714
|
enabled: enabled && phoneValid && !!publishableKey,
|
|
@@ -17653,7 +17808,7 @@ function useDefaultOnrampToken({
|
|
|
17653
17808
|
isLoading,
|
|
17654
17809
|
isError,
|
|
17655
17810
|
error
|
|
17656
|
-
} = (0,
|
|
17811
|
+
} = (0, import_react_query8.useQuery)({
|
|
17657
17812
|
queryKey: [
|
|
17658
17813
|
"unifold",
|
|
17659
17814
|
"defaultOnrampToken",
|
|
@@ -17727,7 +17882,7 @@ function parseCoinbasePostMessage(raw) {
|
|
|
17727
17882
|
} : void 0
|
|
17728
17883
|
};
|
|
17729
17884
|
}
|
|
17730
|
-
var BuyWithApplePay =
|
|
17885
|
+
var BuyWithApplePay = React62.forwardRef(
|
|
17731
17886
|
function BuyWithApplePay2({
|
|
17732
17887
|
userId,
|
|
17733
17888
|
publishableKey,
|
|
@@ -17886,7 +18041,7 @@ var BuyWithApplePay = React52.forwardRef(
|
|
|
17886
18041
|
popupRef.current = null;
|
|
17887
18042
|
};
|
|
17888
18043
|
}, []);
|
|
17889
|
-
|
|
18044
|
+
React62.useImperativeHandle(
|
|
17890
18045
|
ref,
|
|
17891
18046
|
() => ({
|
|
17892
18047
|
requestBack: () => {
|
|
@@ -19196,7 +19351,7 @@ function LegalDisclaimer({ legalAgreements, loading }) {
|
|
|
19196
19351
|
children: [
|
|
19197
19352
|
"By continuing, you agree to Coinbase's",
|
|
19198
19353
|
" ",
|
|
19199
|
-
agreements.map((a, idx, arr) => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
19354
|
+
agreements.map((a, idx, arr) => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(React62.Fragment, { children: [
|
|
19200
19355
|
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
19201
19356
|
"a",
|
|
19202
19357
|
{
|
|
@@ -19612,7 +19767,7 @@ function useIsMobileViewport() {
|
|
|
19612
19767
|
return isMobile;
|
|
19613
19768
|
}
|
|
19614
19769
|
function useCashAppLimits({ publishableKey, currency = "usd" }) {
|
|
19615
|
-
return (0,
|
|
19770
|
+
return (0, import_react_query9.useQuery)({
|
|
19616
19771
|
queryKey: ["unifold", "cashAppLimits", currency, publishableKey],
|
|
19617
19772
|
queryFn: () => getCashAppLimits(currency, publishableKey),
|
|
19618
19773
|
enabled: !!publishableKey,
|
|
@@ -19625,6 +19780,7 @@ var POLL_INTERVAL_MS2 = 5e3;
|
|
|
19625
19780
|
var FALLBACK_MIN_USD = 5;
|
|
19626
19781
|
var SUGGESTED_AMOUNTS = [25, 50, 100];
|
|
19627
19782
|
var t3 = i18n2.depositModal.cashApp;
|
|
19783
|
+
var sanitizePrefilledUsd = (value) => value?.replace(/[^0-9.]/g, "") ?? "";
|
|
19628
19784
|
function PayWithCashApp({
|
|
19629
19785
|
userId,
|
|
19630
19786
|
publishableKey,
|
|
@@ -19639,6 +19795,7 @@ function PayWithCashApp({
|
|
|
19639
19795
|
onEvent,
|
|
19640
19796
|
onDepositSuccess,
|
|
19641
19797
|
onDepositError,
|
|
19798
|
+
prefilledAmountUsd,
|
|
19642
19799
|
wallets = []
|
|
19643
19800
|
}) {
|
|
19644
19801
|
const { colors: colors2, fonts, components } = useTheme();
|
|
@@ -19654,7 +19811,7 @@ function PayWithCashApp({
|
|
|
19654
19811
|
const { data: limits, isLoading: limitsLoading } = useCashAppLimits({ publishableKey });
|
|
19655
19812
|
const minUsd = limits?.minimum_amount ?? FALLBACK_MIN_USD;
|
|
19656
19813
|
const maxUsd = limits?.maximum_amount ?? null;
|
|
19657
|
-
const [amount, setAmount] = (0, import_react20.useState)(
|
|
19814
|
+
const [amount, setAmount] = (0, import_react20.useState)(() => sanitizePrefilledUsd(prefilledAmountUsd));
|
|
19658
19815
|
const [loading, setLoading] = (0, import_react20.useState)(false);
|
|
19659
19816
|
const [session, setSession] = (0, import_react20.useState)(null);
|
|
19660
19817
|
const [status, setStatus] = (0, import_react20.useState)("pending");
|
|
@@ -19777,6 +19934,13 @@ function PayWithCashApp({
|
|
|
19777
19934
|
return () => clearInterval(interval);
|
|
19778
19935
|
}, [session, view, status, publishableKey, onDepositSuccess, onDepositError]);
|
|
19779
19936
|
const [softExpired, setSoftExpired] = (0, import_react20.useState)(false);
|
|
19937
|
+
(0, import_react20.useEffect)(() => {
|
|
19938
|
+
if (!prefilledAmountUsd) return;
|
|
19939
|
+
const cleaned = sanitizePrefilledUsd(prefilledAmountUsd);
|
|
19940
|
+
if (!cleaned) return;
|
|
19941
|
+
setAmount(cleaned);
|
|
19942
|
+
onAmountChange?.(cleaned);
|
|
19943
|
+
}, [prefilledAmountUsd, onAmountChange]);
|
|
19780
19944
|
(0, import_react20.useEffect)(() => {
|
|
19781
19945
|
if (!session?.expires_at || view !== "payment") return;
|
|
19782
19946
|
const expiresMs = new Date(session.expires_at).getTime();
|
|
@@ -20131,7 +20295,7 @@ function useBankTransferProviders({
|
|
|
20131
20295
|
countryCode
|
|
20132
20296
|
}) {
|
|
20133
20297
|
const normalizedCountry = countryCode?.toUpperCase();
|
|
20134
|
-
const { data: providers, isLoading } = (0,
|
|
20298
|
+
const { data: providers, isLoading } = (0, import_react_query10.useQuery)({
|
|
20135
20299
|
queryKey: ["unifold", "bankTransferProviders", publishableKey, normalizedCountry ?? null],
|
|
20136
20300
|
queryFn: () => getBankTransferProviders(publishableKey, { countryCode: normalizedCountry }),
|
|
20137
20301
|
enabled,
|
|
@@ -20169,7 +20333,8 @@ function BankTransfer({
|
|
|
20169
20333
|
assetCdnUrl,
|
|
20170
20334
|
onDepositSuccess,
|
|
20171
20335
|
onEvent,
|
|
20172
|
-
onDepositError
|
|
20336
|
+
onDepositError,
|
|
20337
|
+
prefilledAmountUsd
|
|
20173
20338
|
}) {
|
|
20174
20339
|
const { colors: colors2, fonts, components } = useTheme();
|
|
20175
20340
|
const [internalView, setInternalView] = (0, import_react23.useState)("providers");
|
|
@@ -20179,6 +20344,10 @@ function BankTransfer({
|
|
|
20179
20344
|
const [requestBase, setRequestBase] = (0, import_react23.useState)(null);
|
|
20180
20345
|
const [activeRequest, setActiveRequest] = (0, import_react23.useState)(null);
|
|
20181
20346
|
const [amount, setAmount] = (0, import_react23.useState)("");
|
|
20347
|
+
const [fiatExchangeRates, setFiatExchangeRates] = (0, import_react23.useState)({
|
|
20348
|
+
usd: 1
|
|
20349
|
+
});
|
|
20350
|
+
const providerSelectionRequestIdRef = (0, import_react23.useRef)(0);
|
|
20182
20351
|
const currentView = externalView ?? internalView;
|
|
20183
20352
|
const setView = (v) => {
|
|
20184
20353
|
setInternalView(v);
|
|
@@ -20228,7 +20397,38 @@ function BankTransfer({
|
|
|
20228
20397
|
() => destinationTokenSymbol?.toUpperCase() ?? defaultToken?.destination_token_metadata?.symbol?.toUpperCase() ?? defaultToken?.destination_currency?.toUpperCase() ?? "USDC",
|
|
20229
20398
|
[destinationTokenSymbol, defaultToken]
|
|
20230
20399
|
);
|
|
20231
|
-
const
|
|
20400
|
+
const resolvePrefilledSourceAmount = (0, import_react23.useCallback)(
|
|
20401
|
+
async (sourceCurrencyCode) => {
|
|
20402
|
+
const cleanedPrefilled = prefilledAmountUsd?.replace(/[^0-9.]/g, "") ?? "";
|
|
20403
|
+
if (!cleanedPrefilled) return "";
|
|
20404
|
+
const prefilledUsd = parseFloat(cleanedPrefilled);
|
|
20405
|
+
if (!Number.isFinite(prefilledUsd) || prefilledUsd <= 0) return "";
|
|
20406
|
+
const sourceCurrency2 = sourceCurrencyCode.toLowerCase();
|
|
20407
|
+
let rate = sourceCurrency2 === "usd" ? 1 : fiatExchangeRates[sourceCurrency2];
|
|
20408
|
+
if ((!rate || rate <= 0) && sourceCurrency2 !== "usd") {
|
|
20409
|
+
try {
|
|
20410
|
+
const response = await getFiatExchangeRates({}, publishableKey);
|
|
20411
|
+
if (response?.rates) {
|
|
20412
|
+
setFiatExchangeRates((prev) => ({
|
|
20413
|
+
...prev,
|
|
20414
|
+
...response.rates,
|
|
20415
|
+
usd: 1
|
|
20416
|
+
}));
|
|
20417
|
+
}
|
|
20418
|
+
const fetchedRate = response.rates?.[sourceCurrency2];
|
|
20419
|
+
if (Number.isFinite(fetchedRate) && fetchedRate > 0) {
|
|
20420
|
+
rate = fetchedRate;
|
|
20421
|
+
}
|
|
20422
|
+
} catch (error) {
|
|
20423
|
+
console.error("Error fetching fiat exchange rates for bank transfer:", error);
|
|
20424
|
+
}
|
|
20425
|
+
}
|
|
20426
|
+
if (!rate || rate <= 0) return sourceCurrency2 === "usd" ? cleanedPrefilled : "";
|
|
20427
|
+
return parseFloat((prefilledUsd * rate).toFixed(2)).toString();
|
|
20428
|
+
},
|
|
20429
|
+
[fiatExchangeRates, prefilledAmountUsd, publishableKey]
|
|
20430
|
+
);
|
|
20431
|
+
const handleProviderClick = async (provider) => {
|
|
20232
20432
|
if (!provider.enabled) return;
|
|
20233
20433
|
setSessionError(null);
|
|
20234
20434
|
if (!defaultToken) {
|
|
@@ -20247,6 +20447,7 @@ function BankTransfer({
|
|
|
20247
20447
|
});
|
|
20248
20448
|
return;
|
|
20249
20449
|
}
|
|
20450
|
+
const requestId = ++providerSelectionRequestIdRef.current;
|
|
20250
20451
|
setRequestBase({
|
|
20251
20452
|
service_provider: provider.service_provider,
|
|
20252
20453
|
country_code: (userIpInfo?.alpha2 || "DE").toUpperCase(),
|
|
@@ -20260,7 +20461,10 @@ function BankTransfer({
|
|
|
20260
20461
|
payment_method: provider.payment_methods[0]
|
|
20261
20462
|
});
|
|
20262
20463
|
setActiveProvider(provider);
|
|
20263
|
-
|
|
20464
|
+
const convertedPrefilled = await resolvePrefilledSourceAmount(provider.source_currency);
|
|
20465
|
+
if (requestId !== providerSelectionRequestIdRef.current) return;
|
|
20466
|
+
const hasPrefilledAmount = !!prefilledAmountUsd?.replace(/[^0-9.]/g, "");
|
|
20467
|
+
setAmount(hasPrefilledAmount ? convertedPrefilled : "100");
|
|
20264
20468
|
setView("amount");
|
|
20265
20469
|
};
|
|
20266
20470
|
const handleAmountChange = (value) => {
|
|
@@ -20358,7 +20562,7 @@ function BankTransfer({
|
|
|
20358
20562
|
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
20359
20563
|
"button",
|
|
20360
20564
|
{
|
|
20361
|
-
onClick: () => handleProviderClick(provider),
|
|
20565
|
+
onClick: () => void handleProviderClick(provider),
|
|
20362
20566
|
onMouseEnter: () => !disabled && setHoveredId(provider.service_provider),
|
|
20363
20567
|
onMouseLeave: () => setHoveredId(null),
|
|
20364
20568
|
disabled,
|
|
@@ -20927,9 +21131,9 @@ function TransferCryptoButton({
|
|
|
20927
21131
|
featuredTokens
|
|
20928
21132
|
}) {
|
|
20929
21133
|
const { colors: colors2, fonts, components } = useTheme();
|
|
20930
|
-
const [isHovered, setIsHovered] =
|
|
20931
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
20932
|
-
|
|
21134
|
+
const [isHovered, setIsHovered] = React72.useState(false);
|
|
21135
|
+
const [isTouchDevice, setIsTouchDevice] = React72.useState(false);
|
|
21136
|
+
React72.useEffect(() => {
|
|
20933
21137
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
20934
21138
|
}, []);
|
|
20935
21139
|
const sortedTokens = featuredTokens ? [...featuredTokens].sort((a, b) => a.position - b.position) : [];
|
|
@@ -21009,9 +21213,9 @@ function DepositWithCardButton({
|
|
|
21009
21213
|
paymentNetworks
|
|
21010
21214
|
}) {
|
|
21011
21215
|
const { colors: colors2, fonts, components } = useTheme();
|
|
21012
|
-
const [isHovered, setIsHovered] =
|
|
21013
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
21014
|
-
|
|
21216
|
+
const [isHovered, setIsHovered] = React82.useState(false);
|
|
21217
|
+
const [isTouchDevice, setIsTouchDevice] = React82.useState(false);
|
|
21218
|
+
React82.useEffect(() => {
|
|
21015
21219
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
21016
21220
|
}, []);
|
|
21017
21221
|
return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
@@ -21090,9 +21294,9 @@ function PayWithExchangeButton({
|
|
|
21090
21294
|
loading = false
|
|
21091
21295
|
}) {
|
|
21092
21296
|
const { colors: colors2, fonts, components } = useTheme();
|
|
21093
|
-
const [isHovered, setIsHovered] =
|
|
21094
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
21095
|
-
|
|
21297
|
+
const [isHovered, setIsHovered] = React92.useState(false);
|
|
21298
|
+
const [isTouchDevice, setIsTouchDevice] = React92.useState(false);
|
|
21299
|
+
React92.useEffect(() => {
|
|
21096
21300
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
21097
21301
|
}, []);
|
|
21098
21302
|
if (loading) {
|
|
@@ -21194,11 +21398,11 @@ var buttonVariants = cva(
|
|
|
21194
21398
|
}
|
|
21195
21399
|
}
|
|
21196
21400
|
);
|
|
21197
|
-
var Button =
|
|
21401
|
+
var Button = React102.forwardRef(
|
|
21198
21402
|
({ className, variant, size: size4, asChild = false, style, ...props }, ref) => {
|
|
21199
21403
|
const Comp = asChild ? Slot2 : "button";
|
|
21200
21404
|
const { components, fonts } = useTheme();
|
|
21201
|
-
const themeStyle =
|
|
21405
|
+
const themeStyle = React102.useMemo(() => {
|
|
21202
21406
|
const baseStyle = { ...style };
|
|
21203
21407
|
if (variant === "default" || !variant) {
|
|
21204
21408
|
baseStyle.backgroundColor = components.button.primaryBackground;
|
|
@@ -21233,9 +21437,9 @@ function ConnectExchangeButton({
|
|
|
21233
21437
|
connectedExchange
|
|
21234
21438
|
}) {
|
|
21235
21439
|
const { colors: colors2, fonts, components } = useTheme();
|
|
21236
|
-
const [isHovered, setIsHovered] =
|
|
21237
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
21238
|
-
|
|
21440
|
+
const [isHovered, setIsHovered] = React112.useState(false);
|
|
21441
|
+
const [isTouchDevice, setIsTouchDevice] = React112.useState(false);
|
|
21442
|
+
React112.useEffect(() => {
|
|
21239
21443
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
21240
21444
|
}, []);
|
|
21241
21445
|
const isConnected = connectedExchange != null;
|
|
@@ -21380,9 +21584,9 @@ function DepositTrackerButton({
|
|
|
21380
21584
|
badge
|
|
21381
21585
|
}) {
|
|
21382
21586
|
const { colors: colors2, fonts, components } = useTheme();
|
|
21383
|
-
const [isHovered, setIsHovered] =
|
|
21384
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
21385
|
-
|
|
21587
|
+
const [isHovered, setIsHovered] = React122.useState(false);
|
|
21588
|
+
const [isTouchDevice, setIsTouchDevice] = React122.useState(false);
|
|
21589
|
+
React122.useEffect(() => {
|
|
21386
21590
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
21387
21591
|
}, []);
|
|
21388
21592
|
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
@@ -21453,9 +21657,9 @@ function DepositTrackerButton({
|
|
|
21453
21657
|
}
|
|
21454
21658
|
function CashAppButton({ onClick, title, subtitle, iconUrl }) {
|
|
21455
21659
|
const { colors: colors2, fonts, components } = useTheme();
|
|
21456
|
-
const [isHovered, setIsHovered] =
|
|
21457
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
21458
|
-
|
|
21660
|
+
const [isHovered, setIsHovered] = React132.useState(false);
|
|
21661
|
+
const [isTouchDevice, setIsTouchDevice] = React132.useState(false);
|
|
21662
|
+
React132.useEffect(() => {
|
|
21459
21663
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
21460
21664
|
}, []);
|
|
21461
21665
|
return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
@@ -21539,9 +21743,9 @@ function AppleLogo({ className, style }) {
|
|
|
21539
21743
|
}
|
|
21540
21744
|
function ApplePayButton({ onClick, title, subtitle }) {
|
|
21541
21745
|
const { colors: colors2, fonts, components } = useTheme();
|
|
21542
|
-
const [isHovered, setIsHovered] =
|
|
21543
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
21544
|
-
|
|
21746
|
+
const [isHovered, setIsHovered] = React142.useState(false);
|
|
21747
|
+
const [isTouchDevice, setIsTouchDevice] = React142.useState(false);
|
|
21748
|
+
React142.useEffect(() => {
|
|
21545
21749
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
21546
21750
|
}, []);
|
|
21547
21751
|
return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
|
|
@@ -21603,9 +21807,9 @@ function BankTransferButton({
|
|
|
21603
21807
|
comingSoon = false
|
|
21604
21808
|
}) {
|
|
21605
21809
|
const { colors: colors2, fonts, components } = useTheme();
|
|
21606
|
-
const [isHovered, setIsHovered] =
|
|
21607
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
21608
|
-
|
|
21810
|
+
const [isHovered, setIsHovered] = React152.useState(false);
|
|
21811
|
+
const [isTouchDevice, setIsTouchDevice] = React152.useState(false);
|
|
21812
|
+
React152.useEffect(() => {
|
|
21609
21813
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
21610
21814
|
}, []);
|
|
21611
21815
|
return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
|
|
@@ -21854,18 +22058,18 @@ async function detectConnectedBrowserWallet(chainType) {
|
|
|
21854
22058
|
}
|
|
21855
22059
|
function useDetectedBrowserWallet(opts = {}) {
|
|
21856
22060
|
const { chainType, enabled = true, onDisconnect } = opts;
|
|
21857
|
-
const [wallet, setWallet] =
|
|
21858
|
-
const [isLoading, setIsLoading] =
|
|
21859
|
-
const [eip6963ProviderCount, setEip6963ProviderCount] =
|
|
21860
|
-
const onDisconnectRef =
|
|
22061
|
+
const [wallet, setWallet] = React162.useState(null);
|
|
22062
|
+
const [isLoading, setIsLoading] = React162.useState(enabled);
|
|
22063
|
+
const [eip6963ProviderCount, setEip6963ProviderCount] = React162.useState(0);
|
|
22064
|
+
const onDisconnectRef = React162.useRef(onDisconnect);
|
|
21861
22065
|
onDisconnectRef.current = onDisconnect;
|
|
21862
|
-
|
|
22066
|
+
React162.useEffect(() => {
|
|
21863
22067
|
const store = getEip6963Store();
|
|
21864
22068
|
if (!store) return;
|
|
21865
22069
|
setEip6963ProviderCount(store.getProviders().length);
|
|
21866
22070
|
return store.subscribe((providers) => setEip6963ProviderCount(providers.length));
|
|
21867
22071
|
}, []);
|
|
21868
|
-
|
|
22072
|
+
React162.useEffect(() => {
|
|
21869
22073
|
if (!enabled) {
|
|
21870
22074
|
setWallet(null);
|
|
21871
22075
|
setIsLoading(false);
|
|
@@ -22006,7 +22210,7 @@ async function disconnectInjectedBrowserWallet(wallet) {
|
|
|
22006
22210
|
);
|
|
22007
22211
|
}
|
|
22008
22212
|
function MetamaskIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
22009
|
-
const id =
|
|
22213
|
+
const id = React172.useId();
|
|
22010
22214
|
if (variant === "light" || variant === "dark") {
|
|
22011
22215
|
return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
|
|
22012
22216
|
"svg",
|
|
@@ -22127,7 +22331,7 @@ function MetamaskIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
22127
22331
|
);
|
|
22128
22332
|
}
|
|
22129
22333
|
function PhantomIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
22130
|
-
const id =
|
|
22334
|
+
const id = React182.useId();
|
|
22131
22335
|
if (variant === "light") {
|
|
22132
22336
|
return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
|
|
22133
22337
|
"svg",
|
|
@@ -22194,7 +22398,7 @@ function PhantomIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
22194
22398
|
);
|
|
22195
22399
|
}
|
|
22196
22400
|
function CoinbaseIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
22197
|
-
const id =
|
|
22401
|
+
const id = React192.useId();
|
|
22198
22402
|
if (variant === "light") {
|
|
22199
22403
|
return /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
|
|
22200
22404
|
"svg",
|
|
@@ -22274,7 +22478,7 @@ function CoinbaseIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
22274
22478
|
);
|
|
22275
22479
|
}
|
|
22276
22480
|
function RabbyIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
22277
|
-
const id =
|
|
22481
|
+
const id = React202.useId();
|
|
22278
22482
|
if (variant === "light") {
|
|
22279
22483
|
return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
|
|
22280
22484
|
"svg",
|
|
@@ -22621,7 +22825,7 @@ function RabbyIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
22621
22825
|
);
|
|
22622
22826
|
}
|
|
22623
22827
|
function RainbowIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
22624
|
-
const id =
|
|
22828
|
+
const id = React212.useId();
|
|
22625
22829
|
if (variant === "light") {
|
|
22626
22830
|
return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
|
|
22627
22831
|
"svg",
|
|
@@ -23035,7 +23239,7 @@ function RainbowIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
23035
23239
|
);
|
|
23036
23240
|
}
|
|
23037
23241
|
function TrustIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
23038
|
-
const id =
|
|
23242
|
+
const id = React222.useId();
|
|
23039
23243
|
if (variant === "light") {
|
|
23040
23244
|
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
23041
23245
|
"svg",
|
|
@@ -23118,7 +23322,7 @@ function TrustIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
23118
23322
|
);
|
|
23119
23323
|
}
|
|
23120
23324
|
function OkxIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
23121
|
-
const id =
|
|
23325
|
+
const id = React232.useId();
|
|
23122
23326
|
if (variant === "light") {
|
|
23123
23327
|
return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
23124
23328
|
"svg",
|
|
@@ -23173,7 +23377,7 @@ function OkxIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
23173
23377
|
);
|
|
23174
23378
|
}
|
|
23175
23379
|
function GlowIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
23176
|
-
const id =
|
|
23380
|
+
const id = React242.useId();
|
|
23177
23381
|
if (variant === "light") {
|
|
23178
23382
|
return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
|
|
23179
23383
|
"svg",
|
|
@@ -23274,7 +23478,7 @@ function GlowIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
23274
23478
|
);
|
|
23275
23479
|
}
|
|
23276
23480
|
function BackpackIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
23277
|
-
const id =
|
|
23481
|
+
const id = React252.useId();
|
|
23278
23482
|
if (variant === "light") {
|
|
23279
23483
|
return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
23280
23484
|
"svg",
|
|
@@ -23347,7 +23551,7 @@ function BackpackIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
23347
23551
|
);
|
|
23348
23552
|
}
|
|
23349
23553
|
function SolflareIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
23350
|
-
const id =
|
|
23554
|
+
const id = React262.useId();
|
|
23351
23555
|
if (variant === "light") {
|
|
23352
23556
|
return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
|
|
23353
23557
|
"svg",
|
|
@@ -23414,7 +23618,7 @@ function SolflareIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
23414
23618
|
);
|
|
23415
23619
|
}
|
|
23416
23620
|
function EthereumIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
23417
|
-
const id =
|
|
23621
|
+
const id = React272.useId();
|
|
23418
23622
|
if (variant === "light") {
|
|
23419
23623
|
return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
|
|
23420
23624
|
"svg",
|
|
@@ -23538,7 +23742,7 @@ function EthereumIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
|
23538
23742
|
);
|
|
23539
23743
|
}
|
|
23540
23744
|
function SolanaIcon({ size: size4 = 24, className, variant = "color" }) {
|
|
23541
|
-
const id =
|
|
23745
|
+
const id = React282.useId();
|
|
23542
23746
|
if (variant === "light") {
|
|
23543
23747
|
return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
|
|
23544
23748
|
"svg",
|
|
@@ -23783,19 +23987,19 @@ function BrowserWalletButton({
|
|
|
23783
23987
|
subtitle = i18n2.depositModal.browserWallet.subtitle
|
|
23784
23988
|
}) {
|
|
23785
23989
|
const { colors: colors2, fonts, components } = useTheme();
|
|
23786
|
-
const [isHovered, setIsHovered] =
|
|
23787
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
23990
|
+
const [isHovered, setIsHovered] = React292.useState(false);
|
|
23991
|
+
const [isTouchDevice, setIsTouchDevice] = React292.useState(false);
|
|
23788
23992
|
const { wallet, isLoading, setWallet } = useDetectedBrowserWallet({ chainType, onDisconnect });
|
|
23789
|
-
const [isConnecting, setIsConnecting] =
|
|
23790
|
-
const [balanceText, setBalanceText] =
|
|
23791
|
-
const [isLoadingBalance, setIsLoadingBalance] =
|
|
23792
|
-
const [isDisconnecting, setIsDisconnecting] =
|
|
23793
|
-
const onDisconnectRef =
|
|
23993
|
+
const [isConnecting, setIsConnecting] = React292.useState(false);
|
|
23994
|
+
const [balanceText, setBalanceText] = React292.useState(null);
|
|
23995
|
+
const [isLoadingBalance, setIsLoadingBalance] = React292.useState(false);
|
|
23996
|
+
const [isDisconnecting, setIsDisconnecting] = React292.useState(false);
|
|
23997
|
+
const onDisconnectRef = React292.useRef(onDisconnect);
|
|
23794
23998
|
onDisconnectRef.current = onDisconnect;
|
|
23795
|
-
|
|
23999
|
+
React292.useEffect(() => {
|
|
23796
24000
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
23797
24001
|
}, []);
|
|
23798
|
-
|
|
24002
|
+
React292.useEffect(() => {
|
|
23799
24003
|
if (!wallet || !publishableKey) {
|
|
23800
24004
|
setBalanceText(null);
|
|
23801
24005
|
return;
|
|
@@ -23922,7 +24126,7 @@ function BrowserWalletButton({
|
|
|
23922
24126
|
border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
|
|
23923
24127
|
};
|
|
23924
24128
|
const sortedWallets = featuredWallets ? [...featuredWallets].sort((a, b) => a.position - b.position) : [];
|
|
23925
|
-
const walletIconBlock = wallet ? WALLET_ICON_COMPONENTS[wallet.icon] ?
|
|
24129
|
+
const walletIconBlock = wallet ? WALLET_ICON_COMPONENTS[wallet.icon] ? React292.createElement(WALLET_ICON_COMPONENTS[wallet.icon], {
|
|
23926
24130
|
size: 36,
|
|
23927
24131
|
className: "uf-rounded-lg",
|
|
23928
24132
|
variant: "color"
|
|
@@ -24073,9 +24277,9 @@ function StripeLinkButton({
|
|
|
24073
24277
|
iconUrl
|
|
24074
24278
|
}) {
|
|
24075
24279
|
const { colors: colors2, fonts, components } = useTheme();
|
|
24076
|
-
const [isHovered, setIsHovered] =
|
|
24077
|
-
const [isTouchDevice, setIsTouchDevice] =
|
|
24078
|
-
|
|
24280
|
+
const [isHovered, setIsHovered] = React302.useState(false);
|
|
24281
|
+
const [isTouchDevice, setIsTouchDevice] = React302.useState(false);
|
|
24282
|
+
React302.useEffect(() => {
|
|
24079
24283
|
setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
|
|
24080
24284
|
}, []);
|
|
24081
24285
|
return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)(
|
|
@@ -24561,6 +24765,8 @@ function PayWithStripeLink({
|
|
|
24561
24765
|
destinationChainType,
|
|
24562
24766
|
destinationChainId,
|
|
24563
24767
|
destinationTokenAddress,
|
|
24768
|
+
countryCode,
|
|
24769
|
+
subdivisionCode,
|
|
24564
24770
|
wallets: externalWallets,
|
|
24565
24771
|
email: emailProp,
|
|
24566
24772
|
iconUrl,
|
|
@@ -24955,7 +25161,9 @@ function PayWithStripeLink({
|
|
|
24955
25161
|
{
|
|
24956
25162
|
tokenAddress: destinationTokenAddress,
|
|
24957
25163
|
chainId: destinationChainId,
|
|
24958
|
-
chainType: destinationChainType
|
|
25164
|
+
chainType: destinationChainType,
|
|
25165
|
+
countryCode,
|
|
25166
|
+
subdivisionCode
|
|
24959
25167
|
},
|
|
24960
25168
|
publishableKey
|
|
24961
25169
|
).then((token) => {
|
|
@@ -24974,7 +25182,14 @@ function PayWithStripeLink({
|
|
|
24974
25182
|
return () => {
|
|
24975
25183
|
cancelled = true;
|
|
24976
25184
|
};
|
|
24977
|
-
}, [
|
|
25185
|
+
}, [
|
|
25186
|
+
publishableKey,
|
|
25187
|
+
destinationTokenAddress,
|
|
25188
|
+
destinationChainId,
|
|
25189
|
+
destinationChainType,
|
|
25190
|
+
countryCode,
|
|
25191
|
+
subdivisionCode
|
|
25192
|
+
]);
|
|
24978
25193
|
const destinationCurrency = stripeDestCurrency;
|
|
24979
25194
|
const authInnerRef = (0, import_react24.useRef)(null);
|
|
24980
25195
|
const paymentInnerRef = (0, import_react24.useRef)(null);
|
|
@@ -26687,10 +26902,16 @@ function PayWithStripeLink({
|
|
|
26687
26902
|
return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
|
|
26688
26903
|
"div",
|
|
26689
26904
|
{
|
|
26690
|
-
className: "uf-flex uf-flex-col uf-py-4 uf-overflow-y-auto uf-max-h-[70vh]",
|
|
26905
|
+
className: "uf-flex uf-flex-col uf-py-4 uf-overflow-y-auto uf-overflow-x-hidden uf-max-h-[70vh]",
|
|
26691
26906
|
style: { backgroundColor: colors2.background },
|
|
26692
26907
|
children: [
|
|
26693
|
-
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
26908
|
+
/* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
26909
|
+
"div",
|
|
26910
|
+
{
|
|
26911
|
+
ref: paymentMountRef,
|
|
26912
|
+
className: "uf-w-full uf-flex-1 uf-overflow-y-auto uf-overflow-x-hidden"
|
|
26913
|
+
}
|
|
26914
|
+
),
|
|
26694
26915
|
!stripePaymentUIReady && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "uf-flex uf-items-center uf-justify-center uf-py-8", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(LoaderCircle, { className: "uf-w-8 uf-h-8 uf-animate-spin", style: { color: colors2.primary } }) }),
|
|
26695
26916
|
error && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
26696
26917
|
"div",
|
|
@@ -26708,7 +26929,7 @@ function PayWithStripeLink({
|
|
|
26708
26929
|
return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(
|
|
26709
26930
|
"div",
|
|
26710
26931
|
{
|
|
26711
|
-
className: "uf-flex uf-flex-col uf-py-4 uf-overflow-y-auto uf-max-h-[70vh]",
|
|
26932
|
+
className: "uf-flex uf-flex-col uf-py-4 uf-overflow-y-auto uf-overflow-x-hidden uf-max-h-[70vh]",
|
|
26712
26933
|
style: { backgroundColor: colors2.background },
|
|
26713
26934
|
children: [
|
|
26714
26935
|
displayPaymentTokens.length === 0 && !loading && /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { className: "uf-px-1 uf-mb-3 uf-text-center", children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
|
|
@@ -27818,17 +28039,30 @@ function PayWithStripeLink({
|
|
|
27818
28039
|
}
|
|
27819
28040
|
function useProjectConfig({
|
|
27820
28041
|
publishableKey,
|
|
27821
|
-
enabled = true
|
|
28042
|
+
enabled = true,
|
|
28043
|
+
countryCode,
|
|
28044
|
+
subdivisionCode
|
|
27822
28045
|
}) {
|
|
27823
|
-
const {
|
|
27824
|
-
|
|
27825
|
-
|
|
28046
|
+
const {
|
|
28047
|
+
data: projectConfig,
|
|
28048
|
+
isLoading,
|
|
28049
|
+
error
|
|
28050
|
+
} = (0, import_react_query11.useQuery)({
|
|
28051
|
+
// Country is part of the key so a region change refetches the region-aware
|
|
28052
|
+
// config. Omitted when undefined so callers that don't pass a country keep
|
|
28053
|
+
// sharing the base cache entry.
|
|
28054
|
+
queryKey: countryCode ? ["unifold", "projectConfig", publishableKey, countryCode, subdivisionCode ?? null] : ["unifold", "projectConfig", publishableKey],
|
|
28055
|
+
queryFn: () => getProjectConfig(publishableKey, countryCode ? { countryCode, subdivisionCode } : void 0),
|
|
27826
28056
|
enabled,
|
|
28057
|
+
// Keep the previous (e.g. no-country) config visible while the region-aware
|
|
28058
|
+
// config refetches after the country resolves, so unrelated config-driven
|
|
28059
|
+
// UI doesn't flash back to defaults.
|
|
28060
|
+
placeholderData: import_react_query11.keepPreviousData,
|
|
27827
28061
|
staleTime: 1e3 * 60 * 30,
|
|
27828
28062
|
refetchOnMount: true,
|
|
27829
28063
|
refetchOnWindowFocus: true
|
|
27830
28064
|
});
|
|
27831
|
-
return { projectConfig, isLoading };
|
|
28065
|
+
return { projectConfig, isLoading, error: error ?? null };
|
|
27832
28066
|
}
|
|
27833
28067
|
function useSupportedDepositTokens(publishableKey, options) {
|
|
27834
28068
|
const hasDestination = options?.destination_token_address && options?.destination_chain_id && options?.destination_chain_type;
|
|
@@ -27841,7 +28075,7 @@ function useSupportedDepositTokens(publishableKey, options) {
|
|
|
27841
28075
|
...options?.product_type ? { product_type: options.product_type } : {}
|
|
27842
28076
|
};
|
|
27843
28077
|
const hasFilteredOptions = Object.keys(filteredOptions).length > 0;
|
|
27844
|
-
return (0,
|
|
28078
|
+
return (0, import_react_query12.useQuery)({
|
|
27845
28079
|
queryKey: [
|
|
27846
28080
|
"unifold",
|
|
27847
28081
|
"supportedDepositTokens",
|
|
@@ -27865,7 +28099,7 @@ function useIntegrationTransferDefaultToken({
|
|
|
27865
28099
|
publishableKey,
|
|
27866
28100
|
enabled = true
|
|
27867
28101
|
}) {
|
|
27868
|
-
return (0,
|
|
28102
|
+
return (0, import_react_query13.useQuery)({
|
|
27869
28103
|
queryKey: [
|
|
27870
28104
|
"unifold",
|
|
27871
28105
|
"integrationTransferDefaultToken",
|
|
@@ -27931,7 +28165,8 @@ function CoinbaseConnect({
|
|
|
27931
28165
|
defaultSourceChainType,
|
|
27932
28166
|
defaultSourceChainId,
|
|
27933
28167
|
defaultSourceTokenAddress,
|
|
27934
|
-
defaultSourceSymbol
|
|
28168
|
+
defaultSourceSymbol,
|
|
28169
|
+
prefilledAmountUsd
|
|
27935
28170
|
}) {
|
|
27936
28171
|
const { colors: colors2, fonts, components } = useTheme();
|
|
27937
28172
|
const { projectConfig } = useProjectConfig({ publishableKey });
|
|
@@ -28254,7 +28489,8 @@ function CoinbaseConnect({
|
|
|
28254
28489
|
};
|
|
28255
28490
|
const handleSelectAsset = (asset) => {
|
|
28256
28491
|
setSelectedAsset(asset);
|
|
28257
|
-
|
|
28492
|
+
const cleanedPrefilled = prefilledAmountUsd?.replace(/[^0-9.]/g, "") ?? "";
|
|
28493
|
+
setSendAmount(cleanedPrefilled);
|
|
28258
28494
|
transitionTo("enter_amount");
|
|
28259
28495
|
};
|
|
28260
28496
|
const handleCreateTransfer = async () => {
|
|
@@ -29842,7 +30078,7 @@ function useExchanges({
|
|
|
29842
30078
|
publishableKey,
|
|
29843
30079
|
enabled = true
|
|
29844
30080
|
}) {
|
|
29845
|
-
const { data: exchanges = [], isLoading } = (0,
|
|
30081
|
+
const { data: exchanges = [], isLoading } = (0, import_react_query14.useQuery)({
|
|
29846
30082
|
queryKey: ["unifold", "exchanges", publishableKey],
|
|
29847
30083
|
queryFn: () => getExchanges(void 0, publishableKey).then((res) => res.data),
|
|
29848
30084
|
enabled,
|
|
@@ -29856,7 +30092,7 @@ function useApplePayProviders({
|
|
|
29856
30092
|
publishableKey,
|
|
29857
30093
|
enabled = true
|
|
29858
30094
|
}) {
|
|
29859
|
-
const { data: providers, isLoading } = (0,
|
|
30095
|
+
const { data: providers, isLoading } = (0, import_react_query15.useQuery)({
|
|
29860
30096
|
queryKey: ["unifold", "applePayProviders", publishableKey],
|
|
29861
30097
|
queryFn: () => getApplePayProviders(publishableKey),
|
|
29862
30098
|
enabled,
|
|
@@ -29867,44 +30103,28 @@ function useApplePayProviders({
|
|
|
29867
30103
|
return { providers, isLoading };
|
|
29868
30104
|
}
|
|
29869
30105
|
function useAllowedCountry(publishableKey) {
|
|
30106
|
+
const { userIpInfo, isLoading: isIpLoading, error: ipError } = useUserIp2();
|
|
29870
30107
|
const {
|
|
29871
|
-
|
|
29872
|
-
isLoading: isIpLoading,
|
|
29873
|
-
error: ipError
|
|
29874
|
-
} = (0, import_react_query15.useQuery)({
|
|
29875
|
-
queryKey: ["unifold", "ipAddress"],
|
|
29876
|
-
queryFn: () => getIpAddress(),
|
|
29877
|
-
refetchOnMount: false,
|
|
29878
|
-
refetchOnReconnect: true,
|
|
29879
|
-
refetchOnWindowFocus: false,
|
|
29880
|
-
staleTime: 1e3 * 60 * 60,
|
|
29881
|
-
// 1 hour
|
|
29882
|
-
gcTime: 1e3 * 60 * 60 * 24
|
|
29883
|
-
// 24 hours
|
|
29884
|
-
});
|
|
29885
|
-
const {
|
|
29886
|
-
data: configData,
|
|
30108
|
+
projectConfig,
|
|
29887
30109
|
isLoading: isConfigLoading,
|
|
29888
30110
|
error: configError
|
|
29889
|
-
} = (
|
|
29890
|
-
|
|
29891
|
-
|
|
29892
|
-
|
|
29893
|
-
|
|
29894
|
-
|
|
29895
|
-
|
|
29896
|
-
|
|
29897
|
-
gcTime: 1e3 * 60 * 60
|
|
29898
|
-
// 1 hour
|
|
30111
|
+
} = useProjectConfig({
|
|
30112
|
+
publishableKey,
|
|
30113
|
+
// Wait for the IP so we issue a single country-aware config request rather
|
|
30114
|
+
// than a country-less fetch followed by a country-aware refetch. Shares the
|
|
30115
|
+
// query key with DepositModal's useProjectConfig, so they dedupe.
|
|
30116
|
+
enabled: !isIpLoading,
|
|
30117
|
+
countryCode: userIpInfo?.alpha2,
|
|
30118
|
+
subdivisionCode: userIpInfo?.subdivisionCode ?? void 0
|
|
29899
30119
|
});
|
|
29900
30120
|
const isLoading = isIpLoading || isConfigLoading;
|
|
29901
30121
|
const error = ipError || configError || null;
|
|
30122
|
+
const userSubdivision = userIpInfo?.subdivisionCode || userIpInfo?.state || "";
|
|
29902
30123
|
let isAllowed = null;
|
|
29903
|
-
if (
|
|
29904
|
-
const blockedCodes =
|
|
29905
|
-
const blockedSubdivisions =
|
|
29906
|
-
const userCountryUpper =
|
|
29907
|
-
const userSubdivision = ipData.subdivision_code || ipData.state || "";
|
|
30124
|
+
if (userIpInfo && projectConfig) {
|
|
30125
|
+
const blockedCodes = projectConfig.blocked_country_codes || [];
|
|
30126
|
+
const blockedSubdivisions = projectConfig.blocked_country_subdivisions || [];
|
|
30127
|
+
const userCountryUpper = userIpInfo.alpha2.toUpperCase();
|
|
29908
30128
|
const userSubdivisionUpper = userSubdivision.toUpperCase();
|
|
29909
30129
|
const isCountryBlocked = blockedCodes.some((code) => code.toUpperCase() === userCountryUpper);
|
|
29910
30130
|
const isSubdivisionBlocked = blockedSubdivisions.some((entry) => {
|
|
@@ -29913,12 +30133,11 @@ function useAllowedCountry(publishableKey) {
|
|
|
29913
30133
|
});
|
|
29914
30134
|
isAllowed = !isCountryBlocked && !isSubdivisionBlocked;
|
|
29915
30135
|
}
|
|
29916
|
-
const subdivisionCode = ipData?.subdivision_code || ipData?.state || "" || null;
|
|
29917
30136
|
return {
|
|
29918
30137
|
isAllowed,
|
|
29919
|
-
alpha2:
|
|
29920
|
-
country:
|
|
29921
|
-
subdivisionCode,
|
|
30138
|
+
alpha2: userIpInfo?.alpha2 ?? null,
|
|
30139
|
+
country: userIpInfo?.country ?? null,
|
|
30140
|
+
subdivisionCode: userSubdivision || null,
|
|
29922
30141
|
isLoading,
|
|
29923
30142
|
error
|
|
29924
30143
|
};
|
|
@@ -29982,7 +30201,7 @@ function ThemeStyleInjector({
|
|
|
29982
30201
|
className
|
|
29983
30202
|
}) {
|
|
29984
30203
|
const { colors: colors2, fonts, mode } = useTheme();
|
|
29985
|
-
const cssVars =
|
|
30204
|
+
const cssVars = React322.useMemo(() => {
|
|
29986
30205
|
const hexToHSL = (hex) => {
|
|
29987
30206
|
hex = hex.replace("#", "");
|
|
29988
30207
|
const r2 = parseInt(hex.slice(0, 2), 16) / 255;
|
|
@@ -30042,7 +30261,7 @@ function ThemeStyleInjector({
|
|
|
30042
30261
|
...fonts.regular ? { "--uf-font-family": fonts.regular } : {}
|
|
30043
30262
|
};
|
|
30044
30263
|
}, [colors2, fonts.regular]);
|
|
30045
|
-
|
|
30264
|
+
React322.useEffect(() => {
|
|
30046
30265
|
if (typeof document === "undefined") return;
|
|
30047
30266
|
if (fonts.regular) {
|
|
30048
30267
|
document.documentElement.style.setProperty("--uf-font-family", fonts.regular);
|
|
@@ -31187,14 +31406,14 @@ function useCopyAddress() {
|
|
|
31187
31406
|
return { copied, handleCopy };
|
|
31188
31407
|
}
|
|
31189
31408
|
var TooltipProvider2 = Provider;
|
|
31190
|
-
var TooltipContext =
|
|
31409
|
+
var TooltipContext = React332.createContext({
|
|
31191
31410
|
open: false,
|
|
31192
31411
|
onOpenChange: () => {
|
|
31193
31412
|
}
|
|
31194
31413
|
});
|
|
31195
|
-
var TooltipTrigger2 =
|
|
31196
|
-
const { open, onOpenChange } =
|
|
31197
|
-
const handleClick =
|
|
31414
|
+
var TooltipTrigger2 = React332.forwardRef(({ onClick, ...props }, ref) => {
|
|
31415
|
+
const { open, onOpenChange } = React332.useContext(TooltipContext);
|
|
31416
|
+
const handleClick = React332.useCallback(
|
|
31198
31417
|
(e) => {
|
|
31199
31418
|
onOpenChange(!open);
|
|
31200
31419
|
onClick?.(e);
|
|
@@ -31204,7 +31423,7 @@ var TooltipTrigger2 = React322.forwardRef(({ onClick, ...props }, ref) => {
|
|
|
31204
31423
|
return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Trigger, { ref, onClick: handleClick, ...props });
|
|
31205
31424
|
});
|
|
31206
31425
|
TooltipTrigger2.displayName = Trigger.displayName;
|
|
31207
|
-
var TooltipContent2 =
|
|
31426
|
+
var TooltipContent2 = React332.forwardRef(({ className, sideOffset = 4, ...props }, ref) => {
|
|
31208
31427
|
const { themeClass, colors: colors2 } = useTheme();
|
|
31209
31428
|
return /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(Portal3, { children: /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
|
|
31210
31429
|
Content22,
|
|
@@ -31314,6 +31533,7 @@ function TransferCryptoSingleInput({
|
|
|
31314
31533
|
onDepositError,
|
|
31315
31534
|
wallets: externalWallets,
|
|
31316
31535
|
onSourceTokenChange,
|
|
31536
|
+
prefilledAmountUsd,
|
|
31317
31537
|
checkoutQuote,
|
|
31318
31538
|
isCheckoutQuoteLoading = false,
|
|
31319
31539
|
persistCheckingIndicator = false,
|
|
@@ -31457,6 +31677,22 @@ function TransferCryptoSingleInput({
|
|
|
31457
31677
|
const maxSlippage = currentChainFromBackend?.max_slippage_percent ?? 0.25;
|
|
31458
31678
|
const processingTime = currentChainFromBackend?.estimated_processing_time ?? null;
|
|
31459
31679
|
const minDepositUsd = currentChainFromBackend?.minimum_deposit_amount_usd ?? 3;
|
|
31680
|
+
const parsedPrefilledUsd = (0, import_react27.useMemo)(() => {
|
|
31681
|
+
const value = parseFloat(prefilledAmountUsd ?? "");
|
|
31682
|
+
return Number.isFinite(value) && value > 0 ? value : null;
|
|
31683
|
+
}, [prefilledAmountUsd]);
|
|
31684
|
+
const effectivePrefilledUsd = (0, import_react27.useMemo)(() => {
|
|
31685
|
+
if (parsedPrefilledUsd === null) return null;
|
|
31686
|
+
return Math.max(parsedPrefilledUsd, minDepositUsd);
|
|
31687
|
+
}, [parsedPrefilledUsd, minDepositUsd]);
|
|
31688
|
+
const prefillDisplay = (0, import_react27.useMemo)(() => {
|
|
31689
|
+
if (effectivePrefilledUsd === null) return null;
|
|
31690
|
+
const usdLabel = `$${effectivePrefilledUsd.toFixed(2)}`;
|
|
31691
|
+
if (selectedToken?.is_stablecoin) {
|
|
31692
|
+
return `${effectivePrefilledUsd.toFixed(2)} ${selectedToken.symbol} (${usdLabel})`;
|
|
31693
|
+
}
|
|
31694
|
+
return `${usdLabel} USD`;
|
|
31695
|
+
}, [effectivePrefilledUsd, selectedToken]);
|
|
31460
31696
|
return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(TooltipProvider2, { delayDuration: 0, skipDelayDuration: 0, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
|
|
31461
31697
|
"div",
|
|
31462
31698
|
{
|
|
@@ -31583,7 +31819,7 @@ function TransferCryptoSingleInput({
|
|
|
31583
31819
|
/* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { children: "Retrying automatically every 5 seconds..." })
|
|
31584
31820
|
] })
|
|
31585
31821
|
] }),
|
|
31586
|
-
(checkoutQuote || isCheckoutQuoteLoading) && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
|
|
31822
|
+
(checkoutQuote || isCheckoutQuoteLoading || prefillDisplay) && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
|
|
31587
31823
|
"div",
|
|
31588
31824
|
{
|
|
31589
31825
|
className: "uf-rounded-xl uf-px-3 uf-py-2 uf-flex uf-items-center uf-justify-between",
|
|
@@ -31627,6 +31863,13 @@ function TransferCryptoSingleInput({
|
|
|
31627
31863
|
)
|
|
31628
31864
|
]
|
|
31629
31865
|
}
|
|
31866
|
+
) : prefillDisplay ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
|
|
31867
|
+
"span",
|
|
31868
|
+
{
|
|
31869
|
+
className: "uf-text-sm uf-font-semibold",
|
|
31870
|
+
style: { color: components.card.titleColor, fontFamily: fonts.semibold },
|
|
31871
|
+
children: prefillDisplay
|
|
31872
|
+
}
|
|
31630
31873
|
) : /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
|
|
31631
31874
|
"div",
|
|
31632
31875
|
{
|
|
@@ -31956,7 +32199,7 @@ function TransferCryptoSingleInput({
|
|
|
31956
32199
|
}
|
|
31957
32200
|
var Select2 = Root23;
|
|
31958
32201
|
var SelectValue2 = Value;
|
|
31959
|
-
var SelectTrigger2 =
|
|
32202
|
+
var SelectTrigger2 = React342.forwardRef(({ className, style, children, ...props }, ref) => {
|
|
31960
32203
|
const { components } = useTheme();
|
|
31961
32204
|
return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
|
|
31962
32205
|
Trigger2,
|
|
@@ -31980,7 +32223,7 @@ var SelectTrigger2 = React332.forwardRef(({ className, style, children, ...props
|
|
|
31980
32223
|
);
|
|
31981
32224
|
});
|
|
31982
32225
|
SelectTrigger2.displayName = Trigger2.displayName;
|
|
31983
|
-
var SelectScrollUpButton2 =
|
|
32226
|
+
var SelectScrollUpButton2 = React342.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
31984
32227
|
ScrollUpButton,
|
|
31985
32228
|
{
|
|
31986
32229
|
ref,
|
|
@@ -31990,7 +32233,7 @@ var SelectScrollUpButton2 = React332.forwardRef(({ className, ...props }, ref) =
|
|
|
31990
32233
|
}
|
|
31991
32234
|
));
|
|
31992
32235
|
SelectScrollUpButton2.displayName = ScrollUpButton.displayName;
|
|
31993
|
-
var SelectScrollDownButton2 =
|
|
32236
|
+
var SelectScrollDownButton2 = React342.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
31994
32237
|
ScrollDownButton,
|
|
31995
32238
|
{
|
|
31996
32239
|
ref,
|
|
@@ -32000,7 +32243,7 @@ var SelectScrollDownButton2 = React332.forwardRef(({ className, ...props }, ref)
|
|
|
32000
32243
|
}
|
|
32001
32244
|
));
|
|
32002
32245
|
SelectScrollDownButton2.displayName = ScrollDownButton.displayName;
|
|
32003
|
-
var SelectContent2 =
|
|
32246
|
+
var SelectContent2 = React342.forwardRef(({ className, style, children, position = "popper", ...props }, ref) => {
|
|
32004
32247
|
const { themeClass, colors: colors2, components } = useTheme();
|
|
32005
32248
|
return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Portal4, { children: /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
|
|
32006
32249
|
Content23,
|
|
@@ -32038,7 +32281,7 @@ var SelectContent2 = React332.forwardRef(({ className, style, children, position
|
|
|
32038
32281
|
) });
|
|
32039
32282
|
});
|
|
32040
32283
|
SelectContent2.displayName = Content23.displayName;
|
|
32041
|
-
var SelectLabel2 =
|
|
32284
|
+
var SelectLabel2 = React342.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
32042
32285
|
Label,
|
|
32043
32286
|
{
|
|
32044
32287
|
ref,
|
|
@@ -32047,7 +32290,7 @@ var SelectLabel2 = React332.forwardRef(({ className, ...props }, ref) => /* @__P
|
|
|
32047
32290
|
}
|
|
32048
32291
|
));
|
|
32049
32292
|
SelectLabel2.displayName = Label.displayName;
|
|
32050
|
-
var SelectItem2 =
|
|
32293
|
+
var SelectItem2 = React342.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
|
|
32051
32294
|
Item,
|
|
32052
32295
|
{
|
|
32053
32296
|
ref,
|
|
@@ -32063,7 +32306,7 @@ var SelectItem2 = React332.forwardRef(({ className, children, ...props }, ref) =
|
|
|
32063
32306
|
}
|
|
32064
32307
|
));
|
|
32065
32308
|
SelectItem2.displayName = Item.displayName;
|
|
32066
|
-
var SelectSeparator2 =
|
|
32309
|
+
var SelectSeparator2 = React342.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
|
|
32067
32310
|
Separator,
|
|
32068
32311
|
{
|
|
32069
32312
|
ref,
|
|
@@ -32091,6 +32334,7 @@ function TransferCryptoDoubleInput({
|
|
|
32091
32334
|
defaultSourceChainId,
|
|
32092
32335
|
defaultSourceTokenAddress,
|
|
32093
32336
|
defaultSourceSymbol,
|
|
32337
|
+
prefilledAmountUsd,
|
|
32094
32338
|
depositConfirmationMode = "auto_ui",
|
|
32095
32339
|
onExecutionsChange,
|
|
32096
32340
|
onDepositSuccess,
|
|
@@ -32215,6 +32459,22 @@ function TransferCryptoDoubleInput({
|
|
|
32215
32459
|
const maxSlippage = currentChainFromBackend?.max_slippage_percent ?? 0.25;
|
|
32216
32460
|
const processingTime = currentChainFromBackend?.estimated_processing_time ?? null;
|
|
32217
32461
|
const minDepositUsd = currentChainFromBackend?.minimum_deposit_amount_usd ?? 3;
|
|
32462
|
+
const parsedPrefilledUsd = (0, import_react32.useMemo)(() => {
|
|
32463
|
+
const value = parseFloat(prefilledAmountUsd ?? "");
|
|
32464
|
+
return Number.isFinite(value) && value > 0 ? value : null;
|
|
32465
|
+
}, [prefilledAmountUsd]);
|
|
32466
|
+
const effectivePrefilledUsd = (0, import_react32.useMemo)(() => {
|
|
32467
|
+
if (parsedPrefilledUsd === null) return null;
|
|
32468
|
+
return Math.max(parsedPrefilledUsd, minDepositUsd);
|
|
32469
|
+
}, [parsedPrefilledUsd, minDepositUsd]);
|
|
32470
|
+
const prefillDisplay = (0, import_react32.useMemo)(() => {
|
|
32471
|
+
if (effectivePrefilledUsd === null) return null;
|
|
32472
|
+
const usdLabel = `$${effectivePrefilledUsd.toFixed(2)}`;
|
|
32473
|
+
if (selectedToken?.is_stablecoin) {
|
|
32474
|
+
return `${effectivePrefilledUsd.toFixed(2)} ${selectedToken.symbol} (${usdLabel})`;
|
|
32475
|
+
}
|
|
32476
|
+
return `${usdLabel} USD`;
|
|
32477
|
+
}, [effectivePrefilledUsd, selectedToken]);
|
|
32218
32478
|
const renderTokenItem = (tokenData) => {
|
|
32219
32479
|
return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
|
|
32220
32480
|
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
@@ -32395,6 +32655,35 @@ function TransferCryptoDoubleInput({
|
|
|
32395
32655
|
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { children: "Retrying automatically every 5 seconds..." })
|
|
32396
32656
|
] })
|
|
32397
32657
|
] }),
|
|
32658
|
+
prefillDisplay && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
|
|
32659
|
+
"div",
|
|
32660
|
+
{
|
|
32661
|
+
className: "uf-rounded-xl uf-px-3 uf-py-2 uf-flex uf-items-center uf-justify-between",
|
|
32662
|
+
style: {
|
|
32663
|
+
backgroundColor: components.card.backgroundColor,
|
|
32664
|
+
border: `${components.card.borderWidth}px solid ${components.card.borderColor}`,
|
|
32665
|
+
borderRadius: components.card.borderRadius
|
|
32666
|
+
},
|
|
32667
|
+
children: [
|
|
32668
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
32669
|
+
"span",
|
|
32670
|
+
{
|
|
32671
|
+
className: "uf-text-xs",
|
|
32672
|
+
style: { color: components.card.subtitleColor, fontFamily: fonts.regular },
|
|
32673
|
+
children: "You send"
|
|
32674
|
+
}
|
|
32675
|
+
),
|
|
32676
|
+
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
32677
|
+
"span",
|
|
32678
|
+
{
|
|
32679
|
+
className: "uf-text-sm uf-font-semibold",
|
|
32680
|
+
style: { color: components.card.titleColor, fontFamily: fonts.semibold },
|
|
32681
|
+
children: prefillDisplay
|
|
32682
|
+
}
|
|
32683
|
+
)
|
|
32684
|
+
]
|
|
32685
|
+
}
|
|
32686
|
+
),
|
|
32398
32687
|
/* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-pt-2", children: [
|
|
32399
32688
|
/* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
|
|
32400
32689
|
"div",
|
|
@@ -33982,7 +34271,7 @@ function WalletConnect({
|
|
|
33982
34271
|
amountQuickSelect = "percentage",
|
|
33983
34272
|
onWalletDisconnect,
|
|
33984
34273
|
onWalletConnected,
|
|
33985
|
-
|
|
34274
|
+
prefilledAmountUsd,
|
|
33986
34275
|
checkoutAmountUsd,
|
|
33987
34276
|
checkoutReceivedUsd,
|
|
33988
34277
|
onNewDeposit,
|
|
@@ -34004,28 +34293,28 @@ function WalletConnect({
|
|
|
34004
34293
|
onExecutionsChange
|
|
34005
34294
|
}) {
|
|
34006
34295
|
const { colors: colors2, fonts, components, mode } = useTheme();
|
|
34007
|
-
const walletProvidedAtMount =
|
|
34008
|
-
const [activeWalletInfo, setActiveWalletInfo] =
|
|
34296
|
+
const walletProvidedAtMount = React352.useRef(!!initialWalletInfo && !!initialDepositWallet);
|
|
34297
|
+
const [activeWalletInfo, setActiveWalletInfo] = React352.useState(
|
|
34009
34298
|
initialWalletInfo ?? null
|
|
34010
34299
|
);
|
|
34011
|
-
const [activeDepositWallet, setActiveDepositWallet] =
|
|
34300
|
+
const [activeDepositWallet, setActiveDepositWallet] = React352.useState(
|
|
34012
34301
|
initialDepositWallet ?? null
|
|
34013
34302
|
);
|
|
34014
34303
|
const initialView = initialWalletInfo && initialDepositWallet ? "select_token" : "select_wallet";
|
|
34015
|
-
const [view, setView] =
|
|
34016
|
-
const [isTransitioning, setIsTransitioning] =
|
|
34017
|
-
const viewRef =
|
|
34304
|
+
const [view, setView] = React352.useState(initialView);
|
|
34305
|
+
const [isTransitioning, setIsTransitioning] = React352.useState(false);
|
|
34306
|
+
const viewRef = React352.useRef(initialView);
|
|
34018
34307
|
const standalone = !canGoBack && !walletProvidedAtMount.current;
|
|
34019
34308
|
const { wallet: detectedWallet, isLoading: detectingWallet } = useDetectedBrowserWallet({
|
|
34020
34309
|
enabled: standalone
|
|
34021
34310
|
});
|
|
34022
|
-
const [autoResolved, setAutoResolved] =
|
|
34023
|
-
const [selectedWalletDef, setSelectedWalletDef] =
|
|
34024
|
-
const [connectingNetwork, setConnectingNetwork] =
|
|
34025
|
-
const [walletError, setWalletError] =
|
|
34026
|
-
const [isWalletConnecting, setIsWalletConnecting] =
|
|
34027
|
-
const [eip6963ProviderCount, setEip6963ProviderCount] =
|
|
34028
|
-
|
|
34311
|
+
const [autoResolved, setAutoResolved] = React352.useState(false);
|
|
34312
|
+
const [selectedWalletDef, setSelectedWalletDef] = React352.useState(null);
|
|
34313
|
+
const [connectingNetwork, setConnectingNetwork] = React352.useState(null);
|
|
34314
|
+
const [walletError, setWalletError] = React352.useState(null);
|
|
34315
|
+
const [isWalletConnecting, setIsWalletConnecting] = React352.useState(false);
|
|
34316
|
+
const [eip6963ProviderCount, setEip6963ProviderCount] = React352.useState(0);
|
|
34317
|
+
React352.useEffect(() => {
|
|
34029
34318
|
const store = getEip6963Store();
|
|
34030
34319
|
if (!store) return;
|
|
34031
34320
|
setEip6963ProviderCount(store.getProviders().length);
|
|
@@ -34034,7 +34323,7 @@ function WalletConnect({
|
|
|
34034
34323
|
});
|
|
34035
34324
|
}, []);
|
|
34036
34325
|
const { wallets: backendWallets } = useExternalWallets({ publishableKey });
|
|
34037
|
-
const walletDefinitions =
|
|
34326
|
+
const walletDefinitions = React352.useMemo(
|
|
34038
34327
|
() => backendWallets.length > 0 ? backendWallets.map((w) => ({
|
|
34039
34328
|
id: w.id,
|
|
34040
34329
|
name: w.name,
|
|
@@ -34045,32 +34334,32 @@ function WalletConnect({
|
|
|
34045
34334
|
})) : FALLBACK_WALLET_DEFINITIONS,
|
|
34046
34335
|
[backendWallets]
|
|
34047
34336
|
);
|
|
34048
|
-
const [recentWalletId, setRecentWalletIdState] =
|
|
34049
|
-
|
|
34337
|
+
const [recentWalletId, setRecentWalletIdState] = React352.useState(getLastOpenedWallet);
|
|
34338
|
+
React352.useEffect(() => {
|
|
34050
34339
|
if (view === "select_wallet") {
|
|
34051
34340
|
setRecentWalletIdState(getLastOpenedWallet());
|
|
34052
34341
|
}
|
|
34053
34342
|
}, [view]);
|
|
34054
|
-
const availableWallets =
|
|
34343
|
+
const availableWallets = React352.useMemo(
|
|
34055
34344
|
() => detectAvailableWallets(walletDefinitions, recentWalletId),
|
|
34056
34345
|
[walletDefinitions, eip6963ProviderCount, recentWalletId]
|
|
34057
34346
|
);
|
|
34058
|
-
const [isMobile, setIsMobile] =
|
|
34059
|
-
|
|
34347
|
+
const [isMobile, setIsMobile] = React352.useState(false);
|
|
34348
|
+
React352.useEffect(() => {
|
|
34060
34349
|
setIsMobile(isMobileDevice());
|
|
34061
34350
|
}, []);
|
|
34062
|
-
const mobileDepositAddresses =
|
|
34351
|
+
const mobileDepositAddresses = React352.useMemo(
|
|
34063
34352
|
() => (depositWallets ?? []).map((w) => ({ chain_type: w.chain_type, address: w.address })),
|
|
34064
34353
|
[depositWallets]
|
|
34065
34354
|
);
|
|
34066
|
-
const mobileDepositWalletIds =
|
|
34355
|
+
const mobileDepositWalletIds = React352.useMemo(
|
|
34067
34356
|
() => (depositWallets ?? []).filter((w) => w.chain_type === "ethereum" || w.chain_type === "solana").map((w) => w.id),
|
|
34068
34357
|
[depositWallets]
|
|
34069
34358
|
);
|
|
34070
|
-
const [mobileRedirect, setMobileRedirect] =
|
|
34071
|
-
const [pendingMobileWallet, setPendingMobileWallet] =
|
|
34072
|
-
const [awaitingMobileDeposit, setAwaitingMobileDeposit] =
|
|
34073
|
-
|
|
34359
|
+
const [mobileRedirect, setMobileRedirect] = React352.useState(null);
|
|
34360
|
+
const [pendingMobileWallet, setPendingMobileWallet] = React352.useState(null);
|
|
34361
|
+
const [awaitingMobileDeposit, setAwaitingMobileDeposit] = React352.useState(false);
|
|
34362
|
+
React352.useEffect(() => {
|
|
34074
34363
|
if (!standalone || autoResolved || detectingWallet) return;
|
|
34075
34364
|
if (!detectedWallet) {
|
|
34076
34365
|
setAutoResolved(true);
|
|
@@ -34096,32 +34385,36 @@ function WalletConnect({
|
|
|
34096
34385
|
depositWallets,
|
|
34097
34386
|
depositWalletsLoading
|
|
34098
34387
|
]);
|
|
34099
|
-
|
|
34388
|
+
React352.useEffect(() => {
|
|
34100
34389
|
if (!standalone || autoResolved) return;
|
|
34101
34390
|
const t13 = setTimeout(() => setAutoResolved(true), 5e3);
|
|
34102
34391
|
return () => clearTimeout(t13);
|
|
34103
34392
|
}, [standalone, autoResolved]);
|
|
34104
|
-
const [balances, setBalances] =
|
|
34105
|
-
const [isLoading, setIsLoading] =
|
|
34106
|
-
const [selectedBalance, setSelectedBalance] =
|
|
34107
|
-
const [totalBalanceUsd, setTotalBalanceUsd] =
|
|
34108
|
-
const [error, setError] =
|
|
34109
|
-
const [isDisconnectingWallet, setIsDisconnectingWallet] =
|
|
34110
|
-
const [amountUsd, setAmountUsd] =
|
|
34111
|
-
const [isConfirming, setIsConfirming] =
|
|
34112
|
-
const [hasSignedTransaction, setHasSignedTransaction] =
|
|
34113
|
-
const [tokenChainDetails, setTokenChainDetails] =
|
|
34114
|
-
const [loadingTokenDetails, setLoadingTokenDetails] =
|
|
34115
|
-
const [showTransactionDetails, setShowTransactionDetails] =
|
|
34116
|
-
const [receivedUsdAtSubmission, setReceivedUsdAtSubmission] =
|
|
34393
|
+
const [balances, setBalances] = React352.useState([]);
|
|
34394
|
+
const [isLoading, setIsLoading] = React352.useState(false);
|
|
34395
|
+
const [selectedBalance, setSelectedBalance] = React352.useState(null);
|
|
34396
|
+
const [totalBalanceUsd, setTotalBalanceUsd] = React352.useState(null);
|
|
34397
|
+
const [error, setError] = React352.useState(null);
|
|
34398
|
+
const [isDisconnectingWallet, setIsDisconnectingWallet] = React352.useState(false);
|
|
34399
|
+
const [amountUsd, setAmountUsd] = React352.useState(prefilledAmountUsd ?? "");
|
|
34400
|
+
const [isConfirming, setIsConfirming] = React352.useState(false);
|
|
34401
|
+
const [hasSignedTransaction, setHasSignedTransaction] = React352.useState(false);
|
|
34402
|
+
const [tokenChainDetails, setTokenChainDetails] = React352.useState(null);
|
|
34403
|
+
const [loadingTokenDetails, setLoadingTokenDetails] = React352.useState(false);
|
|
34404
|
+
const [showTransactionDetails, setShowTransactionDetails] = React352.useState(false);
|
|
34405
|
+
const [receivedUsdAtSubmission, setReceivedUsdAtSubmission] = React352.useState(null);
|
|
34117
34406
|
const walletInfo = activeWalletInfo;
|
|
34118
34407
|
const depositWallet = activeDepositWallet;
|
|
34119
34408
|
const hasWallet = !!activeWalletInfo && !!activeDepositWallet;
|
|
34409
|
+
React352.useEffect(() => {
|
|
34410
|
+
const cleanedPrefilled = prefilledAmountUsd?.replace(/[^0-9.]/g, "") ?? "";
|
|
34411
|
+
setAmountUsd(cleanedPrefilled);
|
|
34412
|
+
}, [prefilledAmountUsd]);
|
|
34120
34413
|
const chainType = activeDepositWallet?.chain_type ?? "ethereum";
|
|
34121
34414
|
const recipientAddress = activeDepositWallet?.address ?? "";
|
|
34122
34415
|
const isCheckoutMode = !!checkoutAmountUsd;
|
|
34123
34416
|
const supportedChainType = chainType === "algorand" || chainType === "xrpl" || chainType === "cardano" || chainType === "n1" ? "ethereum" : chainType;
|
|
34124
|
-
const transitionTo =
|
|
34417
|
+
const transitionTo = React352.useCallback((nextView) => {
|
|
34125
34418
|
if (nextView === viewRef.current) return;
|
|
34126
34419
|
setIsTransitioning(true);
|
|
34127
34420
|
setTimeout(() => {
|
|
@@ -34186,7 +34479,7 @@ function WalletConnect({
|
|
|
34186
34479
|
if (!selectedWalletDef) return;
|
|
34187
34480
|
handleConnectWallet(selectedWalletDef, network);
|
|
34188
34481
|
};
|
|
34189
|
-
|
|
34482
|
+
React352.useEffect(() => {
|
|
34190
34483
|
if (!pendingMobileWallet) return;
|
|
34191
34484
|
if (mobileDepositAddresses.length > 0) {
|
|
34192
34485
|
const wallet = pendingMobileWallet;
|
|
@@ -34350,7 +34643,7 @@ function WalletConnect({
|
|
|
34350
34643
|
publishableKey,
|
|
34351
34644
|
enabled: !!activeWalletInfo && !!recipientAddress
|
|
34352
34645
|
});
|
|
34353
|
-
const effectiveDestinationAmount =
|
|
34646
|
+
const effectiveDestinationAmount = React352.useMemo(() => {
|
|
34354
34647
|
if (!checkoutRemainingBaseUnits || checkoutRemainingBaseUnits === "0") return "0";
|
|
34355
34648
|
if (!checkoutAmountUsd) return checkoutRemainingBaseUnits;
|
|
34356
34649
|
const remaining = BigInt(checkoutRemainingBaseUnits);
|
|
@@ -34378,7 +34671,7 @@ function WalletConnect({
|
|
|
34378
34671
|
stablecoinParity,
|
|
34379
34672
|
enabled: isCheckoutMode && !!selectedToken && !!checkoutDestination && effectiveDestinationAmount !== "0"
|
|
34380
34673
|
});
|
|
34381
|
-
const activeCheckoutQuote =
|
|
34674
|
+
const activeCheckoutQuote = React352.useMemo(() => {
|
|
34382
34675
|
if (!isCheckoutMode) return null;
|
|
34383
34676
|
if (walletCheckoutQuote)
|
|
34384
34677
|
return {
|
|
@@ -34408,10 +34701,10 @@ function WalletConnect({
|
|
|
34408
34701
|
onDepositSuccess,
|
|
34409
34702
|
onDepositError
|
|
34410
34703
|
});
|
|
34411
|
-
|
|
34704
|
+
React352.useEffect(() => {
|
|
34412
34705
|
onExecutionsChange?.(depositExecutions);
|
|
34413
34706
|
}, [depositExecutions, onExecutionsChange]);
|
|
34414
|
-
const latestDepositExecution =
|
|
34707
|
+
const latestDepositExecution = React352.useMemo(() => {
|
|
34415
34708
|
if (depositExecutions.length === 0) return null;
|
|
34416
34709
|
return [...depositExecutions].sort((a, b) => {
|
|
34417
34710
|
const ta = a.created_at ? new Date(a.created_at).getTime() : 0;
|
|
@@ -34419,21 +34712,21 @@ function WalletConnect({
|
|
|
34419
34712
|
return tb - ta;
|
|
34420
34713
|
})[0];
|
|
34421
34714
|
}, [depositExecutions]);
|
|
34422
|
-
|
|
34715
|
+
React352.useEffect(() => {
|
|
34423
34716
|
if (awaitingMobileDeposit && latestDepositExecution && (viewRef.current === "mobile_redirect" || viewRef.current === "connecting")) {
|
|
34424
34717
|
transitionTo("mobile_deposit_status");
|
|
34425
34718
|
}
|
|
34426
34719
|
}, [awaitingMobileDeposit, latestDepositExecution, transitionTo]);
|
|
34427
|
-
|
|
34428
|
-
if (!
|
|
34720
|
+
React352.useEffect(() => {
|
|
34721
|
+
if (!isCheckoutMode || !tokenChainDetails || view !== "enter_amount") return;
|
|
34429
34722
|
const minDeposit = tokenChainDetails.minimum_deposit_amount_usd || 0;
|
|
34430
34723
|
const currentAmount = parseFloat(amountUsd) || 0;
|
|
34431
34724
|
if (currentAmount > 0 && currentAmount < minDeposit) setAmountUsd(minDeposit.toFixed(2));
|
|
34432
|
-
}, [tokenChainDetails, view,
|
|
34433
|
-
|
|
34725
|
+
}, [isCheckoutMode, tokenChainDetails, view, amountUsd]);
|
|
34726
|
+
React352.useEffect(() => {
|
|
34434
34727
|
if (view === "review") setShowTransactionDetails(false);
|
|
34435
34728
|
}, [view]);
|
|
34436
|
-
|
|
34729
|
+
React352.useEffect(() => {
|
|
34437
34730
|
if (view !== "enter_amount" && view !== "review" || !selectedBalance || !activeDepositWallet)
|
|
34438
34731
|
return;
|
|
34439
34732
|
let cancelled = false;
|
|
@@ -34470,7 +34763,7 @@ function WalletConnect({
|
|
|
34470
34763
|
cancelled = true;
|
|
34471
34764
|
};
|
|
34472
34765
|
}, [view, selectedBalance, publishableKey, activeDepositWallet]);
|
|
34473
|
-
|
|
34766
|
+
React352.useEffect(() => {
|
|
34474
34767
|
if (!activeWalletInfo || !activeDepositWallet) return;
|
|
34475
34768
|
let cancelled = false;
|
|
34476
34769
|
setIsLoading(true);
|
|
@@ -34535,21 +34828,21 @@ function WalletConnect({
|
|
|
34535
34828
|
defaultSourceTokenAddress,
|
|
34536
34829
|
defaultSourceSymbol
|
|
34537
34830
|
]);
|
|
34538
|
-
const usdToTokenRate =
|
|
34831
|
+
const usdToTokenRate = React352.useMemo(() => {
|
|
34539
34832
|
if (!selectedBalance || !selectedBalance.amount_usd || !selectedToken) return 0;
|
|
34540
34833
|
const balanceAmount = Number(selectedBalance.amount) / 10 ** selectedToken.decimals;
|
|
34541
34834
|
const balanceUsd = parseFloat(selectedBalance.amount_usd);
|
|
34542
34835
|
if (balanceAmount === 0 || balanceUsd === 0) return 0;
|
|
34543
34836
|
return balanceAmount / balanceUsd;
|
|
34544
34837
|
}, [selectedBalance, selectedToken]);
|
|
34545
|
-
const tokenAmount =
|
|
34838
|
+
const tokenAmount = React352.useMemo(() => {
|
|
34546
34839
|
if (isCheckoutMode && activeCheckoutQuote && selectedToken)
|
|
34547
34840
|
return Number(activeCheckoutQuote.sourceAmount) / 10 ** activeCheckoutQuote.sourceTokenDecimals;
|
|
34548
34841
|
const usdNum = parseFloat(amountUsd) || 0;
|
|
34549
34842
|
if (usdNum === 0 || usdToTokenRate === 0) return 0;
|
|
34550
34843
|
return usdNum * usdToTokenRate;
|
|
34551
34844
|
}, [amountUsd, usdToTokenRate, isCheckoutMode, activeCheckoutQuote, selectedToken]);
|
|
34552
|
-
|
|
34845
|
+
React352.useEffect(() => {
|
|
34553
34846
|
if (isCheckoutMode && activeCheckoutQuote?.sourceAmountUsd && view === "enter_amount")
|
|
34554
34847
|
setAmountUsd(activeCheckoutQuote.sourceAmountUsd);
|
|
34555
34848
|
}, [isCheckoutMode, activeCheckoutQuote, view]);
|
|
@@ -34558,7 +34851,7 @@ function WalletConnect({
|
|
|
34558
34851
|
const inputUsdNum = parseFloat(amountUsd) || 0;
|
|
34559
34852
|
const minDepositUsd = tokenChainDetails?.minimum_deposit_amount_usd || 0;
|
|
34560
34853
|
const isValidAmount = isCheckoutMode && activeCheckoutQuote ? tokenAmount > 0 && tokenAmount <= maxTokenAmount : inputUsdNum > 0 && inputUsdNum <= maxUsdAmount && inputUsdNum >= minDepositUsd;
|
|
34561
|
-
const formattedTokenAmount =
|
|
34854
|
+
const formattedTokenAmount = React352.useMemo(() => {
|
|
34562
34855
|
if (tokenAmount === 0 || !selectedToken) return null;
|
|
34563
34856
|
return `${tokenAmount.toFixed(6)} ${selectedToken.symbol}`.replace(/\.?0+$/, "");
|
|
34564
34857
|
}, [tokenAmount, selectedToken]);
|
|
@@ -34591,7 +34884,7 @@ function WalletConnect({
|
|
|
34591
34884
|
break;
|
|
34592
34885
|
case "enter_amount":
|
|
34593
34886
|
transitionTo("select_token");
|
|
34594
|
-
setAmountUsd(
|
|
34887
|
+
setAmountUsd(prefilledAmountUsd ?? "");
|
|
34595
34888
|
setTokenChainDetails(null);
|
|
34596
34889
|
break;
|
|
34597
34890
|
case "review":
|
|
@@ -34623,7 +34916,7 @@ function WalletConnect({
|
|
|
34623
34916
|
setSelectedBalance(null);
|
|
34624
34917
|
setBalances([]);
|
|
34625
34918
|
setTotalBalanceUsd(null);
|
|
34626
|
-
setAmountUsd(
|
|
34919
|
+
setAmountUsd(prefilledAmountUsd ?? "");
|
|
34627
34920
|
setError(null);
|
|
34628
34921
|
};
|
|
34629
34922
|
if (standalone) {
|
|
@@ -34868,116 +35161,131 @@ function WalletConnect({
|
|
|
34868
35161
|
] });
|
|
34869
35162
|
}
|
|
34870
35163
|
if (view === "select_wallet") {
|
|
34871
|
-
return
|
|
34872
|
-
|
|
34873
|
-
|
|
35164
|
+
return (
|
|
35165
|
+
// Mobile: flex column that fills the full-height sheet so the wallet list
|
|
35166
|
+
// scrolls and the footer pins to the bottom. Desktop (sm:): content-sized.
|
|
35167
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(
|
|
35168
|
+
"div",
|
|
34874
35169
|
{
|
|
34875
|
-
|
|
34876
|
-
|
|
34877
|
-
|
|
34878
|
-
|
|
34879
|
-
|
|
34880
|
-
|
|
34881
|
-
|
|
34882
|
-
|
|
34883
|
-
|
|
34884
|
-
|
|
34885
|
-
|
|
34886
|
-
|
|
34887
|
-
|
|
34888
|
-
|
|
34889
|
-
|
|
34890
|
-
|
|
34891
|
-
|
|
34892
|
-
|
|
34893
|
-
|
|
34894
|
-
|
|
34895
|
-
|
|
34896
|
-
|
|
34897
|
-
|
|
34898
|
-
|
|
34899
|
-
|
|
34900
|
-
|
|
34901
|
-
|
|
34902
|
-
|
|
34903
|
-
|
|
34904
|
-
|
|
34905
|
-
|
|
34906
|
-
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
|
|
34907
|
-
WALLET_ICONS3[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
34908
|
-
WalletIconWithNetwork,
|
|
34909
|
-
{
|
|
34910
|
-
WalletIcon: WALLET_ICONS3[wallet.id],
|
|
34911
|
-
networks: wallet.networks,
|
|
34912
|
-
size: 40,
|
|
34913
|
-
className: "uf-rounded-lg"
|
|
34914
|
-
}
|
|
34915
|
-
) : /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "uf-w-10 uf-h-10 uf-rounded-lg uf-bg-gray-500" }),
|
|
34916
|
-
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
|
|
34917
|
-
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
34918
|
-
"div",
|
|
34919
|
-
{
|
|
34920
|
-
className: "uf-text-sm uf-font-medium",
|
|
34921
|
-
style: { color: components.card.titleColor, fontFamily: fonts.medium },
|
|
34922
|
-
children: wallet.name
|
|
34923
|
-
}
|
|
34924
|
-
),
|
|
34925
|
-
wallet.id === recentWalletId && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
34926
|
-
"span",
|
|
34927
|
-
{
|
|
34928
|
-
className: "uf-text-xs uf-px-2 uf-py-0.5 uf-rounded-full",
|
|
34929
|
-
style: {
|
|
34930
|
-
backgroundColor: colors2.primary + "20",
|
|
34931
|
-
color: colors2.primary,
|
|
34932
|
-
fontFamily: fonts.medium
|
|
34933
|
-
},
|
|
34934
|
-
children: "Last used"
|
|
34935
|
-
}
|
|
34936
|
-
)
|
|
34937
|
-
] })
|
|
34938
|
-
] }),
|
|
34939
|
-
isPending ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
34940
|
-
LoaderCircle,
|
|
34941
|
-
{
|
|
34942
|
-
className: "uf-w-4 uf-h-4 uf-animate-spin",
|
|
34943
|
-
style: { color: colors2.primary }
|
|
34944
|
-
}
|
|
34945
|
-
) : wallet.isInstalled ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
34946
|
-
"span",
|
|
35170
|
+
style: viewTransitionStyle,
|
|
35171
|
+
className: "uf-flex uf-min-h-0 uf-flex-1 uf-flex-col sm:uf-block",
|
|
35172
|
+
children: [
|
|
35173
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
35174
|
+
DepositHeader,
|
|
35175
|
+
{
|
|
35176
|
+
title: "Connect Wallet",
|
|
35177
|
+
showBack: canGoBack,
|
|
35178
|
+
onBack: handleBack,
|
|
35179
|
+
onClose
|
|
35180
|
+
}
|
|
35181
|
+
),
|
|
35182
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "uf-pb-4 uf-flex uf-min-h-0 uf-flex-1 uf-flex-col sm:uf-block", children: [
|
|
35183
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
35184
|
+
"p",
|
|
35185
|
+
{
|
|
35186
|
+
className: "uf-text-sm uf-text-center uf-pb-4",
|
|
35187
|
+
style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
|
|
35188
|
+
children: isMobile ? "Open this page in your wallet's app to connect" : "Select a wallet to connect"
|
|
35189
|
+
}
|
|
35190
|
+
),
|
|
35191
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "uf-space-y-2 uf-min-h-0 uf-flex-1 uf-overflow-y-auto sm:uf-flex-none sm:uf-max-h-[330px] [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: availableWallets.filter((wallet) => {
|
|
35192
|
+
if (!isMobile || wallet.isInstalled) return true;
|
|
35193
|
+
const platformAllowed = !wallet.mobileBrowsePlatforms || wallet.mobileBrowsePlatforms.includes(getMobilePlatform() ?? "");
|
|
35194
|
+
return wallet.supportsMobileBrowse !== false && platformAllowed;
|
|
35195
|
+
}).map((wallet) => {
|
|
35196
|
+
const walletPlatformAllowed = !wallet.mobileBrowsePlatforms || wallet.mobileBrowsePlatforms.includes(getMobilePlatform() ?? "");
|
|
35197
|
+
const showOpenInApp = isMobile && !wallet.isInstalled && wallet.supportsMobileBrowse !== false && walletPlatformAllowed;
|
|
35198
|
+
const isPending = pendingMobileWallet?.id === wallet.id;
|
|
35199
|
+
return /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)(
|
|
35200
|
+
"button",
|
|
34947
35201
|
{
|
|
34948
|
-
|
|
35202
|
+
onClick: () => void handleWalletClick(wallet),
|
|
35203
|
+
disabled: isWalletConnecting || !!pendingMobileWallet,
|
|
35204
|
+
className: "uf-w-full uf-transition-colors uf-p-3 uf-flex uf-items-center uf-justify-between hover:uf-opacity-90 disabled:uf-opacity-50",
|
|
34949
35205
|
style: {
|
|
34950
|
-
backgroundColor:
|
|
34951
|
-
|
|
34952
|
-
|
|
35206
|
+
backgroundColor: components.card.backgroundColor,
|
|
35207
|
+
borderRadius: components.card.borderRadius,
|
|
35208
|
+
border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
|
|
34953
35209
|
},
|
|
34954
|
-
children:
|
|
34955
|
-
|
|
34956
|
-
|
|
34957
|
-
|
|
34958
|
-
|
|
34959
|
-
|
|
34960
|
-
|
|
34961
|
-
|
|
34962
|
-
|
|
34963
|
-
|
|
34964
|
-
|
|
34965
|
-
|
|
34966
|
-
|
|
34967
|
-
|
|
34968
|
-
|
|
34969
|
-
|
|
34970
|
-
|
|
34971
|
-
|
|
34972
|
-
|
|
34973
|
-
|
|
34974
|
-
|
|
34975
|
-
|
|
34976
|
-
|
|
34977
|
-
|
|
34978
|
-
|
|
34979
|
-
|
|
34980
|
-
|
|
35210
|
+
children: [
|
|
35211
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
|
|
35212
|
+
WALLET_ICONS3[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
35213
|
+
WalletIconWithNetwork,
|
|
35214
|
+
{
|
|
35215
|
+
WalletIcon: WALLET_ICONS3[wallet.id],
|
|
35216
|
+
networks: wallet.networks,
|
|
35217
|
+
size: 40,
|
|
35218
|
+
className: "uf-rounded-lg"
|
|
35219
|
+
}
|
|
35220
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "uf-w-10 uf-h-10 uf-rounded-lg uf-bg-gray-500" }),
|
|
35221
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
|
|
35222
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
35223
|
+
"div",
|
|
35224
|
+
{
|
|
35225
|
+
className: "uf-text-sm uf-font-medium",
|
|
35226
|
+
style: { color: components.card.titleColor, fontFamily: fonts.medium },
|
|
35227
|
+
children: wallet.name
|
|
35228
|
+
}
|
|
35229
|
+
),
|
|
35230
|
+
wallet.id === recentWalletId && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
35231
|
+
"span",
|
|
35232
|
+
{
|
|
35233
|
+
className: "uf-text-xs uf-px-2 uf-py-0.5 uf-rounded-full",
|
|
35234
|
+
style: {
|
|
35235
|
+
backgroundColor: colors2.primary + "20",
|
|
35236
|
+
color: colors2.primary,
|
|
35237
|
+
fontFamily: fonts.medium
|
|
35238
|
+
},
|
|
35239
|
+
children: "Last used"
|
|
35240
|
+
}
|
|
35241
|
+
)
|
|
35242
|
+
] })
|
|
35243
|
+
] }),
|
|
35244
|
+
isPending ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
35245
|
+
LoaderCircle,
|
|
35246
|
+
{
|
|
35247
|
+
className: "uf-w-4 uf-h-4 uf-animate-spin",
|
|
35248
|
+
style: { color: colors2.primary }
|
|
35249
|
+
}
|
|
35250
|
+
) : wallet.isInstalled ? /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
35251
|
+
"span",
|
|
35252
|
+
{
|
|
35253
|
+
className: "uf-text-xs uf-px-2 uf-py-1 uf-rounded-full",
|
|
35254
|
+
style: {
|
|
35255
|
+
backgroundColor: colors2.primary + "20",
|
|
35256
|
+
color: colors2.primary,
|
|
35257
|
+
fontFamily: fonts.medium
|
|
35258
|
+
},
|
|
35259
|
+
children: "Detected"
|
|
35260
|
+
}
|
|
35261
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
|
|
35262
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
35263
|
+
"span",
|
|
35264
|
+
{
|
|
35265
|
+
className: "uf-text-xs",
|
|
35266
|
+
style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
|
|
35267
|
+
children: showOpenInApp ? "Open" : "Install"
|
|
35268
|
+
}
|
|
35269
|
+
),
|
|
35270
|
+
/* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
|
|
35271
|
+
ExternalLink,
|
|
35272
|
+
{
|
|
35273
|
+
className: "uf-w-3 uf-h-3",
|
|
35274
|
+
style: { color: colors2.foregroundMuted }
|
|
35275
|
+
}
|
|
35276
|
+
)
|
|
35277
|
+
] })
|
|
35278
|
+
]
|
|
35279
|
+
},
|
|
35280
|
+
wallet.id
|
|
35281
|
+
);
|
|
35282
|
+
}) }),
|
|
35283
|
+
walletError && /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("div", { className: "uf-text-center uf-text-sm uf-mt-4 uf-px-4", style: { color: "#ef4444" }, children: walletError })
|
|
35284
|
+
] })
|
|
35285
|
+
]
|
|
35286
|
+
}
|
|
35287
|
+
)
|
|
35288
|
+
);
|
|
34981
35289
|
}
|
|
34982
35290
|
const preConnectAccent = selectedWalletDef ? getWalletBrandColor(selectedWalletDef.id, mode) : void 0;
|
|
34983
35291
|
const preConnectFg = preConnectAccent ? getContrastingTextColor(preConnectAccent) : void 0;
|
|
@@ -35332,6 +35640,15 @@ function SkeletonButton({ variant = "default" }) {
|
|
|
35332
35640
|
] });
|
|
35333
35641
|
}
|
|
35334
35642
|
var t8 = i18n2.depositModal;
|
|
35643
|
+
function normalizePrefilledUsdAmount(value) {
|
|
35644
|
+
if (!value) return void 0;
|
|
35645
|
+
const cleaned = value.replace(/[^0-9.]/g, "");
|
|
35646
|
+
if (!cleaned) return void 0;
|
|
35647
|
+
const normalizedNumeric = cleaned.replace(/(\..*)\./g, "$1");
|
|
35648
|
+
const parsed = parseFloat(normalizedNumeric);
|
|
35649
|
+
if (!Number.isFinite(parsed) || parsed <= 0) return void 0;
|
|
35650
|
+
return parseFloat(parsed.toFixed(2)).toString();
|
|
35651
|
+
}
|
|
35335
35652
|
function depositTabForScreen(screen) {
|
|
35336
35653
|
return screen === "card" || screen === "cashapp" || screen === "bank_transfer" || screen === "stripe_link" || screen === "apple_pay" ? "cash" : "crypto";
|
|
35337
35654
|
}
|
|
@@ -35351,6 +35668,7 @@ function DepositModal({
|
|
|
35351
35668
|
defaultSourceChainId,
|
|
35352
35669
|
defaultSourceTokenAddress,
|
|
35353
35670
|
defaultSourceSymbol,
|
|
35671
|
+
prefilledAmountUsd,
|
|
35354
35672
|
hideDepositTracker,
|
|
35355
35673
|
showBalanceHeader = false,
|
|
35356
35674
|
transferInputVariant = "double_input",
|
|
@@ -35366,7 +35684,9 @@ function DepositModal({
|
|
|
35366
35684
|
applePayTitle = "Pay with Apple Pay",
|
|
35367
35685
|
applePaySubTitle = "Instant",
|
|
35368
35686
|
enableBankTransfer,
|
|
35369
|
-
|
|
35687
|
+
// No default: left undefined so the backend `stripe_link.enabled` can govern
|
|
35688
|
+
// (via the `??` chain in showStripeLink) once a dashboard toggle exists.
|
|
35689
|
+
enableStripeLink,
|
|
35370
35690
|
userEmail,
|
|
35371
35691
|
hideDepositFlowInfo = false,
|
|
35372
35692
|
hideDisplayDescription = false,
|
|
@@ -35384,6 +35704,10 @@ function DepositModal({
|
|
|
35384
35704
|
depositTrackerSubTitle = t8.depositTracker.subtitle
|
|
35385
35705
|
}) {
|
|
35386
35706
|
const { colors: colors2, fonts, components } = useTheme();
|
|
35707
|
+
const normalizedPrefilledAmountUsd = (0, import_react8.useMemo)(
|
|
35708
|
+
() => normalizePrefilledUsdAmount(prefilledAmountUsd),
|
|
35709
|
+
[prefilledAmountUsd]
|
|
35710
|
+
);
|
|
35387
35711
|
const onDepositSuccessFor = (0, import_react8.useCallback)(
|
|
35388
35712
|
(method) => onDepositSuccess || onEvent ? (data) => {
|
|
35389
35713
|
const payload = { ...data, method };
|
|
@@ -35447,14 +35771,18 @@ function DepositModal({
|
|
|
35447
35771
|
const [allExecutions, setAllExecutions] = (0, import_react8.useState)([]);
|
|
35448
35772
|
const [selectedExecution, setSelectedExecution] = (0, import_react8.useState)(null);
|
|
35449
35773
|
const [depositExecutions, setDepositExecutions] = (0, import_react8.useState)([]);
|
|
35774
|
+
const { userIpInfo, isLoading: isLoadingIp } = useUserIp2();
|
|
35450
35775
|
const { projectConfig } = useProjectConfig({
|
|
35451
35776
|
publishableKey,
|
|
35452
|
-
enabled: open
|
|
35777
|
+
enabled: open && !isLoadingIp,
|
|
35778
|
+
countryCode: userIpInfo?.alpha2,
|
|
35779
|
+
subdivisionCode: userIpInfo?.subdivisionCode ?? void 0
|
|
35453
35780
|
});
|
|
35454
35781
|
const showTransferCrypto = enableTransferCrypto ?? projectConfig?.transfer_crypto?.enabled ?? true;
|
|
35455
35782
|
const showConnectWallet = enableConnectWallet ?? projectConfig?.connect_wallet?.enabled ?? true;
|
|
35456
35783
|
const showPayWithExchange = enablePayWithExchange ?? projectConfig?.pay_with_exchange?.enabled ?? true;
|
|
35457
35784
|
const showFiatOnramp = !projectConfig?.fiat_onramp?.is_hidden && (enableFiatOnramp ?? projectConfig?.fiat_onramp?.enabled ?? true);
|
|
35785
|
+
const showStripeLink = !projectConfig?.stripe_link?.is_hidden && (enableStripeLink ?? projectConfig?.stripe_link?.enabled ?? false);
|
|
35458
35786
|
const showConnectExchange = enableConnectExchange ?? projectConfig?.connect_exchange?.enabled ?? true;
|
|
35459
35787
|
const showCashApp = enableCashApp ?? projectConfig?.cash_app?.enabled ?? true;
|
|
35460
35788
|
const showApplePay = enableApplePay ?? projectConfig?.apple_pay?.enabled ?? true;
|
|
@@ -35600,7 +35928,6 @@ function DepositModal({
|
|
|
35600
35928
|
publishableKey,
|
|
35601
35929
|
enabled: open && showPayWithExchange
|
|
35602
35930
|
});
|
|
35603
|
-
const { userIpInfo, isLoading: isLoadingIp } = useUserIp2();
|
|
35604
35931
|
const { providers: bankTransferProviders, isLoading: bankTransferProvidersLoading } = useBankTransferProviders({
|
|
35605
35932
|
publishableKey,
|
|
35606
35933
|
enabled: open && !!userIpInfo?.alpha2,
|
|
@@ -35778,6 +36105,12 @@ function DepositModal({
|
|
|
35778
36105
|
const [cashAppView, setCashAppView] = (0, import_react8.useState)("amount");
|
|
35779
36106
|
const [stripeLinkStep, setStripeLinkStep] = (0, import_react8.useState)("amount");
|
|
35780
36107
|
const stripeLinkBackRef = (0, import_react8.useRef)(null);
|
|
36108
|
+
(0, import_react8.useEffect)(() => {
|
|
36109
|
+
if (view === "stripe_link" && !showStripeLink && effectiveInitialScreen === "main") {
|
|
36110
|
+
setView("main");
|
|
36111
|
+
setStripeLinkStep("amount");
|
|
36112
|
+
}
|
|
36113
|
+
}, [view, showStripeLink, effectiveInitialScreen]);
|
|
35781
36114
|
const [cashAppAmount, setCashAppAmount] = (0, import_react8.useState)("");
|
|
35782
36115
|
const [applePayView, setApplePayView] = (0, import_react8.useState)("email_input");
|
|
35783
36116
|
const applePayHandleRef = (0, import_react8.useRef)(null);
|
|
@@ -36002,7 +36335,7 @@ function DepositModal({
|
|
|
36002
36335
|
},
|
|
36003
36336
|
"cashapp"
|
|
36004
36337
|
) : null;
|
|
36005
|
-
const stripeLinkMenuButton =
|
|
36338
|
+
const stripeLinkMenuButton = showStripeLink ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36006
36339
|
StripeLinkButton,
|
|
36007
36340
|
{
|
|
36008
36341
|
onClick: () => setView("stripe_link"),
|
|
@@ -36050,11 +36383,13 @@ function DepositModal({
|
|
|
36050
36383
|
connectExchangeMenuButton
|
|
36051
36384
|
].filter(Boolean);
|
|
36052
36385
|
const cashMenuButtons = [
|
|
36386
|
+
// Stripe "Pay with Link" is intentionally listed first so it always sits
|
|
36387
|
+
// above "Deposit with Card".
|
|
36388
|
+
stripeLinkMenuButton,
|
|
36053
36389
|
depositWithCardMenuButton,
|
|
36054
36390
|
applePayMenuButton,
|
|
36055
36391
|
cashAppMenuButton,
|
|
36056
|
-
bankTransferMenuButton
|
|
36057
|
-
stripeLinkMenuButton
|
|
36392
|
+
bankTransferMenuButton
|
|
36058
36393
|
].filter(Boolean);
|
|
36059
36394
|
const depositTabs = [
|
|
36060
36395
|
{ id: "crypto", label: "Use Crypto", icon: Bitcoin, buttons: cryptoMenuButtons },
|
|
@@ -36149,13 +36484,13 @@ function DepositModal({
|
|
|
36149
36484
|
const stackedOptions = [
|
|
36150
36485
|
transferCryptoMenuButton,
|
|
36151
36486
|
connectWalletMenuButton,
|
|
36487
|
+
stripeLinkMenuButton,
|
|
36152
36488
|
depositWithCardMenuButton,
|
|
36153
36489
|
applePayMenuButton,
|
|
36154
36490
|
payWithExchangeMenuButton,
|
|
36155
36491
|
connectExchangeMenuButton,
|
|
36156
36492
|
cashAppMenuButton,
|
|
36157
36493
|
bankTransferMenuButton,
|
|
36158
|
-
stripeLinkMenuButton,
|
|
36159
36494
|
depositTrackerMenuButton
|
|
36160
36495
|
].filter(Boolean);
|
|
36161
36496
|
return renderScrollableOptions(stackedOptions);
|
|
@@ -36171,410 +36506,461 @@ function DepositModal({
|
|
|
36171
36506
|
{
|
|
36172
36507
|
ref: hideOverlay ? containerCallbackRef : void 0,
|
|
36173
36508
|
hideOverlay,
|
|
36174
|
-
className: `sm:uf-max-w-[400px] uf-border-secondary uf-text-foreground uf-gap-0 [&>button]:uf-hidden ${hideOverlay ? `uf-p-6 uf-overflow-hidden ${themeClass}` : `uf-p-0 uf-overflow-visible ${view === "main" ? "!uf-top-auto !uf-h-auto !uf-max-h-[85vh] sm:!uf-max-h-none sm:!uf-top-[50%]" : "!uf-top-0 !uf-h-full sm:!uf-h-auto sm:!uf-top-[50%]"} ${
|
|
36509
|
+
className: `sm:uf-max-w-[400px] uf-border-secondary uf-text-foreground uf-gap-0 [&>button]:uf-hidden ${hideOverlay ? `uf-p-6 uf-overflow-hidden ${themeClass}` : `uf-p-0 uf-overflow-visible ${view === "main" ? "!uf-top-auto !uf-h-auto !uf-max-h-[85vh] sm:!uf-max-h-none sm:!uf-top-[50%]" : "!uf-top-0 !uf-h-full sm:!uf-h-auto sm:!uf-top-[50%]"} ${// wallet_connect fills the full-height mobile sheet. DialogContent
|
|
36510
|
+
// is a grid, and its single auto row only *grows* to fill free
|
|
36511
|
+
// space (align-content: stretch) — it never shrinks below content,
|
|
36512
|
+
// so a long wallet list would balloon the row past the viewport and
|
|
36513
|
+
// push the footer off-screen instead of scrolling. Clamp the row to
|
|
36514
|
+
// the modal height with minmax(0,1fr) so the inner overflow-y-auto
|
|
36515
|
+
// list scrolls with the footer pinned. Reset to content-sized on
|
|
36516
|
+
// desktop (sm:) where the modal is auto-height and centered.
|
|
36517
|
+
view === "wallet_connect" ? "[grid-template-rows:minmax(0,1fr)] sm:[grid-template-rows:none]" : ""} ${themeClass}`}`,
|
|
36175
36518
|
style: { backgroundColor: colors2.background },
|
|
36176
36519
|
onPointerDownOutside: (e) => e.preventDefault(),
|
|
36177
36520
|
onInteractOutside: (e) => e.preventDefault(),
|
|
36178
36521
|
children: [
|
|
36179
36522
|
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(DialogTitle2, { className: "uf-sr-only", children: modalTitle || "Deposit" }),
|
|
36180
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36181
|
-
|
|
36182
|
-
|
|
36183
|
-
|
|
36184
|
-
|
|
36185
|
-
|
|
36186
|
-
|
|
36187
|
-
|
|
36188
|
-
|
|
36189
|
-
|
|
36190
|
-
|
|
36191
|
-
|
|
36192
|
-
|
|
36193
|
-
|
|
36194
|
-
|
|
36195
|
-
|
|
36196
|
-
|
|
36197
|
-
|
|
36198
|
-
|
|
36199
|
-
|
|
36200
|
-
|
|
36201
|
-
|
|
36202
|
-
|
|
36203
|
-
|
|
36204
|
-
|
|
36205
|
-
|
|
36206
|
-
|
|
36207
|
-
|
|
36208
|
-
|
|
36209
|
-
|
|
36210
|
-
|
|
36211
|
-
|
|
36212
|
-
|
|
36213
|
-
|
|
36214
|
-
|
|
36215
|
-
|
|
36216
|
-
|
|
36217
|
-
|
|
36218
|
-
|
|
36219
|
-
|
|
36220
|
-
|
|
36221
|
-
|
|
36222
|
-
|
|
36223
|
-
|
|
36224
|
-
|
|
36225
|
-
|
|
36226
|
-
|
|
36227
|
-
|
|
36228
|
-
|
|
36229
|
-
|
|
36230
|
-
|
|
36231
|
-
|
|
36232
|
-
|
|
36233
|
-
|
|
36234
|
-
|
|
36235
|
-
|
|
36236
|
-
|
|
36237
|
-
|
|
36238
|
-
|
|
36239
|
-
|
|
36240
|
-
|
|
36241
|
-
|
|
36242
|
-
|
|
36243
|
-
|
|
36244
|
-
|
|
36245
|
-
|
|
36246
|
-
|
|
36247
|
-
|
|
36248
|
-
|
|
36249
|
-
|
|
36250
|
-
|
|
36251
|
-
|
|
36252
|
-
|
|
36253
|
-
|
|
36254
|
-
|
|
36255
|
-
|
|
36256
|
-
|
|
36257
|
-
|
|
36258
|
-
|
|
36259
|
-
DepositHeader,
|
|
36260
|
-
{
|
|
36261
|
-
title: selectedExecution ? "Deposit Details" : depositTrackerTitle,
|
|
36262
|
-
showBack: showBackTracker,
|
|
36263
|
-
onBack: handleBack,
|
|
36264
|
-
onClose: handleClose
|
|
36265
|
-
}
|
|
36266
|
-
),
|
|
36267
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36268
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-h-[460px] uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: selectedExecution ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(DepositDetailContent, { execution: selectedExecution }) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-space-y-2 uf-pb-8", children: allExecutions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-py-8 uf-px-4 uf-text-center", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36269
|
-
"div",
|
|
36270
|
-
{
|
|
36271
|
-
className: "uf-text-sm",
|
|
36272
|
-
style: {
|
|
36273
|
-
color: components.container.subtitleColor,
|
|
36274
|
-
fontFamily: fonts.regular
|
|
36275
|
-
},
|
|
36276
|
-
children: "No deposits yet"
|
|
36277
|
-
}
|
|
36278
|
-
) }) : allExecutions.map((execution) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36279
|
-
DepositExecutionItem,
|
|
36280
|
-
{
|
|
36281
|
-
execution,
|
|
36282
|
-
onClick: () => setSelectedExecution(execution)
|
|
36283
|
-
},
|
|
36284
|
-
execution.id
|
|
36285
|
-
)) }) }),
|
|
36286
|
-
depositPoweredByFooter
|
|
36287
|
-
] })
|
|
36288
|
-
] }) : view === "card" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36289
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36290
|
-
DepositHeader,
|
|
36291
|
-
{
|
|
36292
|
-
title: cardView === "quotes" ? t8.quotes : depositWithCardTitle,
|
|
36293
|
-
showBack: showBackCard,
|
|
36294
|
-
onBack: handleBack,
|
|
36295
|
-
onClose: handleClose,
|
|
36296
|
-
badge: cardView === "quotes" ? { count: quotesCount } : void 0,
|
|
36297
|
-
showBalance: showBalanceHeader,
|
|
36298
|
-
balanceAddress: recipientAddress,
|
|
36299
|
-
balanceChainType: destinationChainType === "ethereum" || destinationChainType === "solana" || destinationChainType === "bitcoin" || destinationChainType === "n1" ? destinationChainType : void 0,
|
|
36300
|
-
balanceChainId: destinationChainId,
|
|
36301
|
-
balanceTokenAddress: destinationTokenAddress,
|
|
36302
|
-
projectName: projectConfig?.project_name,
|
|
36303
|
-
publishableKey
|
|
36304
|
-
}
|
|
36305
|
-
),
|
|
36306
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36307
|
-
standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : !showFiatOnramp ? (
|
|
36308
|
-
// Fiat on-ramp resolved hidden/disabled after a direct open
|
|
36309
|
-
// (e.g. platform `is_hidden` for a Stripe Link-only project).
|
|
36310
|
-
// Show a geo-restriction screen rather than the card UI so the
|
|
36311
|
-
// hard-hide is honoured without a flash of "Pay with Card".
|
|
36312
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(GeoRestrictionScreen, { methodName: "Card" })
|
|
36313
|
-
) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36314
|
-
BuyWithCard,
|
|
36315
|
-
{
|
|
36316
|
-
userId,
|
|
36317
|
-
publishableKey,
|
|
36318
|
-
view: cardView,
|
|
36319
|
-
onViewChange: handleCardViewChange,
|
|
36320
|
-
destinationTokenSymbol,
|
|
36321
|
-
recipientAddress,
|
|
36322
|
-
destinationChainType,
|
|
36323
|
-
destinationChainId,
|
|
36324
|
-
destinationTokenAddress,
|
|
36325
|
-
onDepositSuccess: onDepositSuccessFor("card"),
|
|
36326
|
-
onDepositError: onDepositErrorFor("card"),
|
|
36327
|
-
onEvent,
|
|
36328
|
-
themeClass,
|
|
36329
|
-
wallets,
|
|
36330
|
-
assetCdnUrl: projectConfig?.asset_cdn_url,
|
|
36331
|
-
hideDepositFlowInfo,
|
|
36332
|
-
hideDisplayDescription
|
|
36333
|
-
}
|
|
36334
|
-
),
|
|
36335
|
-
depositPoweredByFooter
|
|
36336
|
-
] })
|
|
36337
|
-
] }) : view === "exchange" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36338
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36339
|
-
DepositHeader,
|
|
36340
|
-
{
|
|
36341
|
-
title: payWithExchangeTitle,
|
|
36342
|
-
showBack: exchangeView === "pending" || sessionOpenedFromMenu,
|
|
36343
|
-
onBack: handleBack,
|
|
36344
|
-
onClose: handleClose
|
|
36345
|
-
}
|
|
36346
|
-
),
|
|
36347
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36348
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36349
|
-
PayWithExchange,
|
|
36350
|
-
{
|
|
36351
|
-
userId,
|
|
36352
|
-
publishableKey,
|
|
36353
|
-
exchanges,
|
|
36354
|
-
view: exchangeView,
|
|
36355
|
-
onViewChange: setExchangeView,
|
|
36356
|
-
destinationTokenSymbol,
|
|
36357
|
-
recipientAddress,
|
|
36358
|
-
destinationChainType,
|
|
36359
|
-
destinationChainId,
|
|
36360
|
-
destinationTokenAddress,
|
|
36361
|
-
onDepositSuccess: onDepositSuccessFor("pay_with_exchange"),
|
|
36362
|
-
onDepositError: onDepositErrorFor("pay_with_exchange"),
|
|
36363
|
-
wallets,
|
|
36364
|
-
defaultToken: defaultToken ?? null
|
|
36365
|
-
}
|
|
36366
|
-
),
|
|
36367
|
-
depositPoweredByFooter
|
|
36368
|
-
] })
|
|
36369
|
-
] }) : view === "coinbase_connect" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36370
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36371
|
-
CoinbaseConnect,
|
|
36372
|
-
{
|
|
36373
|
-
publishableKey,
|
|
36374
|
-
userId,
|
|
36375
|
-
wallets,
|
|
36376
|
-
recipientAddress,
|
|
36377
|
-
destinationTokenAddress: destinationTokenAddress ?? "",
|
|
36378
|
-
destinationChainId: destinationChainId ?? "",
|
|
36379
|
-
destinationChainType: destinationChainType ?? "",
|
|
36380
|
-
onDepositSuccess: onDepositSuccessFor("exchange_connect"),
|
|
36381
|
-
onDepositError: onDepositErrorFor("exchange_connect"),
|
|
36382
|
-
onTransferError: (error) => {
|
|
36383
|
-
onDepositErrorFor("exchange_connect")?.({
|
|
36384
|
-
message: error.message,
|
|
36385
|
-
error
|
|
36386
|
-
});
|
|
36387
|
-
},
|
|
36388
|
-
onBack: handleBack,
|
|
36389
|
-
onClose: handleClose,
|
|
36390
|
-
onDisconnect: handleExchangeDisconnect,
|
|
36391
|
-
skipToHoldings: coinbaseSkipToHoldings,
|
|
36392
|
-
canGoBack: sessionOpenedFromMenu,
|
|
36393
|
-
onExecutionsChange: setDepositExecutions,
|
|
36394
|
-
defaultSourceChainType,
|
|
36395
|
-
defaultSourceChainId,
|
|
36396
|
-
defaultSourceTokenAddress,
|
|
36397
|
-
defaultSourceSymbol
|
|
36398
|
-
}
|
|
36399
|
-
),
|
|
36400
|
-
depositPoweredByFooter
|
|
36401
|
-
] }) : view === "wallet_connect" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36402
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36403
|
-
WalletConnect,
|
|
36404
|
-
{
|
|
36405
|
-
walletInfo: browserWalletInfo ?? void 0,
|
|
36406
|
-
depositWallet: browserWalletInfo?.depositWallet ?? void 0,
|
|
36407
|
-
wallets,
|
|
36408
|
-
userId,
|
|
36409
|
-
publishableKey,
|
|
36410
|
-
assetCdnUrl: projectConfig?.asset_cdn_url,
|
|
36411
|
-
projectName: projectConfig?.project_name,
|
|
36412
|
-
onError: (error) => {
|
|
36413
|
-
onDepositErrorFor("wallet_connect")?.({
|
|
36414
|
-
message: error.message,
|
|
36415
|
-
error
|
|
36416
|
-
});
|
|
36417
|
-
},
|
|
36418
|
-
onDepositSuccess: onDepositSuccessFor("wallet_connect"),
|
|
36419
|
-
onDepositError: onDepositErrorFor("wallet_connect"),
|
|
36420
|
-
amountQuickSelect: browserWalletAmountQuickSelect,
|
|
36421
|
-
onWalletDisconnect: handleWalletDisconnect,
|
|
36422
|
-
onWalletConnected: (info, dw) => {
|
|
36423
|
-
setBrowserWalletInfo({ ...info, depositWallet: dw });
|
|
36424
|
-
setStoredWalletState(info.type);
|
|
36425
|
-
setBrowserWalletChainType(dw.chain_type === "solana" ? "solana" : "ethereum");
|
|
36426
|
-
},
|
|
36427
|
-
onBack: handleBack,
|
|
36428
|
-
onClose: handleClose,
|
|
36429
|
-
defaultSourceChainType,
|
|
36430
|
-
defaultSourceChainId,
|
|
36431
|
-
defaultSourceTokenAddress,
|
|
36432
|
-
defaultSourceSymbol,
|
|
36433
|
-
canGoBack: sessionOpenedFromMenu,
|
|
36434
|
-
depositWalletsLoading: walletsLoading
|
|
36435
|
-
}
|
|
36436
|
-
),
|
|
36437
|
-
depositPoweredByFooter
|
|
36438
|
-
] }) : view === "bank_transfer" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36439
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36440
|
-
DepositHeader,
|
|
36441
|
-
{
|
|
36442
|
-
title: t8.bankTransfer.title,
|
|
36443
|
-
showBack: bankTransferView !== "providers" || sessionOpenedFromMenu,
|
|
36444
|
-
onBack: handleBack,
|
|
36445
|
-
onClose: handleClose
|
|
36446
|
-
}
|
|
36447
|
-
),
|
|
36448
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36449
|
-
bankTransferProvidersLoading ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SkeletonButton, { variant: "with-icons" }) : !hasEnabledBankTransferProvider ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(GeoRestrictionScreen, { methodName: "Bank Transfer" }) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36450
|
-
BankTransfer,
|
|
36451
|
-
{
|
|
36452
|
-
userId,
|
|
36453
|
-
publishableKey,
|
|
36454
|
-
view: bankTransferView,
|
|
36455
|
-
onViewChange: setBankTransferView,
|
|
36456
|
-
recipientAddress,
|
|
36457
|
-
destinationChainType,
|
|
36458
|
-
destinationChainId,
|
|
36459
|
-
destinationTokenAddress,
|
|
36460
|
-
destinationTokenSymbol,
|
|
36461
|
-
wallets,
|
|
36462
|
-
defaultToken: defaultToken ?? null,
|
|
36463
|
-
assetCdnUrl: projectConfig?.asset_cdn_url,
|
|
36464
|
-
onEvent,
|
|
36465
|
-
onDepositSuccess,
|
|
36466
|
-
onDepositError
|
|
36467
|
-
}
|
|
36468
|
-
),
|
|
36469
|
-
depositPoweredByFooter
|
|
36470
|
-
] })
|
|
36471
|
-
] }) : view === "stripe_link" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36472
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36473
|
-
DepositHeader,
|
|
36474
|
-
{
|
|
36475
|
-
title: "Deposit with Link",
|
|
36476
|
-
showBack: stripeLinkStep !== "checkout" && stripeLinkStep !== "success",
|
|
36477
|
-
onBack: handleBack,
|
|
36478
|
-
showClose: stripeLinkStep !== "checkout",
|
|
36479
|
-
onClose: handleClose
|
|
36480
|
-
}
|
|
36481
|
-
),
|
|
36482
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36483
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36484
|
-
PayWithStripeLink,
|
|
36485
|
-
{
|
|
36486
|
-
userId,
|
|
36487
|
-
publishableKey,
|
|
36488
|
-
recipientAddress,
|
|
36489
|
-
destinationChainType,
|
|
36490
|
-
destinationChainId,
|
|
36491
|
-
destinationTokenAddress,
|
|
36492
|
-
wallets,
|
|
36493
|
-
email: userEmail,
|
|
36494
|
-
iconUrl: projectConfig?.asset_cdn_url ? `${projectConfig.asset_cdn_url}/api/public/icons/onramps/svg/link.svg` : void 0,
|
|
36495
|
-
step: stripeLinkStep,
|
|
36496
|
-
onStepChange: setStripeLinkStep,
|
|
36497
|
-
backHandlerRef: stripeLinkBackRef,
|
|
36498
|
-
onDepositSuccess,
|
|
36499
|
-
onDepositError
|
|
36500
|
-
}
|
|
36501
|
-
),
|
|
36502
|
-
depositPoweredByFooter
|
|
36503
|
-
] })
|
|
36504
|
-
] }) : view === "cashapp" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36505
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36506
|
-
DepositHeader,
|
|
36507
|
-
{
|
|
36508
|
-
title: cashAppView !== "amount" && cashAppAmount ? `Pay $${cashAppAmount} via Cash App` : "Pay with Cash App",
|
|
36509
|
-
showBack: cashAppView !== "amount" || sessionOpenedFromMenu,
|
|
36510
|
-
onBack: handleBack,
|
|
36511
|
-
onClose: handleClose
|
|
36512
|
-
}
|
|
36513
|
-
),
|
|
36514
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36515
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36516
|
-
PayWithCashApp,
|
|
36517
|
-
{
|
|
36518
|
-
userId,
|
|
36519
|
-
publishableKey,
|
|
36520
|
-
recipientAddress,
|
|
36521
|
-
destinationChainType,
|
|
36522
|
-
destinationChainId,
|
|
36523
|
-
destinationTokenAddress,
|
|
36524
|
-
cashAppIconUrl: projectConfig?.asset_cdn_url ? `${projectConfig.asset_cdn_url}/api/public/icons/onramps/svg/cashapp.svg` : void 0,
|
|
36525
|
-
view: cashAppView,
|
|
36526
|
-
onViewChange: setCashAppView,
|
|
36527
|
-
onAmountChange: setCashAppAmount,
|
|
36528
|
-
onEvent,
|
|
36529
|
-
onDepositSuccess: onDepositSuccessFor("cashapp"),
|
|
36530
|
-
onDepositError: onDepositErrorFor("cashapp"),
|
|
36531
|
-
wallets
|
|
36532
|
-
}
|
|
36533
|
-
),
|
|
36534
|
-
depositPoweredByFooter
|
|
36535
|
-
] })
|
|
36536
|
-
] }) : view === "apple_pay" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36537
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36538
|
-
DepositHeader,
|
|
36539
|
-
{
|
|
36540
|
-
title: applePayHeaderTitle,
|
|
36541
|
-
showBack: applePayShowBack,
|
|
36542
|
-
onBack: () => {
|
|
36543
|
-
const handled = applePayHandleRef.current?.requestBack() ?? false;
|
|
36544
|
-
if (!handled) handleBack();
|
|
36545
|
-
},
|
|
36546
|
-
onClose: handleClose
|
|
36547
|
-
}
|
|
36548
|
-
),
|
|
36549
|
-
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36550
|
-
applePayProvidersLoading ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SkeletonButton, { variant: "with-icons" }) : !hasEnabledApplePayProvider ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(GeoRestrictionScreen, { methodName: "Apple Pay" }) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36551
|
-
BuyWithApplePay,
|
|
36552
|
-
{
|
|
36553
|
-
ref: applePayHandleRef,
|
|
36554
|
-
userId,
|
|
36555
|
-
publishableKey,
|
|
36556
|
-
destinationChainType,
|
|
36557
|
-
destinationChainId,
|
|
36558
|
-
destinationTokenAddress,
|
|
36559
|
-
userEmail,
|
|
36560
|
-
wallets,
|
|
36561
|
-
onViewChange: setApplePayView,
|
|
36562
|
-
onEvent,
|
|
36563
|
-
onDepositSuccess: onDepositSuccessFor("apple_pay"),
|
|
36564
|
-
onDepositError: onDepositErrorFor("apple_pay"),
|
|
36565
|
-
exitLabel: sessionOpenedFromMenu ? "Return" : "Close",
|
|
36566
|
-
onExit: () => {
|
|
36567
|
-
if (sessionOpenedFromMenu) {
|
|
36568
|
-
setView("main");
|
|
36569
|
-
} else {
|
|
36570
|
-
handleClose();
|
|
36523
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36524
|
+
ThemeStyleInjector,
|
|
36525
|
+
{
|
|
36526
|
+
className: view === "wallet_connect" ? "uf-flex uf-min-h-0 uf-flex-col" : void 0,
|
|
36527
|
+
children: view === "main" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-min-h-0 uf-max-h-full", children: [
|
|
36528
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-flex-shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36529
|
+
DepositHeader,
|
|
36530
|
+
{
|
|
36531
|
+
title: modalTitle || "Deposit",
|
|
36532
|
+
showClose: !hideOverlay,
|
|
36533
|
+
onClose: handleClose,
|
|
36534
|
+
showBalance: showBalanceHeader,
|
|
36535
|
+
balanceAddress: recipientAddress,
|
|
36536
|
+
balanceChainType: destinationChainType === "ethereum" || destinationChainType === "solana" || destinationChainType === "bitcoin" || destinationChainType === "n1" ? destinationChainType : void 0,
|
|
36537
|
+
balanceChainId: destinationChainId,
|
|
36538
|
+
balanceTokenAddress: destinationTokenAddress,
|
|
36539
|
+
projectName: projectConfig?.project_name,
|
|
36540
|
+
publishableKey
|
|
36541
|
+
}
|
|
36542
|
+
) }),
|
|
36543
|
+
renderMainMenuBody(),
|
|
36544
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-flex-shrink-0", children: depositPoweredByFooter })
|
|
36545
|
+
] }) : view === "transfer" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36546
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36547
|
+
DepositHeader,
|
|
36548
|
+
{
|
|
36549
|
+
title: transferCryptoTitle,
|
|
36550
|
+
showBack: showBackTransfer,
|
|
36551
|
+
onBack: handleBack,
|
|
36552
|
+
onClose: handleClose,
|
|
36553
|
+
showBalance: showBalanceHeader,
|
|
36554
|
+
balanceAddress: recipientAddress,
|
|
36555
|
+
balanceChainType: destinationChainType === "ethereum" || destinationChainType === "solana" || destinationChainType === "bitcoin" || destinationChainType === "n1" ? destinationChainType : void 0,
|
|
36556
|
+
balanceChainId: destinationChainId,
|
|
36557
|
+
balanceTokenAddress: destinationTokenAddress,
|
|
36558
|
+
projectName: projectConfig?.project_name,
|
|
36559
|
+
publishableKey
|
|
36560
|
+
}
|
|
36561
|
+
),
|
|
36562
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36563
|
+
standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : transferInputVariant === "single_input" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36564
|
+
TransferCryptoSingleInput,
|
|
36565
|
+
{
|
|
36566
|
+
userId,
|
|
36567
|
+
publishableKey,
|
|
36568
|
+
recipientAddress,
|
|
36569
|
+
destinationChainType,
|
|
36570
|
+
destinationChainId,
|
|
36571
|
+
destinationTokenAddress,
|
|
36572
|
+
defaultSourceChainType,
|
|
36573
|
+
defaultSourceChainId,
|
|
36574
|
+
defaultSourceTokenAddress,
|
|
36575
|
+
defaultSourceSymbol,
|
|
36576
|
+
prefilledAmountUsd: normalizedPrefilledAmountUsd,
|
|
36577
|
+
depositConfirmationMode,
|
|
36578
|
+
onExecutionsChange: setDepositExecutions,
|
|
36579
|
+
onDepositSuccess: onDepositSuccessFor("transfer"),
|
|
36580
|
+
onDepositError: onDepositErrorFor("transfer"),
|
|
36581
|
+
wallets
|
|
36582
|
+
}
|
|
36583
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36584
|
+
TransferCryptoDoubleInput,
|
|
36585
|
+
{
|
|
36586
|
+
userId,
|
|
36587
|
+
publishableKey,
|
|
36588
|
+
recipientAddress,
|
|
36589
|
+
destinationChainType,
|
|
36590
|
+
destinationChainId,
|
|
36591
|
+
destinationTokenAddress,
|
|
36592
|
+
defaultSourceChainType,
|
|
36593
|
+
defaultSourceChainId,
|
|
36594
|
+
defaultSourceTokenAddress,
|
|
36595
|
+
defaultSourceSymbol,
|
|
36596
|
+
prefilledAmountUsd: normalizedPrefilledAmountUsd,
|
|
36597
|
+
depositConfirmationMode,
|
|
36598
|
+
onExecutionsChange: setDepositExecutions,
|
|
36599
|
+
onDepositSuccess: onDepositSuccessFor("transfer"),
|
|
36600
|
+
onDepositError: onDepositErrorFor("transfer"),
|
|
36601
|
+
wallets
|
|
36571
36602
|
}
|
|
36603
|
+
),
|
|
36604
|
+
depositPoweredByFooter
|
|
36605
|
+
] })
|
|
36606
|
+
] }) : view === "tracker" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36607
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36608
|
+
DepositHeader,
|
|
36609
|
+
{
|
|
36610
|
+
title: selectedExecution ? "Deposit Details" : depositTrackerTitle,
|
|
36611
|
+
showBack: showBackTracker,
|
|
36612
|
+
onBack: handleBack,
|
|
36613
|
+
onClose: handleClose
|
|
36572
36614
|
}
|
|
36573
|
-
|
|
36574
|
-
|
|
36575
|
-
|
|
36576
|
-
|
|
36577
|
-
|
|
36615
|
+
),
|
|
36616
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36617
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-h-[460px] uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: selectedExecution ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(DepositDetailContent, { execution: selectedExecution }) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-space-y-2 uf-pb-8", children: allExecutions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-py-8 uf-px-4 uf-text-center", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36618
|
+
"div",
|
|
36619
|
+
{
|
|
36620
|
+
className: "uf-text-sm",
|
|
36621
|
+
style: {
|
|
36622
|
+
color: components.container.subtitleColor,
|
|
36623
|
+
fontFamily: fonts.regular
|
|
36624
|
+
},
|
|
36625
|
+
children: "No deposits yet"
|
|
36626
|
+
}
|
|
36627
|
+
) }) : allExecutions.map((execution) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36628
|
+
DepositExecutionItem,
|
|
36629
|
+
{
|
|
36630
|
+
execution,
|
|
36631
|
+
onClick: () => setSelectedExecution(execution)
|
|
36632
|
+
},
|
|
36633
|
+
execution.id
|
|
36634
|
+
)) }) }),
|
|
36635
|
+
depositPoweredByFooter
|
|
36636
|
+
] })
|
|
36637
|
+
] }) : view === "card" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36638
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36639
|
+
DepositHeader,
|
|
36640
|
+
{
|
|
36641
|
+
title: cardView === "quotes" ? t8.quotes : depositWithCardTitle,
|
|
36642
|
+
showBack: showBackCard,
|
|
36643
|
+
onBack: handleBack,
|
|
36644
|
+
onClose: handleClose,
|
|
36645
|
+
badge: cardView === "quotes" ? { count: quotesCount } : void 0,
|
|
36646
|
+
showBalance: showBalanceHeader,
|
|
36647
|
+
balanceAddress: recipientAddress,
|
|
36648
|
+
balanceChainType: destinationChainType === "ethereum" || destinationChainType === "solana" || destinationChainType === "bitcoin" || destinationChainType === "n1" ? destinationChainType : void 0,
|
|
36649
|
+
balanceChainId: destinationChainId,
|
|
36650
|
+
balanceTokenAddress: destinationTokenAddress,
|
|
36651
|
+
projectName: projectConfig?.project_name,
|
|
36652
|
+
publishableKey
|
|
36653
|
+
}
|
|
36654
|
+
),
|
|
36655
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36656
|
+
standaloneNeedsDepositPrereq && depositPrerequisiteBody !== null ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("div", { className: "uf-pb-4 uf-space-y-3", children: depositPrerequisiteBody }) : !showFiatOnramp ? (
|
|
36657
|
+
// Fiat on-ramp resolved hidden/disabled after a direct open
|
|
36658
|
+
// (e.g. platform `is_hidden` for a Stripe Link-only project).
|
|
36659
|
+
// Show a geo-restriction screen rather than the card UI so the
|
|
36660
|
+
// hard-hide is honoured without a flash of "Pay with Card".
|
|
36661
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(GeoRestrictionScreen, { methodName: "Card" })
|
|
36662
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36663
|
+
BuyWithCard,
|
|
36664
|
+
{
|
|
36665
|
+
userId,
|
|
36666
|
+
publishableKey,
|
|
36667
|
+
view: cardView,
|
|
36668
|
+
onViewChange: handleCardViewChange,
|
|
36669
|
+
destinationTokenSymbol,
|
|
36670
|
+
recipientAddress,
|
|
36671
|
+
destinationChainType,
|
|
36672
|
+
destinationChainId,
|
|
36673
|
+
destinationTokenAddress,
|
|
36674
|
+
onDepositSuccess: onDepositSuccessFor("card"),
|
|
36675
|
+
onDepositError: onDepositErrorFor("card"),
|
|
36676
|
+
onEvent,
|
|
36677
|
+
themeClass,
|
|
36678
|
+
wallets,
|
|
36679
|
+
assetCdnUrl: projectConfig?.asset_cdn_url,
|
|
36680
|
+
hideDepositFlowInfo,
|
|
36681
|
+
hideDisplayDescription,
|
|
36682
|
+
prefilledAmountUsd: normalizedPrefilledAmountUsd
|
|
36683
|
+
}
|
|
36684
|
+
),
|
|
36685
|
+
depositPoweredByFooter
|
|
36686
|
+
] })
|
|
36687
|
+
] }) : view === "exchange" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36688
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36689
|
+
DepositHeader,
|
|
36690
|
+
{
|
|
36691
|
+
title: payWithExchangeTitle,
|
|
36692
|
+
showBack: exchangeView === "pending" || sessionOpenedFromMenu,
|
|
36693
|
+
onBack: handleBack,
|
|
36694
|
+
onClose: handleClose
|
|
36695
|
+
}
|
|
36696
|
+
),
|
|
36697
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36698
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36699
|
+
PayWithExchange,
|
|
36700
|
+
{
|
|
36701
|
+
userId,
|
|
36702
|
+
publishableKey,
|
|
36703
|
+
exchanges,
|
|
36704
|
+
view: exchangeView,
|
|
36705
|
+
onViewChange: setExchangeView,
|
|
36706
|
+
destinationTokenSymbol,
|
|
36707
|
+
recipientAddress,
|
|
36708
|
+
destinationChainType,
|
|
36709
|
+
destinationChainId,
|
|
36710
|
+
destinationTokenAddress,
|
|
36711
|
+
onDepositSuccess: onDepositSuccessFor("pay_with_exchange"),
|
|
36712
|
+
onDepositError: onDepositErrorFor("pay_with_exchange"),
|
|
36713
|
+
wallets,
|
|
36714
|
+
defaultToken: defaultToken ?? null
|
|
36715
|
+
}
|
|
36716
|
+
),
|
|
36717
|
+
depositPoweredByFooter
|
|
36718
|
+
] })
|
|
36719
|
+
] }) : view === "coinbase_connect" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36720
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36721
|
+
CoinbaseConnect,
|
|
36722
|
+
{
|
|
36723
|
+
publishableKey,
|
|
36724
|
+
userId,
|
|
36725
|
+
wallets,
|
|
36726
|
+
recipientAddress,
|
|
36727
|
+
destinationTokenAddress: destinationTokenAddress ?? "",
|
|
36728
|
+
destinationChainId: destinationChainId ?? "",
|
|
36729
|
+
destinationChainType: destinationChainType ?? "",
|
|
36730
|
+
onDepositSuccess: onDepositSuccessFor("exchange_connect"),
|
|
36731
|
+
onDepositError: onDepositErrorFor("exchange_connect"),
|
|
36732
|
+
onTransferError: (error) => {
|
|
36733
|
+
onDepositErrorFor("exchange_connect")?.({
|
|
36734
|
+
message: error.message,
|
|
36735
|
+
error
|
|
36736
|
+
});
|
|
36737
|
+
},
|
|
36738
|
+
onBack: handleBack,
|
|
36739
|
+
onClose: handleClose,
|
|
36740
|
+
onDisconnect: handleExchangeDisconnect,
|
|
36741
|
+
skipToHoldings: coinbaseSkipToHoldings,
|
|
36742
|
+
canGoBack: sessionOpenedFromMenu,
|
|
36743
|
+
onExecutionsChange: setDepositExecutions,
|
|
36744
|
+
defaultSourceChainType,
|
|
36745
|
+
defaultSourceChainId,
|
|
36746
|
+
defaultSourceTokenAddress,
|
|
36747
|
+
defaultSourceSymbol,
|
|
36748
|
+
prefilledAmountUsd: normalizedPrefilledAmountUsd
|
|
36749
|
+
}
|
|
36750
|
+
),
|
|
36751
|
+
depositPoweredByFooter
|
|
36752
|
+
] }) : view === "wallet_connect" ? (
|
|
36753
|
+
// Mobile: flex-fill the full-height dialog body so the wallet list
|
|
36754
|
+
// can grow and scroll, with the footer pinned to the bottom.
|
|
36755
|
+
// Desktop (sm:): stays content-sized.
|
|
36756
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
|
|
36757
|
+
"div",
|
|
36758
|
+
{
|
|
36759
|
+
className: "uf-flex uf-flex-col uf-gap-1.5 uf-min-h-0 uf-flex-1 sm:uf-flex-none",
|
|
36760
|
+
children: [
|
|
36761
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36762
|
+
WalletConnect,
|
|
36763
|
+
{
|
|
36764
|
+
walletInfo: browserWalletInfo ?? void 0,
|
|
36765
|
+
depositWallet: browserWalletInfo?.depositWallet ?? void 0,
|
|
36766
|
+
wallets,
|
|
36767
|
+
userId,
|
|
36768
|
+
publishableKey,
|
|
36769
|
+
assetCdnUrl: projectConfig?.asset_cdn_url,
|
|
36770
|
+
projectName: projectConfig?.project_name,
|
|
36771
|
+
onError: (error) => {
|
|
36772
|
+
onDepositErrorFor("wallet_connect")?.({
|
|
36773
|
+
message: error.message,
|
|
36774
|
+
error
|
|
36775
|
+
});
|
|
36776
|
+
},
|
|
36777
|
+
onDepositSuccess: onDepositSuccessFor("wallet_connect"),
|
|
36778
|
+
onDepositError: onDepositErrorFor("wallet_connect"),
|
|
36779
|
+
amountQuickSelect: browserWalletAmountQuickSelect,
|
|
36780
|
+
prefilledAmountUsd: normalizedPrefilledAmountUsd,
|
|
36781
|
+
onWalletDisconnect: handleWalletDisconnect,
|
|
36782
|
+
onWalletConnected: (info, dw) => {
|
|
36783
|
+
setBrowserWalletInfo({ ...info, depositWallet: dw });
|
|
36784
|
+
setStoredWalletState(info.type);
|
|
36785
|
+
setBrowserWalletChainType(dw.chain_type === "solana" ? "solana" : "ethereum");
|
|
36786
|
+
},
|
|
36787
|
+
onBack: handleBack,
|
|
36788
|
+
onClose: handleClose,
|
|
36789
|
+
defaultSourceChainType,
|
|
36790
|
+
defaultSourceChainId,
|
|
36791
|
+
defaultSourceTokenAddress,
|
|
36792
|
+
defaultSourceSymbol,
|
|
36793
|
+
canGoBack: sessionOpenedFromMenu,
|
|
36794
|
+
depositWalletsLoading: walletsLoading
|
|
36795
|
+
}
|
|
36796
|
+
),
|
|
36797
|
+
depositPoweredByFooter
|
|
36798
|
+
]
|
|
36799
|
+
}
|
|
36800
|
+
)
|
|
36801
|
+
) : view === "bank_transfer" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36802
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36803
|
+
DepositHeader,
|
|
36804
|
+
{
|
|
36805
|
+
title: t8.bankTransfer.title,
|
|
36806
|
+
showBack: bankTransferView !== "providers" || sessionOpenedFromMenu,
|
|
36807
|
+
onBack: handleBack,
|
|
36808
|
+
onClose: handleClose
|
|
36809
|
+
}
|
|
36810
|
+
),
|
|
36811
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36812
|
+
bankTransferProvidersLoading ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SkeletonButton, { variant: "with-icons" }) : !hasEnabledBankTransferProvider ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(GeoRestrictionScreen, { methodName: "Bank Transfer" }) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36813
|
+
BankTransfer,
|
|
36814
|
+
{
|
|
36815
|
+
userId,
|
|
36816
|
+
publishableKey,
|
|
36817
|
+
view: bankTransferView,
|
|
36818
|
+
onViewChange: setBankTransferView,
|
|
36819
|
+
recipientAddress,
|
|
36820
|
+
destinationChainType,
|
|
36821
|
+
destinationChainId,
|
|
36822
|
+
destinationTokenAddress,
|
|
36823
|
+
destinationTokenSymbol,
|
|
36824
|
+
wallets,
|
|
36825
|
+
defaultToken: defaultToken ?? null,
|
|
36826
|
+
assetCdnUrl: projectConfig?.asset_cdn_url,
|
|
36827
|
+
onEvent,
|
|
36828
|
+
onDepositSuccess,
|
|
36829
|
+
onDepositError,
|
|
36830
|
+
prefilledAmountUsd: normalizedPrefilledAmountUsd
|
|
36831
|
+
}
|
|
36832
|
+
),
|
|
36833
|
+
depositPoweredByFooter
|
|
36834
|
+
] })
|
|
36835
|
+
] }) : view === "stripe_link" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36836
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36837
|
+
DepositHeader,
|
|
36838
|
+
{
|
|
36839
|
+
title: "Deposit with Link",
|
|
36840
|
+
showBack: stripeLinkStep !== "checkout" && stripeLinkStep !== "success",
|
|
36841
|
+
onBack: handleBack,
|
|
36842
|
+
showClose: stripeLinkStep !== "checkout" && stripeLinkStep !== "auth",
|
|
36843
|
+
onClose: handleClose
|
|
36844
|
+
}
|
|
36845
|
+
),
|
|
36846
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36847
|
+
isLoadingIp ? (
|
|
36848
|
+
// Hold the geo decision until IP resolves so we don't mount
|
|
36849
|
+
// PayWithStripeLink (which kicks off config/OAuth work) for a
|
|
36850
|
+
// deep-link user who turns out to be outside the US.
|
|
36851
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SkeletonButton, { variant: "with-icons" })
|
|
36852
|
+
) : !showStripeLink ? (
|
|
36853
|
+
// Stripe Link's crypto on-ramp is US-only. On a direct open
|
|
36854
|
+
// (initialScreen="stripe_link") the row isn't in a menu to
|
|
36855
|
+
// fall back to, so show a geo-restriction screen rather than
|
|
36856
|
+
// the Link UI.
|
|
36857
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36858
|
+
GeoRestrictionScreen,
|
|
36859
|
+
{
|
|
36860
|
+
methodName: t8.stripeLink.title,
|
|
36861
|
+
message: "Pay with Link is only available in the US."
|
|
36862
|
+
}
|
|
36863
|
+
)
|
|
36864
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36865
|
+
PayWithStripeLink,
|
|
36866
|
+
{
|
|
36867
|
+
userId,
|
|
36868
|
+
publishableKey,
|
|
36869
|
+
recipientAddress,
|
|
36870
|
+
destinationChainType,
|
|
36871
|
+
destinationChainId,
|
|
36872
|
+
destinationTokenAddress,
|
|
36873
|
+
countryCode: userIpInfo?.alpha2,
|
|
36874
|
+
subdivisionCode: userIpInfo?.subdivisionCode ?? void 0,
|
|
36875
|
+
wallets,
|
|
36876
|
+
email: userEmail,
|
|
36877
|
+
iconUrl: projectConfig?.asset_cdn_url ? `${projectConfig.asset_cdn_url}/api/public/icons/onramps/svg/link.svg` : void 0,
|
|
36878
|
+
step: stripeLinkStep,
|
|
36879
|
+
onStepChange: setStripeLinkStep,
|
|
36880
|
+
backHandlerRef: stripeLinkBackRef,
|
|
36881
|
+
onDepositSuccess,
|
|
36882
|
+
onDepositError
|
|
36883
|
+
}
|
|
36884
|
+
),
|
|
36885
|
+
depositPoweredByFooter
|
|
36886
|
+
] })
|
|
36887
|
+
] }) : view === "cashapp" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36888
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36889
|
+
DepositHeader,
|
|
36890
|
+
{
|
|
36891
|
+
title: cashAppView !== "amount" && cashAppAmount ? `Pay $${cashAppAmount} via Cash App` : "Pay with Cash App",
|
|
36892
|
+
showBack: cashAppView !== "amount" || sessionOpenedFromMenu,
|
|
36893
|
+
onBack: handleBack,
|
|
36894
|
+
onClose: handleClose
|
|
36895
|
+
}
|
|
36896
|
+
),
|
|
36897
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36898
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36899
|
+
PayWithCashApp,
|
|
36900
|
+
{
|
|
36901
|
+
userId,
|
|
36902
|
+
publishableKey,
|
|
36903
|
+
recipientAddress,
|
|
36904
|
+
destinationChainType,
|
|
36905
|
+
destinationChainId,
|
|
36906
|
+
destinationTokenAddress,
|
|
36907
|
+
cashAppIconUrl: projectConfig?.asset_cdn_url ? `${projectConfig.asset_cdn_url}/api/public/icons/onramps/svg/cashapp.svg` : void 0,
|
|
36908
|
+
view: cashAppView,
|
|
36909
|
+
onViewChange: setCashAppView,
|
|
36910
|
+
onAmountChange: setCashAppAmount,
|
|
36911
|
+
onEvent,
|
|
36912
|
+
onDepositSuccess: onDepositSuccessFor("cashapp"),
|
|
36913
|
+
onDepositError: onDepositErrorFor("cashapp"),
|
|
36914
|
+
prefilledAmountUsd: normalizedPrefilledAmountUsd,
|
|
36915
|
+
wallets
|
|
36916
|
+
}
|
|
36917
|
+
),
|
|
36918
|
+
depositPoweredByFooter
|
|
36919
|
+
] })
|
|
36920
|
+
] }) : view === "apple_pay" ? /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(import_jsx_runtime80.Fragment, { children: [
|
|
36921
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36922
|
+
DepositHeader,
|
|
36923
|
+
{
|
|
36924
|
+
title: applePayHeaderTitle,
|
|
36925
|
+
showBack: applePayShowBack,
|
|
36926
|
+
onBack: () => {
|
|
36927
|
+
const handled = applePayHandleRef.current?.requestBack() ?? false;
|
|
36928
|
+
if (!handled) handleBack();
|
|
36929
|
+
},
|
|
36930
|
+
onClose: handleClose
|
|
36931
|
+
}
|
|
36932
|
+
),
|
|
36933
|
+
/* @__PURE__ */ (0, import_jsx_runtime80.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
36934
|
+
applePayProvidersLoading ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SkeletonButton, { variant: "with-icons" }) : !hasEnabledApplePayProvider ? /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(GeoRestrictionScreen, { methodName: "Apple Pay" }) : /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
|
|
36935
|
+
BuyWithApplePay,
|
|
36936
|
+
{
|
|
36937
|
+
ref: applePayHandleRef,
|
|
36938
|
+
userId,
|
|
36939
|
+
publishableKey,
|
|
36940
|
+
destinationChainType,
|
|
36941
|
+
destinationChainId,
|
|
36942
|
+
destinationTokenAddress,
|
|
36943
|
+
userEmail,
|
|
36944
|
+
wallets,
|
|
36945
|
+
onViewChange: setApplePayView,
|
|
36946
|
+
onEvent,
|
|
36947
|
+
onDepositSuccess: onDepositSuccessFor("apple_pay"),
|
|
36948
|
+
onDepositError: onDepositErrorFor("apple_pay"),
|
|
36949
|
+
exitLabel: sessionOpenedFromMenu ? "Return" : "Close",
|
|
36950
|
+
onExit: () => {
|
|
36951
|
+
if (sessionOpenedFromMenu) {
|
|
36952
|
+
setView("main");
|
|
36953
|
+
} else {
|
|
36954
|
+
handleClose();
|
|
36955
|
+
}
|
|
36956
|
+
}
|
|
36957
|
+
}
|
|
36958
|
+
),
|
|
36959
|
+
depositPoweredByFooter
|
|
36960
|
+
] })
|
|
36961
|
+
] }) : null
|
|
36962
|
+
}
|
|
36963
|
+
)
|
|
36578
36964
|
]
|
|
36579
36965
|
}
|
|
36580
36966
|
)
|
|
@@ -37013,253 +37399,275 @@ function CheckoutModal({
|
|
|
37013
37399
|
return /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(PortalContainerProvider, { value: null, children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(Dialog2, { open, onOpenChange: handleClose, modal: true, children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37014
37400
|
DialogContent2,
|
|
37015
37401
|
{
|
|
37016
|
-
className: `sm:uf-max-w-[400px] uf-border-secondary uf-text-foreground uf-gap-0 [&>button]:uf-hidden uf-p-0 uf-overflow-visible ${view === "main" ? "!uf-top-auto !uf-h-auto !uf-max-h-[60vh] sm:!uf-max-h-none sm:!uf-top-[50%]" : "!uf-top-0 !uf-h-full sm:!uf-h-auto sm:!uf-top-[50%]"} ${
|
|
37402
|
+
className: `sm:uf-max-w-[400px] uf-border-secondary uf-text-foreground uf-gap-0 [&>button]:uf-hidden uf-p-0 uf-overflow-visible ${view === "main" ? "!uf-top-auto !uf-h-auto !uf-max-h-[60vh] sm:!uf-max-h-none sm:!uf-top-[50%]" : "!uf-top-0 !uf-h-full sm:!uf-h-auto sm:!uf-top-[50%]"} ${// wallet_connect fills the full-height mobile sheet. DialogContent is a
|
|
37403
|
+
// grid whose single auto row only grows to fill free space and never
|
|
37404
|
+
// shrinks below content, so a long wallet list would balloon the row
|
|
37405
|
+
// past the viewport and push the footer off-screen. Clamp the row to
|
|
37406
|
+
// the modal height with minmax(0,1fr) so the inner overflow-y-auto list
|
|
37407
|
+
// scrolls with the footer pinned. Reset to content-sized on desktop.
|
|
37408
|
+
view === "wallet_connect" ? "[grid-template-rows:minmax(0,1fr)] sm:[grid-template-rows:none]" : ""} ${themeClass}`,
|
|
37017
37409
|
style: { backgroundColor: colors2.background },
|
|
37018
37410
|
onPointerDownOutside: (e) => e.preventDefault(),
|
|
37019
37411
|
onInteractOutside: (e) => e.preventDefault(),
|
|
37020
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37021
|
-
|
|
37022
|
-
|
|
37023
|
-
|
|
37024
|
-
|
|
37025
|
-
|
|
37026
|
-
|
|
37027
|
-
|
|
37028
|
-
|
|
37029
|
-
|
|
37030
|
-
|
|
37031
|
-
|
|
37032
|
-
|
|
37033
|
-
|
|
37034
|
-
|
|
37035
|
-
|
|
37412
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37413
|
+
ThemeStyleInjector,
|
|
37414
|
+
{
|
|
37415
|
+
className: view === "wallet_connect" ? "uf-flex uf-min-h-0 uf-flex-col" : void 0,
|
|
37416
|
+
children: view === "main" ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(import_jsx_runtime81.Fragment, { children: [
|
|
37417
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(DepositHeader, { title: modalTitle || "Checkout", showClose: true, onClose: handleClose }),
|
|
37418
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
37419
|
+
piLoading ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-space-y-3", children: [
|
|
37420
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37421
|
+
"div",
|
|
37422
|
+
{
|
|
37423
|
+
className: "uf-rounded-xl uf-p-4 uf-animate-pulse",
|
|
37424
|
+
style: {
|
|
37425
|
+
backgroundColor: components.card.backgroundColor,
|
|
37426
|
+
borderRadius: components.card.borderRadius,
|
|
37427
|
+
border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
|
|
37428
|
+
},
|
|
37429
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-gap-2", children: [
|
|
37430
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37431
|
+
"div",
|
|
37432
|
+
{
|
|
37433
|
+
className: "uf-h-8 uf-w-24 uf-rounded",
|
|
37434
|
+
style: {
|
|
37435
|
+
backgroundColor: components.card.borderColor
|
|
37436
|
+
}
|
|
37437
|
+
}
|
|
37438
|
+
),
|
|
37439
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37440
|
+
"div",
|
|
37441
|
+
{
|
|
37442
|
+
className: "uf-h-4 uf-w-16 uf-rounded",
|
|
37443
|
+
style: {
|
|
37444
|
+
backgroundColor: components.card.borderColor
|
|
37445
|
+
}
|
|
37446
|
+
}
|
|
37447
|
+
)
|
|
37448
|
+
] })
|
|
37449
|
+
}
|
|
37450
|
+
),
|
|
37451
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(SkeletonButton2, {}),
|
|
37452
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(SkeletonButton2, {})
|
|
37453
|
+
] }) : piError ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
|
|
37454
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
|
|
37455
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37456
|
+
"h3",
|
|
37457
|
+
{
|
|
37458
|
+
className: "uf-text-lg uf-font-semibold uf-mb-2",
|
|
37459
|
+
style: {
|
|
37460
|
+
color: colors2.foreground,
|
|
37461
|
+
fontFamily: fonts.semibold
|
|
37462
|
+
},
|
|
37463
|
+
children: "Unable to Load Checkout"
|
|
37464
|
+
}
|
|
37465
|
+
),
|
|
37466
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37467
|
+
"p",
|
|
37468
|
+
{
|
|
37469
|
+
className: "uf-text-sm uf-max-w-[280px]",
|
|
37470
|
+
style: {
|
|
37471
|
+
color: colors2.foregroundMuted,
|
|
37472
|
+
fontFamily: fonts.regular
|
|
37473
|
+
},
|
|
37474
|
+
children: piError instanceof Error ? piError.message : "Something went wrong. Please try again."
|
|
37475
|
+
}
|
|
37476
|
+
)
|
|
37477
|
+
] }) : paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-space-y-3", children: [
|
|
37478
|
+
progressSection,
|
|
37479
|
+
(paymentIntent.status === "requires_payment" || paymentIntent.status === "processing") && /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(import_jsx_runtime81.Fragment, { children: [
|
|
37480
|
+
showTransferCrypto && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37481
|
+
TransferCryptoButton,
|
|
37036
37482
|
{
|
|
37037
|
-
|
|
37038
|
-
|
|
37039
|
-
|
|
37040
|
-
}
|
|
37483
|
+
onClick: () => {
|
|
37484
|
+
lastCheckoutMethodRef.current = "transfer";
|
|
37485
|
+
setView("transfer");
|
|
37486
|
+
},
|
|
37487
|
+
title: i18n2.checkoutModal.transferCrypto.title,
|
|
37488
|
+
subtitle: i18n2.checkoutModal.transferCrypto.subtitle,
|
|
37489
|
+
featuredTokens: projectConfig?.transfer_crypto.networks
|
|
37041
37490
|
}
|
|
37042
37491
|
),
|
|
37043
|
-
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37044
|
-
|
|
37492
|
+
showConnectWallet && /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37493
|
+
BrowserWalletButton,
|
|
37045
37494
|
{
|
|
37046
|
-
|
|
37047
|
-
|
|
37048
|
-
|
|
37049
|
-
|
|
37495
|
+
onClick: handleBrowserWalletClick,
|
|
37496
|
+
onConnectClick: handleWalletConnectClick,
|
|
37497
|
+
onDisconnect: handleWalletDisconnect,
|
|
37498
|
+
chainType: browserWalletChainType,
|
|
37499
|
+
publishableKey,
|
|
37500
|
+
featuredWallets: projectConfig?.connect_wallet?.wallets,
|
|
37501
|
+
subtitle: i18n2.checkoutModal.browserWallet.subtitle
|
|
37050
37502
|
}
|
|
37051
37503
|
)
|
|
37052
37504
|
] })
|
|
37053
|
-
}
|
|
37054
|
-
|
|
37055
|
-
|
|
37056
|
-
|
|
37057
|
-
] }) : piError ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
|
|
37058
|
-
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)("div", { className: "uf-w-16 uf-h-16 uf-rounded-full uf-bg-muted uf-flex uf-items-center uf-justify-center uf-mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
|
|
37505
|
+
] }) : null,
|
|
37506
|
+
poweredByFooter
|
|
37507
|
+
] })
|
|
37508
|
+
] }) : view === "transfer" ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(import_jsx_runtime81.Fragment, { children: [
|
|
37059
37509
|
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37060
|
-
|
|
37510
|
+
DepositHeader,
|
|
37061
37511
|
{
|
|
37062
|
-
|
|
37063
|
-
|
|
37064
|
-
|
|
37065
|
-
|
|
37066
|
-
},
|
|
37067
|
-
children: "Unable to Load Checkout"
|
|
37512
|
+
title: modalTitle || "Checkout",
|
|
37513
|
+
showBack: true,
|
|
37514
|
+
onBack: handleBack,
|
|
37515
|
+
onClose: handleClose
|
|
37068
37516
|
}
|
|
37069
37517
|
),
|
|
37070
|
-
/* @__PURE__ */ (0, import_jsx_runtime81.
|
|
37071
|
-
|
|
37072
|
-
|
|
37073
|
-
|
|
37074
|
-
|
|
37075
|
-
|
|
37076
|
-
|
|
37077
|
-
|
|
37078
|
-
|
|
37079
|
-
|
|
37080
|
-
|
|
37081
|
-
|
|
37082
|
-
|
|
37083
|
-
|
|
37084
|
-
|
|
37085
|
-
|
|
37086
|
-
|
|
37087
|
-
|
|
37088
|
-
|
|
37089
|
-
|
|
37090
|
-
|
|
37091
|
-
|
|
37092
|
-
|
|
37093
|
-
|
|
37094
|
-
|
|
37095
|
-
|
|
37096
|
-
|
|
37097
|
-
|
|
37098
|
-
|
|
37099
|
-
|
|
37100
|
-
|
|
37101
|
-
|
|
37102
|
-
|
|
37103
|
-
|
|
37104
|
-
|
|
37105
|
-
subtitle: i18n2.checkoutModal.browserWallet.subtitle
|
|
37106
|
-
}
|
|
37107
|
-
)
|
|
37108
|
-
] })
|
|
37109
|
-
] }) : null,
|
|
37110
|
-
poweredByFooter
|
|
37111
|
-
] })
|
|
37112
|
-
] }) : view === "transfer" ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(import_jsx_runtime81.Fragment, { children: [
|
|
37113
|
-
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37114
|
-
DepositHeader,
|
|
37115
|
-
{
|
|
37116
|
-
title: modalTitle || "Checkout",
|
|
37117
|
-
showBack: true,
|
|
37118
|
-
onBack: handleBack,
|
|
37119
|
-
onClose: handleClose
|
|
37120
|
-
}
|
|
37121
|
-
),
|
|
37122
|
-
/* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
37123
|
-
paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(import_jsx_runtime81.Fragment, { children: [
|
|
37124
|
-
(() => {
|
|
37125
|
-
const receivedUsd = parseFloat(
|
|
37126
|
-
paymentIntent.destination_amount_received_usd || paymentIntent.amount_received_usd
|
|
37127
|
-
);
|
|
37128
|
-
const totalUsd = parseFloat(
|
|
37129
|
-
paymentIntent.destination_amount_usd || paymentIntent.amount_usd
|
|
37130
|
-
);
|
|
37131
|
-
const pct = totalUsd > 0 ? Math.min(receivedUsd / totalUsd * 100, 100) : 0;
|
|
37132
|
-
return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-space-y-2", children: [
|
|
37133
|
-
/* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between", children: [
|
|
37134
|
-
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37135
|
-
"span",
|
|
37136
|
-
{
|
|
37137
|
-
className: "uf-text-xs",
|
|
37138
|
-
style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
|
|
37139
|
-
children: "Received"
|
|
37140
|
-
}
|
|
37141
|
-
),
|
|
37142
|
-
/* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
|
|
37143
|
-
"span",
|
|
37144
|
-
{
|
|
37145
|
-
className: "uf-text-xs",
|
|
37146
|
-
style: { color: colors2.foreground, fontFamily: fonts.medium },
|
|
37147
|
-
children: [
|
|
37148
|
-
"$",
|
|
37149
|
-
receivedUsd.toFixed(2),
|
|
37150
|
-
" / $",
|
|
37151
|
-
totalUsd.toFixed(2)
|
|
37152
|
-
]
|
|
37153
|
-
}
|
|
37154
|
-
)
|
|
37155
|
-
] }),
|
|
37156
|
-
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37157
|
-
"div",
|
|
37158
|
-
{
|
|
37159
|
-
className: "uf-w-full uf-h-1.5 uf-rounded-full uf-overflow-hidden",
|
|
37160
|
-
style: { backgroundColor: colors2.border },
|
|
37161
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37518
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
37519
|
+
paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(import_jsx_runtime81.Fragment, { children: [
|
|
37520
|
+
(() => {
|
|
37521
|
+
const receivedUsd = parseFloat(
|
|
37522
|
+
paymentIntent.destination_amount_received_usd || paymentIntent.amount_received_usd
|
|
37523
|
+
);
|
|
37524
|
+
const totalUsd = parseFloat(
|
|
37525
|
+
paymentIntent.destination_amount_usd || paymentIntent.amount_usd
|
|
37526
|
+
);
|
|
37527
|
+
const pct = totalUsd > 0 ? Math.min(receivedUsd / totalUsd * 100, 100) : 0;
|
|
37528
|
+
return /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-space-y-2", children: [
|
|
37529
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between", children: [
|
|
37530
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37531
|
+
"span",
|
|
37532
|
+
{
|
|
37533
|
+
className: "uf-text-xs",
|
|
37534
|
+
style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
|
|
37535
|
+
children: "Received"
|
|
37536
|
+
}
|
|
37537
|
+
),
|
|
37538
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
|
|
37539
|
+
"span",
|
|
37540
|
+
{
|
|
37541
|
+
className: "uf-text-xs",
|
|
37542
|
+
style: { color: colors2.foreground, fontFamily: fonts.medium },
|
|
37543
|
+
children: [
|
|
37544
|
+
"$",
|
|
37545
|
+
receivedUsd.toFixed(2),
|
|
37546
|
+
" / $",
|
|
37547
|
+
totalUsd.toFixed(2)
|
|
37548
|
+
]
|
|
37549
|
+
}
|
|
37550
|
+
)
|
|
37551
|
+
] }),
|
|
37552
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37162
37553
|
"div",
|
|
37163
37554
|
{
|
|
37164
|
-
className: "uf-
|
|
37165
|
-
style: {
|
|
37166
|
-
|
|
37167
|
-
|
|
37168
|
-
|
|
37555
|
+
className: "uf-w-full uf-h-1.5 uf-rounded-full uf-overflow-hidden",
|
|
37556
|
+
style: { backgroundColor: colors2.border },
|
|
37557
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37558
|
+
"div",
|
|
37559
|
+
{
|
|
37560
|
+
className: "uf-h-full uf-rounded-full uf-transition-all uf-duration-500",
|
|
37561
|
+
style: {
|
|
37562
|
+
width: `${pct}%`,
|
|
37563
|
+
backgroundColor: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : colors2.primary
|
|
37564
|
+
}
|
|
37565
|
+
}
|
|
37566
|
+
)
|
|
37169
37567
|
}
|
|
37170
37568
|
)
|
|
37569
|
+
] });
|
|
37570
|
+
})(),
|
|
37571
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37572
|
+
TransferCryptoSingleInput,
|
|
37573
|
+
{
|
|
37574
|
+
userId: paymentIntent.user_id || "",
|
|
37575
|
+
publishableKey,
|
|
37576
|
+
clientSecret,
|
|
37577
|
+
recipientAddress: paymentIntent.recipient_address,
|
|
37578
|
+
destinationChainType: paymentIntent.destination_chain_type,
|
|
37579
|
+
destinationChainId: paymentIntent.destination_chain_id,
|
|
37580
|
+
destinationTokenAddress: paymentIntent.destination_token_address,
|
|
37581
|
+
defaultSourceChainType,
|
|
37582
|
+
defaultSourceChainId,
|
|
37583
|
+
defaultSourceTokenAddress,
|
|
37584
|
+
defaultSourceSymbol,
|
|
37585
|
+
depositConfirmationMode: "auto_ui",
|
|
37586
|
+
wallets,
|
|
37587
|
+
onSourceTokenChange: setSelectedSource,
|
|
37588
|
+
persistCheckingIndicator: true,
|
|
37589
|
+
productType: "payment",
|
|
37590
|
+
checkoutQuote: effectiveCheckoutQuote,
|
|
37591
|
+
isCheckoutQuoteLoading: isQuoteLoading || isQuoteFetching
|
|
37171
37592
|
}
|
|
37172
37593
|
)
|
|
37173
|
-
] })
|
|
37174
|
-
|
|
37175
|
-
|
|
37176
|
-
|
|
37594
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime81.jsx)(SkeletonButton2, {}),
|
|
37595
|
+
poweredByFooter
|
|
37596
|
+
] })
|
|
37597
|
+
] }) : view === "wallet_connect" && paymentIntent ? (
|
|
37598
|
+
// Mobile: flex-fill the full-height sheet so the wallet list grows and
|
|
37599
|
+
// scrolls with the footer pinned. Desktop (sm:): content-sized.
|
|
37600
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsxs)(
|
|
37601
|
+
"div",
|
|
37177
37602
|
{
|
|
37178
|
-
|
|
37179
|
-
|
|
37180
|
-
|
|
37181
|
-
|
|
37182
|
-
|
|
37183
|
-
|
|
37184
|
-
|
|
37185
|
-
|
|
37186
|
-
|
|
37187
|
-
|
|
37188
|
-
|
|
37189
|
-
|
|
37190
|
-
|
|
37191
|
-
|
|
37192
|
-
|
|
37193
|
-
|
|
37194
|
-
|
|
37195
|
-
|
|
37603
|
+
className: "uf-flex uf-flex-col uf-gap-1.5 uf-min-h-0 uf-flex-1 sm:uf-flex-none",
|
|
37604
|
+
children: [
|
|
37605
|
+
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37606
|
+
WalletConnect,
|
|
37607
|
+
{
|
|
37608
|
+
walletInfo: browserWalletInfo ?? void 0,
|
|
37609
|
+
depositWallet: browserWalletInfo?.depositWallet ?? void 0,
|
|
37610
|
+
wallets,
|
|
37611
|
+
userId: paymentIntent.user_id || "",
|
|
37612
|
+
publishableKey,
|
|
37613
|
+
clientSecret,
|
|
37614
|
+
prefilledAmountUsd: remainingAmountUsd,
|
|
37615
|
+
checkoutAmountUsd: paymentIntent.amount_usd,
|
|
37616
|
+
checkoutReceivedUsd: paymentIntent.amount_received_usd,
|
|
37617
|
+
checkoutDestination: {
|
|
37618
|
+
chainType: paymentIntent.destination_chain_type,
|
|
37619
|
+
chainId: paymentIntent.destination_chain_id,
|
|
37620
|
+
tokenAddress: paymentIntent.destination_token_address,
|
|
37621
|
+
decimals: paymentIntent.destination_token_decimals ?? 6
|
|
37622
|
+
},
|
|
37623
|
+
productType: "payment",
|
|
37624
|
+
stablecoinParity: paymentIntent.stablecoin_parity ?? false,
|
|
37625
|
+
checkoutRemainingBaseUnits: (() => {
|
|
37626
|
+
const remaining = BigInt(paymentIntent.amount) - BigInt(paymentIntent.amount_received);
|
|
37627
|
+
return remaining > 0n ? remaining.toString() : "0";
|
|
37628
|
+
})(),
|
|
37629
|
+
onSuccess: (_txHash) => {
|
|
37630
|
+
emitCheckoutSuccess(
|
|
37631
|
+
{
|
|
37632
|
+
paymentIntentId: paymentIntent.id,
|
|
37633
|
+
status: "processing",
|
|
37634
|
+
paymentIntent
|
|
37635
|
+
},
|
|
37636
|
+
"wallet_connect"
|
|
37637
|
+
);
|
|
37638
|
+
},
|
|
37639
|
+
onError: (error) => {
|
|
37640
|
+
onCheckoutError?.({
|
|
37641
|
+
message: error.message,
|
|
37642
|
+
error,
|
|
37643
|
+
method: "wallet_connect"
|
|
37644
|
+
});
|
|
37645
|
+
},
|
|
37646
|
+
onWalletDisconnect: handleWalletDisconnect,
|
|
37647
|
+
onWalletConnected: (info, dw) => {
|
|
37648
|
+
setBrowserWalletInfo({ ...info, depositWallet: dw });
|
|
37649
|
+
setStoredWalletState(info.type);
|
|
37650
|
+
setBrowserWalletChainType(dw.chain_type === "solana" ? "solana" : "ethereum");
|
|
37651
|
+
lastCheckoutMethodRef.current = "wallet_connect";
|
|
37652
|
+
},
|
|
37653
|
+
onNewDeposit: () => setView("main"),
|
|
37654
|
+
onDone: () => setView("main"),
|
|
37655
|
+
paymentIntentStatus: paymentIntent.status,
|
|
37656
|
+
onBack: handleBack,
|
|
37657
|
+
onClose: handleClose,
|
|
37658
|
+
defaultSourceChainType,
|
|
37659
|
+
defaultSourceChainId,
|
|
37660
|
+
defaultSourceTokenAddress,
|
|
37661
|
+
defaultSourceSymbol
|
|
37662
|
+
}
|
|
37663
|
+
),
|
|
37664
|
+
poweredByFooter
|
|
37665
|
+
]
|
|
37196
37666
|
}
|
|
37197
37667
|
)
|
|
37198
|
-
|
|
37199
|
-
|
|
37200
|
-
|
|
37201
|
-
] }) : view === "wallet_connect" && paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime81.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
|
|
37202
|
-
/* @__PURE__ */ (0, import_jsx_runtime81.jsx)(
|
|
37203
|
-
WalletConnect,
|
|
37204
|
-
{
|
|
37205
|
-
walletInfo: browserWalletInfo ?? void 0,
|
|
37206
|
-
depositWallet: browserWalletInfo?.depositWallet ?? void 0,
|
|
37207
|
-
wallets,
|
|
37208
|
-
userId: paymentIntent.user_id || "",
|
|
37209
|
-
publishableKey,
|
|
37210
|
-
clientSecret,
|
|
37211
|
-
prefillAmountUsd: remainingAmountUsd,
|
|
37212
|
-
checkoutAmountUsd: paymentIntent.amount_usd,
|
|
37213
|
-
checkoutReceivedUsd: paymentIntent.amount_received_usd,
|
|
37214
|
-
checkoutDestination: {
|
|
37215
|
-
chainType: paymentIntent.destination_chain_type,
|
|
37216
|
-
chainId: paymentIntent.destination_chain_id,
|
|
37217
|
-
tokenAddress: paymentIntent.destination_token_address,
|
|
37218
|
-
decimals: paymentIntent.destination_token_decimals ?? 6
|
|
37219
|
-
},
|
|
37220
|
-
productType: "payment",
|
|
37221
|
-
stablecoinParity: paymentIntent.stablecoin_parity ?? false,
|
|
37222
|
-
checkoutRemainingBaseUnits: (() => {
|
|
37223
|
-
const remaining = BigInt(paymentIntent.amount) - BigInt(paymentIntent.amount_received);
|
|
37224
|
-
return remaining > 0n ? remaining.toString() : "0";
|
|
37225
|
-
})(),
|
|
37226
|
-
onSuccess: (_txHash) => {
|
|
37227
|
-
emitCheckoutSuccess(
|
|
37228
|
-
{
|
|
37229
|
-
paymentIntentId: paymentIntent.id,
|
|
37230
|
-
status: "processing",
|
|
37231
|
-
paymentIntent
|
|
37232
|
-
},
|
|
37233
|
-
"wallet_connect"
|
|
37234
|
-
);
|
|
37235
|
-
},
|
|
37236
|
-
onError: (error) => {
|
|
37237
|
-
onCheckoutError?.({
|
|
37238
|
-
message: error.message,
|
|
37239
|
-
error,
|
|
37240
|
-
method: "wallet_connect"
|
|
37241
|
-
});
|
|
37242
|
-
},
|
|
37243
|
-
onWalletDisconnect: handleWalletDisconnect,
|
|
37244
|
-
onWalletConnected: (info, dw) => {
|
|
37245
|
-
setBrowserWalletInfo({ ...info, depositWallet: dw });
|
|
37246
|
-
setStoredWalletState(info.type);
|
|
37247
|
-
setBrowserWalletChainType(dw.chain_type === "solana" ? "solana" : "ethereum");
|
|
37248
|
-
lastCheckoutMethodRef.current = "wallet_connect";
|
|
37249
|
-
},
|
|
37250
|
-
onNewDeposit: () => setView("main"),
|
|
37251
|
-
onDone: () => setView("main"),
|
|
37252
|
-
paymentIntentStatus: paymentIntent.status,
|
|
37253
|
-
onBack: handleBack,
|
|
37254
|
-
onClose: handleClose,
|
|
37255
|
-
defaultSourceChainType,
|
|
37256
|
-
defaultSourceChainId,
|
|
37257
|
-
defaultSourceTokenAddress,
|
|
37258
|
-
defaultSourceSymbol
|
|
37259
|
-
}
|
|
37260
|
-
),
|
|
37261
|
-
poweredByFooter
|
|
37262
|
-
] }) : null })
|
|
37668
|
+
) : null
|
|
37669
|
+
}
|
|
37670
|
+
)
|
|
37263
37671
|
}
|
|
37264
37672
|
) }) });
|
|
37265
37673
|
}
|
|
@@ -39569,6 +39977,7 @@ function UnifoldProvider2({
|
|
|
39569
39977
|
defaultSourceChainId: depositConfig.defaultSourceChainId,
|
|
39570
39978
|
defaultSourceTokenAddress: depositConfig.defaultSourceTokenAddress,
|
|
39571
39979
|
defaultSourceSymbol: depositConfig.defaultSourceSymbol,
|
|
39980
|
+
prefilledAmountUsd: depositConfig.prefilledAmountUsd,
|
|
39572
39981
|
userEmail: depositConfig.user?.email,
|
|
39573
39982
|
depositConfirmationMode: depositConfig.depositConfirmationMode ?? "auto_ui",
|
|
39574
39983
|
hideDepositTracker: config?.hideDepositTracker,
|