@unifold/ui-react 0.1.18 → 0.1.19

package/dist/index.mjs

@@ -121,10 +121,7 @@ var DialogTitle = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE
   DialogPrimitive.Title,
   {
     ref,
-    className: cn(
-      "uf-leading-none uf-tracking-tight",
-      className
-    ),
+    className: cn("uf-leading-none uf-tracking-tight", className),
     ...props
   }
 ));
@@ -150,7 +147,8 @@ import {
   ShieldCheck,
   Clock,
   FileText,
-  ChevronRight as ChevronRight2
+  ChevronRight as ChevronRight2,
+  Copy
 } from "lucide-react";
 
 // src/components/deposits/StyledQRCode.tsx
@@ -286,7 +284,10 @@ function DepositHeader({
 
 // src/components/deposits/DepositExecutionItem.tsx
 import { ChevronRight } from "lucide-react";
-import { ExecutionStatus, getIconUrl } from "@unifold/core";
+import {
+  ExecutionStatus,
+  getIconUrl
+} from "@unifold/core";
 import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
 function DepositExecutionItem({
   execution,
@@ -359,16 +360,26 @@ function DepositExecutionItem({
                 }
               )
             }
-          ) }) : /* @__PURE__ */ jsx5("div", { className: "uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-bg-green-500 uf-rounded-full uf-p-0.5", children: /* @__PURE__ */ jsx5("svg", { width: "10", height: "10", viewBox: "0 0 12 12", fill: "none", className: "uf-block", children: /* @__PURE__ */ jsx5(
-            "path",
+          ) }) : /* @__PURE__ */ jsx5("div", { className: "uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-bg-green-500 uf-rounded-full uf-p-0.5", children: /* @__PURE__ */ jsx5(
+            "svg",
             {
-              d: "M10 3L4.5 8.5L2 6",
-              stroke: "white",
-              strokeWidth: "2",
-              strokeLinecap: "round",
-              strokeLinejoin: "round"
+              width: "10",
+              height: "10",
+              viewBox: "0 0 12 12",
+              fill: "none",
+              className: "uf-block",
+              children: /* @__PURE__ */ jsx5(
+                "path",
+                {
+                  d: "M10 3L4.5 8.5L2 6",
+                  stroke: "white",
+                  strokeWidth: "2",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round"
+                }
+              )
             }
-          ) }) })
+          ) })
         ] }),
         /* @__PURE__ */ jsxs3("div", { className: "uf-flex-1 uf-min-w-0", children: [
           /* @__PURE__ */ jsx5("h3", { className: "uf-text-foreground uf-font-medium uf-text-sm uf-leading-tight", children: isPending ? "Deposit processing" : "Deposit completed" }),
@@ -551,7 +562,10 @@ function DepositDetailContent({ execution }) {
       /* @__PURE__ */ jsxs4("div", { className: "uf-flex uf-justify-between uf-items-center uf-px-4 uf-py-3 uf-border-b uf-border-border/50", children: [
         /* @__PURE__ */ jsx6("span", { className: "uf-text-muted-foreground uf-text-sm", children: "Amount Sent" }),
         /* @__PURE__ */ jsxs4("span", { className: "uf-text-foreground uf-font-medium", children: [
-          formatAmount(execution.source_amount_base_unit, execution.source_token_metadata?.decimals),
+          formatAmount(
+            execution.source_amount_base_unit,
+            execution.source_token_metadata?.decimals
+          ),
           " ",
           formatCurrency(execution.source_currency)
         ] })
@@ -559,22 +573,34 @@ function DepositDetailContent({ execution }) {
       /* @__PURE__ */ jsxs4("div", { className: "uf-flex uf-justify-between uf-items-center uf-px-4 uf-py-3 uf-border-b uf-border-border/50", children: [
         /* @__PURE__ */ jsx6("span", { className: "uf-text-muted-foreground uf-text-sm", children: "Amount Received" }),
         /* @__PURE__ */ jsxs4("span", { className: "uf-text-foreground uf-font-medium", children: [
-          formatAmount(execution.destination_amount_base_unit, execution.destination_token_metadata?.decimals),
+          formatAmount(
+            execution.destination_amount_base_unit,
+            execution.destination_token_metadata?.decimals
+          ),
           " ",
           formatCurrency(execution.destination_currency)
         ] })
       ] }),
       /* @__PURE__ */ jsxs4("div", { className: "uf-flex uf-justify-between uf-items-center uf-px-4 uf-py-3 uf-border-b uf-border-border/50", children: [
         /* @__PURE__ */ jsx6("span", { className: "uf-text-muted-foreground uf-text-sm", children: "USD Value" }),
-        /* @__PURE__ */ jsx6("span", { className: "uf-text-foreground uf-font-medium", children: formatUsdAmount(execution.source_amount_usd, execution.source_amount_base_unit) })
+        /* @__PURE__ */ jsx6("span", { className: "uf-text-foreground uf-font-medium", children: formatUsdAmount(
+          execution.source_amount_usd,
+          execution.source_amount_base_unit
+        ) })
       ] }),
       /* @__PURE__ */ jsxs4("div", { className: "uf-flex uf-justify-between uf-items-center uf-px-4 uf-py-3 uf-border-b uf-border-border/50", children: [
         /* @__PURE__ */ jsx6("span", { className: "uf-text-muted-foreground uf-text-sm", children: "Source Network" }),
-        /* @__PURE__ */ jsx6("span", { className: "uf-text-foreground uf-font-medium", children: getNetworkName(execution.source_chain_type, execution.source_chain_id) })
+        /* @__PURE__ */ jsx6("span", { className: "uf-text-foreground uf-font-medium", children: getNetworkName(
+          execution.source_chain_type,
+          execution.source_chain_id
+        ) })
       ] }),
       /* @__PURE__ */ jsxs4("div", { className: "uf-flex uf-justify-between uf-items-center uf-px-4 uf-py-3", children: [
         /* @__PURE__ */ jsx6("span", { className: "uf-text-muted-foreground uf-text-sm", children: "Destination Network" }),
-        /* @__PURE__ */ jsx6("span", { className: "uf-text-foreground uf-font-medium", children: getNetworkName(execution.destination_chain_type, execution.destination_chain_id) })
+        /* @__PURE__ */ jsx6("span", { className: "uf-text-foreground uf-font-medium", children: getNetworkName(
+          execution.destination_chain_type,
+          execution.destination_chain_id
+        ) })
       ] })
     ] }),
     /* @__PURE__ */ jsxs4(
@@ -613,7 +639,9 @@ function DepositDetailContent({ execution }) {
           className: "uf-grid uf-grid-cols-[auto_1fr_auto] uf-items-center uf-gap-2 uf-px-4 uf-py-3 hover:uf-bg-card/50 uf-transition-colors",
           children: [
             /* @__PURE__ */ jsx6("div", { className: "uf-text-muted-foreground uf-text-sm", children: "Completion Tx" }),
-            /* @__PURE__ */ jsx6("div", { className: "uf-text-sm uf-text-foreground uf-text-right", children: formatTransactionHash(execution.destination_transaction_hashes[0]) }),
+            /* @__PURE__ */ jsx6("div", { className: "uf-text-sm uf-text-foreground uf-text-right", children: formatTransactionHash(
+              execution.destination_transaction_hashes[0]
+            ) }),
             /* @__PURE__ */ jsx6(ExternalLink, { className: "uf-w-3.5 uf-h-3.5 uf-text-muted-foreground uf-block" })
           ]
         }
@@ -677,42 +705,51 @@ function DepositsModal({
   const handleExecutionClick = (execution) => {
     setSelectedExecution(execution);
   };
-  return /* @__PURE__ */ jsx7(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsx7(DialogContent, { className: `sm:uf-max-w-[400px] !uf-bg-card uf-border-secondary uf-text-foreground uf-p-0 uf-gap-0 [&>button]:uf-hidden ${themeClass}`, children: selectedExecution ? /* @__PURE__ */ jsxs5(Fragment, { children: [
-    /* @__PURE__ */ jsx7(
-      DepositHeader,
-      {
-        title: "Deposit Details",
-        showBack: true,
-        onBack: () => setSelectedExecution(null),
-        onClose: handleClose
-      }
-    ),
-    /* @__PURE__ */ jsx7(DepositDetailContent, { execution: selectedExecution })
-  ] }) : /* @__PURE__ */ jsxs5(Fragment, { children: [
-    /* @__PURE__ */ jsx7(
-      DepositHeader,
-      {
-        title: "Deposit Tracker",
-        showBack: true,
-        onBack: handleBack,
-        onClose: handleClose
-      }
-    ),
-    /* @__PURE__ */ jsx7("div", { className: "uf-max-h-[400px] uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: /* @__PURE__ */ jsx7("div", { className: "uf-space-y-2", children: allExecutions.length === 0 ? /* @__PURE__ */ jsx7("div", { className: "uf-py-8 uf-px-4 uf-text-center", children: /* @__PURE__ */ jsx7("div", { className: "uf-text-muted-foreground uf-text-sm", children: "No deposits yet" }) }) : /* @__PURE__ */ jsx7(Fragment, { children: allExecutions.map((execution) => /* @__PURE__ */ jsx7(
-      DepositExecutionItem,
-      {
-        execution,
-        onClick: () => handleExecutionClick(execution)
-      },
-      execution.id
-    )) }) }) })
-  ] }) }) });
+  return /* @__PURE__ */ jsx7(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsx7(
+    DialogContent,
+    {
+      className: `sm:uf-max-w-[400px] !uf-bg-card uf-border-secondary uf-text-foreground uf-p-0 uf-gap-0 [&>button]:uf-hidden ${themeClass}`,
+      children: selectedExecution ? /* @__PURE__ */ jsxs5(Fragment, { children: [
+        /* @__PURE__ */ jsx7(
+          DepositHeader,
+          {
+            title: "Deposit Details",
+            showBack: true,
+            onBack: () => setSelectedExecution(null),
+            onClose: handleClose
+          }
+        ),
+        /* @__PURE__ */ jsx7(DepositDetailContent, { execution: selectedExecution })
+      ] }) : /* @__PURE__ */ jsxs5(Fragment, { children: [
+        /* @__PURE__ */ jsx7(
+          DepositHeader,
+          {
+            title: "Deposit Tracker",
+            showBack: true,
+            onBack: handleBack,
+            onClose: handleClose
+          }
+        ),
+        /* @__PURE__ */ jsx7("div", { className: "uf-max-h-[400px] uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: /* @__PURE__ */ jsx7("div", { className: "uf-space-y-2", children: allExecutions.length === 0 ? /* @__PURE__ */ jsx7("div", { className: "uf-py-8 uf-px-4 uf-text-center", children: /* @__PURE__ */ jsx7("div", { className: "uf-text-muted-foreground uf-text-sm", children: "No deposits yet" }) }) : /* @__PURE__ */ jsx7(Fragment, { children: allExecutions.map((execution) => /* @__PURE__ */ jsx7(
+          DepositExecutionItem,
+          {
+            execution,
+            onClick: () => handleExecutionClick(execution)
+          },
+          execution.id
+        )) }) }) })
+      ] })
+    }
+  ) });
 }
 
 // src/components/deposits/DepositSuccessToast.tsx
 import { useState as useState3 } from "react";
 import { X as X3 } from "lucide-react";
