@openfort/react 1.4.0 → 1.5.1

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

@@ -5,6 +5,7 @@ import { useEthereumEmbeddedWallet } from '../../../ethereum/hooks/useEthereumEm
 import { useEthereumWalletAssets } from '../../../ethereum/hooks/useEthereumWalletAssets.js';
 import { useOpenfortCore } from '../../../openfort/useOpenfort.js';
 import { useSolanaEmbeddedWallet } from '../../../solana/hooks/useSolanaEmbeddedWallet.js';
+import { getPublishableKeyEnvironment } from '../../../utils/validation.js';
 import Button from '../../Common/Button/index.js';
 import { ModalHeading, ModalBody } from '../../Common/Modal/styles.js';
 import { routes } from '../../Openfort/types.js';
@@ -22,6 +23,9 @@ import { isSameToken, getAssetSymbol } from '../Send/utils.js';
 const BuySelectProvider = () => {
     const { buyForm, setBuyForm, setRoute, triggerResize, publishableKey } = useOpenfort();
     const { chainType } = useOpenfortCore();
+    // Card / Apple Pay settle on mainnet, so a test key can't deliver — block both
+    // providers (and Continue) with a clear reason while keeping the screen reachable.
+    const testnet = getPublishableKeyEnvironment(publishableKey) === 'test';
     // Use chain-specific hooks
     const ethereumWallet = useEthereumEmbeddedWallet();
     const solanaWallet = useSolanaEmbeddedWallet();
@@ -220,6 +224,10 @@ const BuySelectProvider = () => {
                             providerFeePercentage = fiatAmount ? ((totalFees / fiatAmount) * 100).toFixed(2) : null;
                         }
                     }
+                    if (testnet) {
+                        isDisabled = true;
+                        disabledReason = 'Not on testnet';
+                    }
                     // Use real quote data if available, otherwise show loading or fallback
                     const netDisplay = isDisabled
                         ? disabledReason
@@ -241,7 +249,7 @@ const BuySelectProvider = () => {
                     const metaText = isDisabled ? '' : `Fee ${isEstimated ? '~' : ''}${feePercentage}%`;
                     const isActive = buyForm.providerId === provider.id;
                     return (jsxs(ProviderButton, { type: "button", onClick: () => !isDisabled && handleSelectProvider(provider.id), "$active": isActive, disabled: isDisabled, children: [jsxs(ProviderInfo, { children: [jsxs(ProviderNameRow, { children: [jsx(ProviderName, { children: provider.name }), highlight && !isDisabled ? jsx(ProviderBadge, { children: highlight }) : null] }), jsx(ProviderMeta, { children: metaText })] }), jsxs(ProviderRight, { children: [jsx(ProviderQuote, { children: fiatDisplay }), jsx(ProviderFiat, { children: netDisplay })] })] }, provider.id));
-                }) }), jsxs(ContinueButtonWrapper, { children: [jsx(Button, { variant: "secondary", onClick: handleBack, children: "Back" }), jsx(Button, { variant: "primary", onClick: handleContinue, disabled: step2Disabled, children: "Continue" })] })] }));
+                }) }), jsxs(ContinueButtonWrapper, { children: [jsx(Button, { variant: "secondary", onClick: handleBack, children: "Back" }), jsx(Button, { variant: "primary", onClick: handleContinue, disabled: step2Disabled || testnet, children: "Continue" })] })] }));
 };
 
 export { BuySelectProvider as default };

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/Deposit/UnsupportedNetworkNotice.d.ts

@@ -10,3 +10,12 @@ export declare function UnsupportedNetworkNotice({ targetChain, railChains, }: {
     targetChain: string;
     railChains: FundingChain[];
 }): import("react/jsx-runtime").JSX.Element;
+/**
+ * Shown in the deposit flow when funds would settle on the target chain but the active
+ * embedded account can't operate there — a smart or delegated account deployed only on
+ * other chains. EOAs share one address across EVM chains, so they never hit this.
+ * Guides the user to set up an account usable on the target chain.
+ */
+export declare function AccountChainNotice({ targetChain }: {
+    targetChain: string;
+}): import("react/jsx-runtime").JSX.Element;

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

@@ -92,6 +92,16 @@ function UnsupportedNetworkNotice({ targetChain, railChains, }) {
                     ? "Solana isn't supported by the funding rail in test mode. Switch to a supported EVM testnet to add funds."
                     : "The funding rail can't deliver to this network. Switch to a supported one to add funds." }), bridge && jsx(SupportedChainSwitcher, { railChains: railChains })] }));
 }
