@unifold/ui-web 0.1.42 → 0.1.43

package/dist/index.mjs

@@ -34394,7 +34394,7 @@ var require_jsx_runtime = __commonJS({
 });
 
 // src/unifold.tsx
-var import_react32 = __toESM(require_react());
+var import_react33 = __toESM(require_react());
 var import_client = __toESM(require_client());
 
 // ../connect-react/dist/index.mjs
@@ -37214,17 +37214,19 @@ var React272 = __toESM(require_react(), 1);
 var import_jsx_runtime69 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime70 = __toESM(require_jsx_runtime(), 1);
 var import_react27 = __toESM(require_react(), 1);
-var import_react28 = __toESM(require_react(), 1);
 var import_jsx_runtime71 = __toESM(require_jsx_runtime(), 1);
+var import_react28 = __toESM(require_react(), 1);
 var import_react29 = __toESM(require_react(), 1);
 var import_jsx_runtime72 = __toESM(require_jsx_runtime(), 1);
-var import_jsx_runtime73 = __toESM(require_jsx_runtime(), 1);
 var import_react30 = __toESM(require_react(), 1);
+var import_jsx_runtime73 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime74 = __toESM(require_jsx_runtime(), 1);
-var import_jsx_runtime75 = __toESM(require_jsx_runtime(), 1);
 var import_react31 = __toESM(require_react(), 1);
+var import_jsx_runtime75 = __toESM(require_jsx_runtime(), 1);
 var import_jsx_runtime76 = __toESM(require_jsx_runtime(), 1);
+var import_react32 = __toESM(require_react(), 1);
 var import_jsx_runtime77 = __toESM(require_jsx_runtime(), 1);
+var import_jsx_runtime78 = __toESM(require_jsx_runtime(), 1);
 var __create2 = Object.create;
 var __defProp2 = Object.defineProperty;
 var __getOwnPropDesc2 = Object.getOwnPropertyDescriptor;
@@ -38488,6 +38490,10 @@ var ArrowLeft = createLucideIcon("ArrowLeft", [
   ["path", { d: "m12 19-7-7 7-7", key: "1l729n" }],
   ["path", { d: "M19 12H5", key: "x3x0zl" }]
 ]);