-import { ExecutionStatus as ExecutionStatus3, getIconUrl as getIconUrl3 } from "@unifold/core";
+import {
+  ExecutionStatus as ExecutionStatus3,
+  getIconUrl as getIconUrl3
+} from "@unifold/core";
 import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
 function DepositSuccessToast({
   depositTx,
@@ -858,22 +895,28 @@ function DepositSuccessToast({
         }
       )
     ] }) }),
-    execution && /* @__PURE__ */ jsx8(Dialog, { open: detailModalOpen, onOpenChange: setDetailModalOpen, children: /* @__PURE__ */ jsxs6(DialogContent, { className: `sm:uf-max-w-[400px] !uf-bg-card uf-border-secondary uf-text-foreground uf-p-0 uf-mt-8 uf-gap-0 [&>button]:uf-hidden ${themeClass}`, children: [
-      /* @__PURE__ */ jsxs6("div", { className: "uf-flex uf-items-center uf-justify-between uf-px-4", children: [
-        /* @__PURE__ */ jsx8("div", { className: "uf-w-8" }),
-        " ",
-        /* @__PURE__ */ jsx8("h2", { className: "uf-text-lg uf-font-semibold uf-text-foreground", children: "Deposit Details" }),
-        /* @__PURE__ */ jsx8(
-          "button",
-          {
-            onClick: () => setDetailModalOpen(false),
-            className: "uf-text-muted-foreground hover:uf-text-foreground uf-transition-colors uf-w-8 uf-flex uf-justify-end",
-            children: /* @__PURE__ */ jsx8(X3, { className: "uf-w-5 uf-h-5" })
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx8(DepositDetailContent, { execution })
-    ] }) })
+    execution && /* @__PURE__ */ jsx8(Dialog, { open: detailModalOpen, onOpenChange: setDetailModalOpen, children: /* @__PURE__ */ jsxs6(
+      DialogContent,
+      {
+        className: `sm:uf-max-w-[400px] !uf-bg-card uf-border-secondary uf-text-foreground uf-p-0 uf-mt-8 uf-gap-0 [&>button]:uf-hidden ${themeClass}`,
+        children: [
+          /* @__PURE__ */ jsxs6("div", { className: "uf-flex uf-items-center uf-justify-between uf-px-4", children: [
+            /* @__PURE__ */ jsx8("div", { className: "uf-w-8" }),
+            " ",
+            /* @__PURE__ */ jsx8("h2", { className: "uf-text-lg uf-font-semibold uf-text-foreground", children: "Deposit Details" }),
+            /* @__PURE__ */ jsx8(
+              "button",
+              {
+                onClick: () => setDetailModalOpen(false),
+                className: "uf-text-muted-foreground hover:uf-text-foreground uf-transition-colors uf-w-8 uf-flex uf-justify-end",
+                children: /* @__PURE__ */ jsx8(X3, { className: "uf-w-5 uf-h-5" })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx8(DepositDetailContent, { execution })
+        ]
+      }
+    ) })
   ] });
 }
 
@@ -963,7 +1006,10 @@ var SelectLabel = React3.forwardRef(({ className, ...props }, ref) => /* @__PURE
   SelectPrimitive.Label,
   {
     ref,
-    className: cn("uf-py-1.5 uf-pl-8 uf-pr-2 uf-text-sm uf-font-semibold", className),
+    className: cn(
+      "uf-py-1.5 uf-pl-8 uf-pr-2 uf-text-sm uf-font-semibold",
+      className
+    ),
     ...props
   }
 ));
@@ -1224,7 +1270,9 @@ function TransferCryptoBase({
       } catch (err) {
         console.error("Error fetching wallets, retrying in 5s:", err);
         if (!isCancelled) {
-          setError(err instanceof Error ? err.message : "Failed to load wallets");
+          setError(
+            err instanceof Error ? err.message : "Failed to load wallets"
+          );
           setLoading(false);
           retryTimeout = setTimeout(fetchWallets, 5e3);
         }
@@ -1469,21 +1517,28 @@ function TransferCryptoBase({
             disabled: tokensLoading || availableChainsForToken.length === 0,
             children: [
               /* @__PURE__ */ jsx11(SelectTrigger, { className: "uf-bg-secondary uf-border-none uf-rounded-lg uf-h-10 hover:uf-bg-accent uf-text-foreground focus:uf-ring-1 focus:uf-ring-ring disabled:uf-opacity-50", children: /* @__PURE__ */ jsx11(SelectValue, { children: tokensLoading ? /* @__PURE__ */ jsx11("div", { className: "uf-flex uf-items-center uf-gap-2", children: /* @__PURE__ */ jsx11("span", { className: "uf-text-xs uf-font-light uf-text-muted-foreground", children: t.loading }) }) : currentChainFromBackend ? renderChainItem(currentChainFromBackend) : currentChainData ? renderChainItem(currentChainData) : /* @__PURE__ */ jsx11("div", { className: "uf-flex uf-items-center uf-gap-2", children: /* @__PURE__ */ jsx11("span", { className: "uf-text-xs uf-font-normal", children: chain }) }) }) }),
-              /* @__PURE__ */ jsx11(SelectContent, { align: "end", className: "uf-bg-secondary uf-border uf-text-foreground uf-max-h-[300px] uf-min-w-[200px]", children: availableChainsForToken.length === 0 ? /* @__PURE__ */ jsx11("div", { className: "uf-px-2 uf-py-3 uf-text-xs uf-text-muted-foreground uf-text-center", children: t.noChainsAvailable }) : availableChainsForToken.map((chainData) => {
-                const chainKey = getChainKey(
-                  chainData.chain_id,
-                  chainData.chain_type
-                );
-                return /* @__PURE__ */ jsx11(
-                  SelectItem,
-                  {
-                    value: chainKey,
-                    className: "focus:uf-bg-accent focus:uf-text-foreground",
-                    children: renderChainItem(chainData, true)
-                  },
-                  `${chainData.chain_id}-${chainData.chain_type}`
-                );
-              }) })
+              /* @__PURE__ */ jsx11(
+                SelectContent,
+                {
+                  align: "end",
+                  className: "uf-bg-secondary uf-border uf-text-foreground uf-max-h-[300px] uf-min-w-[200px]",
+                  children: availableChainsForToken.length === 0 ? /* @__PURE__ */ jsx11("div", { className: "uf-px-2 uf-py-3 uf-text-xs uf-text-muted-foreground uf-text-center", children: t.noChainsAvailable }) : availableChainsForToken.map((chainData) => {
+                    const chainKey = getChainKey(
+                      chainData.chain_id,
+                      chainData.chain_type
+                    );
+                    return /* @__PURE__ */ jsx11(
+                      SelectItem,
+                      {
+                        value: chainKey,
+                        className: "focus:uf-bg-accent focus:uf-text-foreground",
+                        children: renderChainItem(chainData, true)
+                      },
+                      `${chainData.chain_id}-${chainData.chain_type}`
+                    );
+                  })
+                }
+              )
             ]
           }
         )
@@ -1540,22 +1595,31 @@ function TransferCryptoBase({
             )
           ] })
         ] }),
