@openfort/react 1.2.0 → 1.4.0

package/build/components/Pages/Buy/stripeApi.d.ts

@@ -21,7 +21,7 @@ export declare const isStripeSupported: (token: Asset) => boolean;
  */
 export declare const createStripeSession: (params: Omit<CreateStripeSessionParams, "destinationCurrency" | "destinationNetwork"> & {
     token: Asset;
-    chainId: number;
+    network: string;
     publishableKey: string;
 }) => Promise<StripeOnrampResponse>;
 export {};

package/build/components/Pages/Buy/stripeApi.js

@@ -5,17 +5,6 @@ const getBackendUrl = () => {
     const sdkConfig = SDKConfiguration.getInstance();
     return (sdkConfig === null || sdkConfig === void 0 ? void 0 : sdkConfig.backendUrl) || 'https://api.openfort.io';
 };
-// Map chain IDs to Stripe network names
-const getNetworkName = (chainId) => {
-    const networkMap = {
-        1: 'ethereum',
-        8453: 'base',
-        137: 'polygon',
-        42161: 'arbitrum',
-        10: 'optimism',
-    };
-    return networkMap[chainId] || 'base';
-};
 // Stripe supported currencies
 const STRIPE_SUPPORTED_CURRENCIES = ['btc', 'eth', 'xlm', 'matic', 'pol', 'sol', 'usdc', 'avax', 'wld'];
 // Check if a token is supported by Stripe