+var ArrowRight = createLucideIcon("ArrowRight", [
+  ["path", { d: "M5 12h14", key: "1ays0h" }],
+  ["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
+]);
 var ArrowUpDown = createLucideIcon("ArrowUpDown", [
   ["path", { d: "m21 16-4 4-4-4", key: "f6ql7i" }],
   ["path", { d: "M17 20V4", key: "1ejh1v" }],
@@ -43566,6 +43572,119 @@ async function sendSolanaTransaction(request, publishableKey) {
   }
   return response.json();
 }
+async function retrievePaymentIntent(clientSecret, publishableKey) {
+  const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
+  validatePublishableKey(pk);
+  const response = await fetch(
+    `${API_BASE_URL}/v1/public/payment_intents/retrieve`,
+    {
+      method: "POST",
+      headers: {
+        accept: "application/json",
+        "x-publishable-key": pk,
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify({ client_secret: clientSecret })
+    }
+  );
+  if (!response.ok) {
+    const error = await response.json().catch(() => ({ message: response.statusText }));
+    throw new Error(
+      `Failed to retrieve payment intent: ${error.message || response.statusText}`
+    );
+  }
+  return response.json();
+}
+async function listPaymentIntentExecutions(clientSecret, publishableKey) {
+  const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
+  validatePublishableKey(pk);
+  const response = await fetch(
+    `${API_BASE_URL}/v1/public/payment_intents/executions`,
+    {
+      method: "POST",
+      headers: {
+        accept: "application/json",
+        "x-publishable-key": pk,
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify({ client_secret: clientSecret })
+    }
+  );
+  if (!response.ok) {
+    const error = await response.json().catch(() => ({ message: response.statusText }));
+    throw new Error(
+      `Failed to list payment intent executions: ${error.message || response.statusText}`
+    );
+  }
+  return response.json();
+}
+async function getDepositQuote(request, publishableKey) {
+  const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
+  validatePublishableKey(pk);
+  const response = await fetch(`${API_BASE_URL}/v1/public/quotes`, {
+    method: "POST",
+    headers: {
+      accept: "application/json",
+      "x-publishable-key": pk,
+      "Content-Type": "application/json"
+    },
+    body: JSON.stringify(request)
+  });
+  if (!response.ok) {
+    const error = await response.json().catch(() => ({ message: response.statusText }));
+    throw new Error(
+      `Failed to get deposit quote: ${error.message || response.statusText}`
+    );
+  }
+  const json = await response.json();
+  return json.data;
+}
+async function buildHypercoreTransaction(request, publishableKey) {
+  const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
+  validatePublishableKey(pk);
+  const response = await fetch(
+    `${API_BASE_URL}/v1/public/transactions/hypercore/build`,
+    {
+      method: "POST",
+      headers: {
+        accept: "application/json",
+        "x-publishable-key": pk,
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify(request)
+    }
+  );
+  if (!response.ok) {
+    const error = await response.json().catch(() => ({ message: response.statusText }));
+    throw new Error(
+      `Failed to build HyperCore transaction: ${error.message || response.statusText}`
+    );
+  }
+  return response.json();
+}
+async function sendHypercoreTransaction(request, publishableKey) {
+  const pk = publishableKey || DEFAULT_PUBLISHABLE_KEY;
+  validatePublishableKey(pk);
+  const response = await fetch(
+    `${API_BASE_URL}/v1/public/transactions/hypercore/send`,
+    {
+      method: "POST",
+      headers: {
+        accept: "application/json",
+        "x-publishable-key": pk,
+        "Content-Type": "application/json"
+      },
+      body: JSON.stringify(request)
+    }
+  );
+  if (!response.ok) {
+    const error = await response.json().catch(() => ({ message: response.statusText }));
+    throw new Error(
+      `Failed to send HyperCore transaction: ${error.message || response.statusText}`
+    );
+  }
+  return response.json();
+}
 var REACT_LAZY_TYPE = /* @__PURE__ */ Symbol.for("react.lazy");
 var use = React25[" use ".trim().toString()];
 function isPromiseLike(value) {
@@ -48922,6 +49041,7 @@ var CUTOFF_BUFFER_MS = 6e4;
 function useDepositPolling({
   userId,
   publishableKey,
+  clientSecret,
   depositConfirmationMode = "auto_ui",
   depositWalletId,
   enabled = true,
@@ -48979,11 +49099,12 @@ function useDepositPolling({
     depositWalletId
   ]);
   (0, import_react10.useEffect)(() => {
-    if (!userId || !enabled) return;
+    if (!enabled) return;
+    if (!clientSecret && !userId) return;
     const modalOpenedAt = modalOpenedAtRef.current;
     const poll = async () => {
       try {
-        const response = await queryExecutions(userId, publishableKey, ActionType.Deposit);
+        const response = clientSecret ? await listPaymentIntentExecutions(clientSecret, publishableKey) : await queryExecutions(userId, publishableKey, ActionType.Deposit);
         const cutoff = new Date(modalOpenedAt.getTime() - CUTOFF_BUFFER_MS);
         const sortedExecutions = [...response.data].sort((a, b) => {
           const timeA = a.created_at ? new Date(a.created_at).getTime() : 0;
@@ -49067,7 +49188,7 @@ function useDepositPolling({
       clearInterval(pollInterval);
       setIsPolling(false);
     };
-  }, [userId, publishableKey, enabled]);
+  }, [userId, publishableKey, clientSecret, enabled]);
   (0, import_react10.useEffect)(() => {
     if (!pollingEnabled || !depositWalletId) return;
     const triggerPoll = async () => {
@@ -55576,6 +55697,7 @@ var parseChainKey = (chainKey) => {
 function TransferCryptoSingleInput({
   userId,
   publishableKey,
+  clientSecret,
   recipientAddress,
   destinationChainType,
   destinationChainId,
@@ -55588,7 +55710,9 @@ function TransferCryptoSingleInput({
   onExecutionsChange,
   onDepositSuccess,
   onDepositError,
-  wallets: externalWallets
+  wallets: externalWallets,
+  onSourceTokenChange,
+  checkoutQuote
 }) {
   const { themeClass, colors: colors2, fonts, components } = useTheme();
   const isDarkMode = themeClass.includes("uf-dark");
@@ -55655,12 +55779,28 @@ function TransferCryptoSingleInput({
   } = useDepositPolling({
     userId,
     publishableKey,
+    clientSecret,
     depositConfirmationMode,
     depositWalletId: currentWallet?.id,
     enabled: true,
     onDepositSuccess,
     onDepositError
   });
+  (0, import_react16.useEffect)(() => {
+    if (!onSourceTokenChange || !token || !chain || !initialSelectionDone) return;
+    const { chainType, chainId } = parseChainKey(chain);
+    const matchedToken = supportedTokens.find((t11) => t11.symbol === token);
+    const matchedChain = matchedToken?.chains.find(
+      (c) => c.chain_type === chainType && c.chain_id === chainId
+    );
+    onSourceTokenChange({
+      symbol: token,
+      chainType,
+      chainId,
+      tokenAddress: matchedChain?.token_address ?? "",
+      minimumDepositAmountUsd: matchedChain?.minimum_deposit_amount_usd ?? 0
+    });
+  }, [token, chain, initialSelectionDone, onSourceTokenChange, supportedTokens]);
   (0, import_react16.useEffect)(() => {
     if (onExecutionsChange) {
       onExecutionsChange(depositExecutions);
@@ -55807,6 +55947,53 @@ function TransferCryptoSingleInput({
             /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children: "Retrying automatically every 5 seconds..." })
           ] })
         ] }),
+        checkoutQuote && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+          "div",
+          {
+            className: "uf-rounded-xl uf-px-3 uf-py-2 uf-flex uf-items-center uf-justify-between",
+            style: {
+              backgroundColor: components.card.backgroundColor,
+              border: `${components.card.borderWidth}px solid ${components.card.borderColor}`,
+              borderRadius: components.card.borderRadius
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+                "span",
+                {
+                  className: "uf-text-xs",
+                  style: { color: components.card.subtitleColor, fontFamily: fonts.regular },
+                  children: "You send"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+                "span",
+                {
+                  className: "uf-text-sm uf-font-semibold",
+                  style: { color: components.card.titleColor, fontFamily: fonts.semibold },
+                  children: [
+                    (Number(checkoutQuote.sourceAmount) / 10 ** checkoutQuote.sourceTokenDecimals).toFixed(
+                      Math.min(checkoutQuote.sourceTokenDecimals, 6)
+                    ),
+                    " ",
+                    checkoutQuote.sourceTokenSymbol,
+                    checkoutQuote.sourceAmountUsd && /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
+                      "span",
+                      {
+                        className: "uf-text-xs uf-font-normal uf-ml-1.5",
+                        style: { color: components.card.subtitleColor },
+                        children: [
+                          "($",
+                          checkoutQuote.sourceAmountUsd,
+                          ")"
+                        ]
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        ),
         /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-pt-2", children: [
           /* @__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" }),
           /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "uf-shadow-lg", style: { borderRadius: components.card.borderRadius, border: `${components.card.borderWidth}px solid ${components.card.borderColor}` }, children: loading || tokensLoading || !initialSelectionDone ? (
@@ -56628,9 +56815,16 @@ function SelectTokenView({
   onBack,
   onClose,
   onDisconnectWallet,
-  isDisconnectingWallet = false
+  isDisconnectingWallet = false,
+  checkoutAmountUsd,
+  checkoutReceivedUsd
 }) {
   const { colors: colors2, fonts, components } = useTheme();
+  const isCheckout = !!checkoutAmountUsd;
+  const headerSubtitle = isCheckout ? parseFloat(checkoutReceivedUsd || "0") > 0 ? `$${checkoutReceivedUsd} / $${checkoutAmountUsd} received` : `Amount due: $${checkoutAmountUsd}` : formatBalanceDisplay(
+    `$${totalBalanceUsd || "0.00"}`,
+    projectName
+  );
   return /* @__PURE__ */ (0, import_jsx_runtime64.jsxs)(
     "div",
     {
@@ -56639,11 +56833,8 @@ function SelectTokenView({
         /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
           DepositHeader,
           {
-            title: "Select Token",
-            subtitle: formatBalanceDisplay(
-              `$${totalBalanceUsd || "0.00"}`,
-              projectName
-            ),
+            title: isCheckout ? "Select Token" : "Select Token",
+            subtitle: headerSubtitle,
             showBack: true,
             onBack,
             onClose
@@ -56871,10 +57062,19 @@ function EnterAmountView({
   onReview,
   onBack,
   onClose,
-  quickSelectMode
+  quickSelectMode,
+  checkoutAmountUsd,
+  checkoutReceivedUsd
 }) {
   const { colors: colors2, fonts, components } = useTheme();
+  const isCheckout = !!checkoutAmountUsd;
   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}`;
+  const checkoutRemainingUsd = isCheckout ? Math.max(
+    parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0"),
+    0
+  ).toFixed(2) : null;
+  const headerTitle = isCheckout ? `Pay $${checkoutRemainingUsd}` : "Enter Amount";
+  const headerSubtitle = isCheckout ? parseFloat(checkoutReceivedUsd || "0") > 0 ? `$${checkoutReceivedUsd} / $${checkoutAmountUsd} received` : null : balanceSubtitle;
   const usePercentageChips = quickSelectMode === "percentage" && maxUsdAmount > 0;
   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";
   return /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
@@ -56888,14 +57088,27 @@ function EnterAmountView({
         /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
           DepositHeader,
           {
-            title: "Enter Amount",
-            subtitle: balanceSubtitle,
+            title: headerTitle,
+            subtitle: headerSubtitle ?? void 0,
             showBack: true,
             onBack,
             onClose
           }
         ),
-        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,
+        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: [
+          /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(WalletWithNetworkBadge, { walletInfo: walletInfoProp }),
+          isCheckout && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+            "span",
+            {
+              className: "uf-text-xs",
+              style: {
+                color: colors2.foregroundMuted,
+                fontFamily: fonts.regular
+              },
+              children: balanceSubtitle
+            }
+          )
+        ] }) }) : null,
         /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-flex uf-min-h-0 uf-flex-1 uf-flex-col", children: [
           /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-min-h-0 uf-flex-1", children: [
             /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-text-center uf-py-8", children: [
@@ -56918,7 +57131,9 @@ function EnterAmountView({
                     inputMode: "decimal",
                     placeholder: "0",
                     value: amountUsd,
+                    readOnly: isCheckout,
                     onChange: (e) => {
+                      if (isCheckout) return;
                       const value = e.target.value;
                       if (value === "" || /^\d*\.?\d*$/.test(value)) {
                         const decimalIndex = value.indexOf(".");
@@ -56929,7 +57144,7 @@ function EnterAmountView({
                         onAmountChange(value);
                       }
                     },
-                    className: "uf-bg-transparent uf-outline-none uf-text-center uf-font-normal uf-w-auto uf-min-w-[60px]",
+                    className: `uf-bg-transparent uf-outline-none uf-text-center uf-font-normal uf-w-auto uf-min-w-[60px] ${isCheckout ? "uf-cursor-default" : ""}`,
                     style: {
                       fontSize: `${Math.max(3.75 - (amountUsd || "0").length * 0.15, 2)}rem`,
                       color: components.input.textColor,
@@ -56951,7 +57166,7 @@ function EnterAmountView({
                 }
               )
             ] }),
-            /* @__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: [
+            !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: [
               PERCENT_QUICK_AMOUNTS.map((pct) => /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
                 "button",
                 {
@@ -57020,7 +57235,46 @@ function EnterAmountView({
                 }
               )
             ] }) }),
-            tokenChainDetails && tokenChainDetails.minimum_deposit_amount_usd > 0 && /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
+            tokenChainDetails && tokenChainDetails.minimum_deposit_amount_usd > 0 && (isCheckout && checkoutAmountUsd && inputUsdNum > parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0") + 5e-3 ? /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
+              "div",
+              {
+                className: "uf-rounded-lg uf-px-3 uf-py-2 uf-mb-3 uf-text-center",
+                style: {
+                  backgroundColor: colors2.warning + "15",
+                  border: `1px solid ${colors2.warning}30`,
+                  borderRadius: components.card.borderRadius,
+                  animation: "uf-fadeSlideIn 0.4s ease-out"
+                },
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
+                    "div",
+                    {
+                      className: "uf-text-xs uf-font-medium",
+                      style: { color: colors2.warning, fontFamily: fonts.medium },
+                      children: [
+                        "Minimum for ",
+                        selectedToken.symbol,
+                        " on ",
+                        selectedToken.chain_name,
+                        " is $",
+                        tokenChainDetails.minimum_deposit_amount_usd.toFixed(2)
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
+                    "div",
+                    {
+                      className: "uf-text-xs uf-mt-0.5",
+                      style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
+                      children: [
+                        "Amount adjusted from remaining $",
+                        (parseFloat(checkoutAmountUsd) - parseFloat(checkoutReceivedUsd || "0")).toFixed(2)
+                      ]
+                    }
+                  )
+                ]
+              }
+            ) : /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
               "div",
               {
                 className: "uf-text-center uf-text-xs uf-mb-3",
@@ -57030,7 +57284,7 @@ function EnterAmountView({
                   tokenChainDetails.minimum_deposit_amount_usd.toFixed(2)
                 ]
               }
-            ),
+            )),
             inputUsdNum > 0 && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_jsx_runtime65.Fragment, { children: inputUsdNum > maxUsdAmount ? /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
               "div",
               {
@@ -57045,7 +57299,44 @@ function EnterAmountView({
                 style: { color: colors2.error },
                 children: error
               }
-            ) })
+            ) }),
+            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: [
+              /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)("div", { className: "uf-relative", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+                  "img",
+                  {
+                    src: selectedToken.icon_url,
+                    alt: selectedToken.symbol,
+                    width: 20,
+                    height: 20,
+                    className: "uf-w-5 uf-h-5 uf-rounded-full"
+                  }
+                ),
+                selectedToken.chain_icon_url && /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
+                  "img",
+                  {
+                    src: selectedToken.chain_icon_url,
+                    alt: selectedToken.chain_name,
+                    width: 10,
+                    height: 10,
+                    className: "uf-w-2.5 uf-h-2.5 uf-rounded-full uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-border",
+                    style: { borderColor: colors2.background }
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime65.jsxs)(
+                "span",
+                {
+                  className: "uf-text-xs",
+                  style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
+                  children: [
+                    selectedToken.symbol,
+                    " on ",
+                    selectedToken.chain_name
+                  ]
+                }
+              )
+            ] })
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("div", { className: "uf-shrink-0 uf-pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(
             "button",
@@ -57069,6 +57360,18 @@ function EnterAmountView({
     }
   );
 }
+var WALLET_ICONS2 = {
+  metamask: MetamaskIcon,
+  phantom: PhantomIcon,
+  coinbase: CoinbaseIcon,
+  trust: TrustIcon,
+  rainbow: RainbowIcon,
+  rabby: RabbyIcon,
+  okx: OkxIcon,
+  solflare: SolflareIcon,
+  backpack: BackpackIcon,
+  glow: GlowIcon
+};
 function ReviewView({
   walletInfo,
   recipientAddress,
@@ -57103,30 +57406,17 @@ function ReviewView({
         ),
         /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-min-h-0 uf-flex-1 uf-flex-col", children: [
           /* @__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: [
-            /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-text-center", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
-                "div",
-                {
-                  className: "uf-text-4xl uf-font-medium",
-                  style: { color: colors2.foreground, fontFamily: fonts.medium },
-                  children: [
-                    "$",
-                    amountUsd || "0"
-                  ]
-                }
-              ),
-              formattedTokenAmount && /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
-                "div",
-                {
-                  className: "uf-text-sm uf-mt-2",
-                  style: { color: colors2.foregroundMuted },
-                  children: [
-                    "\u2248 ",
-                    formattedTokenAmount
-                  ]
-                }
-              )
-            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime66.jsx)("div", { className: "uf-text-center", children: /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+              "div",
+              {
+                className: "uf-text-4xl uf-font-medium",
+                style: { color: colors2.foreground, fontFamily: fonts.medium },
+                children: [
+                  "$",
+                  amountUsd || "0"
+                ]
+              }
+            ) }),
             /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
               "div",
               {
@@ -57143,7 +57433,31 @@ function ReviewView({
                       {
                         className: "uf-text-sm",
                         style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
-                        children: "Source"
+                        children: "From"
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
+                      WALLET_ICONS2[walletInfo.icon] && (() => {
+                        const Icon22 = WALLET_ICONS2[walletInfo.icon];
+                        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" }) });
+                      })(),
+                      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                        "span",
+                        {
+                          className: "uf-text-sm uf-font-medium",
+                          style: { color: colors2.foreground, fontFamily: fonts.medium },
+                          children: walletInfo.name
+                        }
+                      )
+                    ] })
+                  ] }),
+                  /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-justify-between uf-items-center", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
+                      "span",
+                      {
+                        className: "uf-text-sm",
+                        style: { color: colors2.foregroundMuted, fontFamily: fonts.regular },
+                        children: "You send"
                       }
                     ),
                     /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
@@ -57155,17 +57469,12 @@ function ReviewView({
                           className: "uf-w-5 uf-h-5 uf-rounded-full"
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)(
+                      /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(
                         "span",
                         {
                           className: "uf-text-sm uf-font-medium",
                           style: { color: colors2.foreground, fontFamily: fonts.medium },
-                          children: [
-                            walletInfo.name,
-                            " (",
-                            truncateAddress2(walletInfo.address),
-                            ")"
-                          ]
+                          children: formattedTokenAmount || `$${amountUsd}`
                         }
                       )
                     ] })
@@ -57328,7 +57637,10 @@ function ReviewView({
                   borderRadius: components.button.borderRadius,
                   border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
                 },
-                children: isConfirming ? "Confirming..." : "Confirm Order"
+                children: isConfirming ? /* @__PURE__ */ (0, import_jsx_runtime66.jsxs)("span", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime66.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
+                  "Confirming..."
+                ] }) : "Confirm Order"
               }
             ) })
           ] })
@@ -57337,17 +57649,35 @@ function ReviewView({
     }
   );
 }
+var SETTLE_FALLBACK_MS = 15e3;
 function ConfirmingView({
   isConfirming,
   onClose,
   executions = [],
-  isPolling = false
+  isPolling = false,
+  onNewDeposit,
+  onDone,
+  paymentIntentStatus,
+  amountReceivedUsd,
+  amountReceivedUsdAtSubmission
 }) {
-  const { colors: colors2, fonts } = useTheme();
+  const { colors: colors2, fonts, components } = useTheme();
   const [containerEl, setContainerEl] = (0, import_react26.useState)(null);
   const containerCallbackRef = (0, import_react26.useCallback)((el) => {
     setContainerEl(el);
   }, []);
+  const [fallbackSettled, setFallbackSettled] = (0, import_react26.useState)(false);
+  const hasExecution = executions.length > 0;
+  const isCheckoutMode = paymentIntentStatus != null;
+  const isPaymentComplete = paymentIntentStatus === "succeeded";
+  const amountChanged = amountReceivedUsdAtSubmission != null && amountReceivedUsd != null && amountReceivedUsd !== amountReceivedUsdAtSubmission;
+  const piSettled = !isCheckoutMode || isPaymentComplete || amountChanged || fallbackSettled;
+  (0, import_react26.useEffect)(() => {
+    if (!hasExecution || piSettled) return;
+    const timeout = setTimeout(() => setFallbackSettled(true), SETTLE_FALLBACK_MS);
+    return () => clearTimeout(timeout);
+  }, [hasExecution, piSettled]);
+  const showButtons = hasExecution && piSettled;
   return /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(PortalContainerProvider, { value: containerEl, children: /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
     "div",
     {
@@ -57360,8 +57690,8 @@ function ConfirmingView({
         /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
           DepositHeader,
           {
-            title: isConfirming ? "Confirming..." : "Processing",
-            onClose
+            title: isConfirming ? "Confirming..." : hasExecution && isPaymentComplete ? "Payment Complete" : hasExecution ? "Deposit Received" : "Processing",
+            onClose: isPaymentComplete && onDone ? onDone : onClose
           }
         ),
         /* @__PURE__ */ (0, import_jsx_runtime67.jsx)("div", { className: "uf-flex uf-flex-1 uf-flex-col uf-items-center uf-justify-center uf-py-8", children: isConfirming ? /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
@@ -57388,12 +57718,12 @@ function ConfirmingView({
               children: "Please confirm the transaction in your wallet"
             }
           )
-        ] }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
+        ] }) : hasExecution ? /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
           /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
             CircleCheck,
             {
               className: "uf-w-12 uf-h-12 uf-mb-4",
-              style: { color: colors2.primary }
+              style: { color: "rgb(34, 197, 94)" }
             }
           ),
           /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
@@ -57401,7 +57731,7 @@ function ConfirmingView({
             {
               className: "uf-text-lg uf-font-medium",
               style: { color: colors2.foreground, fontFamily: fonts.medium },
-              children: "Transaction Submitted"
+              children: isPaymentComplete ? "Payment Complete" : "Deposit Received"
             }
           ),
           /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
@@ -57409,13 +57739,72 @@ function ConfirmingView({
             {
               className: "uf-text-sm uf-mt-2 uf-text-center uf-px-6",
               style: { color: colors2.foregroundMuted },
-              children: "You can close this window or wait for confirmation."
+              children: isPaymentComplete ? "Your payment has been fulfilled." : showButtons ? "Your deposit is being processed." : "Checking payment status..."
             }
-          )
-        ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
-          DepositPollingToasts,
-          {
+          ),
+          /* @__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)(
+            LoaderCircle,
+            {
+              className: "uf-w-5 uf-h-5 uf-animate-spin",
+              style: { color: colors2.foregroundMuted }
+            }
+          ) : isPaymentComplete && onDone ? /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+            "button",
+            {
+              onClick: onDone,
+              className: "uf-w-full uf-py-3 uf-px-8 uf-text-sm uf-font-medium uf-transition-opacity hover:uf-opacity-80",
+              style: {
+                backgroundColor: colors2.primary,
+                color: colors2.primaryForeground,
+                fontFamily: fonts.medium,
+                borderRadius: components.button.borderRadius
+              },
+              children: "Done"
+            }
+          ) : onNewDeposit ? /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(
+            "button",
+            {
+              onClick: onNewDeposit,
+              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",
+              style: {
+                backgroundColor: colors2.primary,
+                color: colors2.primaryForeground,
+                fontFamily: fonts.medium
+              },
+              children: [
+                "Make another deposit",
+                /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(ArrowRight, { className: "uf-w-4 uf-h-4" })
+              ]
+            }
+          ) : null })
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime67.jsxs)(import_jsx_runtime67.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+            LoaderCircle,
+            {
+              className: "uf-w-12 uf-h-12 uf-animate-spin uf-mb-4",
+              style: { color: colors2.primary }
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+            "div",
+            {
+              className: "uf-text-lg uf-font-medium",
+              style: { color: colors2.foreground, fontFamily: fonts.medium },
+              children: "Transaction Submitted"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+            "div",
+            {
+              className: "uf-text-sm uf-mt-2 uf-text-center uf-px-6",
+              style: { color: colors2.foregroundMuted },
+              children: "Waiting for your deposit to be detected..."
+            }
+          )
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime67.jsx)(
+          DepositPollingToasts,
+          {
             executions,
             isPolling,
             horizontalPadding: "0"
@@ -57433,6 +57822,7 @@ function BrowserWalletModal({
   depositWallet,
   userId,
   publishableKey,
+  clientSecret,
   assetCdnUrl,
   projectName,
   theme = "dark",
@@ -57441,7 +57831,13 @@ function BrowserWalletModal({
   onDepositSuccess,
   onDepositError,
   amountQuickSelect = "percentage",
-  onWalletDisconnect
+  onWalletDisconnect,
+  prefillAmountUsd,
+  checkoutAmountUsd,
+  checkoutReceivedUsd,
+  onNewDeposit,
+  onDone,
+  paymentIntentStatus
 }) {
   const { colors: colors2, fonts, components } = useTheme();
   const [step, setStep] = React262.useState("select-token");
@@ -57459,6 +57855,7 @@ function BrowserWalletModal({
   const [tokenChainDetails, setTokenChainDetails] = React262.useState(null);
   const [loadingTokenDetails, setLoadingTokenDetails] = React262.useState(false);
   const [showTransactionDetails, setShowTransactionDetails] = React262.useState(false);
+  const [receivedUsdAtSubmission, setReceivedUsdAtSubmission] = React262.useState(null);
   const themeClass = theme === "dark" ? "uf-dark" : "";
   const chainType = depositWallet.chain_type;
   const recipientAddress = depositWallet.address;
@@ -57466,15 +57863,19 @@ function BrowserWalletModal({
   const { executions: depositExecutions, isPolling } = useDepositPolling({
     userId,
     publishableKey,
+    clientSecret,
     enabled: open && hasSignedTransaction,
     onDepositSuccess,
     onDepositError
   });
+  const prevOpenRef = React262.useRef(false);
   React262.useEffect(() => {
-    if (open) {
+    const wasOpen = prevOpenRef.current;
+    prevOpenRef.current = open;
+    if (open && !wasOpen) {
       setStep("select-token");
       setSelectedBalance(null);
-      setAmountUsd("");
+      setAmountUsd(prefillAmountUsd ?? "");
       setError(null);
       setIsConfirming(false);
       setTokenChainDetails(null);
@@ -57482,7 +57883,15 @@ function BrowserWalletModal({
       setHasSignedTransaction(false);
       setIsDisconnectingWallet(false);
     }
-  }, [open]);
+  }, [open, prefillAmountUsd]);
+  React262.useEffect(() => {
+    if (!prefillAmountUsd || !tokenChainDetails || step !== "input-amount") return;
+    const minDeposit = tokenChainDetails.minimum_deposit_amount_usd || 0;
+    const currentAmount = parseFloat(amountUsd) || 0;
+    if (currentAmount > 0 && currentAmount < minDeposit) {
+      setAmountUsd(minDeposit.toFixed(2));
+    }
+  }, [tokenChainDetails, step, prefillAmountUsd]);
   React262.useEffect(() => {
     if (step === "review") {
       setShowTransactionDetails(false);
@@ -57600,7 +58009,7 @@ function BrowserWalletModal({
     setError(null);
     if (step === "input-amount") {
       setStep("select-token");
-      setAmountUsd("");
+      setAmountUsd(prefillAmountUsd ?? "");
       setTokenChainDetails(null);
     } else if (step === "review") {
       setStep("input-amount");
@@ -57686,7 +58095,6 @@ function BrowserWalletModal({
       }
     }
     setIsConfirming(true);
-    setStep("confirming");
     setError(null);
     try {
       let txHash;
@@ -57704,16 +58112,17 @@ function BrowserWalletModal({
       } else {
         txHash = await sendEthereumTransaction(token, tokenAmount.toString());
       }
+      setReceivedUsdAtSubmission(checkoutReceivedUsd ?? "0");
       setHasSignedTransaction(true);
-      onSuccess?.(txHash);
       setIsConfirming(false);
+      setStep("confirming");
+      onSuccess?.(txHash);
     } catch (err) {
       console.error("[BrowserWalletModal] Transaction error:", err);
       const errorMessage = err instanceof Error ? err.message : "Transaction failed";
       setError(errorMessage);
       onError?.(err instanceof Error ? err : new Error(errorMessage));
       setIsConfirming(false);
-      setStep("review");
     }
   };
   const sendEthereumTransaction = async (token, amountStr) => {
@@ -57962,7 +58371,9 @@ function BrowserWalletModal({
                 onBack: handleClose,
                 onClose: handleFullClose,
                 onDisconnectWallet: onWalletDisconnect ? () => void handleDisconnectFromSelectToken() : void 0,
-                isDisconnectingWallet
+                isDisconnectingWallet,
+                checkoutAmountUsd,
+                checkoutReceivedUsd
               }
             ),
             step === "input-amount" && selectedToken && selectedBalance && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
@@ -57983,7 +58394,9 @@ function BrowserWalletModal({
                 onReview: handleReview,
                 onBack: handleBack,
                 onClose: handleFullClose,
-                quickSelectMode: amountQuickSelect
+                quickSelectMode: amountQuickSelect,
+                checkoutAmountUsd,
+                checkoutReceivedUsd
               }
             ),
             step === "review" && selectedToken && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
@@ -58012,7 +58425,12 @@ function BrowserWalletModal({
                 isConfirming,
                 onClose: handleFullClose,
                 executions: depositExecutions,
-                isPolling
+                isPolling,
+                onNewDeposit,
+                onDone,
+                paymentIntentStatus,
+                amountReceivedUsd: checkoutReceivedUsd,
+                amountReceivedUsdAtSubmission: receivedUsdAtSubmission
               }
             )
           ] })
@@ -58021,7 +58439,7 @@ function BrowserWalletModal({
     }
   ) });
 }
-var WALLET_ICONS2 = {
+var WALLET_ICONS3 = {
   metamask: MetamaskIcon,
   phantom: PhantomIcon,
   coinbase: CoinbaseIcon,
@@ -58460,10 +58878,10 @@ function WalletSelectionModal({
                     },
                     children: [
                       /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
-                        WALLET_ICONS2[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+                        WALLET_ICONS3[wallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
                           WalletIconWithNetwork,
                           {
-                            WalletIcon: WALLET_ICONS2[wallet.id],
+                            WalletIcon: WALLET_ICONS3[wallet.id],
                             networks: wallet.networks,
                             size: 40,
                             className: "uf-rounded-lg"
@@ -58534,10 +58952,10 @@ function WalletSelectionModal({
               style: { minHeight: WALLET_STEP_BODY_MIN_HEIGHT },
               children: [
                 /* @__PURE__ */ (0, import_jsx_runtime69.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-pb-4 uf-shrink-0", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "uf-mb-2", children: WALLET_ICONS2[selectedWallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime69.jsx)("div", { className: "uf-mb-2", children: WALLET_ICONS3[selectedWallet.id] ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(
                     WalletIconWithNetwork,
                     {
-                      WalletIcon: WALLET_ICONS2[selectedWallet.id],
+                      WalletIcon: WALLET_ICONS3[selectedWallet.id],
                       networks: selectedWallet.networks,
                       size: 48,
                       className: "uf-rounded-lg"
@@ -59336,6 +59754,664 @@ function DepositModal({
     }
   ) });
 }
+function usePaymentIntent(params) {
+  const {
+    clientSecret,
+    publishableKey,
+    enabled = true,
+    pollingInterval = 5e3
+  } = params;
+  return useQuery({
+    queryKey: ["unifold", "paymentIntent", clientSecret, publishableKey],
+    queryFn: () => retrievePaymentIntent(clientSecret, publishableKey),
+    enabled: enabled && !!clientSecret && !!publishableKey,
+    staleTime: 0,
+    refetchInterval: pollingInterval || false,
+    refetchOnWindowFocus: true,
+    retry: 3,
+    retryDelay: (attempt) => Math.min(1e3 * 2 ** attempt, 1e4)
+  });
+}
+function useDepositQuote(params) {
+  const {
+    publishableKey,
+    sourceChainType,
+    sourceChainId,
+    sourceTokenAddress,
+    destinationAmount,
+    destinationChainType,
+    destinationChainId,
+    destinationTokenAddress,
+    enabled = true
+  } = params;
+  const request = {
+    source_chain_type: sourceChainType,
+    source_chain_id: sourceChainId,
+    source_token_address: sourceTokenAddress,
+    destination_amount: destinationAmount,
+    destination_chain_type: destinationChainType,
+    destination_chain_id: destinationChainId,
+    destination_token_address: destinationTokenAddress
+  };
+  return useQuery({
+    queryKey: [
+      "unifold",
+      "depositQuote",
+      sourceChainType,
+      sourceChainId,
+      sourceTokenAddress,
+      destinationAmount,
+      destinationChainType,
+      destinationChainId,
+      destinationTokenAddress,
+      publishableKey
+    ],
+    queryFn: () => getDepositQuote(request, publishableKey),
+    enabled: enabled && !!publishableKey && !!sourceChainType && !!sourceChainId && !!sourceTokenAddress && !!destinationAmount && destinationAmount !== "0" && !!destinationChainType && !!destinationChainId && !!destinationTokenAddress,
+    staleTime: 6e4,
+    gcTime: 5 * 6e4,
+    refetchOnWindowFocus: false,
+    retry: 2,
+    retryDelay: (attempt) => Math.min(1e3 * 2 ** attempt, 5e3)
+  });
+}
+function mapDepositAddressesToWallets(depositAddresses, pi) {
+  return depositAddresses.map((da, idx) => ({
+    id: da.id,
+    chain_type: da.chain_type,
+    address_type: da.address_type,
+    address: da.address,
+    destination_chain_type: pi.destination_chain_type,
+    destination_chain_id: pi.destination_chain_id,
+    destination_token_address: pi.destination_token_address,
+    recipient_address: pi.recipient_address,
+    is_primary: idx === 0
+  }));
+}
+function SkeletonButton2() {
+  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: [
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-bg-muted uf-rounded-lg uf-w-9 uf-h-9" }),
+      /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-space-y-1.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-h-3.5 uf-w-24 uf-bg-muted uf-rounded" }),
+        /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-h-3 uf-w-32 uf-bg-muted uf-rounded" })
+      ] })
+    ] }),
+    /* @__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" }) })
+  ] });
+}
+function CheckoutModal({
+  open,
+  onOpenChange,
+  clientSecret,
+  publishableKey,
+  modalTitle,
+  enableConnectWallet = false,
+  theme = "dark",
+  onCheckoutSuccess,
+  onCheckoutError
+}) {
+  const { colors: colors2, fonts, components } = useTheme();
+  const [view, setView] = (0, import_react27.useState)("main");
+  const resetViewTimeoutRef = (0, import_react27.useRef)(
+    null
+  );
+  const [browserWalletModalOpen, setBrowserWalletModalOpen] = (0, import_react27.useState)(false);
+  const [browserWalletInfo, setBrowserWalletInfo] = (0, import_react27.useState)(null);
+  const [walletSelectionModalOpen, setWalletSelectionModalOpen] = (0, import_react27.useState)(false);
+  const [browserWalletChainType, setBrowserWalletChainType] = (0, import_react27.useState)(() => getStoredWalletChainType());
+  const isMobileView = useIsMobileViewport();
+  const [resolvedTheme, setResolvedTheme] = (0, import_react27.useState)(
+    theme === "auto" ? "dark" : theme
+  );
+  (0, import_react27.useEffect)(() => {
+    if (theme === "auto") {
+      const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+      setResolvedTheme(mediaQuery.matches ? "dark" : "light");
+      const handler = (e) => {
+        setResolvedTheme(e.matches ? "dark" : "light");
+      };
+      mediaQuery.addEventListener("change", handler);
+      return () => mediaQuery.removeEventListener("change", handler);
+    } else {
+      setResolvedTheme(theme);
+    }
+  }, [theme]);
+  const themeClass = resolvedTheme === "dark" ? "uf-dark" : "";
+  const {
+    data: paymentIntent,
+    isLoading: piLoading,
+    error: piError
+  } = usePaymentIntent({
+    clientSecret,
+    publishableKey,
+    enabled: open && !!clientSecret,
+    pollingInterval: 5e3
+  });
+  const { projectConfig } = useProjectConfig({
+    publishableKey,
+    enabled: open
+  });
+  const prevStatusRef = (0, import_react27.useRef)(null);
+  (0, import_react27.useEffect)(() => {
+    if (!paymentIntent) return;
+    const prev = prevStatusRef.current;
+    prevStatusRef.current = paymentIntent.status;
+    if (prev && prev !== paymentIntent.status && paymentIntent.status === "succeeded") {
+      if (!browserWalletModalOpen) {
+        setView("main");
+      }
+      onCheckoutSuccess?.({
+        paymentIntentId: paymentIntent.id,
+        status: paymentIntent.status
+      });
+    }
+  }, [paymentIntent, onCheckoutSuccess, browserWalletModalOpen]);
+  const wallets = (0, import_react27.useMemo)(() => {
+    if (!paymentIntent) return [];
+    return mapDepositAddressesToWallets(
+      paymentIntent.deposit_addresses,
+      paymentIntent
+    );
+  }, [paymentIntent]);
+  const formatCryptoAmount = (0, import_react27.useMemo)(() => {
+    if (!paymentIntent) return (_) => "";
+    const decimals = paymentIntent.destination_token_decimals ?? 6;
+    const symbol = paymentIntent.currency.toUpperCase();
+    return (baseUnits) => {
+      const num = Number(baseUnits) / 10 ** decimals;
+      const formatted = num % 1 === 0 ? num.toFixed(0) : num.toFixed(2);
+      return `${formatted} ${symbol}`;
+    };
+  }, [paymentIntent]);
+  const remainingAmountUsd = (0, import_react27.useMemo)(() => {
+    if (!paymentIntent) return void 0;
+    const total = parseFloat(paymentIntent.amount_usd);
+    const received = parseFloat(paymentIntent.amount_received_usd);
+    if (isNaN(total) || isNaN(received)) return paymentIntent.amount_usd;
+    const remaining = total - received;
+    return remaining > 0 ? remaining.toFixed(2) : "0.00";
+  }, [paymentIntent]);
+  const remainingCrypto = (0, import_react27.useMemo)(() => {
+    if (!paymentIntent) return void 0;
+    const total = BigInt(paymentIntent.amount);
+    const received = BigInt(paymentIntent.amount_received);
+    const remaining = total - received;
+    return remaining > 0n ? remaining.toString() : "0";
+  }, [paymentIntent]);
+  const [selectedSource, setSelectedSource] = (0, import_react27.useState)(null);
+  const quoteDestinationAmount = (0, import_react27.useMemo)(() => {
+    if (!paymentIntent || !selectedSource) return "0";
+    const remaining = BigInt(paymentIntent.amount) - BigInt(paymentIntent.amount_received);
+    const totalBaseUnits = Number(paymentIntent.amount);
+    const totalUsd = parseFloat(paymentIntent.amount_usd);
+    const baseUnitsPerUsd = totalUsd > 0 ? totalBaseUnits / totalUsd : 0;
+    const minUsd = Math.max(selectedSource.minimumDepositAmountUsd, 3);
+    const minDepositBaseUnits = BigInt(Math.ceil(minUsd * baseUnitsPerUsd));
+    const effective = remaining > minDepositBaseUnits ? remaining : minDepositBaseUnits;
+    return effective > 0n ? effective.toString() : "0";
+  }, [paymentIntent, selectedSource]);
+  const { data: sourceQuote } = useDepositQuote({
+    publishableKey,
+    sourceChainType: selectedSource?.chainType ?? "",
+    sourceChainId: selectedSource?.chainId ?? "",
+    sourceTokenAddress: selectedSource?.tokenAddress ?? "",
+    destinationAmount: quoteDestinationAmount,
+    destinationChainType: paymentIntent?.destination_chain_type ?? "",
+    destinationChainId: paymentIntent?.destination_chain_id ?? "",
+    destinationTokenAddress: paymentIntent?.destination_token_address ?? "",
+    enabled: open && view === "transfer" && !!paymentIntent && !!selectedSource && quoteDestinationAmount !== "0"
+  });
+  const handleBrowserWalletClick = (0, import_react27.useCallback)(
+    (walletInfo) => {
+      const walletChainType = walletInfo.type === "phantom-solana" || walletInfo.type === "solflare" || walletInfo.type === "backpack" || walletInfo.type === "glow" ? "solana" : "ethereum";
+      setStoredWalletChainType(walletChainType);
+      setBrowserWalletChainType(walletChainType);
+      const matchingDepositWallet = wallets.find(
+        (w) => w.chain_type === walletChainType
+      );
+      if (!matchingDepositWallet) {
+        onCheckoutError?.({
+          message: `Unable to pay from ${walletChainType}. Please try a different wallet.`,
+          code: "NO_DEPOSIT_ADDRESS"
+        });
+        return;
+      }
+      setBrowserWalletInfo({
+        ...walletInfo,
+        depositWallet: matchingDepositWallet
+      });
+      setBrowserWalletModalOpen(true);
+    },
+    [wallets, onCheckoutError]
+  );
+  const handleWalletConnectClick = (0, import_react27.useCallback)(() => {
+    setWalletSelectionModalOpen(true);
+  }, []);
+  const handleWalletConnected = (0, import_react27.useCallback)(
+    (walletInfo) => {
+      const walletChainType = walletInfo.type === "phantom-solana" || walletInfo.type === "solflare" || walletInfo.type === "backpack" || walletInfo.type === "glow" ? "solana" : "ethereum";
+      setStoredWalletChainType(walletChainType);
+      setBrowserWalletChainType(walletChainType);
+      const matchingDepositWallet = wallets.find(
+        (w) => w.chain_type === walletChainType
+      );
+      if (!matchingDepositWallet) {
+        onCheckoutError?.({
+          message: `Unable to pay from ${walletChainType}. Please try a different wallet.`,
+          code: "NO_DEPOSIT_ADDRESS"
+        });
+        setWalletSelectionModalOpen(false);
+        return;
+      }
+      setBrowserWalletInfo({
+        ...walletInfo,
+        depositWallet: matchingDepositWallet
+      });
+      setWalletSelectionModalOpen(false);
+      setBrowserWalletModalOpen(true);
+    },
+    [wallets, onCheckoutError]
+  );
+  const handleWalletDisconnect = (0, import_react27.useCallback)(() => {
+    setUserDisconnectedWallet(true);
+    clearStoredWalletChainType();
+    setBrowserWalletChainType(void 0);
+    setBrowserWalletInfo(null);
+    setBrowserWalletModalOpen(false);
+  }, []);
+  const handleClose = (0, import_react27.useCallback)(() => {
+    onOpenChange(false);
+    if (resetViewTimeoutRef.current) {
+      clearTimeout(resetViewTimeoutRef.current);
+    }
+    resetViewTimeoutRef.current = setTimeout(() => {
+      setView("main");
+      setBrowserWalletInfo(null);
+      resetViewTimeoutRef.current = null;
+    }, 200);
+  }, [onOpenChange]);
+  (0, import_react27.useLayoutEffect)(() => {
+    if (!open) return;
+    if (resetViewTimeoutRef.current) {
+      clearTimeout(resetViewTimeoutRef.current);
+      resetViewTimeoutRef.current = null;
+    }
+    setView("main");
+    setBrowserWalletInfo(null);
+  }, [open]);
+  (0, import_react27.useEffect)(
+    () => () => {
+      if (resetViewTimeoutRef.current) {
+        clearTimeout(resetViewTimeoutRef.current);
+      }
+    },
+    []
+  );
+  const handleBack = (0, import_react27.useCallback)(() => {
+    setView("main");
+  }, []);
+  const poweredByFooter = /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+    PoweredByUnifold,
+    {
+      color: colors2.foregroundMuted,
+      className: "uf-flex uf-justify-center uf-shrink-0"
+    }
+  ) });
+  const progressSection = paymentIntent ? (() => {
+    const received = parseFloat(paymentIntent.amount_received_usd);
+    const total = parseFloat(paymentIntent.amount_usd);
+    const remaining = Math.max(total - received, 0);
+    const pct = total > 0 ? Math.min(received / total * 100, 100) : 0;
+    const hasPartial = received > 0;
+    const amountStr = paymentIntent.amount_usd;
+    const dynamicFontSize = `${Math.max(3.75 - amountStr.length * 0.15, 2)}rem`;
+    return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-text-center uf-py-2 uf-space-y-1", children: [
+      paymentIntent.description && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+        "div",
+        {
+          className: "uf-text-xs",
+          style: {
+            color: colors2.foregroundMuted,
+            fontFamily: fonts.regular
+          },
+          children: paymentIntent.description
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+          "span",
+          {
+            className: "uf-mr-1",
+            style: {
+              fontSize: `calc(${dynamicFontSize} * 0.6)`,
+              color: colors2.foregroundMuted,
+              fontFamily: fonts.regular
+            },
+            children: "$"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+          "span",
+          {
+            style: {
+              fontSize: dynamicFontSize,
+              color: colors2.foreground,
+              fontFamily: fonts.regular,
+              lineHeight: 1.1
+            },
+            children: amountStr
+          }
+        )
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+        "div",
+        {
+          className: "uf-text-xs",
+          style: {
+            color: colors2.foregroundMuted,
+            fontFamily: fonts.regular
+          },
+          children: paymentIntent.currency.toUpperCase()
+        }
+      ),
+      hasPartial && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-pt-2 uf-space-y-1.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+          "div",
+          {
+            className: "uf-w-full uf-h-1.5 uf-rounded-full uf-overflow-hidden",
+            style: { backgroundColor: colors2.border },
+            children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+              "div",
+              {
+                className: "uf-h-full uf-rounded-full uf-transition-all uf-duration-500",
+                style: {
+                  width: `${pct}%`,
+                  backgroundColor: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : colors2.primary
+                }
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+          "div",
+          {
+            className: "uf-text-xs",
+            style: {
+              color: colors2.foregroundMuted,
+              fontFamily: fonts.regular
+            },
+            children: [
+              "$",
+              paymentIntent.amount_received_usd,
+              " / $",
+              amountStr,
+              " received",
+              remaining > 0 && paymentIntent.status !== "succeeded" && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("span", { style: { color: colors2.foreground, fontFamily: fonts.medium }, children: [
+                " ",
+                "\xB7 $",
+                remaining.toFixed(2),
+                " remaining"
+              ] })
+            ]
+          }
+        )
+      ] }),
+      paymentIntent.status !== "requires_payment" && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("div", { className: "uf-pt-1", children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+        "span",
+        {
+          className: "uf-text-xs uf-font-medium uf-px-2.5 uf-py-1 uf-rounded-full uf-inline-block",
+          style: {
+            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)",
+            color: paymentIntent.status === "succeeded" ? "rgb(34, 197, 94)" : paymentIntent.status === "processing" ? "rgb(59, 130, 246)" : "rgb(239, 68, 68)",
+            fontFamily: fonts.medium
+          },
+          children: paymentIntent.status === "succeeded" ? "Payment Complete" : paymentIntent.status === "processing" ? "Partial Payment Received" : paymentIntent.status === "canceled" ? "Canceled" : paymentIntent.status === "expired" ? "Expired" : paymentIntent.status
+        }
+      ) })
+    ] });
+  })() : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(PortalContainerProvider, { value: null, children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(Dialog2, { open, onOpenChange: handleClose, modal: true, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+      DialogContent2,
+      {
+        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}`,
+        style: { backgroundColor: colors2.background },
+        onPointerDownOutside: (e) => e.preventDefault(),
+        onInteractOutside: (e) => e.preventDefault(),
+        children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(ThemeStyleInjector, { children: view === "main" ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+            DepositHeader,
+            {
+              title: modalTitle || "Checkout",
+              showClose: true,
+              onClose: handleClose
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
+            piLoading ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-space-y-3", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                "div",
+                {
+                  className: "uf-rounded-xl uf-p-4 uf-animate-pulse",
+                  style: {
+                    backgroundColor: components.card.backgroundColor,
+                    borderRadius: components.card.borderRadius,
+                    border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
+                  },
+                  children: /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-flex-col uf-items-center uf-gap-2", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                      "div",
+                      {
+                        className: "uf-h-8 uf-w-24 uf-rounded",
+                        style: {
+                          backgroundColor: components.card.borderColor
+                        }
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                      "div",
+                      {
+                        className: "uf-h-4 uf-w-16 uf-rounded",
+                        style: {
+                          backgroundColor: components.card.borderColor
+                        }
+                      }
+                    )
+                  ] })
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SkeletonButton2, {}),
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SkeletonButton2, {})
+            ] }) : 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: [
+              /* @__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" }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                "h3",
+                {
+                  className: "uf-text-lg uf-font-semibold uf-mb-2",
+                  style: {
+                    color: colors2.foreground,
+                    fontFamily: fonts.semibold
+                  },
+                  children: "Unable to Load Checkout"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                "p",
+                {
+                  className: "uf-text-sm uf-max-w-[280px]",
+                  style: {
+                    color: colors2.foregroundMuted,
+                    fontFamily: fonts.regular
+                  },
+                  children: piError instanceof Error ? piError.message : "Something went wrong. Please try again."
+                }
+              )
+            ] }) : paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-space-y-3", children: [
+              progressSection,
+              (paymentIntent.status === "requires_payment" || paymentIntent.status === "processing") && /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                  TransferCryptoButton,
+                  {
+                    onClick: () => setView("transfer"),
+                    title: "Transfer Crypto",
+                    subtitle: "Send from any wallet or exchange",
+                    featuredTokens: projectConfig?.transfer_crypto.networks
+                  }
+                ),
+                enableConnectWallet && !isMobileView && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                  BrowserWalletButton,
+                  {
+                    onClick: handleBrowserWalletClick,
+                    onConnectClick: handleWalletConnectClick,
+                    onDisconnect: handleWalletDisconnect,
+                    chainType: browserWalletChainType,
+                    publishableKey
+                  }
+                )
+              ] })
+            ] }) : null,
+            poweredByFooter
+          ] })
+        ] }) : view === "transfer" ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+            DepositHeader,
+            {
+              title: `Pay $${remainingAmountUsd ?? paymentIntent?.amount_usd ?? ""}`,
+              showBack: true,
+              onBack: handleBack,
+              onClose: handleClose
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-1.5", children: [
+            paymentIntent ? /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(import_jsx_runtime71.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+                "div",
+                {
+                  className: "uf-rounded-lg uf-px-3 uf-py-2 uf-flex uf-items-center uf-justify-between",
+                  style: {
+                    backgroundColor: components.card.backgroundColor,
+                    border: `${components.card.borderWidth}px solid ${components.card.borderColor}`,
+                    borderRadius: components.card.borderRadius
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                      "span",
+                      {
+                        className: "uf-text-xs",
+                        style: {
+                          color: colors2.foregroundMuted,
+                          fontFamily: fonts.regular
+                        },
+                        children: parseFloat(paymentIntent.amount_received_usd) > 0 ? `$${paymentIntent.amount_received_usd} / $${paymentIntent.amount_usd} received` : "Amount due"
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+                      "span",
+                      {
+                        className: "uf-text-sm uf-font-semibold",
+                        style: {
+                          color: colors2.foreground,
+                          fontFamily: fonts.semibold
+                        },
+                        children: [
+                          formatCryptoAmount(remainingCrypto ?? paymentIntent.amount),
+                          /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+                            "span",
+                            {
+                              className: "uf-text-xs uf-font-normal uf-ml-1",
+                              style: { color: colors2.foregroundMuted },
+                              children: [
+                                "($",
+                                remainingAmountUsd ?? paymentIntent.amount_usd,
+                                ")"
+                              ]
+                            }
+                          )
+                        ]
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                TransferCryptoSingleInput,
+                {
+                  userId: paymentIntent.user_id || "",
+                  publishableKey,
+                  clientSecret,
+                  recipientAddress: paymentIntent.recipient_address,
+                  destinationChainType: paymentIntent.destination_chain_type,
+                  destinationChainId: paymentIntent.destination_chain_id,
+                  destinationTokenAddress: paymentIntent.destination_token_address,
+                  depositConfirmationMode: "auto_ui",
+                  wallets,
+                  onSourceTokenChange: setSelectedSource,
+                  checkoutQuote: sourceQuote ? {
+                    sourceAmount: sourceQuote.source_amount,
+                    sourceTokenDecimals: sourceQuote.source_token_decimals,
+                    sourceTokenSymbol: sourceQuote.source_token_symbol,
+                    sourceAmountUsd: sourceQuote.source_amount_usd
+                  } : null
+                }
+              )
+            ] }) : /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(SkeletonButton2, {}),
+            poweredByFooter
+          ] })
+        ] }) : null })
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+      WalletSelectionModal,
+      {
+        open: walletSelectionModalOpen,
+        onOpenChange: setWalletSelectionModalOpen,
+        onWalletConnected: handleWalletConnected,
+        onClose: () => setWalletSelectionModalOpen(false),
+        theme: resolvedTheme
+      }
+    ),
+    browserWalletInfo && browserWalletInfo.depositWallet && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+      BrowserWalletModal,
+      {
+        open: browserWalletModalOpen,
+        onOpenChange: setBrowserWalletModalOpen,
+        onFullClose: handleClose,
+        walletInfo: browserWalletInfo,
+        depositWallet: browserWalletInfo.depositWallet,
+        userId: paymentIntent?.user_id || "",
+        publishableKey,
+        clientSecret,
+        theme: resolvedTheme,
+        prefillAmountUsd: remainingAmountUsd,
+        checkoutAmountUsd: paymentIntent?.amount_usd,
+        checkoutReceivedUsd: paymentIntent?.amount_received_usd,
+        onSuccess: (txHash) => {
+          onCheckoutSuccess?.({
+            paymentIntentId: paymentIntent?.id || "",
+            status: "processing"
+          });
+        },
+        onError: (error) => {
+          onCheckoutError?.({
+            message: error.message,
+            error
+          });
+        },
+        onWalletDisconnect: handleWalletDisconnect,
+        onNewDeposit: () => {
+          setBrowserWalletModalOpen(false);
+          setView("main");
+        },
+        onDone: () => {
+          setBrowserWalletModalOpen(false);
+          setView("main");
+        },
+        paymentIntentStatus: paymentIntent?.status
+      }
+    )
+  ] }) });
+}
 function useSupportedDestinationTokens(publishableKey, enabled = true) {
   return useQuery({
     queryKey: ["unifold", "supportedDestinationTokens", publishableKey],
@@ -59480,20 +60556,20 @@ function useWithdrawPolling({
   onWithdrawSuccess,
   onWithdrawError
 }) {
-  const [executions, setExecutions] = (0, import_react28.useState)([]);
-  const [isPolling, setIsPolling] = (0, import_react28.useState)(false);
-  const enabledAtRef = (0, import_react28.useRef)(/* @__PURE__ */ new Date());
-  const trackedRef = (0, import_react28.useRef)(/* @__PURE__ */ new Map());
-  const prevEnabledRef = (0, import_react28.useRef)(false);
-  const onSuccessRef = (0, import_react28.useRef)(onWithdrawSuccess);
-  const onErrorRef = (0, import_react28.useRef)(onWithdrawError);
-  (0, import_react28.useEffect)(() => {
+  const [executions, setExecutions] = (0, import_react29.useState)([]);
+  const [isPolling, setIsPolling] = (0, import_react29.useState)(false);
+  const enabledAtRef = (0, import_react29.useRef)(/* @__PURE__ */ new Date());
+  const trackedRef = (0, import_react29.useRef)(/* @__PURE__ */ new Map());
+  const prevEnabledRef = (0, import_react29.useRef)(false);
+  const onSuccessRef = (0, import_react29.useRef)(onWithdrawSuccess);
+  const onErrorRef = (0, import_react29.useRef)(onWithdrawError);
+  (0, import_react29.useEffect)(() => {
     onSuccessRef.current = onWithdrawSuccess;
   }, [onWithdrawSuccess]);
-  (0, import_react28.useEffect)(() => {
+  (0, import_react29.useEffect)(() => {
     onErrorRef.current = onWithdrawError;
   }, [onWithdrawError]);
-  (0, import_react28.useEffect)(() => {
+  (0, import_react29.useEffect)(() => {
     if (enabled && !prevEnabledRef.current) {
       enabledAtRef.current = /* @__PURE__ */ new Date();
       trackedRef.current.clear();
@@ -59503,7 +60579,7 @@ function useWithdrawPolling({
     }
     prevEnabledRef.current = enabled;
   }, [enabled]);
-  (0, import_react28.useEffect)(() => {
+  (0, import_react29.useEffect)(() => {
     if (!userId || !enabled) return;
     const enabledAt = enabledAtRef.current;
     const poll = async () => {
@@ -59565,7 +60641,7 @@ function useWithdrawPolling({
       setIsPolling(false);
     };
   }, [userId, publishableKey, enabled]);
-  (0, import_react28.useEffect)(() => {
+  (0, import_react29.useEffect)(() => {
     if (!enabled || !depositWalletId) return;
     const trigger = async () => {
       try {
@@ -59593,8 +60669,8 @@ function WithdrawDoubleInput({
   const isDarkMode = useTheme().themeClass.includes("uf-dark");
   const selectedToken = selectedTokenSymbol ? tokens.find((t11) => t11.symbol === selectedTokenSymbol) : void 0;
   const availableChainsForToken = selectedToken?.chains || [];
-  const renderTokenItem = (tokenData) => /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+  const renderTokenItem = (tokenData) => /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
       "img",
       {
         src: tokenData.icon_url,
@@ -59605,10 +60681,10 @@ function WithdrawDoubleInput({
         className: "uf-rounded-full uf-flex-shrink-0"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-font-normal", children: tokenData.symbol })
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs uf-font-normal", children: tokenData.symbol })
   ] });
-  const renderChainItem = (chainData) => /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+  const renderChainItem = (chainData) => /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
       "img",
       {
         src: chainData.icon_url,
@@ -59619,14 +60695,14 @@ function WithdrawDoubleInput({
         className: "uf-rounded-full uf-flex-shrink-0"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsx)("span", { className: "uf-text-xs uf-font-normal", children: chainData.chain_name })
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs uf-font-normal", children: chainData.chain_name })
   ] });
   const currentChainData = selectedChainKey ? availableChainsForToken.find(
     (c) => getChainKey4(c.chain_id, c.chain_type) === selectedChainKey
   ) : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { className: "uf-grid uf-grid-cols-2 uf-gap-2.5", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-grid uf-grid-cols-2 uf-gap-2.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
         "div",
         {
           className: "uf-text-xs uf-mb-2 uf-flex uf-items-center uf-gap-1",
@@ -59634,14 +60710,14 @@ function WithdrawDoubleInput({
           children: t7.receiveToken
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
         Select2,
         {
           value: selectedTokenSymbol ?? "",
           onValueChange: onTokenChange,
           disabled: isLoading || tokens.length === 0,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
               SelectTrigger2,
               {
                 className: "uf-h-10 hover:uf-opacity-90 uf-text-foreground disabled:uf-opacity-50",
@@ -59649,10 +60725,10 @@ function WithdrawDoubleInput({
                   backgroundColor: components.card.backgroundColor,
                   border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
                 },
-                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 }) })
+                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 }) })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
               SelectContent2,
               {
                 className: "uf-bg-secondary uf-border uf-text-foreground uf-max-h-[300px]",
@@ -59660,7 +60736,7 @@ function WithdrawDoubleInput({
                   border: `1px solid ${isDarkMode ? "rgba(255,255,255,0.15)" : "rgba(0,0,0,0.15)"}`,
                   ...fonts.regular ? { "--uf-font-family": fonts.regular } : {}
                 },
-                children: tokens.map((tokenData) => /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                children: tokens.map((tokenData) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
                   SelectItem2,
                   {
                     value: tokenData.symbol,
@@ -59675,8 +60751,8 @@ function WithdrawDoubleInput({
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
         "div",
         {
           className: "uf-text-xs uf-mb-2 uf-flex uf-items-center uf-gap-1",
@@ -59684,14 +60760,14 @@ function WithdrawDoubleInput({
           children: t7.receiveChain
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime71.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
         Select2,
         {
           value: selectedChainKey ?? "",
           onValueChange: onChainChange,
           disabled: isLoading || availableChainsForToken.length === 0,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
               SelectTrigger2,
               {
                 className: "uf-h-10 hover:uf-opacity-90 uf-text-foreground disabled:uf-opacity-50",
@@ -59699,10 +60775,10 @@ function WithdrawDoubleInput({
                   backgroundColor: components.card.backgroundColor,
                   border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
                 },
-                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 }) })
+                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 }) })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
               SelectContent2,
               {
                 align: "end",
@@ -59711,9 +60787,9 @@ function WithdrawDoubleInput({
                   border: `1px solid ${isDarkMode ? "rgba(255,255,255,0.15)" : "rgba(0,0,0,0.15)"}`,
                   ...fonts.regular ? { "--uf-font-family": fonts.regular } : {}
                 },
-                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) => {
+                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) => {
                   const chainKey = getChainKey4(chainData.chain_id, chainData.chain_type);
-                  return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
+                  return /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
                     SelectItem2,
                     {
                       value: chainKey,
@@ -59878,6 +60954,52 @@ async function sendSolanaWithdraw(params) {
   );
   return sendResponse.signature;
 }
+var HYPERCORE_CHAIN_ID = "1337";
+var HYPERCORE_SPOT_USDC_ADDRESS = "0x6d1e7cde53ba9467b783cb7c530ce054";
+function isHypercoreChain(chainId) {
+  return chainId === HYPERCORE_CHAIN_ID;
+}
+async function sendHypercoreWithdraw(params) {
+  const {
+    provider,
+    fromAddress,
+    depositWalletAddress,
+    sourceTokenAddress,
+    amount,
+    tokenSymbol,
+    publishableKey
+  } = params;
+  const isSpot = sourceTokenAddress.toLowerCase() === HYPERCORE_SPOT_USDC_ADDRESS;
+  const currentChainHex = await provider.request({
+    method: "eth_chainId",
+    params: []
+  });
+  const activeChainId = String(parseInt(currentChainHex, 16));
+  const buildResult = await buildHypercoreTransaction(
+    {
+      action_type: isSpot ? "spot_send" : "usd_send",
+      signature_chain_type: "ethereum",
+      signature_chain_id: activeChainId,
+      recipient_address: depositWalletAddress,
+      token_address: sourceTokenAddress,
+      token_symbol: tokenSymbol || void 0,
+      amount
+    },
+    publishableKey
+  );
+  const signature = await provider.request({
+    method: "eth_signTypedData_v4",
+    params: [fromAddress, JSON.stringify(buildResult.typed_data)]
+  });
+  await sendHypercoreTransaction(
+    {
+      action_payload: buildResult.action_payload,
+      signature,
+      nonce: buildResult.nonce
+    },
+    publishableKey
+  );
+}
 async function detectBrowserWallet(chainType, senderAddress) {
   const win = typeof window !== "undefined" ? window : null;
   if (!win || !senderAddress) return null;
@@ -60001,22 +61123,22 @@ function WithdrawForm({
   footerLeft
 }) {
   const { colors: colors2, fonts, components } = useTheme();
-  const [recipientAddress, setRecipientAddress] = (0, import_react29.useState)(recipientAddressProp || "");
-  const [amount, setAmount] = (0, import_react29.useState)("");
-  const [inputUnit, setInputUnit] = (0, import_react29.useState)("crypto");
-  const [isSubmitting, setIsSubmitting] = (0, import_react29.useState)(false);
-  const [submitError, setSubmitError] = (0, import_react29.useState)(null);
-  const [detailsExpanded, setDetailsExpanded] = (0, import_react29.useState)(false);
-  const [glossaryOpen, setGlossaryOpen] = (0, import_react29.useState)(false);
-  (0, import_react29.useEffect)(() => {
+  const [recipientAddress, setRecipientAddress] = (0, import_react30.useState)(recipientAddressProp || "");
+  const [amount, setAmount] = (0, import_react30.useState)("");
+  const [inputUnit, setInputUnit] = (0, import_react30.useState)("crypto");
+  const [isSubmitting, setIsSubmitting] = (0, import_react30.useState)(false);
+  const [submitError, setSubmitError] = (0, import_react30.useState)(null);
+  const [detailsExpanded, setDetailsExpanded] = (0, import_react30.useState)(false);
+  const [glossaryOpen, setGlossaryOpen] = (0, import_react30.useState)(false);
+  (0, import_react30.useEffect)(() => {
     setRecipientAddress(recipientAddressProp || "");
     setAmount("");
     setInputUnit("crypto");
     setSubmitError(null);
   }, [recipientAddressProp]);
   const trimmedAddress = recipientAddress.trim();
-  const [debouncedAddress, setDebouncedAddress] = (0, import_react29.useState)(trimmedAddress);
-  (0, import_react29.useEffect)(() => {
+  const [debouncedAddress, setDebouncedAddress] = (0, import_react30.useState)(trimmedAddress);
+  (0, import_react30.useEffect)(() => {
     const id = setTimeout(() => setDebouncedAddress(trimmedAddress), 500);
     return () => clearTimeout(id);
   }, [trimmedAddress]);
@@ -60033,7 +61155,7 @@ function WithdrawForm({
     enabled: debouncedAddress.length > 5 && !!selectedChain
   });
   const isDebouncing = trimmedAddress !== debouncedAddress;
-  const addressError = (0, import_react29.useMemo)(() => {
+  const addressError = (0, import_react30.useMemo)(() => {
     if (!trimmedAddress || trimmedAddress.length <= 5) return null;
     if (isDebouncing || isVerifyingAddress) return null;
     if (verifyError) return t8.invalidAddress;
@@ -60047,47 +61169,47 @@ function WithdrawForm({
     return null;
   }, [trimmedAddress, isDebouncing, isVerifyingAddress, verifyError, addressVerification, selectedChain, selectedToken]);
   const isAddressValid = !isDebouncing && !!addressVerification?.valid && !addressError;
-  const exchangeRate = (0, import_react29.useMemo)(() => {
+  const exchangeRate = (0, import_react30.useMemo)(() => {
     if (!balanceData?.exchangeRate) return 0;
     return parseFloat(balanceData.exchangeRate);
   }, [balanceData]);
-  const balanceCrypto = (0, import_react29.useMemo)(() => {
+  const balanceCrypto = (0, import_react30.useMemo)(() => {
     if (!balanceData?.balanceHuman) return 0;
     return parseFloat(balanceData.balanceHuman);
   }, [balanceData]);
-  const balanceUsdNum = (0, import_react29.useMemo)(() => {
+  const balanceUsdNum = (0, import_react30.useMemo)(() => {
     if (!balanceData?.balanceUsd) return 0;
     return parseFloat(balanceData.balanceUsd);
   }, [balanceData]);
   const tokenSymbol = sourceTokenSymbol || balanceData?.symbol || "TOKEN";
   const sourceDecimals = balanceData?.decimals ?? 6;
-  const cryptoAmountFromInput = (0, import_react29.useMemo)(() => {
+  const cryptoAmountFromInput = (0, import_react30.useMemo)(() => {
     const val = parseFloat(amount);
     if (!val || val <= 0) return 0;
     if (inputUnit === "crypto") return val;
     return exchangeRate > 0 ? val / exchangeRate : 0;
   }, [amount, inputUnit, exchangeRate]);
-  const fiatAmountFromInput = (0, import_react29.useMemo)(() => {
+  const fiatAmountFromInput = (0, import_react30.useMemo)(() => {
     const val = parseFloat(amount);
     if (!val || val <= 0) return 0;
     if (inputUnit === "fiat") return val;
     return val * exchangeRate;
   }, [amount, inputUnit, exchangeRate]);
-  const convertedDisplay = (0, import_react29.useMemo)(() => {
+  const convertedDisplay = (0, import_react30.useMemo)(() => {
     if (!amount || parseFloat(amount) <= 0) return null;
     if (inputUnit === "crypto") {
       return `$${fiatAmountFromInput.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
     }
     return `${cryptoAmountFromInput.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 6 })} ${tokenSymbol}`;
   }, [amount, inputUnit, fiatAmountFromInput, cryptoAmountFromInput, tokenSymbol]);
-  const balanceDisplay = (0, import_react29.useMemo)(() => {
+  const balanceDisplay = (0, import_react30.useMemo)(() => {
     if (isLoadingBalance || !balanceData) return null;
     if (inputUnit === "crypto") {
       return `${balanceCrypto.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })} ${tokenSymbol}`;
     }
     return `$${balanceUsdNum.toLocaleString(void 0, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
   }, [isLoadingBalance, balanceData, inputUnit, balanceCrypto, balanceUsdNum, tokenSymbol]);
-  const handleSwitchUnit = (0, import_react29.useCallback)(() => {
+  const handleSwitchUnit = (0, import_react30.useCallback)(() => {
     const val = parseFloat(amount);
     if (!val || val <= 0 || exchangeRate <= 0) {
       setInputUnit((u) => u === "crypto" ? "fiat" : "crypto");
@@ -60104,7 +61226,7 @@ function WithdrawForm({
       setInputUnit("crypto");
     }
   }, [amount, inputUnit, exchangeRate, sourceDecimals]);
-  const handleMaxClick = (0, import_react29.useCallback)(() => {
+  const handleMaxClick = (0, import_react30.useCallback)(() => {
     if (inputUnit === "crypto") {
       if (balanceCrypto <= 0) return;
       setAmount(balanceData?.balanceHuman ?? "0");
@@ -60116,7 +61238,7 @@ function WithdrawForm({
   const isBelowMinimum = minimumWithdrawAmountUsd !== null && fiatAmountFromInput > 0 && fiatAmountFromInput < minimumWithdrawAmountUsd;
   const isOverBalance = inputUnit === "crypto" ? cryptoAmountFromInput > 0 && balanceCrypto > 0 && cryptoAmountFromInput > balanceCrypto : fiatAmountFromInput > 0 && balanceUsdNum > 0 && fiatAmountFromInput > balanceUsdNum;
   const isFormValid = trimmedAddress.length > 0 && amount.trim().length > 0 && cryptoAmountFromInput > 0 && isAddressValid && !isBelowMinimum && !isOverBalance && !!balanceData;
-  const handleWithdraw = (0, import_react29.useCallback)(async () => {
+  const handleWithdraw = (0, import_react30.useCallback)(async () => {
     if (!selectedToken || !selectedChain) return;
     if (!isFormValid) return;
     setIsSubmitting(true);
@@ -60149,7 +61271,17 @@ function WithdrawForm({
         recipientAddress: trimmedAddress
       };
       if (detectedWallet) {
-        if (detectedWallet.chainFamily === "evm") {
+        if (detectedWallet.chainFamily === "evm" && isHypercoreChain(sourceChainId)) {
+          await sendHypercoreWithdraw({
+            provider: detectedWallet.provider,
+            fromAddress: detectedWallet.address,
+            depositWalletAddress: depositWallet.address,
+            sourceTokenAddress,
+            amount: humanAmount,
+            tokenSymbol,
+            publishableKey
+          });
+        } else if (detectedWallet.chainFamily === "evm") {
           await sendEvmWithdraw({
             provider: detectedWallet.provider,
             fromAddress: detectedWallet.address,
@@ -60186,9 +61318,9 @@ function WithdrawForm({
       setIsSubmitting(false);
     }
   }, [selectedToken, selectedChain, isFormValid, cryptoAmountFromInput, sourceDecimals, trimmedAddress, publishableKey, onWithdraw, detectedWallet, sourceTokenAddress, sourceChainId, onWithdrawError, onDepositWalletCreation, onWithdrawSubmitted, amount, inputUnit, balanceCrypto, balanceUsdNum, balanceData]);
-  return /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(import_jsx_runtime72.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
         "div",
         {
           className: "uf-text-xs uf-mb-1.5",
@@ -60196,7 +61328,7 @@ function WithdrawForm({
           children: t8.recipientAddress
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
         "style",
         {
           dangerouslySetInnerHTML: {
@@ -60204,7 +61336,7 @@ function WithdrawForm({
           }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
         "div",
         {
           className: "uf-flex uf-items-center uf-gap-1 uf-pr-2",
@@ -60214,7 +61346,7 @@ function WithdrawForm({
             border: `${components.input.borderWidth}px solid ${addressError ? colors2.error : components.input.borderColor}`
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
               "input",
               {
                 type: "text",
@@ -60231,7 +61363,7 @@ function WithdrawForm({
                 }
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
               "button",
               {
                 type: "button",
@@ -60248,27 +61380,27 @@ function WithdrawForm({
                 className: "uf-flex-shrink-0 uf-p-1 uf-rounded uf-transition-colors hover:uf-opacity-70",
                 style: { color: colors2.foregroundMuted },
                 title: "Paste from clipboard",
-                children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ClipboardPaste, { className: "uf-w-4 uf-h-4" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ClipboardPaste, { className: "uf-w-4 uf-h-4" })
               }
             )
           ]
         }
       ),
-      (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: [
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(LoaderCircle, { className: "uf-w-3 uf-h-3 uf-animate-spin", style: { color: colors2.foregroundMuted } }),
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: t8.verifyingAddress })
+      (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: [
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(LoaderCircle, { className: "uf-w-3 uf-h-3 uf-animate-spin", style: { color: colors2.foregroundMuted } }),
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: t8.verifyingAddress })
       ] }),
-      addressError && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(TriangleAlert, { className: "uf-w-3 uf-h-3", style: { color: colors2.error } }),
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { className: "uf-text-xs", style: { color: colors2.error, fontFamily: fonts.regular }, children: addressError })
+      addressError && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1.5 uf-mt-1.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(TriangleAlert, { className: "uf-w-3 uf-h-3", style: { color: colors2.error } }),
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "uf-text-xs", style: { color: colors2.error, fontFamily: fonts.regular }, children: addressError })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-text-xs uf-mb-1.5", style: { color: components.card.labelColor, fontFamily: fonts.medium }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-text-xs uf-mb-1.5", style: { color: components.card.labelColor, fontFamily: fonts.medium }, children: [
         t8.amount,
-        minimumWithdrawAmountUsd != null && minimumWithdrawAmountUsd > 0 && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { style: { color: colors2.warning, fontFamily: fonts.regular }, children: ` ($${minimumWithdrawAmountUsd.toFixed(2)} min)` })
+        minimumWithdrawAmountUsd != null && minimumWithdrawAmountUsd > 0 && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { style: { color: colors2.warning, fontFamily: fonts.regular }, children: ` ($${minimumWithdrawAmountUsd.toFixed(2)} min)` })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
         "style",
         {
           dangerouslySetInnerHTML: {
@@ -60276,7 +61408,7 @@ function WithdrawForm({
           }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
         "div",
         {
           className: "uf-flex uf-items-center uf-gap-2 uf-px-3 uf-py-2.5",
@@ -60286,7 +61418,7 @@ function WithdrawForm({
             border: `${components.input.borderWidth}px solid ${components.input.borderColor}`
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
               "input",
               {
                 type: "text",
@@ -60307,8 +61439,8 @@ function WithdrawForm({
                 }
               }
             ),
-            /* @__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" }),
-            /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+            /* @__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" }),
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
               "button",
               {
                 type: "button",
@@ -60321,10 +61453,10 @@ function WithdrawForm({
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-mt-1.5 uf-px-3", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
-          /* @__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}`) }),
-          exchangeRate > 0 && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-mt-1.5 uf-px-3", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-1", children: [
+          /* @__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}`) }),
+          exchangeRate > 0 && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
             "button",
             {
               type: "button",
@@ -60332,49 +61464,49 @@ function WithdrawForm({
               className: "uf-p-0.5 uf-rounded uf-transition-colors hover:uf-opacity-70",
               style: { color: colors2.foregroundMuted },
               title: "Switch unit",
-              children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(ArrowUpDown, { className: "uf-w-3 uf-h-3" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(ArrowUpDown, { className: "uf-w-3 uf-h-3" })
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { children: [
-          balanceDisplay && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { children: [
+          balanceDisplay && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: colors2.foregroundMuted, fontFamily: fonts.regular }, children: [
             t8.balance,
             ": ",
             balanceDisplay
           ] }),
-          isLoadingBalance && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: "uf-h-3 uf-w-16 uf-bg-muted uf-rounded uf-animate-pulse" })
+          isLoadingBalance && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { className: "uf-h-3 uf-w-16 uf-bg-muted uf-rounded uf-animate-pulse" })
         ] })
       ] })
     ] }),
-    /* @__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: [
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
+    /* @__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: [
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
         "button",
         {
           type: "button",
           onClick: () => setDetailsExpanded(!detailsExpanded),
           className: "uf-w-full uf-flex uf-items-center uf-justify-between uf-py-2.5",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
-              /* @__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 } }) }),
-              /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
+              /* @__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 } }) }),
+              /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
                 tCrypto.processingTime.label,
                 ":",
                 " ",
-                /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: formatProcessingTime2(estimatedProcessingTime) })
+                /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: formatProcessingTime2(estimatedProcessingTime) })
               ] })
             ] }),
-            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 } })
+            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 } })
           ]
         }
       ),
-      detailsExpanded && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-pb-3 uf-space-y-2.5", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
-          /* @__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 } }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
+      detailsExpanded && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-pb-3 uf-space-y-2.5", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
+          /* @__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 } }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
             tCrypto.slippage.label,
             ":",
             " ",
-            /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
               tCrypto.slippage.auto,
               " \u2022 ",
               (maxSlippagePercent ?? 0.25).toFixed(2),
@@ -60382,13 +61514,13 @@ function WithdrawForm({
             ] })
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
-          /* @__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 } }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
+          /* @__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 } }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-text-xs", style: { color: components.card.labelColor, fontFamily: fonts.regular }, children: [
             tCrypto.priceImpact.label,
             ":",
             " ",
-            /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { style: { color: components.card.titleColor, fontFamily: fonts.medium }, children: [
               (priceImpactPercent ?? 0).toFixed(2),
               "%"
             ] })
@@ -60396,18 +61528,18 @@ function WithdrawForm({
         ] })
       ] })
     ] }),
-    !canWithdraw && !submitError && /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(
+    !canWithdraw && !submitError && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
       "div",
       {
         className: "uf-flex uf-items-start uf-gap-2.5 uf-p-3 uf-rounded-xl",
         style: { backgroundColor: colors2.card, border: `1px solid ${colors2.border}` },
         children: [
-          /* @__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 } }),
-          /* @__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." })
+          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Wallet, { className: "uf-w-4 uf-h-4 uf-flex-shrink-0 uf-mt-0.5", style: { color: colors2.warning } }),
+          /* @__PURE__ */ (0, import_jsx_runtime73.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." })
         ]
       }
     ),
-    isWalletMatch && connectedWalletName ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+    isWalletMatch && connectedWalletName ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
       "button",
       {
         type: "button",
@@ -60421,16 +61553,16 @@ function WithdrawForm({
           borderRadius: components.button.borderRadius,
           border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
         },
-        children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(import_jsx_runtime72.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
+        children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
           "Processing..."
-        ] }) : 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: [
-          /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Wallet, { className: "uf-w-4 uf-h-4" }),
+        ] }) : 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: [
+          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(Wallet, { className: "uf-w-4 uf-h-4" }),
           "Withdraw from ",
           connectedWalletName
         ] })
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+    ) : /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
       "button",
       {
         type: "button",
@@ -60444,17 +61576,17 @@ function WithdrawForm({
           borderRadius: components.button.borderRadius,
           border: `${components.button.borderWidth}px solid ${components.button.borderColor}`
         },
-        children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("span", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
+        children: isSubmitting ? /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("span", { className: "uf-flex uf-items-center uf-justify-center uf-gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(LoaderCircle, { className: "uf-w-4 uf-h-4 uf-animate-spin" }),
           "Processing..."
         ] }) : isOverBalance ? "Insufficient balance" : isBelowMinimum ? "Minimum amount not met" : submitError ? "Withdrawal failed. Try again" : t8.withdraw
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-text-xs uf-pt-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { children: footerLeft }),
-      /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DepositFooterLinks, { onGlossaryClick: () => setGlossaryOpen(true) })
+    /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex uf-items-center uf-justify-between uf-text-xs uf-pt-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("div", { children: footerLeft }),
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(DepositFooterLinks, { onGlossaryClick: () => setGlossaryOpen(true) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
       GlossaryModal,
       {
         open: glossaryOpen,
@@ -60500,7 +61632,7 @@ function WithdrawExecutionItem({
       return "$0.00";
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
     "button",
     {
       onClick,
@@ -60511,8 +61643,8 @@ function WithdrawExecutionItem({
         border: `${components.card.borderWidth}px solid ${components.card.borderColor}`
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-relative uf-flex-shrink-0 uf-w-9 uf-h-9", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "uf-relative uf-flex-shrink-0 uf-w-9 uf-h-9", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
             "img",
             {
               src: execution.destination_token_metadata?.icon_url || getIconUrl("/icons/tokens/svg/usdc.svg"),
@@ -60523,12 +61655,12 @@ function WithdrawExecutionItem({
               className: "uf-rounded-full uf-w-9 uf-h-9"
             }
           ),
-          isPending ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+          isPending ? /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
             "div",
             {
               className: "uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-rounded-full uf-p-0.5",
               style: { backgroundColor: colors2.warning },
-              children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
                 "svg",
                 {
                   width: "10",
@@ -60536,7 +61668,7 @@ function WithdrawExecutionItem({
                   viewBox: "0 0 12 12",
                   fill: "none",
                   className: "uf-animate-spin uf-block",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
                     "path",
                     {
                       d: "M6 1V3M6 9V11M1 6H3M9 6H11M2.5 2.5L4 4M8 8L9.5 9.5M2.5 9.5L4 8M8 4L9.5 2.5",
@@ -60548,12 +61680,12 @@ function WithdrawExecutionItem({
                 }
               )
             }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+          ) : /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
             "div",
             {
               className: "uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-rounded-full uf-p-0.5",
               style: { backgroundColor: colors2.success },
-              children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
                 "svg",
                 {
                   width: "10",
@@ -60561,7 +61693,7 @@ function WithdrawExecutionItem({
                   viewBox: "0 0 12 12",
                   fill: "none",
                   className: "uf-block",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+                  children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
                     "path",
                     {
                       d: "M10 3L4.5 8.5L2 6",
@@ -60576,8 +61708,8 @@ function WithdrawExecutionItem({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "uf-flex-1 uf-min-w-0", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "uf-flex-1 uf-min-w-0", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
             "h3",
             {
               className: "uf-font-medium uf-text-sm uf-leading-tight",
@@ -60588,7 +61720,7 @@ function WithdrawExecutionItem({
               children: isPending ? "Withdrawal processing" : "Withdrawal completed"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
             "p",
             {
               className: "uf-text-xs uf-leading-tight",
@@ -60600,7 +61732,7 @@ function WithdrawExecutionItem({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
           "span",
           {
             className: "uf-font-medium uf-text-sm uf-flex-shrink-0",
@@ -60611,7 +61743,7 @@ function WithdrawExecutionItem({
             children: formatUsdAmount2(execution.source_amount_usd || "0")
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
           ChevronRight,
           {
             className: "uf-w-4 uf-h-4 uf-flex-shrink-0",
@@ -60634,9 +61766,9 @@ function WithdrawConfirmingView({
   onViewTracker
 }) {
   const { colors: colors2, fonts, components } = useTheme();
-  const [showButton, setShowButton] = (0, import_react30.useState)(false);
+  const [showButton, setShowButton] = (0, import_react31.useState)(false);
   const latestExecution = executions.length > 0 ? executions[executions.length - 1] : null;
-  (0, import_react30.useEffect)(() => {
+  (0, import_react31.useEffect)(() => {
     if (latestExecution) return;
     const timer = setTimeout(() => setShowButton(true), SHOW_BUTTON_DELAY_MS);
     return () => clearTimeout(timer);
@@ -60644,11 +61776,11 @@ function WithdrawConfirmingView({
   const btnRadius = components.button.borderRadius;
   const btnBorder = `${components.button.borderWidth}px solid ${components.button.borderColor}`;
   if (latestExecution) {
-    return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DepositHeader, { title: "Withdrawal Details", showClose: true, onClose }),
-      /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DepositDetailContent, { execution: latestExecution, variant: "withdraw" }),
-      /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "uf-flex uf-gap-2 uf-px-2 uf-pt-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal Details", showClose: true, onClose }),
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositDetailContent, { execution: latestExecution, variant: "withdraw" }),
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "uf-flex uf-gap-2 uf-px-2 uf-pt-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
           "button",
           {
             type: "button",
@@ -60664,7 +61796,7 @@ function WithdrawConfirmingView({
             children: "Withdrawal History"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
           "button",
           {
             type: "button",
@@ -60681,7 +61813,7 @@ function WithdrawConfirmingView({
           }
         )
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
         PoweredByUnifold,
         {
           color: colors2.foregroundMuted,
@@ -60690,15 +61822,15 @@ function WithdrawConfirmingView({
       ) })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(import_jsx_runtime74.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(DepositHeader, { title: "Withdrawal Status", showClose: true, onClose }),
-    /* @__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: [
-      /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal Status", showClose: true, onClose }),
+    /* @__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: [
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
         "div",
         {
           className: "uf-w-20 uf-h-20 uf-rounded-full uf-flex uf-items-center uf-justify-center uf-mb-6",
           style: { backgroundColor: `${colors2.primary}20` },
-          children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
             "svg",
             {
               width: "40",
@@ -60706,7 +61838,7 @@ function WithdrawConfirmingView({
               viewBox: "0 0 24 24",
               fill: "none",
               className: "uf-animate-spin",
-              children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
                 "path",
                 {
                   d: "M21 12a9 9 0 1 1-6.22-8.56",
@@ -60719,7 +61851,7 @@ function WithdrawConfirmingView({
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
         "h3",
         {
           className: "uf-text-xl uf-mb-2",
@@ -60727,7 +61859,7 @@ function WithdrawConfirmingView({
           children: "Checking Withdrawal"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
         "p",
         {
           className: "uf-text-sm uf-text-center",
@@ -60743,7 +61875,7 @@ function WithdrawConfirmingView({
         }
       )
     ] }),
-    showButton && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "uf-px-1 uf-pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+    showButton && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-px-1 uf-pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
       "button",
       {
         type: "button",
@@ -60759,7 +61891,7 @@ function WithdrawConfirmingView({
         children: "Withdrawal History"
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "uf-pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
       PoweredByUnifold,
       {
         color: colors2.foregroundMuted,
@@ -60789,14 +61921,14 @@ function WithdrawModal({
   hideOverlay = false
 }) {
   const { colors: colors2, fonts, components } = useTheme();
-  const [containerEl, setContainerEl] = (0, import_react27.useState)(null);
-  const containerCallbackRef = (0, import_react27.useCallback)((el) => {
+  const [containerEl, setContainerEl] = (0, import_react28.useState)(null);
+  const containerCallbackRef = (0, import_react28.useCallback)((el) => {
     setContainerEl(el);
   }, []);
-  const [resolvedTheme, setResolvedTheme] = (0, import_react27.useState)(
+  const [resolvedTheme, setResolvedTheme] = (0, import_react28.useState)(
     theme === "auto" ? "dark" : theme
   );
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (theme === "auto") {
       const mq = window.matchMedia("(prefers-color-scheme: dark)");
       setResolvedTheme(mq.matches ? "dark" : "light");
@@ -60825,12 +61957,12 @@ function WithdrawModal({
     publishableKey,
     enabled: open
   });
-  const [selectedToken, setSelectedToken] = (0, import_react27.useState)(null);
-  const [selectedChain, setSelectedChain] = (0, import_react27.useState)(null);
-  const [detectedWallet, setDetectedWallet] = (0, import_react27.useState)(null);
+  const [selectedToken, setSelectedToken] = (0, import_react28.useState)(null);
+  const [selectedChain, setSelectedChain] = (0, import_react28.useState)(null);
+  const [detectedWallet, setDetectedWallet] = (0, import_react28.useState)(null);
   const connectedWalletName = detectedWallet?.name ?? null;
   const isWalletMatch = !!detectedWallet;
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (!senderAddress || !open) {
       setDetectedWallet(null);
       return;
@@ -60843,10 +61975,10 @@ function WithdrawModal({
       cancelled = true;
     };
   }, [senderAddress, sourceChainType, open]);
-  const [view, setView] = (0, import_react27.useState)("form");
-  const [withdrawDepositWalletId, setWithdrawDepositWalletId] = (0, import_react27.useState)();
-  const [selectedExecution, setSelectedExecution] = (0, import_react27.useState)(null);
-  const [submittedTxInfo, setSubmittedTxInfo] = (0, import_react27.useState)(null);
+  const [view, setView] = (0, import_react28.useState)("form");
+  const [withdrawDepositWalletId, setWithdrawDepositWalletId] = (0, import_react28.useState)();
+  const [selectedExecution, setSelectedExecution] = (0, import_react28.useState)(null);
+  const [submittedTxInfo, setSubmittedTxInfo] = (0, import_react28.useState)(null);
   const { executions: realtimeExecutions } = useWithdrawPolling({
     userId: externalUserId,
     publishableKey,
@@ -60861,7 +61993,7 @@ function WithdrawModal({
     refetchInterval: view === "tracker" || view === "detail" ? 5e3 : 15e3
   });
   const allWithdrawals = allWithdrawalsData?.data ?? [];
-  const handleDepositWalletCreation = (0, import_react27.useCallback)(async (params) => {
+  const handleDepositWalletCreation = (0, import_react28.useCallback)(async (params) => {
     const { data: wallets } = await createDepositAddress(
       {
         external_user_id: externalUserId,
@@ -60880,11 +62012,11 @@ function WithdrawModal({
     setWithdrawDepositWalletId(depositWallet.id);
     return depositWallet;
   }, [externalUserId, publishableKey, sourceChainType]);
-  const handleWithdrawSubmitted = (0, import_react27.useCallback)((txInfo) => {
+  const handleWithdrawSubmitted = (0, import_react28.useCallback)((txInfo) => {
     setSubmittedTxInfo(txInfo);
     setView("confirming");
   }, []);
-  (0, import_react27.useEffect)(() => {
+  (0, import_react28.useEffect)(() => {
     if (!destinationTokens.length || selectedToken) return;
     const first = destinationTokens[0];
     if (first?.chains.length > 0) {
@@ -60892,8 +62024,8 @@ function WithdrawModal({
       setSelectedChain(first.chains[0]);
     }
   }, [destinationTokens, selectedToken]);
-  const resetViewTimeoutRef = (0, import_react27.useRef)(null);
-  const handleClose = (0, import_react27.useCallback)(() => {
+  const resetViewTimeoutRef = (0, import_react28.useRef)(null);
+  const handleClose = (0, import_react28.useCallback)(() => {
     onOpenChange(false);
     if (resetViewTimeoutRef.current) clearTimeout(resetViewTimeoutRef.current);
     resetViewTimeoutRef.current = setTimeout(() => {
@@ -60906,7 +62038,7 @@ function WithdrawModal({
       resetViewTimeoutRef.current = null;
     }, 200);
   }, [onOpenChange]);
-  (0, import_react27.useLayoutEffect)(() => {
+  (0, import_react28.useLayoutEffect)(() => {
     if (!open) return;
     if (resetViewTimeoutRef.current) {
       clearTimeout(resetViewTimeoutRef.current);
@@ -60919,17 +62051,17 @@ function WithdrawModal({
     setSubmittedTxInfo(null);
     setWithdrawDepositWalletId(void 0);
   }, [open]);
-  (0, import_react27.useEffect)(() => () => {
+  (0, import_react28.useEffect)(() => () => {
     if (resetViewTimeoutRef.current) clearTimeout(resetViewTimeoutRef.current);
   }, []);
-  const handleTokenSymbolChange = (0, import_react27.useCallback)((symbol) => {
+  const handleTokenSymbolChange = (0, import_react28.useCallback)((symbol) => {
     const tok = destinationTokens.find((t11) => t11.symbol === symbol);
     if (tok) {
       setSelectedToken(tok);
       if (tok.chains.length > 0) setSelectedChain(tok.chains[0]);
     }
   }, [destinationTokens]);
-  const handleChainKeyChange = (0, import_react27.useCallback)((chainKey) => {
+  const handleChainKeyChange = (0, import_react28.useCallback)((chainKey) => {
     if (!selectedToken) return;
     const chain = selectedToken.chains.find((c) => getChainKey5(c.chain_id, c.chain_type) === chainKey);
     if (chain) setSelectedChain(chain);
@@ -60937,8 +62069,8 @@ function WithdrawModal({
   const isSourceSupported = sourceValidation?.isSupported ?? null;
   const canWithdraw = !!onWithdraw || isWalletMatch;
   const isAnyLoading = tokensLoading || isCheckingSourceToken;
-  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" }) });
-  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)(
+  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" }) });
+  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)(
     DialogContent2,
     {
       ref: hideOverlay ? containerCallbackRef : void 0,
@@ -60947,7 +62079,7 @@ function WithdrawModal({
       style: { backgroundColor: colors2.background },
       onPointerDownOutside: (e) => e.preventDefault(),
       onInteractOutside: (e) => e.preventDefault(),
-      children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ThemeStyleInjector, { children: view === "confirming" && submittedTxInfo ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(ThemeStyleInjector, { children: view === "confirming" && submittedTxInfo ? /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
         WithdrawConfirmingView,
         {
           txInfo: submittedTxInfo,
@@ -60955,18 +62087,18 @@ function WithdrawModal({
           onClose: handleClose,
           onViewTracker: () => setView("tracker")
         }
-      ) : view === "detail" && selectedExecution ? /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal Details", showBack: true, showClose: !hideOverlay, onBack: () => {
+      ) : view === "detail" && selectedExecution ? /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositHeader, { title: "Withdrawal Details", showBack: true, showClose: !hideOverlay, onBack: () => {
           setSelectedExecution(null);
           setView("tracker");
         }, onClose: handleClose }),
-        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositDetailContent, { execution: selectedExecution, variant: "withdraw" }),
+        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositDetailContent, { execution: selectedExecution, variant: "withdraw" }),
         withdrawPoweredByFooter
       ] }) : view === "tracker" ? (
         /* ---------- Tracker view: execution list ---------- */
-        /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: "Withdrawal History", showBack: true, showClose: !hideOverlay, onBack: () => setView("form"), onClose: handleClose }),
-          /* @__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)(
+        /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositHeader, { title: "Withdrawal History", showBack: true, showClose: !hideOverlay, onBack: () => setView("form"), onClose: handleClose }),
+          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "uf-flex uf-flex-col uf-gap-2", style: { minHeight: 200 }, 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)(
             WithdrawExecutionItem,
             {
               execution: ex,
@@ -60981,15 +62113,15 @@ function WithdrawModal({
         ] })
       ) : (
         /* ---------- Form view (default) ---------- */
-        /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DepositHeader, { title: modalTitle || t9.title, showClose: !hideOverlay, onClose: handleClose }),
-          /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-3", children: [
-            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: [
-              /* @__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" }) }),
-              /* @__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" }),
-              /* @__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 })
-            ] }) : /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(import_jsx_runtime75.Fragment, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DepositHeader, { title: modalTitle || t9.title, showClose: !hideOverlay, onClose: handleClose }),
+          /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: "uf-flex uf-flex-col uf-gap-3", children: [
+            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: [
+              /* @__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" }) }),
+              /* @__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" }),
+              /* @__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 })
+            ] }) : /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(import_jsx_runtime76.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
                 WithdrawDoubleInput,
                 {
                   tokens: destinationTokens,
@@ -61000,7 +62132,7 @@ function WithdrawModal({
                   isLoading: tokensLoading
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
                 WithdrawForm,
                 {
                   publishableKey,
@@ -61026,16 +62158,16 @@ function WithdrawModal({
                   onWithdrawError,
                   onDepositWalletCreation: handleDepositWalletCreation,
                   onWithdrawSubmitted: handleWithdrawSubmitted,
-                  footerLeft: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
+                  footerLeft: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
                     "button",
                     {
                       onClick: () => setView("tracker"),
                       className: "uf-flex uf-items-center uf-gap-1 uf-transition-colors hover:uf-opacity-70",
                       style: { color: colors2.foregroundMuted },
                       children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Clock, { className: "uf-w-3.5 uf-h-3.5" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Clock, { className: "uf-w-3.5 uf-h-3.5" }),
                         "Withdrawal History",
-                        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(ChevronRight, { className: "uf-w-3 uf-h-3" })
+                        /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(ChevronRight, { className: "uf-w-3 uf-h-3" })
                       ]
                     }
                   )
@@ -61059,6 +62191,10 @@ function UnifoldProvider2({
   const [depositConfig, setDepositConfig] = (0, import_react.useState)(
     null
   );
+  const [isCheckoutOpen, setIsCheckoutOpen] = (0, import_react.useState)(false);
+  const [checkoutConfig, setCheckoutConfig] = (0, import_react.useState)(
+    null
+  );
   const [isWithdrawOpen, setIsWithdrawOpen] = (0, import_react.useState)(false);
   const [withdrawConfig, setWithdrawConfig] = (0, import_react.useState)(
     null
@@ -61158,6 +62294,75 @@ function UnifoldProvider2({
       depositPromiseRef.current = null;
     }
   }, [depositConfig]);
+  const checkoutPromiseRef = import_react.default.useRef(null);
+  const checkoutConfigRef = import_react.default.useRef(null);
+  checkoutConfigRef.current = checkoutConfig;
+  const checkoutCloseTimeoutRef = import_react.default.useRef(null);
+  const checkoutCloseGuardRef = import_react.default.useRef(false);
+  const beginCheckout = (0, import_react.useCallback)((config2) => {
+    if (checkoutCloseTimeoutRef.current) {
+      clearTimeout(checkoutCloseTimeoutRef.current);
+      checkoutCloseTimeoutRef.current = null;
+    }
+    checkoutCloseGuardRef.current = false;
+    if (checkoutPromiseRef.current) {
+      console.warn("[UnifoldProvider] A checkout is already in progress. Cancelling previous checkout.");
+      checkoutPromiseRef.current.reject({
+        message: "Checkout cancelled - new checkout started",
+        code: "CHECKOUT_SUPERSEDED"
+      });
+      checkoutPromiseRef.current = null;
+    }
+    const promise = new Promise((resolve, reject) => {
+      checkoutPromiseRef.current = { resolve, reject };
+    });
+    promise.catch(() => {
+    });
+    setCheckoutConfig(config2);
+    setIsCheckoutOpen(true);
+    return promise;
+  }, []);
+  const closeCheckout = (0, import_react.useCallback)(() => {
+    if (checkoutCloseGuardRef.current) {
+      return;
+    }
+    checkoutCloseGuardRef.current = true;
+    const promiseToReject = checkoutPromiseRef.current;
+    checkoutPromiseRef.current = null;
+    if (checkoutConfigRef.current?.onClose) {
+      checkoutConfigRef.current.onClose();
+    }
+    if (promiseToReject) {
+      promiseToReject.reject({
+        message: "Checkout cancelled by user",
+        code: "CHECKOUT_CANCELLED"
+      });
+    }
+    setIsCheckoutOpen(false);
+    checkoutCloseTimeoutRef.current = setTimeout(() => {
+      setCheckoutConfig(null);
+      checkoutCloseTimeoutRef.current = null;
+    }, 200);
+  }, []);
+  const handleCheckoutSuccess = (0, import_react.useCallback)((data) => {
+    if (checkoutConfig?.onSuccess) {
+      checkoutConfig.onSuccess(data);
+    }
+    if (checkoutPromiseRef.current) {
+      checkoutPromiseRef.current.resolve(data);
+      checkoutPromiseRef.current = null;
+    }
+  }, [checkoutConfig]);
+  const handleCheckoutError = (0, import_react.useCallback)((error) => {
+    console.error("[UnifoldProvider] Checkout error:", error);
+    if (checkoutConfig?.onError) {
+      checkoutConfig.onError(error);
+    }
+    if (checkoutPromiseRef.current) {
+      checkoutPromiseRef.current.reject(error);
+      checkoutPromiseRef.current = null;
+    }
+  }, [checkoutConfig]);
   const beginWithdraw = (0, import_react.useCallback)((config2) => {
     if (withdrawCloseTimeoutRef.current) {
       clearTimeout(withdrawCloseTimeoutRef.current);
@@ -61226,16 +62431,16 @@ function UnifoldProvider2({
     () => ({
       beginDeposit,
       closeDeposit,
-      handleDepositSuccess,
-      handleDepositError,
+      beginCheckout,
+      closeCheckout,
       beginWithdraw,
       closeWithdraw,
       handleWithdrawSuccess,
       handleWithdrawError
     }),
-    [beginDeposit, closeDeposit, handleDepositSuccess, handleDepositError, beginWithdraw, closeWithdraw, handleWithdrawSuccess, handleWithdrawError]
+    [beginDeposit, closeDeposit, beginCheckout, closeCheckout, beginWithdraw, closeWithdraw, handleWithdrawSuccess, handleWithdrawError]
   );
-  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)(
+  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)(
     ThemeProvider,
     {
       mode: resolvedTheme,
@@ -61246,7 +62451,20 @@ function UnifoldProvider2({
       components: config?.components,
       children: [
         children,
-        withdrawConfig && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+        checkoutConfig && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+          CheckoutModal,
+          {
+            open: isCheckoutOpen,
+            onOpenChange: closeCheckout,
+            clientSecret: checkoutConfig.clientSecret,
+            publishableKey,
+            enableConnectWallet: config?.enableConnectWallet,
+            theme: resolvedTheme,
+            onCheckoutSuccess: handleCheckoutSuccess,
+            onCheckoutError: handleCheckoutError
+          }
+        ),
+        withdrawConfig && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
           WithdrawModal,
           {
             open: isWithdrawOpen,
@@ -61266,7 +62484,7 @@ function UnifoldProvider2({
             theme: resolvedTheme
           }
         ),
-        depositConfig && /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+        depositConfig && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
           DepositModal,
           {
             open: isOpen,
@@ -61317,6 +62535,9 @@ function useUnifold2() {
       beginDeposit: () => Promise.reject(new Error("SSR not supported")),
       closeDeposit: () => {
       },
+      beginCheckout: () => Promise.reject(new Error("SSR not supported")),
+      closeCheckout: () => {
+      },
       beginWithdraw: () => Promise.reject(new Error("SSR not supported")),
       closeWithdraw: () => {
       }
@@ -61329,15 +62550,17 @@ function useUnifold2() {
     publishableKey: baseContext.publishableKey,
     beginDeposit: connectContext.beginDeposit,
     closeDeposit: connectContext.closeDeposit,
+    beginCheckout: connectContext.beginCheckout,
+    closeCheckout: connectContext.closeCheckout,
     beginWithdraw: connectContext.beginWithdraw,
     closeWithdraw: connectContext.closeWithdraw
   };
 }
 
 // src/unifold.tsx
-var UnifoldBridge = (0, import_react32.forwardRef)((_, ref) => {
+var UnifoldBridge = (0, import_react33.forwardRef)((_, ref) => {
   const { beginDeposit, closeDeposit, beginWithdraw, closeWithdraw } = useUnifold2();
-  (0, import_react32.useImperativeHandle)(ref, () => ({ beginDeposit, closeDeposit, beginWithdraw, closeWithdraw }), [
+  (0, import_react33.useImperativeHandle)(ref, () => ({ beginDeposit, closeDeposit, beginWithdraw, closeWithdraw }), [
     beginDeposit,
     closeDeposit,
     beginWithdraw,
@@ -61346,7 +62569,7 @@ var UnifoldBridge = (0, import_react32.forwardRef)((_, ref) => {
   return null;
 });
 UnifoldBridge.displayName = "UnifoldBridge";
-var RenderErrorBoundary = class extends import_react32.Component {
+var RenderErrorBoundary = class extends import_react33.Component {
   constructor() {
     super(...arguments);
     this.state = { hasError: false };
@@ -61420,13 +62643,13 @@ function createUnifold(publishableKey, config) {
     };
     try {
       root.render(
-        import_react32.default.createElement(
+        import_react33.default.createElement(
           RenderErrorBoundary,
           { onError: handleRenderError },
-          import_react32.default.createElement(
+          import_react33.default.createElement(
             UnifoldProvider2,
             { publishableKey, config },
-            import_react32.default.createElement(UnifoldBridge, { ref: refCallback })
+            import_react33.default.createElement(UnifoldBridge, { ref: refCallback })
           )
         )
       );
@@ -61450,6 +62673,7 @@ lucide-react/dist/esm/Icon.js:
 lucide-react/dist/esm/createLucideIcon.js:
 lucide-react/dist/esm/icons/arrow-left-right.js:
 lucide-react/dist/esm/icons/arrow-left.js:
+lucide-react/dist/esm/icons/arrow-right.js:
 lucide-react/dist/esm/icons/arrow-up-down.js:
 lucide-react/dist/esm/icons/check.js:
 lucide-react/dist/esm/icons/chevron-down.js: