@unifold/ui-react 0.1.42 → 0.1.43

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -32,6 +32,7 @@ var index_exports = {};
32
32
  __export(index_exports, {
33
33
  Button: () => Button,
34
34
  BuyWithCard: () => BuyWithCard,
35
+ CheckoutModal: () => CheckoutModal,
35
36
  ConfirmingView: () => ConfirmingView,
36
37
  CurrencyListItem: () => CurrencyListItem,
37
38
  CurrencyListSection: () => CurrencyListSection,
@@ -55,6 +56,7 @@ __export(index_exports, {
55
56
  DialogPortal: () => DialogPortal,
56
57
  DialogTitle: () => DialogTitle,
57
58
  DialogTrigger: () => DialogTrigger,
59
+ HYPERCORE_CHAIN_ID: () => HYPERCORE_CHAIN_ID,
58
60
  Select: () => Select,
59
61
  SelectContent: () => SelectContent,
60
62
  SelectGroup: () => SelectGroup,
@@ -86,14 +88,18 @@ __export(index_exports, {
86
88
  defaultColors: () => defaultColors,
87
89
  detectBrowserWallet: () => detectBrowserWallet,
88
90
  getColors: () => getColors,
91
+ isHypercoreChain: () => isHypercoreChain,
89
92
  mergeColors: () => mergeColors,
90
93
  resolveComponentTokens: () => resolveComponentTokens,
91
94
  sendEvmWithdraw: () => sendEvmWithdraw,
95
+ sendHypercoreWithdraw: () => sendHypercoreWithdraw,
92
96
  sendSolanaWithdraw: () => sendSolanaWithdraw,
93
97
  truncateAddress: () => truncateAddress,
94
98
  useAddressBalance: () => useAddressBalance,
95
99
  useAllowedCountry: () => useAllowedCountry,
96
100
  useDepositPolling: () => useDepositPolling,
101
+ useDepositQuote: () => useDepositQuote,
102
+ usePaymentIntent: () => usePaymentIntent,
97
103
  useSourceTokenValidation: () => useSourceTokenValidation,
98
104
  useSupportedDestinationTokens: () => useSupportedDestinationTokens,
99
105
  useTheme: () => useTheme,
@@ -1490,6 +1496,7 @@ var CUTOFF_BUFFER_MS = 6e4;
1490
1496
  function useDepositPolling({
1491
1497
  userId,
1492
1498
  publishableKey,
1499
+ clientSecret,
1493
1500
  depositConfirmationMode = "auto_ui",
1494
1501
  depositWalletId,
1495
1502
  enabled = true,
@@ -1547,11 +1554,12 @@ function useDepositPolling({
1547
1554
  depositWalletId
1548
1555
  ]);
1549
1556
  (0, import_react3.useEffect)(() => {
1550
- if (!userId || !enabled) return;
1557
+ if (!enabled) return;
1558
+ if (!clientSecret && !userId) return;
1551
1559
  const modalOpenedAt = modalOpenedAtRef.current;
1552
1560
  const poll = async () => {
1553
1561
  try {
1554
- const response = await (0, import_core6.queryExecutions)(userId, publishableKey, import_core6.ActionType.Deposit);
1562
+ const response = clientSecret ? await (0, import_core6.listPaymentIntentExecutions)(clientSecret, publishableKey) : await (0, import_core6.queryExecutions)(userId, publishableKey, import_core6.ActionType.Deposit);
1555
1563
  const cutoff = new Date(modalOpenedAt.getTime() - CUTOFF_BUFFER_MS);
1556
1564
  const sortedExecutions = [...response.data].sort((a, b) => {
1557
1565
  const timeA = a.created_at ? new Date(a.created_at).getTime() : 0;
@@ -1635,7 +1643,7 @@ function useDepositPolling({
1635
1643
  clearInterval(pollInterval);
1636
1644
  setIsPolling(false);
1637
1645
  };
1638
- }, [userId, publishableKey, enabled]);
1646
+ }, [userId, publishableKey, clientSecret, enabled]);
1639
1647
  (0, import_react3.useEffect)(() => {
1640
1648
  if (!pollingEnabled || !depositWalletId) return;
1641
1649
  const triggerPoll = async () => {
@@ -8372,6 +8380,7 @@ var parseChainKey = (chainKey) => {
8372
8380
  function TransferCryptoSingleInput({
8373
8381
  userId,
8374
8382
  publishableKey,
8383
+ clientSecret,
8375
8384
  recipientAddress,
8376
8385
  destinationChainType,
8377
8386
  destinationChainId,
@@ -8384,7 +8393,9 @@ function TransferCryptoSingleInput({
8384
8393
  onExecutionsChange,
8385
8394
  onDepositSuccess,
8386
8395
  onDepositError,
8387
- wallets: externalWallets
8396
+ wallets: externalWallets,
8397
+ onSourceTokenChange,
8398
+ checkoutQuote
8388
8399
  }) {
8389
8400
  const { themeClass, colors: colors2, fonts, components } = useTheme();
8390
8401
  const isDarkMode = themeClass.includes("uf-dark");
@@ -8451,12 +8462,28 @@ function TransferCryptoSingleInput({
8451
8462
  } = useDepositPolling({
8452
8463
  userId,
8453
8464
  publishableKey,
8465
+ clientSecret,
8454
8466
  depositConfirmationMode,
8455
8467
  depositWalletId: currentWallet?.id,
8456
8468
  enabled: true,
8457
8469
  onDepositSuccess,
8458
8470
  onDepositError
8459
8471
  });
8472
+ (0, import_react15.useEffect)(() => {
8473
+ if (!onSourceTokenChange || !token || !chain || !initialSelectionDone) return;
8474
+ const { chainType, chainId } = parseChainKey(chain);
8475
+ const matchedToken = supportedTokens.find((t11) => t11.symbol === token);
8476
+ const matchedChain = matchedToken?.chains.find(
8477
+ (c) => c.chain_type === chainType && c.chain_id === chainId
8478
+ );
8479
+ onSourceTokenChange({
8480
+ symbol: token,
8481
+ chainType,
8482
+ chainId,
8483
+ tokenAddress: matchedChain?.token_address ?? "",
8484
+ minimumDepositAmountUsd: matchedChain?.minimum_deposit_amount_usd ?? 0
8485
+ });
8486
+ }, [token, chain, initialSelectionDone, onSourceTokenChange, supportedTokens]);
8460
8487
  (0, import_react15.useEffect)(() => {
8461
8488
  if (onExecutionsChange) {
8462
8489
  onExecutionsChange(depositExecutions);
@@ -8603,6 +8630,53 @@ function TransferCryptoSingleInput({
8603
8630
  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { children: "Retrying automatically every 5 seconds..." })
8604
8631
  ] })
8605
8632
  ] }),
8633
+ checkoutQuote && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
8634
+ "div",
8635
+ {
8636
+ className: "uf-rounded-xl uf-px-3 uf-py-2 uf-flex uf-items-center uf-justify-between",
8637
+ style: {
8638
+ backgroundColor: components.card.backgroundColor,
8639
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`,
8640
+ borderRadius: components.card.borderRadius
8641
+ },
8642
+ children: [
8643
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
8644
+ "span",
8645
+ {
8646
+ className: "uf-text-xs",
8647
+ style: { color: components.card.subtitleColor, fontFamily: fonts.regular },
8648
+ children: "You send"
8649
+ }
8650
+ ),
8651
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
8652
+ "span",
8653
+ {
8654
+ className: "uf-text-sm uf-font-semibold",
8655
+ style: { color: components.card.titleColor, fontFamily: fonts.semibold },
8656
+ children: [
8657
+ (Number(checkoutQuote.sourceAmount) / 10 ** checkoutQuote.sourceTokenDecimals).toFixed(
8658
+ Math.min(checkoutQuote.sourceTokenDecimals, 6)
8659
+ ),
8660
+ " ",
8661
+ checkoutQuote.sourceTokenSymbol,
8662
+ checkoutQuote.sourceAmountUsd && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
8663
+ "span",
8664
+ {
8665
+ className: "uf-text-xs uf-font-normal uf-ml-1.5",
8666
+ style: { color: components.card.subtitleColor },
8667
+ children: [
8668
+ "($",
8669
+ checkoutQuote.sourceAmountUsd,
8670
+ ")"
8671
+ ]
8672
+ }
8673
+ )
8674
+ ]
8675
+ }
8676
+ )
8677
+ ]
8678
+ }
8679
+ ),
8606
8680
  /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-pt-2", children: [
8607
8681
  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "uf-text-xs uf-mb-2 uf-flex uf-items-center uf-gap-1", style: { color: components.card.labelColor }, children: "Intent address" }),
8608
8682
  /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "uf-shadow-lg", style: { borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: loading || tokensLoading || !initialSelectionDone ? (
@@ -9454,9 +9528,16 @@ function SelectTokenView({
9454
9528
  onBack,
9455
9529
  onClose,
9456
9530
  onDisconnectWallet,
9457
- isDisconnectingWallet = false
9531
+ isDisconnectingWallet = false,
9532
+ checkoutAmountUsd,
9533
+ checkoutReceivedUsd
9458
9534
  }) {
9459
9535
  const { colors: colors2, fonts, components } = useTheme();
9536
+ const isCheckout = !!checkoutAmountUsd;
9537
+ const headerSubtitle = isCheckout ? parseFloat(checkoutReceivedUsd || "0") > 0 ? `$${checkoutReceivedUsd} / $${checkoutAmountUsd} received` : `Amount due: $${checkoutAmountUsd}` : formatBalanceDisplay(
9538
+ `$${totalBalanceUsd || "0.00"}`,
9539
+ projectName
9540
+ );
9460
9541
  return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
9461
9542
  "div",
9462
9543
  {
@@ -9465,11 +9546,8 @@ function SelectTokenView({
9465
9546
  /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
9466
9547
  DepositHeader,
9467
9548
  {
9468
- title: "Select Token",
9469
- subtitle: formatBalanceDisplay(
9470
- `$${totalBalanceUsd || "0.00"}`,
9471
- projectName
9472
- ),
9549
+ title: isCheckout ? "Select Token" : "Select Token",
9550
+ subtitle: headerSubtitle,
9473
9551
  showBack: true,
9474
9552
  onBack,
9475
9553
  onClose
@@ -9700,10 +9778,19 @@ function EnterAmountView({
9700
9778
  onReview,
9701
9779
  onBack,
9702
9780
  onClose,
9703
- quickSelectMode
9781
+ quickSelectMode,
9782
+ checkoutAmountUsd,
9783
+ checkoutReceivedUsd
9704
9784
  }) {
9705
9785
  const { colors: colors2, fonts, components } = useTheme();
9786
+ const isCheckout = !!checkoutAmountUsd;
9706
9787
  const balanceSubtitle = selectedBalance?.amount_usd ? `Balance: $${parseFloat(selectedBalance.amount_usd).toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })} (${formatTokenAmount(selectedBalance.amount, selectedToken.decimals, selectedToken.symbol)} ${selectedToken.symbol})` : `Balance: ${formatTokenAmount(selectedBalance.amount, selectedToken.decimals, selectedToken.symbol)} ${selectedToken.symbol}`;
9788
+ const checkoutRemainingUsd = isCheckout ? Math.max(
9789
+ parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0"),
9790
+ 0
9791
+ ).toFixed(2) : null;
9792
+ const headerTitle = isCheckout ? `Pay $${checkoutRemainingUsd}` : "Enter Amount";
9793
+ const headerSubtitle = isCheckout ? parseFloat(checkoutReceivedUsd || "0") > 0 ? `$${checkoutReceivedUsd} / $${checkoutAmountUsd} received` : null : balanceSubtitle;
9707
9794
  const usePercentageChips = quickSelectMode === "percentage" && maxUsdAmount > 0;
9708
9795
  const chipButtonClass = "uf-flex-1 uf-min-w-0 uf-basis-0 uf-py-2 uf-px-1 uf-rounded-lg uf-text-sm uf-font-medium uf-transition-colors hover:uf-opacity-80 uf-whitespace-nowrap";
9709
9796
  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
@@ -9717,14 +9804,27 @@ function EnterAmountView({
9717
9804
  /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
9718
9805
  DepositHeader,
9719
9806
  {
9720
- title: "Enter Amount",
9721
- subtitle: balanceSubtitle,
9807
+ title: headerTitle,
9808
+ subtitle: headerSubtitle ?? void 0,
9722
9809
  showBack: true,
9723
9810
  onBack,
9724
9811
  onClose
9725
9812
  }
9726
9813
  ),
9727
- walletInfoProp ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "uf-flex uf-w-full uf-justify-center uf-mb-3", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(WalletWithNetworkBadge, { walletInfo: walletInfoProp }) }) : null,
9814
+ walletInfoProp ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "uf-flex uf-w-full uf-justify-center uf-mb-3", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-gap-1", children: [
9815
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(WalletWithNetworkBadge, { walletInfo: walletInfoProp }),
9816
+ isCheckout && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
9817
+ "span",
9818
+ {
9819
+ className: "uf-text-xs",
9820
+ style: {
9821
+ color: colors2.foregroundMuted,
9822
+ fontFamily: fonts.regular
9823
+ },
9824
+ children: balanceSubtitle
9825
+ }
9826
+ )
9827
+ ] }) }) : null,
9728
9828
  /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "uf-flex uf-min-h-0 uf-flex-1 uf-flex-col", children: [
9729
9829
  /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "uf-min-h-0 uf-flex-1", children: [
9730
9830
  /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "uf-text-center uf-py-8", children: [
@@ -9747,7 +9847,9 @@ function EnterAmountView({
9747
9847
  inputMode: "decimal",
9748
9848
  placeholder: "0",
9749
9849
  value: amountUsd,
9850
+ readOnly: isCheckout,
9750
9851
  onChange: (e) => {
9852
+ if (isCheckout) return;
9751
9853
  const value = e.target.value;
9752
9854
  if (value === "" || /^\d*\.?\d*$/.test(value)) {
9753
9855
  const decimalIndex = value.indexOf(".");
@@ -9758,7 +9860,7 @@ function EnterAmountView({
9758
9860
  onAmountChange(value);
9759
9861
  }
9760
9862
  },
9761
- className: "uf-bg-transparent uf-outline-none uf-text-center uf-font-normal uf-w-auto uf-min-w-[60px]",
9863
+ className: `uf-bg-transparent uf-outline-none uf-text-center uf-font-normal uf-w-auto uf-min-w-[60px] ${isCheckout ? "uf-cursor-default" : ""}`,
9762
9864
  style: {
9763
9865
  fontSize: `${Math.max(3.75 - (amountUsd || "0").length * 0.15, 2)}rem`,
9764
9866
  color: components.input.textColor,
@@ -9780,7 +9882,7 @@ function EnterAmountView({
9780
9882
  }
9781
9883
  )
9782
9884
  ] }),
9783
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "uf-mb-4 uf-flex uf-w-full uf-min-w-0 uf-flex-nowrap uf-gap-1.5 uf-overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: usePercentageChips ? /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_jsx_runtime46.Fragment, { children: [
9885
+ !isCheckout && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "uf-mb-4 uf-flex uf-w-full uf-min-w-0 uf-flex-nowrap uf-gap-1.5 uf-overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: usePercentageChips ? /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(import_jsx_runtime46.Fragment, { children: [
9784
9886
  PERCENT_QUICK_AMOUNTS.map((pct) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
9785
9887
  "button",
9786
9888
  {
@@ -9849,7 +9951,46 @@ function EnterAmountView({
9849
9951
  }
9850
9952
  )
9851
9953
  ] }) }),
9852
- tokenChainDetails && tokenChainDetails.minimum_deposit_amount_usd > 0 && /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
9954
+ tokenChainDetails && tokenChainDetails.minimum_deposit_amount_usd > 0 && (isCheckout && checkoutAmountUsd && inputUsdNum > parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0") + 5e-3 ? /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
9955
+ "div",
9956
+ {
9957
+ className: "uf-rounded-lg uf-px-3 uf-py-2 uf-mb-3 uf-text-center",
9958
+ style: {
9959
+ backgroundColor: colors2.warning + "15",
9960
+ border: `1px solid ${colors2.warning}30`,
9961
+ borderRadius: components.card.borderRadius,
9962
+ animation: "uf-fadeSlideIn 0.4s ease-out"
9963
+ },
9964
+ children: [
9965
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
9966
+ "div",
9967
+ {
9968
+ className: "uf-text-xs uf-font-medium",
9969
+ style: { color: colors2.warning, fontFamily: fonts.medium },
9970
+ children: [
9971
+ "Minimum for ",
9972
+ selectedToken.symbol,
9973
+ " on ",
9974
+ selectedToken.chain_name,
9975
+ " is $",
9976
+ tokenChainDetails.minimum_deposit_amount_usd.toFixed(2)
9977
+ ]
9978
+ }
9979
+ ),
9980
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
9981
+ "div",
9982
+ {
9983
+ className: "uf-text-xs uf-mt-0.5",
9984
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
9985
+ children: [
9986
+ "Amount adjusted from remaining $",
9987
+ (parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0")).toFixed(2)
9988
+ ]
9989
+ }
9990
+ )
9991
+ ]
9992
+ }
9993
+ ) : /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
9853
9994
  "div",
9854
9995
  {
9855
9996
  className: "uf-text-center uf-text-xs uf-mb-3",
@@ -9859,7 +10000,7 @@ function EnterAmountView({
9859
10000
  tokenChainDetails.minimum_deposit_amount_usd.toFixed(2)
9860
10001
  ]
9861
10002
  }
9862
- ),
10003
+ )),
9863
10004
  inputUsdNum > 0 && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_jsx_runtime46.Fragment, { children: inputUsdNum > maxUsdAmount ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
9864
10005
  "div",
9865
10006
  {
@@ -9874,7 +10015,44 @@ function EnterAmountView({
9874
10015
  style: { color: colors2.error },
9875
10016
  children: error
9876
10017
  }
9877
- ) })
10018
+ ) }),
10019
+ isCheckout && selectedToken.icon_url && /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2 uf-py-2", children: [
10020
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "uf-relative", children: [
10021
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
10022
+ "img",
10023
+ {
10024
+ src: selectedToken.icon_url,
10025
+ alt: selectedToken.symbol,
10026
+ width: 20,
10027
+ height: 20,
10028
+ className: "uf-w-5 uf-h-5 uf-rounded-full"
10029
+ }
10030
+ ),
10031
+ selectedToken.chain_icon_url && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
10032
+ "img",
10033
+ {
10034
+ src: selectedToken.chain_icon_url,
10035
+ alt: selectedToken.chain_name,
10036
+ width: 10,
10037
+ height: 10,
10038
+ className: "uf-w-2.5 uf-h-2.5 uf-rounded-full uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-border",
10039
+ style: { borderColor: colors2.background }
10040
+ }
10041
+ )
10042
+ ] }),
10043
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
10044
+ "span",
10045
+ {
10046
+ className: "uf-text-xs",
10047
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
10048
+ children: [
10049
+ selectedToken.symbol,
10050
+ " on ",
10051
+ selectedToken.chain_name
10052
+ ]
10053
+ }
10054
+ )
10055
+ ] })
9878
10056
  ] }),
9879
10057
  /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "uf-shrink-0 uf-pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
9880
10058
  "button",
@@ -9902,6 +10080,18 @@ function EnterAmountView({
9902
10080
  // src/components/deposits/browser-wallets/ReviewView.tsx
9903
10081
  var import_lucide_react20 = require("lucide-react");
9904
10082
  var import_jsx_runtime47 = require("react/jsx-runtime");
10083
+ var WALLET_ICONS2 = {
10084
+ metamask: MetamaskIcon,
10085
+ phantom: PhantomIcon,
10086
+ coinbase: CoinbaseIcon,
10087
+ trust: TrustIcon,
10088
+ rainbow: RainbowIcon,
10089
+ rabby: RabbyIcon,
10090
+ okx: OkxIcon,
10091
+ solflare: SolflareIcon,
10092
+ backpack: BackpackIcon,
10093
+ glow: GlowIcon
10094
+ };
9905
10095
  function ReviewView({
9906
10096
  walletInfo,
9907
10097
  recipientAddress,
@@ -9936,30 +10126,17 @@ function ReviewView({
9936
10126
  ),
9937
10127
  /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "uf-flex uf-min-h-0 uf-flex-1 uf-flex-col", children: [
9938
10128
  /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "uf-min-h-0 uf-flex-1 uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: [
9939
- /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "uf-text-center", children: [
9940
- /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
9941
- "div",
9942
- {
9943
- className: "uf-text-4xl uf-font-medium",
9944
- style: { color: colors2.foreground, fontFamily: fonts.medium },
9945
- children: [
9946
- "$",
9947
- amountUsd || "0"
9948
- ]
9949
- }
9950
- ),
9951
- formattedTokenAmount && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
9952
- "div",
9953
- {
9954
- className: "uf-text-sm uf-mt-2",
9955
- style: { color: colors2.foregroundMuted },
9956
- children: [
9957
- "\u2248 ",
9958
- formattedTokenAmount
9959
- ]
9960
- }
9961
- )
9962
- ] }),
10129
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "uf-text-center", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
10130
+ "div",
10131
+ {
10132
+ className: "uf-text-4xl uf-font-medium",
10133
+ style: { color: colors2.foreground, fontFamily: fonts.medium },
10134
+ children: [
10135
+ "$",
10136
+ amountUsd || "0"
10137
+ ]
10138
+ }
10139
+ ) }),
9963
10140
  /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
9964
10141
  "div",
9965
10142
  {
@@ -9976,7 +10153,31 @@ function ReviewView({
9976
10153
  {
9977
10154
  className: "uf-text-sm",
9978
10155
  style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
9979
- children: "Source"
10156
+ children: "From"
10157
+ }
10158
+ ),
10159
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
10160
+ WALLET_ICONS2[walletInfo.icon] && (() => {
10161
+ const Icon2 = WALLET_ICONS2[walletInfo.icon];
10162
+ return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("div", { className: "uf-w-5 uf-h-5 uf-rounded-full uf-overflow-hidden uf-flex-shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Icon2, { size: 20, variant: "color" }) });
10163
+ })(),
10164
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
10165
+ "span",
10166
+ {
10167
+ className: "uf-text-sm uf-font-medium",
10168
+ style: { color: colors2.foreground, fontFamily: fonts.medium },
10169
+ children: walletInfo.name
10170
+ }
10171
+ )
10172
+ ] })
10173
+ ] }),
10174
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "uf-flex uf-justify-between uf-items-center", children: [
10175
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
10176
+ "span",
10177
+ {
10178
+ className: "uf-text-sm",
10179
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
10180
+ children: "You send"
9980
10181
  }
9981
10182
  ),
9982
10183
  /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
@@ -9988,17 +10189,12 @@ function ReviewView({
9988
10189
  className: "uf-w-5 uf-h-5 uf-rounded-full"
9989
10190
  }
9990
10191
  ),
9991
- /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(
10192
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
9992
10193
  "span",
9993
10194
  {
9994
10195
  className: "uf-text-sm uf-font-medium",
9995
10196
  style: { color: colors2.foreground, fontFamily: fonts.medium },
9996
- children: [
9997
- walletInfo.name,
9998
- " (",
9999
- truncateAddress2(walletInfo.address),
10000
- ")"
10001
- ]
10197
+ children: formattedTokenAmount || `$${amountUsd}`
10002
10198
  }
10003
10199
  )
10004
10200
  ] })
@@ -10161,7 +10357,10 @@ function ReviewView({
10161
10357
  borderRadius: components.button.borderRadius,
10162
10358
  border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
10163
10359
  },
10164
- children: isConfirming ? "Confirming..." : "Confirm Order"
10360
+ children: isConfirming ? /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("span", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2", children: [
10361
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react20.Loader2, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
10362
+ "Confirming..."
10363
+ ] }) : "Confirm Order"
10165
10364
  }
10166
10365
  ) })
10167
10366
  ] })
@@ -10175,17 +10374,35 @@ function ReviewView({
10175
10374
  var import_react17 = require("react");
10176
10375
  var import_lucide_react21 = require("lucide-react");
10177
10376
  var import_jsx_runtime48 = require("react/jsx-runtime");
10377
+ var SETTLE_FALLBACK_MS = 15e3;
10178
10378
  function ConfirmingView({
10179
10379
  isConfirming,
10180
10380
  onClose,
10181
10381
  executions = [],
10182
- isPolling = false
10382
+ isPolling = false,
10383
+ onNewDeposit,
10384
+ onDone,
10385
+ paymentIntentStatus,
10386
+ amountReceivedUsd,
10387
+ amountReceivedUsdAtSubmission
10183
10388
  }) {
10184
- const { colors: colors2, fonts } = useTheme();
10389
+ const { colors: colors2, fonts, components } = useTheme();
10185
10390
  const [containerEl, setContainerEl] = (0, import_react17.useState)(null);
10186
10391
  const containerCallbackRef = (0, import_react17.useCallback)((el) => {
10187
10392
  setContainerEl(el);
10188
10393
  }, []);
10394
+ const [fallbackSettled, setFallbackSettled] = (0, import_react17.useState)(false);
10395
+ const hasExecution = executions.length > 0;
10396
+ const isCheckoutMode = paymentIntentStatus != null;
10397
+ const isPaymentComplete = paymentIntentStatus === "succeeded";
10398
+ const amountChanged = amountReceivedUsdAtSubmission != null && amountReceivedUsd != null && amountReceivedUsd !== amountReceivedUsdAtSubmission;
10399
+ const piSettled = !isCheckoutMode || isPaymentComplete || amountChanged || fallbackSettled;
10400
+ (0, import_react17.useEffect)(() => {
10401
+ if (!hasExecution || piSettled) return;
10402
+ const timeout = setTimeout(() => setFallbackSettled(true), SETTLE_FALLBACK_MS);
10403
+ return () => clearTimeout(timeout);
10404
+ }, [hasExecution, piSettled]);
10405
+ const showButtons = hasExecution && piSettled;
10189
10406
  return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(PortalContainerProvider, { value: containerEl, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
10190
10407
  "div",
10191
10408
  {
@@ -10198,8 +10415,8 @@ function ConfirmingView({
10198
10415
  /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
10199
10416
  DepositHeader,
10200
10417
  {
10201
- title: isConfirming ? "Confirming..." : "Processing",
10202
- onClose
10418
+ title: isConfirming ? "Confirming..." : hasExecution && isPaymentComplete ? "Payment Complete" : hasExecution ? "Deposit Received" : "Processing",
10419
+ onClose: isPaymentComplete && onDone ? onDone : onClose
10203
10420
  }
10204
10421
  ),
10205
10422
  /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "uf-flex uf-flex-1 uf-flex-col uf-items-center uf-justify-center uf-py-8", children: isConfirming ? /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
@@ -10226,11 +10443,70 @@ function ConfirmingView({
10226
10443
  children: "Please confirm the transaction in your wallet"
10227
10444
  }
10228
10445
  )
10229
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
10446
+ ] }) : hasExecution ? /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
10230
10447
  /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
10231
10448
  import_lucide_react21.CheckCircle2,
10232
10449
  {
10233
10450
  className: "uf-w-12 uf-h-12 uf-mb-4",
10451
+ style: { color: "rgb(34, 197, 94)" }
10452
+ }
10453
+ ),
10454
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
10455
+ "div",
10456
+ {
10457
+ className: "uf-text-lg uf-font-medium",
10458
+ style: { color: colors2.foreground, fontFamily: fonts.medium },
10459
+ children: isPaymentComplete ? "Payment Complete" : "Deposit Received"
10460
+ }
10461
+ ),
10462
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
10463
+ "div",
10464
+ {
10465
+ className: "uf-text-sm uf-mt-2 uf-text-center uf-px-6",
10466
+ style: { color: colors2.foregroundMuted },
10467
+ children: isPaymentComplete ? "Your payment has been fulfilled." : showButtons ? "Your deposit is being processed." : "Checking payment status..."
10468
+ }
10469
+ ),
10470
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "uf-mt-6 uf-flex uf-flex-col uf-items-center uf-gap-3", children: !showButtons ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
10471
+ import_lucide_react21.Loader2,
10472
+ {
10473
+ className: "uf-w-5 uf-h-5 uf-animate-spin",
10474
+ style: { color: colors2.foregroundMuted }
10475
+ }
10476
+ ) : isPaymentComplete && onDone ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
10477
+ "button",
10478
+ {
10479
+ onClick: onDone,
10480
+ className: "uf-w-full uf-py-3 uf-px-8 uf-text-sm uf-font-medium uf-transition-opacity hover:uf-opacity-80",
10481
+ style: {
10482
+ backgroundColor: colors2.primary,
10483
+ color: colors2.primaryForeground,
10484
+ fontFamily: fonts.medium,
10485
+ borderRadius: components.button.borderRadius
10486
+ },
10487
+ children: "Done"
10488
+ }
10489
+ ) : onNewDeposit ? /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
10490
+ "button",
10491
+ {
10492
+ onClick: onNewDeposit,
10493
+ className: "uf-flex uf-items-center uf-gap-2 uf-px-5 uf-py-2.5 uf-rounded-lg uf-text-sm uf-font-medium uf-transition-opacity hover:uf-opacity-80",
10494
+ style: {
10495
+ backgroundColor: colors2.primary,
10496
+ color: colors2.primaryForeground,
10497
+ fontFamily: fonts.medium
10498
+ },
10499
+ children: [
10500
+ "Make another deposit",
10501
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_lucide_react21.ArrowRight, { className: "uf-w-4 uf-h-4" })
10502
+ ]
10503
+ }
10504
+ ) : null })
10505
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
10506
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
10507
+ import_lucide_react21.Loader2,
10508
+ {
10509
+ className: "uf-w-12 uf-h-12 uf-animate-spin uf-mb-4",
10234
10510
  style: { color: colors2.primary }
10235
10511
  }
10236
10512
  ),
@@ -10247,7 +10523,7 @@ function ConfirmingView({
10247
10523
  {
10248
10524
  className: "uf-text-sm uf-mt-2 uf-text-center uf-px-6",
10249
10525
  style: { color: colors2.foregroundMuted },
10250
- children: "You can close this window or wait for confirmation."
10526
+ children: "Waiting for your deposit to be detected..."
10251
10527
  }
10252
10528
  )
10253
10529
  ] }) }),
@@ -10274,6 +10550,7 @@ function BrowserWalletModal({
10274
10550
  depositWallet,
10275
10551
  userId,
10276
10552
  publishableKey,
10553
+ clientSecret,
10277
10554
  assetCdnUrl,
10278
10555
  projectName,
10279
10556
  theme = "dark",
@@ -10282,7 +10559,13 @@ function BrowserWalletModal({
10282
10559
  onDepositSuccess,
10283
10560
  onDepositError,
10284
10561
  amountQuickSelect = "percentage",
10285
- onWalletDisconnect
10562
+ onWalletDisconnect,
10563
+ prefillAmountUsd,
10564
+ checkoutAmountUsd,
10565
+ checkoutReceivedUsd,
10566
+ onNewDeposit,
10567
+ onDone,
10568
+ paymentIntentStatus
10286
10569
  }) {
10287
10570
  const { colors: colors2, fonts, components } = useTheme();
10288
10571
  const [step, setStep] = React26.useState("select-token");
@@ -10300,6 +10583,7 @@ function BrowserWalletModal({
10300
10583
  const [tokenChainDetails, setTokenChainDetails] = React26.useState(null);
10301
10584
  const [loadingTokenDetails, setLoadingTokenDetails] = React26.useState(false);
10302
10585
  const [showTransactionDetails, setShowTransactionDetails] = React26.useState(false);
10586
+ const [receivedUsdAtSubmission, setReceivedUsdAtSubmission] = React26.useState(null);
10303
10587
  const themeClass = theme === "dark" ? "uf-dark" : "";
10304
10588
  const chainType = depositWallet.chain_type;
10305
10589
  const recipientAddress = depositWallet.address;
@@ -10307,15 +10591,19 @@ function BrowserWalletModal({
10307
10591
  const { executions: depositExecutions, isPolling } = useDepositPolling({
10308
10592
  userId,
10309
10593
  publishableKey,
10594
+ clientSecret,
10310
10595
  enabled: open && hasSignedTransaction,
10311
10596
  onDepositSuccess,
10312
10597
  onDepositError
10313
10598
  });
10599
+ const prevOpenRef = React26.useRef(false);
10314
10600
  React26.useEffect(() => {
10315
- if (open) {
10601
+ const wasOpen = prevOpenRef.current;
10602
+ prevOpenRef.current = open;
10603
+ if (open && !wasOpen) {
10316
10604
  setStep("select-token");
10317
10605
  setSelectedBalance(null);
10318
- setAmountUsd("");
10606
+ setAmountUsd(prefillAmountUsd ?? "");
10319
10607
  setError(null);
10320
10608
  setIsConfirming(false);
10321
10609
  setTokenChainDetails(null);
@@ -10323,7 +10611,15 @@ function BrowserWalletModal({
10323
10611
  setHasSignedTransaction(false);
10324
10612
  setIsDisconnectingWallet(false);
10325
10613
  }
10326
- }, [open]);
10614
+ }, [open, prefillAmountUsd]);
10615
+ React26.useEffect(() => {
10616
+ if (!prefillAmountUsd || !tokenChainDetails || step !== "input-amount") return;
10617
+ const minDeposit = tokenChainDetails.minimum_deposit_amount_usd || 0;
10618
+ const currentAmount = parseFloat(amountUsd) || 0;
10619
+ if (currentAmount > 0 && currentAmount < minDeposit) {
10620
+ setAmountUsd(minDeposit.toFixed(2));
10621
+ }
10622
+ }, [tokenChainDetails, step, prefillAmountUsd]);
10327
10623
  React26.useEffect(() => {
10328
10624
  if (step === "review") {
10329
10625
  setShowTransactionDetails(false);
@@ -10441,7 +10737,7 @@ function BrowserWalletModal({
10441
10737
  setError(null);
10442
10738
  if (step === "input-amount") {
10443
10739
  setStep("select-token");
10444
- setAmountUsd("");
10740
+ setAmountUsd(prefillAmountUsd ?? "");
10445
10741
  setTokenChainDetails(null);
10446
10742
  } else if (step === "review") {
10447
10743
  setStep("input-amount");
@@ -10527,7 +10823,6 @@ function BrowserWalletModal({
10527
10823
  }
10528
10824
  }
10529
10825
  setIsConfirming(true);
10530
- setStep("confirming");
10531
10826
  setError(null);
10532
10827
  try {
10533
10828
  let txHash;
@@ -10545,16 +10840,17 @@ function BrowserWalletModal({
10545
10840
  } else {
10546
10841
  txHash = await sendEthereumTransaction(token, tokenAmount.toString());
10547
10842
  }
10843
+ setReceivedUsdAtSubmission(checkoutReceivedUsd ?? "0");
10548
10844
  setHasSignedTransaction(true);
10549
- onSuccess?.(txHash);
10550
10845
  setIsConfirming(false);
10846
+ setStep("confirming");
10847
+ onSuccess?.(txHash);
10551
10848
  } catch (err) {
10552
10849
  console.error("[BrowserWalletModal] Transaction error:", err);
10553
10850
  const errorMessage = err instanceof Error ? err.message : "Transaction failed";
10554
10851
  setError(errorMessage);
10555
10852
  onError?.(err instanceof Error ? err : new Error(errorMessage));
10556
10853
  setIsConfirming(false);
10557
- setStep("review");
10558
10854
  }
10559
10855
  };
10560
10856
  const sendEthereumTransaction = async (token, amountStr) => {
@@ -10803,7 +11099,9 @@ function BrowserWalletModal({
10803
11099
  onBack: handleClose,
10804
11100
  onClose: handleFullClose,
10805
11101
  onDisconnectWallet: onWalletDisconnect ? () => void handleDisconnectFromSelectToken() : void 0,
10806
- isDisconnectingWallet
11102
+ isDisconnectingWallet,
11103
+ checkoutAmountUsd,
11104
+ checkoutReceivedUsd
10807
11105
  }
10808
11106
  ),
10809
11107
  step === "input-amount" && selectedToken && selectedBalance && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
@@ -10824,7 +11122,9 @@ function BrowserWalletModal({
10824
11122
  onReview: handleReview,
10825
11123
  onBack: handleBack,
10826
11124
  onClose: handleFullClose,
10827
- quickSelectMode: amountQuickSelect
11125
+ quickSelectMode: amountQuickSelect,
11126
+ checkoutAmountUsd,
11127
+ checkoutReceivedUsd
10828
11128
  }
10829
11129
  ),
10830
11130
  step === "review" && selectedToken && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
@@ -10853,7 +11153,12 @@ function BrowserWalletModal({
10853
11153
  isConfirming,
10854
11154
  onClose: handleFullClose,
10855
11155
  executions: depositExecutions,
10856
- isPolling
11156
+ isPolling,
11157
+ onNewDeposit,
11158
+ onDone,
11159
+ paymentIntentStatus,
11160
+ amountReceivedUsd: checkoutReceivedUsd,
11161
+ amountReceivedUsdAtSubmission: receivedUsdAtSubmission
10857
11162
  }
10858
11163
  )
10859
11164
  ] })
@@ -10867,7 +11172,7 @@ function BrowserWalletModal({
10867
11172
  var React27 = __toESM(require("react"));
10868
11173
  var import_lucide_react22 = require("lucide-react");
10869
11174
  var import_jsx_runtime50 = require("react/jsx-runtime");
10870
- var WALLET_ICONS2 = {
11175
+ var WALLET_ICONS3 = {
10871
11176
  metamask: MetamaskIcon,
10872
11177
  phantom: PhantomIcon,
10873
11178
  coinbase: CoinbaseIcon,
@@ -11306,10 +11611,10 @@ function WalletSelectionModal({
11306
11611
  },
11307
11612
  children: [
11308
11613
  /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
11309
- WALLET_ICONS2[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
11614
+ WALLET_ICONS3[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
11310
11615
  WalletIconWithNetwork,
11311
11616
  {
11312
- WalletIcon: WALLET_ICONS2[wallet.id],
11617
+ WalletIcon: WALLET_ICONS3[wallet.id],
11313
11618
  networks: wallet.networks,
11314
11619
  size: 40,
11315
11620
  className: "uf-rounded-lg"
@@ -11380,10 +11685,10 @@ function WalletSelectionModal({
11380
11685
  style: { minHeight: WALLET_STEP_BODY_MIN_HEIGHT },
11381
11686
  children: [
11382
11687
  /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-pb-4 uf-shrink-0", children: [
11383
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "uf-mb-2", children: WALLET_ICONS2[selectedWallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
11688
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "uf-mb-2", children: WALLET_ICONS3[selectedWallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
11384
11689
  WalletIconWithNetwork,
11385
11690
  {
11386
- WalletIcon: WALLET_ICONS2[selectedWallet.id],
11691
+ WalletIcon: WALLET_ICONS3[selectedWallet.id],
11387
11692
  networks: selectedWallet.networks,
11388
11693
  size: 48,
11389
11694
  className: "uf-rounded-lg"
@@ -12186,70 +12491,743 @@ function DepositModal({
12186
12491
  ) });
12187
12492
  }
12188
12493
 
12189
- // src/components/withdrawals/WithdrawModal.tsx
12190
- var import_react22 = require("react");
12191
- var import_lucide_react26 = require("lucide-react");
12494
+ // src/components/checkout/CheckoutModal.tsx
12495
+ var import_react19 = require("react");
12496
+ var import_lucide_react24 = require("lucide-react");
12192
12497
 
12193
- // src/hooks/use-supported-destination-tokens.ts
12498
+ // src/hooks/use-payment-intent.ts
12194
12499
  var import_react_query9 = require("@tanstack/react-query");
12195
12500
  var import_core24 = require("@unifold/core");
12196
- function useSupportedDestinationTokens(publishableKey, enabled = true) {
12501
+ function usePaymentIntent(params) {
12502
+ const {
12503
+ clientSecret,
12504
+ publishableKey,
12505
+ enabled = true,
12506
+ pollingInterval = 5e3
12507
+ } = params;
12197
12508
  return (0, import_react_query9.useQuery)({
12198
- queryKey: ["unifold", "supportedDestinationTokens", publishableKey],
12199
- queryFn: () => (0, import_core24.getSupportedDestinationTokens)(publishableKey),
12200
- staleTime: 1e3 * 60 * 5,
12201
- gcTime: 1e3 * 60 * 30,
12202
- refetchOnMount: false,
12203
- refetchOnWindowFocus: false,
12204
- enabled
12509
+ queryKey: ["unifold", "paymentIntent", clientSecret, publishableKey],
12510
+ queryFn: () => (0, import_core24.retrievePaymentIntent)(clientSecret, publishableKey),
12511
+ enabled: enabled && !!clientSecret && !!publishableKey,
12512
+ staleTime: 0,
12513
+ refetchInterval: pollingInterval || false,
12514
+ refetchOnWindowFocus: true,
12515
+ retry: 3,
12516
+ retryDelay: (attempt) => Math.min(1e3 * 2 ** attempt, 1e4)
12205
12517
  });
12206
12518
  }
12207
12519
 
12208
- // src/hooks/use-source-token-validation.ts
12520
+ // src/hooks/use-deposit-quote.ts
12209
12521
  var import_react_query10 = require("@tanstack/react-query");
12210
12522
  var import_core25 = require("@unifold/core");
12211
- function useSourceTokenValidation(params) {
12523
+ function useDepositQuote(params) {
12212
12524
  const {
12525
+ publishableKey,
12213
12526
  sourceChainType,
12214
12527
  sourceChainId,
12215
12528
  sourceTokenAddress,
12216
- sourceTokenSymbol,
12217
- publishableKey,
12529
+ destinationAmount,
12530
+ destinationChainType,
12531
+ destinationChainId,
12532
+ destinationTokenAddress,
12218
12533
  enabled = true
12219
12534
  } = params;
12220
- const hasParams = !!sourceChainType && !!sourceChainId && !!sourceTokenAddress;
12535
+ const request = {
12536
+ source_chain_type: sourceChainType,
12537
+ source_chain_id: sourceChainId,
12538
+ source_token_address: sourceTokenAddress,
12539
+ destination_amount: destinationAmount,
12540
+ destination_chain_type: destinationChainType,
12541
+ destination_chain_id: destinationChainId,
12542
+ destination_token_address: destinationTokenAddress
12543
+ };
12221
12544
  return (0, import_react_query10.useQuery)({
12222
12545
  queryKey: [
12223
12546
  "unifold",
12224
- "sourceTokenValidation",
12225
- sourceChainType ?? null,
12226
- sourceChainId ?? null,
12227
- sourceTokenAddress ?? null,
12547
+ "depositQuote",
12548
+ sourceChainType,
12549
+ sourceChainId,
12550
+ sourceTokenAddress,
12551
+ destinationAmount,
12552
+ destinationChainType,
12553
+ destinationChainId,
12554
+ destinationTokenAddress,
12228
12555
  publishableKey
12229
12556
  ],
12230
- queryFn: async () => {
12231
- const res = await (0, import_core25.getSupportedDepositTokens)(publishableKey);
12232
- let matchedMinUsd = null;
12233
- let matchedProcessingTime = null;
12234
- let matchedSlippage = null;
12235
- let matchedPriceImpact = null;
12236
- const found = res.data.some(
12237
- (token) => token.chains.some((chain) => {
12238
- const match = chain.chain_type === sourceChainType && chain.chain_id === sourceChainId && chain.token_address.toLowerCase() === sourceTokenAddress.toLowerCase();
12239
- if (match) {
12240
- matchedMinUsd = chain.minimum_deposit_amount_usd;
12241
- matchedProcessingTime = chain.estimated_processing_time;
12242
- matchedSlippage = chain.max_slippage_percent;
12243
- matchedPriceImpact = chain.estimated_price_impact_percent;
12244
- }
12245
- return match;
12246
- })
12247
- );
12248
- return {
12249
- isSupported: found,
12250
- minimumAmountUsd: matchedMinUsd,
12251
- estimatedProcessingTime: matchedProcessingTime,
12252
- maxSlippagePercent: matchedSlippage,
12557
+ queryFn: () => (0, import_core25.getDepositQuote)(request, publishableKey),
12558
+ enabled: enabled && !!publishableKey && !!sourceChainType && !!sourceChainId && !!sourceTokenAddress && !!destinationAmount && destinationAmount !== "0" && !!destinationChainType && !!destinationChainId && !!destinationTokenAddress,
12559
+ staleTime: 6e4,
12560
+ gcTime: 5 * 6e4,
12561
+ refetchOnWindowFocus: false,
12562
+ retry: 2,
12563
+ retryDelay: (attempt) => Math.min(1e3 * 2 ** attempt, 5e3)
12564
+ });
12565
+ }
12566
+
12567
+ // src/components/checkout/CheckoutModal.tsx
12568
+ var import_jsx_runtime52 = require("react/jsx-runtime");
12569
+ function mapDepositAddressesToWallets(depositAddresses, pi) {
12570
+ return depositAddresses.map((da, idx) => ({
12571
+ id: da.id,
12572
+ chain_type: da.chain_type,
12573
+ address_type: da.address_type,
12574
+ address: da.address,
12575
+ destination_chain_type: pi.destination_chain_type,
12576
+ destination_chain_id: pi.destination_chain_id,
12577
+ destination_token_address: pi.destination_token_address,
12578
+ recipient_address: pi.recipient_address,
12579
+ is_primary: idx === 0
12580
+ }));
12581
+ }
12582
+ function SkeletonButton2() {
12583
+ return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-w-full uf-bg-secondary uf-rounded-xl uf-p-3 uf-flex uf-items-center uf-justify-between uf-animate-pulse", children: [
12584
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
12585
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uf-bg-muted uf-rounded-lg uf-w-9 uf-h-9" }),
12586
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-space-y-1.5", children: [
12587
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uf-h-3.5 uf-w-24 uf-bg-muted uf-rounded" }),
12588
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uf-h-3 uf-w-32 uf-bg-muted uf-rounded" })
12589
+ ] })
12590
+ ] }),
12591
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uf-flex uf-items-center uf-gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_lucide_react24.ChevronRight, { className: "uf-w-4 uf-h-4 uf-text-muted" }) })
12592
+ ] });
12593
+ }
12594
+ function CheckoutModal({
12595
+ open,
12596
+ onOpenChange,
12597
+ clientSecret,
12598
+ publishableKey,
12599
+ modalTitle,
12600
+ enableConnectWallet = false,
12601
+ theme = "dark",
12602
+ onCheckoutSuccess,
12603
+ onCheckoutError
12604
+ }) {
12605
+ const { colors: colors2, fonts, components } = useTheme();
12606
+ const [view, setView] = (0, import_react19.useState)("main");
12607
+ const resetViewTimeoutRef = (0, import_react19.useRef)(
12608
+ null
12609
+ );
12610
+ const [browserWalletModalOpen, setBrowserWalletModalOpen] = (0, import_react19.useState)(false);
12611
+ const [browserWalletInfo, setBrowserWalletInfo] = (0, import_react19.useState)(null);
12612
+ const [walletSelectionModalOpen, setWalletSelectionModalOpen] = (0, import_react19.useState)(false);
12613
+ const [browserWalletChainType, setBrowserWalletChainType] = (0, import_react19.useState)(() => getStoredWalletChainType());
12614
+ const isMobileView = useIsMobileViewport();
12615
+ const [resolvedTheme, setResolvedTheme] = (0, import_react19.useState)(
12616
+ theme === "auto" ? "dark" : theme
12617
+ );
12618
+ (0, import_react19.useEffect)(() => {
12619
+ if (theme === "auto") {
12620
+ const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
12621
+ setResolvedTheme(mediaQuery.matches ? "dark" : "light");
12622
+ const handler = (e) => {
12623
+ setResolvedTheme(e.matches ? "dark" : "light");
12624
+ };
12625
+ mediaQuery.addEventListener("change", handler);
12626
+ return () => mediaQuery.removeEventListener("change", handler);
12627
+ } else {
12628
+ setResolvedTheme(theme);
12629
+ }
12630
+ }, [theme]);
12631
+ const themeClass = resolvedTheme === "dark" ? "uf-dark" : "";
12632
+ const {
12633
+ data: paymentIntent,
12634
+ isLoading: piLoading,
12635
+ error: piError
12636
+ } = usePaymentIntent({
12637
+ clientSecret,
12638
+ publishableKey,
12639
+ enabled: open && !!clientSecret,
12640
+ pollingInterval: 5e3
12641
+ });
12642
+ const { projectConfig } = useProjectConfig({
12643
+ publishableKey,
12644
+ enabled: open
12645
+ });
12646
+ const prevStatusRef = (0, import_react19.useRef)(null);
12647
+ (0, import_react19.useEffect)(() => {
12648
+ if (!paymentIntent) return;
12649
+ const prev = prevStatusRef.current;
12650
+ prevStatusRef.current = paymentIntent.status;
12651
+ if (prev && prev !== paymentIntent.status && paymentIntent.status === "succeeded") {
12652
+ if (!browserWalletModalOpen) {
12653
+ setView("main");
12654
+ }
12655
+ onCheckoutSuccess?.({
12656
+ paymentIntentId: paymentIntent.id,
12657
+ status: paymentIntent.status
12658
+ });
12659
+ }
12660
+ }, [paymentIntent, onCheckoutSuccess, browserWalletModalOpen]);
12661
+ const wallets = (0, import_react19.useMemo)(() => {
12662
+ if (!paymentIntent) return [];
12663
+ return mapDepositAddressesToWallets(
12664
+ paymentIntent.deposit_addresses,
12665
+ paymentIntent
12666
+ );
12667
+ }, [paymentIntent]);
12668
+ const formatCryptoAmount = (0, import_react19.useMemo)(() => {
12669
+ if (!paymentIntent) return (_) => "";
12670
+ const decimals = paymentIntent.destination_token_decimals ?? 6;
12671
+ const symbol = paymentIntent.currency.toUpperCase();
12672
+ return (baseUnits) => {
12673
+ const num = Number(baseUnits) / 10 ** decimals;
12674
+ const formatted = num % 1 === 0 ? num.toFixed(0) : num.toFixed(2);
12675
+ return `${formatted} ${symbol}`;
12676
+ };
12677
+ }, [paymentIntent]);
12678
+ const remainingAmountUsd = (0, import_react19.useMemo)(() => {
12679
+ if (!paymentIntent) return void 0;
12680
+ const total = parseFloat(paymentIntent.amount_usd);
12681
+ const received = parseFloat(paymentIntent.amount_received_usd);
12682
+ if (isNaN(total) || isNaN(received)) return paymentIntent.amount_usd;
12683
+ const remaining = total - received;
12684
+ return remaining > 0 ? remaining.toFixed(2) : "0.00";
12685
+ }, [paymentIntent]);
12686
+ const remainingCrypto = (0, import_react19.useMemo)(() => {
12687
+ if (!paymentIntent) return void 0;
12688
+ const total = BigInt(paymentIntent.amount);
12689
+ const received = BigInt(paymentIntent.amount_received);
12690
+ const remaining = total - received;
12691
+ return remaining > 0n ? remaining.toString() : "0";
12692
+ }, [paymentIntent]);
12693
+ const [selectedSource, setSelectedSource] = (0, import_react19.useState)(null);
12694
+ const quoteDestinationAmount = (0, import_react19.useMemo)(() => {
12695
+ if (!paymentIntent || !selectedSource) return "0";
12696
+ const remaining = BigInt(paymentIntent.amount) - BigInt(paymentIntent.amount_received);
12697
+ const totalBaseUnits = Number(paymentIntent.amount);
12698
+ const totalUsd = parseFloat(paymentIntent.amount_usd);
12699
+ const baseUnitsPerUsd = totalUsd > 0 ? totalBaseUnits / totalUsd : 0;
12700
+ const minUsd = Math.max(selectedSource.minimumDepositAmountUsd, 3);
12701
+ const minDepositBaseUnits = BigInt(Math.ceil(minUsd * baseUnitsPerUsd));
12702
+ const effective = remaining > minDepositBaseUnits ? remaining : minDepositBaseUnits;
12703
+ return effective > 0n ? effective.toString() : "0";
12704
+ }, [paymentIntent, selectedSource]);
12705
+ const { data: sourceQuote } = useDepositQuote({
12706
+ publishableKey,
12707
+ sourceChainType: selectedSource?.chainType ?? "",
12708
+ sourceChainId: selectedSource?.chainId ?? "",
12709
+ sourceTokenAddress: selectedSource?.tokenAddress ?? "",
12710
+ destinationAmount: quoteDestinationAmount,
12711
+ destinationChainType: paymentIntent?.destination_chain_type ?? "",
12712
+ destinationChainId: paymentIntent?.destination_chain_id ?? "",
12713
+ destinationTokenAddress: paymentIntent?.destination_token_address ?? "",
12714
+ enabled: open && view === "transfer" && !!paymentIntent && !!selectedSource && quoteDestinationAmount !== "0"
12715
+ });
12716
+ const handleBrowserWalletClick = (0, import_react19.useCallback)(
12717
+ (walletInfo) => {
12718
+ const walletChainType = walletInfo.type === "phantom-solana" || walletInfo.type === "solflare" || walletInfo.type === "backpack" || walletInfo.type === "glow" ? "solana" : "ethereum";
12719
+ setStoredWalletChainType(walletChainType);
12720
+ setBrowserWalletChainType(walletChainType);
12721
+ const matchingDepositWallet = wallets.find(
12722
+ (w) => w.chain_type === walletChainType
12723
+ );
12724
+ if (!matchingDepositWallet) {
12725
+ onCheckoutError?.({
12726
+ message: `Unable to pay from ${walletChainType}. Please try a different wallet.`,
12727
+ code: "NO_DEPOSIT_ADDRESS"
12728
+ });
12729
+ return;
12730
+ }
12731
+ setBrowserWalletInfo({
12732
+ ...walletInfo,
12733
+ depositWallet: matchingDepositWallet
12734
+ });
12735
+ setBrowserWalletModalOpen(true);
12736
+ },
12737
+ [wallets, onCheckoutError]
12738
+ );
12739
+ const handleWalletConnectClick = (0, import_react19.useCallback)(() => {
12740
+ setWalletSelectionModalOpen(true);
12741
+ }, []);
12742
+ const handleWalletConnected = (0, import_react19.useCallback)(
12743
+ (walletInfo) => {
12744
+ const walletChainType = walletInfo.type === "phantom-solana" || walletInfo.type === "solflare" || walletInfo.type === "backpack" || walletInfo.type === "glow" ? "solana" : "ethereum";
12745
+ setStoredWalletChainType(walletChainType);
12746
+ setBrowserWalletChainType(walletChainType);
12747
+ const matchingDepositWallet = wallets.find(
12748
+ (w) => w.chain_type === walletChainType
12749
+ );
12750
+ if (!matchingDepositWallet) {
12751
+ onCheckoutError?.({
12752
+ message: `Unable to pay from ${walletChainType}. Please try a different wallet.`,
12753
+ code: "NO_DEPOSIT_ADDRESS"
12754
+ });
12755
+ setWalletSelectionModalOpen(false);
12756
+ return;
12757
+ }
12758
+ setBrowserWalletInfo({
12759
+ ...walletInfo,
12760
+ depositWallet: matchingDepositWallet
12761
+ });
12762
+ setWalletSelectionModalOpen(false);
12763
+ setBrowserWalletModalOpen(true);
12764
+ },
12765
+ [wallets, onCheckoutError]
12766
+ );
12767
+ const handleWalletDisconnect = (0, import_react19.useCallback)(() => {
12768
+ setUserDisconnectedWallet(true);
12769
+ clearStoredWalletChainType();
12770
+ setBrowserWalletChainType(void 0);
12771
+ setBrowserWalletInfo(null);
12772
+ setBrowserWalletModalOpen(false);
12773
+ }, []);
12774
+ const handleClose = (0, import_react19.useCallback)(() => {
12775
+ onOpenChange(false);
12776
+ if (resetViewTimeoutRef.current) {
12777
+ clearTimeout(resetViewTimeoutRef.current);
12778
+ }
12779
+ resetViewTimeoutRef.current = setTimeout(() => {
12780
+ setView("main");
12781
+ setBrowserWalletInfo(null);
12782
+ resetViewTimeoutRef.current = null;
12783
+ }, 200);
12784
+ }, [onOpenChange]);
12785
+ (0, import_react19.useLayoutEffect)(() => {
12786
+ if (!open) return;
12787
+ if (resetViewTimeoutRef.current) {
12788
+ clearTimeout(resetViewTimeoutRef.current);
12789
+ resetViewTimeoutRef.current = null;
12790
+ }
12791
+ setView("main");
12792
+ setBrowserWalletInfo(null);
12793
+ }, [open]);
12794
+ (0, import_react19.useEffect)(
12795
+ () => () => {
12796
+ if (resetViewTimeoutRef.current) {
12797
+ clearTimeout(resetViewTimeoutRef.current);
12798
+ }
12799
+ },
12800
+ []
12801
+ );
12802
+ const handleBack = (0, import_react19.useCallback)(() => {
12803
+ setView("main");
12804
+ }, []);
12805
+ const poweredByFooter = /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12806
+ PoweredByUnifold,
12807
+ {
12808
+ color: colors2.foregroundMuted,
12809
+ className: "uf-flex uf-justify-center uf-shrink-0"
12810
+ }
12811
+ ) });
12812
+ const progressSection = paymentIntent ? (() => {
12813
+ const received = parseFloat(paymentIntent.amount_received_usd);
12814
+ const total = parseFloat(paymentIntent.amount_usd);
12815
+ const remaining = Math.max(total - received, 0);
12816
+ const pct = total > 0 ? Math.min(received / total * 100, 100) : 0;
12817
+ const hasPartial = received > 0;
12818
+ const amountStr = paymentIntent.amount_usd;
12819
+ const dynamicFontSize = `${Math.max(3.75 - amountStr.length * 0.15, 2)}rem`;
12820
+ return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-text-center uf-py-2 uf-space-y-1", children: [
12821
+ paymentIntent.description && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12822
+ "div",
12823
+ {
12824
+ className: "uf-text-xs",
12825
+ style: {
12826
+ color: colors2.foregroundMuted,
12827
+ fontFamily: fonts.regular
12828
+ },
12829
+ children: paymentIntent.description
12830
+ }
12831
+ ),
12832
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-center", children: [
12833
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12834
+ "span",
12835
+ {
12836
+ className: "uf-mr-1",
12837
+ style: {
12838
+ fontSize: `calc(${dynamicFontSize} * 0.6)`,
12839
+ color: colors2.foregroundMuted,
12840
+ fontFamily: fonts.regular
12841
+ },
12842
+ children: "$"
12843
+ }
12844
+ ),
12845
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12846
+ "span",
12847
+ {
12848
+ style: {
12849
+ fontSize: dynamicFontSize,
12850
+ color: colors2.foreground,
12851
+ fontFamily: fonts.regular,
12852
+ lineHeight: 1.1
12853
+ },
12854
+ children: amountStr
12855
+ }
12856
+ )
12857
+ ] }),
12858
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12859
+ "div",
12860
+ {
12861
+ className: "uf-text-xs",
12862
+ style: {
12863
+ color: colors2.foregroundMuted,
12864
+ fontFamily: fonts.regular
12865
+ },
12866
+ children: paymentIntent.currency.toUpperCase()
12867
+ }
12868
+ ),
12869
+ hasPartial && /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-pt-2 uf-space-y-1.5", children: [
12870
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12871
+ "div",
12872
+ {
12873
+ className: "uf-w-full uf-h-1.5 uf-rounded-full uf-overflow-hidden",
12874
+ style: { backgroundColor: colors2.border },
12875
+ children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12876
+ "div",
12877
+ {
12878
+ className: "uf-h-full uf-rounded-full uf-transition-all uf-duration-500",
12879
+ style: {
12880
+ width: `${pct}%`,
12881
+ backgroundColor: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : colors2.primary
12882
+ }
12883
+ }
12884
+ )
12885
+ }
12886
+ ),
12887
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
12888
+ "div",
12889
+ {
12890
+ className: "uf-text-xs",
12891
+ style: {
12892
+ color: colors2.foregroundMuted,
12893
+ fontFamily: fonts.regular
12894
+ },
12895
+ children: [
12896
+ "$",
12897
+ paymentIntent.amount_received_usd,
12898
+ " / $",
12899
+ amountStr,
12900
+ " received",
12901
+ remaining > 0 && paymentIntent.status !== "succeeded" && /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("span", { style: { color: colors2.foreground, fontFamily: fonts.medium }, children: [
12902
+ " ",
12903
+ "\xB7 $",
12904
+ remaining.toFixed(2),
12905
+ " remaining"
12906
+ ] })
12907
+ ]
12908
+ }
12909
+ )
12910
+ ] }),
12911
+ paymentIntent.status !== "requires_payment" && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uf-pt-1", children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12912
+ "span",
12913
+ {
12914
+ className: "uf-text-xs uf-font-medium uf-px-2.5 uf-py-1 uf-rounded-full uf-inline-block",
12915
+ style: {
12916
+ backgroundColor: paymentIntent.status === "succeeded" ? "rgba(34, 197, 94, 0.15)" : paymentIntent.status === "processing" ? "rgba(59, 130, 246, 0.15)" : "rgba(239, 68, 68, 0.15)",
12917
+ color: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : paymentIntent.status === "processing" ? "rgb(59, 130, 246)" : "rgb(239, 68, 68)",
12918
+ fontFamily: fonts.medium
12919
+ },
12920
+ children: paymentIntent.status === "succeeded" ? "Payment Complete" : paymentIntent.status === "processing" ? "Partial Payment Received" : paymentIntent.status === "canceled" ? "Canceled" : paymentIntent.status === "expired" ? "Expired" : paymentIntent.status
12921
+ }
12922
+ ) })
12923
+ ] });
12924
+ })() : null;
12925
+ return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(PortalContainerProvider, { value: null, children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Dialog, { open, onOpenChange: handleClose, modal: true, children: [
12926
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12927
+ DialogContent,
12928
+ {
12929
+ 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%]"} ${themeClass}`,
12930
+ style: { backgroundColor: colors2.background },
12931
+ onPointerDownOutside: (e) => e.preventDefault(),
12932
+ onInteractOutside: (e) => e.preventDefault(),
12933
+ children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(ThemeStyleInjector, { children: view === "main" ? /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
12934
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12935
+ DepositHeader,
12936
+ {
12937
+ title: modalTitle || "Checkout",
12938
+ showClose: true,
12939
+ onClose: handleClose
12940
+ }
12941
+ ),
12942
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
12943
+ piLoading ? /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-space-y-3", children: [
12944
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12945
+ "div",
12946
+ {
12947
+ className: "uf-rounded-xl uf-p-4 uf-animate-pulse",
12948
+ style: {
12949
+ backgroundColor: components.card.backgroundColor,
12950
+ borderRadius: components.card.borderRadius,
12951
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
12952
+ },
12953
+ children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-gap-2", children: [
12954
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12955
+ "div",
12956
+ {
12957
+ className: "uf-h-8 uf-w-24 uf-rounded",
12958
+ style: {
12959
+ backgroundColor: components.card.borderColor
12960
+ }
12961
+ }
12962
+ ),
12963
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12964
+ "div",
12965
+ {
12966
+ className: "uf-h-4 uf-w-16 uf-rounded",
12967
+ style: {
12968
+ backgroundColor: components.card.borderColor
12969
+ }
12970
+ }
12971
+ )
12972
+ ] })
12973
+ }
12974
+ ),
12975
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(SkeletonButton2, {}),
12976
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(SkeletonButton2, {})
12977
+ ] }) : piError ? /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
12978
+ /* @__PURE__ */ (0, import_jsx_runtime52.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_runtime52.jsx)(import_lucide_react24.AlertTriangle, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
12979
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12980
+ "h3",
12981
+ {
12982
+ className: "uf-text-lg uf-font-semibold uf-mb-2",
12983
+ style: {
12984
+ color: colors2.foreground,
12985
+ fontFamily: fonts.semibold
12986
+ },
12987
+ children: "Unable to Load Checkout"
12988
+ }
12989
+ ),
12990
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
12991
+ "p",
12992
+ {
12993
+ className: "uf-text-sm uf-max-w-[280px]",
12994
+ style: {
12995
+ color: colors2.foregroundMuted,
12996
+ fontFamily: fonts.regular
12997
+ },
12998
+ children: piError instanceof Error ? piError.message : "Something went wrong. Please try again."
12999
+ }
13000
+ )
13001
+ ] }) : paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-space-y-3", children: [
13002
+ progressSection,
13003
+ (paymentIntent.status === "requires_payment" || paymentIntent.status === "processing") && /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
13004
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13005
+ TransferCryptoButton,
13006
+ {
13007
+ onClick: () => setView("transfer"),
13008
+ title: "Transfer Crypto",
13009
+ subtitle: "Send from any wallet or exchange",
13010
+ featuredTokens: projectConfig?.transfer_crypto.networks
13011
+ }
13012
+ ),
13013
+ enableConnectWallet && !isMobileView && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13014
+ BrowserWalletButton,
13015
+ {
13016
+ onClick: handleBrowserWalletClick,
13017
+ onConnectClick: handleWalletConnectClick,
13018
+ onDisconnect: handleWalletDisconnect,
13019
+ chainType: browserWalletChainType,
13020
+ publishableKey
13021
+ }
13022
+ )
13023
+ ] })
13024
+ ] }) : null,
13025
+ poweredByFooter
13026
+ ] })
13027
+ ] }) : view === "transfer" ? /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
13028
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13029
+ DepositHeader,
13030
+ {
13031
+ title: `Pay $${remainingAmountUsd ?? paymentIntent?.amount_usd ?? ""}`,
13032
+ showBack: true,
13033
+ onBack: handleBack,
13034
+ onClose: handleClose
13035
+ }
13036
+ ),
13037
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
13038
+ paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
13039
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
13040
+ "div",
13041
+ {
13042
+ className: "uf-rounded-lg uf-px-3 uf-py-2 uf-flex uf-items-center uf-justify-between",
13043
+ style: {
13044
+ backgroundColor: components.card.backgroundColor,
13045
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`,
13046
+ borderRadius: components.card.borderRadius
13047
+ },
13048
+ children: [
13049
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13050
+ "span",
13051
+ {
13052
+ className: "uf-text-xs",
13053
+ style: {
13054
+ color: colors2.foregroundMuted,
13055
+ fontFamily: fonts.regular
13056
+ },
13057
+ children: parseFloat(paymentIntent.amount_received_usd) > 0 ? `$${paymentIntent.amount_received_usd} / $${paymentIntent.amount_usd} received` : "Amount due"
13058
+ }
13059
+ ),
13060
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
13061
+ "span",
13062
+ {
13063
+ className: "uf-text-sm uf-font-semibold",
13064
+ style: {
13065
+ color: colors2.foreground,
13066
+ fontFamily: fonts.semibold
13067
+ },
13068
+ children: [
13069
+ formatCryptoAmount(remainingCrypto ?? paymentIntent.amount),
13070
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
13071
+ "span",
13072
+ {
13073
+ className: "uf-text-xs uf-font-normal uf-ml-1",
13074
+ style: { color: colors2.foregroundMuted },
13075
+ children: [
13076
+ "($",
13077
+ remainingAmountUsd ?? paymentIntent.amount_usd,
13078
+ ")"
13079
+ ]
13080
+ }
13081
+ )
13082
+ ]
13083
+ }
13084
+ )
13085
+ ]
13086
+ }
13087
+ ),
13088
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13089
+ TransferCryptoSingleInput,
13090
+ {
13091
+ userId: paymentIntent.user_id || "",
13092
+ publishableKey,
13093
+ clientSecret,
13094
+ recipientAddress: paymentIntent.recipient_address,
13095
+ destinationChainType: paymentIntent.destination_chain_type,
13096
+ destinationChainId: paymentIntent.destination_chain_id,
13097
+ destinationTokenAddress: paymentIntent.destination_token_address,
13098
+ depositConfirmationMode: "auto_ui",
13099
+ wallets,
13100
+ onSourceTokenChange: setSelectedSource,
13101
+ checkoutQuote: sourceQuote ? {
13102
+ sourceAmount: sourceQuote.source_amount,
13103
+ sourceTokenDecimals: sourceQuote.source_token_decimals,
13104
+ sourceTokenSymbol: sourceQuote.source_token_symbol,
13105
+ sourceAmountUsd: sourceQuote.source_amount_usd
13106
+ } : null
13107
+ }
13108
+ )
13109
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(SkeletonButton2, {}),
13110
+ poweredByFooter
13111
+ ] })
13112
+ ] }) : null })
13113
+ }
13114
+ ),
13115
+ /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13116
+ WalletSelectionModal,
13117
+ {
13118
+ open: walletSelectionModalOpen,
13119
+ onOpenChange: setWalletSelectionModalOpen,
13120
+ onWalletConnected: handleWalletConnected,
13121
+ onClose: () => setWalletSelectionModalOpen(false),
13122
+ theme: resolvedTheme
13123
+ }
13124
+ ),
13125
+ browserWalletInfo && browserWalletInfo.depositWallet && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13126
+ BrowserWalletModal,
13127
+ {
13128
+ open: browserWalletModalOpen,
13129
+ onOpenChange: setBrowserWalletModalOpen,
13130
+ onFullClose: handleClose,
13131
+ walletInfo: browserWalletInfo,
13132
+ depositWallet: browserWalletInfo.depositWallet,
13133
+ userId: paymentIntent?.user_id || "",
13134
+ publishableKey,
13135
+ clientSecret,
13136
+ theme: resolvedTheme,
13137
+ prefillAmountUsd: remainingAmountUsd,
13138
+ checkoutAmountUsd: paymentIntent?.amount_usd,
13139
+ checkoutReceivedUsd: paymentIntent?.amount_received_usd,
13140
+ onSuccess: (txHash) => {
13141
+ onCheckoutSuccess?.({
13142
+ paymentIntentId: paymentIntent?.id || "",
13143
+ status: "processing"
13144
+ });
13145
+ },
13146
+ onError: (error) => {
13147
+ onCheckoutError?.({
13148
+ message: error.message,
13149
+ error
13150
+ });
13151
+ },
13152
+ onWalletDisconnect: handleWalletDisconnect,
13153
+ onNewDeposit: () => {
13154
+ setBrowserWalletModalOpen(false);
13155
+ setView("main");
13156
+ },
13157
+ onDone: () => {
13158
+ setBrowserWalletModalOpen(false);
13159
+ setView("main");
13160
+ },
13161
+ paymentIntentStatus: paymentIntent?.status
13162
+ }
13163
+ )
13164
+ ] }) });
13165
+ }
13166
+
13167
+ // src/components/withdrawals/WithdrawModal.tsx
13168
+ var import_react23 = require("react");
13169
+ var import_lucide_react27 = require("lucide-react");
13170
+
13171
+ // src/hooks/use-supported-destination-tokens.ts
13172
+ var import_react_query11 = require("@tanstack/react-query");
13173
+ var import_core26 = require("@unifold/core");
13174
+ function useSupportedDestinationTokens(publishableKey, enabled = true) {
13175
+ return (0, import_react_query11.useQuery)({
13176
+ queryKey: ["unifold", "supportedDestinationTokens", publishableKey],
13177
+ queryFn: () => (0, import_core26.getSupportedDestinationTokens)(publishableKey),
13178
+ staleTime: 1e3 * 60 * 5,
13179
+ gcTime: 1e3 * 60 * 30,
13180
+ refetchOnMount: false,
13181
+ refetchOnWindowFocus: false,
13182
+ enabled
13183
+ });
13184
+ }
13185
+
13186
+ // src/hooks/use-source-token-validation.ts
13187
+ var import_react_query12 = require("@tanstack/react-query");
13188
+ var import_core27 = require("@unifold/core");
13189
+ function useSourceTokenValidation(params) {
13190
+ const {
13191
+ sourceChainType,
13192
+ sourceChainId,
13193
+ sourceTokenAddress,
13194
+ sourceTokenSymbol,
13195
+ publishableKey,
13196
+ enabled = true
13197
+ } = params;
13198
+ const hasParams = !!sourceChainType && !!sourceChainId && !!sourceTokenAddress;
13199
+ return (0, import_react_query12.useQuery)({
13200
+ queryKey: [
13201
+ "unifold",
13202
+ "sourceTokenValidation",
13203
+ sourceChainType ?? null,
13204
+ sourceChainId ?? null,
13205
+ sourceTokenAddress ?? null,
13206
+ publishableKey
13207
+ ],
13208
+ queryFn: async () => {
13209
+ const res = await (0, import_core27.getSupportedDepositTokens)(publishableKey);
13210
+ let matchedMinUsd = null;
13211
+ let matchedProcessingTime = null;
13212
+ let matchedSlippage = null;
13213
+ let matchedPriceImpact = null;
13214
+ const found = res.data.some(
13215
+ (token) => token.chains.some((chain) => {
13216
+ const match = chain.chain_type === sourceChainType && chain.chain_id === sourceChainId && chain.token_address.toLowerCase() === sourceTokenAddress.toLowerCase();
13217
+ if (match) {
13218
+ matchedMinUsd = chain.minimum_deposit_amount_usd;
13219
+ matchedProcessingTime = chain.estimated_processing_time;
13220
+ matchedSlippage = chain.max_slippage_percent;
13221
+ matchedPriceImpact = chain.estimated_price_impact_percent;
13222
+ }
13223
+ return match;
13224
+ })
13225
+ );
13226
+ return {
13227
+ isSupported: found,
13228
+ minimumAmountUsd: matchedMinUsd,
13229
+ estimatedProcessingTime: matchedProcessingTime,
13230
+ maxSlippagePercent: matchedSlippage,
12253
13231
  priceImpactPercent: matchedPriceImpact,
12254
13232
  errorMessage: found ? null : `${sourceTokenSymbol || "Source token"} is not a supported withdrawal token. Supported tokens include USDC, USDT, and other stablecoins.`
12255
13233
  };
@@ -12263,8 +13241,8 @@ function useSourceTokenValidation(params) {
12263
13241
  }
12264
13242
 
12265
13243
  // src/hooks/use-address-balance.ts
12266
- var import_react_query11 = require("@tanstack/react-query");
12267
- var import_core26 = require("@unifold/core");
13244
+ var import_react_query13 = require("@tanstack/react-query");
13245
+ var import_core28 = require("@unifold/core");
12268
13246
  function useAddressBalance(params) {
12269
13247
  const {
12270
13248
  address,
@@ -12275,7 +13253,7 @@ function useAddressBalance(params) {
12275
13253
  enabled = true
12276
13254
  } = params;
12277
13255
  const hasParams = !!address && !!chainType && !!chainId && !!tokenAddress;
12278
- return (0, import_react_query11.useQuery)({
13256
+ return (0, import_react_query13.useQuery)({
12279
13257
  queryKey: [
12280
13258
  "unifold",
12281
13259
  "addressBalance",
@@ -12286,7 +13264,7 @@ function useAddressBalance(params) {
12286
13264
  publishableKey
12287
13265
  ],
12288
13266
  queryFn: async () => {
12289
- const res = await (0, import_core26.getAddressBalance)(
13267
+ const res = await (0, import_core28.getAddressBalance)(
12290
13268
  address,
12291
13269
  chainType,
12292
13270
  chainId,
@@ -12324,13 +13302,13 @@ function useAddressBalance(params) {
12324
13302
  }
12325
13303
 
12326
13304
  // src/hooks/use-executions.ts
12327
- var import_react_query12 = require("@tanstack/react-query");
12328
- var import_core27 = require("@unifold/core");
13305
+ var import_react_query14 = require("@tanstack/react-query");
13306
+ var import_core29 = require("@unifold/core");
12329
13307
  function useExecutions(userId, publishableKey, options) {
12330
- const actionType = options?.actionType ?? import_core27.ActionType.Deposit;
12331
- return (0, import_react_query12.useQuery)({
13308
+ const actionType = options?.actionType ?? import_core29.ActionType.Deposit;
13309
+ return (0, import_react_query14.useQuery)({
12332
13310
  queryKey: ["unifold", "executions", actionType, userId, publishableKey],
12333
- queryFn: () => (0, import_core27.queryExecutions)(userId, publishableKey, actionType),
13311
+ queryFn: () => (0, import_core29.queryExecutions)(userId, publishableKey, actionType),
12334
13312
  enabled: (options?.enabled ?? true) && !!userId,
12335
13313
  refetchInterval: options?.refetchInterval ?? 3e3,
12336
13314
  staleTime: 0,
@@ -12340,8 +13318,8 @@ function useExecutions(userId, publishableKey, options) {
12340
13318
  }
12341
13319
 
12342
13320
  // src/hooks/use-withdraw-polling.ts
12343
- var import_react19 = require("react");
12344
- var import_core28 = require("@unifold/core");
13321
+ var import_react20 = require("react");
13322
+ var import_core30 = require("@unifold/core");
12345
13323
  var POLL_INTERVAL_MS2 = 2500;
12346
13324
  var POLL_ENDPOINT_INTERVAL_MS2 = 3e3;
12347
13325
  var CUTOFF_BUFFER_MS2 = 6e4;
@@ -12353,20 +13331,20 @@ function useWithdrawPolling({
12353
13331
  onWithdrawSuccess,
12354
13332
  onWithdrawError
12355
13333
  }) {
12356
- const [executions, setExecutions] = (0, import_react19.useState)([]);
12357
- const [isPolling, setIsPolling] = (0, import_react19.useState)(false);
12358
- const enabledAtRef = (0, import_react19.useRef)(/* @__PURE__ */ new Date());
12359
- const trackedRef = (0, import_react19.useRef)(/* @__PURE__ */ new Map());
12360
- const prevEnabledRef = (0, import_react19.useRef)(false);
12361
- const onSuccessRef = (0, import_react19.useRef)(onWithdrawSuccess);
12362
- const onErrorRef = (0, import_react19.useRef)(onWithdrawError);
12363
- (0, import_react19.useEffect)(() => {
13334
+ const [executions, setExecutions] = (0, import_react20.useState)([]);
13335
+ const [isPolling, setIsPolling] = (0, import_react20.useState)(false);
13336
+ const enabledAtRef = (0, import_react20.useRef)(/* @__PURE__ */ new Date());
13337
+ const trackedRef = (0, import_react20.useRef)(/* @__PURE__ */ new Map());
13338
+ const prevEnabledRef = (0, import_react20.useRef)(false);
13339
+ const onSuccessRef = (0, import_react20.useRef)(onWithdrawSuccess);
13340
+ const onErrorRef = (0, import_react20.useRef)(onWithdrawError);
13341
+ (0, import_react20.useEffect)(() => {
12364
13342
  onSuccessRef.current = onWithdrawSuccess;
12365
13343
  }, [onWithdrawSuccess]);
12366
- (0, import_react19.useEffect)(() => {
13344
+ (0, import_react20.useEffect)(() => {
12367
13345
  onErrorRef.current = onWithdrawError;
12368
13346
  }, [onWithdrawError]);
12369
- (0, import_react19.useEffect)(() => {
13347
+ (0, import_react20.useEffect)(() => {
12370
13348
  if (enabled && !prevEnabledRef.current) {
12371
13349
  enabledAtRef.current = /* @__PURE__ */ new Date();
12372
13350
  trackedRef.current.clear();
@@ -12376,20 +13354,20 @@ function useWithdrawPolling({
12376
13354
  }
12377
13355
  prevEnabledRef.current = enabled;
12378
13356
  }, [enabled]);
12379
- (0, import_react19.useEffect)(() => {
13357
+ (0, import_react20.useEffect)(() => {
12380
13358
  if (!userId || !enabled) return;
12381
13359
  const enabledAt = enabledAtRef.current;
12382
13360
  const poll = async () => {
12383
13361
  try {
12384
- const response = await (0, import_core28.queryExecutions)(userId, publishableKey, import_core28.ActionType.Withdraw);
13362
+ const response = await (0, import_core30.queryExecutions)(userId, publishableKey, import_core30.ActionType.Withdraw);
12385
13363
  const cutoff = new Date(enabledAt.getTime() - CUTOFF_BUFFER_MS2);
12386
13364
  const sorted = [...response.data].sort((a, b) => {
12387
13365
  const tA = a.created_at ? new Date(a.created_at).getTime() : 0;
12388
13366
  const tB = b.created_at ? new Date(b.created_at).getTime() : 0;
12389
13367
  return tB - tA;
12390
13368
  });
12391
- const inProgress = [import_core28.ExecutionStatus.PENDING, import_core28.ExecutionStatus.WAITING, import_core28.ExecutionStatus.DELAYED];
12392
- const terminal = [import_core28.ExecutionStatus.SUCCEEDED, import_core28.ExecutionStatus.FAILED];
13369
+ const inProgress = [import_core30.ExecutionStatus.PENDING, import_core30.ExecutionStatus.WAITING, import_core30.ExecutionStatus.DELAYED];
13370
+ const terminal = [import_core30.ExecutionStatus.SUCCEEDED, import_core30.ExecutionStatus.FAILED];
12393
13371
  let target = null;
12394
13372
  for (const ex of sorted) {
12395
13373
  const t11 = ex.created_at ? new Date(ex.created_at) : null;
@@ -12419,9 +13397,9 @@ function useWithdrawPolling({
12419
13397
  }
12420
13398
  return [...list, ex];
12421
13399
  });
12422
- if (ex.status === import_core28.ExecutionStatus.SUCCEEDED && (!prev || inProgress.includes(prev))) {
13400
+ if (ex.status === import_core30.ExecutionStatus.SUCCEEDED && (!prev || inProgress.includes(prev))) {
12423
13401
  onSuccessRef.current?.({ message: "Withdrawal completed successfully", executionId: ex.id, transaction: ex });
12424
- } else if (ex.status === import_core28.ExecutionStatus.FAILED && prev !== import_core28.ExecutionStatus.FAILED) {
13402
+ } else if (ex.status === import_core30.ExecutionStatus.FAILED && prev !== import_core30.ExecutionStatus.FAILED) {
12425
13403
  onErrorRef.current?.({ message: "Withdrawal failed", code: "WITHDRAW_FAILED", error: ex });
12426
13404
  }
12427
13405
  }
@@ -12438,11 +13416,11 @@ function useWithdrawPolling({
12438
13416
  setIsPolling(false);
12439
13417
  };
12440
13418
  }, [userId, publishableKey, enabled]);
12441
- (0, import_react19.useEffect)(() => {
13419
+ (0, import_react20.useEffect)(() => {
12442
13420
  if (!enabled || !depositWalletId) return;
12443
13421
  const trigger = async () => {
12444
13422
  try {
12445
- await (0, import_core28.pollDirectExecutions)({ deposit_wallet_id: depositWalletId }, publishableKey);
13423
+ await (0, import_core30.pollDirectExecutions)({ deposit_wallet_id: depositWalletId }, publishableKey);
12446
13424
  } catch {
12447
13425
  }
12448
13426
  };
@@ -12454,7 +13432,7 @@ function useWithdrawPolling({
12454
13432
  }
12455
13433
 
12456
13434
  // src/components/withdrawals/WithdrawDoubleInput.tsx
12457
- var import_jsx_runtime52 = require("react/jsx-runtime");
13435
+ var import_jsx_runtime53 = require("react/jsx-runtime");
12458
13436
  var t7 = i18n.withdrawModal;
12459
13437
  var getChainKey4 = (chainId, chainType) => `${chainType}:${chainId}`;
12460
13438
  function WithdrawDoubleInput({
@@ -12469,8 +13447,8 @@ function WithdrawDoubleInput({
12469
13447
  const isDarkMode = useTheme().themeClass.includes("uf-dark");
12470
13448
  const selectedToken = selectedTokenSymbol ? tokens.find((t11) => t11.symbol === selectedTokenSymbol) : void 0;
12471
13449
  const availableChainsForToken = selectedToken?.chains || [];
12472
- const renderTokenItem = (tokenData) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
12473
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13450
+ const renderTokenItem = (tokenData) => /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
13451
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
12474
13452
  "img",
12475
13453
  {
12476
13454
  src: tokenData.icon_url,
@@ -12481,10 +13459,10 @@ function WithdrawDoubleInput({
12481
13459
  className: "uf-rounded-full uf-flex-shrink-0"
12482
13460
  }
12483
13461
  ),
12484
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "uf-text-xs uf-font-normal", children: tokenData.symbol })
13462
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uf-text-xs uf-font-normal", children: tokenData.symbol })
12485
13463
  ] });
12486
- const renderChainItem = (chainData) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
12487
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13464
+ const renderChainItem = (chainData) => /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
13465
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
12488
13466
  "img",
12489
13467
  {
12490
13468
  src: chainData.icon_url,
@@ -12495,14 +13473,14 @@ function WithdrawDoubleInput({
12495
13473
  className: "uf-rounded-full uf-flex-shrink-0"
12496
13474
  }
12497
13475
  ),
12498
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "uf-text-xs uf-font-normal", children: chainData.chain_name })
13476
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uf-text-xs uf-font-normal", children: chainData.chain_name })
12499
13477
  ] });
12500
13478
  const currentChainData = selectedChainKey ? availableChainsForToken.find(
12501
13479
  (c) => getChainKey4(c.chain_id, c.chain_type) === selectedChainKey
12502
13480
  ) : void 0;
12503
- return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "uf-grid uf-grid-cols-2 uf-gap-2.5", children: [
12504
- /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { children: [
12505
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13481
+ return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-grid uf-grid-cols-2 uf-gap-2.5", children: [
13482
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { children: [
13483
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
12506
13484
  "div",
12507
13485
  {
12508
13486
  className: "uf-text-xs uf-mb-2 uf-flex uf-items-center uf-gap-1",
@@ -12510,14 +13488,14 @@ function WithdrawDoubleInput({
12510
13488
  children: t7.receiveToken
12511
13489
  }
12512
13490
  ),
12513
- /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
13491
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
12514
13492
  Select,
12515
13493
  {
12516
13494
  value: selectedTokenSymbol ?? "",
12517
13495
  onValueChange: onTokenChange,
12518
13496
  disabled: isLoading || tokens.length === 0,
12519
13497
  children: [
12520
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13498
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
12521
13499
  SelectTrigger,
12522
13500
  {
12523
13501
  className: "uf-h-10 hover:uf-opacity-90 uf-text-foreground disabled:uf-opacity-50",
@@ -12525,10 +13503,10 @@ function WithdrawDoubleInput({
12525
13503
  backgroundColor: components.card.backgroundColor,
12526
13504
  border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
12527
13505
  },
12528
- children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(SelectValue, { children: isLoading || !selectedTokenSymbol ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "uf-text-xs uf-font-light uf-text-muted-foreground", children: t7.loading }) : selectedToken ? renderTokenItem(selectedToken) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "uf-text-xs uf-font-normal", children: selectedTokenSymbol }) })
13506
+ children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(SelectValue, { children: isLoading || !selectedTokenSymbol ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uf-text-xs uf-font-light uf-text-muted-foreground", children: t7.loading }) : selectedToken ? renderTokenItem(selectedToken) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uf-text-xs uf-font-normal", children: selectedTokenSymbol }) })
12529
13507
  }
12530
13508
  ),
12531
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13509
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
12532
13510
  SelectContent,
12533
13511
  {
12534
13512
  className: "uf-bg-secondary uf-border uf-text-foreground uf-max-h-[300px]",
@@ -12536,7 +13514,7 @@ function WithdrawDoubleInput({
12536
13514
  border: `1px solid ${isDarkMode ? "rgba(255,255,255,0.15)" : "rgba(0,0,0,0.15)"}`,
12537
13515
  ...fonts.regular ? { "--uf-font-family": fonts.regular } : {}
12538
13516
  },
12539
- children: tokens.map((tokenData) => /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13517
+ children: tokens.map((tokenData) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
12540
13518
  SelectItem,
12541
13519
  {
12542
13520
  value: tokenData.symbol,
@@ -12551,8 +13529,8 @@ function WithdrawDoubleInput({
12551
13529
  }
12552
13530
  )
12553
13531
  ] }),
12554
- /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { children: [
12555
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13532
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { children: [
13533
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
12556
13534
  "div",
12557
13535
  {
12558
13536
  className: "uf-text-xs uf-mb-2 uf-flex uf-items-center uf-gap-1",
@@ -12560,14 +13538,14 @@ function WithdrawDoubleInput({
12560
13538
  children: t7.receiveChain
12561
13539
  }
12562
13540
  ),
12563
- /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
13541
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
12564
13542
  Select,
12565
13543
  {
12566
13544
  value: selectedChainKey ?? "",
12567
13545
  onValueChange: onChainChange,
12568
13546
  disabled: isLoading || availableChainsForToken.length === 0,
12569
13547
  children: [
12570
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13548
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
12571
13549
  SelectTrigger,
12572
13550
  {
12573
13551
  className: "uf-h-10 hover:uf-opacity-90 uf-text-foreground disabled:uf-opacity-50",
@@ -12575,10 +13553,10 @@ function WithdrawDoubleInput({
12575
13553
  backgroundColor: components.card.backgroundColor,
12576
13554
  border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
12577
13555
  },
12578
- children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(SelectValue, { children: isLoading || !selectedChainKey ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "uf-text-xs uf-font-light uf-text-muted-foreground", children: t7.loading }) : currentChainData ? renderChainItem(currentChainData) : /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { className: "uf-text-xs uf-font-normal", children: selectedChainKey }) })
13556
+ children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(SelectValue, { children: isLoading || !selectedChainKey ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uf-text-xs uf-font-light uf-text-muted-foreground", children: t7.loading }) : currentChainData ? renderChainItem(currentChainData) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uf-text-xs uf-font-normal", children: selectedChainKey }) })
12579
13557
  }
12580
13558
  ),
12581
- /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13559
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
12582
13560
  SelectContent,
12583
13561
  {
12584
13562
  align: "end",
@@ -12587,9 +13565,9 @@ function WithdrawDoubleInput({
12587
13565
  border: `1px solid ${isDarkMode ? "rgba(255,255,255,0.15)" : "rgba(0,0,0,0.15)"}`,
12588
13566
  ...fonts.regular ? { "--uf-font-family": fonts.regular } : {}
12589
13567
  },
12590
- children: availableChainsForToken.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { className: "uf-px-2 uf-py-3 uf-text-xs uf-text-muted-foreground uf-text-center", children: "No chains available" }) : availableChainsForToken.map((chainData) => {
13568
+ children: availableChainsForToken.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uf-px-2 uf-py-3 uf-text-xs uf-text-muted-foreground uf-text-center", children: "No chains available" }) : availableChainsForToken.map((chainData) => {
12591
13569
  const chainKey = getChainKey4(chainData.chain_id, chainData.chain_type);
12592
- return /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
13570
+ return /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
12593
13571
  SelectItem,
12594
13572
  {
12595
13573
  value: chainKey,
@@ -12609,12 +13587,12 @@ function WithdrawDoubleInput({
12609
13587
  }
12610
13588
 
12611
13589
  // src/components/withdrawals/WithdrawForm.tsx
12612
- var import_react20 = require("react");
12613
- var import_lucide_react24 = require("lucide-react");
13590
+ var import_react21 = require("react");
13591
+ var import_lucide_react25 = require("lucide-react");
12614
13592
 
12615
13593
  // src/hooks/use-verify-recipient-address.ts
12616
- var import_react_query13 = require("@tanstack/react-query");
12617
- var import_core29 = require("@unifold/core");
13594
+ var import_react_query15 = require("@tanstack/react-query");
13595
+ var import_core31 = require("@unifold/core");
12618
13596
  function useVerifyRecipientAddress(params) {
12619
13597
  const {
12620
13598
  chainType,
@@ -12626,7 +13604,7 @@ function useVerifyRecipientAddress(params) {
12626
13604
  } = params;
12627
13605
  const trimmedAddress = recipientAddress?.trim() || "";
12628
13606
  const hasAllParams = !!chainType && !!chainId && !!tokenAddress && trimmedAddress.length > 0;
12629
- return (0, import_react_query13.useQuery)({
13607
+ return (0, import_react_query15.useQuery)({
12630
13608
  queryKey: [
12631
13609
  "unifold",
12632
13610
  "verifyRecipientAddress",
@@ -12636,7 +13614,7 @@ function useVerifyRecipientAddress(params) {
12636
13614
  trimmedAddress,
12637
13615
  publishableKey
12638
13616
  ],
12639
- queryFn: () => (0, import_core29.verifyRecipientAddress)(
13617
+ queryFn: () => (0, import_core31.verifyRecipientAddress)(
12640
13618
  {
12641
13619
  chain_type: chainType,
12642
13620
  chain_id: chainId,
@@ -12655,7 +13633,7 @@ function useVerifyRecipientAddress(params) {
12655
13633
  }
12656
13634
 
12657
13635
  // src/components/withdrawals/send-withdraw.ts
12658
- var import_core30 = require("@unifold/core");
13636
+ var import_core32 = require("@unifold/core");
12659
13637
  async function sendEvmWithdraw(params) {
12660
13638
  const {
12661
13639
  provider,
@@ -12733,7 +13711,7 @@ async function sendSolanaWithdraw(params) {
12733
13711
  if (!provider.publicKey) {
12734
13712
  await provider.connect();
12735
13713
  }
12736
- const buildResponse = await (0, import_core30.buildSolanaTransaction)(
13714
+ const buildResponse = await (0, import_core32.buildSolanaTransaction)(
12737
13715
  {
12738
13716
  chain_id: "mainnet",
12739
13717
  token_address: sourceTokenAddress === "" ? "native" : sourceTokenAddress,
@@ -12759,12 +13737,58 @@ async function sendSolanaWithdraw(params) {
12759
13737
  for (let i = 0; i < serialized.length; i++) {
12760
13738
  binaryStr += String.fromCharCode(serialized[i]);
12761
13739
  }
12762
- const sendResponse = await (0, import_core30.sendSolanaTransaction)(
13740
+ const sendResponse = await (0, import_core32.sendSolanaTransaction)(
12763
13741
  { chain_id: "mainnet", signed_transaction: btoa(binaryStr) },
12764
13742
  publishableKey
12765
13743
  );
12766
13744
  return sendResponse.signature;
12767
13745
  }
13746
+ var HYPERCORE_CHAIN_ID = "1337";
13747
+ var HYPERCORE_SPOT_USDC_ADDRESS = "0x6d1e7cde53ba9467b783cb7c530ce054";
13748
+ function isHypercoreChain(chainId) {
13749
+ return chainId === HYPERCORE_CHAIN_ID;
13750
+ }
13751
+ async function sendHypercoreWithdraw(params) {
13752
+ const {
13753
+ provider,
13754
+ fromAddress,
13755
+ depositWalletAddress,
13756
+ sourceTokenAddress,
13757
+ amount,
13758
+ tokenSymbol,
13759
+ publishableKey
13760
+ } = params;
13761
+ const isSpot = sourceTokenAddress.toLowerCase() === HYPERCORE_SPOT_USDC_ADDRESS;
13762
+ const currentChainHex = await provider.request({
13763
+ method: "eth_chainId",
13764
+ params: []
13765
+ });
13766
+ const activeChainId = String(parseInt(currentChainHex, 16));
13767
+ const buildResult = await (0, import_core32.buildHypercoreTransaction)(
13768
+ {
13769
+ action_type: isSpot ? "spot_send" : "usd_send",
13770
+ signature_chain_type: "ethereum",
13771
+ signature_chain_id: activeChainId,
13772
+ recipient_address: depositWalletAddress,
13773
+ token_address: sourceTokenAddress,
13774
+ token_symbol: tokenSymbol || void 0,
13775
+ amount
13776
+ },
13777
+ publishableKey
13778
+ );
13779
+ const signature = await provider.request({
13780
+ method: "eth_signTypedData_v4",
13781
+ params: [fromAddress, JSON.stringify(buildResult.typed_data)]
13782
+ });
13783
+ await (0, import_core32.sendHypercoreTransaction)(
13784
+ {
13785
+ action_payload: buildResult.action_payload,
13786
+ signature,
13787
+ nonce: buildResult.nonce
13788
+ },
13789
+ publishableKey
13790
+ );
13791
+ }
12768
13792
  async function detectBrowserWallet(chainType, senderAddress) {
12769
13793
  const win = typeof window !== "undefined" ? window : null;
12770
13794
  if (!win || !senderAddress) return null;
@@ -12838,7 +13862,7 @@ async function detectBrowserWallet(chainType, senderAddress) {
12838
13862
  }
12839
13863
 
12840
13864
  // src/components/withdrawals/WithdrawForm.tsx
12841
- var import_jsx_runtime53 = require("react/jsx-runtime");
13865
+ var import_jsx_runtime54 = require("react/jsx-runtime");
12842
13866
  var t8 = i18n.withdrawModal;
12843
13867
  var tCrypto = i18n.transferCrypto;
12844
13868
  function formatProcessingTime2(seconds) {
@@ -12891,22 +13915,22 @@ function WithdrawForm({
12891
13915
  footerLeft
12892
13916
  }) {
12893
13917
  const { colors: colors2, fonts, components } = useTheme();
12894
- const [recipientAddress, setRecipientAddress] = (0, import_react20.useState)(recipientAddressProp || "");
12895
- const [amount, setAmount] = (0, import_react20.useState)("");
12896
- const [inputUnit, setInputUnit] = (0, import_react20.useState)("crypto");
12897
- const [isSubmitting, setIsSubmitting] = (0, import_react20.useState)(false);
12898
- const [submitError, setSubmitError] = (0, import_react20.useState)(null);
12899
- const [detailsExpanded, setDetailsExpanded] = (0, import_react20.useState)(false);
12900
- const [glossaryOpen, setGlossaryOpen] = (0, import_react20.useState)(false);
12901
- (0, import_react20.useEffect)(() => {
13918
+ const [recipientAddress, setRecipientAddress] = (0, import_react21.useState)(recipientAddressProp || "");
13919
+ const [amount, setAmount] = (0, import_react21.useState)("");
13920
+ const [inputUnit, setInputUnit] = (0, import_react21.useState)("crypto");
13921
+ const [isSubmitting, setIsSubmitting] = (0, import_react21.useState)(false);
13922
+ const [submitError, setSubmitError] = (0, import_react21.useState)(null);
13923
+ const [detailsExpanded, setDetailsExpanded] = (0, import_react21.useState)(false);
13924
+ const [glossaryOpen, setGlossaryOpen] = (0, import_react21.useState)(false);
13925
+ (0, import_react21.useEffect)(() => {
12902
13926
  setRecipientAddress(recipientAddressProp || "");
12903
13927
  setAmount("");
12904
13928
  setInputUnit("crypto");
12905
13929
  setSubmitError(null);
12906
13930
  }, [recipientAddressProp]);
12907
13931
  const trimmedAddress = recipientAddress.trim();
12908
- const [debouncedAddress, setDebouncedAddress] = (0, import_react20.useState)(trimmedAddress);
12909
- (0, import_react20.useEffect)(() => {
13932
+ const [debouncedAddress, setDebouncedAddress] = (0, import_react21.useState)(trimmedAddress);
13933
+ (0, import_react21.useEffect)(() => {
12910
13934
  const id = setTimeout(() => setDebouncedAddress(trimmedAddress), 500);
12911
13935
  return () => clearTimeout(id);
12912
13936
  }, [trimmedAddress]);
@@ -12923,7 +13947,7 @@ function WithdrawForm({
12923
13947
  enabled: debouncedAddress.length > 5 && !!selectedChain
12924
13948
  });
12925
13949
  const isDebouncing = trimmedAddress !== debouncedAddress;
12926
- const addressError = (0, import_react20.useMemo)(() => {
13950
+ const addressError = (0, import_react21.useMemo)(() => {
12927
13951
  if (!trimmedAddress || trimmedAddress.length <= 5) return null;
12928
13952
  if (isDebouncing || isVerifyingAddress) return null;
12929
13953
  if (verifyError) return t8.invalidAddress;
@@ -12937,47 +13961,47 @@ function WithdrawForm({
12937
13961
  return null;
12938
13962
  }, [trimmedAddress, isDebouncing, isVerifyingAddress, verifyError, addressVerification, selectedChain, selectedToken]);
12939
13963
  const isAddressValid = !isDebouncing && !!addressVerification?.valid && !addressError;
12940
- const exchangeRate = (0, import_react20.useMemo)(() => {
13964
+ const exchangeRate = (0, import_react21.useMemo)(() => {
12941
13965
  if (!balanceData?.exchangeRate) return 0;
12942
13966
  return parseFloat(balanceData.exchangeRate);
12943
13967
  }, [balanceData]);
12944
- const balanceCrypto = (0, import_react20.useMemo)(() => {
13968
+ const balanceCrypto = (0, import_react21.useMemo)(() => {
12945
13969
  if (!balanceData?.balanceHuman) return 0;
12946
13970
  return parseFloat(balanceData.balanceHuman);
12947
13971
  }, [balanceData]);
12948
- const balanceUsdNum = (0, import_react20.useMemo)(() => {
13972
+ const balanceUsdNum = (0, import_react21.useMemo)(() => {
12949
13973
  if (!balanceData?.balanceUsd) return 0;
12950
13974
  return parseFloat(balanceData.balanceUsd);
12951
13975
  }, [balanceData]);
12952
13976
  const tokenSymbol = sourceTokenSymbol || balanceData?.symbol || "TOKEN";
12953
13977
  const sourceDecimals = balanceData?.decimals ?? 6;
12954
- const cryptoAmountFromInput = (0, import_react20.useMemo)(() => {
13978
+ const cryptoAmountFromInput = (0, import_react21.useMemo)(() => {
12955
13979
  const val = parseFloat(amount);
12956
13980
  if (!val || val <= 0) return 0;
12957
13981
  if (inputUnit === "crypto") return val;
12958
13982
  return exchangeRate > 0 ? val / exchangeRate : 0;
12959
13983
  }, [amount, inputUnit, exchangeRate]);
12960
- const fiatAmountFromInput = (0, import_react20.useMemo)(() => {
13984
+ const fiatAmountFromInput = (0, import_react21.useMemo)(() => {
12961
13985
  const val = parseFloat(amount);
12962
13986
  if (!val || val <= 0) return 0;
12963
13987
  if (inputUnit === "fiat") return val;
12964
13988
  return val * exchangeRate;
12965
13989
  }, [amount, inputUnit, exchangeRate]);
12966
- const convertedDisplay = (0, import_react20.useMemo)(() => {
13990
+ const convertedDisplay = (0, import_react21.useMemo)(() => {
12967
13991
  if (!amount || parseFloat(amount) <= 0) return null;
12968
13992
  if (inputUnit === "crypto") {
12969
13993
  return `$${fiatAmountFromInput.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
12970
13994
  }
12971
13995
  return `${cryptoAmountFromInput.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 6 })} ${tokenSymbol}`;
12972
13996
  }, [amount, inputUnit, fiatAmountFromInput, cryptoAmountFromInput, tokenSymbol]);
