@unifold/ui-web 0.1.42 → 0.1.44

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -34394,7 +34394,7 @@ var require_jsx_runtime = __commonJS({
34394
34394
  });
34395
34395
 
34396
34396
  // src/unifold.tsx
34397
- var import_react32 = __toESM(require_react());
34397
+ var import_react33 = __toESM(require_react());
34398
34398
  var import_client = __toESM(require_client());
34399
34399
 
34400
34400
  // ../connect-react/dist/index.mjs
@@ -37214,17 +37214,19 @@ var React272 = __toESM(require_react(), 1);
37214
37214
  var import_jsx_runtime69 = __toESM(require_jsx_runtime(), 1);
37215
37215
  var import_jsx_runtime70 = __toESM(require_jsx_runtime(), 1);
37216
37216
  var import_react27 = __toESM(require_react(), 1);
37217
- var import_react28 = __toESM(require_react(), 1);
37218
37217
  var import_jsx_runtime71 = __toESM(require_jsx_runtime(), 1);
37218
+ var import_react28 = __toESM(require_react(), 1);
37219
37219
  var import_react29 = __toESM(require_react(), 1);
37220
37220
  var import_jsx_runtime72 = __toESM(require_jsx_runtime(), 1);
37221
- var import_jsx_runtime73 = __toESM(require_jsx_runtime(), 1);
37222
37221
  var import_react30 = __toESM(require_react(), 1);
37222
+ var import_jsx_runtime73 = __toESM(require_jsx_runtime(), 1);
37223
37223
  var import_jsx_runtime74 = __toESM(require_jsx_runtime(), 1);
37224
- var import_jsx_runtime75 = __toESM(require_jsx_runtime(), 1);
37225
37224
  var import_react31 = __toESM(require_react(), 1);
37225
+ var import_jsx_runtime75 = __toESM(require_jsx_runtime(), 1);
37226
37226
  var import_jsx_runtime76 = __toESM(require_jsx_runtime(), 1);
37227
+ var import_react32 = __toESM(require_react(), 1);
37227
37228
  var import_jsx_runtime77 = __toESM(require_jsx_runtime(), 1);
37229
+ var import_jsx_runtime78 = __toESM(require_jsx_runtime(), 1);
37228
37230
  var __create2 = Object.create;
37229
37231
  var __defProp2 = Object.defineProperty;
37230
37232
  var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
@@ -38488,6 +38490,10 @@ var ArrowLeft = createLucideIcon("ArrowLeft", [
38488
38490
  ["path", { d: "m12 19-7-7 7-7", key: "1l729n" }],
38489
38491
  ["path", { d: "M19 12H5", key: "x3x0zl" }]
38490
38492
  ]);
38493
+ var ArrowRight = createLucideIcon("ArrowRight", [
38494
+ ["path", { d: "M5 12h14", key: "1ays0h" }],
38495
+ ["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
38496
+ ]);
38491
38497
  var ArrowUpDown = createLucideIcon("ArrowUpDown", [
38492
38498
  ["path", { d: "m21 16-4 4-4-4", key: "f6ql7i" }],
38493
38499
  ["path", { d: "M17 20V4", key: "1ejh1v" }],
@@ -43482,6 +43488,28 @@ async function verifyRecipientAddress(request, publishableKey) {
43482
43488
  }
43483
43489
  return response.json();
43484
43490
  }
43491
+ async function checkHypercoreActivation(request, publishableKey) {
43492
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43493
+ validatePublishableKey(pk);
43494
+ const response = await fetch(
43495
+ `${API_BASE_URL}/v1/public/addresses/hypercore/activation`,
43496
+ {
43497
+ method: "POST",
43498
+ headers: {
43499
+ accept: "application/json",
43500
+ "x-publishable-key": pk,
43501
+ "Content-Type": "application/json"
43502
+ },
43503
+ body: JSON.stringify(request)
43504
+ }
43505
+ );
43506
+ if (!response.ok) {
43507
+ throw new Error(
43508
+ `HyperCore activation check failed: ${response.statusText}`
43509
+ );
43510
+ }
43511
+ return response.json();
43512
+ }
43485
43513
  async function getExchanges(query, publishableKey) {
43486
43514
  const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43487
43515
  validatePublishableKey(pk);
@@ -43566,6 +43594,119 @@ async function sendSolanaTransaction(request, publishableKey) {
43566
43594
  }
43567
43595
  return response.json();
43568
43596
  }
43597
+ async function retrievePaymentIntent(clientSecret, publishableKey) {
43598
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43599
+ validatePublishableKey(pk);
43600
+ const response = await fetch(
43601
+ `${API_BASE_URL}/v1/public/payment_intents/retrieve`,
43602
+ {
43603
+ method: "POST",
43604
+ headers: {
43605
+ accept: "application/json",
43606
+ "x-publishable-key": pk,
43607
+ "Content-Type": "application/json"
43608
+ },
43609
+ body: JSON.stringify({ client_secret: clientSecret })
43610
+ }
43611
+ );
43612
+ if (!response.ok) {
43613
+ const error = await response.json().catch(() => ({ message: response.statusText }));
43614
+ throw new Error(
43615
+ `Failed to retrieve payment intent: ${error.message || response.statusText}`
43616
+ );
43617
+ }
43618
+ return response.json();
43619
+ }
43620
+ async function listPaymentIntentExecutions(clientSecret, publishableKey) {
43621
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43622
+ validatePublishableKey(pk);
43623
+ const response = await fetch(
43624
+ `${API_BASE_URL}/v1/public/payment_intents/executions`,
43625
+ {
43626
+ method: "POST",
43627
+ headers: {
43628
+ accept: "application/json",
43629
+ "x-publishable-key": pk,
43630
+ "Content-Type": "application/json"
43631
+ },
43632
+ body: JSON.stringify({ client_secret: clientSecret })
43633
+ }
43634
+ );
43635
+ if (!response.ok) {
43636
+ const error = await response.json().catch(() => ({ message: response.statusText }));
43637
+ throw new Error(
43638
+ `Failed to list payment intent executions: ${error.message || response.statusText}`
43639
+ );
43640
+ }
43641
+ return response.json();
43642
+ }
43643
+ async function getDepositQuote(request, publishableKey) {
43644
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43645
+ validatePublishableKey(pk);
43646
+ const response = await fetch(`${API_BASE_URL}/v1/public/quotes`, {
43647
+ method: "POST",
43648
+ headers: {
43649
+ accept: "application/json",
43650
+ "x-publishable-key": pk,
43651
+ "Content-Type": "application/json"
43652
+ },
43653
+ body: JSON.stringify(request)
43654
+ });
43655
+ if (!response.ok) {
43656
+ const error = await response.json().catch(() => ({ message: response.statusText }));
43657
+ throw new Error(
43658
+ `Failed to get deposit quote: ${error.message || response.statusText}`
43659
+ );
43660
+ }
43661
+ const json = await response.json();
43662
+ return json.data;
43663
+ }
43664
+ async function buildHypercoreTransaction(request, publishableKey) {
43665
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43666
+ validatePublishableKey(pk);
43667
+ const response = await fetch(
43668
+ `${API_BASE_URL}/v1/public/transactions/hypercore/build`,
43669
+ {
43670
+ method: "POST",
43671
+ headers: {
43672
+ accept: "application/json",
43673
+ "x-publishable-key": pk,
43674
+ "Content-Type": "application/json"
43675
+ },
43676
+ body: JSON.stringify(request)
43677
+ }
43678
+ );
43679
+ if (!response.ok) {
43680
+ const error = await response.json().catch(() => ({ message: response.statusText }));
43681
+ throw new Error(
43682
+ `Failed to build HyperCore transaction: ${error.message || response.statusText}`
43683
+ );
43684
+ }
43685
+ return response.json();
43686
+ }
43687
+ async function sendHypercoreTransaction(request, publishableKey) {
43688
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43689
+ validatePublishableKey(pk);
43690
+ const response = await fetch(
43691
+ `${API_BASE_URL}/v1/public/transactions/hypercore/send`,
43692
+ {
43693
+ method: "POST",
43694
+ headers: {
43695
+ accept: "application/json",
43696
+ "x-publishable-key": pk,
43697
+ "Content-Type": "application/json"
43698
+ },
43699
+ body: JSON.stringify(request)
43700
+ }
43701
+ );
43702
+ if (!response.ok) {
43703
+ const error = await response.json().catch(() => ({ message: response.statusText }));
43704
+ throw new Error(
43705
+ `Failed to send HyperCore transaction: ${error.message || response.statusText}`
43706
+ );
43707
+ }
43708
+ return response.json();
43709
+ }
43569
43710
  var REACT_LAZY_TYPE = /* @__PURE__ */ Symbol.for("react.lazy");
43570
43711
  var use = React25[" use ".trim().toString()];
43571
43712
  function isPromiseLike(value) {
@@ -48922,6 +49063,7 @@ var CUTOFF_BUFFER_MS = 6e4;
48922
49063
  function useDepositPolling({
48923
49064
  userId,
48924
49065
  publishableKey,
49066
+ clientSecret,
48925
49067
  depositConfirmationMode = "auto_ui",
48926
49068
  depositWalletId,
48927
49069
  enabled = true,
@@ -48979,11 +49121,12 @@ function useDepositPolling({
48979
49121
  depositWalletId
48980
49122
  ]);
48981
49123
  (0, import_react10.useEffect)(() => {
48982
- if (!userId || !enabled) return;
49124
+ if (!enabled) return;
49125
+ if (!clientSecret && !userId) return;
48983
49126
  const modalOpenedAt = modalOpenedAtRef.current;
48984
49127
  const poll = async () => {
48985
49128
  try {
48986
- const response = await queryExecutions(userId, publishableKey, ActionType.Deposit);
49129
+ const response = clientSecret ? await listPaymentIntentExecutions(clientSecret, publishableKey) : await queryExecutions(userId, publishableKey, ActionType.Deposit);
48987
49130
  const cutoff = new Date(modalOpenedAt.getTime() - CUTOFF_BUFFER_MS);
48988
49131
  const sortedExecutions = [...response.data].sort((a, b) => {
48989
49132
  const timeA = a.created_at ? new Date(a.created_at).getTime() : 0;
@@ -49067,7 +49210,7 @@ function useDepositPolling({
49067
49210
  clearInterval(pollInterval);
49068
49211
  setIsPolling(false);
49069
49212
  };
49070
- }, [userId, publishableKey, enabled]);
49213
+ }, [userId, publishableKey, clientSecret, enabled]);
49071
49214
  (0, import_react10.useEffect)(() => {
49072
49215
  if (!pollingEnabled || !depositWalletId) return;
49073
49216
  const triggerPoll = async () => {
@@ -55576,6 +55719,7 @@ var parseChainKey = (chainKey) => {
55576
55719
  function TransferCryptoSingleInput({
55577
55720
  userId,
55578
55721
  publishableKey,
55722
+ clientSecret,
55579
55723
  recipientAddress,
55580
55724
  destinationChainType,
55581
55725
  destinationChainId,
@@ -55588,7 +55732,9 @@ function TransferCryptoSingleInput({
55588
55732
  onExecutionsChange,
55589
55733
  onDepositSuccess,
55590
55734
  onDepositError,
55591
- wallets: externalWallets
55735
+ wallets: externalWallets,
55736
+ onSourceTokenChange,
55737
+ checkoutQuote
55592
55738
  }) {
55593
55739
  const { themeClass, colors: colors2, fonts, components } = useTheme();
55594
55740
  const isDarkMode = themeClass.includes("uf-dark");
@@ -55655,12 +55801,28 @@ function TransferCryptoSingleInput({
55655
55801
  } = useDepositPolling({
55656
55802
  userId,
55657
55803
  publishableKey,
55804
+ clientSecret,
55658
55805
  depositConfirmationMode,
55659
55806
  depositWalletId: currentWallet?.id,
55660
55807
  enabled: true,
55661
55808
  onDepositSuccess,
55662
55809
  onDepositError
55663
55810
  });
55811
+ (0, import_react16.useEffect)(() => {
55812
+ if (!onSourceTokenChange || !token || !chain || !initialSelectionDone) return;
55813
+ const { chainType, chainId } = parseChainKey(chain);
55814
+ const matchedToken = supportedTokens.find((t11) => t11.symbol === token);
55815
+ const matchedChain = matchedToken?.chains.find(
55816
+ (c) => c.chain_type === chainType && c.chain_id === chainId
55817
+ );
55818
+ onSourceTokenChange({
55819
+ symbol: token,
55820
+ chainType,
55821
+ chainId,
55822
+ tokenAddress: matchedChain?.token_address ?? "",
55823
+ minimumDepositAmountUsd: matchedChain?.minimum_deposit_amount_usd ?? 0
55824
+ });
55825
+ }, [token, chain, initialSelectionDone, onSourceTokenChange, supportedTokens]);
55664
55826
  (0, import_react16.useEffect)(() => {
55665
55827
  if (onExecutionsChange) {
55666
55828
  onExecutionsChange(depositExecutions);
@@ -55807,6 +55969,53 @@ function TransferCryptoSingleInput({
55807
55969
  /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children: "Retrying automatically every 5 seconds..." })
55808
55970
  ] })
55809
55971
  ] }),
55972
+ checkoutQuote && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
55973
+ "div",
55974
+ {
55975
+ className: "uf-rounded-xl uf-px-3 uf-py-2 uf-flex uf-items-center uf-justify-between",
55976
+ style: {
55977
+ backgroundColor: components.card.backgroundColor,
55978
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`,
55979
+ borderRadius: components.card.borderRadius
55980
+ },
55981
+ children: [
55982
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
55983
+ "span",
55984
+ {
55985
+ className: "uf-text-xs",
55986
+ style: { color: components.card.subtitleColor, fontFamily: fonts.regular },
55987
+ children: "You send"
55988
+ }
55989
+ ),
55990
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
55991
+ "span",
55992
+ {
55993
+ className: "uf-text-sm uf-font-semibold",
55994
+ style: { color: components.card.titleColor, fontFamily: fonts.semibold },
55995
+ children: [
55996
+ (Number(checkoutQuote.sourceAmount) / 10 ** checkoutQuote.sourceTokenDecimals).toFixed(
55997
+ Math.min(checkoutQuote.sourceTokenDecimals, 6)
55998
+ ),
55999
+ " ",
56000
+ checkoutQuote.sourceTokenSymbol,
56001
+ checkoutQuote.sourceAmountUsd && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
56002
+ "span",
56003
+ {
56004
+ className: "uf-text-xs uf-font-normal uf-ml-1.5",
56005
+ style: { color: components.card.subtitleColor },
56006
+ children: [
56007
+ "($",
56008
+ checkoutQuote.sourceAmountUsd,
56009
+ ")"
56010
+ ]
56011
+ }
56012
+ )
56013
+ ]
56014
+ }
56015
+ )
56016
+ ]
56017
+ }
56018
+ ),
55810
56019
  /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-pt-2", children: [
55811
56020
  /* @__PURE__ */ (0, import_jsx_runtime56.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" }),
55812
56021
  /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-shadow-lg", style: { borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: loading || tokensLoading || !initialSelectionDone ? (
@@ -56628,9 +56837,16 @@ function SelectTokenView({
56628
56837
  onBack,
56629
56838
  onClose,
56630
56839
  onDisconnectWallet,
56631
- isDisconnectingWallet = false
56840
+ isDisconnectingWallet = false,
56841
+ checkoutAmountUsd,
56842
+ checkoutReceivedUsd
56632
56843
  }) {
56633
56844
  const { colors: colors2, fonts, components } = useTheme();
56845
+ const isCheckout = !!checkoutAmountUsd;
56846
+ const headerSubtitle = isCheckout ? parseFloat(checkoutReceivedUsd || "0") > 0 ? `$${checkoutReceivedUsd} / $${checkoutAmountUsd} received` : `Amount due: $${checkoutAmountUsd}` : formatBalanceDisplay(
56847
+ `$${totalBalanceUsd || "0.00"}`,
56848
+ projectName
56849
+ );
56634
56850
  return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
56635
56851
  "div",
56636
56852
  {
@@ -56639,11 +56855,8 @@ function SelectTokenView({
56639
56855
  /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
56640
56856
  DepositHeader,
56641
56857
  {
56642
- title: "Select Token",
56643
- subtitle: formatBalanceDisplay(
56644
- `$${totalBalanceUsd || "0.00"}`,
56645
- projectName
56646
- ),
56858
+ title: isCheckout ? "Select Token" : "Select Token",
56859
+ subtitle: headerSubtitle,
56647
56860
  showBack: true,
56648
56861
  onBack,
56649
56862
  onClose
@@ -56871,10 +57084,19 @@ function EnterAmountView({
56871
57084
  onReview,
56872
57085
  onBack,
56873
57086
  onClose,
56874
- quickSelectMode
57087
+ quickSelectMode,
57088
+ checkoutAmountUsd,
57089
+ checkoutReceivedUsd
56875
57090
  }) {
56876
57091
  const { colors: colors2, fonts, components } = useTheme();
57092
+ const isCheckout = !!checkoutAmountUsd;
56877
57093
  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}`;
57094
+ const checkoutRemainingUsd = isCheckout ? Math.max(
57095
+ parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0"),
57096
+ 0
57097
+ ).toFixed(2) : null;
57098
+ const headerTitle = isCheckout ? `Pay $${checkoutRemainingUsd}` : "Enter Amount";
57099
+ const headerSubtitle = isCheckout ? parseFloat(checkoutReceivedUsd || "0") > 0 ? `$${checkoutReceivedUsd} / $${checkoutAmountUsd} received` : null : balanceSubtitle;
56878
57100
  const usePercentageChips = quickSelectMode === "percentage" && maxUsdAmount > 0;
56879
57101
  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";
56880
57102
  return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
@@ -56888,14 +57110,27 @@ function EnterAmountView({
56888
57110
  /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
56889
57111
  DepositHeader,
56890
57112
  {
56891
- title: "Enter Amount",
56892
- subtitle: balanceSubtitle,
57113
+ title: headerTitle,
57114
+ subtitle: headerSubtitle ?? void 0,
56893
57115
  showBack: true,
56894
57116
  onBack,
56895
57117
  onClose
56896
57118
  }
56897
57119
  ),
56898
- walletInfoProp ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "uf-flex uf-w-full uf-justify-center uf-mb-3", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(WalletWithNetworkBadge, { walletInfo: walletInfoProp }) }) : null,
57120
+ walletInfoProp ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "uf-flex uf-w-full uf-justify-center uf-mb-3", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-gap-1", children: [
57121
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(WalletWithNetworkBadge, { walletInfo: walletInfoProp }),
57122
+ isCheckout && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
57123
+ "span",
57124
+ {
57125
+ className: "uf-text-xs",
57126
+ style: {
57127
+ color: colors2.foregroundMuted,
57128
+ fontFamily: fonts.regular
57129
+ },
57130
+ children: balanceSubtitle
57131
+ }
57132
+ )
57133
+ ] }) }) : null,
56899
57134
  /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-flex uf-min-h-0 uf-flex-1 uf-flex-col", children: [
56900
57135
  /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-min-h-0 uf-flex-1", children: [
56901
57136
  /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-text-center uf-py-8", children: [
@@ -56918,7 +57153,9 @@ function EnterAmountView({
56918
57153
  inputMode: "decimal",
56919
57154
  placeholder: "0",
56920
57155
  value: amountUsd,
57156
+ readOnly: isCheckout,
56921
57157
  onChange: (e) => {
57158
+ if (isCheckout) return;
56922
57159
  const value = e.target.value;
56923
57160
  if (value === "" || /^\d*\.?\d*$/.test(value)) {
56924
57161
  const decimalIndex = value.indexOf(".");
@@ -56929,7 +57166,7 @@ function EnterAmountView({
56929
57166
  onAmountChange(value);
56930
57167
  }
56931
57168
  },
56932
- className: "uf-bg-transparent uf-outline-none uf-text-center uf-font-normal uf-w-auto uf-min-w-[60px]",
57169
+ className: `uf-bg-transparent uf-outline-none uf-text-center uf-font-normal uf-w-auto uf-min-w-[60px] ${isCheckout ? "uf-cursor-default" : ""}`,
56933
57170
  style: {
56934
57171
  fontSize: `${Math.max(3.75 - (amountUsd || "0").length * 0.15, 2)}rem`,
56935
57172
  color: components.input.textColor,
@@ -56951,7 +57188,7 @@ function EnterAmountView({
56951
57188
  }
56952
57189
  )
56953
57190
  ] }),
56954
- /* @__PURE__ */ (0, import_jsx_runtime65.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_runtime65.jsxs)(import_jsx_runtime65.Fragment, { children: [
57191
+ !isCheckout && /* @__PURE__ */ (0, import_jsx_runtime65.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_runtime65.jsxs)(import_jsx_runtime65.Fragment, { children: [
56955
57192
  PERCENT_QUICK_AMOUNTS.map((pct) => /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
56956
57193
  "button",
56957
57194
  {
@@ -57020,7 +57257,46 @@ function EnterAmountView({
57020
57257
  }
57021
57258
  )
57022
57259
  ] }) }),
57023
- tokenChainDetails && tokenChainDetails.minimum_deposit_amount_usd > 0 && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57260
+ tokenChainDetails && tokenChainDetails.minimum_deposit_amount_usd > 0 && (isCheckout && checkoutAmountUsd && inputUsdNum > parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0") + 5e-3 ? /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57261
+ "div",
57262
+ {
57263
+ className: "uf-rounded-lg uf-px-3 uf-py-2 uf-mb-3 uf-text-center",
57264
+ style: {
57265
+ backgroundColor: colors2.warning + "15",
57266
+ border: `1px solid ${colors2.warning}30`,
57267
+ borderRadius: components.card.borderRadius,
57268
+ animation: "uf-fadeSlideIn 0.4s ease-out"
57269
+ },
57270
+ children: [
57271
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57272
+ "div",
57273
+ {
57274
+ className: "uf-text-xs uf-font-medium",
57275
+ style: { color: colors2.warning, fontFamily: fonts.medium },
57276
+ children: [
57277
+ "Minimum for ",
57278
+ selectedToken.symbol,
57279
+ " on ",
57280
+ selectedToken.chain_name,
57281
+ " is $",
57282
+ tokenChainDetails.minimum_deposit_amount_usd.toFixed(2)
57283
+ ]
57284
+ }
57285
+ ),
57286
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57287
+ "div",
57288
+ {
57289
+ className: "uf-text-xs uf-mt-0.5",
57290
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
57291
+ children: [
57292
+ "Amount adjusted from remaining $",
57293
+ (parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0")).toFixed(2)
57294
+ ]
57295
+ }
57296
+ )
57297
+ ]
57298
+ }
57299
+ ) : /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57024
57300
  "div",
57025
57301
  {
57026
57302
  className: "uf-text-center uf-text-xs uf-mb-3",
@@ -57030,7 +57306,7 @@ function EnterAmountView({
57030
57306
  tokenChainDetails.minimum_deposit_amount_usd.toFixed(2)
57031
57307
  ]
57032
57308
  }
57033
- ),
57309
+ )),
57034
57310
  inputUsdNum > 0 && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_jsx_runtime65.Fragment, { children: inputUsdNum > maxUsdAmount ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
57035
57311
  "div",
57036
57312
  {
@@ -57045,7 +57321,44 @@ function EnterAmountView({
57045
57321
  style: { color: colors2.error },
57046
57322
  children: error
57047
57323
  }
57048
- ) })
57324
+ ) }),
57325
+ isCheckout && selectedToken.icon_url && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2 uf-py-2", children: [
57326
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-relative", children: [
57327
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
57328
+ "img",
57329
+ {
57330
+ src: selectedToken.icon_url,
57331
+ alt: selectedToken.symbol,
57332
+ width: 20,
57333
+ height: 20,
57334
+ className: "uf-w-5 uf-h-5 uf-rounded-full"
57335
+ }
57336
+ ),
57337
+ selectedToken.chain_icon_url && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
57338
+ "img",
57339
+ {
57340
+ src: selectedToken.chain_icon_url,
57341
+ alt: selectedToken.chain_name,
57342
+ width: 10,
57343
+ height: 10,
57344
+ className: "uf-w-2.5 uf-h-2.5 uf-rounded-full uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-border",
57345
+ style: { borderColor: colors2.background }
57346
+ }
57347
+ )
57348
+ ] }),
57349
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57350
+ "span",
57351
+ {
57352
+ className: "uf-text-xs",
57353
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
57354
+ children: [
57355
+ selectedToken.symbol,
57356
+ " on ",
57357
+ selectedToken.chain_name
57358
+ ]
57359
+ }
57360
+ )
57361
+ ] })
57049
57362
  ] }),
57050
57363
  /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "uf-shrink-0 uf-pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
57051
57364
  "button",
@@ -57069,6 +57382,18 @@ function EnterAmountView({
57069
57382
  }
57070
57383
  );
57071
57384
  }
57385
+ var WALLET_ICONS2 = {
57386
+ metamask: MetamaskIcon,
57387
+ phantom: PhantomIcon,
57388
+ coinbase: CoinbaseIcon,
57389
+ trust: TrustIcon,
57390
+ rainbow: RainbowIcon,
57391
+ rabby: RabbyIcon,
57392
+ okx: OkxIcon,
57393
+ solflare: SolflareIcon,
57394
+ backpack: BackpackIcon,
57395
+ glow: GlowIcon
57396
+ };
57072
57397
  function ReviewView({
57073
57398
  walletInfo,
57074
57399
  recipientAddress,
@@ -57103,30 +57428,17 @@ function ReviewView({
57103
57428
  ),
57104
57429
  /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-min-h-0 uf-flex-1 uf-flex-col", children: [
57105
57430
  /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-min-h-0 uf-flex-1 uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: [
57106
- /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-text-center", children: [
57107
- /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
57108
- "div",
57109
- {
57110
- className: "uf-text-4xl uf-font-medium",
57111
- style: { color: colors2.foreground, fontFamily: fonts.medium },
57112
- children: [
57113
- "$",
57114
- amountUsd || "0"
57115
- ]
57116
- }
57117
- ),
57118
- formattedTokenAmount && /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
57119
- "div",
57120
- {
57121
- className: "uf-text-sm uf-mt-2",
57122
- style: { color: colors2.foregroundMuted },
57123
- children: [
57124
- "\u2248 ",
57125
- formattedTokenAmount
57126
- ]
57127
- }
57128
- )
57129
- ] }),
57431
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-text-center", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
57432
+ "div",
57433
+ {
57434
+ className: "uf-text-4xl uf-font-medium",
57435
+ style: { color: colors2.foreground, fontFamily: fonts.medium },
57436
+ children: [
57437
+ "$",
57438
+ amountUsd || "0"
57439
+ ]
57440
+ }
57441
+ ) }),
57130
57442
  /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
57131
57443
  "div",
57132
57444
  {
@@ -57143,29 +57455,20 @@ function ReviewView({
57143
57455
  {
57144
57456
  className: "uf-text-sm",
57145
57457
  style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
57146
- children: "Source"
57458
+ children: "From"
57147
57459
  }
57148
57460
  ),
57149
57461
  /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
57150
- getIconUrl2(selectedToken.icon_url, assetCdnUrl) && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57151
- "img",
57152
- {
57153
- src: getIconUrl2(selectedToken.icon_url, assetCdnUrl),
57154
- alt: selectedToken.symbol,
57155
- className: "uf-w-5 uf-h-5 uf-rounded-full"
57156
- }
57157
- ),
57158
- /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
57462
+ WALLET_ICONS2[walletInfo.icon] && (() => {
57463
+ const Icon22 = WALLET_ICONS2[walletInfo.icon];
57464
+ return /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-w-5 uf-h-5 uf-rounded-full uf-overflow-hidden uf-flex-shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(Icon22, { size: 20, variant: "color" }) });
57465
+ })(),
57466
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57159
57467
  "span",
57160
57468
  {
57161
57469
  className: "uf-text-sm uf-font-medium",
57162
57470
  style: { color: colors2.foreground, fontFamily: fonts.medium },
57163
- children: [
57164
- walletInfo.name,
57165
- " (",
57166
- truncateAddress2(walletInfo.address),
57167
- ")"
57168
- ]
57471
+ children: walletInfo.name
57169
57472
  }
57170
57473
  )
57171
57474
  ] })
@@ -57176,10 +57479,38 @@ function ReviewView({
57176
57479
  {
57177
57480
  className: "uf-text-sm",
57178
57481
  style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
57179
- children: "Destination"
57482
+ children: "You send"
57180
57483
  }
57181
57484
  ),
57182
- /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57485
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
57486
+ getIconUrl2(selectedToken.icon_url, assetCdnUrl) && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57487
+ "img",
57488
+ {
57489
+ src: getIconUrl2(selectedToken.icon_url, assetCdnUrl),
57490
+ alt: selectedToken.symbol,
57491
+ className: "uf-w-5 uf-h-5 uf-rounded-full"
57492
+ }
57493
+ ),
57494
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57495
+ "span",
57496
+ {
57497
+ className: "uf-text-sm uf-font-medium",
57498
+ style: { color: colors2.foreground, fontFamily: fonts.medium },
57499
+ children: formattedTokenAmount || `$${amountUsd}`
57500
+ }
57501
+ )
57502
+ ] })
57503
+ ] }),
57504
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-justify-between uf-items-center", children: [
57505
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57506
+ "span",
57507
+ {
57508
+ className: "uf-text-sm",
57509
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
57510
+ children: "Destination"
57511
+ }
57512
+ ),
57513
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57183
57514
  "span",
57184
57515
  {
57185
57516
  className: "uf-text-sm uf-font-medium",
@@ -57328,7 +57659,10 @@ function ReviewView({
57328
57659
  borderRadius: components.button.borderRadius,
57329
57660
  border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
57330
57661
  },
57331
- children: isConfirming ? "Confirming..." : "Confirm Order"
57662
+ children: isConfirming ? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("span", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2", children: [
57663
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
57664
+ "Confirming..."
57665
+ ] }) : "Confirm Order"
57332
57666
  }
57333
57667
  ) })
57334
57668
  ] })
@@ -57337,17 +57671,35 @@ function ReviewView({
57337
57671
  }
57338
57672
  );
57339
57673
  }
57674
+ var SETTLE_FALLBACK_MS = 15e3;
57340
57675
  function ConfirmingView({
57341
57676
  isConfirming,
57342
57677
  onClose,
57343
57678
  executions = [],
57344
- isPolling = false
57679
+ isPolling = false,
57680
+ onNewDeposit,
57681
+ onDone,
57682
+ paymentIntentStatus,
57683
+ amountReceivedUsd,
57684
+ amountReceivedUsdAtSubmission
57345
57685
  }) {
57346
- const { colors: colors2, fonts } = useTheme();
57686
+ const { colors: colors2, fonts, components } = useTheme();
57347
57687
  const [containerEl, setContainerEl] = (0, import_react26.useState)(null);
57348
57688
  const containerCallbackRef = (0, import_react26.useCallback)((el) => {
57349
57689
  setContainerEl(el);
57350
57690
  }, []);
57691
+ const [fallbackSettled, setFallbackSettled] = (0, import_react26.useState)(false);
57692
+ const hasExecution = executions.length > 0;
57693
+ const isCheckoutMode = paymentIntentStatus != null;
57694
+ const isPaymentComplete = paymentIntentStatus === "succeeded";
57695
+ const amountChanged = amountReceivedUsdAtSubmission != null && amountReceivedUsd != null && amountReceivedUsd !== amountReceivedUsdAtSubmission;
57696
+ const piSettled = !isCheckoutMode || isPaymentComplete || amountChanged || fallbackSettled;
57697
+ (0, import_react26.useEffect)(() => {
57698
+ if (!hasExecution || piSettled) return;
57699
+ const timeout = setTimeout(() => setFallbackSettled(true), SETTLE_FALLBACK_MS);
57700
+ return () => clearTimeout(timeout);
57701
+ }, [hasExecution, piSettled]);
57702
+ const showButtons = hasExecution && piSettled;
57351
57703
  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(PortalContainerProvider, { value: containerEl, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
57352
57704
  "div",
57353
57705
  {
@@ -57360,8 +57712,8 @@ function ConfirmingView({
57360
57712
  /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57361
57713
  DepositHeader,
57362
57714
  {
57363
- title: isConfirming ? "Confirming..." : "Processing",
57364
- onClose
57715
+ title: isConfirming ? "Confirming..." : hasExecution && isPaymentComplete ? "Payment Complete" : hasExecution ? "Deposit Received" : "Processing",
57716
+ onClose: isPaymentComplete && onDone ? onDone : onClose
57365
57717
  }
57366
57718
  ),
57367
57719
  /* @__PURE__ */ (0, import_jsx_runtime67.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_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
@@ -57388,11 +57740,70 @@ function ConfirmingView({
57388
57740
  children: "Please confirm the transaction in your wallet"
57389
57741
  }
57390
57742
  )
57391
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
57743
+ ] }) : hasExecution ? /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
57392
57744
  /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57393
57745
  CircleCheck,
57394
57746
  {
57395
57747
  className: "uf-w-12 uf-h-12 uf-mb-4",
57748
+ style: { color: "rgb(34, 197, 94)" }
57749
+ }
57750
+ ),
57751
+ /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57752
+ "div",
57753
+ {
57754
+ className: "uf-text-lg uf-font-medium",
57755
+ style: { color: colors2.foreground, fontFamily: fonts.medium },
57756
+ children: isPaymentComplete ? "Payment Complete" : "Deposit Received"
57757
+ }
57758
+ ),
57759
+ /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57760
+ "div",
57761
+ {
57762
+ className: "uf-text-sm uf-mt-2 uf-text-center uf-px-6",
57763
+ style: { color: colors2.foregroundMuted },
57764
+ children: isPaymentComplete ? "Your payment has been fulfilled." : showButtons ? "Your deposit is being processed." : "Checking payment status..."
57765
+ }
57766
+ ),
57767
+ /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "uf-mt-6 uf-flex uf-flex-col uf-items-center uf-gap-3", children: !showButtons ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57768
+ LoaderCircle,
57769
+ {
57770
+ className: "uf-w-5 uf-h-5 uf-animate-spin",
57771
+ style: { color: colors2.foregroundMuted }
57772
+ }
57773
+ ) : isPaymentComplete && onDone ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57774
+ "button",
57775
+ {
57776
+ onClick: onDone,
57777
+ className: "uf-w-full uf-py-3 uf-px-8 uf-text-sm uf-font-medium uf-transition-opacity hover:uf-opacity-80",
57778
+ style: {
57779
+ backgroundColor: colors2.primary,
57780
+ color: colors2.primaryForeground,
57781
+ fontFamily: fonts.medium,
57782
+ borderRadius: components.button.borderRadius
57783
+ },
57784
+ children: "Done"
57785
+ }
57786
+ ) : onNewDeposit ? /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
57787
+ "button",
57788
+ {
57789
+ onClick: onNewDeposit,
57790
+ 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",
57791
+ style: {
57792
+ backgroundColor: colors2.primary,
57793
+ color: colors2.primaryForeground,
57794
+ fontFamily: fonts.medium
57795
+ },
57796
+ children: [
57797
+ "Make another deposit",
57798
+ /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(ArrowRight, { className: "uf-w-4 uf-h-4" })
57799
+ ]
57800
+ }
57801
+ ) : null })
57802
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
57803
+ /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57804
+ LoaderCircle,
57805
+ {
57806
+ className: "uf-w-12 uf-h-12 uf-animate-spin uf-mb-4",
57396
57807
  style: { color: colors2.primary }
57397
57808
  }
57398
57809
  ),
@@ -57409,7 +57820,7 @@ function ConfirmingView({
57409
57820
  {
57410
57821
  className: "uf-text-sm uf-mt-2 uf-text-center uf-px-6",
57411
57822
  style: { color: colors2.foregroundMuted },
57412
- children: "You can close this window or wait for confirmation."
57823
+ children: "Waiting for your deposit to be detected..."
57413
57824
  }
57414
57825
  )
57415
57826
  ] }) }),
