@dynamic-labs/sdk-react-core 4.9.0 → 4.9.1

package/CHANGELOG.md

@@ -1,4 +1,21 @@
 
+### [4.9.1](https://github.com/dynamic-labs/dynamic-auth/compare/v4.9.0...v4.9.1) (2025-03-11)
+
+
+### Features
+
+* waas svm connector ([#8191](https://github.com/dynamic-labs/dynamic-auth/issues/8191)) ([049a360](https://github.com/dynamic-labs/dynamic-auth/commit/049a360642d6aa2122676c7a29d36a7baef9e49b))
+
+
+### Bug Fixes
+
+* 7702 on sepolia ([#8242](https://github.com/dynamic-labs/dynamic-auth/issues/8242)) ([8e1c63f](https://github.com/dynamic-labs/dynamic-auth/commit/8e1c63f240024f419e12787636dd2ebaacf8da94))
+* close auth flow when promptExport enabled but createWallet is false ([#8239](https://github.com/dynamic-labs/dynamic-auth/issues/8239)) ([f82429f](https://github.com/dynamic-labs/dynamic-auth/commit/f82429f85e729a76c2516f0db112033fdd2a36d5))
+* fix solana genesis hashes bug that was causing a breaking change ([#8250](https://github.com/dynamic-labs/dynamic-auth/issues/8250)) ([731c93b](https://github.com/dynamic-labs/dynamic-auth/commit/731c93bea4b8b95caa8cc665f2ecb53f9948ef8e))
+* move setup-inside-iframe utility method to the utils package ([#8256](https://github.com/dynamic-labs/dynamic-auth/issues/8256)) ([d34eb6d](https://github.com/dynamic-labs/dynamic-auth/commit/d34eb6d211baecb496b84fefaee8179a5fb1b52a))
+* **QNTM-2952:** support headless social sign in ([#8226](https://github.com/dynamic-labs/dynamic-auth/issues/8226)) ([0c3082d](https://github.com/dynamic-labs/dynamic-auth/commit/0c3082d593c633519c9eed20be15186f18f65c09))
+* sign message with trust wallet on solana ([#8249](https://github.com/dynamic-labs/dynamic-auth/issues/8249)) ([99a7917](https://github.com/dynamic-labs/dynamic-auth/commit/99a791796f7d2c83b9f18e45367aa9689c67869d))
+
 ## [4.9.0](https://github.com/dynamic-labs/dynamic-auth/compare/v4.8.6...v4.9.0) (2025-03-07)
 
 

package/package.cjs

@@ -3,7 +3,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var version = "4.9.0";
+var version = "4.9.1";
 var dependencies = {
 	"@dynamic-labs/sdk-api-core": "0.0.638",
 	"@hcaptcha/react-hcaptcha": "1.4.4",

package/package.js

@@ -1,5 +1,5 @@
 'use client'
-var version = "4.9.0";
+var version = "4.9.1";
 var dependencies = {
 	"@dynamic-labs/sdk-api-core": "0.0.638",
 	"@hcaptcha/react-hcaptcha": "1.4.4",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynamic-labs/sdk-react-core",
-  "version": "4.9.0",
+  "version": "4.9.1",
   "dependencies": {
     "@dynamic-labs/sdk-api-core": "0.0.638",
     "@hcaptcha/react-hcaptcha": "1.4.4",
@@ -14,16 +14,16 @@
     "yup": "0.32.11",
     "react-international-phone": "4.2.5",
     "bs58": "5.0.0",
-    "@dynamic-labs/assert-package-version": "4.9.0",
-    "@dynamic-labs/iconic": "4.9.0",
-    "@dynamic-labs/logger": "4.9.0",
-    "@dynamic-labs/multi-wallet": "4.9.0",
-    "@dynamic-labs/rpc-providers": "4.9.0",
-    "@dynamic-labs/store": "4.9.0",
-    "@dynamic-labs/types": "4.9.0",
-    "@dynamic-labs/utils": "4.9.0",
-    "@dynamic-labs/wallet-book": "4.9.0",
-    "@dynamic-labs/wallet-connector-core": "4.9.0",
+    "@dynamic-labs/assert-package-version": "4.9.1",
+    "@dynamic-labs/iconic": "4.9.1",
+    "@dynamic-labs/logger": "4.9.1",
+    "@dynamic-labs/multi-wallet": "4.9.1",
+    "@dynamic-labs/rpc-providers": "4.9.1",
+    "@dynamic-labs/store": "4.9.1",
+    "@dynamic-labs/types": "4.9.1",
+    "@dynamic-labs/utils": "4.9.1",
+    "@dynamic-labs/wallet-book": "4.9.1",
+    "@dynamic-labs/wallet-connector-core": "4.9.1",
     "eventemitter3": "5.0.1"
   },
   "devDependencies": {

package/src/lib/components/UserProfile/parts/UserProfileSocialAccount/UserProfileSocialAccount.cjs

@@ -4,11 +4,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var iconic = require('@dynamic-labs/iconic');
 require('@dynamic-labs/utils');
 require('../../../Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../Alert/Alert.cjs');
-require('react');
 require('../../../../events/dynamicEvents.cjs');
 require('../../../../../../_virtual/_tslib.cjs');
 require('../../../../context/DynamicContext/DynamicContext.cjs');
@@ -115,9 +115,15 @@ const UserProfileSocialAccount = ({ provider, }) => {
     const isActiveCredential = !primaryWallet &&
         connectedAccountInfo &&
         (connectedAccountInfo === null || connectedAccountInfo === void 0 ? void 0 : connectedAccountInfo.id) === (user === null || user === void 0 ? void 0 : user.lastVerifiedCredentialId);
-    const renderButton = () => (jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonClassName: 'user-profile-social-account__button', buttonVariant: 'secondary', buttonPadding: 'none', onClick: () => isProviderLinked
-            ? unlinkSocialAccount(provider)
-            : linkSocialAccount(provider), loading: isProcessing, dataTestId: `social-account-${isProviderLinked ? 'disconnect' : 'connect'}-button`, typographyProps: {
+    const handleSocialAccountButton = React.useCallback(() => {
+        if (isProviderLinked) {
+            unlinkSocialAccount(provider);
+        }
+        else {
+            linkSocialAccount(provider, { showWidgetAfterConnection: true });
+        }
+    }, [isProviderLinked, linkSocialAccount, provider, unlinkSocialAccount]);
+    const renderButton = () => (jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonClassName: 'user-profile-social-account__button', buttonVariant: 'secondary', buttonPadding: 'none', onClick: handleSocialAccountButton, loading: isProcessing, dataTestId: `social-account-${isProviderLinked ? 'disconnect' : 'connect'}-button`, typographyProps: {
             color: 'secondary',
             variant: 'button_tertiary',
         }, startSlot: 

package/src/lib/components/UserProfile/parts/UserProfileSocialAccount/UserProfileSocialAccount.js

@@ -1,10 +1,10 @@
 'use client'
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { useCallback } from 'react';
 import { SocialIcon } from '@dynamic-labs/iconic';
 import '@dynamic-labs/utils';
 import '../../../Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../Alert/Alert.js';
-import 'react';
 import '../../../../events/dynamicEvents.js';
 import '../../../../../../_virtual/_tslib.js';
 import '../../../../context/DynamicContext/DynamicContext.js';
@@ -111,9 +111,15 @@ const UserProfileSocialAccount = ({ provider, }) => {
     const isActiveCredential = !primaryWallet &&
         connectedAccountInfo &&
         (connectedAccountInfo === null || connectedAccountInfo === void 0 ? void 0 : connectedAccountInfo.id) === (user === null || user === void 0 ? void 0 : user.lastVerifiedCredentialId);
-    const renderButton = () => (jsx(TypographyButton, { buttonClassName: 'user-profile-social-account__button', buttonVariant: 'secondary', buttonPadding: 'none', onClick: () => isProviderLinked
-            ? unlinkSocialAccount(provider)
-            : linkSocialAccount(provider), loading: isProcessing, dataTestId: `social-account-${isProviderLinked ? 'disconnect' : 'connect'}-button`, typographyProps: {
+    const handleSocialAccountButton = useCallback(() => {
+        if (isProviderLinked) {
+            unlinkSocialAccount(provider);
+        }
+        else {
+            linkSocialAccount(provider, { showWidgetAfterConnection: true });
+        }
+    }, [isProviderLinked, linkSocialAccount, provider, unlinkSocialAccount]);
+    const renderButton = () => (jsx(TypographyButton, { buttonClassName: 'user-profile-social-account__button', buttonVariant: 'secondary', buttonPadding: 'none', onClick: handleSocialAccountButton, loading: isProcessing, dataTestId: `social-account-${isProviderLinked ? 'disconnect' : 'connect'}-button`, typographyProps: {
             color: 'secondary',
             variant: 'button_tertiary',
         }, startSlot: 

package/src/lib/context/DynamicContext/types/SettingsOverrides.d.ts

@@ -28,16 +28,23 @@ export type OnrampOption = {
      */
     id: string;
     /**
-     * (optional) The iframe URL of the onramp provider to be displayed in UI
-     * If provided, the SDK will use this iframe URL to display the onramp provider in the UI
-     * and will ignore the `onClick` handler
+     * The URL of the onramp provider
+     * For iframe mode, this is displayed directly in the UI
+     * For popup mode, this is opened in a new window when the provider is selected
      * Example: "https://widget.coinbase.com/iframe/onramp?apiKey=YOUR_API_KEY&walletAddress=YOUR_WALLET_ADDRESS"
      */
-    iframeUrl?: string;
+    url?: string;
+    /**
+     * The display mode for the onramp provider
+     * 'iframe' - The provider will be displayed in an iframe within the UI
+     * 'popup' - The provider will be opened in a new window when selected
+     * @default 'iframe'
+     */
+    openMode?: 'iframe' | 'popup';
     /**
      * The onClick handler for when the onramp provider is selected
      * takes the primary wallet as an argument
-     * It will be ignored if `iframeUrl` is provided
+     * It will be ignored if in iframe mode with a URL provided
      */
     onClick: ({ wallet }: {
         wallet: Wallet;

package/src/lib/context/OnrampContext/useEnabledOnrampProviders/useEnabledOnrampProviders.cjs

@@ -10,6 +10,7 @@ var sdkApiCore = require('@dynamic-labs/sdk-api-core');
 var getWalletAdditionalAddressByType = require('../../../utils/functions/getWalletAdditionalAddressByType/getWalletAdditionalAddressByType.cjs');
 var usePromise = require('../../../utils/hooks/usePromise/usePromise.cjs');
 var onramp = require('../../../data/api/onramp/onramp.cjs');
+var coinbase = require('../../../utils/functions/onrampProviders/coinbase.cjs');
 
 const useEnabledOnrampProviders = ({ primaryWallet, network, environmentId, projectSettingsOnramps, target, }) => {
     var _a;
@@ -20,6 +21,10 @@ const useEnabledOnrampProviders = ({ primaryWallet, network, environmentId, proj
         walletConnectorCore.isBitcoinConnector(primaryWallet.connector) &&
         getWalletAdditionalAddressByType.getWalletAdditionalAddressByType(sdkApiCore.WalletAddressType.Payment, primaryWallet);
     const chainHasNetwork = network && chainName === 'evm';
+    const nonTestnetNetworks = primaryWallet
+        ? coinbase.getEnabledNonTestnetNetworks(primaryWallet)
+        : [];
+    const hasNonTestnetNetworks = nonTestnetNetworks.length > 0;
     const { data: onrampProviders } = usePromise.usePromise(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         if (!chainName || !(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.address))
             return [];
@@ -42,7 +47,19 @@ const useEnabledOnrampProviders = ({ primaryWallet, network, environmentId, proj
         enabled: Boolean(projectSettingsOnramps === null || projectSettingsOnramps === void 0 ? void 0 : projectSettingsOnramps.length),
         initialData: [],
     });
-    return React.useMemo(() => onrampProviders.filter((p) => projectSettingsOnramps === null || projectSettingsOnramps === void 0 ? void 0 : projectSettingsOnramps.includes(p.provider)), [onrampProviders, projectSettingsOnramps]);
+    return React.useMemo(() => {
+        const filteredProviders = onrampProviders
+            .filter((p) => projectSettingsOnramps === null || projectSettingsOnramps === void 0 ? void 0 : projectSettingsOnramps.includes(p.provider))
+            .filter((p) => {
+            // Only apply network filtering to Coinbase
+            if (p.provider === sdkApiCore.ProviderEnum.CoinbaseOnramp) {
+                return hasNonTestnetNetworks;
+            }
+            // Always show other providers (like Banxa)
+            return true;
+        });
+        return filteredProviders;
+    }, [onrampProviders, projectSettingsOnramps, hasNonTestnetNetworks]);
 };
 
 exports.useEnabledOnrampProviders = useEnabledOnrampProviders;

package/src/lib/context/OnrampContext/useEnabledOnrampProviders/useEnabledOnrampProviders.d.ts

@@ -1,5 +1,5 @@
-import { Wallet } from '@dynamic-labs/wallet-connector-core';
-import { OnrampConfiguration, OnrampProviders } from '@dynamic-labs/sdk-api-core';
+import { type Wallet } from '@dynamic-labs/wallet-connector-core';
+import { type OnrampConfiguration, type OnrampProviders } from '@dynamic-labs/sdk-api-core';
 export type EnabledOnrampProvidersTarget = {
     address?: string;
     token?: string;

package/src/lib/context/OnrampContext/useEnabledOnrampProviders/useEnabledOnrampProviders.js

@@ -2,10 +2,11 @@
 import { __awaiter } from '../../../../../_virtual/_tslib.js';
 import { useMemo } from 'react';
 import { getChainInfo, isBitcoinConnector } from '@dynamic-labs/wallet-connector-core';
-import { WalletAddressType } from '@dynamic-labs/sdk-api-core';
+import { WalletAddressType, ProviderEnum } from '@dynamic-labs/sdk-api-core';
 import { getWalletAdditionalAddressByType } from '../../../utils/functions/getWalletAdditionalAddressByType/getWalletAdditionalAddressByType.js';
 import { usePromise } from '../../../utils/hooks/usePromise/usePromise.js';
 import { getOnrampProviders } from '../../../data/api/onramp/onramp.js';
+import { getEnabledNonTestnetNetworks } from '../../../utils/functions/onrampProviders/coinbase.js';
 
 const useEnabledOnrampProviders = ({ primaryWallet, network, environmentId, projectSettingsOnramps, target, }) => {
     var _a;
@@ -16,6 +17,10 @@ const useEnabledOnrampProviders = ({ primaryWallet, network, environmentId, proj
         isBitcoinConnector(primaryWallet.connector) &&
         getWalletAdditionalAddressByType(WalletAddressType.Payment, primaryWallet);
     const chainHasNetwork = network && chainName === 'evm';
+    const nonTestnetNetworks = primaryWallet
+        ? getEnabledNonTestnetNetworks(primaryWallet)
+        : [];
+    const hasNonTestnetNetworks = nonTestnetNetworks.length > 0;
     const { data: onrampProviders } = usePromise(() => __awaiter(void 0, void 0, void 0, function* () {
         if (!chainName || !(primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.address))
             return [];
@@ -38,7 +43,19 @@ const useEnabledOnrampProviders = ({ primaryWallet, network, environmentId, proj
         enabled: Boolean(projectSettingsOnramps === null || projectSettingsOnramps === void 0 ? void 0 : projectSettingsOnramps.length),
         initialData: [],
     });
-    return useMemo(() => onrampProviders.filter((p) => projectSettingsOnramps === null || projectSettingsOnramps === void 0 ? void 0 : projectSettingsOnramps.includes(p.provider)), [onrampProviders, projectSettingsOnramps]);
+    return useMemo(() => {
+        const filteredProviders = onrampProviders
+            .filter((p) => projectSettingsOnramps === null || projectSettingsOnramps === void 0 ? void 0 : projectSettingsOnramps.includes(p.provider))
+            .filter((p) => {
+            // Only apply network filtering to Coinbase
+            if (p.provider === ProviderEnum.CoinbaseOnramp) {
+                return hasNonTestnetNetworks;
+            }
+            // Always show other providers (like Banxa)
+            return true;
+        });
+        return filteredProviders;
+    }, [onrampProviders, projectSettingsOnramps, hasNonTestnetNetworks]);
 };
 
 export { useEnabledOnrampProviders };

package/src/lib/context/SocialRedirectContext/hooks/useRedirectSocialHandler/useRedirectSocialHandler.cjs

@@ -121,10 +121,6 @@ const useRedirectSocialHandler = ({ setSocialProvider, }) => {
         isRenderingEmbeddedAuthFlow,
         setShowAuthFlow,
     ]);
-    const updateInterfaceStateForLink = React.useCallback(() => {
-        setDynamicWidgetView('profile');
-        setShowDynamicUserProfile(true);
-    }, [setDynamicWidgetView, setShowDynamicUserProfile]);
     useEffectOnce.useEffectOnce(() => {
         // Do not run on server side
         if (isSSR.isSSR())
@@ -161,7 +157,11 @@ const useRedirectSocialHandler = ({ setSocialProvider, }) => {
                 logger.logger.error(new utils.DynamicError('User not logged in'));
                 return;
             }
-            updateInterfaceStateForLink();
+            // Link was called from the widget, so show the profile on redirect
+            if (socialStorageItem.showWidgetAfterConnection) {
+                setDynamicWidgetView('profile');
+                setShowDynamicUserProfile(true);
+            }
         }
         yield completeConnection({
             authCode: socialStorageItem.code,

package/src/lib/context/SocialRedirectContext/hooks/useRedirectSocialHandler/useRedirectSocialHandler.js

@@ -117,10 +117,6 @@ const useRedirectSocialHandler = ({ setSocialProvider, }) => {
         isRenderingEmbeddedAuthFlow,
         setShowAuthFlow,
     ]);
-    const updateInterfaceStateForLink = useCallback(() => {
-        setDynamicWidgetView('profile');
-        setShowDynamicUserProfile(true);
-    }, [setDynamicWidgetView, setShowDynamicUserProfile]);
     useEffectOnce(() => {
         // Do not run on server side
         if (isSSR())
@@ -157,7 +153,11 @@ const useRedirectSocialHandler = ({ setSocialProvider, }) => {
                 logger.error(new DynamicError('User not logged in'));
                 return;
             }
-            updateInterfaceStateForLink();
+            // Link was called from the widget, so show the profile on redirect
+            if (socialStorageItem.showWidgetAfterConnection) {
+                setDynamicWidgetView('profile');
+                setShowDynamicUserProfile(true);
+            }
         }
         yield completeConnection({
             authCode: socialStorageItem.code,

package/src/lib/utils/functions/findWalletOptionFor/findWalletOptionFor.cjs

@@ -8,7 +8,7 @@ var compareChains = require('../compareChains/compareChains.cjs');
 
 const findWalletOptionFor = (account, walletOptions) => {
     const { walletName } = account;
-    if (walletName === 'turnkeyhd') {
+    if (walletName === 'turnkeyhd' || walletName === 'dynamicwaas') {
         const chain = account.chain
             ? values.VerifiedCredentialNameToChainEnum[account.chain]
             : undefined;

package/src/lib/utils/functions/findWalletOptionFor/findWalletOptionFor.js

@@ -4,7 +4,7 @@ import { compareChains } from '../compareChains/compareChains.js';
 
 const findWalletOptionFor = (account, walletOptions) => {
     const { walletName } = account;
-    if (walletName === 'turnkeyhd') {
+    if (walletName === 'turnkeyhd' || walletName === 'dynamicwaas') {
         const chain = account.chain
             ? VerifiedCredentialNameToChainEnum[account.chain]
             : undefined;

package/src/lib/utils/functions/generateMessages/index.cjs

@@ -7,6 +7,24 @@ var _tslib = require('../../../../../_virtual/_tslib.cjs');
 var multiWallet = require('@dynamic-labs/multi-wallet');
 var utils = require('@dynamic-labs/utils');
 
+const getChainIdForMessage = (walletConnector) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+    // If it's a Solana wallet, we should not specify a chainId
+    // since it breaks the message signature in some wallets (e.g. Trust Wallet)
+    if (walletConnector.connectedChain === 'SOL') {
+        return undefined;
+    }
+    const chain = yield walletConnector.getNetwork(true);
+    if (chain) {
+        return chain;
+    }
+    if (walletConnector.key === 'bloctoevm') {
+        return 137;
+    }
+    if (walletConnector.connectedChain === 'EVM') {
+        return 1;
+    }
+    return chain;
+});
 const generateMessages = (publicWalletAddress, walletConnector, nonce, projectEnvironmentId, displaySiweStatement, siweStatement) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
     if (publicWalletAddress === undefined) {
         throw new utils.DynamicError('Unable to fetch the public address from the wallet');
@@ -14,15 +32,7 @@ const generateMessages = (publicWalletAddress, walletConnector, nonce, projectEn
     if (!walletConnector.connectedChain) {
         throw new utils.DynamicError('Wallet is not connected');
     }
-    let chainId = yield walletConnector.getNetwork(true);
-    if (chainId === undefined) {
-        if (walletConnector.key === 'bloctoevm') {
-            chainId = 137;
-        }
-        else if (walletConnector.connectedChain === 'EVM') {
-            chainId = 1;
-        }
-    }
+    const chainId = yield getChainIdForMessage(walletConnector);
     const parsedAddress = walletConnector.parseAddress(publicWalletAddress);
     const currentUrl = utils.PlatformService.getUrl();
     const messageToSign = multiWallet.generateMessageToSign({

package/src/lib/utils/functions/generateMessages/index.js

@@ -3,6 +3,24 @@ import { __awaiter } from '../../../../../_virtual/_tslib.js';
 import { generateMessageToSign } from '@dynamic-labs/multi-wallet';
 import { DynamicError, PlatformService } from '@dynamic-labs/utils';
 
+const getChainIdForMessage = (walletConnector) => __awaiter(void 0, void 0, void 0, function* () {
+    // If it's a Solana wallet, we should not specify a chainId
+    // since it breaks the message signature in some wallets (e.g. Trust Wallet)
+    if (walletConnector.connectedChain === 'SOL') {
+        return undefined;
+    }
+    const chain = yield walletConnector.getNetwork(true);
+    if (chain) {
+        return chain;
+    }
+    if (walletConnector.key === 'bloctoevm') {
+        return 137;
+    }
+    if (walletConnector.connectedChain === 'EVM') {
+        return 1;
+    }
+    return chain;
+});
 const generateMessages = (publicWalletAddress, walletConnector, nonce, projectEnvironmentId, displaySiweStatement, siweStatement) => __awaiter(void 0, void 0, void 0, function* () {
     if (publicWalletAddress === undefined) {
         throw new DynamicError('Unable to fetch the public address from the wallet');
@@ -10,15 +28,7 @@ const generateMessages = (publicWalletAddress, walletConnector, nonce, projectEn
     if (!walletConnector.connectedChain) {
         throw new DynamicError('Wallet is not connected');
     }
-    let chainId = yield walletConnector.getNetwork(true);
-    if (chainId === undefined) {
-        if (walletConnector.key === 'bloctoevm') {
-            chainId = 137;
-        }
-        else if (walletConnector.connectedChain === 'EVM') {
-            chainId = 1;
-        }
-    }
+    const chainId = yield getChainIdForMessage(walletConnector);
     const parsedAddress = walletConnector.parseAddress(publicWalletAddress);
     const currentUrl = PlatformService.getUrl();
     const messageToSign = generateMessageToSign({

package/src/lib/utils/functions/index.d.ts

@@ -78,5 +78,4 @@ export * from './isAuthenticatedWithAWallet';
 export * from './networksAndChains';
 export * from './updatePrimaryWalletId';
 export * from './getWalletUniqueId';
-export * from './coinbaseOnramp';
 export * from './openPopup';

package/src/lib/utils/functions/onrampConfigurationToOnrampOption/onrampConfigurationToOnrampOption.cjs

@@ -4,28 +4,41 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var openOnrampPopup = require('../openOnrampPopup.cjs');
+var index = require('../onrampProviders/index.cjs');
 
+/**
+ * Converts an OnrampConfiguration to an OnrampOption based on the provider's display mode
+ */
 const onrampConfigurationToOnrampOption = (provider, onClick, setShowOnramp) => {
-    var _a, _b, _c;
-    const isPopupImplementation = provider.provider === 'coinbaseOnramp';
-    return {
-        displayName: (_b = (_a = provider.name) !== null && _a !== void 0 ? _a : provider.provider) !== null && _b !== void 0 ? _b : '',
-        iconUrl: (_c = provider.iconUrl) !== null && _c !== void 0 ? _c : '',
+    var _a, _b, _c, _d;
+    // Determine if this provider uses popup or iframe mode
+    const providerKey = provider.provider;
+    const openMode = (_a = index.providerDisplayModes[providerKey]) !== null && _a !== void 0 ? _a : 'iframe';
+    // Create common properties
+    const baseProperties = {
+        displayName: (_c = (_b = provider.name) !== null && _b !== void 0 ? _b : provider.provider) !== null && _c !== void 0 ? _c : '',
+        iconUrl: (_d = provider.iconUrl) !== null && _d !== void 0 ? _d : '',
         id: String(provider.provider),
-        // For Coinbase, we don't use the iframeUrl in the widget, we handle it in onClick
-        iframeUrl: isPopupImplementation ? undefined : provider.url,
-        onClick: (params) => {
-            // Call the provided onClick to set the selected provider
-            onClick({
-                onrampProvider: provider.provider,
-            });
-            // For Coinbase, handle the popup opening directly in the onClick
-            if (isPopupImplementation && provider.url && setShowOnramp) {
-                // Use the new openOnrampPopup function to handle the popup logic
-                openOnrampPopup.openOnrampPopup(provider.url, params.wallet, setShowOnramp);
-            }
-        },
+        openMode,
+        url: provider.url,
     };
+    // Create base onClick handler
+    const baseOnClick = (params) => {
+        onClick({
+            onrampProvider: provider.provider,
+        });
+    };
+    // For popup mode, enhance the onClick handler to open the popup
+    if (openMode === 'popup') {
+        return Object.assign(Object.assign({}, baseProperties), { onClick: (params) => {
+                baseOnClick();
+                if (provider.url && setShowOnramp) {
+                    openOnrampPopup.openOnrampPopup(provider.url, params.wallet, setShowOnramp, provider.provider);
+                }
+            } });
+    }
+    // For iframe mode, use the base onClick handler
+    return Object.assign(Object.assign({}, baseProperties), { onClick: baseOnClick });
 };
 
 exports.onrampConfigurationToOnrampOption = onrampConfigurationToOnrampOption;

package/src/lib/utils/functions/onrampConfigurationToOnrampOption/onrampConfigurationToOnrampOption.d.ts

@@ -1,5 +1,8 @@
 import type { OnrampConfiguration, OnrampProviders } from '@dynamic-labs/sdk-api-core';
 import type { OnrampOption } from '../../../context/DynamicContext';
+/**
+ * Converts an OnrampConfiguration to an OnrampOption based on the provider's display mode
+ */
 export declare const onrampConfigurationToOnrampOption: (provider: OnrampConfiguration, onClick: ({ onrampProvider }: {
     onrampProvider: OnrampProviders;
 }) => void, setShowOnramp?: (show: boolean) => void) => OnrampOption;

package/src/lib/utils/functions/onrampConfigurationToOnrampOption/onrampConfigurationToOnrampOption.js

@@ -1,27 +1,40 @@
 'use client'
 import { openOnrampPopup } from '../openOnrampPopup.js';
+import { providerDisplayModes } from '../onrampProviders/index.js';
 
+/**
+ * Converts an OnrampConfiguration to an OnrampOption based on the provider's display mode
+ */
 const onrampConfigurationToOnrampOption = (provider, onClick, setShowOnramp) => {
-    var _a, _b, _c;
-    const isPopupImplementation = provider.provider === 'coinbaseOnramp';
-    return {
-        displayName: (_b = (_a = provider.name) !== null && _a !== void 0 ? _a : provider.provider) !== null && _b !== void 0 ? _b : '',
-        iconUrl: (_c = provider.iconUrl) !== null && _c !== void 0 ? _c : '',
+    var _a, _b, _c, _d;
+    // Determine if this provider uses popup or iframe mode
+    const providerKey = provider.provider;
+    const openMode = (_a = providerDisplayModes[providerKey]) !== null && _a !== void 0 ? _a : 'iframe';
+    // Create common properties
+    const baseProperties = {
+        displayName: (_c = (_b = provider.name) !== null && _b !== void 0 ? _b : provider.provider) !== null && _c !== void 0 ? _c : '',
+        iconUrl: (_d = provider.iconUrl) !== null && _d !== void 0 ? _d : '',
         id: String(provider.provider),
-        // For Coinbase, we don't use the iframeUrl in the widget, we handle it in onClick
-        iframeUrl: isPopupImplementation ? undefined : provider.url,
-        onClick: (params) => {
-            // Call the provided onClick to set the selected provider
-            onClick({
-                onrampProvider: provider.provider,
-            });
-            // For Coinbase, handle the popup opening directly in the onClick
-            if (isPopupImplementation && provider.url && setShowOnramp) {
-                // Use the new openOnrampPopup function to handle the popup logic
-                openOnrampPopup(provider.url, params.wallet, setShowOnramp);
-            }
-        },
+        openMode,
+        url: provider.url,
     };
+    // Create base onClick handler
+    const baseOnClick = (params) => {
+        onClick({
+            onrampProvider: provider.provider,
+        });
+    };
+    // For popup mode, enhance the onClick handler to open the popup
+    if (openMode === 'popup') {
+        return Object.assign(Object.assign({}, baseProperties), { onClick: (params) => {
+                baseOnClick();
+                if (provider.url && setShowOnramp) {
+                    openOnrampPopup(provider.url, params.wallet, setShowOnramp, provider.provider);
+                }
+            } });
+    }
+    // For iframe mode, use the base onClick handler
+    return Object.assign(Object.assign({}, baseProperties), { onClick: baseOnClick });
 };
 
 export { onrampConfigurationToOnrampOption };

package/src/lib/utils/functions/onrampProviders/coinbase.cjs

@@ -0,0 +1,55 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+/**
+ * Gets the enabled non-testnet networks for a wallet
+ * @param wallet User's wallet
+ * @returns Array of enabled non-testnet networks, or empty array if no wallet or networks
+ */
+const getEnabledNonTestnetNetworks = (wallet) => {
+    if (!wallet ||
+        !wallet.connector ||
+        typeof wallet.connector.getEnabledNetworks !== 'function') {
+        return [];
+    }
+    const networks = wallet.connector.getEnabledNetworks();
+    if (!networks || networks.length === 0) {
+        return [];
+    }
+    return networks.filter((network) => !network.isTestnet);
+};
+/**
+ * Formats a Coinbase onramp URL with wallet information
+ * @param url Base URL from Coinbase
+ * @param wallet User's wallet
+ * @returns Formatted URL with wallet information
+ */
+const formatCoinbaseOnrampUrl = (url, wallet) => {
+    const nonTestnetNetworks = getEnabledNonTestnetNetworks(wallet);
+    if (nonTestnetNetworks.length === 0 || !(wallet === null || wallet === void 0 ? void 0 : wallet.address)) {
+        return url;
+    }
+    const baseUrl = new URL(url);
+    const appId = baseUrl.searchParams.get('appId');
+    // If no appId is present, return the original URL
+    if (!appId) {
+        return url;
+    }
+    // Filter out networks with empty or undefined keys and remove duplicates
+    const uniqueNetworkKeys = Array.from(new Set(nonTestnetNetworks
+        .map((network) => network.key)
+        .filter((key) => Boolean(key))));
+    if (uniqueNetworkKeys.length === 0) {
+        return url;
+    }
+    // Construct the URL with the raw query parameters
+    const finalUrl = `${baseUrl.origin}${baseUrl.pathname}?appId=${appId}&addresses=${encodeURIComponent(JSON.stringify({
+        [wallet.address]: uniqueNetworkKeys,
+    }))}`;
+    return finalUrl;
+};
+
+exports.formatCoinbaseOnrampUrl = formatCoinbaseOnrampUrl;
+exports.getEnabledNonTestnetNetworks = getEnabledNonTestnetNetworks;

package/src/lib/utils/functions/onrampProviders/coinbase.d.ts

@@ -0,0 +1,15 @@
+import type { Wallet } from '@dynamic-labs/wallet-connector-core';
+import type { GenericNetwork } from '@dynamic-labs/types';
+/**
+ * Gets the enabled non-testnet networks for a wallet
+ * @param wallet User's wallet
+ * @returns Array of enabled non-testnet networks, or empty array if no wallet or networks
+ */
+export declare const getEnabledNonTestnetNetworks: (wallet?: Wallet) => GenericNetwork[];
+/**
+ * Formats a Coinbase onramp URL with wallet information
+ * @param url Base URL from Coinbase
+ * @param wallet User's wallet
+ * @returns Formatted URL with wallet information
+ */
+export declare const formatCoinbaseOnrampUrl: (url: string, wallet?: Wallet) => string;