+/**
+ * Shown in the deposit flow when funds would settle on the target chain but the active
+ * embedded account can't operate there — a smart or delegated account deployed only on
+ * other chains. EOAs share one address across EVM chains, so they never hit this.
+ * Guides the user to set up an account usable on the target chain.
+ */
+function AccountChainNotice({ targetChain }) {
+    const name = chainName(targetChain);
+    return (jsxs(Card, { children: [jsxs(Title, { children: ["Your account isn't available on ", name] }), jsxs(Body, { children: ["Deposits settle on ", name, ", but your active account isn't set up there. Create an EOA, or a smart or delegated account on ", name, ", then deposit again."] })] }));
+}
 /**
  * EVM-only: the rail-supported chains the wallet can switch to. Rendered only when
  * an Ethereum bridge is present (wagmi), so the wagmi hook below never runs in a
@@ -107,5 +117,5 @@ function SupportedChainSwitcher({ railChains }) {
                     }) }) })] }));
 }
 
-export { UnsupportedNetworkNotice };
+export { AccountChainNotice, UnsupportedNetworkNotice };
 //# sourceMappingURL=UnsupportedNetworkNotice.js.map

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

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

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

@@ -7,7 +7,6 @@ import { useFunding } from '../../../hooks/openfort/useFunding.js';
 import { useFundingChains } from '../../../hooks/openfort/useFundingChains.js';
 import useIsMobile from '../../../hooks/useIsMobile.js';
 import { useOpenfortCore } from '../../../openfort/useOpenfort.js';
-import { getPublishableKeyEnvironment } from '../../../utils/validation.js';
 import { ModalHeading } from '../../Common/Modal/styles.js';
 import PoweredByFooter from '../../Common/PoweredByFooter/index.js';
 import { FundingMethod, routes } from '../../Openfort/types.js';
@@ -52,7 +51,7 @@ const hideBrokenLogo = (e) => {
  */
 const Deposit = () => {
     var _a;
-    const { setRoute, setBuyForm, uiConfig, publishableKey, triggerResize } = useOpenfort();
+    const { setRoute, setBuyForm, uiConfig, triggerResize } = useOpenfort();
     const { chainType } = useOpenfortCore();
     const isMobile = useIsMobile();
     const { isAvailable } = useFunding();
@@ -70,7 +69,6 @@ const Deposit = () => {
     const options = getPaymentOptions({
         isMobile,
         fundingAvailable: isAvailable,
-        testnet: getPublishableKeyEnvironment(publishableKey) === 'test',
         methods: (_a = uiConfig.funding) === null || _a === void 0 ? void 0 : _a.methods,
     });
     // Distinct source-currency logos (USDC, USDT, ETH, …) for the "from address" row.

package/build/components/Pages/Deposit/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/Deposit/paymentOptions.d.ts

@@ -28,12 +28,6 @@ type PaymentOptionsContext = {
     isMobile: boolean;
     /** When the funding backend is unavailable, crypto/CEX rows are disabled. */
     fundingAvailable: boolean;
-    /**
-     * Test-key (`pk_test_…`) project. The fiat (card/Apple Pay) and exchange rails
-     * settle real money on mainnet only — Stripe/Coinbase can't deliver to a testnet
-     * wallet — so they're disabled here. The crypto rails (Relay testnet) stay on.
-     */
-    testnet?: boolean;
     /**
      * Integrator-selected methods, in display order. When set, only these show
      * (still subject to device/availability gating). Omit to show all.

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

@@ -52,11 +52,9 @@ function getPaymentOptions(ctx) {
         : visible;
     return ordered.map((method) => {
         const kind = method.target.kind;
-        // Fiat (card/Apple Pay) and exchange rails move real money and only settle on
-        // mainnet, so a test-key project can't use them — disable with a clear reason.
-        if (ctx.testnet && (kind === 'buy' || kind === 'cex')) {
-            return { ...method, disabled: true, disabledReason: 'Not available on testnet' };
-        }
+        // Fiat (card/Apple Pay) and exchange rails stay visible on testnet so the demo
+        // shows the full feature set; the final pay action is blocked downstream
+        // (BuyProcessing / DepositCex) with a testnet notice, since they settle on mainnet.
         const fundingRail = kind === 'crypto' || kind === 'wallet' || kind === 'cex';
         if (fundingRail && !ctx.fundingAvailable) {
             return { ...method, disabled: true, disabledReason: 'Coming soon' };

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

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

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

@@ -26,6 +26,7 @@ export declare function useDepositRoute(kind: DepositRouteKind): {
     receiverAddress: string | null;
     sameChain: boolean;
     targetUnsupported: boolean;
+    accountUnusableOnTarget: boolean;
     railChains: FundingChain[];
     status: import("../../../hooks/openfort/useFunding").SessionStatus | "idle";
     loading: boolean;

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

@@ -1,3 +1,4 @@
+import { AccountTypeEnum } from '@openfort/openfort-js';
 import { useState, useRef, useEffect } from 'react';
 import { useEthereumEmbeddedWallet } from '../../../ethereum/hooks/useEthereumEmbeddedWallet.js';
 import { useFunding } from '../../../hooks/openfort/useFunding.js';
@@ -14,6 +15,22 @@ function paymentMethodFor(chain, currency) {
     // funding API has no separate 'cex' type, so every source resolves to evm/solana.
     return { type: isSolana(chain) ? 'solana' : 'evm', source };
 }
+/**
+ * Whether the embedded account can transact on `chainId`. EOAs share one address
+ * across EVM chains, so they're always usable; smart/delegated accounts are per-chain
+ * deployments, usable only on a chain they're deployed on. Returns true when the type
+ * or deployments are unknown — the deposit flow only blocks when it's certain.
+ */
+function accountUsableOnChain(wallet, chainId) {
+    if (!wallet || wallet.accountType == null)
+        return true;
+    if (wallet.accountType === AccountTypeEnum.EOA)
+        return true;
+    const chainScoped = wallet.accounts.filter((a) => a.chainId != null);
+    if (chainScoped.length === 0)
+        return true;
+    return chainScoped.some((a) => a.chainId === chainId);
+}
 /**
  * Shared state for a deposit route: the source chain/currency selection (sourced
  * live from Relay via {@link useFundingChains}) plus the resolved deposit
@@ -21,7 +38,7 @@ function paymentMethodFor(chain, currency) {
  * address" page build on this — they differ only in the lead buttons.
  */
 function useDepositRoute(kind) {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     const ethWallet = useEthereumEmbeddedWallet();
     const solWallet = useSolanaEmbeddedWallet();
     const { session, status, error, loading, isAvailable, fund, payLink, reset } = useFunding();
@@ -38,30 +55,38 @@ function useDepositRoute(kind) {
     // Coinbase Onramp, which only delivers to a fixed set of EVM chains.
     const chains = kind === 'cex' ? allChains.filter((c) => isCexDeliverable(c.id)) : allChains;
     // Where funds land: the active embedded wallet (the Relay deposit recipient).
-    const address = wallet.status === 'connected' ? wallet.address : undefined;
+    // Use the address as soon as the wallet exposes one — even mid-(re)connect or
+    // pending recovery — since receiving a deposit needs only the address, not a live
+    // signer. Gating on 'connected' left the page blank during those states.
+    const address = (_a = wallet.address) !== null && _a !== void 0 ? _a : undefined;
     const [chainId, setChainId] = useState('');
     const [currencySymbol, setCurrencySymbol] = useState('');
     const lastKey = useRef('');
     // Derive the active selection, falling back to the first available chain/currency
     // so the picker is valid before the user touches it and as chains load in.
-    const activeChain = (_a = chains.find((c) => c.id === chainId)) !== null && _a !== void 0 ? _a : chains[0];
-    const currencies = (_b = activeChain === null || activeChain === void 0 ? void 0 : activeChain.currencies) !== null && _b !== void 0 ? _b : [];
-    const activeCurrency = (_c = currencies.find((c) => c.symbol === currencySymbol)) !== null && _c !== void 0 ? _c : currencies[0];
-    const chain = (_d = activeChain === null || activeChain === void 0 ? void 0 : activeChain.id) !== null && _d !== void 0 ? _d : target.chain;
+    const activeChain = (_b = chains.find((c) => c.id === chainId)) !== null && _b !== void 0 ? _b : chains[0];
+    const currencies = (_c = activeChain === null || activeChain === void 0 ? void 0 : activeChain.currencies) !== null && _c !== void 0 ? _c : [];
+    const activeCurrency = (_d = currencies.find((c) => c.symbol === currencySymbol)) !== null && _d !== void 0 ? _d : currencies[0];
+    const chain = (_e = activeChain === null || activeChain === void 0 ? void 0 : activeChain.id) !== null && _e !== void 0 ? _e : target.chain;
     const sameChain = chain === target.chain;
     // The rail only delivers to chains in its list; if the active funding TARGET (the
     // embedded wallet's chain — e.g. Polygon Amoy or a Solana testnet) isn't one of
     // them, there's no route. Don't call Relay (it would 400 with a cryptic "invalid
     // currency"); the page prompts a switch to a supported chain instead.
     const targetUnsupported = !chainsLoading && railChains.length > 0 && !railChains.some((c) => c.id === target.chain);
+    // Funds settle on the TARGET chain. A smart/delegated account not deployed there
+    // can't use them, so block and guide the user to set up a usable account. EVM only —
+    // the recipient family already matches the target, and EOAs are always usable.
+    const targetChainId = isSolana(target.chain) ? null : Number(target.chain.split(':')[1]);
+    const accountUnusableOnTarget = targetChainId != null && !accountUsableOnChain(ethWallet.activeWallet, targetChainId);
     const receiverAddress = sameChain
         ? (address !== null && address !== void 0 ? address : null)
-        : ((_f = (_e = session === null || session === void 0 ? void 0 : session.paymentMethod) === null || _e === void 0 ? void 0 : _e.receiverAddress) !== null && _f !== void 0 ? _f : null);
-    const pm = (_g = session === null || session === void 0 ? void 0 : session.paymentMethod) !== null && _g !== void 0 ? _g : null;
+        : ((_g = (_f = session === null || session === void 0 ? void 0 : session.paymentMethod) === null || _f === void 0 ? void 0 : _f.receiverAddress) !== null && _g !== void 0 ? _g : null);
+    const pm = (_h = session === null || session === void 0 ? void 0 : session.paymentMethod) !== null && _h !== void 0 ? _h : null;
     useEffect(() => {
         if (!address || !isAvailable || !activeChain || !activeCurrency)
             return;
-        if (targetUnsupported) {
+        if (targetUnsupported || accountUnusableOnTarget) {
             lastKey.current = '';
             reset();
             return;
@@ -89,6 +114,7 @@ function useDepositRoute(kind) {
         isAvailable,
         sameChain,
         targetUnsupported,
+        accountUnusableOnTarget,
         fund,
         reset,
         target.chain,
@@ -106,7 +132,7 @@ function useDepositRoute(kind) {
         chainsLoading,
         chain,
         setChain: setChainId,
-        currency: (_h = activeCurrency === null || activeCurrency === void 0 ? void 0 : activeCurrency.symbol) !== null && _h !== void 0 ? _h : '',
+        currency: (_j = activeCurrency === null || activeCurrency === void 0 ? void 0 : activeCurrency.symbol) !== null && _j !== void 0 ? _j : '',
         setCurrency: setCurrencySymbol,
         currencies,
         activeChain,
@@ -117,6 +143,7 @@ function useDepositRoute(kind) {
         receiverAddress,
         sameChain,
         targetUnsupported,
+        accountUnusableOnTarget,
         railChains,
         status,
         loading,

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

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

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

@@ -8,7 +8,9 @@ import { useFundingChains } from '../../../hooks/openfort/useFundingChains.js';
 import { invalidateBalance } from '../../../hooks/useBalance.js';
 import { useOpenfortCore } from '../../../openfort/useOpenfort.js';
 import { logger } from '../../../utils/logger.js';
+import { getPublishableKeyEnvironment } from '../../../utils/validation.js';
 import { ModalHeading, ModalBody } from '../../Common/Modal/styles.js';
+import Tooltip from '../../Common/Tooltip/index.js';
 import { routes } from '../../Openfort/types.js';
 import { useOpenfort } from '../../Openfort/useOpenfort.js';
 import { PageContent } from '../../PageContent/index.js';
@@ -56,7 +58,10 @@ const hideBrokenLogo = (e) => {
  */
 const DepositCex = () => {
     var _a, _b, _c, _d, _e, _f;
-    const { triggerResize } = useOpenfort();
+    const { triggerResize, publishableKey } = useOpenfort();
+    // Coinbase onramp settles real funds on mainnet, so a test key can't deliver here.
+    // Keep the button live for the demo but block the hand-off with a testnet notice.
+    const testnet = getPublishableKeyEnvironment(publishableKey) === 'test';
     const target = useFundingTarget();
     // CEX (Coinbase pay-link + session) is served by the Openfort API, not the
     // standalone funding service — resolve this rail's base URL from the API backend.
@@ -100,7 +105,9 @@ const DepositCex = () => {
     const createSessionRef = useRef(createSession);
     createSessionRef.current = createSession;
     useEffect(() => {
-        if (!isAvailable || !address || !chainSupported)
+        // No session on testnet — Coinbase can't settle to a testnet wallet and the
+        // button below is blocked anyway; skip the mint so we don't fire a doomed call.
+        if (!isAvailable || !address || !chainSupported || testnet)
             return;
         const key = `${target.chain}|${target.currency}|${address}`;
         if (sessionKey.current === key)
@@ -125,7 +132,7 @@ const DepositCex = () => {
             // without this the guard above would block the retry after this cancel.
             sessionKey.current = '';
         };
-    }, [isAvailable, address, chainSupported, target.chain, target.currency]);
+    }, [isAvailable, address, chainSupported, testnet, target.chain, target.currency]);
     const fiatAmount = useMemo(() => {
         const normalized = sanitizeForParsing(sanitizeAmountInput(amount));
         if (!normalized)
@@ -206,14 +213,25 @@ const DepositCex = () => {
     // success / refunded / expired screen (shared with the crypto rail).
     if (isDepositFlowActive(status))
         return jsx(DepositProgress, { status: status });
-    return (jsxs(PageContent, { onBack: routes.DEPOSIT, children: [jsx(ModalHeading, { children: "Transfer from Exchange" }), jsxs(Section, { children: [jsx(SectionLabel, { children: "Amount" }), jsxs(AmountCard, { children: [jsx(CurrencySymbol, { children: "$" }), jsx(AmountInput, { value: amount, onChange: handleAmountChange, onBlur: handleAmountBlur, placeholder: "0.00", inputMode: "decimal", autoComplete: "off" })] }), jsx(PresetList, { children: PRESETS.map((preset) => (jsxs(PresetButton, { type: "button", "$active": pressedPreset === preset, onClick: () => handlePreset(preset), children: ["$", preset] }, preset))) }), amountTooLow ? (jsxs("span", { style: errorHelper, children: ["Enter at least $", MIN_AMOUNT, ".00 \u2014 the Coinbase minimum."] })) : (jsxs("span", { style: helperText, children: ["Minimum $", MIN_AMOUNT, ".00"] })), chainSupported && (jsxs("span", { style: destinationRow, children: [destAssetLogo && jsx("img", { src: destAssetLogo, alt: "", style: destinationLogo, onError: hideBrokenLogo }), destChainLogo && jsx("img", { src: destChainLogo, alt: "", style: destinationLogo, onError: hideBrokenLogo })] }))] }), !isAvailable && jsx(ModalBody, { children: "Funding isn't available right now." }), isAvailable && !chainSupported && jsxs(ModalBody, { children: ["Coinbase can't deliver to ", destChainName, " yet."] }), error && jsx(ModalBody, { style: { color: '#dc2626' }, children: error.message }), jsx(StepDivider, { children: "Then open an exchange" }), jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: 8, marginTop: 12 }, children: EXCHANGES.map((ex) => ex.comingSoon ? (jsxs("button", { type: "button", disabled: true, style: {
+    return (jsxs(PageContent, { onBack: routes.DEPOSIT, children: [jsx(ModalHeading, { children: "Transfer from Exchange" }), jsxs(Section, { children: [jsx(SectionLabel, { children: "Amount" }), jsxs(AmountCard, { children: [jsx(CurrencySymbol, { children: "$" }), jsx(AmountInput, { value: amount, onChange: handleAmountChange, onBlur: handleAmountBlur, placeholder: "0.00", inputMode: "decimal", autoComplete: "off" })] }), jsx(PresetList, { children: PRESETS.map((preset) => (jsxs(PresetButton, { type: "button", "$active": pressedPreset === preset, onClick: () => handlePreset(preset), children: ["$", preset] }, preset))) }), amountTooLow ? (jsxs("span", { style: errorHelper, children: ["Enter at least $", MIN_AMOUNT, ".00 \u2014 the Coinbase minimum."] })) : (jsxs("span", { style: helperText, children: ["Minimum $", MIN_AMOUNT, ".00"] })), chainSupported && (jsxs("span", { style: destinationRow, children: [destAssetLogo && jsx("img", { src: destAssetLogo, alt: "", style: destinationLogo, onError: hideBrokenLogo }), destChainLogo && jsx("img", { src: destChainLogo, alt: "", style: destinationLogo, onError: hideBrokenLogo })] }))] }), !isAvailable && jsx(ModalBody, { children: "Funding isn't available right now." }), !testnet && isAvailable && !chainSupported && (jsxs(ModalBody, { children: ["Coinbase can't deliver to ", destChainName, " yet."] })), !testnet && error && jsx(ModalBody, { style: { color: '#dc2626' }, children: error.message }), jsx(StepDivider, { children: "Then open an exchange" }), jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: 8, marginTop: 12 }, children: EXCHANGES.map((ex) => ex.comingSoon ? (jsxs("button", { type: "button", disabled: true, style: {
                         ...walletListBtn,
                         display: 'flex',
                         alignItems: 'center',
                         gap: 8,
                         opacity: 0.55,
                         cursor: 'not-allowed',
-                    }, children: [jsx(ButtonLogo, { children: EXCHANGE_LOGO[ex.id] }), jsx("span", { children: titleCase(ex.id) }), jsx("span", { style: { marginLeft: 'auto', fontSize: 11, fontWeight: 600 }, children: "Coming soon" })] }, ex.id)) : (jsxs("button", { type: "button", disabled: !payReady, style: {
+                    }, children: [jsx(ButtonLogo, { children: EXCHANGE_LOGO[ex.id] }), jsx("span", { children: titleCase(ex.id) }), jsx("span", { style: { marginLeft: 'auto', fontSize: 11, fontWeight: 600 }, children: "Coming soon" })] }, ex.id)) : testnet ? (
+                // Blocked on testnet (Coinbase settles on mainnet). Use aria-disabled, not
+                // `disabled`, so the hover still fires the tooltip that explains why.
+                jsx(Tooltip, { message: "Coinbase settles on mainnet \u2014 not available on testnet.", children: jsxs("button", { type: "button", "aria-disabled": "true", style: {
+                            ...walletListBtn,
+                            display: 'flex',
+                            alignItems: 'center',
+                            justifyContent: 'center',
+                            gap: 8,
+                            opacity: 0.55,
+                            cursor: 'not-allowed',
+                        }, children: [jsx(ButtonLogo, { children: EXCHANGE_LOGO[ex.id] }), `Open ${titleCase(ex.id)} ↗`] }) }, ex.id)) : (jsxs("button", { type: "button", disabled: !payReady, style: {
                         ...walletListBtn,
                         display: 'flex',
                         alignItems: 'center',

package/build/components/Pages/DepositCex/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/DepositCrypto/index.js

@@ -12,7 +12,7 @@ import { SameChainDepositStatus } from '../Deposit/SameChainDepositStatus.js';
 import { SameChainDepositSuccess } from '../Deposit/SameChainDepositSuccess.js';
 import { isSolana } from '../Deposit/sources.js';
 import { TestnetNotice } from '../Deposit/TestnetNotice.js';
-import { UnsupportedNetworkNotice } from '../Deposit/UnsupportedNetworkNotice.js';
+import { UnsupportedNetworkNotice, AccountChainNotice } from '../Deposit/UnsupportedNetworkNotice.js';
 import { useDepositRoute } from '../Deposit/useDepositRoute.js';
 import { useSameChainArrival } from '../Deposit/useSameChainArrival.js';
 import { caipToChainId } from '../DepositWallet/walletDeeplinks.js';
@@ -45,7 +45,7 @@ const DepositCrypto = () => {
         return jsx(DepositProgress, { status: route.status });
     if (sameChainEnabled && arrived)
         return jsx(SameChainDepositSuccess, { address: sameChainAddress, chainId: sameChainId });
-    return (jsxs(PageContent, { onBack: routes.DEPOSIT, children: [jsx(ModalHeading, { children: "Transfer from address" }), jsx(TestnetNotice, {}), route.targetUnsupported ? (jsx(UnsupportedNetworkNotice, { targetChain: route.target.chain, railChains: route.railChains })) : (jsxs(Fragment, { children: [jsx(RouteSelectors, { chains: route.chains, chain: route.chain, currency: route.currency, chainLabel: "Supported chain", onChainChange: route.setChain, onCurrencyChange: route.setCurrency }), !route.isAvailable && jsx(ModalBody, { children: "Funding isn't available right now." }), jsx(DepositAddressBlock, { assetLogo: currencyLogoUrl((_b = route.activeCurrency) === null || _b === void 0 ? void 0 : _b.symbol, (_c = route.activeCurrency) === null || _c === void 0 ? void 0 : _c.logo), chainLogo: chainLogoUrl(caipToChainId((_d = route.activeChain) === null || _d === void 0 ? void 0 : _d.id), (_e = route.activeChain) === null || _e === void 0 ? void 0 : _e.logo), receiverAddress: route.receiverAddress, pm: route.pm, sourceCurrency: route.activeCurrency
+    return (jsxs(PageContent, { onBack: routes.DEPOSIT, children: [jsx(ModalHeading, { children: "Transfer from address" }), jsx(TestnetNotice, {}), route.targetUnsupported ? (jsx(UnsupportedNetworkNotice, { targetChain: route.target.chain, railChains: route.railChains })) : route.accountUnusableOnTarget ? (jsx(AccountChainNotice, { targetChain: route.target.chain })) : (jsxs(Fragment, { children: [jsx(RouteSelectors, { chains: route.chains, chain: route.chain, currency: route.currency, chainLabel: "Supported chain", onChainChange: route.setChain, onCurrencyChange: route.setCurrency }), !route.isAvailable && jsx(ModalBody, { children: "Funding isn't available right now." }), jsx(DepositAddressBlock, { assetLogo: currencyLogoUrl((_b = route.activeCurrency) === null || _b === void 0 ? void 0 : _b.symbol, (_c = route.activeCurrency) === null || _c === void 0 ? void 0 : _c.logo), chainLogo: chainLogoUrl(caipToChainId((_d = route.activeChain) === null || _d === void 0 ? void 0 : _d.id), (_e = route.activeChain) === null || _e === void 0 ? void 0 : _e.logo), receiverAddress: route.receiverAddress, pm: route.pm, sourceCurrency: route.activeCurrency
                             ? { symbol: route.activeCurrency.symbol, decimals: route.activeCurrency.decimals }
                             : null, sameChain: route.sameChain, loading: route.loading, status: route.status }), sameChainEnabled && jsx(SameChainDepositStatus, {}), route.error && jsx(ModalBody, { style: { color: '#dc2626', marginTop: 12 }, children: route.error.message })] }))] }));
 };

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

@@ -19,7 +19,7 @@ import { RouteSelectors } from '../Deposit/RouteSelectors.js';
 import { isSolana } from '../Deposit/sources.js';
 import { StepDivider, Skeleton, ButtonLogo } from '../Deposit/styles.js';
 import { TestnetNotice } from '../Deposit/TestnetNotice.js';
-import { UnsupportedNetworkNotice } from '../Deposit/UnsupportedNetworkNotice.js';
+import { UnsupportedNetworkNotice, AccountChainNotice } from '../Deposit/UnsupportedNetworkNotice.js';
 import { useDepositRoute } from '../Deposit/useDepositRoute.js';
 import { sanitizeAmountInput } from '../Send/utils.js';
 import { DepositWalletDesktop } from './DepositWalletDesktop.js';
@@ -130,7 +130,7 @@ const DepositWallet = () => {
     }, [route.receiverAddress, route.loading, route.status, deeplinks.length, triggerResize]);
     if (isDepositFlowActive(route.status))
         return jsx(DepositProgress, { status: route.status });
-    return (jsxs(PageContent, { onBack: routes.DEPOSIT, children: [jsx(ModalHeading, { children: "Transfer from wallet" }), jsx(TestnetNotice, {}), route.targetUnsupported && (jsx(UnsupportedNetworkNotice, { targetChain: route.target.chain, railChains: route.railChains })), !route.targetUnsupported && (jsxs(Layout, { children: [jsxs(TopFixed, { children: [jsx(RouteSelectors, { chains: route.chains, chain: route.chain, currency: route.currency, chainLabel: "Supported chain", onChainChange: route.setChain, onCurrencyChange: route.setCurrency }), !route.isAvailable && jsx(ModalBody, { children: "Funding isn't available right now." }), jsxs(Section, { children: [jsx(SectionLabel, { children: "Amount" }), jsxs(AmountCard, { children: [jsx(CurrencySymbol, { children: (_m = (_l = route.activeCurrency) === null || _l === void 0 ? void 0 : _l.symbol) !== null && _m !== void 0 ? _m : '' }), jsx(AmountInput, { value: amount, onChange: handleAmountChange, placeholder: "0.00", inputMode: "decimal", autoComplete: "off" })] }), jsx(PresetList, { children: PRESETS.map((preset) => (jsx(PresetButton, { type: "button", "$active": pressedPreset === preset, onClick: () => handlePreset(preset), children: preset }, preset))) })] }), jsx(StepDivider, { children: "Then select the wallet you want to use" })] }), jsx(ProvidersRegion, { children: isMobile || isSolanaSrc || !bridge ? (jsxs(Fragment, { children: [!depositPageUrl && (jsx(ModalBody, { style: { marginTop: 12 }, children: "Use a deposit address below to fund from your wallet." })), route.loading && !route.pm && (jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 8 }, children: [jsx(Skeleton, { "$h": "44px", "$r": "10px" }), jsx(Skeleton, { "$h": "44px", "$r": "10px" }), jsx(Skeleton, { "$h": "44px", "$r": "10px" })] })), deeplinks.length > 0 && (jsx(ScrollArea, { fill: true, children: jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: 8 }, children: deeplinks.map((d) => (jsxs("a", { href: amountValid ? d.url : undefined, "aria-disabled": !amountValid, target: "_blank", rel: "noreferrer", style: {
+    return (jsxs(PageContent, { onBack: routes.DEPOSIT, children: [jsx(ModalHeading, { children: "Transfer from wallet" }), jsx(TestnetNotice, {}), route.targetUnsupported && (jsx(UnsupportedNetworkNotice, { targetChain: route.target.chain, railChains: route.railChains })), !route.targetUnsupported && route.accountUnusableOnTarget && (jsx(AccountChainNotice, { targetChain: route.target.chain })), !route.targetUnsupported && !route.accountUnusableOnTarget && (jsxs(Layout, { children: [jsxs(TopFixed, { children: [jsx(RouteSelectors, { chains: route.chains, chain: route.chain, currency: route.currency, chainLabel: "Supported chain", onChainChange: route.setChain, onCurrencyChange: route.setCurrency }), !route.isAvailable && jsx(ModalBody, { children: "Funding isn't available right now." }), jsxs(Section, { children: [jsx(SectionLabel, { children: "Amount" }), jsxs(AmountCard, { children: [jsx(CurrencySymbol, { children: (_m = (_l = route.activeCurrency) === null || _l === void 0 ? void 0 : _l.symbol) !== null && _m !== void 0 ? _m : '' }), jsx(AmountInput, { value: amount, onChange: handleAmountChange, placeholder: "0.00", inputMode: "decimal", autoComplete: "off" })] }), jsx(PresetList, { children: PRESETS.map((preset) => (jsx(PresetButton, { type: "button", "$active": pressedPreset === preset, onClick: () => handlePreset(preset), children: preset }, preset))) })] }), jsx(StepDivider, { children: "Then select the wallet you want to use" })] }), jsx(ProvidersRegion, { children: isMobile || isSolanaSrc || !bridge ? (jsxs(Fragment, { children: [!depositPageUrl && (jsx(ModalBody, { style: { marginTop: 12 }, children: "Use a deposit address below to fund from your wallet." })), route.loading && !route.pm && (jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 8 }, children: [jsx(Skeleton, { "$h": "44px", "$r": "10px" }), jsx(Skeleton, { "$h": "44px", "$r": "10px" }), jsx(Skeleton, { "$h": "44px", "$r": "10px" })] })), deeplinks.length > 0 && (jsx(ScrollArea, { fill: true, children: jsx("div", { style: { display: 'flex', flexDirection: 'column', gap: 8 }, children: deeplinks.map((d) => (jsxs("a", { href: amountValid ? d.url : undefined, "aria-disabled": !amountValid, target: "_blank", rel: "noreferrer", style: {
                                                 ...walletListBtn,
                                                 display: 'flex',
                                                 alignItems: 'center',

package/build/hooks/openfort/useUI.d.ts

@@ -17,8 +17,14 @@
  *
  * ui.open(); // Opens modal with default route
  * ui.close(); // Closes modal
- * ui.openProfile(); // Opens user profile screen
+ * ui.openProfile(); // Opens the connected wallet overview
+ * ui.openSend(); // Opens the Send flow
+ * ui.openFunding(); // Opens the Deposit (funding) hub
  * ```
+ *
+ * The `open*` navigation helpers target connected-only screens. When called while
+ * the user is not connected they fall back to the login screen, so a caller can
+ * fire them directly and let the modal route the user through auth first.
  */
 export declare function useUI(): {
     isOpen: boolean;
@@ -29,4 +35,10 @@ export declare function useUI(): {
     openSwitchNetworks: () => void;
     openProviders: () => void;
     openWallets: () => void;
+    openSend: () => void;
+    openReceive: () => void;
+    openFunding: () => void;
+    openBuy: () => void;
+    openExportKey: () => void;
+    openSettings: () => void;
 };

package/build/hooks/openfort/useUI.js

@@ -20,6 +20,12 @@ const safeRoutes = {
         { route: routes.CONNECTORS, connectType: 'linkIfUserConnectIfNoUser' },
         routes.ETH_SWITCH_NETWORK,
         routes.PROVIDERS,
+        routes.PROFILE,
+        routes.SEND,
+        routes.RECEIVE,
+        routes.DEPOSIT,
+        routes.BUY,
+        routes.EXPORT_KEY,
     ],
 };
 /** Route can be selected by string (route name) or by object with `route` property */
@@ -51,8 +57,14 @@ function isAccountId(id) {
  *
  * ui.open(); // Opens modal with default route
  * ui.close(); // Closes modal
- * ui.openProfile(); // Opens user profile screen
+ * ui.openProfile(); // Opens the connected wallet overview
+ * ui.openSend(); // Opens the Send flow
+ * ui.openFunding(); // Opens the Deposit (funding) hub
  * ```
+ *
+ * The `open*` navigation helpers target connected-only screens. When called while
+ * the user is not connected they fall back to the login screen, so a caller can
+ * fire them directly and let the modal route the user through auth first.
  */
 function useUI() {
     var _a;
@@ -111,6 +123,12 @@ function useUI() {
         openSwitchNetworks: () => gotoAndOpen(routes.ETH_SWITCH_NETWORK),
         openProviders: () => gotoAndOpen(routes.PROVIDERS),
         openWallets: () => gotoAndOpen({ route: routes.CONNECTORS, connectType: 'linkIfUserConnectIfNoUser' }),
+        openSend: () => gotoAndOpen(routes.SEND),
+        openReceive: () => gotoAndOpen(routes.RECEIVE),
+        openFunding: () => gotoAndOpen(routes.DEPOSIT),
+        openBuy: () => gotoAndOpen(routes.BUY),
+        openExportKey: () => gotoAndOpen(routes.EXPORT_KEY),
+        openSettings: () => gotoAndOpen(routes.PROFILE),
     };
 }
 

package/build/hooks/openfort/useUI.js.map

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

package/build/version.d.ts

@@ -1 +1 @@
-export declare const OPENFORT_VERSION = "1.4.0";
+export declare const OPENFORT_VERSION = "1.5.1";

package/build/version.js

@@ -1,4 +1,4 @@
-const OPENFORT_VERSION = '1.4.0';
+const OPENFORT_VERSION = '1.5.1';
 
 export { OPENFORT_VERSION };
 //# sourceMappingURL=version.js.map

package/build/wagmi/components/ChainSelect/index.js

@@ -134,7 +134,7 @@ const ChainSelector = () => {
                     else {
                         setIsOpen(!isOpen);
                     }
-                }, children: [disabled ? (jsx(Tooltip, { message: locales.chainNetwork, xOffset: -6, delay: 0.01, children: jsx(Chain, { id: chain === null || chain === void 0 ? void 0 : chain.id }) })) : (jsx(Chain, { id: chain === null || chain === void 0 ? void 0 : chain.id })), !disabled && jsx(ChevronDown, { style: { top: 1, left: -3 } })] })) }) }));
+                }, children: [jsx(Tooltip, { message: locales.chainNetwork, xOffset: -6, delay: 0.01, children: jsx(Chain, { id: chain === null || chain === void 0 ? void 0 : chain.id }) }), !disabled && jsx(ChevronDown, { style: { top: 1, left: -3 } })] })) }) }));
 };
 
 export { ChainSelector as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openfort/react",
-  "version": "1.4.0",
+  "version": "1.5.1",
   "author": "Openfort (https://www.openfort.io)",
   "license": "BSD-2-Clause license",
   "description": "The easiest way to integrate Openfort to your project.",