@@ -57433,6 +57844,7 @@ function BrowserWalletModal({
57433
57844
  depositWallet,
57434
57845
  userId,
57435
57846
  publishableKey,
57847
+ clientSecret,
57436
57848
  assetCdnUrl,
57437
57849
  projectName,
57438
57850
  theme = "dark",
@@ -57441,7 +57853,13 @@ function BrowserWalletModal({
57441
57853
  onDepositSuccess,
57442
57854
  onDepositError,
57443
57855
  amountQuickSelect = "percentage",
57444
- onWalletDisconnect
57856
+ onWalletDisconnect,
57857
+ prefillAmountUsd,
57858
+ checkoutAmountUsd,
57859
+ checkoutReceivedUsd,
57860
+ onNewDeposit,
57861
+ onDone,
57862
+ paymentIntentStatus
57445
57863
  }) {
57446
57864
  const { colors: colors2, fonts, components } = useTheme();
57447
57865
  const [step, setStep] = React262.useState("select-token");
@@ -57459,6 +57877,7 @@ function BrowserWalletModal({
57459
57877
  const [tokenChainDetails, setTokenChainDetails] = React262.useState(null);
57460
57878
  const [loadingTokenDetails, setLoadingTokenDetails] = React262.useState(false);
57461
57879
  const [showTransactionDetails, setShowTransactionDetails] = React262.useState(false);
57880
+ const [receivedUsdAtSubmission, setReceivedUsdAtSubmission] = React262.useState(null);
57462
57881
  const themeClass = theme === "dark" ? "uf-dark" : "";
57463
57882
  const chainType = depositWallet.chain_type;
57464
57883
  const recipientAddress = depositWallet.address;
@@ -57466,15 +57885,19 @@ function BrowserWalletModal({
57466
57885
  const { executions: depositExecutions, isPolling } = useDepositPolling({
57467
57886
  userId,
57468
57887
  publishableKey,
57888
+ clientSecret,
57469
57889
  enabled: open && hasSignedTransaction,
57470
57890
  onDepositSuccess,
57471
57891
  onDepositError
57472
57892
  });
57893
+ const prevOpenRef = React262.useRef(false);
57473
57894
  React262.useEffect(() => {
57474
- if (open) {
57895
+ const wasOpen = prevOpenRef.current;
57896
+ prevOpenRef.current = open;
57897
+ if (open && !wasOpen) {
57475
57898
  setStep("select-token");
57476
57899
  setSelectedBalance(null);
57477
- setAmountUsd("");
57900
+ setAmountUsd(prefillAmountUsd ?? "");
57478
57901
  setError(null);
57479
57902
  setIsConfirming(false);
57480
57903
  setTokenChainDetails(null);
@@ -57482,7 +57905,15 @@ function BrowserWalletModal({
57482
57905
  setHasSignedTransaction(false);
57483
57906
  setIsDisconnectingWallet(false);
57484
57907
  }
57485
- }, [open]);
57908
+ }, [open, prefillAmountUsd]);
57909
+ React262.useEffect(() => {
57910
+ if (!prefillAmountUsd || !tokenChainDetails || step !== "input-amount") return;
57911
+ const minDeposit = tokenChainDetails.minimum_deposit_amount_usd || 0;
57912
+ const currentAmount = parseFloat(amountUsd) || 0;
57913
+ if (currentAmount > 0 && currentAmount < minDeposit) {
57914
+ setAmountUsd(minDeposit.toFixed(2));
57915
+ }
57916
+ }, [tokenChainDetails, step, prefillAmountUsd]);
57486
57917
  React262.useEffect(() => {
57487
57918
  if (step === "review") {
57488
57919
  setShowTransactionDetails(false);
@@ -57600,7 +58031,7 @@ function BrowserWalletModal({
57600
58031
  setError(null);
57601
58032
  if (step === "input-amount") {
57602
58033
  setStep("select-token");
57603
- setAmountUsd("");
58034
+ setAmountUsd(prefillAmountUsd ?? "");
57604
58035
  setTokenChainDetails(null);
57605
58036
  } else if (step === "review") {
57606
58037
  setStep("input-amount");
@@ -57686,7 +58117,6 @@ function BrowserWalletModal({
57686
58117
  }
57687
58118
  }
57688
58119
  setIsConfirming(true);
57689
- setStep("confirming");
57690
58120
  setError(null);
57691
58121
  try {
57692
58122
  let txHash;
@@ -57704,16 +58134,17 @@ function BrowserWalletModal({
57704
58134
  } else {
57705
58135
  txHash = await sendEthereumTransaction(token, tokenAmount.toString());
57706
58136
  }
58137
+ setReceivedUsdAtSubmission(checkoutReceivedUsd ?? "0");
57707
58138
  setHasSignedTransaction(true);
57708
- onSuccess?.(txHash);
57709
58139
  setIsConfirming(false);
58140
+ setStep("confirming");
58141
+ onSuccess?.(txHash);
57710
58142
  } catch (err) {
57711
58143
  console.error("[BrowserWalletModal] Transaction error:", err);
57712
58144
  const errorMessage = err instanceof Error ? err.message : "Transaction failed";
57713
58145
  setError(errorMessage);
57714
58146
  onError?.(err instanceof Error ? err : new Error(errorMessage));
57715
58147
  setIsConfirming(false);
57716
- setStep("review");
57717
58148
  }
57718
58149
  };
57719
58150
  const sendEthereumTransaction = async (token, amountStr) => {
@@ -57962,7 +58393,9 @@ function BrowserWalletModal({
57962
58393
  onBack: handleClose,
57963
58394
  onClose: handleFullClose,
57964
58395
  onDisconnectWallet: onWalletDisconnect ? () => void handleDisconnectFromSelectToken() : void 0,
57965
- isDisconnectingWallet
58396
+ isDisconnectingWallet,
58397
+ checkoutAmountUsd,
58398
+ checkoutReceivedUsd
57966
58399
  }
57967
58400
  ),
57968
58401
  step === "input-amount" && selectedToken && selectedBalance && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
@@ -57983,7 +58416,9 @@ function BrowserWalletModal({
57983
58416
  onReview: handleReview,
57984
58417
  onBack: handleBack,
57985
58418
  onClose: handleFullClose,
57986
- quickSelectMode: amountQuickSelect
58419
+ quickSelectMode: amountQuickSelect,
58420
+ checkoutAmountUsd,
58421
+ checkoutReceivedUsd
57987
58422
  }
57988
58423
  ),
57989
58424
  step === "review" && selectedToken && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
@@ -58012,7 +58447,12 @@ function BrowserWalletModal({
58012
58447
  isConfirming,
58013
58448
  onClose: handleFullClose,
58014
58449
  executions: depositExecutions,
58015
- isPolling
58450
+ isPolling,
58451
+ onNewDeposit,
58452
+ onDone,
58453
+ paymentIntentStatus,
58454
+ amountReceivedUsd: checkoutReceivedUsd,
58455
+ amountReceivedUsdAtSubmission: receivedUsdAtSubmission
58016
58456
  }
58017
58457
  )
58018
58458
  ] })
@@ -58021,7 +58461,7 @@ function BrowserWalletModal({
58021
58461
  }
58022
58462
  ) });
58023
58463
  }
58024
- var WALLET_ICONS2 = {
58464
+ var WALLET_ICONS3 = {
58025
58465
  metamask: MetamaskIcon,
58026
58466
  phantom: PhantomIcon,
58027
58467
  coinbase: CoinbaseIcon,
@@ -58460,10 +58900,10 @@ function WalletSelectionModal({
58460
58900
  },
58461
58901
  children: [
58462
58902
  /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
58463
- WALLET_ICONS2[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
58903
+ WALLET_ICONS3[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
58464
58904
  WalletIconWithNetwork,
58465
58905
  {
58466
- WalletIcon: WALLET_ICONS2[wallet.id],
58906
+ WalletIcon: WALLET_ICONS3[wallet.id],
58467
58907
  networks: wallet.networks,
58468
58908
  size: 40,
58469
58909
  className: "uf-rounded-lg"
@@ -58534,10 +58974,10 @@ function WalletSelectionModal({
58534
58974
  style: { minHeight: WALLET_STEP_BODY_MIN_HEIGHT },
58535
58975
  children: [
58536
58976
  /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-pb-4 uf-shrink-0", children: [
58537
- /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "uf-mb-2", children: WALLET_ICONS2[selectedWallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
58977
+ /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "uf-mb-2", children: WALLET_ICONS3[selectedWallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
58538
58978
  WalletIconWithNetwork,
58539
58979
  {
58540
- WalletIcon: WALLET_ICONS2[selectedWallet.id],
58980
+ WalletIcon: WALLET_ICONS3[selectedWallet.id],
58541
58981
  networks: selectedWallet.networks,
58542
58982
  size: 48,
58543
58983
  className: "uf-rounded-lg"
@@ -59336,136 +59776,794 @@ function DepositModal({
59336
59776
  }
59337
59777
  ) });
59338
59778
  }
59339
- function useSupportedDestinationTokens(publishableKey, enabled = true) {
59779
+ function usePaymentIntent(params) {
59780
+ const {
59781
+ clientSecret,
59782
+ publishableKey,
59783
+ enabled = true,
59784
+ pollingInterval = 5e3
59785
+ } = params;
59340
59786
  return useQuery({
59341
- queryKey: ["unifold", "supportedDestinationTokens", publishableKey],
59342
- queryFn: () => getSupportedDestinationTokens(publishableKey),
59343
- staleTime: 1e3 * 60 * 5,
59344
- gcTime: 1e3 * 60 * 30,
59345
- refetchOnMount: false,
59346
- refetchOnWindowFocus: false,
59347
- enabled
59787
+ queryKey: ["unifold", "paymentIntent", clientSecret, publishableKey],
59788
+ queryFn: () => retrievePaymentIntent(clientSecret, publishableKey),
59789
+ enabled: enabled && !!clientSecret && !!publishableKey,
59790
+ staleTime: 0,
59791
+ refetchInterval: pollingInterval || false,
59792
+ refetchOnWindowFocus: true,
59793
+ retry: 3,
59794
+ retryDelay: (attempt) => Math.min(1e3 * 2 ** attempt, 1e4)
59348
59795
  });
59349
59796
  }
59350
- function useSourceTokenValidation(params) {
59797
+ function useDepositQuote(params) {
59351
59798
  const {
59799
+ publishableKey,
59352
59800
  sourceChainType,
59353
59801
  sourceChainId,
59354
59802
  sourceTokenAddress,
59355
- sourceTokenSymbol,
59356
- publishableKey,
59803
+ destinationAmount,
59804
+ destinationChainType,
59805
+ destinationChainId,
59806
+ destinationTokenAddress,
59357
59807
  enabled = true
59358
59808
  } = params;
59359
- const hasParams = !!sourceChainType && !!sourceChainId && !!sourceTokenAddress;
59809
+ const request = {
59810
+ source_chain_type: sourceChainType,
59811
+ source_chain_id: sourceChainId,
59812
+ source_token_address: sourceTokenAddress,
59813
+ destination_amount: destinationAmount,
59814
+ destination_chain_type: destinationChainType,
59815
+ destination_chain_id: destinationChainId,
59816
+ destination_token_address: destinationTokenAddress
59817
+ };
59360
59818
  return useQuery({
59361
59819
  queryKey: [
59362
59820
  "unifold",
59363
- "sourceTokenValidation",
59364
- sourceChainType ?? null,
59365
- sourceChainId ?? null,
59366
- sourceTokenAddress ?? null,
59821
+ "depositQuote",
59822
+ sourceChainType,
59823
+ sourceChainId,
59824
+ sourceTokenAddress,
59825
+ destinationAmount,
59826
+ destinationChainType,
59827
+ destinationChainId,
59828
+ destinationTokenAddress,
59367
59829
  publishableKey
59368
59830
  ],
59369
- queryFn: async () => {
59370
- const res = await getSupportedDepositTokens(publishableKey);
59371
- let matchedMinUsd = null;
59372
- let matchedProcessingTime = null;
59373
- let matchedSlippage = null;
59374
- let matchedPriceImpact = null;
59375
- const found = res.data.some(
59376
- (token) => token.chains.some((chain) => {
59377
- const match = chain.chain_type === sourceChainType && chain.chain_id === sourceChainId && chain.token_address.toLowerCase() === sourceTokenAddress.toLowerCase();
59378
- if (match) {
59379
- matchedMinUsd = chain.minimum_deposit_amount_usd;
59380
- matchedProcessingTime = chain.estimated_processing_time;
59381
- matchedSlippage = chain.max_slippage_percent;
59382
- matchedPriceImpact = chain.estimated_price_impact_percent;
59383
- }
59384
- return match;
59385
- })
59386
- );
59387
- return {
59388
- isSupported: found,
59389
- minimumAmountUsd: matchedMinUsd,
59390
- estimatedProcessingTime: matchedProcessingTime,
59391
- maxSlippagePercent: matchedSlippage,
59392
- priceImpactPercent: matchedPriceImpact,
59393
- errorMessage: found ? null : `${sourceTokenSymbol || "Source token"} is not a supported withdrawal token. Supported tokens include USDC, USDT, and other stablecoins.`
59394
- };
59395
- },
59396
- enabled: enabled && hasParams,
59397
- staleTime: 1e3 * 60 * 5,
59398
- gcTime: 1e3 * 60 * 30,
59399
- refetchOnMount: false,
59400
- refetchOnWindowFocus: false
59831
+ queryFn: () => getDepositQuote(request, publishableKey),
59832
+ enabled: enabled && !!publishableKey && !!sourceChainType && !!sourceChainId && !!sourceTokenAddress && !!destinationAmount && destinationAmount !== "0" && !!destinationChainType && !!destinationChainId && !!destinationTokenAddress,
59833
+ staleTime: 6e4,
59834
+ gcTime: 5 * 6e4,
59835
+ refetchOnWindowFocus: false,
59836
+ retry: 2,
59837
+ retryDelay: (attempt) => Math.min(1e3 * 2 ** attempt, 5e3)
59401
59838
  });
59402
59839
  }
59403
- function useAddressBalance(params) {
59840
+ function mapDepositAddressesToWallets(depositAddresses, pi) {
59841
+ return depositAddresses.map((da, idx) => ({
59842
+ id: da.id,
59843
+ chain_type: da.chain_type,
59844
+ address_type: da.address_type,
59845
+ address: da.address,
59846
+ destination_chain_type: pi.destination_chain_type,
59847
+ destination_chain_id: pi.destination_chain_id,
59848
+ destination_token_address: pi.destination_token_address,
59849
+ recipient_address: pi.recipient_address,
59850
+ is_primary: idx === 0
59851
+ }));
59852
+ }
59853
+ function SkeletonButton2() {
59854
+ return /* @__PURE__ */ (0, import_jsx_runtime71.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: [
59855
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
59856
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-bg-muted uf-rounded-lg uf-w-9 uf-h-9" }),
59857
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-space-y-1.5", children: [
59858
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-h-3.5 uf-w-24 uf-bg-muted uf-rounded" }),
59859
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-h-3 uf-w-32 uf-bg-muted uf-rounded" })
59860
+ ] })
59861
+ ] }),
59862
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-flex uf-items-center uf-gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(ChevronRight, { className: "uf-w-4 uf-h-4 uf-text-muted" }) })
59863
+ ] });
59864
+ }
59865
+ function CheckoutModal({
59866
+ open,
59867
+ onOpenChange,
59868
+ clientSecret,
59869
+ publishableKey,
59870
+ modalTitle,
59871
+ enableConnectWallet = false,
59872
+ theme = "dark",
59873
+ onCheckoutSuccess,
59874
+ onCheckoutError
59875
+ }) {
59876
+ const { colors: colors2, fonts, components } = useTheme();
59877
+ const [view, setView] = (0, import_react27.useState)("main");
59878
+ const resetViewTimeoutRef = (0, import_react27.useRef)(
59879
+ null
59880
+ );
59881
+ const [browserWalletModalOpen, setBrowserWalletModalOpen] = (0, import_react27.useState)(false);
59882
+ const [browserWalletInfo, setBrowserWalletInfo] = (0, import_react27.useState)(null);
59883
+ const [walletSelectionModalOpen, setWalletSelectionModalOpen] = (0, import_react27.useState)(false);
59884
+ const [browserWalletChainType, setBrowserWalletChainType] = (0, import_react27.useState)(() => getStoredWalletChainType());
59885
+ const isMobileView = useIsMobileViewport();
59886
+ const [resolvedTheme, setResolvedTheme] = (0, import_react27.useState)(
59887
+ theme === "auto" ? "dark" : theme
59888
+ );
59889
+ (0, import_react27.useEffect)(() => {
59890
+ if (theme === "auto") {
59891
+ const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
59892
+ setResolvedTheme(mediaQuery.matches ? "dark" : "light");
59893
+ const handler = (e) => {
59894
+ setResolvedTheme(e.matches ? "dark" : "light");
59895
+ };
59896
+ mediaQuery.addEventListener("change", handler);
59897
+ return () => mediaQuery.removeEventListener("change", handler);
59898
+ } else {
59899
+ setResolvedTheme(theme);
59900
+ }
59901
+ }, [theme]);
59902
+ const themeClass = resolvedTheme === "dark" ? "uf-dark" : "";
59404
59903
  const {
59405
- address,
59406
- chainType,
59407
- chainId,
59408
- tokenAddress,
59904
+ data: paymentIntent,
59905
+ isLoading: piLoading,
59906
+ error: piError
59907
+ } = usePaymentIntent({
59908
+ clientSecret,
59409
59909
  publishableKey,
59410
- enabled = true
59411
- } = params;
59412
- const hasParams = !!address && !!chainType && !!chainId && !!tokenAddress;
59413
- return useQuery({
59414
- queryKey: [
59415
- "unifold",
59416
- "addressBalance",
59417
- address ?? null,
59418
- chainType ?? null,
59419
- chainId ?? null,
59420
- tokenAddress ?? null,
59421
- publishableKey
59422
- ],
59423
- queryFn: async () => {
59424
- const res = await getAddressBalance(
59425
- address,
59426
- chainType,
59427
- chainId,
59428
- tokenAddress,
59429
- publishableKey
59910
+ enabled: open && !!clientSecret,
59911
+ pollingInterval: 5e3
59912
+ });
59913
+ const { projectConfig } = useProjectConfig({
59914
+ publishableKey,
59915
+ enabled: open
59916
+ });
59917
+ const prevStatusRef = (0, import_react27.useRef)(null);
59918
+ (0, import_react27.useEffect)(() => {
59919
+ if (!paymentIntent) return;
59920
+ const prev = prevStatusRef.current;
59921
+ prevStatusRef.current = paymentIntent.status;
59922
+ if (prev && prev !== paymentIntent.status && paymentIntent.status === "succeeded") {
59923
+ if (!browserWalletModalOpen) {
59924
+ setView("main");
59925
+ }
59926
+ onCheckoutSuccess?.({
59927
+ paymentIntentId: paymentIntent.id,
59928
+ status: paymentIntent.status
59929
+ });
59930
+ }
59931
+ }, [paymentIntent, onCheckoutSuccess, browserWalletModalOpen]);
59932
+ const wallets = (0, import_react27.useMemo)(() => {
59933
+ if (!paymentIntent) return [];
59934
+ return mapDepositAddressesToWallets(
59935
+ paymentIntent.deposit_addresses,
59936
+ paymentIntent
59937
+ );
59938
+ }, [paymentIntent]);
59939
+ const formatCryptoAmount = (0, import_react27.useMemo)(() => {
59940
+ if (!paymentIntent) return (_) => "";
59941
+ const decimals = paymentIntent.destination_token_decimals ?? 6;
59942
+ const symbol = paymentIntent.currency.toUpperCase();
59943
+ return (baseUnits) => {
59944
+ const num = Number(baseUnits) / 10 ** decimals;
59945
+ const formatted = num % 1 === 0 ? num.toFixed(0) : num.toFixed(2);
59946
+ return `${formatted} ${symbol}`;
59947
+ };
59948
+ }, [paymentIntent]);
59949
+ const remainingAmountUsd = (0, import_react27.useMemo)(() => {
59950
+ if (!paymentIntent) return void 0;
59951
+ const total = parseFloat(paymentIntent.amount_usd);
59952
+ const received = parseFloat(paymentIntent.amount_received_usd);
59953
+ if (isNaN(total) || isNaN(received)) return paymentIntent.amount_usd;
59954
+ const remaining = total - received;
59955
+ return remaining > 0 ? remaining.toFixed(2) : "0.00";
59956
+ }, [paymentIntent]);
59957
+ const remainingCrypto = (0, import_react27.useMemo)(() => {
59958
+ if (!paymentIntent) return void 0;
59959
+ const total = BigInt(paymentIntent.amount);
59960
+ const received = BigInt(paymentIntent.amount_received);
59961
+ const remaining = total - received;
59962
+ return remaining > 0n ? remaining.toString() : "0";
59963
+ }, [paymentIntent]);
59964
+ const [selectedSource, setSelectedSource] = (0, import_react27.useState)(null);
59965
+ const quoteDestinationAmount = (0, import_react27.useMemo)(() => {
59966
+ if (!paymentIntent || !selectedSource) return "0";
59967
+ const remaining = BigInt(paymentIntent.amount) - BigInt(paymentIntent.amount_received);
59968
+ const totalBaseUnits = Number(paymentIntent.amount);
59969
+ const totalUsd = parseFloat(paymentIntent.amount_usd);
59970
+ const baseUnitsPerUsd = totalUsd > 0 ? totalBaseUnits / totalUsd : 0;
59971
+ const minUsd = Math.max(selectedSource.minimumDepositAmountUsd, 3);
59972
+ const minDepositBaseUnits = BigInt(Math.ceil(minUsd * baseUnitsPerUsd));
59973
+ const effective = remaining > minDepositBaseUnits ? remaining : minDepositBaseUnits;
59974
+ return effective > 0n ? effective.toString() : "0";
59975
+ }, [paymentIntent, selectedSource]);
59976
+ const { data: sourceQuote } = useDepositQuote({
59977
+ publishableKey,
59978
+ sourceChainType: selectedSource?.chainType ?? "",
59979
+ sourceChainId: selectedSource?.chainId ?? "",
59980
+ sourceTokenAddress: selectedSource?.tokenAddress ?? "",
59981
+ destinationAmount: quoteDestinationAmount,
59982
+ destinationChainType: paymentIntent?.destination_chain_type ?? "",
59983
+ destinationChainId: paymentIntent?.destination_chain_id ?? "",
59984
+ destinationTokenAddress: paymentIntent?.destination_token_address ?? "",
59985
+ enabled: open && view === "transfer" && !!paymentIntent && !!selectedSource && quoteDestinationAmount !== "0"
59986
+ });
59987
+ const handleBrowserWalletClick = (0, import_react27.useCallback)(
59988
+ (walletInfo) => {
59989
+ const walletChainType = walletInfo.type === "phantom-solana" || walletInfo.type === "solflare" || walletInfo.type === "backpack" || walletInfo.type === "glow" ? "solana" : "ethereum";
59990
+ setStoredWalletChainType(walletChainType);
59991
+ setBrowserWalletChainType(walletChainType);
59992
+ const matchingDepositWallet = wallets.find(
59993
+ (w) => w.chain_type === walletChainType
59430
59994
  );
59431
- if (res.balance) {
59432
- const decimals = res.balance.token?.decimals ?? 6;
59433
- const symbol = res.balance.token?.symbol ?? "";
59434
- const baseUnit = res.balance.amount;
59435
- const raw = BigInt(baseUnit);
59436
- const divisor = BigInt(10 ** decimals);
59437
- const whole = raw / divisor;
59438
- const frac = raw % divisor;
59439
- const fracStr = frac.toString().padStart(decimals, "0").replace(/0+$/, "");
59440
- const balanceHuman = fracStr ? `${whole}.${fracStr}` : whole.toString();
59441
- return {
59442
- balanceBaseUnit: baseUnit,
59443
- balanceHuman,
59444
- balanceUsd: res.balance.amount_usd,
59445
- exchangeRate: res.balance.exchange_rate,
59446
- decimals,
59447
- symbol
59448
- };
59995
+ if (!matchingDepositWallet) {
59996
+ onCheckoutError?.({
59997
+ message: `Unable to pay from ${walletChainType}. Please try a different wallet.`,
59998
+ code: "NO_DEPOSIT_ADDRESS"
59999
+ });
60000
+ return;
59449
60001
  }
59450
- return { balanceBaseUnit: "0", balanceHuman: "0", balanceUsd: "0", exchangeRate: null, decimals: 6, symbol: "" };
60002
+ setBrowserWalletInfo({
60003
+ ...walletInfo,
60004
+ depositWallet: matchingDepositWallet
60005
+ });
60006
+ setBrowserWalletModalOpen(true);
59451
60007
  },
59452
- enabled: enabled && hasParams,
59453
- staleTime: 1e3 * 30,
59454
- gcTime: 1e3 * 60 * 5,
59455
- refetchInterval: 1e3 * 30,
59456
- refetchOnMount: "always",
59457
- refetchOnWindowFocus: false
59458
- });
59459
- }
59460
- function useExecutions(userId, publishableKey, options2) {
59461
- const actionType = options2?.actionType ?? ActionType.Deposit;
59462
- return useQuery({
59463
- queryKey: ["unifold", "executions", actionType, userId, publishableKey],
59464
- queryFn: () => queryExecutions(userId, publishableKey, actionType),
59465
- enabled: (options2?.enabled ?? true) && !!userId,
59466
- refetchInterval: options2?.refetchInterval ?? 3e3,
59467
- staleTime: 0,
59468
- gcTime: 1e3 * 60 * 5,
60008
+ [wallets, onCheckoutError]
60009
+ );
60010
+ const handleWalletConnectClick = (0, import_react27.useCallback)(() => {
60011
+ setWalletSelectionModalOpen(true);
60012
+ }, []);
60013
+ const handleWalletConnected = (0, import_react27.useCallback)(
60014
+ (walletInfo) => {
60015
+ const walletChainType = walletInfo.type === "phantom-solana" || walletInfo.type === "solflare" || walletInfo.type === "backpack" || walletInfo.type === "glow" ? "solana" : "ethereum";
60016
+ setStoredWalletChainType(walletChainType);
60017
+ setBrowserWalletChainType(walletChainType);
60018
+ const matchingDepositWallet = wallets.find(
60019
+ (w) => w.chain_type === walletChainType
60020
+ );
60021
+ if (!matchingDepositWallet) {
60022
+ onCheckoutError?.({
60023
+ message: `Unable to pay from ${walletChainType}. Please try a different wallet.`,
60024
+ code: "NO_DEPOSIT_ADDRESS"
60025
+ });
60026
+ setWalletSelectionModalOpen(false);
60027
+ return;
60028
+ }
60029
+ setBrowserWalletInfo({
60030
+ ...walletInfo,
60031
+ depositWallet: matchingDepositWallet
60032
+ });
60033
+ setWalletSelectionModalOpen(false);
60034
+ setBrowserWalletModalOpen(true);
60035
+ },
60036
+ [wallets, onCheckoutError]
60037
+ );
60038
+ const handleWalletDisconnect = (0, import_react27.useCallback)(() => {
60039
+ setUserDisconnectedWallet(true);
60040
+ clearStoredWalletChainType();
60041
+ setBrowserWalletChainType(void 0);
60042
+ setBrowserWalletInfo(null);
60043
+ setBrowserWalletModalOpen(false);
60044
+ }, []);
60045
+ const handleClose = (0, import_react27.useCallback)(() => {
60046
+ onOpenChange(false);
60047
+ if (resetViewTimeoutRef.current) {
60048
+ clearTimeout(resetViewTimeoutRef.current);
60049
+ }
60050
+ resetViewTimeoutRef.current = setTimeout(() => {
60051
+ setView("main");
60052
+ setBrowserWalletInfo(null);
60053
+ resetViewTimeoutRef.current = null;
60054
+ }, 200);
60055
+ }, [onOpenChange]);
60056
+ (0, import_react27.useLayoutEffect)(() => {
60057
+ if (!open) return;
60058
+ if (resetViewTimeoutRef.current) {
60059
+ clearTimeout(resetViewTimeoutRef.current);
60060
+ resetViewTimeoutRef.current = null;
60061
+ }
60062
+ setView("main");
60063
+ setBrowserWalletInfo(null);
60064
+ }, [open]);
60065
+ (0, import_react27.useEffect)(
60066
+ () => () => {
60067
+ if (resetViewTimeoutRef.current) {
60068
+ clearTimeout(resetViewTimeoutRef.current);
60069
+ }
60070
+ },
60071
+ []
60072
+ );
60073
+ const handleBack = (0, import_react27.useCallback)(() => {
60074
+ setView("main");
60075
+ }, []);
60076
+ const poweredByFooter = /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60077
+ PoweredByUnifold,
60078
+ {
60079
+ color: colors2.foregroundMuted,
60080
+ className: "uf-flex uf-justify-center uf-shrink-0"
60081
+ }
60082
+ ) });
60083
+ const progressSection = paymentIntent ? (() => {
60084
+ const received = parseFloat(paymentIntent.amount_received_usd);
60085
+ const total = parseFloat(paymentIntent.amount_usd);
60086
+ const remaining = Math.max(total - received, 0);
60087
+ const pct = total > 0 ? Math.min(received / total * 100, 100) : 0;
60088
+ const hasPartial = received > 0;
60089
+ const amountStr = paymentIntent.amount_usd;
60090
+ const dynamicFontSize = `${Math.max(3.75 - amountStr.length * 0.15, 2)}rem`;
60091
+ return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-text-center uf-py-2 uf-space-y-1", children: [
60092
+ paymentIntent.description && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60093
+ "div",
60094
+ {
60095
+ className: "uf-text-xs",
60096
+ style: {
60097
+ color: colors2.foregroundMuted,
60098
+ fontFamily: fonts.regular
60099
+ },
60100
+ children: paymentIntent.description
60101
+ }
60102
+ ),
60103
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-center", children: [
60104
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60105
+ "span",
60106
+ {
60107
+ className: "uf-mr-1",
60108
+ style: {
60109
+ fontSize: `calc(${dynamicFontSize} * 0.6)`,
60110
+ color: colors2.foregroundMuted,
60111
+ fontFamily: fonts.regular
60112
+ },
60113
+ children: "$"
60114
+ }
60115
+ ),
60116
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60117
+ "span",
60118
+ {
60119
+ style: {
60120
+ fontSize: dynamicFontSize,
60121
+ color: colors2.foreground,
60122
+ fontFamily: fonts.regular,
60123
+ lineHeight: 1.1
60124
+ },
60125
+ children: amountStr
60126
+ }
60127
+ )
60128
+ ] }),
60129
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60130
+ "div",
60131
+ {
60132
+ className: "uf-text-xs",
60133
+ style: {
60134
+ color: colors2.foregroundMuted,
60135
+ fontFamily: fonts.regular
60136
+ },
60137
+ children: paymentIntent.currency.toUpperCase()
60138
+ }
60139
+ ),
60140
+ hasPartial && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-pt-2 uf-space-y-1.5", children: [
60141
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60142
+ "div",
60143
+ {
60144
+ className: "uf-w-full uf-h-1.5 uf-rounded-full uf-overflow-hidden",
60145
+ style: { backgroundColor: colors2.border },
60146
+ children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60147
+ "div",
60148
+ {
60149
+ className: "uf-h-full uf-rounded-full uf-transition-all uf-duration-500",
60150
+ style: {
60151
+ width: `${pct}%`,
60152
+ backgroundColor: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : colors2.primary
60153
+ }
60154
+ }
60155
+ )
60156
+ }
60157
+ ),
60158
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60159
+ "div",
60160
+ {
60161
+ className: "uf-text-xs",
60162
+ style: {
60163
+ color: colors2.foregroundMuted,
60164
+ fontFamily: fonts.regular
60165
+ },
60166
+ children: [
60167
+ "$",
60168
+ paymentIntent.amount_received_usd,
60169
+ " / $",
60170
+ amountStr,
60171
+ " received",
60172
+ remaining > 0 && paymentIntent.status !== "succeeded" && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("span", { style: { color: colors2.foreground, fontFamily: fonts.medium }, children: [
60173
+ " ",
60174
+ "\xB7 $",
60175
+ remaining.toFixed(2),
60176
+ " remaining"
60177
+ ] })
60178
+ ]
60179
+ }
60180
+ )
60181
+ ] }),
60182
+ paymentIntent.status !== "requires_payment" && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-pt-1", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60183
+ "span",
60184
+ {
60185
+ className: "uf-text-xs uf-font-medium uf-px-2.5 uf-py-1 uf-rounded-full uf-inline-block",
60186
+ style: {
60187
+ 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)",
60188
+ color: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : paymentIntent.status === "processing" ? "rgb(59, 130, 246)" : "rgb(239, 68, 68)",
60189
+ fontFamily: fonts.medium
60190
+ },
60191
+ children: paymentIntent.status === "succeeded" ? "Payment Complete" : paymentIntent.status === "processing" ? "Partial Payment Received" : paymentIntent.status === "canceled" ? "Canceled" : paymentIntent.status === "expired" ? "Expired" : paymentIntent.status
60192
+ }
60193
+ ) })
60194
+ ] });
60195
+ })() : null;
60196
+ return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(PortalContainerProvider, { value: null, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(Dialog2, { open, onOpenChange: handleClose, modal: true, children: [
60197
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60198
+ DialogContent2,
60199
+ {
60200
+ 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}`,
60201
+ style: { backgroundColor: colors2.background },
60202
+ onPointerDownOutside: (e) => e.preventDefault(),
60203
+ onInteractOutside: (e) => e.preventDefault(),
60204
+ children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(ThemeStyleInjector, { children: view === "main" ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
60205
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60206
+ DepositHeader,
60207
+ {
60208
+ title: modalTitle || "Checkout",
60209
+ showClose: true,
60210
+ onClose: handleClose
60211
+ }
60212
+ ),
60213
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
60214
+ piLoading ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-space-y-3", children: [
60215
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60216
+ "div",
60217
+ {
60218
+ className: "uf-rounded-xl uf-p-4 uf-animate-pulse",
60219
+ style: {
60220
+ backgroundColor: components.card.backgroundColor,
60221
+ borderRadius: components.card.borderRadius,
60222
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
60223
+ },
60224
+ children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-gap-2", children: [
60225
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60226
+ "div",
60227
+ {
60228
+ className: "uf-h-8 uf-w-24 uf-rounded",
60229
+ style: {
60230
+ backgroundColor: components.card.borderColor
60231
+ }
60232
+ }
60233
+ ),
60234
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60235
+ "div",
60236
+ {
60237
+ className: "uf-h-4 uf-w-16 uf-rounded",
60238
+ style: {
60239
+ backgroundColor: components.card.borderColor
60240
+ }
60241
+ }
60242
+ )
60243
+ ] })
60244
+ }
60245
+ ),
60246
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SkeletonButton2, {}),
60247
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SkeletonButton2, {})
60248
+ ] }) : piError ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
60249
+ /* @__PURE__ */ (0, import_jsx_runtime71.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_runtime71.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
60250
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60251
+ "h3",
60252
+ {
60253
+ className: "uf-text-lg uf-font-semibold uf-mb-2",
60254
+ style: {
60255
+ color: colors2.foreground,
60256
+ fontFamily: fonts.semibold
60257
+ },
60258
+ children: "Unable to Load Checkout"
60259
+ }
60260
+ ),
60261
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60262
+ "p",
60263
+ {
60264
+ className: "uf-text-sm uf-max-w-[280px]",
60265
+ style: {
60266
+ color: colors2.foregroundMuted,
60267
+ fontFamily: fonts.regular
60268
+ },
60269
+ children: piError instanceof Error ? piError.message : "Something went wrong. Please try again."
60270
+ }
60271
+ )
60272
+ ] }) : paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-space-y-3", children: [
60273
+ progressSection,
60274
+ (paymentIntent.status === "requires_payment" || paymentIntent.status === "processing") && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
60275
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60276
+ TransferCryptoButton,
60277
+ {
60278
+ onClick: () => setView("transfer"),
60279
+ title: "Transfer Crypto",
60280
+ subtitle: "Send from any wallet or exchange",
60281
+ featuredTokens: projectConfig?.transfer_crypto.networks
60282
+ }
60283
+ ),
60284
+ enableConnectWallet && !isMobileView && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60285
+ BrowserWalletButton,
60286
+ {
60287
+ onClick: handleBrowserWalletClick,
60288
+ onConnectClick: handleWalletConnectClick,
60289
+ onDisconnect: handleWalletDisconnect,
60290
+ chainType: browserWalletChainType,
60291
+ publishableKey
60292
+ }
60293
+ )
60294
+ ] })
60295
+ ] }) : null,
60296
+ poweredByFooter
60297
+ ] })
60298
+ ] }) : view === "transfer" ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
60299
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60300
+ DepositHeader,
60301
+ {
60302
+ title: `Pay $${remainingAmountUsd ?? paymentIntent?.amount_usd ?? ""}`,
60303
+ showBack: true,
60304
+ onBack: handleBack,
60305
+ onClose: handleClose
60306
+ }
60307
+ ),
60308
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
60309
+ paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
60310
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60311
+ "div",
60312
+ {
60313
+ className: "uf-rounded-lg uf-px-3 uf-py-2 uf-flex uf-items-center uf-justify-between",
60314
+ style: {
60315
+ backgroundColor: components.card.backgroundColor,
60316
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`,
60317
+ borderRadius: components.card.borderRadius
60318
+ },
60319
+ children: [
60320
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60321
+ "span",
60322
+ {
60323
+ className: "uf-text-xs",
60324
+ style: {
60325
+ color: colors2.foregroundMuted,
60326
+ fontFamily: fonts.regular
60327
+ },
60328
+ children: parseFloat(paymentIntent.amount_received_usd) > 0 ? `$${paymentIntent.amount_received_usd} / $${paymentIntent.amount_usd} received` : "Amount due"
60329
+ }
60330
+ ),
60331
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60332
+ "span",
60333
+ {
60334
+ className: "uf-text-sm uf-font-semibold",
60335
+ style: {
60336
+ color: colors2.foreground,
60337
+ fontFamily: fonts.semibold
60338
+ },
60339
+ children: [
60340
+ formatCryptoAmount(remainingCrypto ?? paymentIntent.amount),
60341
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60342
+ "span",
60343
+ {
60344
+ className: "uf-text-xs uf-font-normal uf-ml-1",
60345
+ style: { color: colors2.foregroundMuted },
60346
+ children: [
60347
+ "($",
60348
+ remainingAmountUsd ?? paymentIntent.amount_usd,
60349
+ ")"
60350
+ ]
60351
+ }
60352
+ )
60353
+ ]
60354
+ }
60355
+ )
60356
+ ]
60357
+ }
60358
+ ),
60359
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60360
+ TransferCryptoSingleInput,
60361
+ {
60362
+ userId: paymentIntent.user_id || "",
60363
+ publishableKey,
60364
+ clientSecret,
60365
+ recipientAddress: paymentIntent.recipient_address,
60366
+ destinationChainType: paymentIntent.destination_chain_type,
60367
+ destinationChainId: paymentIntent.destination_chain_id,
60368
+ destinationTokenAddress: paymentIntent.destination_token_address,
60369
+ depositConfirmationMode: "auto_ui",
60370
+ wallets,
60371
+ onSourceTokenChange: setSelectedSource,
60372
+ checkoutQuote: sourceQuote ? {
60373
+ sourceAmount: sourceQuote.source_amount,
60374
+ sourceTokenDecimals: sourceQuote.source_token_decimals,
60375
+ sourceTokenSymbol: sourceQuote.source_token_symbol,
60376
+ sourceAmountUsd: sourceQuote.source_amount_usd
60377
+ } : null
60378
+ }
60379
+ )
60380
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SkeletonButton2, {}),
60381
+ poweredByFooter
60382
+ ] })
60383
+ ] }) : null })
60384
+ }
60385
+ ),
60386
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60387
+ WalletSelectionModal,
60388
+ {
60389
+ open: walletSelectionModalOpen,
60390
+ onOpenChange: setWalletSelectionModalOpen,
60391
+ onWalletConnected: handleWalletConnected,
60392
+ onClose: () => setWalletSelectionModalOpen(false),
60393
+ theme: resolvedTheme
60394
+ }
60395
+ ),
60396
+ browserWalletInfo && browserWalletInfo.depositWallet && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60397
+ BrowserWalletModal,
60398
+ {
60399
+ open: browserWalletModalOpen,
60400
+ onOpenChange: setBrowserWalletModalOpen,
60401
+ onFullClose: handleClose,
60402
+ walletInfo: browserWalletInfo,
60403
+ depositWallet: browserWalletInfo.depositWallet,
60404
+ userId: paymentIntent?.user_id || "",
60405
+ publishableKey,
60406
+ clientSecret,
60407
+ theme: resolvedTheme,
60408
+ prefillAmountUsd: remainingAmountUsd,
60409
+ checkoutAmountUsd: paymentIntent?.amount_usd,
60410
+ checkoutReceivedUsd: paymentIntent?.amount_received_usd,
60411
+ onSuccess: (txHash) => {
60412
+ onCheckoutSuccess?.({
60413
+ paymentIntentId: paymentIntent?.id || "",
60414
+ status: "processing"
60415
+ });
60416
+ },
60417
+ onError: (error) => {
60418
+ onCheckoutError?.({
60419
+ message: error.message,
60420
+ error
60421
+ });
60422
+ },
60423
+ onWalletDisconnect: handleWalletDisconnect,
60424
+ onNewDeposit: () => {
60425
+ setBrowserWalletModalOpen(false);
60426
+ setView("main");
60427
+ },
60428
+ onDone: () => {
60429
+ setBrowserWalletModalOpen(false);
60430
+ setView("main");
60431
+ },
60432
+ paymentIntentStatus: paymentIntent?.status
60433
+ }
60434
+ )
60435
+ ] }) });
60436
+ }
60437
+ function useSupportedDestinationTokens(publishableKey, enabled = true) {
60438
+ return useQuery({
60439
+ queryKey: ["unifold", "supportedDestinationTokens", publishableKey],
60440
+ queryFn: () => getSupportedDestinationTokens(publishableKey),
60441
+ staleTime: 1e3 * 60 * 5,
60442
+ gcTime: 1e3 * 60 * 30,
60443
+ refetchOnMount: false,
60444
+ refetchOnWindowFocus: false,
60445
+ enabled
60446
+ });
60447
+ }
60448
+ function useSourceTokenValidation(params) {
60449
+ const {
60450
+ sourceChainType,
60451
+ sourceChainId,
60452
+ sourceTokenAddress,
60453
+ sourceTokenSymbol,
60454
+ publishableKey,
60455
+ enabled = true
60456
+ } = params;
60457
+ const hasParams = !!sourceChainType && !!sourceChainId && !!sourceTokenAddress;
60458
+ return useQuery({
60459
+ queryKey: [
60460
+ "unifold",
60461
+ "sourceTokenValidation",
60462
+ sourceChainType ?? null,
60463
+ sourceChainId ?? null,
60464
+ sourceTokenAddress ?? null,
60465
+ publishableKey
60466
+ ],
60467
+ queryFn: async () => {
60468
+ const res = await getSupportedDepositTokens(publishableKey);
60469
+ let matchedMinUsd = null;
60470
+ let matchedProcessingTime = null;
60471
+ let matchedSlippage = null;
60472
+ let matchedPriceImpact = null;
60473
+ const found = res.data.some(
60474
+ (token) => token.chains.some((chain) => {
60475
+ const match = chain.chain_type === sourceChainType && chain.chain_id === sourceChainId && chain.token_address.toLowerCase() === sourceTokenAddress.toLowerCase();
60476
+ if (match) {
60477
+ matchedMinUsd = chain.minimum_deposit_amount_usd;
60478
+ matchedProcessingTime = chain.estimated_processing_time;
60479
+ matchedSlippage = chain.max_slippage_percent;
60480
+ matchedPriceImpact = chain.estimated_price_impact_percent;
60481
+ }
60482
+ return match;
60483
+ })
60484
+ );
60485
+ return {
60486
+ isSupported: found,
60487
+ minimumAmountUsd: matchedMinUsd,
60488
+ estimatedProcessingTime: matchedProcessingTime,
60489
+ maxSlippagePercent: matchedSlippage,
60490
+ priceImpactPercent: matchedPriceImpact,
60491
+ errorMessage: found ? null : `${sourceTokenSymbol || "Source token"} is not a supported withdrawal token. Supported tokens include USDC, USDT, and other stablecoins.`
60492
+ };
60493
+ },
60494
+ enabled: enabled && hasParams,
60495
+ staleTime: 1e3 * 60 * 5,
60496
+ gcTime: 1e3 * 60 * 30,
60497
+ refetchOnMount: false,
60498
+ refetchOnWindowFocus: false
60499
+ });
60500
+ }
60501
+ function useAddressBalance(params) {
60502
+ const {
60503
+ address,
60504
+ chainType,
60505
+ chainId,
60506
+ tokenAddress,
60507
+ publishableKey,
60508
+ enabled = true
60509
+ } = params;
60510
+ const hasParams = !!address && !!chainType && !!chainId && !!tokenAddress;
60511
+ return useQuery({
60512
+ queryKey: [
60513
+ "unifold",
60514
+ "addressBalance",
60515
+ address ?? null,
60516
+ chainType ?? null,
60517
+ chainId ?? null,
60518
+ tokenAddress ?? null,
60519
+ publishableKey
60520
+ ],
60521
+ queryFn: async () => {
60522
+ const res = await getAddressBalance(
60523
+ address,
60524
+ chainType,
60525
+ chainId,
60526
+ tokenAddress,
60527
+ publishableKey
60528
+ );
60529
+ if (res.balance) {
60530
+ const decimals = res.balance.token?.decimals ?? 6;
60531
+ const symbol = res.balance.token?.symbol ?? "";
60532
+ const baseUnit = res.balance.amount;
60533
+ const raw = BigInt(baseUnit);
60534
+ const divisor = BigInt(10 ** decimals);
60535
+ const whole = raw / divisor;
60536
+ const frac = raw % divisor;
60537
+ const fracStr = frac.toString().padStart(decimals, "0").replace(/0+$/, "");
60538
+ const balanceHuman = fracStr ? `${whole}.${fracStr}` : whole.toString();
60539
+ return {
60540
+ balanceBaseUnit: baseUnit,
60541
+ balanceHuman,
60542
+ balanceUsd: res.balance.amount_usd,
60543
+ exchangeRate: res.balance.exchange_rate,
60544
+ decimals,
60545
+ symbol
60546
+ };
60547
+ }
60548
+ return { balanceBaseUnit: "0", balanceHuman: "0", balanceUsd: "0", exchangeRate: null, decimals: 6, symbol: "" };
60549
+ },
60550
+ enabled: enabled && hasParams,
60551
+ staleTime: 1e3 * 30,
60552
+ gcTime: 1e3 * 60 * 5,
60553
+ refetchInterval: 1e3 * 30,
60554
+ refetchOnMount: "always",
60555
+ refetchOnWindowFocus: false
60556
+ });
60557
+ }
60558
+ function useExecutions(userId, publishableKey, options2) {
60559
+ const actionType = options2?.actionType ?? ActionType.Deposit;
60560
+ return useQuery({
60561
+ queryKey: ["unifold", "executions", actionType, userId, publishableKey],
60562
+ queryFn: () => queryExecutions(userId, publishableKey, actionType),
60563
+ enabled: (options2?.enabled ?? true) && !!userId,
60564
+ refetchInterval: options2?.refetchInterval ?? 3e3,
60565
+ staleTime: 0,
60566
+ gcTime: 1e3 * 60 * 5,
59469
60567
  refetchOnWindowFocus: false
59470
60568
  });
59471
60569
  }
