thirdweb 5.111.9 → 5.111.11-nightly-eb1a9c3c3e670290e28ad86e14ddae4c7cf7455d-20251112000353

package/dist/esm/react/web/ui/Bridge/payment-selection/TokenSelection.js

@@ -23,7 +23,7 @@ function PaymentMethodTokenRow({ paymentMethod, client, onPaymentMethodSelected,
             textAlign: "left",
         }, variant: "secondary", children: _jsxs(Container, { flex: "row", gap: "md", style: { alignItems: "center", width: "100%" }, children: [_jsx(TokenAndChain, { client: client, size: "lg", style: {
                         maxWidth: "50%",
-                    }, token: paymentMethod.originToken }), _jsxs(Container, { flex: "column", gap: "3xs", style: { alignItems: "flex-end", flex: 1 }, children: [currencyPrice && (_jsx(Text, { color: "primaryText", size: "sm", style: { fontWeight: 600, textWrap: "nowrap" }, children: formatCurrencyAmount(currency || "USD", Number(formatTokenAmount(paymentMethod.balance, paymentMethod.originToken.decimals)) * currencyPrice) })), _jsx(Container, { flex: "row", gap: "3xs", children: _jsxs(Text, { color: hasEnoughBalance ? "success" : "danger", size: "xs", children: [formatTokenAmount(paymentMethod.balance, paymentMethod.originToken.decimals), " ", paymentMethod.originToken.symbol] }) })] })] }) }, `${paymentMethod.originToken.address}-${paymentMethod.originToken.chainId}`));
+                    }, token: paymentMethod.originToken }), _jsxs(Container, { flex: "column", gap: "3xs", style: { alignItems: "flex-end", flex: 1 }, children: [currencyPrice && (_jsx(Text, { color: "primaryText", size: "sm", style: { fontWeight: 500, textWrap: "nowrap" }, children: formatCurrencyAmount(currency || "USD", Number(formatTokenAmount(paymentMethod.balance, paymentMethod.originToken.decimals)) * currencyPrice) })), _jsx(Container, { flex: "row", gap: "3xs", children: _jsxs(Text, { color: hasEnoughBalance ? "success" : "danger", size: "xs", children: [formatTokenAmount(paymentMethod.balance, paymentMethod.originToken.decimals), " ", paymentMethod.originToken.symbol] }) })] })] }) }, `${paymentMethod.originToken.address}-${paymentMethod.originToken.chainId}`));
 }
 export function TokenSelection({ paymentMethods, paymentMethodsLoading, client, onPaymentMethodSelected, onBack, destinationToken, destinationAmount, feePayer, currency, }) {
     const theme = useCustomTheme();

package/dist/esm/react/web/ui/Bridge/payment-success/PaymentReceipt.js

@@ -1,19 +1,17 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CopyIcon } from "@radix-ui/react-icons";
 import { useQuery } from "@tanstack/react-query";
-import { useCallback } from "react";
 import { defineChain, getCachedChain, getChainMetadata, } from "../../../../../chains/utils.js";
 import { shortenHex } from "../../../../../utils/address.js";
-import { formatExplorerTxUrl } from "../../../../../utils/url.js";
 import { useCustomTheme } from "../../../../core/design-system/CustomThemeProvider.js";
-import { iconSize, radius, spacing, } from "../../../../core/design-system/index.js";
+import { radius, spacing } from "../../../../core/design-system/index.js";
 import { formatTokenAmount } from "../../ConnectWallet/screens/formatTokenBalance.js";
-import { Container, ModalHeader } from "../../components/basic.js";
+import { Container, Line, ModalHeader } from "../../components/basic.js";
 import { shorterChainName } from "../../components/ChainName.js";
+import { CopyIcon } from "../../components/CopyIcon.js";
 import { Skeleton } from "../../components/Skeleton.js";
 import { Spacer } from "../../components/Spacer.js";