@@ -38,12 +27,12 @@ const getCurrencyCode = (token) => {
  * Calls backend API to create a prefilled session with wallet addresses and amounts
  */
 const createStripeSession = async (params) => {
-    const { token, chainId, publishableKey, destinationAddress, sourceAmount, sourceCurrency, redirectUrl } = params;
+    const { token, network, publishableKey, destinationAddress, sourceAmount, sourceCurrency, redirectUrl } = params;
     if (!publishableKey) {
         throw new Error('Publishable key is required for authentication');
     }
     const destinationCurrency = getCurrencyCode(token);
-    const destinationNetwork = getNetworkName(chainId);
+    const destinationNetwork = network;
     // Build request body for backend API
     const requestBody = {
         provider: 'stripe',

package/build/components/Pages/Buy/stripeApi.js.map

@@ -1 +1 @@
-{"version":3,"file":"stripeApi.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"stripeApi.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/BuyComplete/index.js

@@ -39,7 +39,13 @@ const BuyComplete = () => {
     const handleBack = () => {
         setRoute(routes.CONNECTED);
     };
-    const blockExplorerUrl = address && chainId ? getExplorerUrl(ChainTypeEnum.EVM, { chainId, address }) : '';
+    const blockExplorerUrl = !address
+        ? ''
+        : chainType === ChainTypeEnum.SVM
+            ? getExplorerUrl(ChainTypeEnum.SVM, { address, cluster: solanaWallet.cluster })
+            : chainId
+                ? getExplorerUrl(ChainTypeEnum.EVM, { chainId, address })
+                : '';
     return (jsx(PageContent, { onBack: handleBack, children: jsxs(ModalContent, { style: { paddingBottom: 18, textAlign: 'center' }, children: [jsx(ModalH1, { children: "Provider Finished" }), jsx(ModalBody, { style: { marginTop: 24 }, children: "The provider flow has been completed. You can view your wallet on the block explorer to check your transactions." }), jsxs(Section, { style: { marginTop: 24 }, children: [blockExplorerUrl && (jsx(ContinueButtonWrapper, { style: { marginTop: 0 }, children: jsx(Button, { variant: "secondary", onClick: () => window.open(blockExplorerUrl, '_blank', 'noopener,noreferrer'), children: jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '8px' }, children: [jsx("span", { children: "View Wallet Transactions" }), jsx(ExternalLinkIcon, {})] }) }) })), jsx(ContinueButtonWrapper, { style: { marginTop: blockExplorerUrl ? 4 : 0 }, children: jsx(Button, { variant: "primary", onClick: handleDone, children: "Done" }) })] })] }) }));
 };
 

package/build/components/Pages/BuyComplete/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/BuyProcessing/index.js

@@ -13,6 +13,8 @@ import { routes } from '../../Openfort/types.js';
 import { useOpenfort } from '../../Openfort/useOpenfort.js';
 import { PageContent } from '../../PageContent/index.js';
 import { createCoinbaseSession } from '../Buy/coinbaseApi.js';
+import { resolveOnrampNetwork } from '../Buy/onrampApi.js';
+import { SOLANA_BUY_CURRENCIES } from '../Buy/solanaCurrencies.js';
 import { createStripeSession } from '../Buy/stripeApi.js';
 import { ContinueButtonWrapper, PendingContainer, StackedButtonWrapper } from '../Buy/styles.js';
 import { isSameToken } from '../Send/utils.js';
@@ -27,11 +29,13 @@ const BuyProcessing = () => {
     const isConnected = wallet.status === 'connected';
     const address = isConnected ? wallet.address : undefined;
     const chainId = isConnected && chainType === ChainTypeEnum.EVM ? wallet.chainId : undefined;
+    const network = resolveOnrampNetwork(chainType, chainId);
     const [popupWindow, setPopupWindow] = useState(null);
     const [showContinueButton, setShowContinueButton] = useState(false);
     const [isCreatingSession, setIsCreatingSession] = useState(true);
     const [sessionError, setSessionError] = useState(false);
-    const { data: assets } = useEthereumWalletAssets();
+    const { data: ethAssets } = useEthereumWalletAssets();
+    const assets = chainType === ChainTypeEnum.SVM ? SOLANA_BUY_CURRENCIES : ethAssets;
     const matchedToken = useMemo(() => assets === null || assets === void 0 ? void 0 : assets.find((asset) => isSameToken(asset, buyForm.asset)), [assets, buyForm.asset]);
     const selectedTokenOption = matchedToken !== null && matchedToken !== void 0 ? matchedToken : assets === null || assets === void 0 ? void 0 : assets[0];
     const selectedToken = selectedTokenOption !== null && selectedTokenOption !== void 0 ? selectedTokenOption : buyForm.asset;
@@ -47,7 +51,7 @@ const BuyProcessing = () => {
     // Create session and open popup once wallet is ready
     const sessionStartedRef = useRef(false);
     useEffect(() => {
-        if (!address || !chainId)
+        if (!address || !network)
             return;
         if (sessionStartedRef.current)
             return;
@@ -65,7 +69,7 @@ const BuyProcessing = () => {
                 if (buyForm.providerId === 'coinbase') {
                     const session = await createCoinbaseSession({
                         token: selectedToken,
-                        chainId,
+                        network,
                         publishableKey,
                         destinationAddress: address,
                         sourceAmount: fiatAmount.toFixed(2),
@@ -77,7 +81,7 @@ const BuyProcessing = () => {
                 else if (buyForm.providerId === 'stripe') {
                     const session = await createStripeSession({
                         token: selectedToken,
-                        chainId,
+                        network,
                         publishableKey,
                         destinationAddress: address,
                         sourceAmount: fiatAmount.toFixed(2),
@@ -129,7 +133,7 @@ const BuyProcessing = () => {
             }
         };
         createSessionAndOpenPopup();
-    }, [address, chainId]); // Run when wallet becomes ready
+    }, [address, network]); // Run when wallet becomes ready
     // Trigger resize on mount and when state changes
     useEffect(() => {
         triggerResize();

package/build/components/Pages/BuyProcessing/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/BuyProviderSelect/styles.d.ts

@@ -1,9 +1,10 @@
-export declare const ProviderSelectContent: import("styled-components").StyledComponent<({ children, width, onBack, logoutOnBack, header }: {
+export declare const ProviderSelectContent: import("styled-components").StyledComponent<({ children, width, onBack, logoutOnBack, header, className, }: {
     children?: React.ReactNode;
     width?: number | string;
     onBack?: import("../../PageContent").SetOnBackFunction;
     logoutOnBack?: boolean;
     header?: string;
+    className?: string;
 }) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
 export declare const ProviderList: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ProviderButton: import("styled-components").StyledComponent<"button", any, {

package/build/components/Pages/BuySelectProvider/index.js

@@ -11,8 +11,9 @@ import { routes } from '../../Openfort/types.js';
 import { useOpenfort } from '../../Openfort/useOpenfort.js';
 import { PageContent } from '../../PageContent/index.js';
 import { isCoinbaseSupported } from '../Buy/coinbaseApi.js';
-import { getAllQuotes } from '../Buy/onrampApi.js';
+import { resolveOnrampNetwork, getAllQuotes } from '../Buy/onrampApi.js';
 import { getProviders } from '../Buy/providers.js';
+import { SOLANA_BUY_CURRENCIES } from '../Buy/solanaCurrencies.js';
 import { isStripeSupported } from '../Buy/stripeApi.js';
 import { ProviderList, ProviderButton, ProviderInfo, ProviderNameRow, ProviderName, ProviderBadge, ProviderMeta, ProviderRight, ProviderQuote, ProviderFiat, ContinueButtonWrapper } from '../Buy/styles.js';
 import { createCurrencyFormatter, formatTokenAmount } from '../Buy/utils.js';
@@ -28,6 +29,9 @@ const BuySelectProvider = () => {
     const isConnected = wallet.status === 'connected';
     const address = isConnected ? wallet.address : undefined;
     const chainId = isConnected && chainType === ChainTypeEnum.EVM ? wallet.chainId : undefined;
+    // The onramp destination network: 'solana' for SVM, else the EVM network (undefined
+    // until the EVM chainId resolves, which keeps quote fetching gated as before).
+    const network = resolveOnrampNetwork(chainType, chainId);
     const [quotes, setQuotes] = useState({});
     const [isLoadingQuote, setIsLoadingQuote] = useState(false);
     const [coinbaseError, setCoinbaseError] = useState(false);
@@ -43,7 +47,8 @@ const BuySelectProvider = () => {
             return null;
         return numeric;
     }, [buyForm.amount]);
-    const { data: assets } = useEthereumWalletAssets();
+    const { data: ethAssets } = useEthereumWalletAssets();
+    const assets = chainType === ChainTypeEnum.SVM ? SOLANA_BUY_CURRENCIES : ethAssets;
     const matchedToken = useMemo(() => assets === null || assets === void 0 ? void 0 : assets.find((asset) => isSameToken(asset, buyForm.asset)), [assets, buyForm.asset]);
     const selectedTokenOption = matchedToken !== null && matchedToken !== void 0 ? matchedToken : assets === null || assets === void 0 ? void 0 : assets[0];
     const selectedToken = selectedTokenOption !== null && selectedTokenOption !== void 0 ? selectedTokenOption : buyForm.asset;
@@ -77,7 +82,7 @@ const BuySelectProvider = () => {
     // Fetch quotes from all providers
     useEffect(() => {
         const fetchQuotes = async () => {
-            if (!address || !chainId || !fiatAmount || fiatAmount <= 0) {
+            if (!address || !network || !fiatAmount || fiatAmount <= 0) {
                 setQuotes({});
                 setCoinbaseError(false);
                 setStripeError(false);
@@ -89,7 +94,7 @@ const BuySelectProvider = () => {
             try {
                 const allQuotes = await getAllQuotes({
                     token: selectedToken,
-                    chainId,
+                    network,
                     publishableKey,
                     sourceAmount: fiatAmount.toFixed(2),
                     sourceCurrency: buyForm.currency,
@@ -120,7 +125,7 @@ const BuySelectProvider = () => {
         selectedToken.metadata,
         selectedToken.type,
         buyForm.currency,
-        chainId,
+        network,
         address,
         publishableKey,
         refetchTrigger,

package/build/components/Pages/BuySelectProvider/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/Connected/EthereumConnected.js

@@ -63,10 +63,14 @@ const EthereumConnected = () => {
     });
     const ensName = identity.status === 'success' ? identity.name : undefined;
     const { data: assets, isLoading } = useEthereumWalletAssets();
+    // Total is summed from the multi-chain assets so the headline matches the
+    // "Your assets" breakdown. The single-chain path omits fiat for native ETH,
+    // which would otherwise drop it from the total.
+    const { data: multiChainAssets } = useEthereumWalletAssets({ multiChain: true });
     const totalBalanceUsd = useMemo(() => {
-        if (!assets)
+        if (!multiChainAssets)
             return 0;
-        return assets.reduce((acc, asset) => {
+        return multiChainAssets.reduce((acc, asset) => {
             var _a, _b, _c, _d;
             if (!asset.metadata || !asset.balance)
                 return acc;
@@ -76,7 +80,7 @@ const EthereumConnected = () => {
             const balance = Number(formatUnits((_d = asset.balance) !== null && _d !== void 0 ? _d : BigInt(0), getAssetDecimals(asset)));
             return acc + price * balance;
         }, 0);
-    }, [assets]);
+    }, [multiChainAssets]);
     useEffect(() => {
         context.triggerResize();
     }, [context.triggerResize]);

package/build/components/Pages/Connected/EthereumConnected.js.map

@@ -1 +1 @@
-{"version":3,"file":"EthereumConnected.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"EthereumConnected.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/Connected/SolanaConnected.js

@@ -15,12 +15,13 @@ import Avatar from '../../Common/Avatar/index.js';
 import Button from '../../Common/Button/index.js';
 import { TextLinkButton } from '../../Common/Button/styles.js';
 import { CopyText } from '../../Common/CopyToClipboard/CopyText.js';
+import SolanaChain from '../../Common/SolanaChain/index.js';
 import { useThemeContext } from '../../ConnectKitThemeProvider/ConnectKitThemeProvider.js';
 import { routes } from '../../Openfort/types.js';
 import { useOpenfort } from '../../Openfort/useOpenfort.js';
 import { PageContent } from '../../PageContent/index.js';
 import { ConnectedPageLayout } from './ConnectedPageLayout.js';
-import { LinkedProvidersToggle, Balance, ActionButton } from './styles.js';
+import { LinkedProvidersToggle, Balance, ChainSelectorContainer, ActionButton } from './styles.js';
 import { truncateSolanaAddress } from '../../../utils/format.js';
 
 const SolanaConnected = () => {
@@ -90,7 +91,7 @@ const SolanaConnected = () => {
         : undefined;
     const avatar = address ? CustomAvatar ? jsx(CustomAvatar, { address: address }) : jsx(Avatar, { address: address }) : jsx("span", {});
     const balanceNode = balanceSol != null && !isBalanceLoading ? (jsx(TextLinkButton, { type: "button", onClick: () => setRoute(routes.SOL_ASSET_INVENTORY), children: jsxs(Balance, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.2 }, children: [nFormatter(Number(balanceSol)), " SOL"] }, "solana-balance") })) : null;
-    return (jsx(PageContent, { onBack: null, header: locales.profileScreen_heading, children: jsx(ConnectedPageLayout, { address: address !== null && address !== void 0 ? address : '', displayName: jsx(CopyText, { value: address !== null && address !== void 0 ? address : '', children: truncateSolanaAddress(address !== null && address !== void 0 ? address : '', separator) }), avatar: avatar, balance: balanceNode, actions: jsxs(Fragment, { children: [jsx(ActionButton, { icon: jsx(SendIcon, {}), onClick: () => {
+    return (jsx(PageContent, { onBack: null, header: locales.profileScreen_heading, children: jsx(ConnectedPageLayout, { address: address !== null && address !== void 0 ? address : '', displayName: jsx(CopyText, { value: address !== null && address !== void 0 ? address : '', children: truncateSolanaAddress(address !== null && address !== void 0 ? address : '', separator) }), avatar: avatar, beforeAvatar: jsx(ChainSelectorContainer, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.2 }, children: jsx(SolanaChain, {}) }), balance: balanceNode, actions: jsxs(Fragment, { children: [jsx(ActionButton, { icon: jsx(SendIcon, {}), onClick: () => {
                             // Nothing to send on an empty wallet — prompt to add funds first (mirrors EVM).
                             const hasBalance = lamports != null && BigInt(lamports) > BigInt(0);
                             context.setRoute(hasBalance ? routes.SOL_SEND : routes.NO_ASSETS_AVAILABLE);

package/build/components/Pages/Connected/SolanaConnected.js.map

@@ -1 +1 @@
-{"version":3,"file":"SolanaConnected.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SolanaConnected.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/Deposit/AssetChainLogo.d.ts

@@ -1,9 +1,12 @@
 /**
  * Center logo for the deposit QR: the asset logo with the chain logo as a small
  * badge bottom-left, so scanners can confirm the right token + network at a glance.
- * Kept fully within the logo slot (no overflow) so it never covers QR data modules.
+ * Falls back to a colored monogram when the token has no usable logo, so the QR
+ * centre is never blank (and never collapses to just the chain badge). Kept fully
+ * within the logo slot (no overflow) so it never covers QR data modules.
  */
-export declare function AssetChainLogo({ assetLogo, chainLogo }: {
+export declare function AssetChainLogo({ assetLogo, chainLogo, symbol, }: {
     assetLogo: string;
     chainLogo: string;
+    symbol?: string;
 }): import("react/jsx-runtime").JSX.Element;

package/build/components/Pages/Deposit/AssetChainLogo.js

@@ -1,4 +1,6 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
+import { symbolToColor } from '../../../constants/logos.js';
 
 const hide = (e) => {
     e.currentTarget.style.display = 'none';
@@ -6,10 +8,25 @@ const hide = (e) => {
 /**
  * Center logo for the deposit QR: the asset logo with the chain logo as a small
  * badge bottom-left, so scanners can confirm the right token + network at a glance.
- * Kept fully within the logo slot (no overflow) so it never covers QR data modules.
+ * Falls back to a colored monogram when the token has no usable logo, so the QR
+ * centre is never blank (and never collapses to just the chain badge). Kept fully
+ * within the logo slot (no overflow) so it never covers QR data modules.
  */
-function AssetChainLogo({ assetLogo, chainLogo }) {
-    return (jsxs("div", { style: { position: 'relative', width: '100%' }, children: [jsx("img", { src: assetLogo, alt: "", onError: hide, style: { display: 'block', width: '100%', borderRadius: '50%' } }), jsx("img", { src: chainLogo, alt: "", onError: hide, style: {
+function AssetChainLogo({ assetLogo, chainLogo, symbol, }) {
+    const [assetFailed, setAssetFailed] = useState(false);
+    const showMonogram = !assetLogo || assetFailed;
+    return (jsxs("div", { style: { position: 'relative', width: '100%' }, children: [showMonogram ? (jsx("div", { style: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'center',
+                    width: '100%',
+                    aspectRatio: '1 / 1',
+                    borderRadius: '50%',
+                    background: symbolToColor(symbol || '?'),
+                    color: '#fff',
+                    fontWeight: 600,
+                    fontSize: 28,
+                }, children: (symbol || '?').charAt(0).toUpperCase() })) : (jsx("img", { src: assetLogo, alt: "", onError: () => setAssetFailed(true), style: { display: 'block', width: '100%', borderRadius: '50%' } })), chainLogo && (jsx("img", { src: chainLogo, alt: "", onError: hide, style: {
                     position: 'absolute',
                     bottom: 0,
                     left: 0,
@@ -17,7 +34,7 @@ function AssetChainLogo({ assetLogo, chainLogo }) {
                     borderRadius: '50%',
                     border: '2px solid #fff',
                     background: '#fff',
-                } })] }));
+                } }))] }));
 }
 
 export { AssetChainLogo };

package/build/components/Pages/Deposit/AssetChainLogo.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssetChainLogo.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"AssetChainLogo.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/Deposit/DepositAddressBlock.js

@@ -21,7 +21,7 @@ function DepositAddressBlock({ assetLogo, chainLogo, receiverAddress, pm, source
                 , { 
                     // Encode the EIP-681 / Solana Pay URI (address + amount + network) so a
                     // scanner prefills the send; fall back to the bare address same-chain.
-                    value: (_a = pm === null || pm === void 0 ? void 0 : pm.addressUri) !== null && _a !== void 0 ? _a : receiverAddress, image: jsx(AssetChainLogo, { assetLogo: assetLogo !== null && assetLogo !== void 0 ? assetLogo : '', chainLogo: chainLogo !== null && chainLogo !== void 0 ? chainLogo : '' }), imageClip: false }) }), jsx("div", { style: depositAddressLabel, children: "Your deposit address" }), jsxs("div", { style: addressBox, children: [jsx("code", { style: codeStyle, children: receiverAddress }), jsx(CopyIconButton, { value: receiverAddress, size: 28 })] }), status && jsx(DepositStatus, { status: status }), !sameChain && pm && jsx(DepositDetails, { pm: pm, sourceCurrency: sourceCurrency })] }));
+                    value: (_a = pm === null || pm === void 0 ? void 0 : pm.addressUri) !== null && _a !== void 0 ? _a : receiverAddress, image: jsx(AssetChainLogo, { assetLogo: assetLogo !== null && assetLogo !== void 0 ? assetLogo : '', chainLogo: chainLogo !== null && chainLogo !== void 0 ? chainLogo : '', symbol: sourceCurrency === null || sourceCurrency === void 0 ? void 0 : sourceCurrency.symbol }), imageClip: false }) }), jsx("div", { style: depositAddressLabel, children: "Your deposit address" }), jsxs("div", { style: addressBox, children: [jsx("code", { style: codeStyle, children: receiverAddress }), jsx(CopyIconButton, { value: receiverAddress, size: 28 })] }), status && jsx(DepositStatus, { status: status }), !sameChain && pm && jsx(DepositDetails, { pm: pm, sourceCurrency: sourceCurrency })] }));
 }
 
 export { DepositAddressBlock };

package/build/components/Pages/Deposit/DepositProgress.js

@@ -4,6 +4,7 @@ import styled from '../../../styles/styled/index.js';
 import { logger } from '../../../utils/logger.js';
 import Button from '../../Common/Button/index.js';
 import { ModalHeading, ModalBody } from '../../Common/Modal/styles.js';
+import PoweredByFooter from '../../Common/PoweredByFooter/index.js';
 import { Spinner } from '../../Common/Spinner/index.js';
 import { routes } from '../../Openfort/types.js';
 import { useOpenfort } from '../../Openfort/useOpenfort.js';
@@ -96,14 +97,14 @@ function DepositProgress({ status }) {
         return jsx(DepositSuccess, {});
     if (status === 'bounced' || status === 'expired') {
         const ui = OUTCOME[status];
-        return (jsxs(PageContent, { children: [jsx(ModalHeading, { children: ui === null || ui === void 0 ? void 0 : ui.heading }), jsx(ModalBody, { children: ui === null || ui === void 0 ? void 0 : ui.body }), jsx(Button, { variant: "primary", onClick: () => setRoute(status === 'expired' ? routes.DEPOSIT : routes.CONNECTED), children: status === 'expired' ? 'Start over' : 'See balance' })] }));
+        return (jsxs(PageContent, { children: [jsx(ModalHeading, { children: ui === null || ui === void 0 ? void 0 : ui.heading }), jsx(ModalBody, { children: ui === null || ui === void 0 ? void 0 : ui.body }), jsx(Button, { variant: "primary", onClick: () => setRoute(status === 'expired' ? routes.DEPOSIT : routes.CONNECTED), children: status === 'expired' ? 'Start over' : 'See balance' }), jsx(PoweredByFooter, {})] }));
     }
     // processing → bridging active (step 1); succeeded (pre-confirmed) → delivering active (step 2).
     const activeStep = status === 'succeeded' ? 2 : 1;
     return (jsxs(PageContent, { children: [jsx(ModalHeading, { children: "Completing your deposit" }), jsx(ModalBody, { children: "Keep this open \u2014 your funds are on the way." }), jsx(StepList, { children: STEPS.map((step, i) => {
                     const state = stepStateFor(i, activeStep);
                     return (jsxs(StepRow, { "$state": state, children: [state === 'active' ? jsx(Spinner, {}) : jsx(StepMark, { "$state": state, children: state === 'done' ? '✓' : '' }), jsx("span", { children: step.label })] }, step.key));
-                }) })] }));
+                }) }), jsx(PoweredByFooter, {})] }));
 }
 
 export { DepositProgress, isDepositFlowActive };

package/build/components/Pages/Deposit/DepositProgress.js.map

@@ -1 +1 @@
-{"version":3,"file":"DepositProgress.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"DepositProgress.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/Deposit/DepositSuccess.js

@@ -2,6 +2,7 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { useEffect } from 'react';
 import Button from '../../Common/Button/index.js';
 import Loader from '../../Common/Loading/index.js';
+import PoweredByFooter from '../../Common/PoweredByFooter/index.js';
 import { routes } from '../../Openfort/types.js';
 import { useOpenfort } from '../../Openfort/useOpenfort.js';
 import { PageContent } from '../../PageContent/index.js';
@@ -17,7 +18,7 @@ function DepositSuccess() {
     useEffect(() => {
         triggerResize();
     }, [triggerResize]);
-    return (jsxs(PageContent, { children: [jsx(Loader, { isSuccess: true, header: "Deposit received", description: "Funds delivered to your wallet" }), jsx(Button, { variant: "primary", onClick: () => setRoute(routes.ASSET_INVENTORY), children: "See balance" })] }));
+    return (jsxs(PageContent, { children: [jsx(Loader, { isSuccess: true, header: "Deposit received", description: "Funds delivered to your wallet" }), jsx(Button, { variant: "primary", onClick: () => setRoute(routes.ASSET_INVENTORY), children: "See balance" }), jsx(PoweredByFooter, {})] }));
 }
 
 export { DepositSuccess };

package/build/components/Pages/Deposit/DepositSuccess.js.map

@@ -1 +1 @@
-{"version":3,"file":"DepositSuccess.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"DepositSuccess.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/Deposit/RouteSelectors.js

@@ -1,4 +1,6 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { chainLogoUrl, currencyLogoUrl } from '../../../constants/logos.js';
+import { caipToChainId } from '../DepositWallet/walletDeeplinks.js';
 import { twoCol, field } from './formStyles.js';
 import { LogoSelect } from './LogoSelect.js';
 import { Skeleton } from './styles.js';
@@ -12,7 +14,15 @@ function RouteSelectors({ chains, chain, currency, chainLabel, onChainChange, on
     }
     const activeChain = (_a = chains.find((c) => c.id === chain)) !== null && _a !== void 0 ? _a : chains[0];
     const currencies = (_b = activeChain === null || activeChain === void 0 ? void 0 : activeChain.currencies) !== null && _b !== void 0 ? _b : [];
-    return (jsxs("div", { style: twoCol, children: [jsxs("div", { style: field, children: [chainLabel, jsx(LogoSelect, { value: (_c = activeChain === null || activeChain === void 0 ? void 0 : activeChain.id) !== null && _c !== void 0 ? _c : '', onChange: onChainChange, options: chains.map((c) => ({ value: c.id, label: c.name, logo: c.logo })) })] }), jsxs("div", { style: field, children: ["Currency", jsx(LogoSelect, { value: currency, onChange: onCurrencyChange, options: currencies.map((c) => ({ value: c.symbol, label: c.symbol, logo: c.logo })) })] })] }));
+    return (jsxs("div", { style: twoCol, children: [jsxs("div", { style: field, children: [chainLabel, jsx(LogoSelect, { value: (_c = activeChain === null || activeChain === void 0 ? void 0 : activeChain.id) !== null && _c !== void 0 ? _c : '', onChange: onChainChange, options: chains.map((c) => ({
+                            value: c.id,
+                            label: c.name,
+                            logo: chainLogoUrl(caipToChainId(c.id), c.logo),
+                        })) })] }), jsxs("div", { style: field, children: ["Currency", jsx(LogoSelect, { value: currency, onChange: onCurrencyChange, options: currencies.map((c) => ({
+                            value: c.symbol,
+                            label: c.symbol,
+                            logo: currencyLogoUrl(c.symbol, c.logo),
+                        })) })] })] }));
 }
 
 export { RouteSelectors };

package/build/components/Pages/Deposit/RouteSelectors.js.map

@@ -1 +1 @@
-{"version":3,"file":"RouteSelectors.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"RouteSelectors.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/Deposit/SameChainDepositStatus.d.ts

@@ -0,0 +1,7 @@
+/**
+ * "Waiting for your deposit…" banner shown under the deposit address for a
+ * same-chain "transfer from address". Arrival detection lives in
+ * {@link import('./useSameChainArrival').useSameChainArrival}; on arrival the
+ * page swaps to {@link import('./SameChainDepositSuccess').SameChainDepositSuccess}.
+ */
+export declare function SameChainDepositStatus(): import("react/jsx-runtime").JSX.Element;

package/build/components/Pages/Deposit/SameChainDepositStatus.js

@@ -0,0 +1,34 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useEffect } from 'react';
+import styled from '../../../styles/styled/index.js';
+import { Spinner } from '../../Common/Spinner/index.js';
+import { useOpenfort } from '../../Openfort/useOpenfort.js';
+
+const Banner = styled.div `
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin-top: 14px;
+  padding: 10px 12px;
+  border-radius: 10px;
+  border: 1px solid var(--ck-body-divider, #e4e4e7);
+  background: var(--ck-body-background-secondary, #fafafa);
+  font-size: 14px;
+  color: var(--ck-body-color-muted, #6b7280);
+`;
+/**
+ * "Waiting for your deposit…" banner shown under the deposit address for a
+ * same-chain "transfer from address". Arrival detection lives in
+ * {@link import('./useSameChainArrival').useSameChainArrival}; on arrival the
+ * page swaps to {@link import('./SameChainDepositSuccess').SameChainDepositSuccess}.
+ */
+function SameChainDepositStatus() {
+    const { triggerResize } = useOpenfort();
+    useEffect(() => {
+        triggerResize();
+    }, [triggerResize]);
+    return (jsxs(Banner, { children: [jsx(Spinner, {}), jsx("span", { children: "Waiting for your deposit\u2026" })] }));
+}
+
+export { SameChainDepositStatus };
+//# sourceMappingURL=SameChainDepositStatus.js.map

package/build/components/Pages/Deposit/SameChainDepositStatus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SameChainDepositStatus.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/Deposit/SameChainDepositSuccess.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Terminal success screen for a same-chain "transfer from address" deposit.
+ * The deposit lands in the wallet itself (no rail session), so arrival is
+ * detected by a native balance increase and we don't hold the inbound tx hash —
+ * "View on Explorer" therefore opens the wallet's address page, where the
+ * incoming transfer is listed.
+ */
+export declare function SameChainDepositSuccess({ address, chainId }: {
+    address: string;
+    chainId: number;
+}): import("react/jsx-runtime").JSX.Element;

package/build/components/Pages/Deposit/SameChainDepositSuccess.js

@@ -0,0 +1,30 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { ChainTypeEnum } from '@openfort/openfort-js';
+import { useEffect } from 'react';
+import { getExplorerUrl } from '../../../shared/utils/explorer.js';
+import Button from '../../Common/Button/index.js';
+import Loader from '../../Common/Loading/index.js';
+import PoweredByFooter from '../../Common/PoweredByFooter/index.js';
+import { routes } from '../../Openfort/types.js';
+import { useOpenfort } from '../../Openfort/useOpenfort.js';
+import { PageContent } from '../../PageContent/index.js';
+
+/**
+ * Terminal success screen for a same-chain "transfer from address" deposit.
+ * The deposit lands in the wallet itself (no rail session), so arrival is
+ * detected by a native balance increase and we don't hold the inbound tx hash —
+ * "View on Explorer" therefore opens the wallet's address page, where the
+ * incoming transfer is listed.
+ */
+function SameChainDepositSuccess({ address, chainId }) {
+    const { setRoute, triggerResize } = useOpenfort();
+    // Collapse the modal from the tall deposit form down to the compact card.
+    useEffect(() => {
+        triggerResize();
+    }, [triggerResize]);
+    const explorerUrl = getExplorerUrl(ChainTypeEnum.EVM, { chainId, address });
+    return (jsxs(PageContent, { children: [jsx(Loader, { isSuccess: true, header: "Deposit received", description: "Funds are in your wallet" }), explorerUrl && (jsx(Button, { variant: "primary", onClick: () => window.open(explorerUrl, '_blank', 'noopener,noreferrer'), children: "View on Explorer" })), jsx(Button, { variant: "secondary", onClick: () => setRoute(routes.CONNECTED), children: "Back to profile" }), jsx(PoweredByFooter, {})] }));
+}
+
+export { SameChainDepositSuccess };
+//# sourceMappingURL=SameChainDepositSuccess.js.map

package/build/components/Pages/Deposit/SameChainDepositSuccess.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SameChainDepositSuccess.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/components/Pages/Deposit/TestnetNotice.d.ts

@@ -0,0 +1,10 @@
+/**
+ * A dev-facing notice shown only for test keys (`pk_test_…`) in the Deposit flow.
+ *
+ * Collapsed by default to a single summary line; expands to explain that funding
+ * routes through Relay, whose testnet rail bridges the same asset but cannot swap
+ * to a different token (testnets lack DEX liquidity, so e.g. `ETH → USDC` fails),
+ * and that card/exchange rails are mainnet-only. Links to Relay's testnet guide.
+ * Renders nothing on live keys.
+ */
+export declare function TestnetNotice(): import("react/jsx-runtime").JSX.Element | null;