@@ -59480,20 +60578,20 @@ function useWithdrawPolling({
59480
60578
  onWithdrawSuccess,
59481
60579
  onWithdrawError
59482
60580
  }) {
59483
- const [executions, setExecutions] = (0, import_react28.useState)([]);
59484
- const [isPolling, setIsPolling] = (0, import_react28.useState)(false);
59485
- const enabledAtRef = (0, import_react28.useRef)(/* @__PURE__ */ new Date());
59486
- const trackedRef = (0, import_react28.useRef)(/* @__PURE__ */ new Map());
59487
- const prevEnabledRef = (0, import_react28.useRef)(false);
59488
- const onSuccessRef = (0, import_react28.useRef)(onWithdrawSuccess);
59489
- const onErrorRef = (0, import_react28.useRef)(onWithdrawError);
59490
- (0, import_react28.useEffect)(() => {
60581
+ const [executions, setExecutions] = (0, import_react29.useState)([]);
60582
+ const [isPolling, setIsPolling] = (0, import_react29.useState)(false);
60583
+ const enabledAtRef = (0, import_react29.useRef)(/* @__PURE__ */ new Date());
60584
+ const trackedRef = (0, import_react29.useRef)(/* @__PURE__ */ new Map());
60585
+ const prevEnabledRef = (0, import_react29.useRef)(false);
60586
+ const onSuccessRef = (0, import_react29.useRef)(onWithdrawSuccess);
60587
+ const onErrorRef = (0, import_react29.useRef)(onWithdrawError);
60588
+ (0, import_react29.useEffect)(() => {
59491
60589
  onSuccessRef.current = onWithdrawSuccess;
59492
60590
  }, [onWithdrawSuccess]);
59493
- (0, import_react28.useEffect)(() => {
60591
+ (0, import_react29.useEffect)(() => {
59494
60592
  onErrorRef.current = onWithdrawError;
59495
60593
  }, [onWithdrawError]);
59496
- (0, import_react28.useEffect)(() => {
60594
+ (0, import_react29.useEffect)(() => {
59497
60595
  if (enabled && !prevEnabledRef.current) {
59498
60596
  enabledAtRef.current = /* @__PURE__ */ new Date();
59499
60597
  trackedRef.current.clear();
@@ -59503,7 +60601,7 @@ function useWithdrawPolling({
59503
60601
  }
59504
60602
  prevEnabledRef.current = enabled;
59505
60603
  }, [enabled]);
59506
- (0, import_react28.useEffect)(() => {
60604
+ (0, import_react29.useEffect)(() => {
59507
60605
  if (!userId || !enabled) return;
59508
60606
  const enabledAt = enabledAtRef.current;
59509
60607
  const poll = async () => {
@@ -59565,7 +60663,7 @@ function useWithdrawPolling({
59565
60663
  setIsPolling(false);
59566
60664
  };
59567
60665
  }, [userId, publishableKey, enabled]);
59568
- (0, import_react28.useEffect)(() => {
60666
+ (0, import_react29.useEffect)(() => {
59569
60667
  if (!enabled || !depositWalletId) return;
59570
60668
  const trigger = async () => {
59571
60669
  try {
@@ -59593,8 +60691,8 @@ function WithdrawDoubleInput({
59593
60691
  const isDarkMode = useTheme().themeClass.includes("uf-dark");
59594
60692
  const selectedToken = selectedTokenSymbol ? tokens.find((t11) => t11.symbol === selectedTokenSymbol) : void 0;
59595
60693
  const availableChainsForToken = selectedToken?.chains || [];
59596
- const renderTokenItem = (tokenData) => /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
59597
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60694
+ const renderTokenItem = (tokenData) => /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
60695
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59598
60696
  "img",
59599
60697
  {
59600
60698
  src: tokenData.icon_url,
@@ -59605,10 +60703,10 @@ function WithdrawDoubleInput({
59605
60703
  className: "uf-rounded-full uf-flex-shrink-0"
59606
60704
  }
59607
60705
  ),
59608
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-font-normal", children: tokenData.symbol })
60706
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs uf-font-normal", children: tokenData.symbol })
59609
60707
  ] });
59610
- const renderChainItem = (chainData) => /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
59611
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60708
+ const renderChainItem = (chainData) => /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
60709
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59612
60710
  "img",
59613
60711
  {
59614
60712
  src: chainData.icon_url,
@@ -59619,14 +60717,14 @@ function WithdrawDoubleInput({
59619
60717
  className: "uf-rounded-full uf-flex-shrink-0"
59620
60718
  }
59621
60719
  ),
59622
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-font-normal", children: chainData.chain_name })
60720
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs uf-font-normal", children: chainData.chain_name })
59623
60721
  ] });
59624
60722
  const currentChainData = selectedChainKey ? availableChainsForToken.find(
59625
60723
  (c) => getChainKey4(c.chain_id, c.chain_type) === selectedChainKey
59626
60724
  ) : void 0;
59627
- return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-grid uf-grid-cols-2 uf-gap-2.5", children: [
59628
- /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { children: [
59629
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60725
+ return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-grid uf-grid-cols-2 uf-gap-2.5", children: [
60726
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
60727
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59630
60728
  "div",
59631
60729
  {
59632
60730
  className: "uf-text-xs uf-mb-2 uf-flex uf-items-center uf-gap-1",
@@ -59634,14 +60732,14 @@ function WithdrawDoubleInput({
59634
60732
  children: t7.receiveToken
59635
60733
  }
59636
60734
  ),
59637
- /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60735
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
59638
60736
  Select2,
59639
60737
  {
59640
60738
  value: selectedTokenSymbol ?? "",
59641
60739
  onValueChange: onTokenChange,
59642
60740
  disabled: isLoading || tokens.length === 0,
59643
60741
  children: [
59644
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60742
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59645
60743
  SelectTrigger2,
59646
60744
  {
59647
60745
  className: "uf-h-10 hover:uf-opacity-90 uf-text-foreground disabled:uf-opacity-50",
@@ -59649,10 +60747,10 @@ function WithdrawDoubleInput({
59649
60747
  backgroundColor: components.card.backgroundColor,
59650
60748
  border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
59651
60749
  },
59652
- children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SelectValue2, { children: isLoading || !selectedTokenSymbol ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-font-light uf-text-muted-foreground", children: t7.loading }) : selectedToken ? renderTokenItem(selectedToken) : /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-font-normal", children: selectedTokenSymbol }) })
60750
+ children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(SelectValue2, { children: isLoading || !selectedTokenSymbol ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs uf-font-light uf-text-muted-foreground", children: t7.loading }) : selectedToken ? renderTokenItem(selectedToken) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs uf-font-normal", children: selectedTokenSymbol }) })
59653
60751
  }
59654
60752
  ),
59655
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60753
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59656
60754
  SelectContent2,
59657
60755
  {
59658
60756
  className: "uf-bg-secondary uf-border uf-text-foreground uf-max-h-[300px]",
@@ -59660,7 +60758,7 @@ function WithdrawDoubleInput({
59660
60758
  border: `1px solid ${isDarkMode ? "rgba(255,255,255,0.15)" : "rgba(0,0,0,0.15)"}`,
59661
60759
  ...fonts.regular ? { "--uf-font-family": fonts.regular } : {}
59662
60760
  },
59663
- children: tokens.map((tokenData) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60761
+ children: tokens.map((tokenData) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59664
60762
  SelectItem2,
59665
60763
  {
59666
60764
  value: tokenData.symbol,
@@ -59675,8 +60773,8 @@ function WithdrawDoubleInput({
59675
60773
  }
59676
60774
  )
59677
60775
  ] }),
59678
- /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { children: [
59679
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60776
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
60777
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59680
60778
  "div",
59681
60779
  {
59682
60780
  className: "uf-text-xs uf-mb-2 uf-flex uf-items-center uf-gap-1",
@@ -59684,14 +60782,14 @@ function WithdrawDoubleInput({
59684
60782
  children: t7.receiveChain
59685
60783
  }
59686
60784
  ),
59687
- /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60785
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
59688
60786
  Select2,
59689
60787
  {
59690
60788
  value: selectedChainKey ?? "",
59691
60789
  onValueChange: onChainChange,
59692
60790
  disabled: isLoading || availableChainsForToken.length === 0,
59693
60791
  children: [
59694
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60792
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59695
60793
  SelectTrigger2,
59696
60794
  {
59697
60795
  className: "uf-h-10 hover:uf-opacity-90 uf-text-foreground disabled:uf-opacity-50",
@@ -59699,10 +60797,10 @@ function WithdrawDoubleInput({
59699
60797
  backgroundColor: components.card.backgroundColor,
59700
60798
  border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
59701
60799
  },
59702
- children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SelectValue2, { children: isLoading || !selectedChainKey ? /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-font-light uf-text-muted-foreground", children: t7.loading }) : currentChainData ? renderChainItem(currentChainData) : /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-font-normal", children: selectedChainKey }) })
60800
+ children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(SelectValue2, { children: isLoading || !selectedChainKey ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs uf-font-light uf-text-muted-foreground", children: t7.loading }) : currentChainData ? renderChainItem(currentChainData) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs uf-font-normal", children: selectedChainKey }) })
59703
60801
  }
59704
60802
  ),
59705
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60803
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59706
60804
  SelectContent2,
59707
60805
  {
59708
60806
  align: "end",
@@ -59711,9 +60809,9 @@ function WithdrawDoubleInput({
59711
60809
  border: `1px solid ${isDarkMode ? "rgba(255,255,255,0.15)" : "rgba(0,0,0,0.15)"}`,
59712
60810
  ...fonts.regular ? { "--uf-font-family": fonts.regular } : {}
59713
60811
  },
59714
- children: availableChainsForToken.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime71.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) => {
60812
+ children: availableChainsForToken.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime72.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) => {
59715
60813
  const chainKey = getChainKey4(chainData.chain_id, chainData.chain_type);
59716
- return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60814
+ return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59717
60815
  SelectItem2,
59718
60816
  {
59719
60817
  value: chainKey,
@@ -59878,9 +60976,56 @@ async function sendSolanaWithdraw(params) {
59878
60976
  );
59879
60977
  return sendResponse.signature;
59880
60978
  }
60979
+ var HYPERCORE_CHAIN_ID = "1337";
60980
+ var HYPERCORE_SPOT_USDC_ADDRESS = "0x6d1e7cde53ba9467b783cb7c530ce054";
60981
+ function isHypercoreChain(chainId) {
60982
+ return chainId === HYPERCORE_CHAIN_ID;
60983
+ }
60984
+ async function sendHypercoreWithdraw(params) {
60985
+ const {
60986
+ provider,
60987
+ fromAddress,
60988
+ depositWalletAddress,
60989
+ sourceTokenAddress,
60990
+ amount,
60991
+ tokenSymbol,
60992
+ publishableKey
60993
+ } = params;
60994
+ const isSpot = sourceTokenAddress.toLowerCase() === HYPERCORE_SPOT_USDC_ADDRESS;
60995
+ const currentChainHex = await provider.request({
60996
+ method: "eth_chainId",
60997
+ params: []
60998
+ });
60999
+ const activeChainId = String(parseInt(currentChainHex, 16));
61000
+ const buildResult = await buildHypercoreTransaction(
61001
+ {
61002
+ action_type: isSpot ? "spot_send" : "usd_send",
61003
+ signature_chain_type: "ethereum",
61004
+ signature_chain_id: activeChainId,
61005
+ recipient_address: depositWalletAddress,
61006
+ token_address: sourceTokenAddress,
61007
+ token_symbol: tokenSymbol || void 0,
61008
+ amount
61009
+ },
61010
+ publishableKey
61011
+ );
61012
+ const signature = await provider.request({
61013
+ method: "eth_signTypedData_v4",
61014
+ params: [fromAddress, JSON.stringify(buildResult.typed_data)]
61015
+ });
61016
+ await sendHypercoreTransaction(
61017
+ {
61018
+ action_payload: buildResult.action_payload,
61019
+ signature,
61020
+ nonce: buildResult.nonce
61021
+ },
61022
+ publishableKey
61023
+ );
61024
+ }
59881
61025
  async function detectBrowserWallet(chainType, senderAddress) {
59882
61026
  const win = typeof window !== "undefined" ? window : null;
59883
61027
  if (!win || !senderAddress) return null;
61028
+ if (getUserDisconnectedWallet()) return null;
59884
61029
  const anyWin = win;
59885
61030
  if (chainType === "solana") {
59886
61031
  const solProviders = [];
@@ -59914,28 +61059,44 @@ async function detectBrowserWallet(chainType, senderAddress) {
59914
61059
  evmProviders.push({ provider: p, name });
59915
61060
  }
59916
61061
  };
59917
- add(anyWin.phantom?.ethereum, "Phantom");
59918
- add(anyWin.coinbaseWalletExtension, "Coinbase");
59919
- add(anyWin.trustwallet?.ethereum, "Trust Wallet");
59920
- add(anyWin.okxwallet, "OKX Wallet");
59921
- if (anyWin.__eip6963Providers) {
59922
- for (const detail of anyWin.__eip6963Providers) {
59923
- const rdns = detail.info?.rdns || "";
59924
- let name = detail.info?.name || "Wallet";
59925
- if (rdns.includes("metamask")) name = "MetaMask";
59926
- else if (rdns.includes("rabby")) name = "Rabby";
59927
- else if (rdns.includes("rainbow")) name = "Rainbow";
59928
- add(detail.provider, name);
59929
- }
59930
- }
59931
- if (win.ethereum) {
59932
- const eth = win.ethereum;
59933
- let name = "Wallet";
59934
- if (eth.isMetaMask && !eth.isPhantom && !eth.isRabby) name = "MetaMask";
59935
- else if (eth.isRabby) name = "Rabby";
59936
- else if (eth.isRainbow) name = "Rainbow";
59937
- else if (eth.isCoinbaseWallet) name = "Coinbase";
59938
- add(eth, name);
61062
+ if (!anyWin.__eip6963Providers) {
61063
+ anyWin.__eip6963Providers = [];
61064
+ }
61065
+ const handleAnnouncement = (event) => {
61066
+ const { detail } = event;
61067
+ if (!detail?.info || !detail?.provider) return;
61068
+ const exists = anyWin.__eip6963Providers.some((p) => p.info.uuid === detail.info.uuid);
61069
+ if (!exists) anyWin.__eip6963Providers.push(detail);
61070
+ };
61071
+ win.addEventListener("eip6963:announceProvider", handleAnnouncement);
61072
+ win.dispatchEvent(new Event("eip6963:requestProvider"));
61073
+ win.removeEventListener("eip6963:announceProvider", handleAnnouncement);
61074
+ for (const detail of anyWin.__eip6963Providers) {
61075
+ const rdns = detail.info?.rdns || "";
61076
+ let name = detail.info?.name || "Wallet";
61077
+ if (rdns.includes("metamask")) name = "MetaMask";
61078
+ else if (rdns.includes("phantom")) name = "Phantom";
61079
+ else if (rdns.includes("coinbase")) name = "Coinbase";
61080
+ else if (rdns.includes("rabby")) name = "Rabby";
61081
+ else if (rdns.includes("rainbow")) name = "Rainbow";
61082
+ else if (rdns.includes("okx")) name = "OKX Wallet";
61083
+ else if (rdns.includes("trust")) name = "Trust Wallet";
61084
+ add(detail.provider, name);
61085
+ }
61086
+ if (evmProviders.length === 0) {
61087
+ add(anyWin.phantom?.ethereum, "Phantom");
61088
+ add(anyWin.coinbaseWalletExtension, "Coinbase");
61089
+ add(anyWin.trustwallet?.ethereum, "Trust Wallet");
61090
+ add(anyWin.okxwallet, "OKX Wallet");
61091
+ if (evmProviders.length === 0 && win.ethereum) {
61092
+ const eth = win.ethereum;
61093
+ let name = "Wallet";
61094
+ if (eth.isMetaMask && !eth.isPhantom && !eth.isRabby) name = "MetaMask";
61095
+ else if (eth.isRabby) name = "Rabby";
61096
+ else if (eth.isRainbow) name = "Rainbow";
61097
+ else if (eth.isCoinbaseWallet) name = "Coinbase";
61098
+ add(eth, name);
61099
+ }
59939
61100
  }
59940
61101
  for (const { provider, name } of evmProviders) {
59941
61102
  try {
@@ -59988,12 +61149,9 @@ function WithdrawForm({
59988
61149
  estimatedProcessingTime,
59989
61150
  maxSlippagePercent,
59990
61151
  priceImpactPercent,
59991
- detectedWallet,
61152
+ senderAddress,
59992
61153
  sourceChainId,
59993
61154
  sourceTokenAddress,
59994
- isWalletMatch,
59995
- connectedWalletName,
59996
- canWithdraw,
59997
61155
  onWithdraw,
59998
61156
  onWithdrawError,
59999
61157
  onDepositWalletCreation,
@@ -60001,22 +61159,22 @@ function WithdrawForm({
60001
61159
  footerLeft
60002
61160
  }) {
60003
61161
  const { colors: colors2, fonts, components } = useTheme();
60004
- const [recipientAddress, setRecipientAddress] = (0, import_react29.useState)(recipientAddressProp || "");
60005
- const [amount, setAmount] = (0, import_react29.useState)("");
60006
- const [inputUnit, setInputUnit] = (0, import_react29.useState)("crypto");
60007
- const [isSubmitting, setIsSubmitting] = (0, import_react29.useState)(false);
60008
- const [submitError, setSubmitError] = (0, import_react29.useState)(null);
60009
- const [detailsExpanded, setDetailsExpanded] = (0, import_react29.useState)(false);
60010
- const [glossaryOpen, setGlossaryOpen] = (0, import_react29.useState)(false);
60011
- (0, import_react29.useEffect)(() => {
61162
+ const [recipientAddress, setRecipientAddress] = (0, import_react30.useState)(recipientAddressProp || "");
61163
+ const [amount, setAmount] = (0, import_react30.useState)("");
61164
+ const [inputUnit, setInputUnit] = (0, import_react30.useState)("crypto");
61165
+ const [isSubmitting, setIsSubmitting] = (0, import_react30.useState)(false);
61166
+ const [submitError, setSubmitError] = (0, import_react30.useState)(null);
61167
+ const [detailsExpanded, setDetailsExpanded] = (0, import_react30.useState)(false);
61168
+ const [glossaryOpen, setGlossaryOpen] = (0, import_react30.useState)(false);
61169
+ (0, import_react30.useEffect)(() => {
60012
61170
  setRecipientAddress(recipientAddressProp || "");
60013
61171
  setAmount("");
60014
61172
  setInputUnit("crypto");
60015
61173
  setSubmitError(null);
60016
61174
  }, [recipientAddressProp]);
60017
61175
  const trimmedAddress = recipientAddress.trim();
60018
- const [debouncedAddress, setDebouncedAddress] = (0, import_react29.useState)(trimmedAddress);
60019
- (0, import_react29.useEffect)(() => {
61176
+ const [debouncedAddress, setDebouncedAddress] = (0, import_react30.useState)(trimmedAddress);
61177
+ (0, import_react30.useEffect)(() => {
60020
61178
  const id = setTimeout(() => setDebouncedAddress(trimmedAddress), 500);
60021
61179
  return () => clearTimeout(id);
60022
61180
  }, [trimmedAddress]);
@@ -60033,7 +61191,7 @@ function WithdrawForm({
60033
61191
  enabled: debouncedAddress.length > 5 && !!selectedChain
60034
61192
  });
60035
61193
  const isDebouncing = trimmedAddress !== debouncedAddress;
60036
- const addressError = (0, import_react29.useMemo)(() => {
61194
+ const addressError = (0, import_react30.useMemo)(() => {
60037
61195
  if (!trimmedAddress || trimmedAddress.length <= 5) return null;
60038
61196
  if (isDebouncing || isVerifyingAddress) return null;
60039
61197
  if (verifyError) return t8.invalidAddress;
@@ -60047,47 +61205,47 @@ function WithdrawForm({
60047
61205
  return null;
60048
61206
  }, [trimmedAddress, isDebouncing, isVerifyingAddress, verifyError, addressVerification, selectedChain, selectedToken]);
60049
61207
  const isAddressValid = !isDebouncing && !!addressVerification?.valid && !addressError;
60050
- const exchangeRate = (0, import_react29.useMemo)(() => {
61208
+ const exchangeRate = (0, import_react30.useMemo)(() => {
60051
61209
  if (!balanceData?.exchangeRate) return 0;
60052
61210
  return parseFloat(balanceData.exchangeRate);
60053
61211
  }, [balanceData]);
60054
- const balanceCrypto = (0, import_react29.useMemo)(() => {
61212
+ const balanceCrypto = (0, import_react30.useMemo)(() => {
60055
61213
  if (!balanceData?.balanceHuman) return 0;
60056
61214
  return parseFloat(balanceData.balanceHuman);
60057
61215
  }, [balanceData]);
60058
- const balanceUsdNum = (0, import_react29.useMemo)(() => {
61216
+ const balanceUsdNum = (0, import_react30.useMemo)(() => {
60059
61217
  if (!balanceData?.balanceUsd) return 0;
60060
61218
  return parseFloat(balanceData.balanceUsd);
60061
61219
  }, [balanceData]);
60062
61220
  const tokenSymbol = sourceTokenSymbol || balanceData?.symbol || "TOKEN";
60063
61221
  const sourceDecimals = balanceData?.decimals ?? 6;
60064
- const cryptoAmountFromInput = (0, import_react29.useMemo)(() => {
61222
+ const cryptoAmountFromInput = (0, import_react30.useMemo)(() => {
60065
61223
  const val = parseFloat(amount);
60066
61224
  if (!val || val <= 0) return 0;
60067
61225
  if (inputUnit === "crypto") return val;
60068
61226
  return exchangeRate > 0 ? val / exchangeRate : 0;
60069
61227
  }, [amount, inputUnit, exchangeRate]);
60070
- const fiatAmountFromInput = (0, import_react29.useMemo)(() => {
61228
+ const fiatAmountFromInput = (0, import_react30.useMemo)(() => {
60071
61229
  const val = parseFloat(amount);
60072
61230
  if (!val || val <= 0) return 0;
60073
61231
  if (inputUnit === "fiat") return val;
60074
61232
  return val * exchangeRate;
60075
61233
  }, [amount, inputUnit, exchangeRate]);
60076
- const convertedDisplay = (0, import_react29.useMemo)(() => {
61234
+ const convertedDisplay = (0, import_react30.useMemo)(() => {
60077
61235
  if (!amount || parseFloat(amount) <= 0) return null;
60078
61236
  if (inputUnit === "crypto") {
60079
61237
  return `$${fiatAmountFromInput.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
60080
61238
  }
60081
61239
  return `${cryptoAmountFromInput.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 6 })} ${tokenSymbol}`;
60082
61240
  }, [amount, inputUnit, fiatAmountFromInput, cryptoAmountFromInput, tokenSymbol]);
60083
- const balanceDisplay = (0, import_react29.useMemo)(() => {
61241
+ const balanceDisplay = (0, import_react30.useMemo)(() => {
60084
61242
  if (isLoadingBalance || !balanceData) return null;
60085
61243
  if (inputUnit === "crypto") {
60086
61244
  return `${balanceCrypto.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })} ${tokenSymbol}`;
60087
61245
  }
60088
61246
  return `$${balanceUsdNum.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
60089
61247
  }, [isLoadingBalance, balanceData, inputUnit, balanceCrypto, balanceUsdNum, tokenSymbol]);
60090
- const handleSwitchUnit = (0, import_react29.useCallback)(() => {
61248
+ const handleSwitchUnit = (0, import_react30.useCallback)(() => {
60091
61249
  const val = parseFloat(amount);
60092
61250
  if (!val || val <= 0 || exchangeRate <= 0) {
60093
61251
  setInputUnit((u) => u === "crypto" ? "fiat" : "crypto");
@@ -60104,7 +61262,7 @@ function WithdrawForm({
60104
61262
  setInputUnit("crypto");
60105
61263
  }
60106
61264
  }, [amount, inputUnit, exchangeRate, sourceDecimals]);
60107
- const handleMaxClick = (0, import_react29.useCallback)(() => {
61265
+ const handleMaxClick = (0, import_react30.useCallback)(() => {
60108
61266
  if (inputUnit === "crypto") {
60109
61267
  if (balanceCrypto <= 0) return;
60110
61268
  setAmount(balanceData?.balanceHuman ?? "0");
@@ -60116,7 +61274,7 @@ function WithdrawForm({
60116
61274
  const isBelowMinimum = minimumWithdrawAmountUsd !== null && fiatAmountFromInput > 0 && fiatAmountFromInput < minimumWithdrawAmountUsd;
60117
61275
  const isOverBalance = inputUnit === "crypto" ? cryptoAmountFromInput > 0 && balanceCrypto > 0 && cryptoAmountFromInput > balanceCrypto : fiatAmountFromInput > 0 && balanceUsdNum > 0 && fiatAmountFromInput > balanceUsdNum;
60118
61276
  const isFormValid = trimmedAddress.length > 0 && amount.trim().length > 0 && cryptoAmountFromInput > 0 && isAddressValid && !isBelowMinimum && !isOverBalance && !!balanceData;
60119
- const handleWithdraw = (0, import_react29.useCallback)(async () => {
61277
+ const handleWithdraw = (0, import_react30.useCallback)(async () => {
60120
61278
  if (!selectedToken || !selectedChain) return;
60121
61279
  if (!isFormValid) return;
60122
61280
  setIsSubmitting(true);
@@ -60128,12 +61286,43 @@ function WithdrawForm({
60128
61286
  destinationTokenAddress: selectedChain.token_address,
60129
61287
  recipientAddress: trimmedAddress
60130
61288
  });
60131
- const amountBaseUnit = computeBaseUnit(
61289
+ let amountBaseUnit = computeBaseUnit(
60132
61290
  balanceData.balanceBaseUnit,
60133
61291
  parseFloat(amount),
60134
61292
  inputUnit === "crypto" ? balanceCrypto : balanceUsdNum
60135
61293
  );
60136
- const humanAmount = toSafeDecimalString(cryptoAmountFromInput, sourceDecimals);
61294
+ let humanAmount = toSafeDecimalString(cryptoAmountFromInput, sourceDecimals);
61295
+ if (isHypercoreChain(sourceChainId)) {
61296
+ try {
61297
+ const check = await checkHypercoreActivation(
61298
+ {
61299
+ source_address: senderAddress,
61300
+ recipient_address: depositWallet.address
61301
+ },
61302
+ publishableKey
61303
+ );
61304
+ if (!check.user_exists) {
61305
+ const fee = check.activation_fee;
61306
+ const maxSendable = balanceCrypto - fee;
61307
+ if (maxSendable <= 0) {
61308
+ throw new Error(
61309
+ `Insufficient balance. A ${fee} USDC activation fee is required for the first transfer to this address.`
61310
+ );
61311
+ }
61312
+ const requestedAmount = parseFloat(humanAmount);
61313
+ if (requestedAmount > maxSendable) {
61314
+ humanAmount = toSafeDecimalString(maxSendable, sourceDecimals);
61315
+ amountBaseUnit = computeBaseUnit(
61316
+ balanceData.balanceBaseUnit,
61317
+ maxSendable,
61318
+ balanceCrypto
61319
+ );
61320
+ }
61321
+ }
61322
+ } catch (e) {
61323
+ if (e instanceof Error && e.message.includes("activation fee")) throw e;
61324
+ }
61325
+ }
60137
61326
  const txInfo = {
60138
61327
  sourceChainType,
60139
61328
  sourceChainId,
@@ -60148,33 +61337,67 @@ function WithdrawForm({
60148
61337
  withdrawIntentAddress: depositWallet.address,
60149
61338
  recipientAddress: trimmedAddress
60150
61339
  };
60151
- if (detectedWallet) {
60152
- if (detectedWallet.chainFamily === "evm") {
60153
- await sendEvmWithdraw({
60154
- provider: detectedWallet.provider,
60155
- fromAddress: detectedWallet.address,
60156
- depositWalletAddress: depositWallet.address,
60157
- sourceTokenAddress,
61340
+ const wallet = await detectBrowserWallet(sourceChainType, senderAddress);
61341
+ console.log("browser wallet", wallet);
61342
+ if (wallet) {
61343
+ try {
61344
+ if (wallet.chainFamily === "evm" && isHypercoreChain(sourceChainId)) {
61345
+ await sendHypercoreWithdraw({
61346
+ provider: wallet.provider,
61347
+ fromAddress: wallet.address,
61348
+ depositWalletAddress: depositWallet.address,
61349
+ sourceTokenAddress,
61350
+ amount: humanAmount,
61351
+ tokenSymbol,
61352
+ publishableKey
61353
+ });
61354
+ } else if (wallet.chainFamily === "evm") {
61355
+ await sendEvmWithdraw({
61356
+ provider: wallet.provider,
61357
+ fromAddress: wallet.address,
61358
+ depositWalletAddress: depositWallet.address,
61359
+ sourceTokenAddress,
61360
+ sourceChainId,
61361
+ amountBaseUnit
61362
+ });
61363
+ } else if (wallet.chainFamily === "solana") {
61364
+ await sendSolanaWithdraw({
61365
+ provider: wallet.provider,
61366
+ fromAddress: wallet.address,
61367
+ depositWalletAddress: depositWallet.address,
61368
+ sourceTokenAddress,
61369
+ amountBaseUnit,
61370
+ publishableKey
61371
+ });
61372
+ }
61373
+ } catch (walletErr) {
61374
+ console.error("[Unifold] Browser wallet send failed:", walletErr, {
61375
+ wallet: `${wallet.name} (${wallet.chainFamily})`,
60158
61376
  sourceChainId,
60159
- amountBaseUnit
60160
- });
60161
- } else if (detectedWallet.chainFamily === "solana") {
60162
- await sendSolanaWithdraw({
60163
- provider: detectedWallet.provider,
60164
- fromAddress: detectedWallet.address,
60165
- depositWalletAddress: depositWallet.address,
60166
- sourceTokenAddress,
61377
+ amount: humanAmount,
60167
61378
  amountBaseUnit,
60168
- publishableKey
61379
+ depositWallet: depositWallet.address
60169
61380
  });
61381
+ throw walletErr;
60170
61382
  }
60171
61383
  } else if (onWithdraw) {
60172
- await onWithdraw(txInfo);
61384
+ try {
61385
+ await onWithdraw(txInfo);
61386
+ } catch (callbackErr) {
61387
+ console.error("[Unifold] onWithdraw callback failed:", callbackErr, {
61388
+ sourceChainId,
61389
+ amount: humanAmount,
61390
+ amountBaseUnit,
61391
+ depositWallet: depositWallet.address
61392
+ });
61393
+ throw callbackErr;
61394
+ }
60173
61395
  } else {
60174
61396
  throw new Error("No withdrawal method available. Please connect a wallet.");
60175
61397
  }
60176
61398
  onWithdrawSubmitted?.(txInfo);
60177
61399
  } catch (err) {
61400
+ console.error("[Unifold] Withdrawal failed:", err);
60178
61401
  const raw = err instanceof Error ? err.message : "Withdrawal failed. Please try again.";
60179
61402
  setSubmitError(raw.length > 120 ? "Withdrawal failed. Please try again." : raw);
60180
61403
  onWithdrawError?.({
@@ -60185,10 +61408,10 @@ function WithdrawForm({
60185
61408
  } finally {
60186
61409
  setIsSubmitting(false);
60187
61410
  }
60188
- }, [selectedToken, selectedChain, isFormValid, cryptoAmountFromInput, sourceDecimals, trimmedAddress, publishableKey, onWithdraw, detectedWallet, sourceTokenAddress, sourceChainId, onWithdrawError, onDepositWalletCreation, onWithdrawSubmitted, amount, inputUnit, balanceCrypto, balanceUsdNum, balanceData]);
60189
- return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(import_jsx_runtime72.Fragment, { children: [
60190
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
60191
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61411
+ }, [selectedToken, selectedChain, isFormValid, cryptoAmountFromInput, sourceDecimals, trimmedAddress, publishableKey, onWithdraw, sourceChainType, senderAddress, sourceTokenAddress, sourceChainId, onWithdrawError, onDepositWalletCreation, onWithdrawSubmitted, amount, inputUnit, balanceCrypto, balanceUsdNum, balanceData]);
61412
+ return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
61413
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { children: [
61414
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60192
61415
  "div",
60193
61416
  {
60194
61417
  className: "uf-text-xs uf-mb-1.5",
@@ -60196,7 +61419,7 @@ function WithdrawForm({
60196
61419
  children: t8.recipientAddress
60197
61420
  }
60198
61421
  ),
60199
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61422
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60200
61423
  "style",
60201
61424
  {
60202
61425
  dangerouslySetInnerHTML: {
@@ -60204,7 +61427,7 @@ function WithdrawForm({
60204
61427
  }
60205
61428
  }
60206
61429
  ),
60207
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
61430
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
60208
61431
  "div",
60209
61432
  {
60210
61433
  className: "uf-flex uf-items-center uf-gap-1 uf-pr-2",
@@ -60214,7 +61437,7 @@ function WithdrawForm({
60214
61437
  border: `${components.input.borderWidth}px solid ${addressError ? colors2.error : components.input.borderColor}`
60215
61438
  },
60216
61439
  children: [
60217
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61440
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60218
61441
  "input",
60219
61442
  {
60220
61443
  type: "text",
@@ -60231,7 +61454,7 @@ function WithdrawForm({
60231
61454
  }
60232
61455
  }
60233
61456
  ),
60234
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61457
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60235
61458
  "button",
60236
61459
  {
60237
61460
  type: "button",
@@ -60248,27 +61471,27 @@ function WithdrawForm({
60248
61471
  className: "uf-flex-shrink-0 uf-p-1 uf-rounded uf-transition-colors hover:uf-opacity-70",
60249
61472
  style: { color: colors2.foregroundMuted },
60250
61473
  title: "Paste from clipboard",
60251
- children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ClipboardPaste, { className: "uf-w-4 uf-h-4" })
61474
+ children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ClipboardPaste, { className: "uf-w-4 uf-h-4" })
60252
61475
  }
60253
61476
  )
60254
61477
  ]
60255
61478
  }
60256
61479
  ),
60257
- (isDebouncing || isVerifyingAddress) && trimmedAddress.length > 5 && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
60258
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(LoaderCircle, { className: "uf-w-3 uf-h-3 uf-animate-spin", style: { color: colors2.foregroundMuted } }),
60259
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: t8.verifyingAddress })
61480
+ (isDebouncing || isVerifyingAddress) && trimmedAddress.length > 5 && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
61481
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(LoaderCircle, { className: "uf-w-3 uf-h-3 uf-animate-spin", style: { color: colors2.foregroundMuted } }),
61482
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: t8.verifyingAddress })
60260
61483
  ] }),
60261
- addressError && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
60262
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(TriangleAlert, { className: "uf-w-3 uf-h-3", style: { color: colors2.error } }),
60263
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs", style: { color: colors2.error, fontFamily: fonts.regular }, children: addressError })
61484
+ addressError && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
61485
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(TriangleAlert, { className: "uf-w-3 uf-h-3", style: { color: colors2.error } }),
61486
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "uf-text-xs", style: { color: colors2.error, fontFamily: fonts.regular }, children: addressError })
60264
61487
  ] })
60265
61488
  ] }),
60266
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
60267
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-text-xs uf-mb-1.5", style: { color: components.card.labelColor, fontFamily: fonts.medium }, children: [
61489
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { children: [
61490
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-text-xs uf-mb-1.5", style: { color: components.card.labelColor, fontFamily: fonts.medium }, children: [
60268
61491
  t8.amount,
60269
- minimumWithdrawAmountUsd != null && minimumWithdrawAmountUsd > 0 && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { style: { color: colors2.warning, fontFamily: fonts.regular }, children: ` ($${minimumWithdrawAmountUsd.toFixed(2)} min)` })
61492
+ minimumWithdrawAmountUsd != null && minimumWithdrawAmountUsd > 0 && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { style: { color: colors2.warning, fontFamily: fonts.regular }, children: ` ($${minimumWithdrawAmountUsd.toFixed(2)} min)` })
60270
61493
  ] }),
60271
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61494
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60272
61495
  "style",
60273
61496
  {
60274
61497
  dangerouslySetInnerHTML: {
@@ -60276,7 +61499,7 @@ function WithdrawForm({
60276
61499
  }
60277
61500
  }
60278
61501
  ),
60279
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
61502
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
60280
61503
  "div",
60281
61504
  {
60282
61505
  className: "uf-flex uf-items-center uf-gap-2 uf-px-3 uf-py-2.5",
@@ -60286,7 +61509,7 @@ function WithdrawForm({
60286
61509
  border: `${components.input.borderWidth}px solid ${components.input.borderColor}`
60287
61510
  },
60288
61511
  children: [
60289
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61512
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60290
61513
  "input",
60291
61514
  {
60292
61515
  type: "text",
@@ -60307,8 +61530,8 @@ function WithdrawForm({
60307
61530
  }
60308
61531
  }
60309
61532
  ),
60310
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-sm uf-shrink-0", style: { color: colors2.foregroundMuted, fontFamily: fonts.medium }, children: inputUnit === "crypto" ? tokenSymbol : "USD" }),
60311
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61533
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "uf-text-sm uf-shrink-0", style: { color: colors2.foregroundMuted, fontFamily: fonts.medium }, children: inputUnit === "crypto" ? tokenSymbol : "USD" }),
61534
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60312
61535
  "button",
60313
61536
  {
60314
61537
  type: "button",
@@ -60321,10 +61544,10 @@ function WithdrawForm({
60321
61544
  ]
60322
61545
  }
60323
61546
  ),
60324
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-mt-1.5 uf-px-3", children: [
60325
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
60326
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: convertedDisplay || (inputUnit === "crypto" ? "$0.00" : `0.00 ${tokenSymbol}`) }),
60327
- exchangeRate > 0 && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61547
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-mt-1.5 uf-px-3", children: [
61548
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
61549
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: convertedDisplay || (inputUnit === "crypto" ? "$0.00" : `0.00 ${tokenSymbol}`) }),
61550
+ exchangeRate > 0 && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60328
61551
  "button",
60329
61552
  {
60330
61553
  type: "button",
@@ -60332,49 +61555,49 @@ function WithdrawForm({
60332
61555
  className: "uf-p-0.5 uf-rounded uf-transition-colors hover:uf-opacity-70",
60333
61556
  style: { color: colors2.foregroundMuted },
60334
61557
  title: "Switch unit",
60335
- children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ArrowUpDown, { className: "uf-w-3 uf-h-3" })
61558
+ children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ArrowUpDown, { className: "uf-w-3 uf-h-3" })
60336
61559
  }
60337
61560
  )
60338
61561
  ] }),
60339
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
60340
- balanceDisplay && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: [
61562
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { children: [
61563
+ balanceDisplay && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: [
60341
61564
  t8.balance,
60342
61565
  ": ",
60343
61566
  balanceDisplay
60344
61567
  ] }),
60345
- isLoadingBalance && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: "uf-h-3 uf-w-16 uf-bg-muted uf-rounded uf-animate-pulse" })
61568
+ isLoadingBalance && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "uf-h-3 uf-w-16 uf-bg-muted uf-rounded uf-animate-pulse" })
60346
61569
  ] })
60347
61570
  ] })
60348
61571
  ] }),
60349
- /* @__PURE__ */ (0, import_jsx_runtime72.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: [
60350
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
61572
+ /* @__PURE__ */ (0, import_jsx_runtime73.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: [
61573
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
60351
61574
  "button",
60352
61575
  {
60353
61576
  type: "button",
60354
61577
  onClick: () => setDetailsExpanded(!detailsExpanded),
60355
61578
  className: "uf-w-full uf-flex uf-items-center uf-justify-between uf-py-2.5",
60356
61579
  children: [
60357
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
60358
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Clock, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
60359
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
61580
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
61581
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Clock, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
61582
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
60360
61583
  tCrypto.processingTime.label,
60361
61584
  ":",
60362
61585
  " ",
60363
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: formatProcessingTime2(estimatedProcessingTime) })
61586
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: formatProcessingTime2(estimatedProcessingTime) })
60364
61587
  ] })
60365
61588
  ] }),
60366
- detailsExpanded ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ChevronUp, { className: "uf-w-4 uf-h-4", style: { color: components.card.actionColor } }) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ChevronDown, { className: "uf-w-4 uf-h-4", style: { color: components.card.actionColor } })
61589
+ detailsExpanded ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ChevronUp, { className: "uf-w-4 uf-h-4", style: { color: components.card.actionColor } }) : /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ChevronDown, { className: "uf-w-4 uf-h-4", style: { color: components.card.actionColor } })
60367
61590
  ]
60368
61591
  }
60369
61592
  ),
60370
- detailsExpanded && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-pb-3 uf-space-y-2.5", children: [
60371
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
60372
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ShieldCheck, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
60373
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
61593
+ detailsExpanded && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-pb-3 uf-space-y-2.5", children: [
61594
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
61595
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ShieldCheck, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
61596
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
60374
61597
  tCrypto.slippage.label,
60375
61598
  ":",
60376
61599
  " ",
60377
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
61600
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
60378
61601
  tCrypto.slippage.auto,
60379
61602
  " \u2022 ",
60380
61603
  (maxSlippagePercent ?? 0.25).toFixed(2),
@@ -60382,13 +61605,13 @@ function WithdrawForm({
60382
61605
  ] })
60383
61606
  ] })
60384
61607
  ] }),
60385
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
60386
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DollarSign, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
60387
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
61608
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
61609
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "uf-rounded-full uf-p-1", style: { backgroundColor: components.card.iconBackgroundColor }, children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(DollarSign, { className: "uf-w-3 uf-h-3", style: { color: components.card.iconColor } }) }),
61610
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
60388
61611
  tCrypto.priceImpact.label,
60389
61612
  ":",
60390
61613
  " ",
60391
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
61614
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
60392
61615
  (priceImpactPercent ?? 0).toFixed(2),
60393
61616
  "%"
60394
61617
  ] })
@@ -60396,23 +61619,12 @@ function WithdrawForm({
60396
61619
  ] })
60397
61620
  ] })
60398
61621
  ] }),
60399
- !canWithdraw && !submitError && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
60400
- "div",
60401
- {
60402
- className: "uf-flex uf-items-start uf-gap-2.5 uf-p-3 uf-rounded-xl",
60403
- style: { backgroundColor: colors2.card, border: `1px solid ${colors2.border}` },
60404
- children: [
60405
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Wallet, { className: "uf-w-4 uf-h-4 uf-flex-shrink-0 uf-mt-0.5", style: { color: colors2.warning } }),
60406
- /* @__PURE__ */ (0, import_jsx_runtime72.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." })
60407
- ]
60408
- }
60409
- ),
60410
- isWalletMatch && connectedWalletName ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61622
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60411
61623
  "button",
60412
61624
  {
60413
61625
  type: "button",
60414
61626
  onClick: handleWithdraw,
60415
- disabled: !isFormValid || !canWithdraw || isSubmitting || !selectedToken || !selectedChain,
61627
+ disabled: !isFormValid || isSubmitting || !selectedToken || !selectedChain,
60416
61628
  className: "uf-w-full uf-py-3 uf-text-sm uf-font-medium uf-transition-colors disabled:uf-opacity-50 disabled:uf-cursor-not-allowed uf-flex uf-items-center uf-justify-center uf-gap-2",
60417
61629
  style: {
60418
61630
  backgroundColor: colors2.primary,
@@ -60421,40 +61633,20 @@ function WithdrawForm({
60421
61633
  borderRadius: components.button.borderRadius,
60422
61634
  border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
60423
61635
  },
60424
- children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(import_jsx_runtime72.Fragment, { children: [
60425
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
61636
+ children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
61637
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
60426
61638
  "Processing..."
60427
- ] }) : isOverBalance ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_jsx_runtime72.Fragment, { children: "Insufficient balance" }) : isBelowMinimum ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_jsx_runtime72.Fragment, { children: "Minimum amount not met" }) : submitError ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_jsx_runtime72.Fragment, { children: "Withdrawal failed. Try again" }) : /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(import_jsx_runtime72.Fragment, { children: [
60428
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Wallet, { className: "uf-w-4 uf-h-4" }),
60429
- "Withdraw from ",
60430
- connectedWalletName
61639
+ ] }) : isOverBalance ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_jsx_runtime73.Fragment, { children: "Insufficient balance" }) : isBelowMinimum ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_jsx_runtime73.Fragment, { children: "Minimum amount not met" }) : submitError ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_jsx_runtime73.Fragment, { children: "Withdrawal failed. Try again" }) : /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
61640
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Wallet, { className: "uf-w-4 uf-h-4" }),
61641
+ t8.withdraw
60431
61642
  ] })