-import { Text } from "../../components/text.js";
+import { Link, Text } from "../../components/text.js";
 function getPaymentId(preparedQuote, status) {
     if (preparedQuote.type === "onramp") {
         return preparedQuote.id;
@@ -79,16 +77,11 @@ function useTransactionInfo(status, preparedQuote) {
 /**
  * Component to display details for a completed transaction step
  */
-function CompletedStepDetailCard({ status, preparedQuote, windowAdapter, onCopyToClipboard, }) {
+function CompletedStepDetailCard({ status, preparedQuote, }) {
     const theme = useCustomTheme();
-    const { data: txInfo, isLoading } = useTransactionInfo(status, preparedQuote);
-    if (isLoading) {
-        return (_jsxs(Container, { flex: "column", gap: "sm", style: {
-                backgroundColor: theme.colors.tertiaryBg,
-                border: `1px solid ${theme.colors.borderColor}`,
-                borderRadius: radius.sm,
-                padding: spacing.md,
-            }, children: [_jsx(Skeleton, { height: "30px" }), _jsx(Skeleton, { height: "30px" }), _jsx(Skeleton, { height: "30px" })] }));
+    const { data: txInfo, isPending } = useTransactionInfo(status, preparedQuote);
+    if (isPending) {
+        return _jsx(Skeleton, { height: "200px", style: { borderRadius: radius.lg } });
     }
     if (!txInfo) {
         return null;
@@ -96,43 +89,26 @@ function CompletedStepDetailCard({ status, preparedQuote, windowAdapter, onCopyT
     return (_jsxs(Container, { flex: "column", gap: "sm", style: {
             backgroundColor: theme.colors.tertiaryBg,
             border: `1px solid ${theme.colors.borderColor}`,
-            borderRadius: radius.sm,
+            borderRadius: radius.lg,
             padding: spacing.md,
-        }, children: [_jsxs(Container, { flex: "row", gap: "sm", style: {
+        }, children: [_jsxs(Container, { flex: "row", gap: "sm", py: "4xs", style: {
                     alignItems: "center",
                     justifyContent: "space-between",
-                }, children: [_jsx(Text, { color: "primaryText", size: "sm", children: txInfo.label }), _jsx(Container, { style: {
-                            backgroundColor: theme.colors.success,
-                            borderRadius: radius.sm,
+                }, children: [_jsx(Text, { color: "primaryText", size: "sm", weight: 500, children: txInfo.label }), _jsx(Container, { style: {
+                            backgroundColor: theme.colors.modalBg,
+                            borderRadius: radius.full,
+                            border: `1px solid ${theme.colors.borderColor}`,
                             padding: `${spacing["3xs"]} ${spacing.xs}`,
-                        }, children: _jsx(Text, { size: "xs", style: { color: theme.colors.primaryButtonText }, children: "COMPLETED" }) })] }), txInfo.amountPaid && (_jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: "Amount Paid" }), _jsx(Text, { color: "primaryText", size: "sm", children: txInfo.amountPaid })] })), txInfo.originChain && (_jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: "Origin Chain" }), _jsx(Text, { color: "primaryText", size: "sm", children: shorterChainName(txInfo.originChain.name) })] })), txInfo.amountReceived && (_jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: "Amount Received" }), _jsx(Text, { color: "primaryText", size: "sm", children: txInfo.amountReceived })] })), _jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: "Chain" }), _jsx(Text, { color: "primaryText", size: "sm", children: shorterChainName(txInfo.chain.name) })] }), _jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: txInfo.type === "paymentId" ? "Payment ID" : "Transaction Hash" }), _jsxs(Container, { flex: "row", gap: "sm", style: { alignItems: "center" }, children: [_jsx(Text, { color: "accentText", onClick: txInfo.type === "paymentId"
-                                    ? () => onCopyToClipboard(txInfo.id)
-                                    : () => {
-                                        const explorer = txInfo.chain.explorers?.[0];
-                                        if (explorer) {
-                                            windowAdapter.open(formatExplorerTxUrl(explorer.url, txInfo.id));
-                                        }
-                                    }, size: "sm", style: {
-                                    cursor: "pointer",
-                                    fontFamily: "monospace",
-                                }, children: shortenHex(txInfo.id) }), txInfo.type === "paymentId" ? (_jsx("button", { onClick: () => onCopyToClipboard(txInfo.id), style: {
-                                    background: "none",
-                                    border: "none",
-                                    cursor: "pointer",
-                                    padding: 0,
-                                }, type: "button", children: _jsx(CopyIcon, { color: theme.colors.primaryText, height: iconSize.sm, width: iconSize.sm }) })) : null] })] })] }, txInfo.id));
+                        }, children: _jsx(Text, { style: {
+                                color: theme.colors.success,
+                                fontSize: 10,
+                                letterSpacing: "0.025em",
+                            }, children: "COMPLETED" }) })] }), _jsx(Line, {}), txInfo.amountPaid && (_jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: "Amount Paid" }), _jsx(Text, { color: "primaryText", size: "sm", children: txInfo.amountPaid })] })), txInfo.amountReceived && (_jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: "Amount Received" }), _jsx(Text, { color: "primaryText", size: "sm", children: txInfo.amountReceived })] })), txInfo.originChain && (_jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: "Origin Chain" }), _jsx(Text, { color: "primaryText", size: "sm", children: shorterChainName(txInfo.originChain.name) })] })), _jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: "Destination Chain" }), _jsx(Text, { color: "primaryText", size: "sm", children: shorterChainName(txInfo.chain.name) })] }), txInfo.type === "paymentId" && (_jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: "Payment ID" }), _jsxs(Container, { flex: "row", gap: "3xs", center: "y", children: [_jsx(CopyIcon, { text: txInfo.id, iconSize: 12, tip: "Copy Payment ID" }), _jsx(Text, { color: "primaryText", weight: 400, size: "sm", children: shortenHex(txInfo.id) })] })] })), status.transactions.map((tx) => {
+                const explorerLink = `https://thirdweb.com/${tx.chainId}/tx/${tx.transactionHash}`;
+                return (_jsxs(Container, { center: "y", flex: "row", style: { justifyContent: "space-between" }, children: [_jsx(Text, { color: "secondaryText", size: "sm", children: "Transaction Hash" }), _jsxs(Container, { flex: "row", gap: "3xs", center: "y", children: [_jsx(CopyIcon, { text: tx.transactionHash, iconSize: 12, tip: "Copy Transaction Hash" }), _jsx(Link, { href: explorerLink, target: "_blank", rel: "noreferrer", color: "primaryText", hoverColor: "accentText", weight: 400, size: "sm", children: shortenHex(tx.transactionHash) })] })] }, tx.transactionHash));
+            })] }, txInfo.id));
 }
 export function PaymentReceipt({ preparedQuote, completedStatuses, onBack, windowAdapter, }) {
-    // Copy to clipboard
-    const copyToClipboard = useCallback(async (text) => {
-        try {
-            await navigator.clipboard.writeText(text);
-            // Could add a toast notification here
-        }
-        catch (error) {
-            console.warn("Failed to copy to clipboard:", error);
-        }
-    }, []);
-    return (_jsxs(Container, { flex: "column", fullHeight: true, p: "md", style: { maxHeight: "500px", minHeight: "250px", overflowY: "auto" }, children: [_jsx(ModalHeader, { onBack: onBack, title: "Payment Receipt" }), _jsx(Spacer, { y: "lg" }), _jsx(Container, { flex: "column", gap: "lg", children: _jsx(Container, { flex: "column", gap: "md", children: completedStatuses.map((status, index) => (_jsx(CompletedStepDetailCard, { onCopyToClipboard: copyToClipboard, preparedQuote: preparedQuote, status: status, windowAdapter: windowAdapter }, `${status.type}-${index}`))) }) })] }));
+    return (_jsxs(Container, { flex: "column", fullHeight: true, px: "md", children: [_jsx(Spacer, { y: "md+" }), _jsx(ModalHeader, { onBack: onBack, title: "Payment Receipt" }), _jsx(Spacer, { y: "md+" }), _jsx(Container, { flex: "column", gap: "lg", scrollY: true, style: { maxHeight: "500px", minHeight: "400px" }, children: _jsx(Container, { flex: "column", gap: "sm", children: completedStatuses.map((status, index) => (_jsx(CompletedStepDetailCard, { preparedQuote: preparedQuote, status: status, windowAdapter: windowAdapter }, `${status.type}-${index}`))) }) }), _jsx(Spacer, { y: "md+" })] }));
 }
 //# sourceMappingURL=PaymentReceipt.js.map

