@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.js CHANGED
@@ -34407,7 +34407,7 @@ __export(index_exports, {
34407
34407
  module.exports = __toCommonJS(index_exports);
34408
34408
 
34409
34409
  // src/unifold.tsx
34410
- var import_react32 = __toESM(require_react());
34410
+ var import_react33 = __toESM(require_react());
34411
34411
  var import_client = __toESM(require_client());
34412
34412
 
34413
34413
  // ../connect-react/dist/index.mjs
@@ -37227,17 +37227,19 @@ var React272 = __toESM(require_react(), 1);
37227
37227
  var import_jsx_runtime69 = __toESM(require_jsx_runtime(), 1);
37228
37228
  var import_jsx_runtime70 = __toESM(require_jsx_runtime(), 1);
37229
37229
  var import_react27 = __toESM(require_react(), 1);
37230
- var import_react28 = __toESM(require_react(), 1);
37231
37230
  var import_jsx_runtime71 = __toESM(require_jsx_runtime(), 1);
37231
+ var import_react28 = __toESM(require_react(), 1);
37232
37232
  var import_react29 = __toESM(require_react(), 1);
37233
37233
  var import_jsx_runtime72 = __toESM(require_jsx_runtime(), 1);
37234
- var import_jsx_runtime73 = __toESM(require_jsx_runtime(), 1);
37235
37234
  var import_react30 = __toESM(require_react(), 1);
37235
+ var import_jsx_runtime73 = __toESM(require_jsx_runtime(), 1);
37236
37236
  var import_jsx_runtime74 = __toESM(require_jsx_runtime(), 1);
37237
- var import_jsx_runtime75 = __toESM(require_jsx_runtime(), 1);
37238
37237
  var import_react31 = __toESM(require_react(), 1);
37238
+ var import_jsx_runtime75 = __toESM(require_jsx_runtime(), 1);
37239
37239
  var import_jsx_runtime76 = __toESM(require_jsx_runtime(), 1);
37240
+ var import_react32 = __toESM(require_react(), 1);
37240
37241
  var import_jsx_runtime77 = __toESM(require_jsx_runtime(), 1);
37242
+ var import_jsx_runtime78 = __toESM(require_jsx_runtime(), 1);
37241
37243
  var __create2 = Object.create;
37242
37244
  var __defProp2 = Object.defineProperty;
37243
37245
  var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
@@ -38501,6 +38503,10 @@ var ArrowLeft = createLucideIcon("ArrowLeft", [
38501
38503
  ["path", { d: "m12 19-7-7 7-7", key: "1l729n" }],
38502
38504
  ["path", { d: "M19 12H5", key: "x3x0zl" }]
38503
38505
  ]);
38506
+ var ArrowRight = createLucideIcon("ArrowRight", [
38507
+ ["path", { d: "M5 12h14", key: "1ays0h" }],
38508
+ ["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
38509
+ ]);
38504
38510
  var ArrowUpDown = createLucideIcon("ArrowUpDown", [
38505
38511
  ["path", { d: "m21 16-4 4-4-4", key: "f6ql7i" }],
38506
38512
  ["path", { d: "M17 20V4", key: "1ejh1v" }],
@@ -43495,6 +43501,28 @@ async function verifyRecipientAddress(request, publishableKey) {
43495
43501
  }
43496
43502
  return response.json();
43497
43503
  }
43504
+ async function checkHypercoreActivation(request, publishableKey) {
43505
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43506
+ validatePublishableKey(pk);
43507
+ const response = await fetch(
43508
+ `${API_BASE_URL}/v1/public/addresses/hypercore/activation`,
43509
+ {
43510
+ method: "POST",
43511
+ headers: {
43512
+ accept: "application/json",
43513
+ "x-publishable-key": pk,
43514
+ "Content-Type": "application/json"
43515
+ },
43516
+ body: JSON.stringify(request)
43517
+ }
43518
+ );
43519
+ if (!response.ok) {
43520
+ throw new Error(
43521
+ `HyperCore activation check failed: ${response.statusText}`
43522
+ );
43523
+ }
43524
+ return response.json();
43525
+ }
43498
43526
  async function getExchanges(query, publishableKey) {
43499
43527
  const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43500
43528
  validatePublishableKey(pk);
@@ -43579,6 +43607,119 @@ async function sendSolanaTransaction(request, publishableKey) {
43579
43607
  }
43580
43608
  return response.json();
43581
43609
  }
43610
+ async function retrievePaymentIntent(clientSecret, publishableKey) {
43611
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43612
+ validatePublishableKey(pk);
43613
+ const response = await fetch(
43614
+ `${API_BASE_URL}/v1/public/payment_intents/retrieve`,
43615
+ {
43616
+ method: "POST",
43617
+ headers: {
43618
+ accept: "application/json",
43619
+ "x-publishable-key": pk,
43620
+ "Content-Type": "application/json"
43621
+ },
43622
+ body: JSON.stringify({ client_secret: clientSecret })
43623
+ }
43624
+ );
43625
+ if (!response.ok) {
43626
+ const error = await response.json().catch(() => ({ message: response.statusText }));
43627
+ throw new Error(
43628
+ `Failed to retrieve payment intent: ${error.message || response.statusText}`
43629
+ );
43630
+ }
43631
+ return response.json();
43632
+ }
43633
+ async function listPaymentIntentExecutions(clientSecret, publishableKey) {
43634
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43635
+ validatePublishableKey(pk);
43636
+ const response = await fetch(
43637
+ `${API_BASE_URL}/v1/public/payment_intents/executions`,
43638
+ {
43639
+ method: "POST",
43640
+ headers: {
43641
+ accept: "application/json",
43642
+ "x-publishable-key": pk,
43643
+ "Content-Type": "application/json"
43644
+ },
43645
+ body: JSON.stringify({ client_secret: clientSecret })
43646
+ }
43647
+ );
43648
+ if (!response.ok) {
43649
+ const error = await response.json().catch(() => ({ message: response.statusText }));
43650
+ throw new Error(
43651
+ `Failed to list payment intent executions: ${error.message || response.statusText}`
43652
+ );
43653
+ }
43654
+ return response.json();
43655
+ }
43656
+ async function getDepositQuote(request, publishableKey) {
43657
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43658
+ validatePublishableKey(pk);
43659
+ const response = await fetch(`${API_BASE_URL}/v1/public/quotes`, {
43660
+ method: "POST",
43661
+ headers: {
43662
+ accept: "application/json",
43663
+ "x-publishable-key": pk,
43664
+ "Content-Type": "application/json"
43665
+ },
43666
+ body: JSON.stringify(request)
43667
+ });
43668
+ if (!response.ok) {
43669
+ const error = await response.json().catch(() => ({ message: response.statusText }));
43670
+ throw new Error(
43671
+ `Failed to get deposit quote: ${error.message || response.statusText}`
43672
+ );
43673
+ }
43674
+ const json = await response.json();
43675
+ return json.data;
43676
+ }
43677
+ async function buildHypercoreTransaction(request, publishableKey) {
43678
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43679
+ validatePublishableKey(pk);
43680
+ const response = await fetch(
43681
+ `${API_BASE_URL}/v1/public/transactions/hypercore/build`,
43682
+ {
43683
+ method: "POST",
43684
+ headers: {
43685
+ accept: "application/json",
43686
+ "x-publishable-key": pk,
43687
+ "Content-Type": "application/json"
43688
+ },
43689
+ body: JSON.stringify(request)
43690
+ }
43691
+ );
43692
+ if (!response.ok) {
43693
+ const error = await response.json().catch(() => ({ message: response.statusText }));
43694
+ throw new Error(
43695
+ `Failed to build HyperCore transaction: ${error.message || response.statusText}`
43696
+ );
43697
+ }
43698
+ return response.json();
43699
+ }
43700
+ async function sendHypercoreTransaction(request, publishableKey) {
43701
+ const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
43702
+ validatePublishableKey(pk);
43703
+ const response = await fetch(
43704
+ `${API_BASE_URL}/v1/public/transactions/hypercore/send`,
43705
+ {
43706
+ method: "POST",
43707
+ headers: {
43708
+ accept: "application/json",
43709
+ "x-publishable-key": pk,
43710
+ "Content-Type": "application/json"
43711
+ },
43712
+ body: JSON.stringify(request)
43713
+ }
43714
+ );
43715
+ if (!response.ok) {
43716
+ const error = await response.json().catch(() => ({ message: response.statusText }));
43717
+ throw new Error(
43718
+ `Failed to send HyperCore transaction: ${error.message || response.statusText}`
43719
+ );
43720
+ }
43721
+ return response.json();
43722
+ }
43582
43723
  var REACT_LAZY_TYPE = /* @__PURE__ */ Symbol.for("react.lazy");
43583
43724
  var use = React25[" use ".trim().toString()];
43584
43725
  function isPromiseLike(value) {
@@ -48935,6 +49076,7 @@ var CUTOFF_BUFFER_MS = 6e4;
48935
49076
  function useDepositPolling({
48936
49077
  userId,
48937
49078
  publishableKey,
49079
+ clientSecret,
48938
49080
  depositConfirmationMode = "auto_ui",
48939
49081
  depositWalletId,
48940
49082
  enabled = true,
@@ -48992,11 +49134,12 @@ function useDepositPolling({
48992
49134
  depositWalletId
48993
49135
  ]);
48994
49136
  (0, import_react10.useEffect)(() => {
48995
- if (!userId || !enabled) return;
49137
+ if (!enabled) return;
49138
+ if (!clientSecret && !userId) return;
48996
49139
  const modalOpenedAt = modalOpenedAtRef.current;
48997
49140
  const poll = async () => {
48998
49141
  try {
48999
- const response = await queryExecutions(userId, publishableKey, ActionType.Deposit);
49142
+ const response = clientSecret ? await listPaymentIntentExecutions(clientSecret, publishableKey) : await queryExecutions(userId, publishableKey, ActionType.Deposit);
49000
49143
  const cutoff = new Date(modalOpenedAt.getTime() - CUTOFF_BUFFER_MS);
49001
49144
  const sortedExecutions = [...response.data].sort((a, b) => {
49002
49145
  const timeA = a.created_at ? new Date(a.created_at).getTime() : 0;
@@ -49080,7 +49223,7 @@ function useDepositPolling({
49080
49223
  clearInterval(pollInterval);
49081
49224
  setIsPolling(false);
49082
49225
  };
49083
- }, [userId, publishableKey, enabled]);
49226
+ }, [userId, publishableKey, clientSecret, enabled]);
49084
49227
  (0, import_react10.useEffect)(() => {
49085
49228
  if (!pollingEnabled || !depositWalletId) return;
49086
49229
  const triggerPoll = async () => {
@@ -55589,6 +55732,7 @@ var parseChainKey = (chainKey) => {
55589
55732
  function TransferCryptoSingleInput({
55590
55733
  userId,
55591
55734
  publishableKey,
55735
+ clientSecret,
55592
55736
  recipientAddress,
55593
55737
  destinationChainType,
55594
55738
  destinationChainId,
@@ -55601,7 +55745,9 @@ function TransferCryptoSingleInput({
55601
55745
  onExecutionsChange,
55602
55746
  onDepositSuccess,
55603
55747
  onDepositError,
55604
- wallets: externalWallets
55748
+ wallets: externalWallets,
55749
+ onSourceTokenChange,
55750
+ checkoutQuote
55605
55751
  }) {
55606
55752
  const { themeClass, colors: colors2, fonts, components } = useTheme();
55607
55753
  const isDarkMode = themeClass.includes("uf-dark");
@@ -55668,12 +55814,28 @@ function TransferCryptoSingleInput({
55668
55814
  } = useDepositPolling({
55669
55815
  userId,
55670
55816
  publishableKey,
55817
+ clientSecret,
55671
55818
  depositConfirmationMode,
55672
55819
  depositWalletId: currentWallet?.id,
55673
55820
  enabled: true,
55674
55821
  onDepositSuccess,
55675
55822
  onDepositError
55676
55823
  });
55824
+ (0, import_react16.useEffect)(() => {
55825
+ if (!onSourceTokenChange || !token || !chain || !initialSelectionDone) return;
55826
+ const { chainType, chainId } = parseChainKey(chain);
55827
+ const matchedToken = supportedTokens.find((t11) => t11.symbol === token);
55828
+ const matchedChain = matchedToken?.chains.find(
55829
+ (c) => c.chain_type === chainType && c.chain_id === chainId
55830
+ );
55831
+ onSourceTokenChange({
55832
+ symbol: token,
55833
+ chainType,
55834
+ chainId,
55835
+ tokenAddress: matchedChain?.token_address ?? "",
55836
+ minimumDepositAmountUsd: matchedChain?.minimum_deposit_amount_usd ?? 0
55837
+ });
55838
+ }, [token, chain, initialSelectionDone, onSourceTokenChange, supportedTokens]);
55677
55839
  (0, import_react16.useEffect)(() => {
55678
55840
  if (onExecutionsChange) {
55679
55841
  onExecutionsChange(depositExecutions);
@@ -55820,6 +55982,53 @@ function TransferCryptoSingleInput({
55820
55982
  /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children: "Retrying automatically every 5 seconds..." })
55821
55983
  ] })
55822
55984
  ] }),
55985
+ checkoutQuote && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
55986
+ "div",
55987
+ {
55988
+ className: "uf-rounded-xl uf-px-3 uf-py-2 uf-flex uf-items-center uf-justify-between",
55989
+ style: {
55990
+ backgroundColor: components.card.backgroundColor,
55991
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`,
55992
+ borderRadius: components.card.borderRadius
55993
+ },
55994
+ children: [
55995
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
55996
+ "span",
55997
+ {
55998
+ className: "uf-text-xs",
55999
+ style: { color: components.card.subtitleColor, fontFamily: fonts.regular },
56000
+ children: "You send"
56001
+ }
56002
+ ),
56003
+ /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
56004
+ "span",
56005
+ {
56006
+ className: "uf-text-sm uf-font-semibold",
56007
+ style: { color: components.card.titleColor, fontFamily: fonts.semibold },
56008
+ children: [
56009
+ (Number(checkoutQuote.sourceAmount) / 10 ** checkoutQuote.sourceTokenDecimals).toFixed(
56010
+ Math.min(checkoutQuote.sourceTokenDecimals, 6)
56011
+ ),
56012
+ " ",
56013
+ checkoutQuote.sourceTokenSymbol,
56014
+ checkoutQuote.sourceAmountUsd && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
56015
+ "span",
56016
+ {
56017
+ className: "uf-text-xs uf-font-normal uf-ml-1.5",
56018
+ style: { color: components.card.subtitleColor },
56019
+ children: [
56020
+ "($",
56021
+ checkoutQuote.sourceAmountUsd,
56022
+ ")"
56023
+ ]
56024
+ }
56025
+ )
56026
+ ]
56027
+ }
56028
+ )
56029
+ ]
56030
+ }
56031
+ ),
55823
56032
  /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-pt-2", children: [
55824
56033
  /* @__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" }),
55825
56034
  /* @__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 ? (
@@ -56641,9 +56850,16 @@ function SelectTokenView({
56641
56850
  onBack,
56642
56851
  onClose,
56643
56852
  onDisconnectWallet,
56644
- isDisconnectingWallet = false
56853
+ isDisconnectingWallet = false,
56854
+ checkoutAmountUsd,
56855
+ checkoutReceivedUsd
56645
56856
  }) {
56646
56857
  const { colors: colors2, fonts, components } = useTheme();
56858
+ const isCheckout = !!checkoutAmountUsd;
56859
+ const headerSubtitle = isCheckout ? parseFloat(checkoutReceivedUsd || "0") > 0 ? `$${checkoutReceivedUsd} / $${checkoutAmountUsd} received` : `Amount due: $${checkoutAmountUsd}` : formatBalanceDisplay(
56860
+ `$${totalBalanceUsd || "0.00"}`,
56861
+ projectName
56862
+ );
56647
56863
  return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
56648
56864
  "div",
56649
56865
  {
@@ -56652,11 +56868,8 @@ function SelectTokenView({
56652
56868
  /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
56653
56869
  DepositHeader,
56654
56870
  {
56655
- title: "Select Token",
56656
- subtitle: formatBalanceDisplay(
56657
- `$${totalBalanceUsd || "0.00"}`,
56658
- projectName
56659
- ),
56871
+ title: isCheckout ? "Select Token" : "Select Token",
56872
+ subtitle: headerSubtitle,
56660
56873
  showBack: true,
56661
56874
  onBack,
56662
56875
  onClose
@@ -56884,10 +57097,19 @@ function EnterAmountView({
56884
57097
  onReview,
56885
57098
  onBack,
56886
57099
  onClose,
56887
- quickSelectMode
57100
+ quickSelectMode,
57101
+ checkoutAmountUsd,
57102
+ checkoutReceivedUsd
56888
57103
  }) {
56889
57104
  const { colors: colors2, fonts, components } = useTheme();
57105
+ const isCheckout = !!checkoutAmountUsd;
56890
57106
  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}`;
57107
+ const checkoutRemainingUsd = isCheckout ? Math.max(
57108
+ parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0"),
57109
+ 0
57110
+ ).toFixed(2) : null;
57111
+ const headerTitle = isCheckout ? `Pay $${checkoutRemainingUsd}` : "Enter Amount";
57112
+ const headerSubtitle = isCheckout ? parseFloat(checkoutReceivedUsd || "0") > 0 ? `$${checkoutReceivedUsd} / $${checkoutAmountUsd} received` : null : balanceSubtitle;
56891
57113
  const usePercentageChips = quickSelectMode === "percentage" && maxUsdAmount > 0;
56892
57114
  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";
56893
57115
  return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
@@ -56901,14 +57123,27 @@ function EnterAmountView({
56901
57123
  /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
56902
57124
  DepositHeader,
56903
57125
  {
56904
- title: "Enter Amount",
56905
- subtitle: balanceSubtitle,
57126
+ title: headerTitle,
57127
+ subtitle: headerSubtitle ?? void 0,
56906
57128
  showBack: true,
56907
57129
  onBack,
56908
57130
  onClose
56909
57131
  }
56910
57132
  ),
56911
- 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,
57133
+ 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: [
57134
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(WalletWithNetworkBadge, { walletInfo: walletInfoProp }),
57135
+ isCheckout && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
57136
+ "span",
57137
+ {
57138
+ className: "uf-text-xs",
57139
+ style: {
57140
+ color: colors2.foregroundMuted,
57141
+ fontFamily: fonts.regular
57142
+ },
57143
+ children: balanceSubtitle
57144
+ }
57145
+ )
57146
+ ] }) }) : null,
56912
57147
  /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-flex uf-min-h-0 uf-flex-1 uf-flex-col", children: [
56913
57148
  /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-min-h-0 uf-flex-1", children: [
56914
57149
  /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-text-center uf-py-8", children: [
@@ -56931,7 +57166,9 @@ function EnterAmountView({
56931
57166
  inputMode: "decimal",
56932
57167
  placeholder: "0",
56933
57168
  value: amountUsd,
57169
+ readOnly: isCheckout,
56934
57170
  onChange: (e) => {
57171
+ if (isCheckout) return;
56935
57172
  const value = e.target.value;
56936
57173
  if (value === "" || /^\d*\.?\d*$/.test(value)) {
56937
57174
  const decimalIndex = value.indexOf(".");
@@ -56942,7 +57179,7 @@ function EnterAmountView({
56942
57179
  onAmountChange(value);
56943
57180
  }
56944
57181
  },
56945
- className: "uf-bg-transparent uf-outline-none uf-text-center uf-font-normal uf-w-auto uf-min-w-[60px]",
57182
+ className: `uf-bg-transparent uf-outline-none uf-text-center uf-font-normal uf-w-auto uf-min-w-[60px] ${isCheckout ? "uf-cursor-default" : ""}`,
56946
57183
  style: {
56947
57184
  fontSize: `${Math.max(3.75 - (amountUsd || "0").length * 0.15, 2)}rem`,
56948
57185
  color: components.input.textColor,
@@ -56964,7 +57201,7 @@ function EnterAmountView({
56964
57201
  }
56965
57202
  )
56966
57203
  ] }),
56967
- /* @__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: [
57204
+ !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: [
56968
57205
  PERCENT_QUICK_AMOUNTS.map((pct) => /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
56969
57206
  "button",
56970
57207
  {
@@ -57033,7 +57270,46 @@ function EnterAmountView({
57033
57270
  }
57034
57271
  )
57035
57272
  ] }) }),
57036
- tokenChainDetails && tokenChainDetails.minimum_deposit_amount_usd > 0 && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57273
+ tokenChainDetails && tokenChainDetails.minimum_deposit_amount_usd > 0 && (isCheckout && checkoutAmountUsd && inputUsdNum > parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0") + 5e-3 ? /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57274
+ "div",
57275
+ {
57276
+ className: "uf-rounded-lg uf-px-3 uf-py-2 uf-mb-3 uf-text-center",
57277
+ style: {
57278
+ backgroundColor: colors2.warning + "15",
57279
+ border: `1px solid ${colors2.warning}30`,
57280
+ borderRadius: components.card.borderRadius,
57281
+ animation: "uf-fadeSlideIn 0.4s ease-out"
57282
+ },
57283
+ children: [
57284
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57285
+ "div",
57286
+ {
57287
+ className: "uf-text-xs uf-font-medium",
57288
+ style: { color: colors2.warning, fontFamily: fonts.medium },
57289
+ children: [
57290
+ "Minimum for ",
57291
+ selectedToken.symbol,
57292
+ " on ",
57293
+ selectedToken.chain_name,
57294
+ " is $",
57295
+ tokenChainDetails.minimum_deposit_amount_usd.toFixed(2)
57296
+ ]
57297
+ }
57298
+ ),
57299
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57300
+ "div",
57301
+ {
57302
+ className: "uf-text-xs uf-mt-0.5",
57303
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
57304
+ children: [
57305
+ "Amount adjusted from remaining $",
57306
+ (parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0")).toFixed(2)
57307
+ ]
57308
+ }
57309
+ )
57310
+ ]
57311
+ }
57312
+ ) : /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57037
57313
  "div",
57038
57314
  {
57039
57315
  className: "uf-text-center uf-text-xs uf-mb-3",
@@ -57043,7 +57319,7 @@ function EnterAmountView({
57043
57319
  tokenChainDetails.minimum_deposit_amount_usd.toFixed(2)
57044
57320
  ]
57045
57321
  }
57046
- ),
57322
+ )),
57047
57323
  inputUsdNum > 0 && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_jsx_runtime65.Fragment, { children: inputUsdNum > maxUsdAmount ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
57048
57324
  "div",
57049
57325
  {
@@ -57058,7 +57334,44 @@ function EnterAmountView({
57058
57334
  style: { color: colors2.error },
57059
57335
  children: error
57060
57336
  }
57061
- ) })
57337
+ ) }),
57338
+ 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: [
57339
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-relative", children: [
57340
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
57341
+ "img",
57342
+ {
57343
+ src: selectedToken.icon_url,
57344
+ alt: selectedToken.symbol,
57345
+ width: 20,
57346
+ height: 20,
57347
+ className: "uf-w-5 uf-h-5 uf-rounded-full"
57348
+ }
57349
+ ),
57350
+ selectedToken.chain_icon_url && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
57351
+ "img",
57352
+ {
57353
+ src: selectedToken.chain_icon_url,
57354
+ alt: selectedToken.chain_name,
57355
+ width: 10,
57356
+ height: 10,
57357
+ className: "uf-w-2.5 uf-h-2.5 uf-rounded-full uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-border",
57358
+ style: { borderColor: colors2.background }
57359
+ }
57360
+ )
57361
+ ] }),
57362
+ /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
57363
+ "span",
57364
+ {
57365
+ className: "uf-text-xs",
57366
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
57367
+ children: [
57368
+ selectedToken.symbol,
57369
+ " on ",
57370
+ selectedToken.chain_name
57371
+ ]
57372
+ }
57373
+ )
57374
+ ] })
57062
57375
  ] }),
57063
57376
  /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "uf-shrink-0 uf-pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
57064
57377
  "button",
@@ -57082,6 +57395,18 @@ function EnterAmountView({
57082
57395
  }
57083
57396
  );
57084
57397
  }
57398
+ var WALLET_ICONS2 = {
57399
+ metamask: MetamaskIcon,
57400
+ phantom: PhantomIcon,
57401
+ coinbase: CoinbaseIcon,
57402
+ trust: TrustIcon,
57403
+ rainbow: RainbowIcon,
57404
+ rabby: RabbyIcon,
57405
+ okx: OkxIcon,
57406
+ solflare: SolflareIcon,
57407
+ backpack: BackpackIcon,
57408
+ glow: GlowIcon
57409
+ };
57085
57410
  function ReviewView({
57086
57411
  walletInfo,
57087
57412
  recipientAddress,
@@ -57116,30 +57441,17 @@ function ReviewView({
57116
57441
  ),
57117
57442
  /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-min-h-0 uf-flex-1 uf-flex-col", children: [
57118
57443
  /* @__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: [
57119
- /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-text-center", children: [
57120
- /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
57121
- "div",
57122
- {
57123
- className: "uf-text-4xl uf-font-medium",
57124
- style: { color: colors2.foreground, fontFamily: fonts.medium },
57125
- children: [
57126
- "$",
57127
- amountUsd || "0"
57128
- ]
57129
- }
57130
- ),
57131
- formattedTokenAmount && /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
57132
- "div",
57133
- {
57134
- className: "uf-text-sm uf-mt-2",
57135
- style: { color: colors2.foregroundMuted },
57136
- children: [
57137
- "\u2248 ",
57138
- formattedTokenAmount
57139
- ]
57140
- }
57141
- )
57142
- ] }),
57444
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-text-center", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
57445
+ "div",
57446
+ {
57447
+ className: "uf-text-4xl uf-font-medium",
57448
+ style: { color: colors2.foreground, fontFamily: fonts.medium },
57449
+ children: [
57450
+ "$",
57451
+ amountUsd || "0"
57452
+ ]
57453
+ }
57454
+ ) }),
57143
57455
  /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
57144
57456
  "div",
57145
57457
  {
@@ -57156,29 +57468,20 @@ function ReviewView({
57156
57468
  {
57157
57469
  className: "uf-text-sm",
57158
57470
  style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
57159
- children: "Source"
57471
+ children: "From"
57160
57472
  }
57161
57473
  ),
57162
57474
  /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
57163
- getIconUrl2(selectedToken.icon_url, assetCdnUrl) && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57164
- "img",
57165
- {
57166
- src: getIconUrl2(selectedToken.icon_url, assetCdnUrl),
57167
- alt: selectedToken.symbol,
57168
- className: "uf-w-5 uf-h-5 uf-rounded-full"
57169
- }
57170
- ),
57171
- /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
57475
+ WALLET_ICONS2[walletInfo.icon] && (() => {
57476
+ const Icon22 = WALLET_ICONS2[walletInfo.icon];
57477
+ 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" }) });
57478
+ })(),
57479
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57172
57480
  "span",
57173
57481
  {
57174
57482
  className: "uf-text-sm uf-font-medium",
57175
57483
  style: { color: colors2.foreground, fontFamily: fonts.medium },
57176
- children: [
57177
- walletInfo.name,
57178
- " (",
57179
- truncateAddress2(walletInfo.address),
57180
- ")"
57181
- ]
57484
+ children: walletInfo.name
57182
57485
  }
57183
57486
  )
57184
57487
  ] })
@@ -57189,10 +57492,38 @@ function ReviewView({
57189
57492
  {
57190
57493
  className: "uf-text-sm",
57191
57494
  style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
57192
- children: "Destination"
57495
+ children: "You send"
57193
57496
  }
57194
57497
  ),
57195
- /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57498
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
57499
+ getIconUrl2(selectedToken.icon_url, assetCdnUrl) && /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57500
+ "img",
57501
+ {
57502
+ src: getIconUrl2(selectedToken.icon_url, assetCdnUrl),
57503
+ alt: selectedToken.symbol,
57504
+ className: "uf-w-5 uf-h-5 uf-rounded-full"
57505
+ }
57506
+ ),
57507
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57508
+ "span",
57509
+ {
57510
+ className: "uf-text-sm uf-font-medium",
57511
+ style: { color: colors2.foreground, fontFamily: fonts.medium },
57512
+ children: formattedTokenAmount || `$${amountUsd}`
57513
+ }
57514
+ )
57515
+ ] })
57516
+ ] }),
57517
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-justify-between uf-items-center", children: [
57518
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57519
+ "span",
57520
+ {
57521
+ className: "uf-text-sm",
57522
+ style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
57523
+ children: "Destination"
57524
+ }
57525
+ ),
57526
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
57196
57527
  "span",
57197
57528
  {
57198
57529
  className: "uf-text-sm uf-font-medium",
@@ -57341,7 +57672,10 @@ function ReviewView({
57341
57672
  borderRadius: components.button.borderRadius,
57342
57673
  border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
57343
57674
  },
57344
- children: isConfirming ? "Confirming..." : "Confirm Order"
57675
+ children: isConfirming ? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("span", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2", children: [
57676
+ /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
57677
+ "Confirming..."
57678
+ ] }) : "Confirm Order"
57345
57679
  }
57346
57680
  ) })
57347
57681
  ] })
@@ -57350,17 +57684,35 @@ function ReviewView({
57350
57684
  }
57351
57685
  );
57352
57686
  }
57687
+ var SETTLE_FALLBACK_MS = 15e3;
57353
57688
  function ConfirmingView({
57354
57689
  isConfirming,
57355
57690
  onClose,
57356
57691
  executions = [],
57357
- isPolling = false
57692
+ isPolling = false,
57693
+ onNewDeposit,
57694
+ onDone,
57695
+ paymentIntentStatus,
57696
+ amountReceivedUsd,
57697
+ amountReceivedUsdAtSubmission
57358
57698
  }) {
57359
- const { colors: colors2, fonts } = useTheme();
57699
+ const { colors: colors2, fonts, components } = useTheme();
57360
57700
  const [containerEl, setContainerEl] = (0, import_react26.useState)(null);
57361
57701
  const containerCallbackRef = (0, import_react26.useCallback)((el) => {
57362
57702
  setContainerEl(el);
57363
57703
  }, []);
57704
+ const [fallbackSettled, setFallbackSettled] = (0, import_react26.useState)(false);
57705
+ const hasExecution = executions.length > 0;
57706
+ const isCheckoutMode = paymentIntentStatus != null;
57707
+ const isPaymentComplete = paymentIntentStatus === "succeeded";
57708
+ const amountChanged = amountReceivedUsdAtSubmission != null && amountReceivedUsd != null && amountReceivedUsd !== amountReceivedUsdAtSubmission;
57709
+ const piSettled = !isCheckoutMode || isPaymentComplete || amountChanged || fallbackSettled;
57710
+ (0, import_react26.useEffect)(() => {
57711
+ if (!hasExecution || piSettled) return;
57712
+ const timeout = setTimeout(() => setFallbackSettled(true), SETTLE_FALLBACK_MS);
57713
+ return () => clearTimeout(timeout);
57714
+ }, [hasExecution, piSettled]);
57715
+ const showButtons = hasExecution && piSettled;
57364
57716
  return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(PortalContainerProvider, { value: containerEl, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
57365
57717
  "div",
57366
57718
  {
@@ -57373,8 +57725,8 @@ function ConfirmingView({
57373
57725
  /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57374
57726
  DepositHeader,
57375
57727
  {
57376
- title: isConfirming ? "Confirming..." : "Processing",
57377
- onClose
57728
+ title: isConfirming ? "Confirming..." : hasExecution && isPaymentComplete ? "Payment Complete" : hasExecution ? "Deposit Received" : "Processing",
57729
+ onClose: isPaymentComplete && onDone ? onDone : onClose
57378
57730
  }
57379
57731
  ),
57380
57732
  /* @__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: [
@@ -57401,11 +57753,70 @@ function ConfirmingView({
57401
57753
  children: "Please confirm the transaction in your wallet"
57402
57754
  }
57403
57755
  )
57404
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
57756
+ ] }) : hasExecution ? /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
57405
57757
  /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57406
57758
  CircleCheck,
57407
57759
  {
57408
57760
  className: "uf-w-12 uf-h-12 uf-mb-4",
57761
+ style: { color: "rgb(34, 197, 94)" }
57762
+ }
57763
+ ),
57764
+ /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57765
+ "div",
57766
+ {
57767
+ className: "uf-text-lg uf-font-medium",
57768
+ style: { color: colors2.foreground, fontFamily: fonts.medium },
57769
+ children: isPaymentComplete ? "Payment Complete" : "Deposit Received"
57770
+ }
57771
+ ),
57772
+ /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57773
+ "div",
57774
+ {
57775
+ className: "uf-text-sm uf-mt-2 uf-text-center uf-px-6",
57776
+ style: { color: colors2.foregroundMuted },
57777
+ children: isPaymentComplete ? "Your payment has been fulfilled." : showButtons ? "Your deposit is being processed." : "Checking payment status..."
57778
+ }
57779
+ ),
57780
+ /* @__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)(
57781
+ LoaderCircle,
57782
+ {
57783
+ className: "uf-w-5 uf-h-5 uf-animate-spin",
57784
+ style: { color: colors2.foregroundMuted }
57785
+ }
57786
+ ) : isPaymentComplete && onDone ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57787
+ "button",
57788
+ {
57789
+ onClick: onDone,
57790
+ className: "uf-w-full uf-py-3 uf-px-8 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
+ borderRadius: components.button.borderRadius
57796
+ },
57797
+ children: "Done"
57798
+ }
57799
+ ) : onNewDeposit ? /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
57800
+ "button",
57801
+ {
57802
+ onClick: onNewDeposit,
57803
+ 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",
57804
+ style: {
57805
+ backgroundColor: colors2.primary,
57806
+ color: colors2.primaryForeground,
57807
+ fontFamily: fonts.medium
57808
+ },
57809
+ children: [
57810
+ "Make another deposit",
57811
+ /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(ArrowRight, { className: "uf-w-4 uf-h-4" })
57812
+ ]
57813
+ }
57814
+ ) : null })
57815
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
57816
+ /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
57817
+ LoaderCircle,
57818
+ {
57819
+ className: "uf-w-12 uf-h-12 uf-animate-spin uf-mb-4",
57409
57820
  style: { color: colors2.primary }
57410
57821
  }
57411
57822
  ),
@@ -57422,7 +57833,7 @@ function ConfirmingView({
57422
57833
  {
57423
57834
  className: "uf-text-sm uf-mt-2 uf-text-center uf-px-6",
57424
57835
  style: { color: colors2.foregroundMuted },
57425
- children: "You can close this window or wait for confirmation."
57836
+ children: "Waiting for your deposit to be detected..."
57426
57837
  }
57427
57838
  )
57428
57839
  ] }) }),
@@ -57446,6 +57857,7 @@ function BrowserWalletModal({
57446
57857
  depositWallet,
57447
57858
  userId,
57448
57859
  publishableKey,
57860
+ clientSecret,
57449
57861
  assetCdnUrl,
57450
57862
  projectName,
57451
57863
  theme = "dark",
@@ -57454,7 +57866,13 @@ function BrowserWalletModal({
57454
57866
  onDepositSuccess,
57455
57867
  onDepositError,
57456
57868
  amountQuickSelect = "percentage",
57457
- onWalletDisconnect
57869
+ onWalletDisconnect,
57870
+ prefillAmountUsd,
57871
+ checkoutAmountUsd,
57872
+ checkoutReceivedUsd,
57873
+ onNewDeposit,
57874
+ onDone,
57875
+ paymentIntentStatus
57458
57876
  }) {
57459
57877
  const { colors: colors2, fonts, components } = useTheme();
57460
57878
  const [step, setStep] = React262.useState("select-token");
@@ -57472,6 +57890,7 @@ function BrowserWalletModal({
57472
57890
  const [tokenChainDetails, setTokenChainDetails] = React262.useState(null);
57473
57891
  const [loadingTokenDetails, setLoadingTokenDetails] = React262.useState(false);
57474
57892
  const [showTransactionDetails, setShowTransactionDetails] = React262.useState(false);
57893
+ const [receivedUsdAtSubmission, setReceivedUsdAtSubmission] = React262.useState(null);
57475
57894
  const themeClass = theme === "dark" ? "uf-dark" : "";
57476
57895
  const chainType = depositWallet.chain_type;
57477
57896
  const recipientAddress = depositWallet.address;
@@ -57479,15 +57898,19 @@ function BrowserWalletModal({
57479
57898
  const { executions: depositExecutions, isPolling } = useDepositPolling({
57480
57899
  userId,
57481
57900
  publishableKey,
57901
+ clientSecret,
57482
57902
  enabled: open && hasSignedTransaction,
57483
57903
  onDepositSuccess,
57484
57904
  onDepositError
57485
57905
  });
57906
+ const prevOpenRef = React262.useRef(false);
57486
57907
  React262.useEffect(() => {
57487
- if (open) {
57908
+ const wasOpen = prevOpenRef.current;
57909
+ prevOpenRef.current = open;
57910
+ if (open && !wasOpen) {
57488
57911
  setStep("select-token");
57489
57912
  setSelectedBalance(null);
57490
- setAmountUsd("");
57913
+ setAmountUsd(prefillAmountUsd ?? "");
57491
57914
  setError(null);
57492
57915
  setIsConfirming(false);
57493
57916
  setTokenChainDetails(null);
@@ -57495,7 +57918,15 @@ function BrowserWalletModal({
57495
57918
  setHasSignedTransaction(false);
57496
57919
  setIsDisconnectingWallet(false);
57497
57920
  }
57498
- }, [open]);
57921
+ }, [open, prefillAmountUsd]);
57922
+ React262.useEffect(() => {
57923
+ if (!prefillAmountUsd || !tokenChainDetails || step !== "input-amount") return;
57924
+ const minDeposit = tokenChainDetails.minimum_deposit_amount_usd || 0;
57925
+ const currentAmount = parseFloat(amountUsd) || 0;
57926
+ if (currentAmount > 0 && currentAmount < minDeposit) {
57927
+ setAmountUsd(minDeposit.toFixed(2));
57928
+ }
57929
+ }, [tokenChainDetails, step, prefillAmountUsd]);
57499
57930
  React262.useEffect(() => {
57500
57931
  if (step === "review") {
57501
57932
  setShowTransactionDetails(false);
@@ -57613,7 +58044,7 @@ function BrowserWalletModal({
57613
58044
  setError(null);
57614
58045
  if (step === "input-amount") {
57615
58046
  setStep("select-token");
57616
- setAmountUsd("");
58047
+ setAmountUsd(prefillAmountUsd ?? "");
57617
58048
  setTokenChainDetails(null);
57618
58049
  } else if (step === "review") {
57619
58050
  setStep("input-amount");
@@ -57699,7 +58130,6 @@ function BrowserWalletModal({
57699
58130
  }
57700
58131
  }
57701
58132
  setIsConfirming(true);
57702
- setStep("confirming");
57703
58133
  setError(null);
57704
58134
  try {
57705
58135
  let txHash;
@@ -57717,16 +58147,17 @@ function BrowserWalletModal({
57717
58147
  } else {
57718
58148
  txHash = await sendEthereumTransaction(token, tokenAmount.toString());
57719
58149
  }
58150
+ setReceivedUsdAtSubmission(checkoutReceivedUsd ?? "0");
57720
58151
  setHasSignedTransaction(true);
57721
- onSuccess?.(txHash);
57722
58152
  setIsConfirming(false);
58153
+ setStep("confirming");
58154
+ onSuccess?.(txHash);
57723
58155
  } catch (err) {
57724
58156
  console.error("[BrowserWalletModal] Transaction error:", err);
57725
58157
  const errorMessage = err instanceof Error ? err.message : "Transaction failed";
57726
58158
  setError(errorMessage);
57727
58159
  onError?.(err instanceof Error ? err : new Error(errorMessage));
57728
58160
  setIsConfirming(false);
57729
- setStep("review");
57730
58161
  }
57731
58162
  };
57732
58163
  const sendEthereumTransaction = async (token, amountStr) => {
@@ -57975,7 +58406,9 @@ function BrowserWalletModal({
57975
58406
  onBack: handleClose,
57976
58407
  onClose: handleFullClose,
57977
58408
  onDisconnectWallet: onWalletDisconnect ? () => void handleDisconnectFromSelectToken() : void 0,
57978
- isDisconnectingWallet
58409
+ isDisconnectingWallet,
58410
+ checkoutAmountUsd,
58411
+ checkoutReceivedUsd
57979
58412
  }
57980
58413
  ),
57981
58414
  step === "input-amount" && selectedToken && selectedBalance && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
@@ -57996,7 +58429,9 @@ function BrowserWalletModal({
57996
58429
  onReview: handleReview,
57997
58430
  onBack: handleBack,
57998
58431
  onClose: handleFullClose,
57999
- quickSelectMode: amountQuickSelect
58432
+ quickSelectMode: amountQuickSelect,
58433
+ checkoutAmountUsd,
58434
+ checkoutReceivedUsd
58000
58435
  }
58001
58436
  ),
58002
58437
  step === "review" && selectedToken && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
@@ -58025,7 +58460,12 @@ function BrowserWalletModal({
58025
58460
  isConfirming,
58026
58461
  onClose: handleFullClose,
58027
58462
  executions: depositExecutions,
58028
- isPolling
58463
+ isPolling,
58464
+ onNewDeposit,
58465
+ onDone,
58466
+ paymentIntentStatus,
58467
+ amountReceivedUsd: checkoutReceivedUsd,
58468
+ amountReceivedUsdAtSubmission: receivedUsdAtSubmission
58029
58469
  }
58030
58470
  )
58031
58471
  ] })
@@ -58034,7 +58474,7 @@ function BrowserWalletModal({
58034
58474
  }
58035
58475
  ) });
58036
58476
  }
58037
- var WALLET_ICONS2 = {
58477
+ var WALLET_ICONS3 = {
58038
58478
  metamask: MetamaskIcon,
58039
58479
  phantom: PhantomIcon,
58040
58480
  coinbase: CoinbaseIcon,
@@ -58473,10 +58913,10 @@ function WalletSelectionModal({
58473
58913
  },
58474
58914
  children: [
58475
58915
  /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
58476
- WALLET_ICONS2[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
58916
+ WALLET_ICONS3[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
58477
58917
  WalletIconWithNetwork,
58478
58918
  {
58479
- WalletIcon: WALLET_ICONS2[wallet.id],
58919
+ WalletIcon: WALLET_ICONS3[wallet.id],
58480
58920
  networks: wallet.networks,
58481
58921
  size: 40,
58482
58922
  className: "uf-rounded-lg"
@@ -58547,10 +58987,10 @@ function WalletSelectionModal({
58547
58987
  style: { minHeight: WALLET_STEP_BODY_MIN_HEIGHT },
58548
58988
  children: [
58549
58989
  /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-pb-4 uf-shrink-0", children: [
58550
- /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "uf-mb-2", children: WALLET_ICONS2[selectedWallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
58990
+ /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "uf-mb-2", children: WALLET_ICONS3[selectedWallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
58551
58991
  WalletIconWithNetwork,
58552
58992
  {
58553
- WalletIcon: WALLET_ICONS2[selectedWallet.id],
58993
+ WalletIcon: WALLET_ICONS3[selectedWallet.id],
58554
58994
  networks: selectedWallet.networks,
58555
58995
  size: 48,
58556
58996
  className: "uf-rounded-lg"
@@ -59349,136 +59789,794 @@ function DepositModal({
59349
59789
  }
59350
59790
  ) });
59351
59791
  }
59352
- function useSupportedDestinationTokens(publishableKey, enabled = true) {
59792
+ function usePaymentIntent(params) {
59793
+ const {
59794
+ clientSecret,
59795
+ publishableKey,
59796
+ enabled = true,
59797
+ pollingInterval = 5e3
59798
+ } = params;
59353
59799
  return useQuery({
59354
- queryKey: ["unifold", "supportedDestinationTokens", publishableKey],
59355
- queryFn: () => getSupportedDestinationTokens(publishableKey),
59356
- staleTime: 1e3 * 60 * 5,
59357
- gcTime: 1e3 * 60 * 30,
59358
- refetchOnMount: false,
59359
- refetchOnWindowFocus: false,
59360
- enabled
59800
+ queryKey: ["unifold", "paymentIntent", clientSecret, publishableKey],
59801
+ queryFn: () => retrievePaymentIntent(clientSecret, publishableKey),
59802
+ enabled: enabled && !!clientSecret && !!publishableKey,
59803
+ staleTime: 0,
59804
+ refetchInterval: pollingInterval || false,
59805
+ refetchOnWindowFocus: true,
59806
+ retry: 3,
59807
+ retryDelay: (attempt) => Math.min(1e3 * 2 ** attempt, 1e4)
59361
59808
  });
59362
59809
  }
59363
- function useSourceTokenValidation(params) {
59810
+ function useDepositQuote(params) {
59364
59811
  const {
59812
+ publishableKey,
59365
59813
  sourceChainType,
59366
59814
  sourceChainId,
59367
59815
  sourceTokenAddress,
59368
- sourceTokenSymbol,
59369
- publishableKey,
59816
+ destinationAmount,
59817
+ destinationChainType,
59818
+ destinationChainId,
59819
+ destinationTokenAddress,
59370
59820
  enabled = true
59371
59821
  } = params;
59372
- const hasParams = !!sourceChainType && !!sourceChainId && !!sourceTokenAddress;
59822
+ const request = {
59823
+ source_chain_type: sourceChainType,
59824
+ source_chain_id: sourceChainId,
59825
+ source_token_address: sourceTokenAddress,
59826
+ destination_amount: destinationAmount,
59827
+ destination_chain_type: destinationChainType,
59828
+ destination_chain_id: destinationChainId,
59829
+ destination_token_address: destinationTokenAddress
59830
+ };
59373
59831
  return useQuery({
59374
59832
  queryKey: [
59375
59833
  "unifold",
59376
- "sourceTokenValidation",
59377
- sourceChainType ?? null,
59378
- sourceChainId ?? null,
59379
- sourceTokenAddress ?? null,
59834
+ "depositQuote",
59835
+ sourceChainType,
59836
+ sourceChainId,
59837
+ sourceTokenAddress,
59838
+ destinationAmount,
59839
+ destinationChainType,
59840
+ destinationChainId,
59841
+ destinationTokenAddress,
59380
59842
  publishableKey
59381
59843
  ],
59382
- queryFn: async () => {
59383
- const res = await getSupportedDepositTokens(publishableKey);
59384
- let matchedMinUsd = null;
59385
- let matchedProcessingTime = null;
59386
- let matchedSlippage = null;
59387
- let matchedPriceImpact = null;
59388
- const found = res.data.some(
59389
- (token) => token.chains.some((chain) => {
59390
- const match = chain.chain_type === sourceChainType && chain.chain_id === sourceChainId && chain.token_address.toLowerCase() === sourceTokenAddress.toLowerCase();
59391
- if (match) {
59392
- matchedMinUsd = chain.minimum_deposit_amount_usd;
59393
- matchedProcessingTime = chain.estimated_processing_time;
59394
- matchedSlippage = chain.max_slippage_percent;
59395
- matchedPriceImpact = chain.estimated_price_impact_percent;
59396
- }
59397
- return match;
59398
- })
59399
- );
59400
- return {
59401
- isSupported: found,
59402
- minimumAmountUsd: matchedMinUsd,
59403
- estimatedProcessingTime: matchedProcessingTime,
59404
- maxSlippagePercent: matchedSlippage,
59405
- priceImpactPercent: matchedPriceImpact,
59406
- errorMessage: found ? null : `${sourceTokenSymbol || "Source token"} is not a supported withdrawal token. Supported tokens include USDC, USDT, and other stablecoins.`
59407
- };
59408
- },
59409
- enabled: enabled && hasParams,
59410
- staleTime: 1e3 * 60 * 5,
59411
- gcTime: 1e3 * 60 * 30,
59412
- refetchOnMount: false,
59413
- refetchOnWindowFocus: false
59844
+ queryFn: () => getDepositQuote(request, publishableKey),
59845
+ enabled: enabled && !!publishableKey && !!sourceChainType && !!sourceChainId && !!sourceTokenAddress && !!destinationAmount && destinationAmount !== "0" && !!destinationChainType && !!destinationChainId && !!destinationTokenAddress,
59846
+ staleTime: 6e4,
59847
+ gcTime: 5 * 6e4,
59848
+ refetchOnWindowFocus: false,
59849
+ retry: 2,
59850
+ retryDelay: (attempt) => Math.min(1e3 * 2 ** attempt, 5e3)
59414
59851
  });
59415
59852
  }
59416
- function useAddressBalance(params) {
59853
+ function mapDepositAddressesToWallets(depositAddresses, pi) {
59854
+ return depositAddresses.map((da, idx) => ({
59855
+ id: da.id,
59856
+ chain_type: da.chain_type,
59857
+ address_type: da.address_type,
59858
+ address: da.address,
59859
+ destination_chain_type: pi.destination_chain_type,
59860
+ destination_chain_id: pi.destination_chain_id,
59861
+ destination_token_address: pi.destination_token_address,
59862
+ recipient_address: pi.recipient_address,
59863
+ is_primary: idx === 0
59864
+ }));
59865
+ }
59866
+ function SkeletonButton2() {
59867
+ 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: [
59868
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
59869
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-bg-muted uf-rounded-lg uf-w-9 uf-h-9" }),
59870
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-space-y-1.5", children: [
59871
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-h-3.5 uf-w-24 uf-bg-muted uf-rounded" }),
59872
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-h-3 uf-w-32 uf-bg-muted uf-rounded" })
59873
+ ] })
59874
+ ] }),
59875
+ /* @__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" }) })
59876
+ ] });
59877
+ }
59878
+ function CheckoutModal({
59879
+ open,
59880
+ onOpenChange,
59881
+ clientSecret,
59882
+ publishableKey,
59883
+ modalTitle,
59884
+ enableConnectWallet = false,
59885
+ theme = "dark",
59886
+ onCheckoutSuccess,
59887
+ onCheckoutError
59888
+ }) {
59889
+ const { colors: colors2, fonts, components } = useTheme();
59890
+ const [view, setView] = (0, import_react27.useState)("main");
59891
+ const resetViewTimeoutRef = (0, import_react27.useRef)(
59892
+ null
59893
+ );
59894
+ const [browserWalletModalOpen, setBrowserWalletModalOpen] = (0, import_react27.useState)(false);
59895
+ const [browserWalletInfo, setBrowserWalletInfo] = (0, import_react27.useState)(null);
59896
+ const [walletSelectionModalOpen, setWalletSelectionModalOpen] = (0, import_react27.useState)(false);
59897
+ const [browserWalletChainType, setBrowserWalletChainType] = (0, import_react27.useState)(() => getStoredWalletChainType());
59898
+ const isMobileView = useIsMobileViewport();
59899
+ const [resolvedTheme, setResolvedTheme] = (0, import_react27.useState)(
59900
+ theme === "auto" ? "dark" : theme
59901
+ );
59902
+ (0, import_react27.useEffect)(() => {
59903
+ if (theme === "auto") {
59904
+ const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
59905
+ setResolvedTheme(mediaQuery.matches ? "dark" : "light");
59906
+ const handler = (e) => {
59907
+ setResolvedTheme(e.matches ? "dark" : "light");
59908
+ };
59909
+ mediaQuery.addEventListener("change", handler);
59910
+ return () => mediaQuery.removeEventListener("change", handler);
59911
+ } else {
59912
+ setResolvedTheme(theme);
59913
+ }
59914
+ }, [theme]);
59915
+ const themeClass = resolvedTheme === "dark" ? "uf-dark" : "";
59417
59916
  const {
59418
- address,
59419
- chainType,
59420
- chainId,
59421
- tokenAddress,
59917
+ data: paymentIntent,
59918
+ isLoading: piLoading,
59919
+ error: piError
59920
+ } = usePaymentIntent({
59921
+ clientSecret,
59422
59922
  publishableKey,
59423
- enabled = true
59424
- } = params;
59425
- const hasParams = !!address && !!chainType && !!chainId && !!tokenAddress;
59426
- return useQuery({
59427
- queryKey: [
59428
- "unifold",
59429
- "addressBalance",
59430
- address ?? null,
59431
- chainType ?? null,
59432
- chainId ?? null,
59433
- tokenAddress ?? null,
59434
- publishableKey
59435
- ],
59436
- queryFn: async () => {
59437
- const res = await getAddressBalance(
59438
- address,
59439
- chainType,
59440
- chainId,
59441
- tokenAddress,
59442
- publishableKey
59923
+ enabled: open && !!clientSecret,
59924
+ pollingInterval: 5e3
59925
+ });
59926
+ const { projectConfig } = useProjectConfig({
59927
+ publishableKey,
59928
+ enabled: open
59929
+ });
59930
+ const prevStatusRef = (0, import_react27.useRef)(null);
59931
+ (0, import_react27.useEffect)(() => {
59932
+ if (!paymentIntent) return;
59933
+ const prev = prevStatusRef.current;
59934
+ prevStatusRef.current = paymentIntent.status;
59935
+ if (prev && prev !== paymentIntent.status && paymentIntent.status === "succeeded") {
59936
+ if (!browserWalletModalOpen) {
59937
+ setView("main");
59938
+ }
59939
+ onCheckoutSuccess?.({
59940
+ paymentIntentId: paymentIntent.id,
59941
+ status: paymentIntent.status
59942
+ });
59943
+ }
59944
+ }, [paymentIntent, onCheckoutSuccess, browserWalletModalOpen]);
59945
+ const wallets = (0, import_react27.useMemo)(() => {
59946
+ if (!paymentIntent) return [];
59947
+ return mapDepositAddressesToWallets(
59948
+ paymentIntent.deposit_addresses,
59949
+ paymentIntent
59950
+ );
59951
+ }, [paymentIntent]);
59952
+ const formatCryptoAmount = (0, import_react27.useMemo)(() => {
59953
+ if (!paymentIntent) return (_) => "";
59954
+ const decimals = paymentIntent.destination_token_decimals ?? 6;
59955
+ const symbol = paymentIntent.currency.toUpperCase();
59956
+ return (baseUnits) => {
59957
+ const num = Number(baseUnits) / 10 ** decimals;
59958
+ const formatted = num % 1 === 0 ? num.toFixed(0) : num.toFixed(2);
59959
+ return `${formatted} ${symbol}`;
59960
+ };
59961
+ }, [paymentIntent]);
59962
+ const remainingAmountUsd = (0, import_react27.useMemo)(() => {
59963
+ if (!paymentIntent) return void 0;
59964
+ const total = parseFloat(paymentIntent.amount_usd);
59965
+ const received = parseFloat(paymentIntent.amount_received_usd);
59966
+ if (isNaN(total) || isNaN(received)) return paymentIntent.amount_usd;
59967
+ const remaining = total - received;
59968
+ return remaining > 0 ? remaining.toFixed(2) : "0.00";
59969
+ }, [paymentIntent]);
59970
+ const remainingCrypto = (0, import_react27.useMemo)(() => {
59971
+ if (!paymentIntent) return void 0;
59972
+ const total = BigInt(paymentIntent.amount);
59973
+ const received = BigInt(paymentIntent.amount_received);
59974
+ const remaining = total - received;
59975
+ return remaining > 0n ? remaining.toString() : "0";
59976
+ }, [paymentIntent]);
59977
+ const [selectedSource, setSelectedSource] = (0, import_react27.useState)(null);
59978
+ const quoteDestinationAmount = (0, import_react27.useMemo)(() => {
59979
+ if (!paymentIntent || !selectedSource) return "0";
59980
+ const remaining = BigInt(paymentIntent.amount) - BigInt(paymentIntent.amount_received);
59981
+ const totalBaseUnits = Number(paymentIntent.amount);
59982
+ const totalUsd = parseFloat(paymentIntent.amount_usd);
59983
+ const baseUnitsPerUsd = totalUsd > 0 ? totalBaseUnits / totalUsd : 0;
59984
+ const minUsd = Math.max(selectedSource.minimumDepositAmountUsd, 3);
59985
+ const minDepositBaseUnits = BigInt(Math.ceil(minUsd * baseUnitsPerUsd));
59986
+ const effective = remaining > minDepositBaseUnits ? remaining : minDepositBaseUnits;
59987
+ return effective > 0n ? effective.toString() : "0";
59988
+ }, [paymentIntent, selectedSource]);
59989
+ const { data: sourceQuote } = useDepositQuote({
59990
+ publishableKey,
59991
+ sourceChainType: selectedSource?.chainType ?? "",
59992
+ sourceChainId: selectedSource?.chainId ?? "",
59993
+ sourceTokenAddress: selectedSource?.tokenAddress ?? "",
59994
+ destinationAmount: quoteDestinationAmount,
59995
+ destinationChainType: paymentIntent?.destination_chain_type ?? "",
59996
+ destinationChainId: paymentIntent?.destination_chain_id ?? "",
59997
+ destinationTokenAddress: paymentIntent?.destination_token_address ?? "",
59998
+ enabled: open && view === "transfer" && !!paymentIntent && !!selectedSource && quoteDestinationAmount !== "0"
59999
+ });
60000
+ const handleBrowserWalletClick = (0, import_react27.useCallback)(
60001
+ (walletInfo) => {
60002
+ const walletChainType = walletInfo.type === "phantom-solana" || walletInfo.type === "solflare" || walletInfo.type === "backpack" || walletInfo.type === "glow" ? "solana" : "ethereum";
60003
+ setStoredWalletChainType(walletChainType);
60004
+ setBrowserWalletChainType(walletChainType);
60005
+ const matchingDepositWallet = wallets.find(
60006
+ (w) => w.chain_type === walletChainType
59443
60007
  );
59444
- if (res.balance) {
59445
- const decimals = res.balance.token?.decimals ?? 6;
59446
- const symbol = res.balance.token?.symbol ?? "";
59447
- const baseUnit = res.balance.amount;
59448
- const raw = BigInt(baseUnit);
59449
- const divisor = BigInt(10 ** decimals);
59450
- const whole = raw / divisor;
59451
- const frac = raw % divisor;
59452
- const fracStr = frac.toString().padStart(decimals, "0").replace(/0+$/, "");
59453
- const balanceHuman = fracStr ? `${whole}.${fracStr}` : whole.toString();
59454
- return {
59455
- balanceBaseUnit: baseUnit,
59456
- balanceHuman,
59457
- balanceUsd: res.balance.amount_usd,
59458
- exchangeRate: res.balance.exchange_rate,
59459
- decimals,
59460
- symbol
59461
- };
60008
+ if (!matchingDepositWallet) {
60009
+ onCheckoutError?.({
60010
+ message: `Unable to pay from ${walletChainType}. Please try a different wallet.`,
60011
+ code: "NO_DEPOSIT_ADDRESS"
60012
+ });
60013
+ return;
59462
60014
  }
59463
- return { balanceBaseUnit: "0", balanceHuman: "0", balanceUsd: "0", exchangeRate: null, decimals: 6, symbol: "" };
60015
+ setBrowserWalletInfo({
60016
+ ...walletInfo,
60017
+ depositWallet: matchingDepositWallet
60018
+ });
60019
+ setBrowserWalletModalOpen(true);
59464
60020
  },
59465
- enabled: enabled && hasParams,
59466
- staleTime: 1e3 * 30,
59467
- gcTime: 1e3 * 60 * 5,
59468
- refetchInterval: 1e3 * 30,
59469
- refetchOnMount: "always",
59470
- refetchOnWindowFocus: false
59471
- });
59472
- }
59473
- function useExecutions(userId, publishableKey, options2) {
59474
- const actionType = options2?.actionType ?? ActionType.Deposit;
59475
- return useQuery({
59476
- queryKey: ["unifold", "executions", actionType, userId, publishableKey],
59477
- queryFn: () => queryExecutions(userId, publishableKey, actionType),
59478
- enabled: (options2?.enabled ?? true) && !!userId,
59479
- refetchInterval: options2?.refetchInterval ?? 3e3,
59480
- staleTime: 0,
59481
- gcTime: 1e3 * 60 * 5,
60021
+ [wallets, onCheckoutError]
60022
+ );
60023
+ const handleWalletConnectClick = (0, import_react27.useCallback)(() => {
60024
+ setWalletSelectionModalOpen(true);
60025
+ }, []);
60026
+ const handleWalletConnected = (0, import_react27.useCallback)(
60027
+ (walletInfo) => {
60028
+ const walletChainType = walletInfo.type === "phantom-solana" || walletInfo.type === "solflare" || walletInfo.type === "backpack" || walletInfo.type === "glow" ? "solana" : "ethereum";
60029
+ setStoredWalletChainType(walletChainType);
60030
+ setBrowserWalletChainType(walletChainType);
60031
+ const matchingDepositWallet = wallets.find(
60032
+ (w) => w.chain_type === walletChainType
60033
+ );
60034
+ if (!matchingDepositWallet) {
60035
+ onCheckoutError?.({
60036
+ message: `Unable to pay from ${walletChainType}. Please try a different wallet.`,
60037
+ code: "NO_DEPOSIT_ADDRESS"
60038
+ });
60039
+ setWalletSelectionModalOpen(false);
60040
+ return;
60041
+ }
60042
+ setBrowserWalletInfo({
60043
+ ...walletInfo,
60044
+ depositWallet: matchingDepositWallet
60045
+ });
60046
+ setWalletSelectionModalOpen(false);
60047
+ setBrowserWalletModalOpen(true);
60048
+ },
60049
+ [wallets, onCheckoutError]
60050
+ );
60051
+ const handleWalletDisconnect = (0, import_react27.useCallback)(() => {
60052
+ setUserDisconnectedWallet(true);
60053
+ clearStoredWalletChainType();
60054
+ setBrowserWalletChainType(void 0);
60055
+ setBrowserWalletInfo(null);
60056
+ setBrowserWalletModalOpen(false);
60057
+ }, []);
60058
+ const handleClose = (0, import_react27.useCallback)(() => {
60059
+ onOpenChange(false);
60060
+ if (resetViewTimeoutRef.current) {
60061
+ clearTimeout(resetViewTimeoutRef.current);
60062
+ }
60063
+ resetViewTimeoutRef.current = setTimeout(() => {
60064
+ setView("main");
60065
+ setBrowserWalletInfo(null);
60066
+ resetViewTimeoutRef.current = null;
60067
+ }, 200);
60068
+ }, [onOpenChange]);
60069
+ (0, import_react27.useLayoutEffect)(() => {
60070
+ if (!open) return;
60071
+ if (resetViewTimeoutRef.current) {
60072
+ clearTimeout(resetViewTimeoutRef.current);
60073
+ resetViewTimeoutRef.current = null;
60074
+ }
60075
+ setView("main");
60076
+ setBrowserWalletInfo(null);
60077
+ }, [open]);
60078
+ (0, import_react27.useEffect)(
60079
+ () => () => {
60080
+ if (resetViewTimeoutRef.current) {
60081
+ clearTimeout(resetViewTimeoutRef.current);
60082
+ }
60083
+ },
60084
+ []
60085
+ );
60086
+ const handleBack = (0, import_react27.useCallback)(() => {
60087
+ setView("main");
60088
+ }, []);
60089
+ const poweredByFooter = /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60090
+ PoweredByUnifold,
60091
+ {
60092
+ color: colors2.foregroundMuted,
60093
+ className: "uf-flex uf-justify-center uf-shrink-0"
60094
+ }
60095
+ ) });
60096
+ const progressSection = paymentIntent ? (() => {
60097
+ const received = parseFloat(paymentIntent.amount_received_usd);
60098
+ const total = parseFloat(paymentIntent.amount_usd);
60099
+ const remaining = Math.max(total - received, 0);
60100
+ const pct = total > 0 ? Math.min(received / total * 100, 100) : 0;
60101
+ const hasPartial = received > 0;
60102
+ const amountStr = paymentIntent.amount_usd;
60103
+ const dynamicFontSize = `${Math.max(3.75 - amountStr.length * 0.15, 2)}rem`;
60104
+ return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-text-center uf-py-2 uf-space-y-1", children: [
60105
+ paymentIntent.description && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60106
+ "div",
60107
+ {
60108
+ className: "uf-text-xs",
60109
+ style: {
60110
+ color: colors2.foregroundMuted,
60111
+ fontFamily: fonts.regular
60112
+ },
60113
+ children: paymentIntent.description
60114
+ }
60115
+ ),
60116
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-center", children: [
60117
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60118
+ "span",
60119
+ {
60120
+ className: "uf-mr-1",
60121
+ style: {
60122
+ fontSize: `calc(${dynamicFontSize} * 0.6)`,
60123
+ color: colors2.foregroundMuted,
60124
+ fontFamily: fonts.regular
60125
+ },
60126
+ children: "$"
60127
+ }
60128
+ ),
60129
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60130
+ "span",
60131
+ {
60132
+ style: {
60133
+ fontSize: dynamicFontSize,
60134
+ color: colors2.foreground,
60135
+ fontFamily: fonts.regular,
60136
+ lineHeight: 1.1
60137
+ },
60138
+ children: amountStr
60139
+ }
60140
+ )
60141
+ ] }),
60142
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60143
+ "div",
60144
+ {
60145
+ className: "uf-text-xs",
60146
+ style: {
60147
+ color: colors2.foregroundMuted,
60148
+ fontFamily: fonts.regular
60149
+ },
60150
+ children: paymentIntent.currency.toUpperCase()
60151
+ }
60152
+ ),
60153
+ hasPartial && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-pt-2 uf-space-y-1.5", children: [
60154
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60155
+ "div",
60156
+ {
60157
+ className: "uf-w-full uf-h-1.5 uf-rounded-full uf-overflow-hidden",
60158
+ style: { backgroundColor: colors2.border },
60159
+ children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60160
+ "div",
60161
+ {
60162
+ className: "uf-h-full uf-rounded-full uf-transition-all uf-duration-500",
60163
+ style: {
60164
+ width: `${pct}%`,
60165
+ backgroundColor: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : colors2.primary
60166
+ }
60167
+ }
60168
+ )
60169
+ }
60170
+ ),
60171
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60172
+ "div",
60173
+ {
60174
+ className: "uf-text-xs",
60175
+ style: {
60176
+ color: colors2.foregroundMuted,
60177
+ fontFamily: fonts.regular
60178
+ },
60179
+ children: [
60180
+ "$",
60181
+ paymentIntent.amount_received_usd,
60182
+ " / $",
60183
+ amountStr,
60184
+ " received",
60185
+ remaining > 0 && paymentIntent.status !== "succeeded" && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("span", { style: { color: colors2.foreground, fontFamily: fonts.medium }, children: [
60186
+ " ",
60187
+ "\xB7 $",
60188
+ remaining.toFixed(2),
60189
+ " remaining"
60190
+ ] })
60191
+ ]
60192
+ }
60193
+ )
60194
+ ] }),
60195
+ paymentIntent.status !== "requires_payment" && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-pt-1", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60196
+ "span",
60197
+ {
60198
+ className: "uf-text-xs uf-font-medium uf-px-2.5 uf-py-1 uf-rounded-full uf-inline-block",
60199
+ style: {
60200
+ 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)",
60201
+ color: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : paymentIntent.status === "processing" ? "rgb(59, 130, 246)" : "rgb(239, 68, 68)",
60202
+ fontFamily: fonts.medium
60203
+ },
60204
+ children: paymentIntent.status === "succeeded" ? "Payment Complete" : paymentIntent.status === "processing" ? "Partial Payment Received" : paymentIntent.status === "canceled" ? "Canceled" : paymentIntent.status === "expired" ? "Expired" : paymentIntent.status
60205
+ }
60206
+ ) })
60207
+ ] });
60208
+ })() : null;
60209
+ return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(PortalContainerProvider, { value: null, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(Dialog2, { open, onOpenChange: handleClose, modal: true, children: [
60210
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60211
+ DialogContent2,
60212
+ {
60213
+ 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}`,
60214
+ style: { backgroundColor: colors2.background },
60215
+ onPointerDownOutside: (e) => e.preventDefault(),
60216
+ onInteractOutside: (e) => e.preventDefault(),
60217
+ children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(ThemeStyleInjector, { children: view === "main" ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
60218
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60219
+ DepositHeader,
60220
+ {
60221
+ title: modalTitle || "Checkout",
60222
+ showClose: true,
60223
+ onClose: handleClose
60224
+ }
60225
+ ),
60226
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
60227
+ piLoading ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-space-y-3", children: [
60228
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60229
+ "div",
60230
+ {
60231
+ className: "uf-rounded-xl uf-p-4 uf-animate-pulse",
60232
+ style: {
60233
+ backgroundColor: components.card.backgroundColor,
60234
+ borderRadius: components.card.borderRadius,
60235
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
60236
+ },
60237
+ children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-gap-2", children: [
60238
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60239
+ "div",
60240
+ {
60241
+ className: "uf-h-8 uf-w-24 uf-rounded",
60242
+ style: {
60243
+ backgroundColor: components.card.borderColor
60244
+ }
60245
+ }
60246
+ ),
60247
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60248
+ "div",
60249
+ {
60250
+ className: "uf-h-4 uf-w-16 uf-rounded",
60251
+ style: {
60252
+ backgroundColor: components.card.borderColor
60253
+ }
60254
+ }
60255
+ )
60256
+ ] })
60257
+ }
60258
+ ),
60259
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SkeletonButton2, {}),
60260
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SkeletonButton2, {})
60261
+ ] }) : 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: [
60262
+ /* @__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" }) }),
60263
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60264
+ "h3",
60265
+ {
60266
+ className: "uf-text-lg uf-font-semibold uf-mb-2",
60267
+ style: {
60268
+ color: colors2.foreground,
60269
+ fontFamily: fonts.semibold
60270
+ },
60271
+ children: "Unable to Load Checkout"
60272
+ }
60273
+ ),
60274
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60275
+ "p",
60276
+ {
60277
+ className: "uf-text-sm uf-max-w-[280px]",
60278
+ style: {
60279
+ color: colors2.foregroundMuted,
60280
+ fontFamily: fonts.regular
60281
+ },
60282
+ children: piError instanceof Error ? piError.message : "Something went wrong. Please try again."
60283
+ }
60284
+ )
60285
+ ] }) : paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-space-y-3", children: [
60286
+ progressSection,
60287
+ (paymentIntent.status === "requires_payment" || paymentIntent.status === "processing") && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
60288
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60289
+ TransferCryptoButton,
60290
+ {
60291
+ onClick: () => setView("transfer"),
60292
+ title: "Transfer Crypto",
60293
+ subtitle: "Send from any wallet or exchange",
60294
+ featuredTokens: projectConfig?.transfer_crypto.networks
60295
+ }
60296
+ ),
60297
+ enableConnectWallet && !isMobileView && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60298
+ BrowserWalletButton,
60299
+ {
60300
+ onClick: handleBrowserWalletClick,
60301
+ onConnectClick: handleWalletConnectClick,
60302
+ onDisconnect: handleWalletDisconnect,
60303
+ chainType: browserWalletChainType,
60304
+ publishableKey
60305
+ }
60306
+ )
60307
+ ] })
60308
+ ] }) : null,
60309
+ poweredByFooter
60310
+ ] })
60311
+ ] }) : view === "transfer" ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
60312
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60313
+ DepositHeader,
60314
+ {
60315
+ title: `Pay $${remainingAmountUsd ?? paymentIntent?.amount_usd ?? ""}`,
60316
+ showBack: true,
60317
+ onBack: handleBack,
60318
+ onClose: handleClose
60319
+ }
60320
+ ),
60321
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
60322
+ paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
60323
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60324
+ "div",
60325
+ {
60326
+ className: "uf-rounded-lg uf-px-3 uf-py-2 uf-flex uf-items-center uf-justify-between",
60327
+ style: {
60328
+ backgroundColor: components.card.backgroundColor,
60329
+ border: `${components.card.borderWidth}px solid ${components.card.borderColor}`,
60330
+ borderRadius: components.card.borderRadius
60331
+ },
60332
+ children: [
60333
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60334
+ "span",
60335
+ {
60336
+ className: "uf-text-xs",
60337
+ style: {
60338
+ color: colors2.foregroundMuted,
60339
+ fontFamily: fonts.regular
60340
+ },
60341
+ children: parseFloat(paymentIntent.amount_received_usd) > 0 ? `$${paymentIntent.amount_received_usd} / $${paymentIntent.amount_usd} received` : "Amount due"
60342
+ }
60343
+ ),
60344
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60345
+ "span",
60346
+ {
60347
+ className: "uf-text-sm uf-font-semibold",
60348
+ style: {
60349
+ color: colors2.foreground,
60350
+ fontFamily: fonts.semibold
60351
+ },
60352
+ children: [
60353
+ formatCryptoAmount(remainingCrypto ?? paymentIntent.amount),
60354
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60355
+ "span",
60356
+ {
60357
+ className: "uf-text-xs uf-font-normal uf-ml-1",
60358
+ style: { color: colors2.foregroundMuted },
60359
+ children: [
60360
+ "($",
60361
+ remainingAmountUsd ?? paymentIntent.amount_usd,
60362
+ ")"
60363
+ ]
60364
+ }
60365
+ )
60366
+ ]
60367
+ }
60368
+ )
60369
+ ]
60370
+ }
60371
+ ),
60372
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60373
+ TransferCryptoSingleInput,
60374
+ {
60375
+ userId: paymentIntent.user_id || "",
60376
+ publishableKey,
60377
+ clientSecret,
60378
+ recipientAddress: paymentIntent.recipient_address,
60379
+ destinationChainType: paymentIntent.destination_chain_type,
60380
+ destinationChainId: paymentIntent.destination_chain_id,
60381
+ destinationTokenAddress: paymentIntent.destination_token_address,
60382
+ depositConfirmationMode: "auto_ui",
60383
+ wallets,
60384
+ onSourceTokenChange: setSelectedSource,
60385
+ checkoutQuote: sourceQuote ? {
60386
+ sourceAmount: sourceQuote.source_amount,
60387
+ sourceTokenDecimals: sourceQuote.source_token_decimals,
60388
+ sourceTokenSymbol: sourceQuote.source_token_symbol,
60389
+ sourceAmountUsd: sourceQuote.source_amount_usd
60390
+ } : null
60391
+ }
60392
+ )
60393
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SkeletonButton2, {}),
60394
+ poweredByFooter
60395
+ ] })
60396
+ ] }) : null })
60397
+ }
60398
+ ),
60399
+ /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60400
+ WalletSelectionModal,
60401
+ {
60402
+ open: walletSelectionModalOpen,
60403
+ onOpenChange: setWalletSelectionModalOpen,
60404
+ onWalletConnected: handleWalletConnected,
60405
+ onClose: () => setWalletSelectionModalOpen(false),
60406
+ theme: resolvedTheme
60407
+ }
60408
+ ),
60409
+ browserWalletInfo && browserWalletInfo.depositWallet && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60410
+ BrowserWalletModal,
60411
+ {
60412
+ open: browserWalletModalOpen,
60413
+ onOpenChange: setBrowserWalletModalOpen,
60414
+ onFullClose: handleClose,
60415
+ walletInfo: browserWalletInfo,
60416
+ depositWallet: browserWalletInfo.depositWallet,
60417
+ userId: paymentIntent?.user_id || "",
60418
+ publishableKey,
60419
+ clientSecret,
60420
+ theme: resolvedTheme,
60421
+ prefillAmountUsd: remainingAmountUsd,
60422
+ checkoutAmountUsd: paymentIntent?.amount_usd,
60423
+ checkoutReceivedUsd: paymentIntent?.amount_received_usd,
60424
+ onSuccess: (txHash) => {
60425
+ onCheckoutSuccess?.({
60426
+ paymentIntentId: paymentIntent?.id || "",
60427
+ status: "processing"
60428
+ });
60429
+ },
60430
+ onError: (error) => {
60431
+ onCheckoutError?.({
60432
+ message: error.message,
60433
+ error
60434
+ });
60435
+ },
60436
+ onWalletDisconnect: handleWalletDisconnect,
60437
+ onNewDeposit: () => {
60438
+ setBrowserWalletModalOpen(false);
60439
+ setView("main");
60440
+ },
60441
+ onDone: () => {
60442
+ setBrowserWalletModalOpen(false);
60443
+ setView("main");
60444
+ },
60445
+ paymentIntentStatus: paymentIntent?.status
60446
+ }
60447
+ )
60448
+ ] }) });
60449
+ }
60450
+ function useSupportedDestinationTokens(publishableKey, enabled = true) {
60451
+ return useQuery({
60452
+ queryKey: ["unifold", "supportedDestinationTokens", publishableKey],
60453
+ queryFn: () => getSupportedDestinationTokens(publishableKey),
60454
+ staleTime: 1e3 * 60 * 5,
60455
+ gcTime: 1e3 * 60 * 30,
60456
+ refetchOnMount: false,
60457
+ refetchOnWindowFocus: false,
60458
+ enabled
60459
+ });
60460
+ }
60461
+ function useSourceTokenValidation(params) {
60462
+ const {
60463
+ sourceChainType,
60464
+ sourceChainId,
60465
+ sourceTokenAddress,
60466
+ sourceTokenSymbol,
60467
+ publishableKey,
60468
+ enabled = true
60469
+ } = params;
60470
+ const hasParams = !!sourceChainType && !!sourceChainId && !!sourceTokenAddress;
60471
+ return useQuery({
60472
+ queryKey: [
60473
+ "unifold",
60474
+ "sourceTokenValidation",
60475
+ sourceChainType ?? null,
60476
+ sourceChainId ?? null,
60477
+ sourceTokenAddress ?? null,
60478
+ publishableKey
60479
+ ],
60480
+ queryFn: async () => {
60481
+ const res = await getSupportedDepositTokens(publishableKey);
60482
+ let matchedMinUsd = null;
60483
+ let matchedProcessingTime = null;
60484
+ let matchedSlippage = null;
60485
+ let matchedPriceImpact = null;
60486
+ const found = res.data.some(
60487
+ (token) => token.chains.some((chain) => {
60488
+ const match = chain.chain_type === sourceChainType && chain.chain_id === sourceChainId && chain.token_address.toLowerCase() === sourceTokenAddress.toLowerCase();
60489
+ if (match) {
60490
+ matchedMinUsd = chain.minimum_deposit_amount_usd;
60491
+ matchedProcessingTime = chain.estimated_processing_time;
60492
+ matchedSlippage = chain.max_slippage_percent;
60493
+ matchedPriceImpact = chain.estimated_price_impact_percent;
60494
+ }
60495
+ return match;
60496
+ })
60497
+ );
60498
+ return {
60499
+ isSupported: found,
60500
+ minimumAmountUsd: matchedMinUsd,
60501
+ estimatedProcessingTime: matchedProcessingTime,
60502
+ maxSlippagePercent: matchedSlippage,
60503
+ priceImpactPercent: matchedPriceImpact,
60504
+ errorMessage: found ? null : `${sourceTokenSymbol || "Source token"} is not a supported withdrawal token. Supported tokens include USDC, USDT, and other stablecoins.`
60505
+ };
60506
+ },
60507
+ enabled: enabled && hasParams,
60508
+ staleTime: 1e3 * 60 * 5,
60509
+ gcTime: 1e3 * 60 * 30,
60510
+ refetchOnMount: false,
60511
+ refetchOnWindowFocus: false
60512
+ });
60513
+ }
60514
+ function useAddressBalance(params) {
60515
+ const {
60516
+ address,
60517
+ chainType,
60518
+ chainId,
60519
+ tokenAddress,
60520
+ publishableKey,
60521
+ enabled = true
60522
+ } = params;
60523
+ const hasParams = !!address && !!chainType && !!chainId && !!tokenAddress;
60524
+ return useQuery({
60525
+ queryKey: [
60526
+ "unifold",
60527
+ "addressBalance",
60528
+ address ?? null,
60529
+ chainType ?? null,
60530
+ chainId ?? null,
60531
+ tokenAddress ?? null,
60532
+ publishableKey
60533
+ ],
60534
+ queryFn: async () => {
60535
+ const res = await getAddressBalance(
60536
+ address,
60537
+ chainType,
60538
+ chainId,
60539
+ tokenAddress,
60540
+ publishableKey
60541
+ );
60542
+ if (res.balance) {
60543
+ const decimals = res.balance.token?.decimals ?? 6;
60544
+ const symbol = res.balance.token?.symbol ?? "";
60545
+ const baseUnit = res.balance.amount;
60546
+ const raw = BigInt(baseUnit);
60547
+ const divisor = BigInt(10 ** decimals);
60548
+ const whole = raw / divisor;
60549
+ const frac = raw % divisor;
60550
+ const fracStr = frac.toString().padStart(decimals, "0").replace(/0+$/, "");
60551
+ const balanceHuman = fracStr ? `${whole}.${fracStr}` : whole.toString();
60552
+ return {
60553
+ balanceBaseUnit: baseUnit,
60554
+ balanceHuman,
60555
+ balanceUsd: res.balance.amount_usd,
60556
+ exchangeRate: res.balance.exchange_rate,
60557
+ decimals,
60558
+ symbol
60559
+ };
60560
+ }
60561
+ return { balanceBaseUnit: "0", balanceHuman: "0", balanceUsd: "0", exchangeRate: null, decimals: 6, symbol: "" };
60562
+ },
60563
+ enabled: enabled && hasParams,
60564
+ staleTime: 1e3 * 30,
60565
+ gcTime: 1e3 * 60 * 5,
60566
+ refetchInterval: 1e3 * 30,
60567
+ refetchOnMount: "always",
60568
+ refetchOnWindowFocus: false
60569
+ });
60570
+ }
60571
+ function useExecutions(userId, publishableKey, options2) {
60572
+ const actionType = options2?.actionType ?? ActionType.Deposit;
60573
+ return useQuery({
60574
+ queryKey: ["unifold", "executions", actionType, userId, publishableKey],
60575
+ queryFn: () => queryExecutions(userId, publishableKey, actionType),
60576
+ enabled: (options2?.enabled ?? true) && !!userId,
60577
+ refetchInterval: options2?.refetchInterval ?? 3e3,
60578
+ staleTime: 0,
60579
+ gcTime: 1e3 * 60 * 5,
59482
60580
  refetchOnWindowFocus: false
59483
60581
  });
59484
60582
  }
@@ -59493,20 +60591,20 @@ function useWithdrawPolling({
59493
60591
  onWithdrawSuccess,
59494
60592
  onWithdrawError
59495
60593
  }) {
59496
- const [executions, setExecutions] = (0, import_react28.useState)([]);
59497
- const [isPolling, setIsPolling] = (0, import_react28.useState)(false);
59498
- const enabledAtRef = (0, import_react28.useRef)(/* @__PURE__ */ new Date());
59499
- const trackedRef = (0, import_react28.useRef)(/* @__PURE__ */ new Map());
59500
- const prevEnabledRef = (0, import_react28.useRef)(false);
59501
- const onSuccessRef = (0, import_react28.useRef)(onWithdrawSuccess);
59502
- const onErrorRef = (0, import_react28.useRef)(onWithdrawError);
59503
- (0, import_react28.useEffect)(() => {
60594
+ const [executions, setExecutions] = (0, import_react29.useState)([]);
60595
+ const [isPolling, setIsPolling] = (0, import_react29.useState)(false);
60596
+ const enabledAtRef = (0, import_react29.useRef)(/* @__PURE__ */ new Date());
60597
+ const trackedRef = (0, import_react29.useRef)(/* @__PURE__ */ new Map());
60598
+ const prevEnabledRef = (0, import_react29.useRef)(false);
60599
+ const onSuccessRef = (0, import_react29.useRef)(onWithdrawSuccess);
60600
+ const onErrorRef = (0, import_react29.useRef)(onWithdrawError);
60601
+ (0, import_react29.useEffect)(() => {
59504
60602
  onSuccessRef.current = onWithdrawSuccess;
59505
60603
  }, [onWithdrawSuccess]);
59506
- (0, import_react28.useEffect)(() => {
60604
+ (0, import_react29.useEffect)(() => {
59507
60605
  onErrorRef.current = onWithdrawError;
59508
60606
  }, [onWithdrawError]);
59509
- (0, import_react28.useEffect)(() => {
60607
+ (0, import_react29.useEffect)(() => {
59510
60608
  if (enabled && !prevEnabledRef.current) {
59511
60609
  enabledAtRef.current = /* @__PURE__ */ new Date();
59512
60610
  trackedRef.current.clear();
@@ -59516,7 +60614,7 @@ function useWithdrawPolling({
59516
60614
  }
59517
60615
  prevEnabledRef.current = enabled;
59518
60616
  }, [enabled]);
59519
- (0, import_react28.useEffect)(() => {
60617
+ (0, import_react29.useEffect)(() => {
59520
60618
  if (!userId || !enabled) return;
59521
60619
  const enabledAt = enabledAtRef.current;
59522
60620
  const poll = async () => {
@@ -59578,7 +60676,7 @@ function useWithdrawPolling({
59578
60676
  setIsPolling(false);
59579
60677
  };
59580
60678
  }, [userId, publishableKey, enabled]);
59581
- (0, import_react28.useEffect)(() => {
60679
+ (0, import_react29.useEffect)(() => {
59582
60680
  if (!enabled || !depositWalletId) return;
59583
60681
  const trigger = async () => {
59584
60682
  try {
@@ -59606,8 +60704,8 @@ function WithdrawDoubleInput({
59606
60704
  const isDarkMode = useTheme().themeClass.includes("uf-dark");
59607
60705
  const selectedToken = selectedTokenSymbol ? tokens.find((t11) => t11.symbol === selectedTokenSymbol) : void 0;
59608
60706
  const availableChainsForToken = selectedToken?.chains || [];
59609
- const renderTokenItem = (tokenData) => /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
59610
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60707
+ const renderTokenItem = (tokenData) => /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
60708
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59611
60709
  "img",
59612
60710
  {
59613
60711
  src: tokenData.icon_url,
@@ -59618,10 +60716,10 @@ function WithdrawDoubleInput({
59618
60716
  className: "uf-rounded-full uf-flex-shrink-0"
59619
60717
  }
59620
60718
  ),
59621
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-font-normal", children: tokenData.symbol })
60719
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs uf-font-normal", children: tokenData.symbol })
59622
60720
  ] });
59623
- const renderChainItem = (chainData) => /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
59624
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60721
+ const renderChainItem = (chainData) => /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
60722
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59625
60723
  "img",
59626
60724
  {
59627
60725
  src: chainData.icon_url,
@@ -59632,14 +60730,14 @@ function WithdrawDoubleInput({
59632
60730
  className: "uf-rounded-full uf-flex-shrink-0"
59633
60731
  }
59634
60732
  ),
59635
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-font-normal", children: chainData.chain_name })
60733
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs uf-font-normal", children: chainData.chain_name })
59636
60734
  ] });
59637
60735
  const currentChainData = selectedChainKey ? availableChainsForToken.find(
59638
60736
  (c) => getChainKey4(c.chain_id, c.chain_type) === selectedChainKey
59639
60737
  ) : void 0;
59640
- return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-grid uf-grid-cols-2 uf-gap-2.5", children: [
59641
- /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { children: [
59642
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60738
+ return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-grid uf-grid-cols-2 uf-gap-2.5", children: [
60739
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
60740
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59643
60741
  "div",
59644
60742
  {
59645
60743
  className: "uf-text-xs uf-mb-2 uf-flex uf-items-center uf-gap-1",
@@ -59647,14 +60745,14 @@ function WithdrawDoubleInput({
59647
60745
  children: t7.receiveToken
59648
60746
  }
59649
60747
  ),
59650
- /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60748
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
59651
60749
  Select2,
59652
60750
  {
59653
60751
  value: selectedTokenSymbol ?? "",
59654
60752
  onValueChange: onTokenChange,
59655
60753
  disabled: isLoading || tokens.length === 0,
59656
60754
  children: [
59657
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60755
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59658
60756
  SelectTrigger2,
59659
60757
  {
59660
60758
  className: "uf-h-10 hover:uf-opacity-90 uf-text-foreground disabled:uf-opacity-50",
@@ -59662,10 +60760,10 @@ function WithdrawDoubleInput({
59662
60760
  backgroundColor: components.card.backgroundColor,
59663
60761
  border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
59664
60762
  },
59665
- 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 }) })
60763
+ 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 }) })
59666
60764
  }
59667
60765
  ),
59668
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60766
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59669
60767
  SelectContent2,
59670
60768
  {
59671
60769
  className: "uf-bg-secondary uf-border uf-text-foreground uf-max-h-[300px]",
@@ -59673,7 +60771,7 @@ function WithdrawDoubleInput({
59673
60771
  border: `1px solid ${isDarkMode ? "rgba(255,255,255,0.15)" : "rgba(0,0,0,0.15)"}`,
59674
60772
  ...fonts.regular ? { "--uf-font-family": fonts.regular } : {}
59675
60773
  },
59676
- children: tokens.map((tokenData) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60774
+ children: tokens.map((tokenData) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59677
60775
  SelectItem2,
59678
60776
  {
59679
60777
  value: tokenData.symbol,
@@ -59688,8 +60786,8 @@ function WithdrawDoubleInput({
59688
60786
  }
59689
60787
  )
59690
60788
  ] }),
59691
- /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { children: [
59692
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60789
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
60790
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59693
60791
  "div",
59694
60792
  {
59695
60793
  className: "uf-text-xs uf-mb-2 uf-flex uf-items-center uf-gap-1",
@@ -59697,14 +60795,14 @@ function WithdrawDoubleInput({
59697
60795
  children: t7.receiveChain
59698
60796
  }
59699
60797
  ),
59700
- /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
60798
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
59701
60799
  Select2,
59702
60800
  {
59703
60801
  value: selectedChainKey ?? "",
59704
60802
  onValueChange: onChainChange,
59705
60803
  disabled: isLoading || availableChainsForToken.length === 0,
59706
60804
  children: [
59707
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60805
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59708
60806
  SelectTrigger2,
59709
60807
  {
59710
60808
  className: "uf-h-10 hover:uf-opacity-90 uf-text-foreground disabled:uf-opacity-50",
@@ -59712,10 +60810,10 @@ function WithdrawDoubleInput({
59712
60810
  backgroundColor: components.card.backgroundColor,
59713
60811
  border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
59714
60812
  },
59715
- 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 }) })
60813
+ 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 }) })
59716
60814
  }
59717
60815
  ),
59718
- /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60816
+ /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59719
60817
  SelectContent2,
59720
60818
  {
59721
60819
  align: "end",
@@ -59724,9 +60822,9 @@ function WithdrawDoubleInput({
59724
60822
  border: `1px solid ${isDarkMode ? "rgba(255,255,255,0.15)" : "rgba(0,0,0,0.15)"}`,
59725
60823
  ...fonts.regular ? { "--uf-font-family": fonts.regular } : {}
59726
60824
  },
59727
- 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) => {
60825
+ 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) => {
59728
60826
  const chainKey = getChainKey4(chainData.chain_id, chainData.chain_type);
59729
- return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
60827
+ return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
59730
60828
  SelectItem2,
59731
60829
  {
59732
60830
  value: chainKey,
@@ -59891,9 +60989,56 @@ async function sendSolanaWithdraw(params) {
59891
60989
  );
59892
60990
  return sendResponse.signature;
59893
60991
  }
60992
+ var HYPERCORE_CHAIN_ID = "1337";
60993
+ var HYPERCORE_SPOT_USDC_ADDRESS = "0x6d1e7cde53ba9467b783cb7c530ce054";
60994
+ function isHypercoreChain(chainId) {
60995
+ return chainId === HYPERCORE_CHAIN_ID;
60996
+ }
60997
+ async function sendHypercoreWithdraw(params) {
60998
+ const {
60999
+ provider,
61000
+ fromAddress,
61001
+ depositWalletAddress,
61002
+ sourceTokenAddress,
61003
+ amount,
61004
+ tokenSymbol,
61005
+ publishableKey
61006
+ } = params;
61007
+ const isSpot = sourceTokenAddress.toLowerCase() === HYPERCORE_SPOT_USDC_ADDRESS;
61008
+ const currentChainHex = await provider.request({
61009
+ method: "eth_chainId",
61010
+ params: []
61011
+ });
61012
+ const activeChainId = String(parseInt(currentChainHex, 16));
61013
+ const buildResult = await buildHypercoreTransaction(
61014
+ {
61015
+ action_type: isSpot ? "spot_send" : "usd_send",
61016
+ signature_chain_type: "ethereum",
61017
+ signature_chain_id: activeChainId,
61018
+ recipient_address: depositWalletAddress,
61019
+ token_address: sourceTokenAddress,
61020
+ token_symbol: tokenSymbol || void 0,
61021
+ amount
61022
+ },
61023
+ publishableKey
61024
+ );
61025
+ const signature = await provider.request({
61026
+ method: "eth_signTypedData_v4",
61027
+ params: [fromAddress, JSON.stringify(buildResult.typed_data)]
61028
+ });
61029
+ await sendHypercoreTransaction(
61030
+ {
61031
+ action_payload: buildResult.action_payload,
61032
+ signature,
61033
+ nonce: buildResult.nonce
61034
+ },
61035
+ publishableKey
61036
+ );
61037
+ }
59894
61038
  async function detectBrowserWallet(chainType, senderAddress) {
59895
61039
  const win = typeof window !== "undefined" ? window : null;
59896
61040
  if (!win || !senderAddress) return null;
61041
+ if (getUserDisconnectedWallet()) return null;
59897
61042
  const anyWin = win;
59898
61043
  if (chainType === "solana") {
59899
61044
  const solProviders = [];
@@ -59927,28 +61072,44 @@ async function detectBrowserWallet(chainType, senderAddress) {
59927
61072
  evmProviders.push({ provider: p, name });
59928
61073
  }
59929
61074
  };
59930
- add(anyWin.phantom?.ethereum, "Phantom");
59931
- add(anyWin.coinbaseWalletExtension, "Coinbase");
59932
- add(anyWin.trustwallet?.ethereum, "Trust Wallet");
59933
- add(anyWin.okxwallet, "OKX Wallet");
59934
- if (anyWin.__eip6963Providers) {
59935
- for (const detail of anyWin.__eip6963Providers) {
59936
- const rdns = detail.info?.rdns || "";
59937
- let name = detail.info?.name || "Wallet";
59938
- if (rdns.includes("metamask")) name = "MetaMask";
59939
- else if (rdns.includes("rabby")) name = "Rabby";
59940
- else if (rdns.includes("rainbow")) name = "Rainbow";
59941
- add(detail.provider, name);
59942
- }
59943
- }
59944
- if (win.ethereum) {
59945
- const eth = win.ethereum;
59946
- let name = "Wallet";
59947
- if (eth.isMetaMask && !eth.isPhantom && !eth.isRabby) name = "MetaMask";
59948
- else if (eth.isRabby) name = "Rabby";
59949
- else if (eth.isRainbow) name = "Rainbow";
59950
- else if (eth.isCoinbaseWallet) name = "Coinbase";
59951
- add(eth, name);
61075
+ if (!anyWin.__eip6963Providers) {
61076
+ anyWin.__eip6963Providers = [];
61077
+ }
61078
+ const handleAnnouncement = (event) => {
61079
+ const { detail } = event;
61080
+ if (!detail?.info || !detail?.provider) return;
61081
+ const exists = anyWin.__eip6963Providers.some((p) => p.info.uuid === detail.info.uuid);
61082
+ if (!exists) anyWin.__eip6963Providers.push(detail);
61083
+ };
61084
+ win.addEventListener("eip6963:announceProvider", handleAnnouncement);
61085
+ win.dispatchEvent(new Event("eip6963:requestProvider"));
61086
+ win.removeEventListener("eip6963:announceProvider", handleAnnouncement);
61087
+ for (const detail of anyWin.__eip6963Providers) {
61088
+ const rdns = detail.info?.rdns || "";
61089
+ let name = detail.info?.name || "Wallet";
61090
+ if (rdns.includes("metamask")) name = "MetaMask";
61091
+ else if (rdns.includes("phantom")) name = "Phantom";
61092
+ else if (rdns.includes("coinbase")) name = "Coinbase";
61093
+ else if (rdns.includes("rabby")) name = "Rabby";
61094
+ else if (rdns.includes("rainbow")) name = "Rainbow";
61095
+ else if (rdns.includes("okx")) name = "OKX Wallet";
61096
+ else if (rdns.includes("trust")) name = "Trust Wallet";
61097
+ add(detail.provider, name);
61098
+ }
61099
+ if (evmProviders.length === 0) {
61100
+ add(anyWin.phantom?.ethereum, "Phantom");
61101
+ add(anyWin.coinbaseWalletExtension, "Coinbase");
61102
+ add(anyWin.trustwallet?.ethereum, "Trust Wallet");
61103
+ add(anyWin.okxwallet, "OKX Wallet");
61104
+ if (evmProviders.length === 0 && win.ethereum) {
61105
+ const eth = win.ethereum;
61106
+ let name = "Wallet";
61107
+ if (eth.isMetaMask && !eth.isPhantom && !eth.isRabby) name = "MetaMask";
61108
+ else if (eth.isRabby) name = "Rabby";
61109
+ else if (eth.isRainbow) name = "Rainbow";
61110
+ else if (eth.isCoinbaseWallet) name = "Coinbase";
61111
+ add(eth, name);
61112
+ }
59952
61113
  }
59953
61114
  for (const { provider, name } of evmProviders) {
59954
61115
  try {
@@ -60001,12 +61162,9 @@ function WithdrawForm({
60001
61162
  estimatedProcessingTime,
60002
61163
  maxSlippagePercent,
60003
61164
  priceImpactPercent,
60004
- detectedWallet,
61165
+ senderAddress,
60005
61166
  sourceChainId,
60006
61167
  sourceTokenAddress,
60007
- isWalletMatch,
60008
- connectedWalletName,
60009
- canWithdraw,
60010
61168
  onWithdraw,
60011
61169
  onWithdrawError,
60012
61170
  onDepositWalletCreation,
@@ -60014,22 +61172,22 @@ function WithdrawForm({
60014
61172
  footerLeft
60015
61173
  }) {
60016
61174
  const { colors: colors2, fonts, components } = useTheme();
60017
- const [recipientAddress, setRecipientAddress] = (0, import_react29.useState)(recipientAddressProp || "");
60018
- const [amount, setAmount] = (0, import_react29.useState)("");
60019
- const [inputUnit, setInputUnit] = (0, import_react29.useState)("crypto");
60020
- const [isSubmitting, setIsSubmitting] = (0, import_react29.useState)(false);
60021
- const [submitError, setSubmitError] = (0, import_react29.useState)(null);
60022
- const [detailsExpanded, setDetailsExpanded] = (0, import_react29.useState)(false);
60023
- const [glossaryOpen, setGlossaryOpen] = (0, import_react29.useState)(false);
60024
- (0, import_react29.useEffect)(() => {
61175
+ const [recipientAddress, setRecipientAddress] = (0, import_react30.useState)(recipientAddressProp || "");
61176
+ const [amount, setAmount] = (0, import_react30.useState)("");
61177
+ const [inputUnit, setInputUnit] = (0, import_react30.useState)("crypto");
61178
+ const [isSubmitting, setIsSubmitting] = (0, import_react30.useState)(false);
61179
+ const [submitError, setSubmitError] = (0, import_react30.useState)(null);
61180
+ const [detailsExpanded, setDetailsExpanded] = (0, import_react30.useState)(false);
61181
+ const [glossaryOpen, setGlossaryOpen] = (0, import_react30.useState)(false);
61182
+ (0, import_react30.useEffect)(() => {
60025
61183
  setRecipientAddress(recipientAddressProp || "");
60026
61184
  setAmount("");
60027
61185
  setInputUnit("crypto");
60028
61186
  setSubmitError(null);
60029
61187
  }, [recipientAddressProp]);
60030
61188
  const trimmedAddress = recipientAddress.trim();
60031
- const [debouncedAddress, setDebouncedAddress] = (0, import_react29.useState)(trimmedAddress);
60032
- (0, import_react29.useEffect)(() => {
61189
+ const [debouncedAddress, setDebouncedAddress] = (0, import_react30.useState)(trimmedAddress);
61190
+ (0, import_react30.useEffect)(() => {
60033
61191
  const id = setTimeout(() => setDebouncedAddress(trimmedAddress), 500);
60034
61192
  return () => clearTimeout(id);
60035
61193
  }, [trimmedAddress]);
@@ -60046,7 +61204,7 @@ function WithdrawForm({
60046
61204
  enabled: debouncedAddress.length > 5 && !!selectedChain
60047
61205
  });
60048
61206
  const isDebouncing = trimmedAddress !== debouncedAddress;
60049
- const addressError = (0, import_react29.useMemo)(() => {
61207
+ const addressError = (0, import_react30.useMemo)(() => {
60050
61208
  if (!trimmedAddress || trimmedAddress.length <= 5) return null;
60051
61209
  if (isDebouncing || isVerifyingAddress) return null;
60052
61210
  if (verifyError) return t8.invalidAddress;
@@ -60060,47 +61218,47 @@ function WithdrawForm({
60060
61218
  return null;
60061
61219
  }, [trimmedAddress, isDebouncing, isVerifyingAddress, verifyError, addressVerification, selectedChain, selectedToken]);
60062
61220
  const isAddressValid = !isDebouncing && !!addressVerification?.valid && !addressError;
60063
- const exchangeRate = (0, import_react29.useMemo)(() => {
61221
+ const exchangeRate = (0, import_react30.useMemo)(() => {
60064
61222
  if (!balanceData?.exchangeRate) return 0;
60065
61223
  return parseFloat(balanceData.exchangeRate);
60066
61224
  }, [balanceData]);
60067
- const balanceCrypto = (0, import_react29.useMemo)(() => {
61225
+ const balanceCrypto = (0, import_react30.useMemo)(() => {
60068
61226
  if (!balanceData?.balanceHuman) return 0;
60069
61227
  return parseFloat(balanceData.balanceHuman);
60070
61228
  }, [balanceData]);
60071
- const balanceUsdNum = (0, import_react29.useMemo)(() => {
61229
+ const balanceUsdNum = (0, import_react30.useMemo)(() => {
60072
61230
  if (!balanceData?.balanceUsd) return 0;
60073
61231
  return parseFloat(balanceData.balanceUsd);
60074
61232
  }, [balanceData]);
60075
61233
  const tokenSymbol = sourceTokenSymbol || balanceData?.symbol || "TOKEN";
60076
61234
  const sourceDecimals = balanceData?.decimals ?? 6;
60077
- const cryptoAmountFromInput = (0, import_react29.useMemo)(() => {
61235
+ const cryptoAmountFromInput = (0, import_react30.useMemo)(() => {
60078
61236
  const val = parseFloat(amount);
60079
61237
  if (!val || val <= 0) return 0;
60080
61238
  if (inputUnit === "crypto") return val;
60081
61239
  return exchangeRate > 0 ? val / exchangeRate : 0;
60082
61240
  }, [amount, inputUnit, exchangeRate]);
60083
- const fiatAmountFromInput = (0, import_react29.useMemo)(() => {
61241
+ const fiatAmountFromInput = (0, import_react30.useMemo)(() => {
60084
61242
  const val = parseFloat(amount);
60085
61243
  if (!val || val <= 0) return 0;
60086
61244
  if (inputUnit === "fiat") return val;
60087
61245
  return val * exchangeRate;
60088
61246
  }, [amount, inputUnit, exchangeRate]);
60089
- const convertedDisplay = (0, import_react29.useMemo)(() => {
61247
+ const convertedDisplay = (0, import_react30.useMemo)(() => {
60090
61248
  if (!amount || parseFloat(amount) <= 0) return null;
60091
61249
  if (inputUnit === "crypto") {
60092
61250
  return `$${fiatAmountFromInput.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
60093
61251
  }
60094
61252
  return `${cryptoAmountFromInput.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 6 })} ${tokenSymbol}`;
60095
61253
  }, [amount, inputUnit, fiatAmountFromInput, cryptoAmountFromInput, tokenSymbol]);
60096
- const balanceDisplay = (0, import_react29.useMemo)(() => {
61254
+ const balanceDisplay = (0, import_react30.useMemo)(() => {
60097
61255
  if (isLoadingBalance || !balanceData) return null;
60098
61256
  if (inputUnit === "crypto") {
60099
61257
  return `${balanceCrypto.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })} ${tokenSymbol}`;
60100
61258
  }
60101
61259
  return `$${balanceUsdNum.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
60102
61260
  }, [isLoadingBalance, balanceData, inputUnit, balanceCrypto, balanceUsdNum, tokenSymbol]);
60103
- const handleSwitchUnit = (0, import_react29.useCallback)(() => {
61261
+ const handleSwitchUnit = (0, import_react30.useCallback)(() => {
60104
61262
  const val = parseFloat(amount);
60105
61263
  if (!val || val <= 0 || exchangeRate <= 0) {
60106
61264
  setInputUnit((u) => u === "crypto" ? "fiat" : "crypto");
@@ -60117,7 +61275,7 @@ function WithdrawForm({
60117
61275
  setInputUnit("crypto");
60118
61276
  }
60119
61277
  }, [amount, inputUnit, exchangeRate, sourceDecimals]);
60120
- const handleMaxClick = (0, import_react29.useCallback)(() => {
61278
+ const handleMaxClick = (0, import_react30.useCallback)(() => {
60121
61279
  if (inputUnit === "crypto") {
60122
61280
  if (balanceCrypto <= 0) return;
60123
61281
  setAmount(balanceData?.balanceHuman ?? "0");
@@ -60129,7 +61287,7 @@ function WithdrawForm({
60129
61287
  const isBelowMinimum = minimumWithdrawAmountUsd !== null && fiatAmountFromInput > 0 && fiatAmountFromInput < minimumWithdrawAmountUsd;
60130
61288
  const isOverBalance = inputUnit === "crypto" ? cryptoAmountFromInput > 0 && balanceCrypto > 0 && cryptoAmountFromInput > balanceCrypto : fiatAmountFromInput > 0 && balanceUsdNum > 0 && fiatAmountFromInput > balanceUsdNum;
60131
61289
  const isFormValid = trimmedAddress.length > 0 && amount.trim().length > 0 && cryptoAmountFromInput > 0 && isAddressValid && !isBelowMinimum && !isOverBalance && !!balanceData;
60132
- const handleWithdraw = (0, import_react29.useCallback)(async () => {
61290
+ const handleWithdraw = (0, import_react30.useCallback)(async () => {
60133
61291
  if (!selectedToken || !selectedChain) return;
60134
61292
  if (!isFormValid) return;
60135
61293
  setIsSubmitting(true);
@@ -60141,12 +61299,43 @@ function WithdrawForm({
60141
61299
  destinationTokenAddress: selectedChain.token_address,
60142
61300
  recipientAddress: trimmedAddress
60143
61301
  });
60144
- const amountBaseUnit = computeBaseUnit(
61302
+ let amountBaseUnit = computeBaseUnit(
60145
61303
  balanceData.balanceBaseUnit,
60146
61304
  parseFloat(amount),
60147
61305
  inputUnit === "crypto" ? balanceCrypto : balanceUsdNum
60148
61306
  );
60149
- const humanAmount = toSafeDecimalString(cryptoAmountFromInput, sourceDecimals);
61307
+ let humanAmount = toSafeDecimalString(cryptoAmountFromInput, sourceDecimals);
61308
+ if (isHypercoreChain(sourceChainId)) {
61309
+ try {
61310
+ const check = await checkHypercoreActivation(
61311
+ {
61312
+ source_address: senderAddress,
61313
+ recipient_address: depositWallet.address
61314
+ },
61315
+ publishableKey
61316
+ );
61317
+ if (!check.user_exists) {
61318
+ const fee = check.activation_fee;
61319
+ const maxSendable = balanceCrypto - fee;
61320
+ if (maxSendable <= 0) {
61321
+ throw new Error(
61322
+ `Insufficient balance. A ${fee} USDC activation fee is required for the first transfer to this address.`
61323
+ );
61324
+ }
61325
+ const requestedAmount = parseFloat(humanAmount);
61326
+ if (requestedAmount > maxSendable) {
61327
+ humanAmount = toSafeDecimalString(maxSendable, sourceDecimals);
61328
+ amountBaseUnit = computeBaseUnit(
61329
+ balanceData.balanceBaseUnit,
61330
+ maxSendable,
61331
+ balanceCrypto
61332
+ );
61333
+ }
61334
+ }
61335
+ } catch (e) {
61336
+ if (e instanceof Error && e.message.includes("activation fee")) throw e;
61337
+ }
61338
+ }
60150
61339
  const txInfo = {
60151
61340
  sourceChainType,
60152
61341
  sourceChainId,
@@ -60161,33 +61350,67 @@ function WithdrawForm({
60161
61350
  withdrawIntentAddress: depositWallet.address,
60162
61351
  recipientAddress: trimmedAddress
60163
61352
  };
60164
- if (detectedWallet) {
60165
- if (detectedWallet.chainFamily === "evm") {
60166
- await sendEvmWithdraw({
60167
- provider: detectedWallet.provider,
60168
- fromAddress: detectedWallet.address,
60169
- depositWalletAddress: depositWallet.address,
60170
- sourceTokenAddress,
61353
+ const wallet = await detectBrowserWallet(sourceChainType, senderAddress);
61354
+ console.log("browser wallet", wallet);
61355
+ if (wallet) {
61356
+ try {
61357
+ if (wallet.chainFamily === "evm" && isHypercoreChain(sourceChainId)) {
61358
+ await sendHypercoreWithdraw({
61359
+ provider: wallet.provider,
61360
+ fromAddress: wallet.address,
61361
+ depositWalletAddress: depositWallet.address,
61362
+ sourceTokenAddress,
61363
+ amount: humanAmount,
61364
+ tokenSymbol,
61365
+ publishableKey
61366
+ });
61367
+ } else if (wallet.chainFamily === "evm") {
61368
+ await sendEvmWithdraw({
61369
+ provider: wallet.provider,
61370
+ fromAddress: wallet.address,
61371
+ depositWalletAddress: depositWallet.address,
61372
+ sourceTokenAddress,
61373
+ sourceChainId,
61374
+ amountBaseUnit
61375
+ });
61376
+ } else if (wallet.chainFamily === "solana") {
61377
+ await sendSolanaWithdraw({
61378
+ provider: wallet.provider,
61379
+ fromAddress: wallet.address,
61380
+ depositWalletAddress: depositWallet.address,
61381
+ sourceTokenAddress,
61382
+ amountBaseUnit,
61383
+ publishableKey
61384
+ });
61385
+ }
61386
+ } catch (walletErr) {
61387
+ console.error("[Unifold] Browser wallet send failed:", walletErr, {
61388
+ wallet: `${wallet.name} (${wallet.chainFamily})`,
60171
61389
  sourceChainId,
60172
- amountBaseUnit
60173
- });
60174
- } else if (detectedWallet.chainFamily === "solana") {
60175
- await sendSolanaWithdraw({
60176
- provider: detectedWallet.provider,
60177
- fromAddress: detectedWallet.address,
60178
- depositWalletAddress: depositWallet.address,
60179
- sourceTokenAddress,
61390
+ amount: humanAmount,
60180
61391
  amountBaseUnit,
60181
- publishableKey
61392
+ depositWallet: depositWallet.address
60182
61393
  });
61394
+ throw walletErr;
60183
61395
  }
60184
61396
  } else if (onWithdraw) {
60185
- await onWithdraw(txInfo);
61397
+ try {
61398
+ await onWithdraw(txInfo);
61399
+ } catch (callbackErr) {
61400
+ console.error("[Unifold] onWithdraw callback failed:", callbackErr, {
61401
+ sourceChainId,
61402
+ amount: humanAmount,
61403
+ amountBaseUnit,
61404
+ depositWallet: depositWallet.address
61405
+ });
61406
+ throw callbackErr;
61407
+ }
60186
61408
  } else {
60187
61409
  throw new Error("No withdrawal method available. Please connect a wallet.");
60188
61410
  }
60189
61411
  onWithdrawSubmitted?.(txInfo);
60190
61412
  } catch (err) {
61413
+ console.error("[Unifold] Withdrawal failed:", err);
60191
61414
  const raw = err instanceof Error ? err.message : "Withdrawal failed. Please try again.";
60192
61415
  setSubmitError(raw.length > 120 ? "Withdrawal failed. Please try again." : raw);
60193
61416
  onWithdrawError?.({
@@ -60198,10 +61421,10 @@ function WithdrawForm({
60198
61421
  } finally {
60199
61422
  setIsSubmitting(false);
60200
61423
  }
60201
- }, [selectedToken, selectedChain, isFormValid, cryptoAmountFromInput, sourceDecimals, trimmedAddress, publishableKey, onWithdraw, detectedWallet, sourceTokenAddress, sourceChainId, onWithdrawError, onDepositWalletCreation, onWithdrawSubmitted, amount, inputUnit, balanceCrypto, balanceUsdNum, balanceData]);
60202
- return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(import_jsx_runtime72.Fragment, { children: [
60203
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
60204
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61424
+ }, [selectedToken, selectedChain, isFormValid, cryptoAmountFromInput, sourceDecimals, trimmedAddress, publishableKey, onWithdraw, sourceChainType, senderAddress, sourceTokenAddress, sourceChainId, onWithdrawError, onDepositWalletCreation, onWithdrawSubmitted, amount, inputUnit, balanceCrypto, balanceUsdNum, balanceData]);
61425
+ return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
61426
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { children: [
61427
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60205
61428
  "div",
60206
61429
  {
60207
61430
  className: "uf-text-xs uf-mb-1.5",
@@ -60209,7 +61432,7 @@ function WithdrawForm({
60209
61432
  children: t8.recipientAddress
60210
61433
  }
60211
61434
  ),
60212
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61435
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60213
61436
  "style",
60214
61437
  {
60215
61438
  dangerouslySetInnerHTML: {
@@ -60217,7 +61440,7 @@ function WithdrawForm({
60217
61440
  }
60218
61441
  }
60219
61442
  ),
60220
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
61443
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
60221
61444
  "div",
60222
61445
  {
60223
61446
  className: "uf-flex uf-items-center uf-gap-1 uf-pr-2",
@@ -60227,7 +61450,7 @@ function WithdrawForm({
60227
61450
  border: `${components.input.borderWidth}px solid ${addressError ? colors2.error : components.input.borderColor}`
60228
61451
  },
60229
61452
  children: [
60230
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61453
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60231
61454
  "input",
60232
61455
  {
60233
61456
  type: "text",
@@ -60244,7 +61467,7 @@ function WithdrawForm({
60244
61467
  }
60245
61468
  }
60246
61469
  ),
60247
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61470
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60248
61471
  "button",
60249
61472
  {
60250
61473
  type: "button",
@@ -60261,27 +61484,27 @@ function WithdrawForm({
60261
61484
  className: "uf-flex-shrink-0 uf-p-1 uf-rounded uf-transition-colors hover:uf-opacity-70",
60262
61485
  style: { color: colors2.foregroundMuted },
60263
61486
  title: "Paste from clipboard",
60264
- children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ClipboardPaste, { className: "uf-w-4 uf-h-4" })
61487
+ children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ClipboardPaste, { className: "uf-w-4 uf-h-4" })
60265
61488
  }
60266
61489
  )
60267
61490
  ]
60268
61491
  }
60269
61492
  ),
60270
- (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: [
60271
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(LoaderCircle, { className: "uf-w-3 uf-h-3 uf-animate-spin", style: { color: colors2.foregroundMuted } }),
60272
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: t8.verifyingAddress })
61493
+ (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: [
61494
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(LoaderCircle, { className: "uf-w-3 uf-h-3 uf-animate-spin", style: { color: colors2.foregroundMuted } }),
61495
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: t8.verifyingAddress })
60273
61496
  ] }),
60274
- addressError && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
60275
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(TriangleAlert, { className: "uf-w-3 uf-h-3", style: { color: colors2.error } }),
60276
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs", style: { color: colors2.error, fontFamily: fonts.regular }, children: addressError })
61497
+ addressError && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
61498
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(TriangleAlert, { className: "uf-w-3 uf-h-3", style: { color: colors2.error } }),
61499
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "uf-text-xs", style: { color: colors2.error, fontFamily: fonts.regular }, children: addressError })
60277
61500
  ] })
60278
61501
  ] }),
60279
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
60280
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-text-xs uf-mb-1.5", style: { color: components.card.labelColor, fontFamily: fonts.medium }, children: [
61502
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { children: [
61503
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-text-xs uf-mb-1.5", style: { color: components.card.labelColor, fontFamily: fonts.medium }, children: [
60281
61504
  t8.amount,
60282
- minimumWithdrawAmountUsd != null && minimumWithdrawAmountUsd > 0 && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { style: { color: colors2.warning, fontFamily: fonts.regular }, children: ` ($${minimumWithdrawAmountUsd.toFixed(2)} min)` })
61505
+ minimumWithdrawAmountUsd != null && minimumWithdrawAmountUsd > 0 && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { style: { color: colors2.warning, fontFamily: fonts.regular }, children: ` ($${minimumWithdrawAmountUsd.toFixed(2)} min)` })
60283
61506
  ] }),
60284
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61507
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60285
61508
  "style",
60286
61509
  {
60287
61510
  dangerouslySetInnerHTML: {
@@ -60289,7 +61512,7 @@ function WithdrawForm({
60289
61512
  }
60290
61513
  }
60291
61514
  ),
60292
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
61515
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
60293
61516
  "div",
60294
61517
  {
60295
61518
  className: "uf-flex uf-items-center uf-gap-2 uf-px-3 uf-py-2.5",
@@ -60299,7 +61522,7 @@ function WithdrawForm({
60299
61522
  border: `${components.input.borderWidth}px solid ${components.input.borderColor}`
60300
61523
  },
60301
61524
  children: [
60302
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61525
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60303
61526
  "input",
60304
61527
  {
60305
61528
  type: "text",
@@ -60320,8 +61543,8 @@ function WithdrawForm({
60320
61543
  }
60321
61544
  }
60322
61545
  ),
60323
- /* @__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" }),
60324
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61546
+ /* @__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" }),
61547
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60325
61548
  "button",
60326
61549
  {
60327
61550
  type: "button",
@@ -60334,10 +61557,10 @@ function WithdrawForm({
60334
61557
  ]
60335
61558
  }
60336
61559
  ),
60337
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-mt-1.5 uf-px-3", children: [
60338
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
60339
- /* @__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}`) }),
60340
- exchangeRate > 0 && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61560
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-mt-1.5 uf-px-3", children: [
61561
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
61562
+ /* @__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}`) }),
61563
+ exchangeRate > 0 && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60341
61564
  "button",
60342
61565
  {
60343
61566
  type: "button",
@@ -60345,49 +61568,49 @@ function WithdrawForm({
60345
61568
  className: "uf-p-0.5 uf-rounded uf-transition-colors hover:uf-opacity-70",
60346
61569
  style: { color: colors2.foregroundMuted },
60347
61570
  title: "Switch unit",
60348
- children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ArrowUpDown, { className: "uf-w-3 uf-h-3" })
61571
+ children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ArrowUpDown, { className: "uf-w-3 uf-h-3" })
60349
61572
  }
60350
61573
  )
60351
61574
  ] }),
60352
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
60353
- balanceDisplay && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: [
61575
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { children: [
61576
+ balanceDisplay && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: [
60354
61577
  t8.balance,
60355
61578
  ": ",
60356
61579
  balanceDisplay
60357
61580
  ] }),
60358
- isLoadingBalance && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: "uf-h-3 uf-w-16 uf-bg-muted uf-rounded uf-animate-pulse" })
61581
+ isLoadingBalance && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "uf-h-3 uf-w-16 uf-bg-muted uf-rounded uf-animate-pulse" })
60359
61582
  ] })
60360
61583
  ] })
60361
61584
  ] }),
60362
- /* @__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: [
60363
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
61585
+ /* @__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: [
61586
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
60364
61587
  "button",
60365
61588
  {
60366
61589
  type: "button",
60367
61590
  onClick: () => setDetailsExpanded(!detailsExpanded),
60368
61591
  className: "uf-w-full uf-flex uf-items-center uf-justify-between uf-py-2.5",
60369
61592
  children: [
60370
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
60371
- /* @__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 } }) }),
60372
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
61593
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
61594
+ /* @__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 } }) }),
61595
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
60373
61596
  tCrypto.processingTime.label,
60374
61597
  ":",
60375
61598
  " ",
60376
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: formatProcessingTime2(estimatedProcessingTime) })
61599
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: formatProcessingTime2(estimatedProcessingTime) })
60377
61600
  ] })
60378
61601
  ] }),
60379
- 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 } })
61602
+ 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 } })
60380
61603
  ]
60381
61604
  }
60382
61605
  ),
60383
- detailsExpanded && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-pb-3 uf-space-y-2.5", children: [
60384
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
60385
- /* @__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 } }) }),
60386
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
61606
+ detailsExpanded && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-pb-3 uf-space-y-2.5", children: [
61607
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
61608
+ /* @__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 } }) }),
61609
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
60387
61610
  tCrypto.slippage.label,
60388
61611
  ":",
60389
61612
  " ",
60390
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
61613
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
60391
61614
  tCrypto.slippage.auto,
60392
61615
  " \u2022 ",
60393
61616
  (maxSlippagePercent ?? 0.25).toFixed(2),
@@ -60395,13 +61618,13 @@ function WithdrawForm({
60395
61618
  ] })
60396
61619
  ] })
60397
61620
  ] }),
60398
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
60399
- /* @__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 } }) }),
60400
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
61621
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
61622
+ /* @__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 } }) }),
61623
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
60401
61624
  tCrypto.priceImpact.label,
60402
61625
  ":",
60403
61626
  " ",
60404
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
61627
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
60405
61628
  (priceImpactPercent ?? 0).toFixed(2),
60406
61629
  "%"
60407
61630
  ] })
@@ -60409,23 +61632,12 @@ function WithdrawForm({
60409
61632
  ] })
60410
61633
  ] })
60411
61634
  ] }),
60412
- !canWithdraw && !submitError && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
60413
- "div",
60414
- {
60415
- className: "uf-flex uf-items-start uf-gap-2.5 uf-p-3 uf-rounded-xl",
60416
- style: { backgroundColor: colors2.card, border: `1px solid ${colors2.border}` },
60417
- children: [
60418
- /* @__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 } }),
60419
- /* @__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." })
60420
- ]
60421
- }
60422
- ),
60423
- isWalletMatch && connectedWalletName ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61635
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60424
61636
  "button",
60425
61637
  {
60426
61638
  type: "button",
60427
61639
  onClick: handleWithdraw,
60428
- disabled: !isFormValid || !canWithdraw || isSubmitting || !selectedToken || !selectedChain,
61640
+ disabled: !isFormValid || isSubmitting || !selectedToken || !selectedChain,
60429
61641
  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",
60430
61642
  style: {
60431
61643
  backgroundColor: colors2.primary,
@@ -60434,40 +61646,20 @@ function WithdrawForm({
60434
61646
  borderRadius: components.button.borderRadius,
60435
61647
  border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
60436
61648
  },
60437
- children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(import_jsx_runtime72.Fragment, { children: [
60438
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
61649
+ children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
61650
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
60439
61651
  "Processing..."
60440
- ] }) : 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: [
60441
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Wallet, { className: "uf-w-4 uf-h-4" }),
60442
- "Withdraw from ",
60443
- connectedWalletName
61652
+ ] }) : 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: [
61653
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Wallet, { className: "uf-w-4 uf-h-4" }),
61654
+ t8.withdraw
60444
61655
  ] })
60445
61656
  }
60446
- ) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
60447
- "button",
60448
- {
60449
- type: "button",
60450
- onClick: handleWithdraw,
60451
- disabled: !isFormValid || !canWithdraw || isSubmitting || !selectedToken || !selectedChain,
60452
- 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",
60453
- style: {
60454
- backgroundColor: colors2.primary,
60455
- color: colors2.primaryForeground,
60456
- fontFamily: fonts.medium,
60457
- borderRadius: components.button.borderRadius,
60458
- border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
60459
- },
60460
- children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2", children: [
60461
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
60462
- "Processing..."
60463
- ] }) : isOverBalance ? "Insufficient balance" : isBelowMinimum ? "Minimum amount not met" : submitError ? "Withdrawal failed. Try again" : t8.withdraw
60464
- }
60465
61657
  ),
60466
- /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-text-xs uf-pt-1", children: [
60467
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { children: footerLeft }),
60468
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DepositFooterLinks, { onGlossaryClick: () => setGlossaryOpen(true) })
61658
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-text-xs uf-pt-1", children: [
61659
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { children: footerLeft }),
61660
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(DepositFooterLinks, { onGlossaryClick: () => setGlossaryOpen(true) })
60469
61661
  ] }),
60470
- /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
61662
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
60471
61663
  GlossaryModal,
60472
61664
  {
60473
61665
  open: glossaryOpen,
@@ -60513,7 +61705,7 @@ function WithdrawExecutionItem({
60513
61705
  return "$0.00";
60514
61706
  }
60515
61707
  };
60516
- return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
61708
+ return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
60517
61709
  "button",
60518
61710
  {
60519
61711
  onClick,
@@ -60524,8 +61716,8 @@ function WithdrawExecutionItem({
60524
61716
  border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
60525
61717
  },
60526
61718
  children: [
60527
- /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-relative uf-flex-shrink-0 uf-w-9 uf-h-9", children: [
60528
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61719
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "uf-relative uf-flex-shrink-0 uf-w-9 uf-h-9", children: [
61720
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60529
61721
  "img",
60530
61722
  {
60531
61723
  src: execution.destination_token_metadata?.icon_url || getIconUrl("/icons/tokens/svg/usdc.svg"),
@@ -60536,12 +61728,12 @@ function WithdrawExecutionItem({
60536
61728
  className: "uf-rounded-full uf-w-9 uf-h-9"
60537
61729
  }
60538
61730
  ),
60539
- isPending ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61731
+ isPending ? /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60540
61732
  "div",
60541
61733
  {
60542
61734
  className: "uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-rounded-full uf-p-0.5",
60543
61735
  style: { backgroundColor: colors2.warning },
60544
- children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61736
+ children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60545
61737
  "svg",
60546
61738
  {
60547
61739
  width: "10",
@@ -60549,7 +61741,7 @@ function WithdrawExecutionItem({
60549
61741
  viewBox: "0 0 12 12",
60550
61742
  fill: "none",
60551
61743
  className: "uf-animate-spin uf-block",
60552
- children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61744
+ children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60553
61745
  "path",
60554
61746
  {
60555
61747
  d: "M6 1V3M6 9V11M1 6H3M9 6H11M2.5 2.5L4 4M8 8L9.5 9.5M2.5 9.5L4 8M8 4L9.5 2.5",
@@ -60561,12 +61753,12 @@ function WithdrawExecutionItem({
60561
61753
  }
60562
61754
  )
60563
61755
  }
60564
- ) : /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61756
+ ) : /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60565
61757
  "div",
60566
61758
  {
60567
61759
  className: "uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-rounded-full uf-p-0.5",
60568
61760
  style: { backgroundColor: colors2.success },
60569
- children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61761
+ children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60570
61762
  "svg",
60571
61763
  {
60572
61764
  width: "10",
@@ -60574,7 +61766,7 @@ function WithdrawExecutionItem({
60574
61766
  viewBox: "0 0 12 12",
60575
61767
  fill: "none",
60576
61768
  className: "uf-block",
60577
- children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61769
+ children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60578
61770
  "path",
60579
61771
  {
60580
61772
  d: "M10 3L4.5 8.5L2 6",
@@ -60589,8 +61781,8 @@ function WithdrawExecutionItem({
60589
61781
  }
60590
61782
  )
60591
61783
  ] }),
60592
- /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex-1 uf-min-w-0", children: [
60593
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61784
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "uf-flex-1 uf-min-w-0", children: [
61785
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60594
61786
  "h3",
60595
61787
  {
60596
61788
  className: "uf-font-medium uf-text-sm uf-leading-tight",
@@ -60601,7 +61793,7 @@ function WithdrawExecutionItem({
60601
61793
  children: isPending ? "Withdrawal processing" : "Withdrawal completed"
60602
61794
  }
60603
61795
  ),
60604
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61796
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60605
61797
  "p",
60606
61798
  {
60607
61799
  className: "uf-text-xs uf-leading-tight",
@@ -60613,7 +61805,7 @@ function WithdrawExecutionItem({
60613
61805
  }
60614
61806
  )
60615
61807
  ] }),
60616
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61808
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60617
61809
  "span",
60618
61810
  {
60619
61811
  className: "uf-font-medium uf-text-sm uf-flex-shrink-0",
@@ -60624,7 +61816,7 @@ function WithdrawExecutionItem({
60624
61816
  children: formatUsdAmount2(execution.source_amount_usd || "0")
60625
61817
  }
60626
61818
  ),
60627
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
61819
+ /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
60628
61820
  ChevronRight,
60629
61821
  {
60630
61822
  className: "uf-w-4 uf-h-4 uf-flex-shrink-0",
@@ -60647,9 +61839,9 @@ function WithdrawConfirmingView({
60647
61839
  onViewTracker
60648
61840
  }) {
60649
61841
  const { colors: colors2, fonts, components } = useTheme();
60650
- const [showButton, setShowButton] = (0, import_react30.useState)(false);
61842
+ const [showButton, setShowButton] = (0, import_react31.useState)(false);
60651
61843
  const latestExecution = executions.length > 0 ? executions[executions.length - 1] : null;
60652
- (0, import_react30.useEffect)(() => {
61844
+ (0, import_react31.useEffect)(() => {
60653
61845
  if (latestExecution) return;
60654
61846
  const timer = setTimeout(() => setShowButton(true), SHOW_BUTTON_DELAY_MS);
60655
61847
  return () => clearTimeout(timer);
@@ -60657,11 +61849,11 @@ function WithdrawConfirmingView({
60657
61849
  const btnRadius = components.button.borderRadius;
60658
61850
  const btnBorder = `${components.button.borderWidth}px solid ${components.button.borderColor}`;
60659
61851
  if (latestExecution) {
60660
- return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
60661
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DepositHeader, { title: "Withdrawal Details", showClose: true, onClose }),
60662
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DepositDetailContent, { execution: latestExecution, variant: "withdraw" }),
60663
- /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "uf-flex uf-gap-2 uf-px-2 uf-pt-2", children: [
60664
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61852
+ return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
61853
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal Details", showClose: true, onClose }),
61854
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositDetailContent, { execution: latestExecution, variant: "withdraw" }),
61855
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "uf-flex uf-gap-2 uf-px-2 uf-pt-2", children: [
61856
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60665
61857
  "button",
60666
61858
  {
60667
61859
  type: "button",
@@ -60677,7 +61869,7 @@ function WithdrawConfirmingView({
60677
61869
  children: "Withdrawal History"
60678
61870
  }
60679
61871
  ),
60680
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61872
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60681
61873
  "button",
60682
61874
  {
60683
61875
  type: "button",
@@ -60694,7 +61886,7 @@ function WithdrawConfirmingView({
60694
61886
  }
60695
61887
  )
60696
61888
  ] }),
60697
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61889
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60698
61890
  PoweredByUnifold,
60699
61891
  {
60700
61892
  color: colors2.foregroundMuted,
@@ -60703,15 +61895,15 @@ function WithdrawConfirmingView({
60703
61895
  ) })
60704
61896
  ] });
60705
61897
  }
60706
- return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
60707
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DepositHeader, { title: "Withdrawal Status", showClose: true, onClose }),
60708
- /* @__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: [
60709
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61898
+ return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
61899
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal Status", showClose: true, onClose }),
61900
+ /* @__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: [
61901
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60710
61902
  "div",
60711
61903
  {
60712
61904
  className: "uf-w-20 uf-h-20 uf-rounded-full uf-flex uf-items-center uf-justify-center uf-mb-6",
60713
61905
  style: { backgroundColor: `${colors2.primary}20` },
60714
- children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61906
+ children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60715
61907
  "svg",
60716
61908
  {
60717
61909
  width: "40",
@@ -60719,7 +61911,7 @@ function WithdrawConfirmingView({
60719
61911
  viewBox: "0 0 24 24",
60720
61912
  fill: "none",
60721
61913
  className: "uf-animate-spin",
60722
- children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61914
+ children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60723
61915
  "path",
60724
61916
  {
60725
61917
  d: "M21 12a9 9 0 1 1-6.22-8.56",
@@ -60732,7 +61924,7 @@ function WithdrawConfirmingView({
60732
61924
  )
60733
61925
  }
60734
61926
  ),
60735
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61927
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60736
61928
  "h3",
60737
61929
  {
60738
61930
  className: "uf-text-xl uf-mb-2",
@@ -60740,7 +61932,7 @@ function WithdrawConfirmingView({
60740
61932
  children: "Checking Withdrawal"
60741
61933
  }
60742
61934
  ),
60743
- /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
61935
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
60744
61936
  "p",
60745
61937
  {
60746
61938
  className: "uf-text-sm uf-text-center",
@@ -60756,7 +61948,7 @@ function WithdrawConfirmingView({
60756
61948
  }
60757
61949
  )
60758
61950
  ] }),
60759
- showButton && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "uf-px-1 uf-pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61951
+ showButton && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-px-1 uf-pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60760
61952
  "button",
60761
61953
  {
60762
61954
  type: "button",
@@ -60772,7 +61964,7 @@ function WithdrawConfirmingView({
60772
61964
  children: "Withdrawal History"
60773
61965
  }
60774
61966
  ) }),
60775
- /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
61967
+ /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
60776
61968
  PoweredByUnifold,
60777
61969
  {
60778
61970
  color: colors2.foregroundMuted,
@@ -60802,14 +61994,14 @@ function WithdrawModal({
60802
61994
  hideOverlay = false
60803
61995
  }) {
60804
61996
  const { colors: colors2, fonts, components } = useTheme();
60805
- const [containerEl, setContainerEl] = (0, import_react27.useState)(null);
60806
- const containerCallbackRef = (0, import_react27.useCallback)((el) => {
61997
+ const [containerEl, setContainerEl] = (0, import_react28.useState)(null);
61998
+ const containerCallbackRef = (0, import_react28.useCallback)((el) => {
60807
61999
  setContainerEl(el);
60808
62000
  }, []);
60809
- const [resolvedTheme, setResolvedTheme] = (0, import_react27.useState)(
62001
+ const [resolvedTheme, setResolvedTheme] = (0, import_react28.useState)(
60810
62002
  theme === "auto" ? "dark" : theme
60811
62003
  );
60812
- (0, import_react27.useEffect)(() => {
62004
+ (0, import_react28.useEffect)(() => {
60813
62005
  if (theme === "auto") {
60814
62006
  const mq = window.matchMedia("(prefers-color-scheme: dark)");
60815
62007
  setResolvedTheme(mq.matches ? "dark" : "light");
@@ -60838,28 +62030,12 @@ function WithdrawModal({
60838
62030
  publishableKey,
60839
62031
  enabled: open
60840
62032
  });
60841
- const [selectedToken, setSelectedToken] = (0, import_react27.useState)(null);
60842
- const [selectedChain, setSelectedChain] = (0, import_react27.useState)(null);
60843
- const [detectedWallet, setDetectedWallet] = (0, import_react27.useState)(null);
60844
- const connectedWalletName = detectedWallet?.name ?? null;
60845
- const isWalletMatch = !!detectedWallet;
60846
- (0, import_react27.useEffect)(() => {
60847
- if (!senderAddress || !open) {
60848
- setDetectedWallet(null);
60849
- return;
60850
- }
60851
- let cancelled = false;
60852
- detectBrowserWallet(sourceChainType, senderAddress).then((wallet) => {
60853
- if (!cancelled) setDetectedWallet(wallet);
60854
- });
60855
- return () => {
60856
- cancelled = true;
60857
- };
60858
- }, [senderAddress, sourceChainType, open]);
60859
- const [view, setView] = (0, import_react27.useState)("form");
60860
- const [withdrawDepositWalletId, setWithdrawDepositWalletId] = (0, import_react27.useState)();
60861
- const [selectedExecution, setSelectedExecution] = (0, import_react27.useState)(null);
60862
- const [submittedTxInfo, setSubmittedTxInfo] = (0, import_react27.useState)(null);
62033
+ const [selectedToken, setSelectedToken] = (0, import_react28.useState)(null);
62034
+ const [selectedChain, setSelectedChain] = (0, import_react28.useState)(null);
62035
+ const [view, setView] = (0, import_react28.useState)("form");
62036
+ const [withdrawDepositWalletId, setWithdrawDepositWalletId] = (0, import_react28.useState)();
62037
+ const [selectedExecution, setSelectedExecution] = (0, import_react28.useState)(null);
62038
+ const [submittedTxInfo, setSubmittedTxInfo] = (0, import_react28.useState)(null);
60863
62039
  const { executions: realtimeExecutions } = useWithdrawPolling({
60864
62040
  userId: externalUserId,
60865
62041
  publishableKey,
@@ -60874,7 +62050,7 @@ function WithdrawModal({
60874
62050
  refetchInterval: view === "tracker" || view === "detail" ? 5e3 : 15e3
60875
62051
  });
60876
62052
  const allWithdrawals = allWithdrawalsData?.data ?? [];
60877
- const handleDepositWalletCreation = (0, import_react27.useCallback)(async (params) => {
62053
+ const handleDepositWalletCreation = (0, import_react28.useCallback)(async (params) => {
60878
62054
  const { data: wallets } = await createDepositAddress(
60879
62055
  {
60880
62056
  external_user_id: externalUserId,
@@ -60893,11 +62069,11 @@ function WithdrawModal({
60893
62069
  setWithdrawDepositWalletId(depositWallet.id);
60894
62070
  return depositWallet;
60895
62071
  }, [externalUserId, publishableKey, sourceChainType]);
60896
- const handleWithdrawSubmitted = (0, import_react27.useCallback)((txInfo) => {
62072
+ const handleWithdrawSubmitted = (0, import_react28.useCallback)((txInfo) => {
60897
62073
  setSubmittedTxInfo(txInfo);
60898
62074
  setView("confirming");
60899
62075
  }, []);
60900
- (0, import_react27.useEffect)(() => {
62076
+ (0, import_react28.useEffect)(() => {
60901
62077
  if (!destinationTokens.length || selectedToken) return;
60902
62078
  const first = destinationTokens[0];
60903
62079
  if (first?.chains.length > 0) {
@@ -60905,8 +62081,8 @@ function WithdrawModal({
60905
62081
  setSelectedChain(first.chains[0]);
60906
62082
  }
60907
62083
  }, [destinationTokens, selectedToken]);
60908
- const resetViewTimeoutRef = (0, import_react27.useRef)(null);
60909
- const handleClose = (0, import_react27.useCallback)(() => {
62084
+ const resetViewTimeoutRef = (0, import_react28.useRef)(null);
62085
+ const handleClose = (0, import_react28.useCallback)(() => {
60910
62086
  onOpenChange(false);
60911
62087
  if (resetViewTimeoutRef.current) clearTimeout(resetViewTimeoutRef.current);
60912
62088
  resetViewTimeoutRef.current = setTimeout(() => {
@@ -60919,7 +62095,7 @@ function WithdrawModal({
60919
62095
  resetViewTimeoutRef.current = null;
60920
62096
  }, 200);
60921
62097
  }, [onOpenChange]);
60922
- (0, import_react27.useLayoutEffect)(() => {
62098
+ (0, import_react28.useLayoutEffect)(() => {
60923
62099
  if (!open) return;
60924
62100
  if (resetViewTimeoutRef.current) {
60925
62101
  clearTimeout(resetViewTimeoutRef.current);
@@ -60932,26 +62108,25 @@ function WithdrawModal({
60932
62108
  setSubmittedTxInfo(null);
60933
62109
  setWithdrawDepositWalletId(void 0);
60934
62110
  }, [open]);
60935
- (0, import_react27.useEffect)(() => () => {
62111
+ (0, import_react28.useEffect)(() => () => {
60936
62112
  if (resetViewTimeoutRef.current) clearTimeout(resetViewTimeoutRef.current);
60937
62113
  }, []);
60938
- const handleTokenSymbolChange = (0, import_react27.useCallback)((symbol) => {
62114
+ const handleTokenSymbolChange = (0, import_react28.useCallback)((symbol) => {
60939
62115
  const tok = destinationTokens.find((t11) => t11.symbol === symbol);
60940
62116
  if (tok) {
60941
62117
  setSelectedToken(tok);
60942
62118
  if (tok.chains.length > 0) setSelectedChain(tok.chains[0]);
60943
62119
  }
60944
62120
  }, [destinationTokens]);
60945
- const handleChainKeyChange = (0, import_react27.useCallback)((chainKey) => {
62121
+ const handleChainKeyChange = (0, import_react28.useCallback)((chainKey) => {
60946
62122
  if (!selectedToken) return;
60947
62123
  const chain = selectedToken.chains.find((c) => getChainKey5(c.chain_id, c.chain_type) === chainKey);
60948
62124
  if (chain) setSelectedChain(chain);
60949
62125
  }, [selectedToken]);
60950
62126
  const isSourceSupported = sourceValidation?.isSupported ?? null;
60951
- const canWithdraw = !!onWithdraw || isWalletMatch;
60952
62127
  const isAnyLoading = tokensLoading || isCheckingSourceToken;
60953
- 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" }) });
60954
- 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)(
62128
+ 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" }) });
62129
+ 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)(
60955
62130
  DialogContent2,
60956
62131
  {
60957
62132
  ref: hideOverlay ? containerCallbackRef : void 0,
@@ -60960,7 +62135,7 @@ function WithdrawModal({
60960
62135
  style: { backgroundColor: colors2.background },
60961
62136
  onPointerDownOutside: (e) => e.preventDefault(),
60962
62137
  onInteractOutside: (e) => e.preventDefault(),
60963
- children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ThemeStyleInjector, { children: view === "confirming" && submittedTxInfo ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
62138
+ children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(ThemeStyleInjector, { children: view === "confirming" && submittedTxInfo ? /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
60964
62139
  WithdrawConfirmingView,
60965
62140
  {
60966
62141
  txInfo: submittedTxInfo,
@@ -60968,18 +62143,18 @@ function WithdrawModal({
60968
62143
  onClose: handleClose,
60969
62144
  onViewTracker: () => setView("tracker")
60970
62145
  }
60971
- ) : view === "detail" && selectedExecution ? /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
60972
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal Details", showBack: true, showClose: !hideOverlay, onBack: () => {
62146
+ ) : view === "detail" && selectedExecution ? /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
62147
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositHeader, { title: "Withdrawal Details", showBack: true, showClose: !hideOverlay, onBack: () => {
60973
62148
  setSelectedExecution(null);
60974
62149
  setView("tracker");
60975
62150
  }, onClose: handleClose }),
60976
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositDetailContent, { execution: selectedExecution, variant: "withdraw" }),
62151
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositDetailContent, { execution: selectedExecution, variant: "withdraw" }),
60977
62152
  withdrawPoweredByFooter
60978
62153
  ] }) : view === "tracker" ? (
60979
62154
  /* ---------- Tracker view: execution list ---------- */
60980
- /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
60981
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal History", showBack: true, showClose: !hideOverlay, onBack: () => setView("form"), onClose: handleClose }),
60982
- /* @__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)(
62155
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
62156
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositHeader, { title: "Withdrawal History", showBack: true, showClose: !hideOverlay, onBack: () => setView("form"), onClose: handleClose }),
62157
+ /* @__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)(
60983
62158
  WithdrawExecutionItem,
60984
62159
  {
60985
62160
  execution: ex,
@@ -60989,20 +62164,20 @@ function WithdrawModal({
60989
62164
  }
60990
62165
  },
60991
62166
  ex.id
60992
- )) }),
62167
+ )) }) }),
60993
62168
  withdrawPoweredByFooter
60994
62169
  ] })
60995
62170
  ) : (
60996
62171
  /* ---------- Form view (default) ---------- */
60997
- /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
60998
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: modalTitle || t9.title, showClose: !hideOverlay, onClose: handleClose }),
60999
- /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-3", children: [
61000
- 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: [
61001
- /* @__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" }) }),
61002
- /* @__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" }),
61003
- /* @__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 })
61004
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
61005
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
62172
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
62173
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositHeader, { title: modalTitle || t9.title, showClose: !hideOverlay, onClose: handleClose }),
62174
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-3", children: [
62175
+ 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: [
62176
+ /* @__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" }) }),
62177
+ /* @__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" }),
62178
+ /* @__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 })
62179
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
62180
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
61006
62181
  WithdrawDoubleInput,
61007
62182
  {
61008
62183
  tokens: destinationTokens,
@@ -61013,7 +62188,7 @@ function WithdrawModal({
61013
62188
  isLoading: tokensLoading
61014
62189
  }
61015
62190
  ),
61016
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
62191
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
61017
62192
  WithdrawForm,
61018
62193
  {
61019
62194
  publishableKey,
@@ -61029,26 +62204,23 @@ function WithdrawModal({
61029
62204
  estimatedProcessingTime: sourceValidation?.estimatedProcessingTime ?? null,
61030
62205
  maxSlippagePercent: sourceValidation?.maxSlippagePercent ?? null,
61031
62206
  priceImpactPercent: sourceValidation?.priceImpactPercent ?? null,
61032
- detectedWallet,
62207
+ senderAddress,
61033
62208
  sourceChainId,
61034
62209
  sourceTokenAddress,
61035
- isWalletMatch,
61036
- connectedWalletName,
61037
- canWithdraw,
61038
62210
  onWithdraw,
61039
62211
  onWithdrawError,
61040
62212
  onDepositWalletCreation: handleDepositWalletCreation,
61041
62213
  onWithdrawSubmitted: handleWithdrawSubmitted,
61042
- footerLeft: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
62214
+ footerLeft: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
61043
62215
  "button",
61044
62216
  {
61045
62217
  onClick: () => setView("tracker"),
61046
62218
  className: "uf-flex uf-items-center uf-gap-1 uf-transition-colors hover:uf-opacity-70",
61047
62219
  style: { color: colors2.foregroundMuted },
61048
62220
  children: [
61049
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Clock, { className: "uf-w-3.5 uf-h-3.5" }),
62221
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Clock, { className: "uf-w-3.5 uf-h-3.5" }),
61050
62222
  "Withdrawal History",
61051
- /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ChevronRight, { className: "uf-w-3 uf-h-3" })
62223
+ /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(ChevronRight, { className: "uf-w-3 uf-h-3" })
61052
62224
  ]
61053
62225
  }
61054
62226
  )
@@ -61072,6 +62244,10 @@ function UnifoldProvider2({
61072
62244
  const [depositConfig, setDepositConfig] = (0, import_react.useState)(
61073
62245
  null
61074
62246
  );
62247
+ const [isCheckoutOpen, setIsCheckoutOpen] = (0, import_react.useState)(false);
62248
+ const [checkoutConfig, setCheckoutConfig] = (0, import_react.useState)(
62249
+ null
62250
+ );
61075
62251
  const [isWithdrawOpen, setIsWithdrawOpen] = (0, import_react.useState)(false);
61076
62252
  const [withdrawConfig, setWithdrawConfig] = (0, import_react.useState)(
61077
62253
  null
@@ -61171,6 +62347,75 @@ function UnifoldProvider2({
61171
62347
  depositPromiseRef.current = null;
61172
62348
  }
61173
62349
  }, [depositConfig]);
62350
+ const checkoutPromiseRef = import_react.default.useRef(null);
62351
+ const checkoutConfigRef = import_react.default.useRef(null);
62352
+ checkoutConfigRef.current = checkoutConfig;
62353
+ const checkoutCloseTimeoutRef = import_react.default.useRef(null);
62354
+ const checkoutCloseGuardRef = import_react.default.useRef(false);
62355
+ const beginCheckout = (0, import_react.useCallback)((config2) => {
62356
+ if (checkoutCloseTimeoutRef.current) {
62357
+ clearTimeout(checkoutCloseTimeoutRef.current);
62358
+ checkoutCloseTimeoutRef.current = null;
62359
+ }
62360
+ checkoutCloseGuardRef.current = false;
62361
+ if (checkoutPromiseRef.current) {
62362
+ console.warn("[UnifoldProvider] A checkout is already in progress. Cancelling previous checkout.");
62363
+ checkoutPromiseRef.current.reject({
62364
+ message: "Checkout cancelled - new checkout started",
62365
+ code: "CHECKOUT_SUPERSEDED"
62366
+ });
62367
+ checkoutPromiseRef.current = null;
62368
+ }
62369
+ const promise = new Promise((resolve, reject) => {
62370
+ checkoutPromiseRef.current = { resolve, reject };
62371
+ });
62372
+ promise.catch(() => {
62373
+ });
62374
+ setCheckoutConfig(config2);
62375
+ setIsCheckoutOpen(true);
62376
+ return promise;
62377
+ }, []);
62378
+ const closeCheckout = (0, import_react.useCallback)(() => {
62379
+ if (checkoutCloseGuardRef.current) {
62380
+ return;
62381
+ }
62382
+ checkoutCloseGuardRef.current = true;
62383
+ const promiseToReject = checkoutPromiseRef.current;
62384
+ checkoutPromiseRef.current = null;
62385
+ if (checkoutConfigRef.current?.onClose) {
62386
+ checkoutConfigRef.current.onClose();
62387
+ }
62388
+ if (promiseToReject) {
62389
+ promiseToReject.reject({
62390
+ message: "Checkout cancelled by user",
62391
+ code: "CHECKOUT_CANCELLED"
62392
+ });
62393
+ }
62394
+ setIsCheckoutOpen(false);
62395
+ checkoutCloseTimeoutRef.current = setTimeout(() => {
62396
+ setCheckoutConfig(null);
62397
+ checkoutCloseTimeoutRef.current = null;
62398
+ }, 200);
62399
+ }, []);
62400
+ const handleCheckoutSuccess = (0, import_react.useCallback)((data) => {
62401
+ if (checkoutConfig?.onSuccess) {
62402
+ checkoutConfig.onSuccess(data);
62403
+ }
62404
+ if (checkoutPromiseRef.current) {
62405
+ checkoutPromiseRef.current.resolve(data);
62406
+ checkoutPromiseRef.current = null;
62407
+ }
62408
+ }, [checkoutConfig]);
62409
+ const handleCheckoutError = (0, import_react.useCallback)((error) => {
62410
+ console.error("[UnifoldProvider] Checkout error:", error);
62411
+ if (checkoutConfig?.onError) {
62412
+ checkoutConfig.onError(error);
62413
+ }
62414
+ if (checkoutPromiseRef.current) {
62415
+ checkoutPromiseRef.current.reject(error);
62416
+ checkoutPromiseRef.current = null;
62417
+ }
62418
+ }, [checkoutConfig]);
61174
62419
  const beginWithdraw = (0, import_react.useCallback)((config2) => {
61175
62420
  if (withdrawCloseTimeoutRef.current) {
61176
62421
  clearTimeout(withdrawCloseTimeoutRef.current);
@@ -61239,16 +62484,16 @@ function UnifoldProvider2({
61239
62484
  () => ({
61240
62485
  beginDeposit,
61241
62486
  closeDeposit,
61242
- handleDepositSuccess,
61243
- handleDepositError,
62487
+ beginCheckout,
62488
+ closeCheckout,
61244
62489
  beginWithdraw,
61245
62490
  closeWithdraw,
61246
62491
  handleWithdrawSuccess,
61247
62492
  handleWithdrawError
61248
62493
  }),
61249
- [beginDeposit, closeDeposit, handleDepositSuccess, handleDepositError, beginWithdraw, closeWithdraw, handleWithdrawSuccess, handleWithdrawError]
62494
+ [beginDeposit, closeDeposit, beginCheckout, closeCheckout, beginWithdraw, closeWithdraw, handleWithdrawSuccess, handleWithdrawError]
61250
62495
  );
61251
- 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)(
62496
+ 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)(
61252
62497
  ThemeProvider,
61253
62498
  {
61254
62499
  mode: resolvedTheme,
@@ -61259,7 +62504,20 @@ function UnifoldProvider2({
61259
62504
  components: config?.components,
61260
62505
  children: [
61261
62506
  children,
61262
- withdrawConfig && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
62507
+ checkoutConfig && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
62508
+ CheckoutModal,
62509
+ {
62510
+ open: isCheckoutOpen,
62511
+ onOpenChange: closeCheckout,
62512
+ clientSecret: checkoutConfig.clientSecret,
62513
+ publishableKey,
62514
+ enableConnectWallet: config?.enableConnectWallet,
62515
+ theme: resolvedTheme,
62516
+ onCheckoutSuccess: handleCheckoutSuccess,
62517
+ onCheckoutError: handleCheckoutError
62518
+ }
62519
+ ),
62520
+ withdrawConfig && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
61263
62521
  WithdrawModal,
61264
62522
  {
61265
62523
  open: isWithdrawOpen,
@@ -61279,7 +62537,7 @@ function UnifoldProvider2({
61279
62537
  theme: resolvedTheme
61280
62538
  }
61281
62539
  ),
61282
- depositConfig && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
62540
+ depositConfig && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
61283
62541
  DepositModal,
61284
62542
  {
61285
62543
  open: isOpen,
@@ -61330,6 +62588,9 @@ function useUnifold2() {
61330
62588
  beginDeposit: () => Promise.reject(new Error("SSR not supported")),
61331
62589
  closeDeposit: () => {
61332
62590
  },
62591
+ beginCheckout: () => Promise.reject(new Error("SSR not supported")),
62592
+ closeCheckout: () => {
62593
+ },
61333
62594
  beginWithdraw: () => Promise.reject(new Error("SSR not supported")),
61334
62595
  closeWithdraw: () => {
61335
62596
  }
@@ -61342,15 +62603,17 @@ function useUnifold2() {
61342
62603
  publishableKey: baseContext.publishableKey,
61343
62604
  beginDeposit: connectContext.beginDeposit,
61344
62605
  closeDeposit: connectContext.closeDeposit,
62606
+ beginCheckout: connectContext.beginCheckout,
62607
+ closeCheckout: connectContext.closeCheckout,
61345
62608
  beginWithdraw: connectContext.beginWithdraw,
61346
62609
  closeWithdraw: connectContext.closeWithdraw
61347
62610
  };
61348
62611
  }
61349
62612
 
61350
62613
  // src/unifold.tsx
61351
- var UnifoldBridge = (0, import_react32.forwardRef)((_, ref) => {
62614
+ var UnifoldBridge = (0, import_react33.forwardRef)((_, ref) => {
61352
62615
  const { beginDeposit, closeDeposit, beginWithdraw, closeWithdraw } = useUnifold2();
61353
- (0, import_react32.useImperativeHandle)(ref, () => ({ beginDeposit, closeDeposit, beginWithdraw, closeWithdraw }), [
62616
+ (0, import_react33.useImperativeHandle)(ref, () => ({ beginDeposit, closeDeposit, beginWithdraw, closeWithdraw }), [
61354
62617
  beginDeposit,
61355
62618
  closeDeposit,
61356
62619
  beginWithdraw,
@@ -61359,7 +62622,7 @@ var UnifoldBridge = (0, import_react32.forwardRef)((_, ref) => {
61359
62622
  return null;
61360
62623
  });
61361
62624
  UnifoldBridge.displayName = "UnifoldBridge";
61362
- var RenderErrorBoundary = class extends import_react32.Component {
62625
+ var RenderErrorBoundary = class extends import_react33.Component {
61363
62626
  constructor() {
61364
62627
  super(...arguments);
61365
62628
  this.state = { hasError: false };
@@ -61433,13 +62696,13 @@ function createUnifold(publishableKey, config) {
61433
62696
  };
61434
62697
  try {
61435
62698
  root.render(
61436
- import_react32.default.createElement(
62699
+ import_react33.default.createElement(
61437
62700
  RenderErrorBoundary,
61438
62701
  { onError: handleRenderError },
61439
- import_react32.default.createElement(
62702
+ import_react33.default.createElement(
61440
62703
  UnifoldProvider2,
61441
62704
  { publishableKey, config },
61442
- import_react32.default.createElement(UnifoldBridge, { ref: refCallback })
62705
+ import_react33.default.createElement(UnifoldBridge, { ref: refCallback })
61443
62706
  )
61444
62707
  )
61445
62708
  );
@@ -61464,6 +62727,7 @@ lucide-react/dist/esm/Icon.js:
61464
62727
  lucide-react/dist/esm/createLucideIcon.js:
61465
62728
  lucide-react/dist/esm/icons/arrow-left-right.js:
61466
62729
  lucide-react/dist/esm/icons/arrow-left.js:
62730
+ lucide-react/dist/esm/icons/arrow-right.js:
61467
62731
  lucide-react/dist/esm/icons/arrow-up-down.js:
61468
62732
  lucide-react/dist/esm/icons/check.js:
61469
62733
  lucide-react/dist/esm/icons/chevron-down.js: