@rhinestone/deposit-modal 0.1.31 → 0.1.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{DepositModalReown-S7HER5HU.mjs → DepositModalReown-SZPCCNPH.mjs} +9 -5
- package/dist/{DepositModalReown-N7GCYZF7.cjs → DepositModalReown-XUAEWIW7.cjs} +12 -8
- package/dist/{WithdrawModalReown-DJCJ5U7E.cjs → WithdrawModalReown-53FDOZG2.cjs} +12 -8
- package/dist/{WithdrawModalReown-DMDRLYTE.mjs → WithdrawModalReown-YGGV7BL2.mjs} +9 -5
- package/dist/{chunk-VKQA3FO3.cjs → chunk-52FVEYTL.cjs} +4 -0
- package/dist/{chunk-3ICS43XC.mjs → chunk-C6I5TFSL.mjs} +4 -0
- package/dist/{chunk-EVU7M7A6.mjs → chunk-DLFUXLAM.mjs} +14 -13
- package/dist/{chunk-CS6UIMCF.mjs → chunk-K2JJKFTV.mjs} +5 -1
- package/dist/{chunk-AWFJFSPH.mjs → chunk-MKKJ7ZE2.mjs} +117 -176
- package/dist/{chunk-MU2BOEDN.cjs → chunk-NYEWO4NW.cjs} +195 -254
- package/dist/{chunk-SLI5FHTT.mjs → chunk-RR25E5DZ.mjs} +29 -9
- package/dist/{chunk-PE6OK3FH.cjs → chunk-S4UBVD3H.cjs} +5 -1
- package/dist/{chunk-SZ35G2DT.cjs → chunk-SQDXU7ML.cjs} +87 -67
- package/dist/{chunk-G2RDCQHL.cjs → chunk-YIHOACM3.cjs} +38 -37
- package/dist/constants.cjs +2 -2
- package/dist/constants.mjs +1 -1
- package/dist/deposit.cjs +4 -4
- package/dist/deposit.d.cts +2 -2
- package/dist/deposit.d.ts +2 -2
- package/dist/deposit.mjs +3 -3
- package/dist/index.cjs +5 -5
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.mjs +4 -4
- package/dist/reown.cjs +5 -5
- package/dist/reown.d.cts +1 -1
- package/dist/reown.d.ts +1 -1
- package/dist/reown.mjs +4 -4
- package/dist/{types-DTBfMH0p.d.ts → types-Bp2n2RQ3.d.ts} +0 -1
- package/dist/{types-DELv717e.d.cts → types-CIaQPR6F.d.cts} +0 -1
- package/dist/withdraw.cjs +4 -4
- package/dist/withdraw.d.cts +2 -2
- package/dist/withdraw.d.ts +2 -2
- package/dist/withdraw.mjs +3 -3
- package/package.json +1 -1
|
@@ -21,7 +21,7 @@ import {
|
|
|
21
21
|
portfolioToAssets,
|
|
22
22
|
saveSessionOwnerToStorage,
|
|
23
23
|
tokenFormatter
|
|
24
|
-
} from "./chunk-
|
|
24
|
+
} from "./chunk-DLFUXLAM.mjs";
|
|
25
25
|
import {
|
|
26
26
|
DEFAULT_BACKEND_URL,
|
|
27
27
|
DEFAULT_SIGNER_ADDRESS,
|
|
@@ -35,12 +35,13 @@ import {
|
|
|
35
35
|
getTargetTokenSymbolsForChain,
|
|
36
36
|
getTokenAddress,
|
|
37
37
|
getTokenIcon,
|
|
38
|
-
getTokenSymbol
|
|
39
|
-
|
|
38
|
+
getTokenSymbol,
|
|
39
|
+
isStablecoinSymbol
|
|
40
|
+
} from "./chunk-C6I5TFSL.mjs";
|
|
40
41
|
|
|
41
42
|
// src/DepositModal.tsx
|
|
42
43
|
import {
|
|
43
|
-
useMemo as
|
|
44
|
+
useMemo as useMemo6,
|
|
44
45
|
useEffect as useEffect7,
|
|
45
46
|
useRef as useRef5,
|
|
46
47
|
useState as useState8,
|
|
@@ -50,7 +51,7 @@ import {
|
|
|
50
51
|
} from "react";
|
|
51
52
|
|
|
52
53
|
// src/DepositFlow.tsx
|
|
53
|
-
import { useState as useState7, useCallback as useCallback3, useMemo as
|
|
54
|
+
import { useState as useState7, useCallback as useCallback3, useMemo as useMemo5, useEffect as useEffect6, useRef as useRef4 } from "react";
|
|
54
55
|
|
|
55
56
|
// src/components/steps/SetupStep.tsx
|
|
56
57
|
import { useState, useEffect, useRef, useCallback } from "react";
|
|
@@ -249,7 +250,8 @@ function AssetSelectStep({
|
|
|
249
250
|
defaultSourceToken,
|
|
250
251
|
service,
|
|
251
252
|
onContinue,
|
|
252
|
-
onTotalBalanceComputed
|
|
253
|
+
onTotalBalanceComputed,
|
|
254
|
+
onAssetsLoaded
|
|
253
255
|
}) {
|
|
254
256
|
const [assets, setAssets] = useState2([]);
|
|
255
257
|
const [selectedAssetId, setSelectedAssetId] = useState2(null);
|
|
@@ -316,7 +318,8 @@ function AssetSelectStep({
|
|
|
316
318
|
0
|
|
317
319
|
);
|
|
318
320
|
onTotalBalanceComputed?.(total);
|
|
319
|
-
|
|
321
|
+
if (assets.length > 0) onAssetsLoaded?.(assets);
|
|
322
|
+
}, [assets, onTotalBalanceComputed, onAssetsLoaded]);
|
|
320
323
|
const rows = useMemo(() => {
|
|
321
324
|
return assets.filter((a) => {
|
|
322
325
|
try {
|
|
@@ -509,7 +512,7 @@ function mergeAssets(existing, incoming) {
|
|
|
509
512
|
// src/components/steps/AmountStep.tsx
|
|
510
513
|
import { useEffect as useEffect3, useMemo as useMemo2, useState as useState3, useRef as useRef2 } from "react";
|
|
511
514
|
import { erc20Abi, formatUnits as formatUnits2, parseUnits } from "viem";
|
|
512
|
-
import {
|
|
515
|
+
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
513
516
|
function AmountStep({
|
|
514
517
|
walletClient,
|
|
515
518
|
publicClient,
|
|
@@ -533,6 +536,8 @@ function AmountStep({
|
|
|
533
536
|
const chainMismatch = Boolean(
|
|
534
537
|
walletClient?.chain?.id && walletClient.chain.id !== asset.chainId
|
|
535
538
|
);
|
|
539
|
+
const targetSymbol = getTokenSymbol(targetToken, targetChain);
|
|
540
|
+
const isSourceStablecoin = isStablecoinSymbol(asset.symbol);
|
|
536
541
|
const tokenPriceUsd = useMemo2(() => {
|
|
537
542
|
if (tokenPriceUsdOverride !== void 0 && tokenPriceUsdOverride > 0)
|
|
538
543
|
return tokenPriceUsdOverride;
|
|
@@ -592,15 +597,10 @@ function AmountStep({
|
|
|
592
597
|
if (defaultAmount && !amount) {
|
|
593
598
|
const parsed = Number(defaultAmount);
|
|
594
599
|
if (Number.isFinite(parsed) && parsed > 0) {
|
|
595
|
-
|
|
596
|
-
const usdValue = parsed * tokenPriceUsd;
|
|
597
|
-
setAmount(usdValue.toFixed(2));
|
|
598
|
-
} else {
|
|
599
|
-
setAmount(parsed.toString());
|
|
600
|
-
}
|
|
600
|
+
setAmount(parsed.toString());
|
|
601
601
|
}
|
|
602
602
|
}
|
|
603
|
-
}, [defaultAmount,
|
|
603
|
+
}, [defaultAmount, amount]);
|
|
604
604
|
const balanceUsd = useMemo2(() => {
|
|
605
605
|
if (balance === null || tokenPriceUsd === null) return null;
|
|
606
606
|
try {
|
|
@@ -625,36 +625,24 @@ function AmountStep({
|
|
|
625
625
|
return "...";
|
|
626
626
|
}
|
|
627
627
|
}, [balance, asset.decimals]);
|
|
628
|
-
const tokenAmount = useMemo2(() => {
|
|
629
|
-
if (!amount) return null;
|
|
630
|
-
if (hasPricing) {
|
|
631
|
-
const usd = Number(amount);
|
|
632
|
-
if (!Number.isFinite(usd) || usd <= 0) return null;
|
|
633
|
-
return usd / tokenPriceUsd;
|
|
634
|
-
}
|
|
635
|
-
const val = Number(amount);
|
|
636
|
-
return Number.isFinite(val) && val > 0 ? val : null;
|
|
637
|
-
}, [amount, tokenPriceUsd, hasPricing]);
|
|
638
|
-
const formattedTokenAmount = useMemo2(() => {
|
|
639
|
-
if (tokenAmount === null) return "0.00";
|
|
640
|
-
return tokenFormatter.format(tokenAmount);
|
|
641
|
-
}, [tokenAmount]);
|
|
642
|
-
const targetSymbol = getTokenSymbol(targetToken, targetChain);
|
|
643
628
|
const handlePresetClick = (percentage) => {
|
|
644
629
|
if (balance === null) return;
|
|
645
|
-
|
|
646
|
-
const
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
setAmount(value.toString());
|
|
654
|
-
}
|
|
655
|
-
} catch {
|
|
656
|
-
return;
|
|
630
|
+
try {
|
|
631
|
+
const balanceUnits = Number(formatUnits2(balance, asset.decimals));
|
|
632
|
+
if (!Number.isFinite(balanceUnits)) return;
|
|
633
|
+
let value;
|
|
634
|
+
if (isSourceStablecoin || !hasPricing) {
|
|
635
|
+
value = balanceUnits * percentage / 100;
|
|
636
|
+
} else {
|
|
637
|
+
value = (balanceUsd ?? 0) * percentage / 100;
|
|
657
638
|
}
|
|
639
|
+
const maxDecimals = 3;
|
|
640
|
+
const factor = 10 ** maxDecimals;
|
|
641
|
+
const truncated = Math.floor(value * factor) / factor;
|
|
642
|
+
const formatted = truncated.toFixed(maxDecimals).replace(/\.?0+$/, "");
|
|
643
|
+
setAmount(formatted);
|
|
644
|
+
} catch {
|
|
645
|
+
return;
|
|
658
646
|
}
|
|
659
647
|
if (error) setError(null);
|
|
660
648
|
};
|
|
@@ -664,24 +652,28 @@ function AmountStep({
|
|
|
664
652
|
setError("Please enter a valid amount");
|
|
665
653
|
return;
|
|
666
654
|
}
|
|
667
|
-
let
|
|
655
|
+
let sourceAmount;
|
|
656
|
+
if (isSourceStablecoin || !hasPricing) {
|
|
657
|
+
sourceAmount = numericAmount;
|
|
658
|
+
} else {
|
|
659
|
+
sourceAmount = numericAmount / tokenPriceUsd;
|
|
660
|
+
}
|
|
668
661
|
if (hasPricing) {
|
|
669
|
-
|
|
662
|
+
const usdValue = numericAmount;
|
|
663
|
+
if (uiConfig?.maxDepositUsd && usdValue > uiConfig.maxDepositUsd) {
|
|
670
664
|
setError(
|
|
671
665
|
`Maximum deposit is ${currencyFormatter.format(uiConfig.maxDepositUsd)}`
|
|
672
666
|
);
|
|
673
667
|
return;
|
|
674
668
|
}
|
|
675
|
-
if (uiConfig?.minDepositUsd &&
|
|
669
|
+
if (uiConfig?.minDepositUsd && usdValue < uiConfig.minDepositUsd) {
|
|
676
670
|
setError(
|
|
677
671
|
`Minimum deposit is ${currencyFormatter.format(uiConfig.minDepositUsd)}`
|
|
678
672
|
);
|
|
679
673
|
return;
|
|
680
674
|
}
|
|
681
|
-
tokenAmountStr = (numericAmount / tokenPriceUsd).toString();
|
|
682
|
-
} else {
|
|
683
|
-
tokenAmountStr = numericAmount.toString();
|
|
684
675
|
}
|
|
676
|
+
const tokenAmountStr = sourceAmount.toString();
|
|
685
677
|
let amountInUnits;
|
|
686
678
|
try {
|
|
687
679
|
amountInUnits = parseUnits(tokenAmountStr, asset.decimals);
|
|
@@ -694,7 +686,7 @@ function AmountStep({
|
|
|
694
686
|
return;
|
|
695
687
|
}
|
|
696
688
|
setError(null);
|
|
697
|
-
onContinue(tokenAmountStr, balance ?? void 0);
|
|
689
|
+
onContinue(tokenAmountStr, amount, balance ?? void 0);
|
|
698
690
|
};
|
|
699
691
|
const handleSwitch = async () => {
|
|
700
692
|
if (!asset.chainId || !switchChain) return;
|
|
@@ -711,7 +703,7 @@ function AmountStep({
|
|
|
711
703
|
return /* @__PURE__ */ jsxs3("div", { className: "rs-step", children: [
|
|
712
704
|
/* @__PURE__ */ jsxs3("div", { className: "rs-step-body", style: { paddingTop: 0 }, children: [
|
|
713
705
|
/* @__PURE__ */ jsxs3("div", { className: "rs-amount-display", children: [
|
|
714
|
-
/* @__PURE__ */ jsx3("div", { className: "rs-amount-input-wrapper", children:
|
|
706
|
+
/* @__PURE__ */ jsx3("div", { className: "rs-amount-input-wrapper", children: /* @__PURE__ */ jsx3(
|
|
715
707
|
"input",
|
|
716
708
|
{
|
|
717
709
|
type: "text",
|
|
@@ -728,50 +720,19 @@ function AmountStep({
|
|
|
728
720
|
},
|
|
729
721
|
autoFocus: true
|
|
730
722
|
}
|
|
731
|
-
) : /* @__PURE__ */ jsx3(
|
|
732
|
-
"input",
|
|
733
|
-
{
|
|
734
|
-
type: "text",
|
|
735
|
-
inputMode: "decimal",
|
|
736
|
-
className: "rs-amount-input-large",
|
|
737
|
-
placeholder: `0.00 ${asset.symbol}`,
|
|
738
|
-
value: amount,
|
|
739
|
-
onChange: (e) => {
|
|
740
|
-
const raw = e.target.value.replace(/[^0-9.]/g, "");
|
|
741
|
-
const parts = raw.split(".");
|
|
742
|
-
if (parts.length > 2) return;
|
|
743
|
-
setAmount(raw);
|
|
744
|
-
if (error) setError(null);
|
|
745
|
-
},
|
|
746
|
-
autoFocus: true
|
|
747
|
-
}
|
|
748
723
|
) }),
|
|
749
|
-
(
|
|
750
|
-
|
|
751
|
-
|
|
724
|
+
!isSourceStablecoin && /* @__PURE__ */ jsx3("div", { className: "rs-amount-available", children: /* @__PURE__ */ jsxs3("span", { className: "rs-amount-available-value", children: [
|
|
725
|
+
formattedBalance,
|
|
726
|
+
" ",
|
|
727
|
+
asset.symbol,
|
|
728
|
+
" available",
|
|
729
|
+
hasPricing && balanceUsd !== null && /* @__PURE__ */ jsxs3("span", { style: { color: "var(--rs-muted-foreground)" }, children: [
|
|
752
730
|
" ",
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
"
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
style: { color: "var(--rs-muted-foreground)" },
|
|
759
|
-
children: "Price unavailable"
|
|
760
|
-
}
|
|
761
|
-
),
|
|
762
|
-
/* @__PURE__ */ jsx3("div", { className: "rs-amount-available", children: /* @__PURE__ */ jsxs3("span", { className: "rs-amount-available-value", children: [
|
|
763
|
-
formattedBalance,
|
|
764
|
-
" ",
|
|
765
|
-
asset.symbol,
|
|
766
|
-
" available",
|
|
767
|
-
hasPricing && balanceUsd !== null && /* @__PURE__ */ jsxs3("span", { style: { color: "var(--rs-muted-foreground)" }, children: [
|
|
768
|
-
" ",
|
|
769
|
-
"(",
|
|
770
|
-
currencyFormatter.format(balanceUsd),
|
|
771
|
-
")"
|
|
772
|
-
] })
|
|
773
|
-
] }) })
|
|
774
|
-
] })
|
|
731
|
+
"(",
|
|
732
|
+
currencyFormatter.format(balanceUsd),
|
|
733
|
+
")"
|
|
734
|
+
] })
|
|
735
|
+
] }) })
|
|
775
736
|
] }),
|
|
776
737
|
/* @__PURE__ */ jsx3(
|
|
777
738
|
"div",
|
|
@@ -904,22 +865,13 @@ function AmountStep({
|
|
|
904
865
|
}
|
|
905
866
|
)
|
|
906
867
|
] }),
|
|
907
|
-
chainMismatch && /* @__PURE__ */ jsxs3("div", { className: "rs-chain-switch", style: { marginTop: 16 }, children: [
|
|
868
|
+
chainMismatch && !isSwitching && /* @__PURE__ */ jsxs3("div", { className: "rs-chain-switch", style: { marginTop: 16 }, children: [
|
|
908
869
|
/* @__PURE__ */ jsxs3("div", { className: "rs-chain-switch-text", children: [
|
|
909
870
|
"Switch your wallet to ",
|
|
910
871
|
getChainName(asset.chainId),
|
|
911
872
|
" to continue."
|
|
912
873
|
] }),
|
|
913
|
-
switchChain && /* @__PURE__ */ jsx3(
|
|
914
|
-
Button,
|
|
915
|
-
{
|
|
916
|
-
variant: "outline",
|
|
917
|
-
size: "small",
|
|
918
|
-
loading: isSwitching,
|
|
919
|
-
onClick: handleSwitch,
|
|
920
|
-
children: "Switch"
|
|
921
|
-
}
|
|
922
|
-
)
|
|
874
|
+
switchChain && /* @__PURE__ */ jsx3(Button, { variant: "outline", size: "small", onClick: handleSwitch, children: "Switch" })
|
|
923
875
|
] }),
|
|
924
876
|
error && /* @__PURE__ */ jsxs3("div", { className: "rs-amount-error", children: [
|
|
925
877
|
/* @__PURE__ */ jsx3(
|
|
@@ -957,10 +909,9 @@ function AmountStep({
|
|
|
957
909
|
}
|
|
958
910
|
|
|
959
911
|
// src/components/steps/ConfirmStep.tsx
|
|
960
|
-
import {
|
|
961
|
-
import { erc20Abi as erc20Abi2,
|
|
912
|
+
import { useState as useState4 } from "react";
|
|
913
|
+
import { erc20Abi as erc20Abi2, parseUnits as parseUnits2 } from "viem";
|
|
962
914
|
import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
963
|
-
var STABLECOIN_SYMBOLS = /* @__PURE__ */ new Set(["USDC", "USDT", "DAI"]);
|
|
964
915
|
function ConfirmStep({
|
|
965
916
|
walletClient,
|
|
966
917
|
address,
|
|
@@ -968,6 +919,8 @@ function ConfirmStep({
|
|
|
968
919
|
recipient,
|
|
969
920
|
asset,
|
|
970
921
|
amount,
|
|
922
|
+
targetAmount,
|
|
923
|
+
targetTokenPriceUsd,
|
|
971
924
|
balance,
|
|
972
925
|
targetChain,
|
|
973
926
|
targetToken,
|
|
@@ -982,51 +935,17 @@ function ConfirmStep({
|
|
|
982
935
|
const chainMismatch = walletClient?.chain?.id && walletClient.chain.id !== asset.chainId;
|
|
983
936
|
const sameRoute = targetChain === asset.chainId && targetToken.toLowerCase() === asset.token.toLowerCase();
|
|
984
937
|
const targetSymbol = sameRoute ? asset.symbol : getTokenSymbol(targetToken, targetChain);
|
|
985
|
-
const
|
|
986
|
-
const
|
|
987
|
-
if (
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
return asset.balanceUsd / balanceUnits;
|
|
994
|
-
} catch {
|
|
995
|
-
return null;
|
|
996
|
-
}
|
|
997
|
-
}, [asset.balanceUsd, asset.balance, asset.decimals]);
|
|
998
|
-
const amountUsd = useMemo3(() => {
|
|
999
|
-
if (!amount || tokenPriceUsd === null) return null;
|
|
1000
|
-
const parsed = Number(amount);
|
|
1001
|
-
if (!Number.isFinite(parsed) || parsed <= 0) return null;
|
|
1002
|
-
return parsed * tokenPriceUsd;
|
|
1003
|
-
}, [amount, tokenPriceUsd]);
|
|
1004
|
-
const targetTokenPriceUsd = useMemo3(() => {
|
|
1005
|
-
const targetSym = targetSymbol.toUpperCase();
|
|
1006
|
-
const sourceSym = asset.symbol.toUpperCase();
|
|
1007
|
-
if (STABLECOIN_SYMBOLS.has(targetSym)) return 1;
|
|
1008
|
-
if (targetSym === sourceSym && tokenPriceUsd !== null) return tokenPriceUsd;
|
|
1009
|
-
return null;
|
|
1010
|
-
}, [targetSymbol, asset.symbol, tokenPriceUsd]);
|
|
1011
|
-
const receiveAmountUsd = useMemo3(() => {
|
|
1012
|
-
if (amountUsd === null) return null;
|
|
1013
|
-
return sameRoute ? amountUsd : amountUsd * 0.99;
|
|
1014
|
-
}, [amountUsd, sameRoute]);
|
|
1015
|
-
const receiveTokenAmount = useMemo3(() => {
|
|
1016
|
-
if (sameRoute) {
|
|
1017
|
-
const parsed = Number(amount);
|
|
1018
|
-
return Number.isFinite(parsed) ? parsed : null;
|
|
938
|
+
const formattedSendAmount = amount && !Number.isNaN(Number(amount)) ? Number(amount).toLocaleString("en-US", { maximumFractionDigits: 6 }) : "0";
|
|
939
|
+
const formattedReceiveAmount = (() => {
|
|
940
|
+
if (sameRoute) return formattedSendAmount;
|
|
941
|
+
const dollarValue = Number(targetAmount);
|
|
942
|
+
if (!Number.isFinite(dollarValue) || dollarValue <= 0) return formattedSendAmount;
|
|
943
|
+
if (targetTokenPriceUsd !== null && targetTokenPriceUsd > 0) {
|
|
944
|
+
const tokenAmount = dollarValue / targetTokenPriceUsd;
|
|
945
|
+
return tokenAmount.toLocaleString("en-US", { maximumFractionDigits: 6 });
|
|
1019
946
|
}
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
return receiveAmountUsd / targetTokenPriceUsd;
|
|
1023
|
-
}, [sameRoute, amount, receiveAmountUsd, targetTokenPriceUsd]);
|
|
1024
|
-
const formattedReceiveAmount = useMemo3(() => {
|
|
1025
|
-
if (receiveTokenAmount === null) return formattedAmount;
|
|
1026
|
-
return receiveTokenAmount.toLocaleString("en-US", {
|
|
1027
|
-
maximumFractionDigits: 6
|
|
1028
|
-
});
|
|
1029
|
-
}, [receiveTokenAmount, formattedAmount]);
|
|
947
|
+
return formattedSendAmount;
|
|
948
|
+
})();
|
|
1030
949
|
const receiveAmount = sameRoute ? formattedReceiveAmount : `~ ${formattedReceiveAmount}`;
|
|
1031
950
|
const handleConfirm = async () => {
|
|
1032
951
|
if (!address || !walletClient) {
|
|
@@ -1166,7 +1085,7 @@ function ConfirmStep({
|
|
|
1166
1085
|
style: { width: 16, height: 16, borderRadius: "50%" }
|
|
1167
1086
|
}
|
|
1168
1087
|
),
|
|
1169
|
-
|
|
1088
|
+
formattedSendAmount,
|
|
1170
1089
|
" ",
|
|
1171
1090
|
asset.symbol
|
|
1172
1091
|
]
|
|
@@ -1195,10 +1114,6 @@ function ConfirmStep({
|
|
|
1195
1114
|
]
|
|
1196
1115
|
}
|
|
1197
1116
|
)
|
|
1198
|
-
] }),
|
|
1199
|
-
receiveAmountUsd !== null && /* @__PURE__ */ jsxs4("div", { className: "rs-card-row", children: [
|
|
1200
|
-
/* @__PURE__ */ jsx4("span", { className: "rs-card-label", children: "Value" }),
|
|
1201
|
-
/* @__PURE__ */ jsx4("span", { className: "rs-card-value", children: currencyFormatter.format(receiveAmountUsd) })
|
|
1202
1117
|
] })
|
|
1203
1118
|
] }),
|
|
1204
1119
|
chainMismatch && /* @__PURE__ */ jsxs4("div", { className: "rs-chain-switch", children: [
|
|
@@ -1255,11 +1170,11 @@ function ConfirmStep({
|
|
|
1255
1170
|
}
|
|
1256
1171
|
|
|
1257
1172
|
// src/components/steps/DepositAddressStep.tsx
|
|
1258
|
-
import { useState as useState6, useEffect as useEffect5, useCallback as useCallback2, useRef as useRef3, useMemo as
|
|
1173
|
+
import { useState as useState6, useEffect as useEffect5, useCallback as useCallback2, useRef as useRef3, useMemo as useMemo4 } from "react";
|
|
1259
1174
|
|
|
1260
1175
|
// src/components/ui/QRCode.tsx
|
|
1261
|
-
import { useEffect as useEffect4, useMemo as
|
|
1262
|
-
import { Fragment as
|
|
1176
|
+
import { useEffect as useEffect4, useMemo as useMemo3, useState as useState5 } from "react";
|
|
1177
|
+
import { Fragment as Fragment2, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
1263
1178
|
function QRCode({ value, size = 200, iconSrc, className }) {
|
|
1264
1179
|
const [createQrCode, setCreateQrCode] = useState5(null);
|
|
1265
1180
|
useEffect4(() => {
|
|
@@ -1277,7 +1192,7 @@ function QRCode({ value, size = 200, iconSrc, className }) {
|
|
|
1277
1192
|
mounted = false;
|
|
1278
1193
|
};
|
|
1279
1194
|
}, []);
|
|
1280
|
-
const svgContent =
|
|
1195
|
+
const svgContent = useMemo3(() => {
|
|
1281
1196
|
if (!createQrCode) {
|
|
1282
1197
|
return null;
|
|
1283
1198
|
}
|
|
@@ -1317,7 +1232,7 @@ function QRCode({ value, size = 200, iconSrc, className }) {
|
|
|
1317
1232
|
children: [
|
|
1318
1233
|
/* @__PURE__ */ jsx5("rect", { width: size, height: size, fill: "white", rx: 4 }),
|
|
1319
1234
|
svgContent ? /* @__PURE__ */ jsx5("path", { d: svgContent.paths, fill: "black" }) : /* @__PURE__ */ jsx5("rect", { x: 8, y: 8, width: size - 16, height: size - 16, fill: "#f1f5f9" }),
|
|
1320
|
-
iconSrc && /* @__PURE__ */ jsxs5(
|
|
1235
|
+
iconSrc && /* @__PURE__ */ jsxs5(Fragment2, { children: [
|
|
1321
1236
|
/* @__PURE__ */ jsx5(
|
|
1322
1237
|
"rect",
|
|
1323
1238
|
{
|
|
@@ -1395,11 +1310,11 @@ function DepositAddressStep({
|
|
|
1395
1310
|
onDepositDetected,
|
|
1396
1311
|
onError
|
|
1397
1312
|
}) {
|
|
1398
|
-
const supportedChainIds =
|
|
1313
|
+
const supportedChainIds = useMemo4(() => getSupportedChainIds(), []);
|
|
1399
1314
|
const BASE_CHAIN_ID = 8453;
|
|
1400
1315
|
const defaultChainId = supportedChainIds.includes(BASE_CHAIN_ID) ? BASE_CHAIN_ID : supportedChainIds[0];
|
|
1401
1316
|
const [sourceChainId, setSourceChainId] = useState6(defaultChainId);
|
|
1402
|
-
const tokensForChain =
|
|
1317
|
+
const tokensForChain = useMemo4(
|
|
1403
1318
|
() => getTargetTokenSymbolsForChain(sourceChainId),
|
|
1404
1319
|
[sourceChainId]
|
|
1405
1320
|
);
|
|
@@ -1695,6 +1610,7 @@ function DepositFlow({
|
|
|
1695
1610
|
waitForFinalTx = true,
|
|
1696
1611
|
reownWallet,
|
|
1697
1612
|
onConnect,
|
|
1613
|
+
onDisconnect,
|
|
1698
1614
|
onRequestConnect,
|
|
1699
1615
|
connectButtonLabel,
|
|
1700
1616
|
uiConfig,
|
|
@@ -1713,13 +1629,30 @@ function DepositFlow({
|
|
|
1713
1629
|
const [totalBalanceUsd, setTotalBalanceUsd] = useState7(0);
|
|
1714
1630
|
const [isConnectSelectionConfirmed, setIsConnectSelectionConfirmed] = useState7(false);
|
|
1715
1631
|
const [selectedConnectAddress, setSelectedConnectAddress] = useState7(null);
|
|
1716
|
-
const
|
|
1632
|
+
const portfolioAssetsRef = useRef4([]);
|
|
1633
|
+
const handleAssetsLoaded = useCallback3((assets) => {
|
|
1634
|
+
portfolioAssetsRef.current = assets;
|
|
1635
|
+
}, []);
|
|
1636
|
+
const getTokenPriceUsd = useCallback3((symbol) => {
|
|
1637
|
+
const sym = symbol.toLowerCase();
|
|
1638
|
+
for (const asset of portfolioAssetsRef.current) {
|
|
1639
|
+
if (asset.symbol.toLowerCase() === sym && asset.balanceUsd && asset.balance) {
|
|
1640
|
+
try {
|
|
1641
|
+
const balanceUnits = Number(asset.balance) / 10 ** asset.decimals;
|
|
1642
|
+
if (balanceUnits > 0) return asset.balanceUsd / balanceUnits;
|
|
1643
|
+
} catch {
|
|
1644
|
+
}
|
|
1645
|
+
}
|
|
1646
|
+
}
|
|
1647
|
+
return null;
|
|
1648
|
+
}, []);
|
|
1649
|
+
const dappSwitchChain = useMemo5(() => {
|
|
1717
1650
|
if (!dappWalletClient?.switchChain) return void 0;
|
|
1718
1651
|
return async (chainId) => {
|
|
1719
1652
|
await dappWalletClient.switchChain?.({ id: chainId });
|
|
1720
1653
|
};
|
|
1721
1654
|
}, [dappWalletClient]);
|
|
1722
|
-
const walletOptions =
|
|
1655
|
+
const walletOptions = useMemo5(() => {
|
|
1723
1656
|
const options = [];
|
|
1724
1657
|
const seen = /* @__PURE__ */ new Set();
|
|
1725
1658
|
if (dappWalletClient?.account && dappAddress) {
|
|
@@ -1749,7 +1682,7 @@ function DepositFlow({
|
|
|
1749
1682
|
const canAutoLock = dappWalletClient?.account && dappAddress && !reownWallet;
|
|
1750
1683
|
const hasWalletOptions = walletOptions.length > 0;
|
|
1751
1684
|
const showConnectStep = !canAutoLock && !isConnectSelectionConfirmed;
|
|
1752
|
-
const signerContext =
|
|
1685
|
+
const signerContext = useMemo5(() => {
|
|
1753
1686
|
if (flowMode === "deposit-address") {
|
|
1754
1687
|
if (!dappAddress) return null;
|
|
1755
1688
|
return {
|
|
@@ -1836,8 +1769,7 @@ function DepositFlow({
|
|
|
1836
1769
|
return {
|
|
1837
1770
|
type: "amount",
|
|
1838
1771
|
smartAccount: prev.smartAccount,
|
|
1839
|
-
asset: prev.asset
|
|
1840
|
-
amount: prev.amount
|
|
1772
|
+
asset: prev.asset
|
|
1841
1773
|
};
|
|
1842
1774
|
});
|
|
1843
1775
|
}, []);
|
|
@@ -1910,7 +1842,10 @@ function DepositFlow({
|
|
|
1910
1842
|
[defaultAmount]
|
|
1911
1843
|
);
|
|
1912
1844
|
const handleAmountContinue = useCallback3(
|
|
1913
|
-
(amount, balance) => {
|
|
1845
|
+
(amount, targetAmount, balance) => {
|
|
1846
|
+
const targetSym = getTokenSymbol(targetToken, targetChain);
|
|
1847
|
+
const isTargetStable = isStablecoinSymbol(targetSym);
|
|
1848
|
+
const targetTokenPriceUsd = isTargetStable ? 1 : getTokenPriceUsd(targetSym);
|
|
1914
1849
|
setStep((prev) => {
|
|
1915
1850
|
if (prev.type !== "amount") return prev;
|
|
1916
1851
|
return {
|
|
@@ -1918,11 +1853,13 @@ function DepositFlow({
|
|
|
1918
1853
|
smartAccount: prev.smartAccount,
|
|
1919
1854
|
asset: prev.asset,
|
|
1920
1855
|
amount,
|
|
1856
|
+
targetAmount,
|
|
1857
|
+
targetTokenPriceUsd,
|
|
1921
1858
|
balance
|
|
1922
1859
|
};
|
|
1923
1860
|
});
|
|
1924
1861
|
},
|
|
1925
|
-
[]
|
|
1862
|
+
[targetToken, targetChain, getTokenPriceUsd]
|
|
1926
1863
|
);
|
|
1927
1864
|
const handleDepositSubmitted = useCallback3(
|
|
1928
1865
|
(txHash, chainId, amount, token) => {
|
|
@@ -1968,14 +1905,14 @@ function DepositFlow({
|
|
|
1968
1905
|
const handleTotalBalanceComputed = useCallback3((total) => {
|
|
1969
1906
|
setTotalBalanceUsd(total);
|
|
1970
1907
|
}, []);
|
|
1971
|
-
const selectedConnectAddressEffective =
|
|
1908
|
+
const selectedConnectAddressEffective = useMemo5(() => {
|
|
1972
1909
|
if (selectedConnectAddress) return selectedConnectAddress;
|
|
1973
1910
|
if (walletOptions.length === 1) {
|
|
1974
1911
|
return walletOptions[0].address;
|
|
1975
1912
|
}
|
|
1976
1913
|
return null;
|
|
1977
1914
|
}, [selectedConnectAddress, walletOptions]);
|
|
1978
|
-
const walletOptionsKey =
|
|
1915
|
+
const walletOptionsKey = useMemo5(
|
|
1979
1916
|
() => walletOptions.map((option) => option.address.toLowerCase()).join(","),
|
|
1980
1917
|
[walletOptions]
|
|
1981
1918
|
);
|
|
@@ -2022,6 +1959,7 @@ function DepositFlow({
|
|
|
2022
1959
|
} : void 0,
|
|
2023
1960
|
onRequestConnect,
|
|
2024
1961
|
onConnect,
|
|
1962
|
+
onDisconnect,
|
|
2025
1963
|
onContinue: () => {
|
|
2026
1964
|
if (selectedConnectAddressEffective) {
|
|
2027
1965
|
setSelectedConnectAddress(selectedConnectAddressEffective);
|
|
@@ -2069,7 +2007,6 @@ function DepositFlow({
|
|
|
2069
2007
|
sourceChain: step.sourceChain,
|
|
2070
2008
|
sourceToken: step.sourceToken,
|
|
2071
2009
|
targetChain,
|
|
2072
|
-
targetToken,
|
|
2073
2010
|
amount: step.amount,
|
|
2074
2011
|
waitForFinalTx,
|
|
2075
2012
|
service,
|
|
@@ -2122,7 +2059,8 @@ function DepositFlow({
|
|
|
2122
2059
|
defaultSourceToken,
|
|
2123
2060
|
service,
|
|
2124
2061
|
onContinue: handleAssetContinue,
|
|
2125
|
-
onTotalBalanceComputed: handleTotalBalanceComputed
|
|
2062
|
+
onTotalBalanceComputed: handleTotalBalanceComputed,
|
|
2063
|
+
onAssetsLoaded: handleAssetsLoaded
|
|
2126
2064
|
}
|
|
2127
2065
|
),
|
|
2128
2066
|
step.type === "amount" && /* @__PURE__ */ jsx7(
|
|
@@ -2149,6 +2087,8 @@ function DepositFlow({
|
|
|
2149
2087
|
recipient,
|
|
2150
2088
|
asset: step.asset,
|
|
2151
2089
|
amount: step.amount,
|
|
2090
|
+
targetAmount: step.targetAmount,
|
|
2091
|
+
targetTokenPriceUsd: step.targetTokenPriceUsd,
|
|
2152
2092
|
balance: step.balance,
|
|
2153
2093
|
targetChain,
|
|
2154
2094
|
targetToken,
|
|
@@ -2166,7 +2106,6 @@ function DepositFlow({
|
|
|
2166
2106
|
sourceChain: step.sourceChain,
|
|
2167
2107
|
sourceToken: step.sourceToken,
|
|
2168
2108
|
targetChain,
|
|
2169
|
-
targetToken,
|
|
2170
2109
|
amount: step.amount,
|
|
2171
2110
|
waitForFinalTx,
|
|
2172
2111
|
service,
|
|
@@ -2184,7 +2123,7 @@ function DepositFlow({
|
|
|
2184
2123
|
// src/DepositModal.tsx
|
|
2185
2124
|
import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
2186
2125
|
var ReownDepositInner = lazy(
|
|
2187
|
-
() => import("./DepositModalReown-
|
|
2126
|
+
() => import("./DepositModalReown-SZPCCNPH.mjs").then((m) => ({ default: m.DepositModalReown }))
|
|
2188
2127
|
);
|
|
2189
2128
|
function DepositModal(props) {
|
|
2190
2129
|
const needsReown = !!props.reownAppId;
|
|
@@ -2214,6 +2153,7 @@ function DepositModalInner({
|
|
|
2214
2153
|
waitForFinalTx = true,
|
|
2215
2154
|
reownWallet,
|
|
2216
2155
|
onConnect,
|
|
2156
|
+
onDisconnect,
|
|
2217
2157
|
onRequestConnect,
|
|
2218
2158
|
connectButtonLabel,
|
|
2219
2159
|
theme,
|
|
@@ -2234,7 +2174,7 @@ function DepositModalInner({
|
|
|
2234
2174
|
const backHandlerRef = useRef5(void 0);
|
|
2235
2175
|
const targetChain = getChainId(targetChainProp);
|
|
2236
2176
|
const sourceChain = sourceChainProp ? getChainId(sourceChainProp) : void 0;
|
|
2237
|
-
const service =
|
|
2177
|
+
const service = useMemo6(() => createDepositService(backendUrl), [backendUrl]);
|
|
2238
2178
|
useEffect7(() => {
|
|
2239
2179
|
if (isOpen && modalRef.current) {
|
|
2240
2180
|
applyTheme(modalRef.current, theme);
|
|
@@ -2383,6 +2323,7 @@ function DepositModalInner({
|
|
|
2383
2323
|
waitForFinalTx,
|
|
2384
2324
|
reownWallet,
|
|
2385
2325
|
onConnect,
|
|
2326
|
+
onDisconnect,
|
|
2386
2327
|
onRequestConnect,
|
|
2387
2328
|
connectButtonLabel,
|
|
2388
2329
|
uiConfig,
|