-        /* @__PURE__ */ jsxs8("span", { className: `uf-flex uf-items-center uf-gap-1 uf-text-green-500 uf-transition-opacity uf-duration-200 ${copied ? "uf-opacity-100" : "uf-opacity-0"}`, children: [
-          /* @__PURE__ */ jsx11(Check2, { className: "uf-w-3 uf-h-3" }),
-          t.copied
-        ] })
+        /* @__PURE__ */ jsxs8(
+          "span",
+          {
+            className: `uf-flex uf-items-center uf-gap-1 uf-text-green-500 uf-transition-opacity uf-duration-200 ${copied ? "uf-opacity-100" : "uf-opacity-0"}`,
+            children: [
+              /* @__PURE__ */ jsx11(Check2, { className: "uf-w-3 uf-h-3" }),
+              t.copied
+            ]
+          }
+        )
       ] }),
-      loading ? /* @__PURE__ */ jsx11("div", { className: "uf-bg-secondary uf-rounded-lg uf-px-3 uf-py-2.5 uf-text-xs uf-text-muted-foreground uf-animate-pulse", children: t.loading }) : error ? /* @__PURE__ */ jsx11("div", { className: "uf-bg-secondary uf-rounded-lg uf-px-3 uf-py-2.5 uf-text-xs uf-text-red-400", children: error }) : /* @__PURE__ */ jsx11(
-        "button",
-        {
-          onClick: handleCopyAddress,
-          disabled: !depositAddress,
-          className: "uf-w-full uf-bg-secondary hover:uf-bg-accent uf-rounded-lg uf-px-3 uf-py-2.5 uf-text-xs uf-font-mono uf-break-all uf-text-left uf-transition-colors uf-cursor-pointer disabled:uf-opacity-50 disabled:uf-cursor-not-allowed",
-          children: depositAddress || t.noAddressAvailable
-        }
-      )
+      loading ? /* @__PURE__ */ jsx11("div", { className: "uf-bg-secondary uf-rounded-lg uf-px-3 uf-py-2.5 uf-text-xs uf-text-muted-foreground uf-animate-pulse", children: t.loading }) : error ? /* @__PURE__ */ jsx11("div", { className: "uf-bg-secondary uf-rounded-lg uf-px-3 uf-py-2.5 uf-text-xs uf-text-red-400", children: error }) : /* @__PURE__ */ jsxs8("div", { className: "uf-relative", children: [
+        /* @__PURE__ */ jsx11(
+          "button",
+          {
+            onClick: handleCopyAddress,
+            disabled: !depositAddress,
+            className: "uf-w-full uf-bg-secondary hover:uf-bg-accent uf-rounded-lg uf-px-2.5 uf-py-2.5 uf-text-xs uf-font-mono uf-break-all uf-text-left uf-transition-colors uf-cursor-pointer disabled:uf-opacity-50 disabled:uf-cursor-not-allowed",
+            children: depositAddress || t.noAddressAvailable
+          }
+        ),
+        depositAddress && /* @__PURE__ */ jsx11("span", { className: "uf-absolute uf-right-3 uf-top-1/2 uf--translate-y-1/2 uf-text-muted-foreground uf-pointer-events-none", children: /* @__PURE__ */ jsx11(Copy, { className: "uf-w-3 uf-h-3" }) })
+      ] })
     ] }),