12973
- const balanceDisplay = (0, import_react20.useMemo)(() => {
13997
+ const balanceDisplay = (0, import_react21.useMemo)(() => {
12974
13998
  if (isLoadingBalance || !balanceData) return null;
12975
13999
  if (inputUnit === "crypto") {
12976
14000
  return `${balanceCrypto.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })} ${tokenSymbol}`;
12977
14001
  }
12978
14002
  return `$${balanceUsdNum.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
12979
14003
  }, [isLoadingBalance, balanceData, inputUnit, balanceCrypto, balanceUsdNum, tokenSymbol]);
12980
- const handleSwitchUnit = (0, import_react20.useCallback)(() => {
14004
+ const handleSwitchUnit = (0, import_react21.useCallback)(() => {
12981
14005
  const val = parseFloat(amount);
12982
14006
  if (!val || val <= 0 || exchangeRate <= 0) {
12983
14007
  setInputUnit((u) => u === "crypto" ? "fiat" : "crypto");
@@ -12994,7 +14018,7 @@ function WithdrawForm({
12994
14018
  setInputUnit("crypto");
12995
14019
  }
12996
14020
  }, [amount, inputUnit, exchangeRate, sourceDecimals]);
12997
- const handleMaxClick = (0, import_react20.useCallback)(() => {
14021
+ const handleMaxClick = (0, import_react21.useCallback)(() => {
12998
14022
  if (inputUnit === "crypto") {
12999
14023
  if (balanceCrypto <= 0) return;
13000
14024
  setAmount(balanceData?.balanceHuman ?? "0");
@@ -13006,7 +14030,7 @@ function WithdrawForm({
13006
14030
  const isBelowMinimum = minimumWithdrawAmountUsd !== null && fiatAmountFromInput > 0 && fiatAmountFromInput < minimumWithdrawAmountUsd;
13007
14031
  const isOverBalance = inputUnit === "crypto" ? cryptoAmountFromInput > 0 && balanceCrypto > 0 && cryptoAmountFromInput > balanceCrypto : fiatAmountFromInput > 0 && balanceUsdNum > 0 && fiatAmountFromInput > balanceUsdNum;
13008
14032
  const isFormValid = trimmedAddress.length > 0 && amount.trim().length > 0 && cryptoAmountFromInput > 0 && isAddressValid && !isBelowMinimum && !isOverBalance && !!balanceData;
13009
- const handleWithdraw = (0, import_react20.useCallback)(async () => {
14033
+ const handleWithdraw = (0, import_react21.useCallback)(async () => {
13010
14034
  if (!selectedToken || !selectedChain) return;
13011
14035
  if (!isFormValid) return;
13012
14036
  setIsSubmitting(true);
@@ -13039,7 +14063,17 @@ function WithdrawForm({
13039
14063
  recipientAddress: trimmedAddress
13040
14064
  };
13041
14065
  if (detectedWallet) {
13042
- if (detectedWallet.chainFamily === "evm") {
14066
+ if (detectedWallet.chainFamily === "evm" && isHypercoreChain(sourceChainId)) {
14067
+ await sendHypercoreWithdraw({
14068
+ provider: detectedWallet.provider,
14069
+ fromAddress: detectedWallet.address,
14070
+ depositWalletAddress: depositWallet.address,
14071
+ sourceTokenAddress,
14072
+ amount: humanAmount,
14073
+ tokenSymbol,
14074
+ publishableKey
14075
+ });
14076
+ } else if (detectedWallet.chainFamily === "evm") {
13043
14077
  await sendEvmWithdraw({
13044
14078
  provider: detectedWallet.provider,
13045
14079
  fromAddress: detectedWallet.address,
@@ -13076,9 +14110,9 @@ function WithdrawForm({
13076
14110
  setIsSubmitting(false);
13077
14111
  }
13078
14112
  }, [selectedToken, selectedChain, isFormValid, cryptoAmountFromInput, sourceDecimals, trimmedAddress, publishableKey, onWithdraw, detectedWallet, sourceTokenAddress, sourceChainId, onWithdrawError, onDepositWalletCreation, onWithdrawSubmitted, amount, inputUnit, balanceCrypto, balanceUsdNum, balanceData]);
13079
- return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
13080
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { children: [
13081
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14113
+ return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
14114
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { children: [
14115
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13082
14116
  "div",
13083
14117
  {
13084
14118
  className: "uf-text-xs uf-mb-1.5",
@@ -13086,7 +14120,7 @@ function WithdrawForm({
13086
14120
  children: t8.recipientAddress
13087
14121
  }
13088
14122
  ),
13089
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14123
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13090
14124
  "style",
13091
14125
  {
13092
14126
  dangerouslySetInnerHTML: {
@@ -13094,7 +14128,7 @@ function WithdrawForm({
13094
14128
  }
13095
14129
  }
13096
14130
  ),
13097
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
14131
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
13098
14132
  "div",
13099
14133
  {
13100
14134
  className: "uf-flex uf-items-center uf-gap-1 uf-pr-2",
@@ -13104,7 +14138,7 @@ function WithdrawForm({
13104
14138
  border: `${components.input.borderWidth}px solid ${addressError ? colors2.error : components.input.borderColor}`
13105
14139
  },
13106
14140
  children: [
13107
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14141
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13108
14142
  "input",
13109
14143
  {
13110
14144
  type: "text",
@@ -13121,7 +14155,7 @@ function WithdrawForm({
13121
14155
  }
13122
14156
  }
13123
14157
  ),
13124
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14158
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13125
14159
  "button",
13126
14160
  {
13127
14161
  type: "button",
@@ -13138,27 +14172,27 @@ function WithdrawForm({
13138
14172
  className: "uf-flex-shrink-0 uf-p-1 uf-rounded uf-transition-colors hover:uf-opacity-70",
13139
14173
  style: { color: colors2.foregroundMuted },
13140
14174
  title: "Paste from clipboard",
13141
- children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.ClipboardPaste, { className: "uf-w-4 uf-h-4" })
14175
+ children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.ClipboardPaste, { className: "uf-w-4 uf-h-4" })
13142
14176
  }
13143
14177
  )
13144
14178
  ]
13145
14179
  }
13146
14180
  ),
13147
- (isDebouncing || isVerifyingAddress) && trimmedAddress.length > 5 && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
13148
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.Loader2, { className: "uf-w-3 uf-h-3 uf-animate-spin", style: { color: colors2.foregroundMuted } }),
13149
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: t8.verifyingAddress })
14181
+ (isDebouncing || isVerifyingAddress) && trimmedAddress.length > 5 && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
14182
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.Loader2, { className: "uf-w-3 uf-h-3 uf-animate-spin", style: { color: colors2.foregroundMuted } }),
14183
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: t8.verifyingAddress })
13150
14184
  ] }),
13151
- addressError && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
13152
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.AlertTriangle, { className: "uf-w-3 uf-h-3", style: { color: colors2.error } }),
13153
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uf-text-xs", style: { color: colors2.error, fontFamily: fonts.regular }, children: addressError })
14185
+ addressError && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
14186
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.AlertTriangle, { className: "uf-w-3 uf-h-3", style: { color: colors2.error } }),
14187
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "uf-text-xs", style: { color: colors2.error, fontFamily: fonts.regular }, children: addressError })
13154
14188
  ] })
13155
14189
  ] }),
13156
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { children: [
13157
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-text-xs uf-mb-1.5", style: { color: components.card.labelColor, fontFamily: fonts.medium }, children: [
14190
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { children: [
14191
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-text-xs uf-mb-1.5", style: { color: components.card.labelColor, fontFamily: fonts.medium }, children: [
13158
14192
  t8.amount,
13159
- minimumWithdrawAmountUsd != null && minimumWithdrawAmountUsd > 0 && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { style: { color: colors2.warning, fontFamily: fonts.regular }, children: ` ($${minimumWithdrawAmountUsd.toFixed(2)} min)` })
14193
+ minimumWithdrawAmountUsd != null && minimumWithdrawAmountUsd > 0 && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { style: { color: colors2.warning, fontFamily: fonts.regular }, children: ` ($${minimumWithdrawAmountUsd.toFixed(2)} min)` })
13160
14194
  ] }),
13161
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14195
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13162
14196
  "style",
13163
14197
  {
13164
14198
  dangerouslySetInnerHTML: {
@@ -13166,7 +14200,7 @@ function WithdrawForm({
13166
14200
  }
13167
14201
  }
13168
14202
  ),
13169
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
14203
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
13170
14204
  "div",
13171
14205
  {
13172
14206
  className: "uf-flex uf-items-center uf-gap-2 uf-px-3 uf-py-2.5",
@@ -13176,7 +14210,7 @@ function WithdrawForm({
13176
14210
  border: `${components.input.borderWidth}px solid ${components.input.borderColor}`
13177
14211
  },
13178
14212
  children: [
13179
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14213
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13180
14214
  "input",
13181
14215
  {
13182
14216
  type: "text",
@@ -13197,8 +14231,8 @@ function WithdrawForm({
13197
14231
  }
13198
14232
  }
13199
14233
  ),
13200
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uf-text-sm uf-shrink-0", style: { color: colors2.foregroundMuted, fontFamily: fonts.medium }, children: inputUnit === "crypto" ? tokenSymbol : "USD" }),
13201
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14234
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "uf-text-sm uf-shrink-0", style: { color: colors2.foregroundMuted, fontFamily: fonts.medium }, children: inputUnit === "crypto" ? tokenSymbol : "USD" }),
14235
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13202
14236
  "button",
13203
14237
  {
13204
14238
  type: "button",
@@ -13211,10 +14245,10 @@ function WithdrawForm({
13211
14245
  ]
13212
14246
  }
13213
14247
  ),
13214
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-mt-1.5 uf-px-3", children: [
13215
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
13216
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: convertedDisplay || (inputUnit === "crypto" ? "$0.00" : `0.00 ${tokenSymbol}`) }),
13217
- exchangeRate > 0 && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14248
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-mt-1.5 uf-px-3", children: [
14249
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
14250
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: convertedDisplay || (inputUnit === "crypto" ? "$0.00" : `0.00 ${tokenSymbol}`) }),
14251
+ exchangeRate > 0 && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13218
14252
  "button",
13219
14253
  {
13220
14254
  type: "button",
@@ -13222,49 +14256,49 @@ function WithdrawForm({
13222
14256
  className: "uf-p-0.5 uf-rounded uf-transition-colors hover:uf-opacity-70",
13223
14257
  style: { color: colors2.foregroundMuted },
13224
14258
  title: "Switch unit",
13225
- children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.ArrowUpDown, { className: "uf-w-3 uf-h-3" })
14259
+ children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.ArrowUpDown, { className: "uf-w-3 uf-h-3" })
13226
14260
  }
13227
14261
  )
13228
14262
  ] }),
13229
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { children: [
13230
- balanceDisplay && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: [
14263
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { children: [
14264
+ balanceDisplay && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: [
13231
14265
  t8.balance,
13232
14266
  ": ",
13233
14267
  balanceDisplay
13234
14268
  ] }),
13235
- isLoadingBalance && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uf-h-3 uf-w-16 uf-bg-muted uf-rounded uf-animate-pulse" })
14269
+ isLoadingBalance && /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "uf-h-3 uf-w-16 uf-bg-muted uf-rounded uf-animate-pulse" })
13236
14270
  ] })
13237
14271
  ] })
13238
14272
  ] }),
13239
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-px-2.5", style: { backgroundColor: components.card.backgroundColor, borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: [
13240
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
14273
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-px-2.5", style: { backgroundColor: components.card.backgroundColor, borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: [
14274
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
13241
14275
  "button",
13242
14276
  {
13243
14277
  type: "button",
13244
14278
  onClick: () => setDetailsExpanded(!detailsExpanded),
13245
14279
  className: "uf-w-full uf-flex uf-items-center uf-justify-between uf-py-2.5",
13246
14280
  children: [
13247
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
13248
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.Clock, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
13249
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
14281
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
14282
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.Clock, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
14283
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
13250
14284
  tCrypto.processingTime.label,
13251
14285
  ":",
13252
14286
  " ",
13253
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: formatProcessingTime2(estimatedProcessingTime) })
14287
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: formatProcessingTime2(estimatedProcessingTime) })
13254
14288
  ] })
13255
14289
  ] }),
13256
- detailsExpanded ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.ChevronUp, { className: "uf-w-4 uf-h-4", style: { color: components.card.actionColor } }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.ChevronDown, { className: "uf-w-4 uf-h-4", style: { color: components.card.actionColor } })
14290
+ detailsExpanded ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.ChevronUp, { className: "uf-w-4 uf-h-4", style: { color: components.card.actionColor } }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.ChevronDown, { className: "uf-w-4 uf-h-4", style: { color: components.card.actionColor } })
13257
14291
  ]
13258
14292
  }
13259
14293
  ),
13260
- detailsExpanded && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-pb-3 uf-space-y-2.5", children: [
13261
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
13262
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.ShieldCheck, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
13263
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
14294
+ detailsExpanded && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-pb-3 uf-space-y-2.5", children: [
14295
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
14296
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.ShieldCheck, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
14297
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
13264
14298
  tCrypto.slippage.label,
13265
14299
  ":",
13266
14300
  " ",
13267
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
14301
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
13268
14302
  tCrypto.slippage.auto,
13269
14303
  " \u2022 ",
13270
14304
  (maxSlippagePercent ?? 0.25).toFixed(2),
@@ -13272,13 +14306,13 @@ function WithdrawForm({
13272
14306
  ] })
13273
14307
  ] })
13274
14308
  ] }),
13275
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
13276
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.DollarSign, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
13277
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
14309
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
14310
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.DollarSign, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
14311
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
13278
14312
  tCrypto.priceImpact.label,
13279
14313
  ":",
13280
14314
  " ",
13281
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
14315
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
13282
14316
  (priceImpactPercent ?? 0).toFixed(2),
13283
14317
  "%"
13284
14318
  ] })
@@ -13286,18 +14320,18 @@ function WithdrawForm({
13286
14320
  ] })
13287
14321
  ] })
13288
14322
  ] }),
13289
- !canWithdraw && !submitError && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
14323
+ !canWithdraw && !submitError && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
13290
14324
  "div",
13291
14325
  {
13292
14326
  className: "uf-flex uf-items-start uf-gap-2.5 uf-p-3 uf-rounded-xl",
13293
14327
  style: { backgroundColor: colors2.card, border: `1px solid ${colors2.border}` },
13294
14328
  children: [
13295
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.Wallet, { className: "uf-w-4 uf-h-4 uf-flex-shrink-0 uf-mt-0.5", style: { color: colors2.warning } }),
13296
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: "No connected wallet detected. Please connect a wallet that matches your account to withdraw." })
14329
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.Wallet, { className: "uf-w-4 uf-h-4 uf-flex-shrink-0 uf-mt-0.5", style: { color: colors2.warning } }),
14330
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: "No connected wallet detected. Please connect a wallet that matches your account to withdraw." })
13297
14331
  ]
13298
14332
  }
13299
14333
  ),
13300
- isWalletMatch && connectedWalletName ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14334
+ isWalletMatch && connectedWalletName ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13301
14335
  "button",
13302
14336
  {
13303
14337
  type: "button",
@@ -13311,16 +14345,16 @@ function WithdrawForm({
13311
14345
  borderRadius: components.button.borderRadius,
13312
14346
  border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
13313
14347
  },
13314
- children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
13315
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.Loader2, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
14348
+ children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
14349
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.Loader2, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
13316
14350
  "Processing..."
13317
- ] }) : isOverBalance ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_jsx_runtime53.Fragment, { children: "Insufficient balance" }) : isBelowMinimum ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_jsx_runtime53.Fragment, { children: "Minimum amount not met" }) : submitError ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_jsx_runtime53.Fragment, { children: "Withdrawal failed. Try again" }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
13318
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.Wallet, { className: "uf-w-4 uf-h-4" }),
14351
+ ] }) : isOverBalance ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_jsx_runtime54.Fragment, { children: "Insufficient balance" }) : isBelowMinimum ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_jsx_runtime54.Fragment, { children: "Minimum amount not met" }) : submitError ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_jsx_runtime54.Fragment, { children: "Withdrawal failed. Try again" }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(import_jsx_runtime54.Fragment, { children: [
14352
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.Wallet, { className: "uf-w-4 uf-h-4" }),
13319
14353
  "Withdraw from ",
13320
14354
  connectedWalletName
13321
14355
  ] })
13322
14356
  }
13323
- ) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14357
+ ) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13324
14358
  "button",
13325
14359
  {
13326
14360
  type: "button",
@@ -13334,17 +14368,17 @@ function WithdrawForm({
13334
14368
  borderRadius: components.button.borderRadius,
13335
14369
  border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
13336
14370
  },
13337
- children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2", children: [
13338
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react24.Loader2, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
14371
+ children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2", children: [
14372
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react25.Loader2, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
13339
14373
  "Processing..."
13340
14374
  ] }) : isOverBalance ? "Insufficient balance" : isBelowMinimum ? "Minimum amount not met" : submitError ? "Withdrawal failed. Try again" : t8.withdraw
13341
14375
  }
13342
14376
  ),
13343
- /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-text-xs uf-pt-1", children: [
13344
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { children: footerLeft }),
13345
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DepositFooterLinks, { onGlossaryClick: () => setGlossaryOpen(true) })
14377
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-text-xs uf-pt-1", children: [
14378
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("div", { children: footerLeft }),
14379
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(DepositFooterLinks, { onGlossaryClick: () => setGlossaryOpen(true) })
13346
14380
  ] }),
13347
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
14381
+ /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13348
14382
  GlossaryModal,
13349
14383
  {
13350
14384
  open: glossaryOpen,
@@ -13355,15 +14389,15 @@ function WithdrawForm({
13355
14389
  }
13356
14390
 
13357
14391
  // src/components/withdrawals/WithdrawExecutionItem.tsx
13358
- var import_lucide_react25 = require("lucide-react");
13359
- var import_core31 = require("@unifold/core");
13360
- var import_jsx_runtime54 = require("react/jsx-runtime");
14392
+ var import_lucide_react26 = require("lucide-react");
14393
+ var import_core33 = require("@unifold/core");
14394
+ var import_jsx_runtime55 = require("react/jsx-runtime");
13361
14395
  function WithdrawExecutionItem({
13362
14396
  execution,
13363
14397
  onClick
13364
14398
  }) {
13365
14399
  const { colors: colors2, fonts, components } = useTheme();
13366
- const isPending = execution.status === import_core31.ExecutionStatus.PENDING || execution.status === import_core31.ExecutionStatus.WAITING || execution.status === import_core31.ExecutionStatus.DELAYED;
14400
+ const isPending = execution.status === import_core33.ExecutionStatus.PENDING || execution.status === import_core33.ExecutionStatus.WAITING || execution.status === import_core33.ExecutionStatus.DELAYED;
13367
14401
  const formatDateTime = (timestamp) => {
13368
14402
  try {
13369
14403
  const date = new Date(timestamp);
@@ -13395,7 +14429,7 @@ function WithdrawExecutionItem({
13395
14429
  return "$0.00";
13396
14430
  }
13397
14431
  };
13398
- return /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
14432
+ return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
13399
14433
  "button",
13400
14434
  {
13401
14435
  onClick,
@@ -13406,11 +14440,11 @@ function WithdrawExecutionItem({
13406
14440
  border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
13407
14441
  },
13408
14442
  children: [
13409
- /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-relative uf-flex-shrink-0 uf-w-9 uf-h-9", children: [
13410
- /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
14443
+ /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "uf-relative uf-flex-shrink-0 uf-w-9 uf-h-9", children: [
14444
+ /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13411
14445
  "img",
13412
14446
  {
13413
- src: execution.destination_token_metadata?.icon_url || (0, import_core31.getIconUrl)("/icons/tokens/svg/usdc.svg"),
14447
+ src: execution.destination_token_metadata?.icon_url || (0, import_core33.getIconUrl)("/icons/tokens/svg/usdc.svg"),
13414
14448
  alt: "Token",
13415
14449
  width: 36,
13416
14450
  height: 36,
@@ -13418,12 +14452,12 @@ function WithdrawExecutionItem({
13418
14452
  className: "uf-rounded-full uf-w-9 uf-h-9"
13419
14453
  }
13420
14454
  ),
13421
- isPending ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
14455
+ isPending ? /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13422
14456
  "div",
13423
14457
  {
13424
14458
  className: "uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-rounded-full uf-p-0.5",
13425
14459
  style: { backgroundColor: colors2.warning },
13426
- children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
14460
+ children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13427
14461
  "svg",
13428
14462
  {
13429
14463
  width: "10",
@@ -13431,7 +14465,7 @@ function WithdrawExecutionItem({
13431
14465
  viewBox: "0 0 12 12",
13432
14466
  fill: "none",
13433
14467
  className: "uf-animate-spin uf-block",
13434
- children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
14468
+ children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13435
14469
  "path",
13436
14470
  {
13437
14471
  d: "M6 1V3M6 9V11M1 6H3M9 6H11M2.5 2.5L4 4M8 8L9.5 9.5M2.5 9.5L4 8M8 4L9.5 2.5",
@@ -13443,12 +14477,12 @@ function WithdrawExecutionItem({
13443
14477
  }
13444
14478
  )
13445
14479
  }
13446
- ) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
14480
+ ) : /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13447
14481
  "div",
13448
14482
  {
13449
14483
  className: "uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-rounded-full uf-p-0.5",
13450
14484
  style: { backgroundColor: colors2.success },
13451
- children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
14485
+ children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13452
14486
  "svg",
13453
14487
  {
13454
14488
  width: "10",
@@ -13456,7 +14490,7 @@ function WithdrawExecutionItem({
13456
14490
  viewBox: "0 0 12 12",
13457
14491
  fill: "none",
13458
14492
  className: "uf-block",
13459
- children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
14493
+ children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13460
14494
  "path",
13461
14495
  {
13462
14496
  d: "M10 3L4.5 8.5L2 6",
@@ -13471,8 +14505,8 @@ function WithdrawExecutionItem({
13471
14505
  }
13472
14506
  )
13473
14507
  ] }),
13474
- /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "uf-flex-1 uf-min-w-0", children: [
13475
- /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
14508
+ /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "uf-flex-1 uf-min-w-0", children: [
14509
+ /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13476
14510
  "h3",
13477
14511
  {
13478
14512
  className: "uf-font-medium uf-text-sm uf-leading-tight",
@@ -13483,7 +14517,7 @@ function WithdrawExecutionItem({
13483
14517
  children: isPending ? "Withdrawal processing" : "Withdrawal completed"
13484
14518
  }
13485
14519
  ),
13486
- /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
14520
+ /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13487
14521
  "p",
13488
14522
  {
13489
14523
  className: "uf-text-xs uf-leading-tight",
@@ -13495,7 +14529,7 @@ function WithdrawExecutionItem({
13495
14529
  }
13496
14530
  )
13497
14531
  ] }),
13498
- /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
14532
+ /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
13499
14533
  "span",
13500
14534
  {
13501
14535
  className: "uf-font-medium uf-text-sm uf-flex-shrink-0",
@@ -13506,8 +14540,8 @@ function WithdrawExecutionItem({
13506
14540
  children: formatUsdAmount2(execution.source_amount_usd || "0")
13507
14541
  }
13508
14542
  ),
13509
- /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
13510
- import_lucide_react25.ChevronRight,
14543
+ /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
14544
+ import_lucide_react26.ChevronRight,
13511
14545
  {
13512
14546
  className: "uf-w-4 uf-h-4 uf-flex-shrink-0",
13513
14547
  style: { color: components.card.actionColor }
@@ -13519,8 +14553,8 @@ function WithdrawExecutionItem({
13519
14553
  }
13520
14554
 
13521
14555
  // src/components/withdrawals/WithdrawConfirmingView.tsx
13522
- var import_react21 = require("react");
13523
- var import_jsx_runtime55 = require("react/jsx-runtime");
14556
+ var import_react22 = require("react");
14557
+ var import_jsx_runtime56 = require("react/jsx-runtime");
13524
14558
  function truncateAddress4(addr) {
13525
14559
  if (addr.length <= 12) return addr;
13526
14560
  return `${addr.slice(0, 6)}...${addr.slice(-4)}`;
@@ -13533,9 +14567,9 @@ function WithdrawConfirmingView({
13533
14567
  onViewTracker
13534
14568
  }) {
13535
14569
  const { colors: colors2, fonts, components } = useTheme();
13536
- const [showButton, setShowButton] = (0, import_react21.useState)(false);
14570
+ const [showButton, setShowButton] = (0, import_react22.useState)(false);
13537
14571
  const latestExecution = executions.length > 0 ? executions[executions.length - 1] : null;
13538
- (0, import_react21.useEffect)(() => {
14572
+ (0, import_react22.useEffect)(() => {
13539
14573
  if (latestExecution) return;
13540
14574
  const timer = setTimeout(() => setShowButton(true), SHOW_BUTTON_DELAY_MS);
13541
14575
  return () => clearTimeout(timer);
@@ -13543,11 +14577,11 @@ function WithdrawConfirmingView({
13543
14577
  const btnRadius = components.button.borderRadius;
13544
14578
  const btnBorder = `${components.button.borderWidth}px solid ${components.button.borderColor}`;
13545
14579
  if (latestExecution) {
13546
- return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
13547
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(DepositHeader, { title: "Withdrawal Details", showClose: true, onClose }),
13548
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(DepositDetailContent, { execution: latestExecution, variant: "withdraw" }),
13549
- /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "uf-flex uf-gap-2 uf-px-2 uf-pt-2", children: [
13550
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
14580
+ return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
14581
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(DepositHeader, { title: "Withdrawal Details", showClose: true, onClose }),
14582
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(DepositDetailContent, { execution: latestExecution, variant: "withdraw" }),
14583
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "uf-flex uf-gap-2 uf-px-2 uf-pt-2", children: [
14584
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13551
14585
  "button",
13552
14586
  {
13553
14587
  type: "button",
@@ -13563,7 +14597,7 @@ function WithdrawConfirmingView({
13563
14597
  children: "Withdrawal History"
13564
14598
  }
13565
14599
  ),
13566
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
14600
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13567
14601
  "button",
13568
14602
  {
13569
14603
  type: "button",
@@ -13580,7 +14614,7 @@ function WithdrawConfirmingView({
13580
14614
  }
13581
14615
  )
13582
14616
  ] }),
13583
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
14617
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13584
14618
  PoweredByUnifold,
13585
14619
  {
13586
14620
  color: colors2.foregroundMuted,
@@ -13589,15 +14623,15 @@ function WithdrawConfirmingView({
13589
14623
  ) })
13590
14624
  ] });
13591
14625
  }
13592
- return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
13593
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(DepositHeader, { title: "Withdrawal Status", showClose: true, onClose }),
13594
- /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-16 uf-px-4", children: [
13595
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
14626
+ return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
14627
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(DepositHeader, { title: "Withdrawal Status", showClose: true, onClose }),
14628
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-16 uf-px-4", children: [
14629
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13596
14630
  "div",
13597
14631
  {
13598
14632
  className: "uf-w-20 uf-h-20 uf-rounded-full uf-flex uf-items-center uf-justify-center uf-mb-6",
13599
14633
  style: { backgroundColor: `${colors2.primary}20` },
13600
- children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
14634
+ children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13601
14635
  "svg",
13602
14636
  {
13603
14637
  width: "40",
@@ -13605,7 +14639,7 @@ function WithdrawConfirmingView({
13605
14639
  viewBox: "0 0 24 24",
13606
14640
  fill: "none",
13607
14641
  className: "uf-animate-spin",
13608
- children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
14642
+ children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13609
14643
  "path",
13610
14644
  {
13611
14645
  d: "M21 12a9 9 0 1 1-6.22-8.56",
@@ -13618,7 +14652,7 @@ function WithdrawConfirmingView({
13618
14652
  )
13619
14653
  }
13620
14654
  ),
13621
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
14655
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13622
14656
  "h3",
13623
14657
  {
13624
14658
  className: "uf-text-xl uf-mb-2",
@@ -13626,7 +14660,7 @@ function WithdrawConfirmingView({
13626
14660
  children: "Checking Withdrawal"
13627
14661
  }
13628
14662
  ),
13629
- /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
14663
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
13630
14664
  "p",
13631
14665
  {
13632
14666
  className: "uf-text-sm uf-text-center",
@@ -13642,7 +14676,7 @@ function WithdrawConfirmingView({
13642
14676
  }
13643
14677
  )
13644
14678
  ] }),
13645
- showButton && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "uf-px-1 uf-pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
14679
+ showButton && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-px-1 uf-pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13646
14680
  "button",
13647
14681
  {
13648
14682
  type: "button",
@@ -13658,7 +14692,7 @@ function WithdrawConfirmingView({
13658
14692
  children: "Withdrawal History"
13659
14693
  }
13660
14694
  ) }),
13661
- /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
14695
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
13662
14696
  PoweredByUnifold,
13663
14697
  {
13664
14698
  color: colors2.foregroundMuted,
@@ -13669,8 +14703,8 @@ function WithdrawConfirmingView({
13669
14703
  }
13670
14704
 
13671
14705
  // src/components/withdrawals/WithdrawModal.tsx
13672
- var import_core32 = require("@unifold/core");
13673
- var import_jsx_runtime56 = require("react/jsx-runtime");
14706
+ var import_core34 = require("@unifold/core");
14707
+ var import_jsx_runtime57 = require("react/jsx-runtime");
13674
14708
  var t9 = i18n.withdrawModal;
13675
14709
  var getChainKey5 = (chainId, chainType) => `${chainType}:${chainId}`;
13676
14710
  function WithdrawModal({
@@ -13692,14 +14726,14 @@ function WithdrawModal({
13692
14726
  hideOverlay = false
13693
14727
  }) {
13694
14728
  const { colors: colors2, fonts, components } = useTheme();
13695
- const [containerEl, setContainerEl] = (0, import_react22.useState)(null);
13696
- const containerCallbackRef = (0, import_react22.useCallback)((el) => {
14729
+ const [containerEl, setContainerEl] = (0, import_react23.useState)(null);
14730
+ const containerCallbackRef = (0, import_react23.useCallback)((el) => {
13697
14731
  setContainerEl(el);
13698
14732
  }, []);
13699
- const [resolvedTheme, setResolvedTheme] = (0, import_react22.useState)(
14733
+ const [resolvedTheme, setResolvedTheme] = (0, import_react23.useState)(
13700
14734
  theme === "auto" ? "dark" : theme
13701
14735
  );
13702
- (0, import_react22.useEffect)(() => {
14736
+ (0, import_react23.useEffect)(() => {
13703
14737
  if (theme === "auto") {
13704
14738
  const mq = window.matchMedia("(prefers-color-scheme: dark)");
13705
14739
  setResolvedTheme(mq.matches ? "dark" : "light");
@@ -13728,12 +14762,12 @@ function WithdrawModal({
13728
14762
  publishableKey,
13729
14763
  enabled: open
13730
14764
  });
13731
- const [selectedToken, setSelectedToken] = (0, import_react22.useState)(null);
13732
- const [selectedChain, setSelectedChain] = (0, import_react22.useState)(null);
13733
- const [detectedWallet, setDetectedWallet] = (0, import_react22.useState)(null);
14765
+ const [selectedToken, setSelectedToken] = (0, import_react23.useState)(null);
14766
+ const [selectedChain, setSelectedChain] = (0, import_react23.useState)(null);
14767
+ const [detectedWallet, setDetectedWallet] = (0, import_react23.useState)(null);
13734
14768
  const connectedWalletName = detectedWallet?.name ?? null;
13735
14769
  const isWalletMatch = !!detectedWallet;
13736
- (0, import_react22.useEffect)(() => {
14770
+ (0, import_react23.useEffect)(() => {
13737
14771
  if (!senderAddress || !open) {
13738
14772
  setDetectedWallet(null);
13739
14773
  return;
@@ -13746,10 +14780,10 @@ function WithdrawModal({
13746
14780
  cancelled = true;
13747
14781
  };
13748
14782
  }, [senderAddress, sourceChainType, open]);
13749
- const [view, setView] = (0, import_react22.useState)("form");
13750
- const [withdrawDepositWalletId, setWithdrawDepositWalletId] = (0, import_react22.useState)();
13751
- const [selectedExecution, setSelectedExecution] = (0, import_react22.useState)(null);
13752
- const [submittedTxInfo, setSubmittedTxInfo] = (0, import_react22.useState)(null);
14783
+ const [view, setView] = (0, import_react23.useState)("form");
14784
+ const [withdrawDepositWalletId, setWithdrawDepositWalletId] = (0, import_react23.useState)();
14785
+ const [selectedExecution, setSelectedExecution] = (0, import_react23.useState)(null);
14786
+ const [submittedTxInfo, setSubmittedTxInfo] = (0, import_react23.useState)(null);
13753
14787
  const { executions: realtimeExecutions } = useWithdrawPolling({
13754
14788
  userId: externalUserId,
13755
14789
  publishableKey,
@@ -13759,35 +14793,35 @@ function WithdrawModal({
13759
14793
  onWithdrawError
13760
14794
  });
13761
14795
  const { data: allWithdrawalsData } = useExecutions(externalUserId, publishableKey, {
13762
- actionType: import_core32.ActionType.Withdraw,
14796
+ actionType: import_core34.ActionType.Withdraw,
13763
14797
  enabled: open,
13764
14798
  refetchInterval: view === "tracker" || view === "detail" ? 5e3 : 15e3
13765
14799
  });
13766
14800
  const allWithdrawals = allWithdrawalsData?.data ?? [];
13767
- const handleDepositWalletCreation = (0, import_react22.useCallback)(async (params) => {
13768
- const { data: wallets } = await (0, import_core32.createDepositAddress)(
14801
+ const handleDepositWalletCreation = (0, import_react23.useCallback)(async (params) => {
14802
+ const { data: wallets } = await (0, import_core34.createDepositAddress)(
13769
14803
  {
13770
14804
  external_user_id: externalUserId,
13771
14805
  destination_chain_type: params.destinationChainType,
13772
14806
  destination_chain_id: params.destinationChainId,
13773
14807
  destination_token_address: params.destinationTokenAddress,
13774
14808
  recipient_address: params.recipientAddress,
13775
- action_type: import_core32.ActionType.Withdraw
14809
+ action_type: import_core34.ActionType.Withdraw
13776
14810
  },
13777
14811
  publishableKey
13778
14812
  );
13779
- const depositWallet = (0, import_core32.getWalletByChainType)(wallets, sourceChainType);
14813
+ const depositWallet = (0, import_core34.getWalletByChainType)(wallets, sourceChainType);
13780
14814
  if (!depositWallet) {
13781
14815
  throw new Error(`No deposit wallet available for ${sourceChainType}`);
13782
14816
  }
13783
14817
  setWithdrawDepositWalletId(depositWallet.id);
13784
14818
  return depositWallet;
13785
14819
  }, [externalUserId, publishableKey, sourceChainType]);
13786
- const handleWithdrawSubmitted = (0, import_react22.useCallback)((txInfo) => {
14820
+ const handleWithdrawSubmitted = (0, import_react23.useCallback)((txInfo) => {
13787
14821
  setSubmittedTxInfo(txInfo);
13788
14822
  setView("confirming");
13789
14823
  }, []);
13790
- (0, import_react22.useEffect)(() => {
14824
+ (0, import_react23.useEffect)(() => {
13791
14825
  if (!destinationTokens.length || selectedToken) return;
13792
14826
  const first = destinationTokens[0];
13793
14827
  if (first?.chains.length > 0) {
@@ -13795,8 +14829,8 @@ function WithdrawModal({
13795
14829
  setSelectedChain(first.chains[0]);
13796
14830
  }
13797
14831
  }, [destinationTokens, selectedToken]);
13798
- const resetViewTimeoutRef = (0, import_react22.useRef)(null);
13799
- const handleClose = (0, import_react22.useCallback)(() => {
14832
+ const resetViewTimeoutRef = (0, import_react23.useRef)(null);
14833
+ const handleClose = (0, import_react23.useCallback)(() => {
13800
14834
  onOpenChange(false);
13801
14835
  if (resetViewTimeoutRef.current) clearTimeout(resetViewTimeoutRef.current);
13802
14836
  resetViewTimeoutRef.current = setTimeout(() => {
@@ -13809,7 +14843,7 @@ function WithdrawModal({
13809
14843
  resetViewTimeoutRef.current = null;
13810
14844
  }, 200);
13811
14845
  }, [onOpenChange]);
13812
- (0, import_react22.useLayoutEffect)(() => {
14846
+ (0, import_react23.useLayoutEffect)(() => {
13813
14847
  if (!open) return;
13814
14848
  if (resetViewTimeoutRef.current) {
13815
14849
  clearTimeout(resetViewTimeoutRef.current);
@@ -13822,17 +14856,17 @@ function WithdrawModal({
13822
14856
  setSubmittedTxInfo(null);
13823
14857
  setWithdrawDepositWalletId(void 0);
13824
14858
  }, [open]);
13825
- (0, import_react22.useEffect)(() => () => {
14859
+ (0, import_react23.useEffect)(() => () => {
13826
14860
  if (resetViewTimeoutRef.current) clearTimeout(resetViewTimeoutRef.current);
13827
14861
  }, []);
13828
- const handleTokenSymbolChange = (0, import_react22.useCallback)((symbol) => {
14862
+ const handleTokenSymbolChange = (0, import_react23.useCallback)((symbol) => {
13829
14863
  const tok = destinationTokens.find((t11) => t11.symbol === symbol);
13830
14864
  if (tok) {
13831
14865
  setSelectedToken(tok);
13832
14866
  if (tok.chains.length > 0) setSelectedChain(tok.chains[0]);
13833
14867
  }
13834
14868
  }, [destinationTokens]);
13835
- const handleChainKeyChange = (0, import_react22.useCallback)((chainKey) => {
14869
+ const handleChainKeyChange = (0, import_react23.useCallback)((chainKey) => {
13836
14870
  if (!selectedToken) return;
13837
14871
  const chain = selectedToken.chains.find((c) => getChainKey5(c.chain_id, c.chain_type) === chainKey);
13838
14872
  if (chain) setSelectedChain(chain);
@@ -13840,8 +14874,8 @@ function WithdrawModal({
13840
14874
  const isSourceSupported = sourceValidation?.isSupported ?? null;
13841
14875
  const canWithdraw = !!onWithdraw || isWalletMatch;
13842
14876
  const isAnyLoading = tokensLoading || isCheckingSourceToken;
13843
- const withdrawPoweredByFooter = /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PoweredByUnifold, { color: colors2.foregroundMuted, className: "uf-flex uf-justify-center uf-shrink-0" }) });
13844
- return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(PortalContainerProvider, { value: hideOverlay ? containerEl : null, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Dialog, { open: hideOverlay || open, onOpenChange: hideOverlay ? void 0 : handleClose, modal: !hideOverlay, children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
14877
+ const withdrawPoweredByFooter = /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(PoweredByUnifold, { color: colors2.foregroundMuted, className: "uf-flex uf-justify-center uf-shrink-0" }) });
14878
+ return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(PortalContainerProvider, { value: hideOverlay ? containerEl : null, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(Dialog, { open: hideOverlay || open, onOpenChange: hideOverlay ? void 0 : handleClose, modal: !hideOverlay, children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
13845
14879
  DialogContent,
13846
14880
  {
13847
14881
  ref: hideOverlay ? containerCallbackRef : void 0,
@@ -13850,7 +14884,7 @@ function WithdrawModal({
13850
14884
  style: { backgroundColor: colors2.background },
13851
14885
  onPointerDownOutside: (e) => e.preventDefault(),
13852
14886
  onInteractOutside: (e) => e.preventDefault(),
13853
- children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(ThemeStyleInjector, { children: view === "confirming" && submittedTxInfo ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
14887
+ children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(ThemeStyleInjector, { children: view === "confirming" && submittedTxInfo ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
13854
14888
  WithdrawConfirmingView,
13855
14889
  {
13856
14890
  txInfo: submittedTxInfo,
@@ -13858,18 +14892,18 @@ function WithdrawModal({
13858
14892
  onClose: handleClose,
13859
14893
  onViewTracker: () => setView("tracker")
13860
14894
  }
13861
- ) : view === "detail" && selectedExecution ? /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
13862
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(DepositHeader, { title: "Withdrawal Details", showBack: true, showClose: !hideOverlay, onBack: () => {
14895
+ ) : view === "detail" && selectedExecution ? /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
14896
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(DepositHeader, { title: "Withdrawal Details", showBack: true, showClose: !hideOverlay, onBack: () => {
13863
14897
  setSelectedExecution(null);
13864
14898
  setView("tracker");
13865
14899
  }, onClose: handleClose }),
13866
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(DepositDetailContent, { execution: selectedExecution, variant: "withdraw" }),
14900
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(DepositDetailContent, { execution: selectedExecution, variant: "withdraw" }),
13867
14901
  withdrawPoweredByFooter
13868
14902
  ] }) : view === "tracker" ? (
13869
14903
  /* ---------- Tracker view: execution list ---------- */
13870
- /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
13871
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(DepositHeader, { title: "Withdrawal History", showBack: true, showClose: !hideOverlay, onBack: () => setView("form"), onClose: handleClose }),
13872
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-flex uf-flex-col uf-gap-2", style: { minHeight: 200 }, children: allWithdrawals.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-flex uf-items-center uf-justify-center uf-py-8", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("p", { className: "uf-text-sm", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: "No withdrawals to track yet" }) }) : allWithdrawals.map((ex) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
14904
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
14905
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(DepositHeader, { title: "Withdrawal History", showBack: true, showClose: !hideOverlay, onBack: () => setView("form"), onClose: handleClose }),
14906
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "uf-flex uf-flex-col uf-gap-2", style: { minHeight: 200 }, children: allWithdrawals.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "uf-flex uf-items-center uf-justify-center uf-py-8", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("p", { className: "uf-text-sm", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: "No withdrawals to track yet" }) }) : allWithdrawals.map((ex) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
13873
14907
  WithdrawExecutionItem,
13874
14908
  {
13875
14909
  execution: ex,
@@ -13884,15 +14918,15 @@ function WithdrawModal({
13884
14918
  ] })
13885
14919
  ) : (
13886
14920
  /* ---------- Form view (default) ---------- */
13887
- /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
13888
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(DepositHeader, { title: modalTitle || t9.title, showClose: !hideOverlay, onClose: handleClose }),
13889
- /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-3", children: [
13890
- isAnyLoading ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-space-y-3", children: [1, 2, 3].map((i) => /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-w-full uf-bg-secondary uf-rounded-xl uf-p-3 uf-flex uf-items-center uf-animate-pulse", children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-bg-muted uf-rounded-lg uf-w-full uf-h-10" }) }, i)) }) : isSourceSupported === false ? /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
13891
- /* @__PURE__ */ (0, import_jsx_runtime56.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_runtime56.jsx)(import_lucide_react26.AlertTriangle, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
13892
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-mb-2", style: { color: colors2.foreground, fontFamily: fonts.medium }, children: "Unsupported Source Token" }),
13893
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("p", { className: "uf-text-sm uf-max-w-[280px]", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: sourceValidation?.errorMessage })
13894
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
13895
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
14921
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
14922
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(DepositHeader, { title: modalTitle || t9.title, showClose: !hideOverlay, onClose: handleClose }),
14923
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-3", children: [
14924
+ isAnyLoading ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "uf-space-y-3", children: [1, 2, 3].map((i) => /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "uf-w-full uf-bg-secondary uf-rounded-xl uf-p-3 uf-flex uf-items-center uf-animate-pulse", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "uf-bg-muted uf-rounded-lg uf-w-full uf-h-10" }) }, i)) }) : isSourceSupported === false ? /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
14925
+ /* @__PURE__ */ (0, import_jsx_runtime57.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_runtime57.jsx)(import_lucide_react27.AlertTriangle, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
14926
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-mb-2", style: { color: colors2.foreground, fontFamily: fonts.medium }, children: "Unsupported Source Token" }),
14927
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("p", { className: "uf-text-sm uf-max-w-[280px]", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: sourceValidation?.errorMessage })
14928
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(import_jsx_runtime57.Fragment, { children: [
14929
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
13896
14930
  WithdrawDoubleInput,
13897
14931
  {
13898
14932
  tokens: destinationTokens,
@@ -13903,7 +14937,7 @@ function WithdrawModal({
13903
14937
  isLoading: tokensLoading
13904
14938
  }
13905
14939
  ),
13906
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
14940
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
13907
14941
  WithdrawForm,
13908
14942
  {
13909
14943
  publishableKey,
@@ -13929,16 +14963,16 @@ function WithdrawModal({
13929
14963
  onWithdrawError,
13930
14964
  onDepositWalletCreation: handleDepositWalletCreation,
13931
14965
  onWithdrawSubmitted: handleWithdrawSubmitted,
13932
- footerLeft: /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
14966
+ footerLeft: /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
13933
14967
  "button",
13934
14968
  {
13935
14969
  onClick: () => setView("tracker"),
13936
14970
  className: "uf-flex uf-items-center uf-gap-1 uf-transition-colors hover:uf-opacity-70",
13937
14971
  style: { color: colors2.foregroundMuted },
13938
14972
  children: [
13939
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_lucide_react26.Clock, { className: "uf-w-3.5 uf-h-3.5" }),
14973
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_lucide_react27.Clock, { className: "uf-w-3.5 uf-h-3.5" }),
13940
14974
  "Withdrawal History",
13941
- /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_lucide_react26.ChevronRight, { className: "uf-w-3 uf-h-3" })
14975
+ /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(import_lucide_react27.ChevronRight, { className: "uf-w-3 uf-h-3" })
13942
14976
  ]
13943
14977
  }
13944
14978
  )
@@ -13954,9 +14988,9 @@ function WithdrawModal({
13954
14988
  }
13955
14989
 
13956
14990
  // src/components/withdrawals/WithdrawTokenSelector.tsx
13957
- var import_react23 = require("react");
13958
- var import_lucide_react27 = require("lucide-react");
13959
- var import_jsx_runtime57 = require("react/jsx-runtime");
14991
+ var import_react24 = require("react");
14992
+ var import_lucide_react28 = require("lucide-react");
14993
+ var import_jsx_runtime58 = require("react/jsx-runtime");
13960
14994
  var t10 = i18n.withdrawModal;
13961
14995
  function WithdrawTokenSelector({
13962
14996
  tokens,
@@ -13964,9 +14998,9 @@ function WithdrawTokenSelector({
13964
14998
  onBack
13965
14999
  }) {
13966
15000
  const { themeClass, colors: colors2, fonts, components } = useTheme();
13967
- const [searchQuery, setSearchQuery] = (0, import_react23.useState)("");
13968
- const [hoveredKey, setHoveredKey] = (0, import_react23.useState)(null);
13969
- const allOptions = (0, import_react23.useMemo)(() => {
15001
+ const [searchQuery, setSearchQuery] = (0, import_react24.useState)("");
15002
+ const [hoveredKey, setHoveredKey] = (0, import_react24.useState)(null);
15003
+ const allOptions = (0, import_react24.useMemo)(() => {
13970
15004
  const options = [];
13971
15005
  tokens.forEach((token) => {
13972
15006
  token.chains.forEach((chain) => {
@@ -13975,21 +15009,21 @@ function WithdrawTokenSelector({
13975
15009
  });
13976
15010
  return options;
13977
15011
  }, [tokens]);
13978
- const filteredOptions = (0, import_react23.useMemo)(() => {
15012
+ const filteredOptions = (0, import_react24.useMemo)(() => {
13979
15013
  if (!searchQuery.trim()) return allOptions;
13980
15014
  const query = searchQuery.toLowerCase();
13981
15015
  return allOptions.filter(
13982
15016
  ({ token, chain }) => token.symbol.toLowerCase().includes(query) || token.name.toLowerCase().includes(query) || chain.chain_name.toLowerCase().includes(query)
13983
15017
  );
13984
15018
  }, [allOptions, searchQuery]);
13985
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
15019
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
13986
15020
  "div",
13987
15021
  {
13988
15022
  className: "uf-flex uf-flex-col",
13989
15023
  style: { minHeight: 0, flex: 1 },
13990
15024
  children: [
13991
- /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "uf-pb-3", children: [
13992
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
15025
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "uf-pb-3", children: [
15026
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
13993
15027
  "style",
13994
15028
  {
13995
15029
  dangerouslySetInnerHTML: {
@@ -13997,15 +15031,15 @@ function WithdrawTokenSelector({
13997
15031
  }
13998
15032
  }
13999
15033
  ),
14000
- /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { style: { position: "relative" }, children: [
14001
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
14002
- import_lucide_react27.Search,
15034
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { style: { position: "relative" }, children: [
15035
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
15036
+ import_lucide_react28.Search,
14003
15037
  {
14004
15038
  className: "uf-absolute uf-left-3 uf-top-1/2 uf--translate-y-1/2 uf-w-4 uf-h-4",
14005
15039
  style: { color: components.search.placeholderColor }
14006
15040
  }
14007
15041
  ),
14008
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
15042
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
14009
15043
  "input",
14010
15044
  {
14011
15045
  type: "text",
@@ -14024,7 +15058,7 @@ function WithdrawTokenSelector({
14024
15058
  )
14025
15059
  ] })
14026
15060
  ] }),
14027
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
15061
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
14028
15062
  "div",
14029
15063
  {
14030
15064
  className: "uf-text-xs uf-mb-2",
@@ -14035,12 +15069,12 @@ function WithdrawTokenSelector({
14035
15069
  children: t10.selectToken
14036
15070
  }
14037
15071
  ),
14038
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
15072
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
14039
15073
  "div",
14040
15074
  {
14041
15075
  className: "uf-flex-1 uf-overflow-y-auto uf-min-h-0 uf--mx-6 uf-px-6 uf-pb-3",
14042
15076
  style: { scrollbarWidth: "none" },
14043
- children: filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
15077
+ children: filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
14044
15078
  "div",
14045
15079
  {
14046
15080
  style: {
@@ -14052,9 +15086,9 @@ function WithdrawTokenSelector({
14052
15086
  },
14053
15087
  children: t10.noTokensAvailable
14054
15088
  }
14055
- ) : /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: filteredOptions.map(({ token, chain }) => {
15089
+ ) : /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: filteredOptions.map(({ token, chain }) => {
14056
15090
  const key = `${token.symbol}-${chain.chain_type}:${chain.chain_id}`;
14057
- return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
15091
+ return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
14058
15092
  "button",
14059
15093
  {
14060
15094
  type: "button",
@@ -14075,8 +15109,8 @@ function WithdrawTokenSelector({
14075
15109
  backgroundColor: hoveredKey === key ? colors2.cardHover : "transparent"
14076
15110
  },
14077
15111
  children: [
14078
- /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { style: { position: "relative", flexShrink: 0 }, children: [
14079
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
15112
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { style: { position: "relative", flexShrink: 0 }, children: [
15113
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
14080
15114
  "img",
14081
15115
  {
14082
15116
  src: token.icon_url,
@@ -14087,7 +15121,7 @@ function WithdrawTokenSelector({
14087
15121
  className: "uf-rounded-full"
14088
15122
  }
14089
15123
  ),
14090
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
15124
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
14091
15125
  "div",
14092
15126
  {
14093
15127
  style: {
@@ -14095,7 +15129,7 @@ function WithdrawTokenSelector({
14095
15129
  bottom: -4,
14096
15130
  right: -4
14097
15131
  },
14098
- children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
15132
+ children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
14099
15133
  "img",
14100
15134
  {
14101
15135
  src: chain.icon_url,
@@ -14109,8 +15143,8 @@ function WithdrawTokenSelector({
14109
15143
  }
14110
15144
  )
14111
15145
  ] }),
14112
- /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
14113
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
15146
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
15147
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
14114
15148
  "div",
14115
15149
  {
14116
15150
  style: {
@@ -14122,7 +15156,7 @@ function WithdrawTokenSelector({
14122
15156
  children: token.symbol
14123
15157
  }
14124
15158
  ),
14125
- /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(
15159
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
14126
15160
  "div",
14127
15161
  {
14128
15162
  style: {
@@ -14145,7 +15179,7 @@ function WithdrawTokenSelector({
14145
15179
  }) })
14146
15180
  }
14147
15181
  ),
14148
- /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("div", { className: "uf-pt-3 uf-pb-2 uf-shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
15182
+ /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "uf-pt-3 uf-pb-2 uf-shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
14149
15183
  PoweredByUnifold,
14150
15184
  {
14151
15185
  color: colors2.foregroundMuted,
@@ -14160,6 +15194,7 @@ function WithdrawTokenSelector({
14160
15194
  0 && (module.exports = {
14161
15195
  Button,
14162
15196
  BuyWithCard,
15197
+ CheckoutModal,
14163
15198
  ConfirmingView,
14164
15199
  CurrencyListItem,
14165
15200
  CurrencyListSection,
@@ -14183,6 +15218,7 @@ function WithdrawTokenSelector({
14183
15218
  DialogPortal,
14184
15219
  DialogTitle,
14185
15220
  DialogTrigger,
15221
+ HYPERCORE_CHAIN_ID,
14186
15222
  Select,
14187
15223
  SelectContent,
14188
15224
  SelectGroup,
@@ -14214,14 +15250,18 @@ function WithdrawTokenSelector({
14214
15250
  defaultColors,
14215
15251
  detectBrowserWallet,
14216
15252
  getColors,
15253
+ isHypercoreChain,
14217
15254
  mergeColors,
14218
15255
  resolveComponentTokens,
14219
15256
  sendEvmWithdraw,
15257
+ sendHypercoreWithdraw,
14220
15258
  sendSolanaWithdraw,
14221
15259
  truncateAddress,
14222
15260
  useAddressBalance,
14223
15261
  useAllowedCountry,
14224
15262
  useDepositPolling,
15263
+ useDepositQuote,
15264
+ usePaymentIntent,
14225
15265
  useSourceTokenValidation,
14226
15266
  useSupportedDestinationTokens,
14227
15267
  useTheme,