60432
61643
  }
60433
- ) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
60434
- "button",
60435
- {
60436
- type: "button",
60437
- onClick: handleWithdraw,
60438
- disabled: !isFormValid || !canWithdraw || isSubmitting || !selectedToken || !selectedChain,
60439
- className: "uf-w-full uf-py-3 uf-text-sm uf-font-medium uf-transition-colors disabled:uf-opacity-50 disabled:uf-cursor-not-allowed",
60440
- style: {
60441
- backgroundColor: colors2.primary,
60442
- color: colors2.primaryForeground,
60443
- fontFamily: fonts.medium,
60444
- borderRadius: components.button.borderRadius,
60445
- border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
60446
- },
60447
- children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2", children: [
60448
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
60449
- "Processing..."
60450
- ] }) : isOverBalance ? "Insufficient balance" : isBelowMinimum ? "Minimum amount not met" : submitError ? "Withdrawal failed. Try again" : t8.withdraw
60451
- }
60452
61644
  ),
60453
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-text-xs uf-pt-1", children: [
60454
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { children: footerLeft }),
60455
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DepositFooterLinks, { onGlossaryClick: () => setGlossaryOpen(true) })
61645
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-text-xs uf-pt-1", children: [
61646
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { children: footerLeft }),
61647
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(DepositFooterLinks, { onGlossaryClick: () => setGlossaryOpen(true) })
60456
61648
  ] }),