package/dist/esm/react/web/ui/Bridge/payment-success/PaymentReceipt.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentReceipt.js","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/Bridge/payment-success/PaymentReceipt.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"PaymentReceipt.js","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/Bridge/payment-success/PaymentReceipt.tsx"],"names":[],"mappings":"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"}

package/dist/esm/react/web/ui/Bridge/payment-success/SuccessScreen.js

@@ -6,7 +6,7 @@ import { useState } from "react";
 import { trackPayEvent } from "../../../../../analytics/track/pay.js";
 import { useCustomTheme } from "../../../../core/design-system/CustomThemeProvider.js";
 import { iconSize, spacing } from "../../../../core/design-system/index.js";
-import { Container, ModalHeader } from "../../components/basic.js";
+import { Container } from "../../components/basic.js";
 import { Button } from "../../components/buttons.js";
 import { Spacer } from "../../components/Spacer.js";
 import { Text } from "../../components/text.js";
@@ -32,7 +32,7 @@ export function SuccessScreen({ preparedQuote, completedStatuses, onDone, window
     if (viewState === "detail") {
         return (_jsx(PaymentReceipt, { completedStatuses: completedStatuses, onBack: () => setViewState("success"), preparedQuote: preparedQuote, windowAdapter: windowAdapter }));
     }
-    return (_jsxs(Container, { flex: "column", fullHeight: true, px: "md", pb: "md", pt: "md+", children: [_jsx(ModalHeader, { title: "Payment Complete" }), _jsx(Spacer, { y: "xxl" }), _jsxs(Container, { center: "x", flex: "column", gap: "md", children: [_jsx(Container, { center: "both", flex: "row", style: {
+    return (_jsxs(Container, { flex: "column", fullHeight: true, px: "md", pb: "md", pt: "md+", children: [_jsx(Spacer, { y: "3xl" }), _jsxs(Container, { center: "x", flex: "column", gap: "md", children: [_jsx(Container, { center: "both", flex: "row", style: {
                             animation: "successBounce 0.6s ease-out",
                             border: `2px solid ${theme.colors.success}`,
                             borderRadius: "50%",
@@ -43,11 +43,11 @@ export function SuccessScreen({ preparedQuote, completedStatuses, onDone, window
                                 animation: "checkAppear 0.3s ease-out 0.3s both",
                             }, width: iconSize.xl }) }), _jsxs("div", { children: [_jsx(Text, { center: true, color: "primaryText", size: "xl", weight: 600, trackingTight: true, style: {
                                     marginBottom: spacing.xxs,
-                                }, children: "Payment Successful!" }), _jsx(Text, { center: true, color: "secondaryText", size: "sm", children: hasPaymentId
+                                }, children: "Payment Successful" }), _jsx(Text, { center: true, color: "secondaryText", size: "sm", children: hasPaymentId
                                     ? "You can now close this page and return to the application."
                                     : showContinueWithTx
                                         ? "Click continue to execute your transaction."
-                                        : "Your payment has been completed successfully." })] })] }), _jsx(Spacer, { y: "xxl" }), _jsxs(Container, { flex: "column", gap: "sm", style: { width: "100%" }, children: [_jsx(Button, { fullWidth: true, onClick: () => setViewState("detail"), variant: "secondary", children: "View Payment Receipt" }), !hasPaymentId && (_jsx(Button, { fullWidth: true, onClick: onDone, variant: "accent", children: showContinueWithTx ? "Continue" : "Done" }))] }), _jsx("style", { children: `
+                                        : "Your payment has been completed successfully." })] })] }), _jsx(Spacer, { y: "3xl" }), _jsxs(Container, { flex: "column", gap: "sm", style: { width: "100%" }, children: [_jsx(Button, { fullWidth: true, onClick: () => setViewState("detail"), variant: "secondary", children: "View Payment Receipt" }), !hasPaymentId && (_jsx(Button, { fullWidth: true, onClick: onDone, variant: "accent", children: showContinueWithTx ? "Continue" : "Done" }))] }), _jsx("style", { children: `
           @keyframes successBounce {
             0% {
               transform: scale(0.3);

package/dist/esm/react/web/ui/Bridge/payment-success/SuccessScreen.js.map

@@ -1 +1 @@
-{"version":3,"file":"SuccessScreen.js","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/Bridge/payment-success/SuccessScreen.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"SuccessScreen.js","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/Bridge/payment-success/SuccessScreen.tsx"],"names":[],"mappings":"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"}

package/dist/esm/react/web/ui/Bridge/swap-widget/select-chain.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from "react";
+import { useCustomTheme } from "../../../../core/design-system/CustomThemeProvider.js";
 import { fontSize, iconSize, radius, spacing, } from "../../../../core/design-system/index.js";
 import { Container, Line, ModalHeader } from "../../components/basic.js";
 import { Button } from "../../components/buttons.js";
@@ -62,14 +63,21 @@ function ChainButtonSkeleton() {
         }, children: [_jsx(Skeleton, { height: `${iconSize.lg}px`, width: `${iconSize.lg}px` }), _jsx(Skeleton, { height: fontSize.md, width: "160px" })] }));
 }
 function ChainButton(props) {
+    const theme = useCustomTheme();
+    const iconSizeValue = props.isMobile ? iconSize.lg : iconSize.md;
     return (_jsxs(Button, { variant: props.isSelected ? "secondary" : "ghost-solid", fullWidth: true, style: {
             justifyContent: "flex-start",
             fontWeight: 500,
             fontSize: props.isMobile ? fontSize.md : fontSize.sm,
             border: "1px solid transparent",
             padding: !props.isMobile ? `${spacing.xs} ${spacing.xs}` : undefined,
-        }, onClick: props.onClick, gap: "sm", children: [_jsx(Img, { src: props.chain.icon, client: props.client, width: props.isMobile ? iconSize.lg : iconSize.md, height: props.isMobile ? iconSize.lg : iconSize.md, style: {
+        }, onClick: props.onClick, gap: "sm", children: [_jsx(Img, { src: props.chain.icon || "", client: props.client, width: iconSizeValue, height: iconSizeValue, style: {
                     borderRadius: radius.full,
-                } }), cleanedChainName(props.chain.name)] }));
+                }, fallback: _jsx(Container, { color: "secondaryText", children: _jsx(Container, { style: {
+                            background: `linear-gradient(45deg, white, ${theme.colors.accentText})`,
+                            borderRadius: radius.full,
+                            width: `${iconSizeValue}px`,
+                            height: `${iconSizeValue}px`,
+                        } }) }) }), cleanedChainName(props.chain.name)] }));
 }
 //# sourceMappingURL=select-chain.js.map

package/dist/esm/react/web/ui/Bridge/swap-widget/select-chain.js.map

@@ -1 +1 @@
-{"version":3,"file":"select-chain.js","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/Bridge/swap-widget/select-chain.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"select-chain.js","sourceRoot":"","sources":["../../../../../../../src/react/web/ui/Bridge/swap-widget/select-chain.tsx"],"names":[],"mappings":"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"}

package/dist/esm/react/web/ui/Bridge/swap-widget/select-token-ui.js

@@ -1,10 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useMemo, useState } from "react";
+import { useCallback, useMemo, useState } from "react";
 import { toTokens } from "../../../../../utils/units.js";
 import { useCustomTheme } from "../../../../core/design-system/CustomThemeProvider.js";
 import { fontSize, iconSize, radius, spacing, } from "../../../../core/design-system/index.js";
-import { CoinsIcon } from "../../ConnectWallet/icons/CoinsIcon.js";
-import { WalletDotIcon } from "../../ConnectWallet/icons/WalletDotIcon.js";
 import { Container, noScrollBar } from "../../components/basic.js";
 import { Button } from "../../components/buttons.js";
 import { Img } from "../../components/Img.js";
@@ -27,14 +25,17 @@ function findChain(chains, activeChainId) {
     }
     return chains.find((chain) => chain.chainId === activeChainId);
 }
+const ALL_TOKENS_LIMIT = 100;
+const OWNED_TOKENS_LIMIT = 50;
 /**
  * @internal
  */
 export function SelectToken(props) {
     const chainQuery = useBridgeChains(props.client);
-    const [search, setSearch] = useState("");
+    const [search, _setSearch] = useState("");
     const debouncedSearch = useDebouncedValue(search, 500);
-    const [limit, setLimit] = useState(1000);
+    const [allTokensLimit, setAllTokensLimit] = useState(ALL_TOKENS_LIMIT);
+    const [ownedTokensLimit, setOwnedTokensLimit] = useState(OWNED_TOKENS_LIMIT);
     const [_selectedChain, setSelectedChain] = useState(undefined);
     const selectedChain = _selectedChain ||
         (chainQuery.data
@@ -47,14 +48,14 @@ export function SelectToken(props) {
         client: props.client,
         chainId: selectedChain?.chainId,
         search: debouncedSearch,
-        limit,
+        limit: allTokensLimit,
         offset: 0,
     });
     // owned tokens
     const ownedTokensQuery = useTokenBalances({
         clientId: props.client.clientId,
         chainId: selectedChain?.chainId,
-        limit,
+        limit: ownedTokensLimit,
         page: 1,
         walletAddress: props.activeWalletInfo?.activeAccount.address,
     });
@@ -67,19 +68,35 @@ export function SelectToken(props) {
                     .includes(debouncedSearch.toLowerCase()));
         });
     }, [ownedTokensQuery.data?.tokens, debouncedSearch]);
-    const isFetching = tokensQuery.isFetching || ownedTokensQuery.isFetching;
-    return (_jsx(SelectTokenUI, { ...props, ownedTokens: filteredOwnedTokens || [], allTokens: tokensQuery.data || [], isFetching: isFetching, selectedChain: selectedChain, setSelectedChain: setSelectedChain, search: search, setSearch: setSearch, selectedToken: props.selectedToken, setSelectedToken: props.setSelectedToken, showMore: tokensQuery.data?.length === limit
-            ? () => {
-                setLimit(limit * 2);
-            }
-            : undefined }));
+    const setSearch = useCallback((search) => {
+        _setSearch(search);
+        setAllTokensLimit(ALL_TOKENS_LIMIT);
+        setOwnedTokensLimit(OWNED_TOKENS_LIMIT);
+    }, []);
+    return (_jsx(SelectTokenUI, { ...props, ownedTokens: {
+            data: filteredOwnedTokens || [],
+            isFetching: ownedTokensQuery.isFetching,
+            showMore: ownedTokensQuery.data?.pagination.hasMore
+                ? () => {
+                    setOwnedTokensLimit(ownedTokensLimit + OWNED_TOKENS_LIMIT);
+                }
+                : undefined,
+        }, allTokens: {
+            data: tokensQuery.data || [],
+            isFetching: tokensQuery.isFetching,
+            showMore: tokensQuery.data?.length === allTokensLimit
+                ? () => {
+                    setAllTokensLimit(allTokensLimit + ALL_TOKENS_LIMIT);
+                }
+                : undefined,
+        }, selectedChain: selectedChain, setSelectedChain: setSelectedChain, search: search, setSearch: setSearch, selectedToken: props.selectedToken, setSelectedToken: props.setSelectedToken }));
 }
 function SelectTokenUI(props) {
     const isMobile = useIsMobile();
     const [screen, setScreen] = useState("select-token");
     // show tokens with icons first
     const sortedOwnedTokens = useMemo(() => {
-        return props.ownedTokens.sort((a, b) => {
+        return props.ownedTokens.data.sort((a, b) => {
             if (a.icon_uri && !b.icon_uri) {
                 return -1;
             }
@@ -88,14 +105,10 @@ function SelectTokenUI(props) {
             }
             return 0;
         });
-    }, [props.ownedTokens]);
-    const otherTokens = useMemo(() => {
-        const ownedTokenSet = new Set(sortedOwnedTokens.map((t) => `${t.token_address}-${t.chain_id}`.toLowerCase()));
-        return props.allTokens.filter((token) => !ownedTokenSet.has(`${token.address}-${token.chainId}`.toLowerCase()));
-    }, [props.allTokens, sortedOwnedTokens]);
+    }, [props.ownedTokens.data]);
     // show tokens with icons first
-    const sortedOtherTokens = useMemo(() => {
-        return otherTokens.sort((a, b) => {
+    const sortedAllTokens = useMemo(() => {
+        return props.allTokens.data.sort((a, b) => {
             if (a.iconUri && !b.iconUri) {
                 return -1;
             }
@@ -104,7 +117,7 @@ function SelectTokenUI(props) {
             }
             return 0;
         });
-    }, [otherTokens]);
+    }, [props.allTokens.data]);
     // desktop
     if (!isMobile) {
         return (_jsxs(Container, { style: {
@@ -117,13 +130,25 @@ function SelectTokenUI(props) {
                         }, selectedChain: props.selectedChain }) }), _jsx(Container, { flex: "column", relative: true, scrollY: true, children: _jsx(TokenSelectionScreen, { onSelectToken: (token) => {
                             props.setSelectedToken(token);
                             props.onClose();
-                        }, isMobile: false, selectedToken: props.selectedToken, isFetching: props.isFetching, ownedTokens: props.ownedTokens, otherTokens: sortedOtherTokens, showMore: props.showMore, selectedChain: props.selectedChain, onSelectChain: () => setScreen("select-chain"), client: props.client, search: props.search, setSearch: props.setSearch }) })] }));
+                        }, isMobile: false, selectedToken: props.selectedToken, ownedTokens: {
+                            ...props.ownedTokens,
+                            data: sortedOwnedTokens,
+                        }, allTokens: {
+                            ...props.allTokens,
+                            data: sortedAllTokens,
+                        }, selectedChain: props.selectedChain, onSelectChain: () => setScreen("select-chain"), client: props.client, search: props.search, setSearch: props.setSearch, isWalletConnected: props.activeWalletInfo !== undefined }) })] }));
     }
     if (screen === "select-token") {
-        return (_jsx(TokenSelectionScreen, { onSelectToken: (token) => {
+        return (_jsx(TokenSelectionScreen, { isWalletConnected: props.activeWalletInfo !== undefined, onSelectToken: (token) => {
                 props.setSelectedToken(token);
                 props.onClose();
-            }, selectedToken: props.selectedToken, isFetching: props.isFetching, ownedTokens: props.ownedTokens, otherTokens: sortedOtherTokens, showMore: props.showMore, selectedChain: props.selectedChain, isMobile: true, onSelectChain: () => setScreen("select-chain"), client: props.client, search: props.search, setSearch: props.setSearch }));
+            }, selectedToken: props.selectedToken, ownedTokens: {
+                ...props.ownedTokens,
+                data: sortedOwnedTokens,
+            }, allTokens: {
+                ...props.allTokens,
+                data: sortedAllTokens,
+            }, selectedChain: props.selectedChain, isMobile: true, onSelectChain: () => setScreen("select-chain"), client: props.client, search: props.search, setSearch: props.setSearch }));
     }
     if (screen === "select-chain") {
         return (_jsx(SelectBridgeChain, { isMobile: true, onBack: () => setScreen("select-token"), client: props.client, onSelectChain: (chain) => {
@@ -201,48 +226,50 @@ function TokenButton(props) {
                                 }, children: props.token.name }), usdValue && (_jsx(Container, { flex: "row", children: _jsxs(Text, { size: "xs", color: "secondaryText", weight: 400, children: ["$", usdValue.toFixed(2)] }) }))] })] })] }));
 }
 function TokenSelectionScreen(props) {
-    const noTokensFound = !props.isFetching &&
-        props.otherTokens.length === 0 &&
-        props.ownedTokens.length === 0;
-    return (_jsxs(Container, { fullHeight: true, flex: "column", children: [_jsxs(Container, { px: "md", pt: "md+", children: [_jsx(Text, { size: "lg", weight: 600, color: "primaryText", trackingTight: true, children: "Select Token" }), _jsx(Spacer, { y: "3xs" }), _jsx(Text, { size: "xs", color: "secondaryText", multiline: true, style: {
+    const noAllTokensFound = !props.allTokens.isFetching && props.allTokens.data.length === 0;
+    const noOwnedTokensFound = !props.ownedTokens.isFetching && props.ownedTokens.data.length === 0;
+    const [activeTab, setActiveTab] = useState("all");
+    const showSkeletons = (props.allTokens.isFetching && activeTab === "all") ||
+        (props.ownedTokens.isFetching && activeTab === "owned");
+    const showNoTokensFound = (activeTab === "all" && noAllTokensFound) ||
+        (activeTab === "owned" && noOwnedTokensFound);
+    const theme = useCustomTheme();
+    return (_jsxs(Container, { fullHeight: true, flex: "column", children: [_jsxs(Container, { px: "md", pt: "md+", children: [_jsx(Text, { size: "lg", weight: 600, color: "primaryText", trackingTight: true, children: "Select Token" }), _jsx(Spacer, { y: "3xs" }), _jsx(Text, { size: "sm", color: "secondaryText", multiline: true, style: {
                             textWrap: "pretty",
-                            maxWidth: "70%",
-                        }, children: "Select a token from the list or search for a token by symbol or address" })] }), !props.selectedChain && (_jsx("div", { style: {
+                        }, children: "Select a token from the list or use the search" })] }), !props.selectedChain && (_jsx("div", { style: {
                     display: "flex",
                     alignItems: "center",
                     justifyContent: "center",
-                    minHeight: "400px",
-                }, children: _jsx(Spinner, { color: "secondaryText", size: "xl" }) })), props.selectedChain && (_jsxs(_Fragment, { children: [props.isMobile ? (_jsx(Container, { p: "md", children: _jsx(SelectChainButton, { onClick: props.onSelectChain, selectedChain: props.selectedChain, client: props.client }) })) : (_jsx(Spacer, { y: "md" })), _jsx(Container, { px: "md", children: _jsx(SearchInput, { value: props.search, onChange: props.setSearch, placeholder: "Search by token or address", autoFocus: !props.isMobile }) }), _jsx(Spacer, { y: "xs" }), _jsxs(Container, { pb: "md", px: "md", expand: true, gap: "xxs", flex: "column", style: {
-                            minHeight: "400px",
+                    minHeight: "300px",
+                }, children: _jsx(Spinner, { color: "secondaryText", size: "xl" }) })), props.selectedChain && (_jsxs(_Fragment, { children: [props.isMobile ? (_jsx(Container, { p: "md", children: _jsx(SelectChainButton, { onClick: props.onSelectChain, selectedChain: props.selectedChain, client: props.client }) })) : (_jsx(Spacer, { y: "md" })), _jsx(Container, { px: "md", children: _jsx(SearchInput, { value: props.search, onChange: props.setSearch, placeholder: "Search by token or address", autoFocus: !props.isMobile }) }), _jsx(Spacer, { y: "sm" }), props.isWalletConnected && (_jsxs(Container, { flex: "row", gap: "xs", px: "md", style: { borderBottom: `1px solid ${theme.colors.borderColor}` }, children: [_jsx(TabButton, { isSelected: activeTab === "all", onSelect: () => setActiveTab("all"), label: "All Tokens" }), _jsx(TabButton, { isSelected: activeTab === "owned", onSelect: () => setActiveTab("owned"), label: "Your Tokens" })] })), _jsxs(Container, { pb: "md", px: "md", expand: true, gap: "xxs", flex: "column", style: {
+                            minHeight: "300px",
                             maxHeight: props.isMobile ? "450px" : "none",
                             overflowY: "auto",
                             scrollbarWidth: "none",
                             paddingBottom: spacing.md,
-                        }, children: [props.isFetching &&
+                        }, children: [props.isWalletConnected && _jsx(Spacer, { y: "xxs" }), showSkeletons &&
                                 new Array(20).fill(0).map((_, i) => (
                                 // biome-ignore lint/suspicious/noArrayIndexKey: ok
-                                _jsx(TokenButtonSkeleton, {}, i))), !props.isFetching && props.ownedTokens.length > 0 && (_jsxs(Container, { px: "xs", py: "xs", flex: "row", gap: "xs", center: "y", color: "secondaryText", children: [_jsx(WalletDotIcon, { size: iconSize.xs }), _jsx(Text, { size: "sm", color: "secondaryText", style: {
-                                            overflow: "unset",
-                                        }, children: "Your Tokens" })] })), !props.isFetching &&
-                                props.ownedTokens.map((token) => (_jsx(TokenButton, { token: token, client: props.client, onSelect: props.onSelectToken, isSelected: !!props.selectedToken &&
+                                _jsx(TokenButtonSkeleton, {}, i))), activeTab === "owned" &&
+                                !props.ownedTokens.isFetching &&
+                                props.ownedTokens.data.map((token) => (_jsx(TokenButton, { token: token, client: props.client, onSelect: props.onSelectToken, isSelected: !!props.selectedToken &&
                                         props.selectedToken.tokenAddress.toLowerCase() ===
                                             token.token_address.toLowerCase() &&
-                                        token.chain_id === props.selectedToken.chainId }, token.token_address))), !props.isFetching && props.ownedTokens.length > 0 && (_jsxs(Container, { px: "xs", py: "xs", flex: "row", gap: "xs", center: "y", color: "secondaryText", style: {
-                                    marginTop: spacing.sm,
-                                }, children: [_jsx(CoinsIcon, { size: iconSize.xs }), _jsx(Text, { size: "sm", color: "secondaryText", style: {
-                                            overflow: "unset",
-                                        }, children: "Other Tokens" })] })), !props.isFetching &&
-                                props.otherTokens.map((token) => (_jsx(TokenButton, { token: token, client: props.client, onSelect: props.onSelectToken, isSelected: !!props.selectedToken &&
+                                        token.chain_id === props.selectedToken.chainId }, token.token_address))), activeTab === "all" &&
+                                !props.allTokens.isFetching &&
+                                props.allTokens.data.map((token) => (_jsx(TokenButton, { token: token, client: props.client, onSelect: props.onSelectToken, isSelected: !!props.selectedToken &&
                                         props.selectedToken.tokenAddress.toLowerCase() ===
                                             token.address.toLowerCase() &&
-                                        token.chainId === props.selectedToken.chainId }, token.address))), props.showMore && (_jsx(Button, { variant: "secondary", fullWidth: true, onClick: () => {
-                                    props.showMore?.();
-                                }, children: "Load More" })), noTokensFound && (_jsx("div", { style: {
+                                        token.chainId === props.selectedToken.chainId }, token.address))), activeTab === "all" && props.allTokens.showMore && (_jsx(Button, { variant: "secondary", fullWidth: true, onClick: () => {
+                                    props.allTokens.showMore?.();
+                                }, children: "Load More" })), activeTab === "owned" && props.ownedTokens.showMore && (_jsx(Button, { variant: "secondary", fullWidth: true, onClick: () => {
+                                    props.ownedTokens.showMore?.();
+                                }, children: "Load More" })), showNoTokensFound && (_jsx("div", { style: {
                                     flex: 1,
                                     display: "flex",
                                     alignItems: "center",
                                     justifyContent: "center",
-                                }, children: _jsx(Text, { size: "md", color: "secondaryText", children: "No Tokens Found" }) }))] })] }))] }));
+                                }, children: _jsx(Text, { size: "sm", color: "secondaryText", children: "No Tokens Found" }) }))] })] }))] }));
 }
 const LeftContainer = /* @__PURE__ */ StyledDiv((_) => {
     const theme = useCustomTheme();
@@ -255,4 +282,23 @@ const LeftContainer = /* @__PURE__ */ StyledDiv((_) => {
         position: "relative",
     };
 });
+function TabButton(props) {
+    const theme = useCustomTheme();
+    return (_jsxs("div", { style: {
+            paddingBottom: "4px",
+            position: "relative",
+        }, children: [_jsx(Button, { variant: "ghost-solid", onClick: props.onSelect, style: {
+                    fontSize: fontSize.sm,
+                    padding: `10px ${spacing.xs}`,
+                    color: props.isSelected
+                        ? theme.colors.primaryText
+                        : theme.colors.secondaryText,
+                }, children: props.label }), props.isSelected && (_jsx("div", { style: {
+                    position: "absolute",
+                    left: 0,
+                    right: 0,
+                    bottom: "-1.5px",
+                    borderBottom: `2px solid ${theme.colors.primaryText}`,
+                } }))] }));
+}
 //# sourceMappingURL=select-token-ui.js.map