-    /* @__PURE__ */ jsxs8("div", { className: "uf-bg-secondary uf-rounded-xl uf-px-3", children: [
+    /* @__PURE__ */ jsxs8("div", { className: "uf-bg-secondary uf-rounded-xl uf-px-2.5", children: [
       /* @__PURE__ */ jsxs8(
         "button",
         {
@@ -1849,52 +1913,58 @@ function CurrencyModal({
     onOpenChange(false);
     setSearchQuery("");
   };
-  return /* @__PURE__ */ jsx15(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs11(DialogContent, { className: `sm:uf-max-w-[400px] !uf-bg-card uf-border-secondary uf-text-foreground uf-p-0 uf-gap-0 [&>button]:uf-hidden ${themeClass}`, children: [
-    /* @__PURE__ */ jsx15(
-      DepositHeader,
-      {
-        title: "Currency",
-        showBack: true,
-        onBack: handleClose,
-        onClose: handleClose
-      }
-    ),
-    /* @__PURE__ */ jsx15("div", { children: /* @__PURE__ */ jsxs11("div", { className: "uf-relative", children: [
-      /* @__PURE__ */ jsx15(Search, { className: "uf-absolute uf-left-4 uf-top-1/2 uf--translate-y-1/2 uf-w-4 uf-h-4 uf-text-muted-foreground" }),
-      /* @__PURE__ */ jsx15(
-        "input",
-        {
-          type: "text",
-          value: searchQuery,
-          onChange: (e) => setSearchQuery(e.target.value),
-          placeholder: "Search",
-          className: "uf-w-full uf-bg-secondary uf-rounded-xl uf-pl-11 uf-pr-4 uf-py-2.5 uf-text-sm uf-text-foreground uf-placeholder-muted-foreground uf-outline-none focus:uf-ring-2 focus:uf-ring-ring/30"
-        }
-      )
-    ] }) }),
-    /* @__PURE__ */ jsx15("div", { className: "uf-max-h-[500px] uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: /* @__PURE__ */ jsxs11("div", { className: "uf-space-y-2", children: [
-      /* @__PURE__ */ jsx15(
-        CurrencyListSection,
-        {
-          title: "Popular currencies",
-          currencies: filteredPreferred,
-          selectedCurrency,
-          onSelect: handleSelect
-        }
-      ),
-      filteredPreferred.length > 0 && filteredOther.length > 0 && /* @__PURE__ */ jsx15("div", { className: "uf-h-2" }),
-      /* @__PURE__ */ jsx15(
-        CurrencyListSection,
-        {
-          title: "All currencies",
-          currencies: filteredOther,
-          selectedCurrency,
-          onSelect: handleSelect
-        }
-      ),
-      filteredPreferred.length === 0 && filteredOther.length === 0 && /* @__PURE__ */ jsx15("div", { className: "uf-text-center uf-py-8 uf-text-muted-foreground uf-text-sm", children: "No currencies found" })
-    ] }) })
-  ] }) });
+  return /* @__PURE__ */ jsx15(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs11(
+    DialogContent,
+    {
+      className: `sm:uf-max-w-[400px] !uf-bg-card uf-border-secondary uf-text-foreground uf-p-0 uf-gap-0 [&>button]:uf-hidden ${themeClass}`,
+      children: [
+        /* @__PURE__ */ jsx15(
+          DepositHeader,
+          {
+            title: "Currency",
+            showBack: true,
+            onBack: handleClose,
+            onClose: handleClose
+          }
+        ),
+        /* @__PURE__ */ jsx15("div", { children: /* @__PURE__ */ jsxs11("div", { className: "uf-relative", children: [
+          /* @__PURE__ */ jsx15(Search, { className: "uf-absolute uf-left-4 uf-top-1/2 uf--translate-y-1/2 uf-w-4 uf-h-4 uf-text-muted-foreground" }),
+          /* @__PURE__ */ jsx15(
+            "input",
+            {
+              type: "text",
+              value: searchQuery,
+              onChange: (e) => setSearchQuery(e.target.value),
+              placeholder: "Search",
+              className: "uf-w-full uf-bg-secondary uf-rounded-xl uf-pl-11 uf-pr-4 uf-py-2.5 uf-text-sm uf-text-foreground uf-placeholder-muted-foreground uf-outline-none focus:uf-ring-2 focus:uf-ring-ring/30"
+            }
+          )
+        ] }) }),
+        /* @__PURE__ */ jsx15("div", { className: "uf-max-h-[500px] uf-overflow-y-auto [scrollbar-width:none] [&::-webkit-scrollbar]:uf-hidden", children: /* @__PURE__ */ jsxs11("div", { className: "uf-space-y-2", children: [
+          /* @__PURE__ */ jsx15(
+            CurrencyListSection,
+            {
+              title: "Popular currencies",
+              currencies: filteredPreferred,
+              selectedCurrency,
+              onSelect: handleSelect
+            }
+          ),
+          filteredPreferred.length > 0 && filteredOther.length > 0 && /* @__PURE__ */ jsx15("div", { className: "uf-h-2" }),
+          /* @__PURE__ */ jsx15(
+            CurrencyListSection,
+            {
+              title: "All currencies",
+              currencies: filteredOther,
+              selectedCurrency,
+              onSelect: handleSelect
+            }
+          ),
+          filteredPreferred.length === 0 && filteredOther.length === 0 && /* @__PURE__ */ jsx15("div", { className: "uf-text-center uf-py-8 uf-text-muted-foreground uf-text-sm", children: "No currencies found" })
+        ] }) })
+      ]
+    }
+  ) });
 }
 
 // src/hooks/use-user-ip.ts
@@ -1999,7 +2069,9 @@ function BuyWithCard({
   const [autoSelectedProvider, setAutoSelectedProvider] = useState6(null);
   const [hasManualSelection, setHasManualSelection] = useState6(false);
   const [internalWallets, setInternalWallets] = useState6([]);
-  const [walletsLoading, setWalletsLoading] = useState6(!externalWallets?.length);
+  const [walletsLoading, setWalletsLoading] = useState6(
+    !externalWallets?.length
+  );
   const wallets = externalWallets?.length ? externalWallets : internalWallets;
   const [countdown, setCountdown] = useState6(60);
   const [fiatCurrencies, setFiatCurrencies] = useState6([]);
@@ -2072,7 +2144,15 @@ function BuyWithCard({
         clearTimeout(retryTimeout);
       }
     };
-  }, [userId, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, publishableKey, externalWallets]);
+  }, [
+    userId,
+    recipientAddress,
+    destinationChainType,
+    destinationChainId,
+    destinationTokenAddress,
+    publishableKey,
+    externalWallets
+  ]);
   useEffect5(() => {
     async function fetchSupportedTokens() {
       try {
@@ -2256,7 +2336,10 @@ function BuyWithCard({
                   selectedCurrencyData && /* @__PURE__ */ jsx16(
                     "img",
                     {
-                      src: getPreferredIconUrl2(selectedCurrencyData.icon_urls, "png") || selectedCurrencyData.icon_url,
+                      src: getPreferredIconUrl2(
+                        selectedCurrencyData.icon_urls,
+                        "png"
+                      ) || selectedCurrencyData.icon_url,
                       alt: selectedCurrencyData.name,
                       className: "uf-w-4 uf-h-4"
                     }
@@ -2489,7 +2572,10 @@ function BuyWithCard({
                 /* @__PURE__ */ jsx16(
                   "img",
                   {
-                    src: getIconUrlWithCdn("/icons/tokens/png/usdc.png", assetCdnUrl),
+                    src: getIconUrlWithCdn(
+                      "/icons/tokens/png/usdc.png",
+                      assetCdnUrl
+                    ),
                     alt: "USDC",
                     className: "uf-w-7 uf-h-7 uf-rounded-full"
                   }
@@ -2497,7 +2583,10 @@ function BuyWithCard({
                 /* @__PURE__ */ jsx16(
                   "img",
                   {
-                    src: getIconUrlWithCdn("/icons/networks/png/polygon.png", assetCdnUrl),
+                    src: getIconUrlWithCdn(
+                      "/icons/networks/png/polygon.png",
+                      assetCdnUrl
+                    ),
                     alt: "Polygon",
                     className: "uf-w-3.5 uf-h-3.5 uf-absolute -uf-bottom-0.5 -uf-right-0.5 uf-rounded-full"
                   }
@@ -2512,7 +2601,10 @@ function BuyWithCard({
                 /* @__PURE__ */ jsx16(
                   "img",
                   {
-                    src: destinationToken?.icon_url || getIconUrlWithCdn("/icons/tokens/png/usdc.png", assetCdnUrl),
+                    src: destinationToken?.icon_url || getIconUrlWithCdn(
+                      "/icons/tokens/png/usdc.png",
+                      assetCdnUrl
+                    ),
                     alt: displayTokenSymbol,
                     className: "uf-w-7 uf-h-7 uf-rounded-full"
                   }
@@ -2672,7 +2764,10 @@ function DepositTrackerButton({
 }
 
 // src/components/deposits/DepositModal.tsx
-import { getProjectConfig as getProjectConfig2, createDepositAddress as createDepositAddress3 } from "@unifold/core";
+import {
+  getProjectConfig as getProjectConfig2,
+  createDepositAddress as createDepositAddress3
+} from "@unifold/core";
 
 // src/hooks/use-allowed-country.ts
 import { useQuery as useQuery2 } from "@tanstack/react-query";
@@ -2717,7 +2812,9 @@ function useAllowedCountry(publishableKey) {
   if (ipData && configData) {
     const blockedCodes = configData.blocked_country_codes || [];
     const userCountryUpper = ipData.alpha2.toUpperCase();
-    isAllowed = !blockedCodes.some((code) => code.toUpperCase() === userCountryUpper);
+    isAllowed = !blockedCodes.some(
+      (code) => code.toUpperCase() === userCountryUpper
+    );
   }
   return {
     isAllowed,
@@ -2731,7 +2828,9 @@ function useAllowedCountry(publishableKey) {
 
 // src/components/deposits/DepositModal.tsx
 import { Fragment as Fragment4, jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
-function SkeletonButton({ variant = "default" }) {
+function SkeletonButton({
+  variant = "default"
+}) {
   return /* @__PURE__ */ jsxs16("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__ */ jsxs16("div", { className: "uf-flex uf-items-center uf-gap-3", children: [
       /* @__PURE__ */ jsx20("div", { className: "uf-bg-muted uf-rounded-lg uf-w-9 uf-h-9" }),
@@ -2741,7 +2840,13 @@ function SkeletonButton({ variant = "default" }) {
       ] })
     ] }),
     /* @__PURE__ */ jsxs16("div", { className: "uf-flex uf-items-center uf-gap-2", children: [
-      variant === "with-icons" && /* @__PURE__ */ jsx20("div", { className: "uf-flex uf--space-x-1", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsx20("div", { className: "uf-w-5 uf-h-5 uf-rounded-full uf-bg-muted uf-border-2 uf-border-secondary" }, i)) }),
+      variant === "with-icons" && /* @__PURE__ */ jsx20("div", { className: "uf-flex uf--space-x-1", children: [1, 2, 3].map((i) => /* @__PURE__ */ jsx20(
+        "div",
+        {
+          className: "uf-w-5 uf-h-5 uf-rounded-full uf-bg-muted uf-border-2 uf-border-secondary"
+        },
+        i
+      )) }),
       /* @__PURE__ */ jsx20(ChevronRight7, { className: "uf-w-4 uf-h-4 uf-text-muted" })
     ] })
   ] });
@@ -2778,8 +2883,17 @@ function DepositModal({
   }, [publishableKey]);
   useEffect6(() => {
     setWallets([]);
-  }, [userId, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, publishableKey]);
-  const [resolvedTheme, setResolvedTheme] = useState7(theme === "auto" ? "dark" : theme);
+  }, [
+    userId,
+    recipientAddress,
+    destinationChainType,
+    destinationChainId,
+    destinationTokenAddress,
+    publishableKey
+  ]);
+  const [resolvedTheme, setResolvedTheme] = useState7(
+    theme === "auto" ? "dark" : theme
+  );
   useEffect6(() => {
     if (theme === "auto") {
       const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
@@ -2798,7 +2912,11 @@ function DepositModal({
       getProjectConfig2(publishableKey).then(setProjectConfig).catch(console.error);
     }
   }, [open, publishableKey, projectConfig]);
-  const { isAllowed, isLoading: isCountryLoading, error: countryError } = useAllowedCountry(publishableKey);
+  const {
+    isAllowed,
+    isLoading: isCountryLoading,
+    error: countryError
+  } = useAllowedCountry(publishableKey);
   useEffect6(() => {
     if (!open || wallets.length > 0) return;
     let retryTimeout = null;
@@ -2836,7 +2954,16 @@ function DepositModal({
         clearTimeout(retryTimeout);
       }
     };
-  }, [open, userId, recipientAddress, destinationChainType, destinationChainId, destinationTokenAddress, publishableKey, wallets.length]);
+  }, [
+    open,
+    userId,
+    recipientAddress,
+    destinationChainType,
+    destinationChainId,
+    destinationTokenAddress,
+    publishableKey,
+    wallets.length
+  ]);
   const themeClass = resolvedTheme === "dark" ? "uf-dark" : "";
   const handleClose = () => {
     onOpenChange(false);