60457
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61649
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60458
61650
  GlossaryModal,
60459
61651
  {
60460
61652
  open: glossaryOpen,
@@ -60500,7 +61692,7 @@ function WithdrawExecutionItem({
60500
61692
  return "$0.00";
60501
61693
  }
60502
61694
  };
60503
- return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
61695
+ return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
60504
61696
  "button",
60505
61697
  {
60506
61698
  onClick,
@@ -60511,8 +61703,8 @@ function WithdrawExecutionItem({
60511
61703
  border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
60512
61704
  },
60513
61705
  children: [
60514
- /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-relative uf-flex-shrink-0 uf-w-9 uf-h-9", children: [
60515
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61706
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "uf-relative uf-flex-shrink-0 uf-w-9 uf-h-9", children: [
61707
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60516
61708
  "img",
60517
61709
  {
60518
61710
  src: execution.destination_token_metadata?.icon_url || getIconUrl("/icons/tokens/svg/usdc.svg"),
@@ -60523,12 +61715,12 @@ function WithdrawExecutionItem({
60523
61715
  className: "uf-rounded-full uf-w-9 uf-h-9"
60524
61716
  }
60525
61717
  ),
60526
- isPending ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61718
+ isPending ? /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60527
61719
  "div",
60528
61720
  {
60529
61721
  className: "uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-rounded-full uf-p-0.5",
60530
61722
  style: { backgroundColor: colors2.warning },
60531
- children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61723
+ children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60532
61724
  "svg",
60533
61725
  {
60534
61726
  width: "10",
@@ -60536,7 +61728,7 @@ function WithdrawExecutionItem({
60536
61728
  viewBox: "0 0 12 12",
60537
61729
  fill: "none",
60538
61730
  className: "uf-animate-spin uf-block",
60539
- children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61731
+ children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60540
61732
  "path",
60541
61733
  {
60542
61734
  d: "M6 1V3M6 9V11M1 6H3M9 6H11M2.5 2.5L4 4M8 8L9.5 9.5M2.5 9.5L4 8M8 4L9.5 2.5",
@@ -60548,12 +61740,12 @@ function WithdrawExecutionItem({
60548
61740
  }
60549
61741
  )
60550
61742
  }
60551
- ) : /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61743
+ ) : /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60552
61744
  "div",
60553
61745
  {
60554
61746
  className: "uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-rounded-full uf-p-0.5",
60555
61747
  style: { backgroundColor: colors2.success },
60556
- children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61748
+ children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60557
61749
  "svg",
60558
61750
  {
60559
61751
  width: "10",
@@ -60561,7 +61753,7 @@ function WithdrawExecutionItem({
60561
61753
  viewBox: "0 0 12 12",
60562
61754
  fill: "none",
60563
61755
  className: "uf-block",
60564
- children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61756
+ children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60565
61757
  "path",
60566
61758
  {
60567
61759
  d: "M10 3L4.5 8.5L2 6",
@@ -60576,8 +61768,8 @@ function WithdrawExecutionItem({
60576
61768
  }
60577
61769
  )
60578
61770
  ] }),
60579
- /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex-1 uf-min-w-0", children: [
60580
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61771
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "uf-flex-1 uf-min-w-0", children: [
61772
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60581
61773
  "h3",
60582
61774
  {
60583
61775
  className: "uf-font-medium uf-text-sm uf-leading-tight",
@@ -60588,7 +61780,7 @@ function WithdrawExecutionItem({
60588
61780
  children: isPending ? "Withdrawal processing" : "Withdrawal completed"
60589
61781
  }
60590
61782
  ),
60591
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61783
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60592
61784
  "p",
60593
61785
  {
60594
61786
  className: "uf-text-xs uf-leading-tight",
@@ -60600,7 +61792,7 @@ function WithdrawExecutionItem({
60600
61792
  }
60601
61793
  )
60602
61794
  ] }),
60603
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61795
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60604
61796
  "span",
60605
61797
  {
60606
61798
  className: "uf-font-medium uf-text-sm uf-flex-shrink-0",
@@ -60611,7 +61803,7 @@ function WithdrawExecutionItem({
60611
61803
  children: formatUsdAmount2(execution.source_amount_usd || "0")
60612
61804
  }
60613
61805
  ),
60614
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61806
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60615
61807
  ChevronRight,
60616
61808
  {
60617
61809
  className: "uf-w-4 uf-h-4 uf-flex-shrink-0",
@@ -60634,9 +61826,9 @@ function WithdrawConfirmingView({
60634
61826
  onViewTracker
60635
61827
  }) {
60636
61828
  const { colors: colors2, fonts, components } = useTheme();
60637
- const [showButton, setShowButton] = (0, import_react30.useState)(false);
61829
+ const [showButton, setShowButton] = (0, import_react31.useState)(false);
60638
61830
  const latestExecution = executions.length > 0 ? executions[executions.length - 1] : null;
60639
- (0, import_react30.useEffect)(() => {
61831
+ (0, import_react31.useEffect)(() => {
60640
61832
  if (latestExecution) return;
60641
61833
  const timer = setTimeout(() => setShowButton(true), SHOW_BUTTON_DELAY_MS);
60642
61834
  return () => clearTimeout(timer);
@@ -60644,11 +61836,11 @@ function WithdrawConfirmingView({
60644
61836
  const btnRadius = components.button.borderRadius;
60645
61837
  const btnBorder = `${components.button.borderWidth}px solid ${components.button.borderColor}`;
60646
61838
  if (latestExecution) {
60647
- return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
60648
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DepositHeader, { title: "Withdrawal Details", showClose: true, onClose }),
60649
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DepositDetailContent, { execution: latestExecution, variant: "withdraw" }),
60650
- /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "uf-flex uf-gap-2 uf-px-2 uf-pt-2", children: [
60651
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61839
+ return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
61840
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal Details", showClose: true, onClose }),
61841
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositDetailContent, { execution: latestExecution, variant: "withdraw" }),
61842
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "uf-flex uf-gap-2 uf-px-2 uf-pt-2", children: [
61843
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60652
61844
  "button",
60653
61845
  {
60654
61846
  type: "button",
@@ -60664,7 +61856,7 @@ function WithdrawConfirmingView({
60664
61856
  children: "Withdrawal History"
60665
61857
  }
60666
61858
  ),
60667
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61859
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60668
61860
  "button",
60669
61861
  {
60670
61862
  type: "button",
@@ -60681,7 +61873,7 @@ function WithdrawConfirmingView({
60681
61873
  }
60682
61874
  )
60683
61875
  ] }),
60684
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61876
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60685
61877
  PoweredByUnifold,
60686
61878
  {
60687
61879
  color: colors2.foregroundMuted,
@@ -60690,15 +61882,15 @@ function WithdrawConfirmingView({
60690
61882
  ) })
60691
61883
  ] });
60692
61884
  }
60693
- return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
60694
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DepositHeader, { title: "Withdrawal Status", showClose: true, onClose }),
60695
- /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-16 uf-px-4", children: [
60696
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61885
+ return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
61886
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal Status", showClose: true, onClose }),
61887
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-16 uf-px-4", children: [
61888
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60697
61889
  "div",
60698
61890
  {
60699
61891
  className: "uf-w-20 uf-h-20 uf-rounded-full uf-flex uf-items-center uf-justify-center uf-mb-6",
60700
61892
  style: { backgroundColor: `${colors2.primary}20` },
60701
- children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61893
+ children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60702
61894
  "svg",
60703
61895
  {
60704
61896
  width: "40",
@@ -60706,7 +61898,7 @@ function WithdrawConfirmingView({
60706
61898
  viewBox: "0 0 24 24",
60707
61899
  fill: "none",
60708
61900
  className: "uf-animate-spin",
60709
- children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61901
+ children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60710
61902
  "path",
60711
61903
  {
60712
61904
  d: "M21 12a9 9 0 1 1-6.22-8.56",
@@ -60719,7 +61911,7 @@ function WithdrawConfirmingView({
60719
61911
  )
60720
61912
  }
60721
61913
  ),
60722
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61914
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60723
61915
  "h3",
60724
61916
  {
60725
61917
  className: "uf-text-xl uf-mb-2",
@@ -60727,7 +61919,7 @@ function WithdrawConfirmingView({
60727
61919
  children: "Checking Withdrawal"
60728
61920
  }
60729
61921
  ),
60730
- /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
61922
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
60731
61923
  "p",
60732
61924
  {
60733
61925
  className: "uf-text-sm uf-text-center",
@@ -60743,7 +61935,7 @@ function WithdrawConfirmingView({
60743
61935
  }
60744
61936
  )
60745
61937
  ] }),
60746
- showButton && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "uf-px-1 uf-pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61938
+ showButton && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-px-1 uf-pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60747
61939
  "button",
60748
61940
  {
60749
61941
  type: "button",
@@ -60759,7 +61951,7 @@ function WithdrawConfirmingView({
60759
61951
  children: "Withdrawal History"
60760
61952
  }
60761
61953
  ) }),
60762
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61954
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60763
61955
  PoweredByUnifold,
60764
61956
  {
60765
61957
  color: colors2.foregroundMuted,
@@ -60789,14 +61981,14 @@ function WithdrawModal({
60789
61981
  hideOverlay = false
60790
61982
  }) {
60791
61983
  const { colors: colors2, fonts, components } = useTheme();
60792
- const [containerEl, setContainerEl] = (0, import_react27.useState)(null);
60793
- const containerCallbackRef = (0, import_react27.useCallback)((el) => {
61984
+ const [containerEl, setContainerEl] = (0, import_react28.useState)(null);
61985
+ const containerCallbackRef = (0, import_react28.useCallback)((el) => {
60794
61986
  setContainerEl(el);
60795
61987
  }, []);
60796
- const [resolvedTheme, setResolvedTheme] = (0, import_react27.useState)(
61988
+ const [resolvedTheme, setResolvedTheme] = (0, import_react28.useState)(
60797
61989
  theme === "auto" ? "dark" : theme
60798
61990
  );
60799
- (0, import_react27.useEffect)(() => {
61991
+ (0, import_react28.useEffect)(() => {
60800
61992
  if (theme === "auto") {
60801
61993
  const mq = window.matchMedia("(prefers-color-scheme: dark)");
60802
61994
  setResolvedTheme(mq.matches ? "dark" : "light");
@@ -60825,28 +62017,12 @@ function WithdrawModal({
60825
62017
  publishableKey,
60826
62018
  enabled: open
60827
62019
  });
60828
- const [selectedToken, setSelectedToken] = (0, import_react27.useState)(null);
60829
- const [selectedChain, setSelectedChain] = (0, import_react27.useState)(null);
60830
- const [detectedWallet, setDetectedWallet] = (0, import_react27.useState)(null);
60831
- const connectedWalletName = detectedWallet?.name ?? null;
60832
- const isWalletMatch = !!detectedWallet;
60833
- (0, import_react27.useEffect)(() => {
60834
- if (!senderAddress || !open) {
60835
- setDetectedWallet(null);
60836
- return;
60837
- }
60838
- let cancelled = false;
60839
- detectBrowserWallet(sourceChainType, senderAddress).then((wallet) => {
60840
- if (!cancelled) setDetectedWallet(wallet);
60841
- });
60842
- return () => {
60843
- cancelled = true;
60844
- };
60845
- }, [senderAddress, sourceChainType, open]);
60846
- const [view, setView] = (0, import_react27.useState)("form");
60847
- const [withdrawDepositWalletId, setWithdrawDepositWalletId] = (0, import_react27.useState)();
60848
- const [selectedExecution, setSelectedExecution] = (0, import_react27.useState)(null);
60849
- const [submittedTxInfo, setSubmittedTxInfo] = (0, import_react27.useState)(null);
62020
+ const [selectedToken, setSelectedToken] = (0, import_react28.useState)(null);
62021
+ const [selectedChain, setSelectedChain] = (0, import_react28.useState)(null);
62022
+ const [view, setView] = (0, import_react28.useState)("form");
62023
+ const [withdrawDepositWalletId, setWithdrawDepositWalletId] = (0, import_react28.useState)();
62024
+ const [selectedExecution, setSelectedExecution] = (0, import_react28.useState)(null);
62025
+ const [submittedTxInfo, setSubmittedTxInfo] = (0, import_react28.useState)(null);
60850
62026
  const { executions: realtimeExecutions } = useWithdrawPolling({
60851
62027
  userId: externalUserId,
60852
62028
  publishableKey,
@@ -60861,7 +62037,7 @@ function WithdrawModal({
60861
62037
  refetchInterval: view === "tracker" || view === "detail" ? 5e3 : 15e3
60862
62038
  });
60863
62039
  const allWithdrawals = allWithdrawalsData?.data ?? [];
60864
- const handleDepositWalletCreation = (0, import_react27.useCallback)(async (params) => {
62040
+ const handleDepositWalletCreation = (0, import_react28.useCallback)(async (params) => {
60865
62041
  const { data: wallets } = await createDepositAddress(
60866
62042
  {
60867
62043
  external_user_id: externalUserId,
@@ -60880,11 +62056,11 @@ function WithdrawModal({
60880
62056
  setWithdrawDepositWalletId(depositWallet.id);
60881
62057
  return depositWallet;
60882
62058
  }, [externalUserId, publishableKey, sourceChainType]);
60883
- const handleWithdrawSubmitted = (0, import_react27.useCallback)((txInfo) => {
62059
+ const handleWithdrawSubmitted = (0, import_react28.useCallback)((txInfo) => {
60884
62060
  setSubmittedTxInfo(txInfo);
60885
62061
  setView("confirming");
60886
62062
  }, []);
60887
- (0, import_react27.useEffect)(() => {
62063
+ (0, import_react28.useEffect)(() => {
60888
62064
  if (!destinationTokens.length || selectedToken) return;
60889
62065
  const first = destinationTokens[0];
60890
62066
  if (first?.chains.length > 0) {
@@ -60892,8 +62068,8 @@ function WithdrawModal({
60892
62068
  setSelectedChain(first.chains[0]);
60893
62069
  }
60894
62070
  }, [destinationTokens, selectedToken]);
60895
- const resetViewTimeoutRef = (0, import_react27.useRef)(null);
60896
- const handleClose = (0, import_react27.useCallback)(() => {
62071
+ const resetViewTimeoutRef = (0, import_react28.useRef)(null);
62072
+ const handleClose = (0, import_react28.useCallback)(() => {
60897
62073
  onOpenChange(false);
60898
62074
  if (resetViewTimeoutRef.current) clearTimeout(resetViewTimeoutRef.current);
60899
62075
  resetViewTimeoutRef.current = setTimeout(() => {
@@ -60906,7 +62082,7 @@ function WithdrawModal({
60906
62082
  resetViewTimeoutRef.current = null;
60907
62083
  }, 200);
60908
62084
  }, [onOpenChange]);
60909
- (0, import_react27.useLayoutEffect)(() => {
62085
+ (0, import_react28.useLayoutEffect)(() => {
60910
62086
  if (!open) return;
60911
62087
  if (resetViewTimeoutRef.current) {
60912
62088
  clearTimeout(resetViewTimeoutRef.current);
@@ -60919,26 +62095,25 @@ function WithdrawModal({
60919
62095
  setSubmittedTxInfo(null);
60920
62096
  setWithdrawDepositWalletId(void 0);
60921
62097
  }, [open]);
60922
- (0, import_react27.useEffect)(() => () => {
62098
+ (0, import_react28.useEffect)(() => () => {
60923
62099
  if (resetViewTimeoutRef.current) clearTimeout(resetViewTimeoutRef.current);
60924
62100
  }, []);
60925
- const handleTokenSymbolChange = (0, import_react27.useCallback)((symbol) => {
62101
+ const handleTokenSymbolChange = (0, import_react28.useCallback)((symbol) => {
60926
62102
  const tok = destinationTokens.find((t11) => t11.symbol === symbol);
60927
62103
  if (tok) {
60928
62104
  setSelectedToken(tok);
60929
62105
  if (tok.chains.length > 0) setSelectedChain(tok.chains[0]);
60930
62106
  }
60931
62107
  }, [destinationTokens]);
60932
- const handleChainKeyChange = (0, import_react27.useCallback)((chainKey) => {
62108
+ const handleChainKeyChange = (0, import_react28.useCallback)((chainKey) => {
60933
62109
  if (!selectedToken) return;
60934
62110
  const chain = selectedToken.chains.find((c) => getChainKey5(c.chain_id, c.chain_type) === chainKey);
60935
62111
  if (chain) setSelectedChain(chain);
60936
62112
  }, [selectedToken]);
60937
62113
  const isSourceSupported = sourceValidation?.isSupported ?? null;
60938
- const canWithdraw = !!onWithdraw || isWalletMatch;
60939
62114
  const isAnyLoading = tokensLoading || isCheckingSourceToken;
60940
- const withdrawPoweredByFooter = /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(PoweredByUnifold, { color: colors2.foregroundMuted, className: "uf-flex uf-justify-center uf-shrink-0" }) });
60941
- return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(PortalContainerProvider, { value: hideOverlay ? containerEl : null, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Dialog2, { open: hideOverlay || open, onOpenChange: hideOverlay ? void 0 : handleClose, modal: !hideOverlay, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
62115
+ const withdrawPoweredByFooter = /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(PoweredByUnifold, { color: colors2.foregroundMuted, className: "uf-flex uf-justify-center uf-shrink-0" }) });
62116
+ return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(PortalContainerProvider, { value: hideOverlay ? containerEl : null, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Dialog2, { open: hideOverlay || open, onOpenChange: hideOverlay ? void 0 : handleClose, modal: !hideOverlay, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
60942
62117
  DialogContent2,
60943
62118
  {
60944
62119
  ref: hideOverlay ? containerCallbackRef : void 0,
@@ -60947,7 +62122,7 @@ function WithdrawModal({
60947
62122
  style: { backgroundColor: colors2.background },
60948
62123
  onPointerDownOutside: (e) => e.preventDefault(),
60949
62124
  onInteractOutside: (e) => e.preventDefault(),
60950
- children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ThemeStyleInjector, { children: view === "confirming" && submittedTxInfo ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
62125
+ children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(ThemeStyleInjector, { children: view === "confirming" && submittedTxInfo ? /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
60951
62126
  WithdrawConfirmingView,
60952
62127
  {
60953
62128
  txInfo: submittedTxInfo,
@@ -60955,18 +62130,18 @@ function WithdrawModal({
60955
62130
  onClose: handleClose,
60956
62131
  onViewTracker: () => setView("tracker")
60957
62132
  }
60958
- ) : view === "detail" && selectedExecution ? /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
60959
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal Details", showBack: true, showClose: !hideOverlay, onBack: () => {
62133
+ ) : view === "detail" && selectedExecution ? /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
62134
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositHeader, { title: "Withdrawal Details", showBack: true, showClose: !hideOverlay, onBack: () => {
60960
62135
  setSelectedExecution(null);
60961
62136
  setView("tracker");
60962
62137
  }, onClose: handleClose }),
60963
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositDetailContent, { execution: selectedExecution, variant: "withdraw" }),
62138
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositDetailContent, { execution: selectedExecution, variant: "withdraw" }),
60964
62139
  withdrawPoweredByFooter
60965
62140
  ] }) : view === "tracker" ? (
60966
62141
  /* ---------- Tracker view: execution list ---------- */
60967
- /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
60968
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal History", showBack: true, showClose: !hideOverlay, onBack: () => setView("form"), onClose: handleClose }),
60969
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-flex uf-flex-col uf-gap-2", style: { minHeight: 200 }, children: allWithdrawals.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-flex uf-items-center uf-justify-center uf-py-8", children: /* @__PURE__ */ (0, import_jsx_runtime75.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_runtime75.jsx)(
62142
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
62143
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositHeader, { title: "Withdrawal History", showBack: true, showClose: !hideOverlay, onBack: () => setView("form"), onClose: handleClose }),
62144
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "uf-h-[460px] uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "uf-flex uf-flex-col uf-gap-2", children: allWithdrawals.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "uf-flex uf-items-center uf-justify-center uf-py-8", children: /* @__PURE__ */ (0, import_jsx_runtime76.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_runtime76.jsx)(
60970
62145
  WithdrawExecutionItem,
60971
62146
  {
60972
62147
  execution: ex,
@@ -60976,20 +62151,20 @@ function WithdrawModal({
60976
62151
  }
60977
62152
  },
60978
62153
  ex.id
60979
- )) }),
62154
+ )) }) }),
60980
62155
  withdrawPoweredByFooter
60981
62156
  ] })
60982
62157
  ) : (
60983
62158
  /* ---------- Form view (default) ---------- */
60984
- /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
60985
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: modalTitle || t9.title, showClose: !hideOverlay, onClose: handleClose }),
60986
- /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-3", children: [
60987
- isAnyLoading ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-space-y-3", children: [1, 2, 3].map((i) => /* @__PURE__ */ (0, import_jsx_runtime75.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_runtime75.jsx)("div", { className: "uf-bg-muted uf-rounded-lg uf-w-full uf-h-10" }) }, i)) }) : isSourceSupported === false ? /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
60988
- /* @__PURE__ */ (0, import_jsx_runtime75.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_runtime75.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
60989
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-mb-2", style: { color: colors2.foreground, fontFamily: fonts.medium }, children: "Unsupported Source Token" }),
60990
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("p", { className: "uf-text-sm uf-max-w-[280px]", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: sourceValidation?.errorMessage })
60991
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
60992
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
62159
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
62160
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositHeader, { title: modalTitle || t9.title, showClose: !hideOverlay, onClose: handleClose }),
62161
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-3", children: [
62162
+ isAnyLoading ? /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "uf-space-y-3", children: [1, 2, 3].map((i) => /* @__PURE__ */ (0, import_jsx_runtime76.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_runtime76.jsx)("div", { className: "uf-bg-muted uf-rounded-lg uf-w-full uf-h-10" }) }, i)) }) : isSourceSupported === false ? /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-justify-center uf-py-8 uf-px-4 uf-text-center", children: [
62163
+ /* @__PURE__ */ (0, import_jsx_runtime76.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_runtime76.jsx)(TriangleAlert, { className: "uf-w-8 uf-h-8 uf-text-muted-foreground" }) }),
62164
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("h3", { className: "uf-text-lg uf-font-semibold uf-mb-2", style: { color: colors2.foreground, fontFamily: fonts.medium }, children: "Unsupported Source Token" }),
62165
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("p", { className: "uf-text-sm uf-max-w-[280px]", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: sourceValidation?.errorMessage })
62166
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
62167
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
60993
62168
  WithdrawDoubleInput,
60994
62169
  {
60995
62170
  tokens: destinationTokens,
@@ -61000,7 +62175,7 @@ function WithdrawModal({
61000
62175
  isLoading: tokensLoading
61001
62176
  }
61002
62177
  ),
61003
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
62178
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
61004
62179
  WithdrawForm,
61005
62180
  {
61006
62181
  publishableKey,
@@ -61016,26 +62191,23 @@ function WithdrawModal({
61016
62191
  estimatedProcessingTime: sourceValidation?.estimatedProcessingTime ?? null,
61017
62192
  maxSlippagePercent: sourceValidation?.maxSlippagePercent ?? null,
61018
62193
  priceImpactPercent: sourceValidation?.priceImpactPercent ?? null,
61019
- detectedWallet,
62194
+ senderAddress,
61020
62195
  sourceChainId,
61021
62196
  sourceTokenAddress,
61022
- isWalletMatch,
61023
- connectedWalletName,
61024
- canWithdraw,
61025
62197
  onWithdraw,
61026
62198
  onWithdrawError,
61027
62199
  onDepositWalletCreation: handleDepositWalletCreation,
61028
62200
  onWithdrawSubmitted: handleWithdrawSubmitted,
61029
- footerLeft: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
62201
+ footerLeft: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
61030
62202
  "button",
61031
62203
  {
61032
62204
  onClick: () => setView("tracker"),
61033
62205
  className: "uf-flex uf-items-center uf-gap-1 uf-transition-colors hover:uf-opacity-70",
61034
62206
  style: { color: colors2.foregroundMuted },
61035
62207
  children: [
61036
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Clock, { className: "uf-w-3.5 uf-h-3.5" }),
62208
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Clock, { className: "uf-w-3.5 uf-h-3.5" }),
61037
62209
  "Withdrawal History",
61038
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ChevronRight, { className: "uf-w-3 uf-h-3" })
62210
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(ChevronRight, { className: "uf-w-3 uf-h-3" })
61039
62211
  ]
61040
62212
  }
61041
62213
  )
@@ -61059,6 +62231,10 @@ function UnifoldProvider2({
61059
62231
  const [depositConfig, setDepositConfig] = (0, import_react.useState)(
61060
62232
  null
61061
62233
  );
62234
+ const [isCheckoutOpen, setIsCheckoutOpen] = (0, import_react.useState)(false);
62235
+ const [checkoutConfig, setCheckoutConfig] = (0, import_react.useState)(
62236
+ null
62237
+ );
61062
62238
  const [isWithdrawOpen, setIsWithdrawOpen] = (0, import_react.useState)(false);
61063
62239
  const [withdrawConfig, setWithdrawConfig] = (0, import_react.useState)(
61064
62240
  null
@@ -61158,6 +62334,75 @@ function UnifoldProvider2({
61158
62334
  depositPromiseRef.current = null;
61159
62335
  }
61160
62336
  }, [depositConfig]);
62337
+ const checkoutPromiseRef = import_react.default.useRef(null);
62338
+ const checkoutConfigRef = import_react.default.useRef(null);
62339
+ checkoutConfigRef.current = checkoutConfig;
62340
+ const checkoutCloseTimeoutRef = import_react.default.useRef(null);
62341
+ const checkoutCloseGuardRef = import_react.default.useRef(false);
62342
+ const beginCheckout = (0, import_react.useCallback)((config2) => {
62343
+ if (checkoutCloseTimeoutRef.current) {
62344
+ clearTimeout(checkoutCloseTimeoutRef.current);
62345
+ checkoutCloseTimeoutRef.current = null;
62346
+ }
62347
+ checkoutCloseGuardRef.current = false;
62348
+ if (checkoutPromiseRef.current) {
62349
+ console.warn("[UnifoldProvider] A checkout is already in progress. Cancelling previous checkout.");
62350
+ checkoutPromiseRef.current.reject({
62351
+ message: "Checkout cancelled - new checkout started",
62352
+ code: "CHECKOUT_SUPERSEDED"
62353
+ });
62354
+ checkoutPromiseRef.current = null;
62355
+ }
62356
+ const promise = new Promise((resolve, reject) => {
62357
+ checkoutPromiseRef.current = { resolve, reject };
62358
+ });
62359
+ promise.catch(() => {
62360
+ });
62361
+ setCheckoutConfig(config2);
62362
+ setIsCheckoutOpen(true);
62363
+ return promise;
62364
+ }, []);
62365
+ const closeCheckout = (0, import_react.useCallback)(() => {
62366
+ if (checkoutCloseGuardRef.current) {
62367
+ return;
62368
+ }
62369
+ checkoutCloseGuardRef.current = true;
62370
+ const promiseToReject = checkoutPromiseRef.current;
62371
+ checkoutPromiseRef.current = null;
62372
+ if (checkoutConfigRef.current?.onClose) {
62373
+ checkoutConfigRef.current.onClose();
62374
+ }
62375
+ if (promiseToReject) {
62376
+ promiseToReject.reject({
62377
+ message: "Checkout cancelled by user",
62378
+ code: "CHECKOUT_CANCELLED"
62379
+ });
62380
+ }
62381
+ setIsCheckoutOpen(false);
62382
+ checkoutCloseTimeoutRef.current = setTimeout(() => {
62383
+ setCheckoutConfig(null);
62384
+ checkoutCloseTimeoutRef.current = null;
62385
+ }, 200);
62386
+ }, []);
62387
+ const handleCheckoutSuccess = (0, import_react.useCallback)((data) => {
62388
+ if (checkoutConfig?.onSuccess) {
62389
+ checkoutConfig.onSuccess(data);
62390
+ }
62391
+ if (checkoutPromiseRef.current) {
62392
+ checkoutPromiseRef.current.resolve(data);
62393
+ checkoutPromiseRef.current = null;
62394
+ }
62395
+ }, [checkoutConfig]);
62396
+ const handleCheckoutError = (0, import_react.useCallback)((error) => {
62397
+ console.error("[UnifoldProvider] Checkout error:", error);
62398
+ if (checkoutConfig?.onError) {
62399
+ checkoutConfig.onError(error);
62400
+ }
62401
+ if (checkoutPromiseRef.current) {
62402
+ checkoutPromiseRef.current.reject(error);
62403
+ checkoutPromiseRef.current = null;
62404
+ }
62405
+ }, [checkoutConfig]);
61161
62406
  const beginWithdraw = (0, import_react.useCallback)((config2) => {
61162
62407
  if (withdrawCloseTimeoutRef.current) {
61163
62408
  clearTimeout(withdrawCloseTimeoutRef.current);
@@ -61226,16 +62471,16 @@ function UnifoldProvider2({
61226
62471
  () => ({
61227
62472
  beginDeposit,
61228
62473
  closeDeposit,
61229
- handleDepositSuccess,
61230
- handleDepositError,
62474
+ beginCheckout,
62475
+ closeCheckout,
61231
62476
  beginWithdraw,
61232
62477
  closeWithdraw,
61233
62478
  handleWithdrawSuccess,
61234
62479
  handleWithdrawError
61235
62480
  }),
61236
- [beginDeposit, closeDeposit, handleDepositSuccess, handleDepositError, beginWithdraw, closeWithdraw, handleWithdrawSuccess, handleWithdrawError]
62481
+ [beginDeposit, closeDeposit, beginCheckout, closeCheckout, beginWithdraw, closeWithdraw, handleWithdrawSuccess, handleWithdrawError]
61237
62482
  );
61238
- return /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(UnifoldProvider, { publishableKey, children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(ConnectContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime77.jsxs)(
62483
+ return /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(UnifoldProvider, { publishableKey, children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(ConnectContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)(
61239
62484
  ThemeProvider,
61240
62485
  {
61241
62486
  mode: resolvedTheme,
@@ -61246,7 +62491,20 @@ function UnifoldProvider2({
61246
62491
  components: config?.components,
61247
62492
  children: [
61248
62493
  children,
61249
- withdrawConfig && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
62494
+ checkoutConfig && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
62495
+ CheckoutModal,
62496
+ {
62497
+ open: isCheckoutOpen,
62498
+ onOpenChange: closeCheckout,
62499
+ clientSecret: checkoutConfig.clientSecret,
62500
+ publishableKey,
62501
+ enableConnectWallet: config?.enableConnectWallet,
62502
+ theme: resolvedTheme,
62503
+ onCheckoutSuccess: handleCheckoutSuccess,
62504
+ onCheckoutError: handleCheckoutError
62505
+ }
62506
+ ),
62507
+ withdrawConfig && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
61250
62508
  WithdrawModal,
61251
62509
  {
61252
62510
  open: isWithdrawOpen,
@@ -61266,7 +62524,7 @@ function UnifoldProvider2({
61266
62524
  theme: resolvedTheme
61267
62525
  }
61268
62526
  ),
61269
- depositConfig && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
62527
+ depositConfig && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
61270
62528
  DepositModal,
61271
62529
  {
61272
62530
  open: isOpen,
@@ -61317,6 +62575,9 @@ function useUnifold2() {
61317
62575
  beginDeposit: () => Promise.reject(new Error("SSR not supported")),
61318
62576
  closeDeposit: () => {
61319
62577
  },
62578
+ beginCheckout: () => Promise.reject(new Error("SSR not supported")),
62579
+ closeCheckout: () => {
62580
+ },
61320
62581
  beginWithdraw: () => Promise.reject(new Error("SSR not supported")),
61321
62582
  closeWithdraw: () => {
61322
62583
  }
@@ -61329,15 +62590,17 @@ function useUnifold2() {
61329
62590
  publishableKey: baseContext.publishableKey,
61330
62591
  beginDeposit: connectContext.beginDeposit,
61331
62592
  closeDeposit: connectContext.closeDeposit,
62593
+ beginCheckout: connectContext.beginCheckout,
62594
+ closeCheckout: connectContext.closeCheckout,
61332
62595
  beginWithdraw: connectContext.beginWithdraw,
61333
62596
  closeWithdraw: connectContext.closeWithdraw
61334
62597
  };
61335
62598
  }
61336
62599
 
61337
62600
  // src/unifold.tsx
61338
- var UnifoldBridge = (0, import_react32.forwardRef)((_, ref) => {
62601
+ var UnifoldBridge = (0, import_react33.forwardRef)((_, ref) => {
61339
62602
  const { beginDeposit, closeDeposit, beginWithdraw, closeWithdraw } = useUnifold2();
61340
- (0, import_react32.useImperativeHandle)(ref, () => ({ beginDeposit, closeDeposit, beginWithdraw, closeWithdraw }), [
62603
+ (0, import_react33.useImperativeHandle)(ref, () => ({ beginDeposit, closeDeposit, beginWithdraw, closeWithdraw }), [
61341
62604
  beginDeposit,
61342
62605
  closeDeposit,
61343
62606
  beginWithdraw,
@@ -61346,7 +62609,7 @@ var UnifoldBridge = (0, import_react32.forwardRef)((_, ref) => {
61346
62609
  return null;
61347
62610
  });
61348
62611
  UnifoldBridge.displayName = "UnifoldBridge";
61349
- var RenderErrorBoundary = class extends import_react32.Component {
62612
+ var RenderErrorBoundary = class extends import_react33.Component {
61350
62613
  constructor() {
61351
62614
  super(...arguments);
61352
62615
  this.state = { hasError: false };
@@ -61420,13 +62683,13 @@ function createUnifold(publishableKey, config) {
61420
62683
  };
61421
62684
  try {
61422
62685
  root.render(
61423
- import_react32.default.createElement(
62686
+ import_react33.default.createElement(
61424
62687
  RenderErrorBoundary,
61425
62688
  { onError: handleRenderError },
61426
- import_react32.default.createElement(
62689
+ import_react33.default.createElement(
61427
62690
  UnifoldProvider2,
61428
62691
  { publishableKey, config },
61429
- import_react32.default.createElement(UnifoldBridge, { ref: refCallback })
62692
+ import_react33.default.createElement(UnifoldBridge, { ref: refCallback })
61430
62693
  )
61431
62694
  )
61432
62695
  );
@@ -61450,6 +62713,7 @@ lucide-react/dist/esm/Icon.js:
61450
62713
  lucide-react/dist/esm/createLucideIcon.js:
61451
62714
  lucide-react/dist/esm/icons/arrow-left-right.js:
61452
62715
  lucide-react/dist/esm/icons/arrow-left.js:
62716
+ lucide-react/dist/esm/icons/arrow-right.js:
61453
62717
  lucide-react/dist/esm/icons/arrow-up-down.js:
61454
62718
  lucide-react/dist/esm/icons/check.js:
61455
62719
  lucide-react/dist/esm/icons/chevron-down.js: