@dynamic-labs/sdk-react-core 4.20.9 → 4.20.10

package/src/lib/widgets/DynamicWidget/views/AccountAndSecuritySettingsView/AccountAndSecuritySettingsView.js

@@ -33,10 +33,10 @@ import '../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
 import 'react-international-phone';
 import '../../../../store/state/nonce/nonce.js';
+import '@dynamic-labs-sdk/client';
+import '../../../../client/client.js';
 import '@dynamic-labs-sdk/client/core';
 import { useProjectSettings } from '../../../../store/state/projectSettings/projectSettings.js';
-import '../../../../client/client.js';
-import '@dynamic-labs-sdk/client';
 import '../../../../config/ApiEndpoint.js';
 import '../../../../locale/locale.js';
 import '../../../../store/state/dynamicContextProps/dynamicContextProps.js';
@@ -113,6 +113,7 @@ import '../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
 import { useEmbeddedReveal } from '../../../../utils/hooks/useEmbeddedReveal/useEmbeddedReveal.js';
 import { useEmbeddedWalletAuthenticator } from '../../../../utils/hooks/useEmbeddedWalletAuthenticator/useEmbeddedWalletAuthenticator.js';
 import '../../../../context/OnrampContext/OnrampContext.js';
+import '../../helpers/convertProviderExchangeProviderOnRamp.js';
 import '../ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../../index.js';
 import '../../../../store/state/tokenBalances.js';

package/src/lib/widgets/DynamicWidget/views/ChooseOnrampProviderView/ChooseOnrampProviderView.cjs

@@ -35,10 +35,10 @@ require('../../../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
 require('react-international-phone');
 require('../../../../store/state/nonce/nonce.cjs');
+require('@dynamic-labs-sdk/client');
+require('../../../../client/client.cjs');
 require('@dynamic-labs-sdk/client/core');
 require('../../../../store/state/projectSettings/projectSettings.cjs');
-require('../../../../client/client.cjs');
-require('@dynamic-labs-sdk/client');
 require('../../../../config/ApiEndpoint.cjs');
 require('../../../../locale/locale.cjs');
 require('../../../../store/state/dynamicContextProps/dynamicContextProps.cjs');
@@ -86,6 +86,8 @@ require('../../../../components/OverlayCard/OverlayCard.cjs');
 require('../../../../views/TransactionConfirmationView/TransactionConfirmationView.cjs');
 require('../../../../context/PasskeyContext/PasskeyContext.cjs');
 require('../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
+require('../../helpers/convertExchangeKeyAndProviderEnum.cjs');
+require('../../helpers/convertProviderExchangeProviderOnRamp.cjs');
 require('qrcode');
 require('../ReceiveWalletFunds/ReceiveWalletFunds.cjs');
 require('../../../../../index.cjs');
@@ -95,7 +97,6 @@ require('../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWall
 require('@hcaptcha/react-hcaptcha');
 require('../../../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
-require('../../helpers/convertExchangeKeyAndProviderEnum.cjs');
 require('../../../../store/state/connectorsInitializing/connectorsInitializing.cjs');
 require('../../../../store/state/tokenBalances.cjs');
 require('../../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');

package/src/lib/widgets/DynamicWidget/views/ChooseOnrampProviderView/ChooseOnrampProviderView.js

@@ -31,10 +31,10 @@ import '../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
 import 'react-international-phone';
 import '../../../../store/state/nonce/nonce.js';
+import '@dynamic-labs-sdk/client';
+import '../../../../client/client.js';
 import '@dynamic-labs-sdk/client/core';
 import '../../../../store/state/projectSettings/projectSettings.js';
-import '../../../../client/client.js';
-import '@dynamic-labs-sdk/client';
 import '../../../../config/ApiEndpoint.js';
 import '../../../../locale/locale.js';
 import '../../../../store/state/dynamicContextProps/dynamicContextProps.js';
@@ -82,6 +82,8 @@ import '../../../../components/OverlayCard/OverlayCard.js';
 import '../../../../views/TransactionConfirmationView/TransactionConfirmationView.js';
 import '../../../../context/PasskeyContext/PasskeyContext.js';
 import '../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
+import '../../helpers/convertExchangeKeyAndProviderEnum.js';
+import '../../helpers/convertProviderExchangeProviderOnRamp.js';
 import 'qrcode';
 import '../ReceiveWalletFunds/ReceiveWalletFunds.js';
 import '../../../../../index.js';
@@ -91,7 +93,6 @@ import '../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWalle
 import '@hcaptcha/react-hcaptcha';
 import '../../../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
-import '../../helpers/convertExchangeKeyAndProviderEnum.js';
 import '../../../../store/state/connectorsInitializing/connectorsInitializing.js';
 import '../../../../store/state/tokenBalances.js';
 import '../../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';

package/src/lib/widgets/DynamicWidget/views/ChooseWalletFundingMethod/useFundingMethods/useFundingMethods.cjs

@@ -6,6 +6,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var reactI18next = require('react-i18next');
+var iconic = require('@dynamic-labs/iconic');
 var walletBook = require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
@@ -14,7 +15,6 @@ var globe = require('../../../../../shared/assets/globe.cjs');
 var linkCircle = require('../../../../../shared/assets/link-circle.cjs');
 var qrCode = require('../../../../../shared/assets/qr-code.cjs');
 var walletOutlineV2 = require('../../../../../shared/assets/wallet-outline-v2.cjs');
-require('@dynamic-labs/iconic');
 require('../../../../../context/ViewContext/ViewContext.cjs');
 require('../../../../../../../_virtual/_tslib.cjs');
 require('@dynamic-labs/sdk-api-core');
@@ -34,10 +34,10 @@ require('../../../../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
 require('react-international-phone');
 require('../../../../../store/state/nonce/nonce.cjs');
-require('@dynamic-labs-sdk/client/core');
-require('../../../../../store/state/projectSettings/projectSettings.cjs');
-require('../../../../../client/client.cjs');
 require('@dynamic-labs-sdk/client');
+require('../../../../../client/client.cjs');
+require('@dynamic-labs-sdk/client/core');
+var projectSettings = require('../../../../../store/state/projectSettings/projectSettings.cjs');
 require('../../../../../config/ApiEndpoint.cjs');
 require('../../../../../locale/locale.cjs');
 require('../../../../../store/state/dynamicContextProps/dynamicContextProps.cjs');
@@ -50,7 +50,7 @@ require('../../../../../context/VerificationContext/VerificationContext.cjs');
 require('react-dom');
 require('../../../../../utils/functions/compareChains/compareChains.cjs');
 require('../../../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.cjs');
-require('../../../../../context/ThemeContext/ThemeContext.cjs');
+var useIconThemeVariant = require('../../../../../utils/hooks/useIconThemeVariant/useIconThemeVariant.cjs');
 require('../../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
 require('bs58');
 require('@dynamic-labs/types');
@@ -74,6 +74,7 @@ require('../../../../../components/OverlayCardBase/OverlayCardTarget/OverlayCard
 require('../../../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../../components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
+require('../../../../../context/ThemeContext/ThemeContext.cjs');
 var Icon = require('../../../../../components/Icon/Icon.cjs');
 var DynamicWidgetContext = require('../../../context/DynamicWidgetContext.cjs');
 require('../../../../../components/IconButton/IconButton.cjs');
@@ -90,6 +91,8 @@ var OnrampContext = require('../../../../../context/OnrampContext/OnrampContext.
 var index = require('../../../../../utils/functions/walletFilters/index.cjs');
 var useFundWithWallet = require('../../../../../utils/hooks/useFundWithWallet/useFundWithWallet.cjs');
 var useWalletList = require('../../../../../utils/hooks/useWalletList/useWalletList.cjs');
+var convertExchangeKeyAndProviderEnum = require('../../../helpers/convertExchangeKeyAndProviderEnum.cjs');
+var useStartExchangeFunding = require('./useStartExchangeFunding/useStartExchangeFunding.cjs');
 var useStartExternalWalletFunding = require('./useStartExternalWalletFunding/useStartExternalWalletFunding.cjs');
 var useStartLinkedWalletFunding = require('./useStartLinkedWalletFunding/useStartLinkedWalletFunding.cjs');
 require('qrcode');
@@ -101,7 +104,6 @@ require('../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryW
 require('@hcaptcha/react-hcaptcha');
 require('../../../../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
 require('../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
-require('../../../helpers/convertExchangeKeyAndProviderEnum.cjs');
 require('../../../../../store/state/connectorsInitializing/connectorsInitializing.cjs');
 require('../../../../../store/state/tokenBalances.cjs');
 require('../../../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
@@ -117,11 +119,29 @@ const slicePreviewIcons = (icons) => {
 };
 const MAX_PREVIEW_ICONS = 3;
 const useFundingMethods = () => {
+    var _a;
     const { t } = reactI18next.useTranslation();
     const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
     const { externalWalletFundingEnabled } = useFundWithWallet.useInternalFundWithWallet();
     const { enabledOnrampProviders, selectOnrampProvider } = OnrampContext.useOnrampContext();
+    const iconThemeVariant = useIconThemeVariant.useIconThemeVariant();
     const { primaryWallet } = useInternalDynamicContext.useInternalDynamicContext();
+    const projectSettings$1 = projectSettings.useProjectSettings();
+    const exchangeNames = React.useMemo(() => {
+        if (!(projectSettings$1 === null || projectSettings$1 === void 0 ? void 0 : projectSettings$1.providers))
+            return [];
+        const names = projectSettings$1.providers.flatMap(({ provider, enabledAt }) => {
+            if (!enabledAt)
+                return [];
+            if (convertExchangeKeyAndProviderEnum.isProviderExchange(provider)) {
+                return [provider];
+            }
+            else {
+                return [];
+            }
+        });
+        return [...new Set(names)];
+    }, [projectSettings$1 === null || projectSettings$1 === void 0 ? void 0 : projectSettings$1.providers]);
     const viewWalletsFilter = React.useMemo(() => (primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.chain)
         ? index.FilterChain(primaryWallet.chain)
         : undefined, [primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.chain]);
@@ -130,6 +150,7 @@ const useFundingMethods = () => {
     });
     const walletGroups = walletOptions.useWalletGroups();
     const { startExternalWalletFunding } = useStartExternalWalletFunding.useStartExternalWalletFunding();
+    const { startExchangeFunding } = useStartExchangeFunding.useStartExchangeFunding();
     const { startLinkedWalletFunding, filteredLinkedWallets } = useStartLinkedWalletFunding.useStartLinkedWalletFunding();
     const onrampOptions = React.useMemo(() => enabledOnrampProviders.filter(({ isPaymentMethod }) => !isPaymentMethod), [enabledOnrampProviders]);
     const paymentMethods = React.useMemo(() => enabledOnrampProviders.filter(({ isPaymentMethod }) => isPaymentMethod), [enabledOnrampProviders]);
@@ -158,12 +179,17 @@ const useFundingMethods = () => {
             return (jsxRuntime.jsx("div", { className: 'choose-wallet-funding-method__options__option__trailing__preview-icons__wallet-icon', style: { '--z-index': MAX_PREVIEW_ICONS - index }, children: jsxRuntime.jsx(walletBook.WalletIcon, { icon: (_a = walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.metadata.icon) !== null && _a !== void 0 ? _a : (_c = (_b = walletGroups[key]) === null || _b === void 0 ? void 0 : _b.brand) === null || _c === void 0 ? void 0 : _c.icon, walletKey: key, isGroup: false }) }, key));
         }));
     }, [externalWalletFundingEnabled, walletsList, walletGroups]);
+    const exchangeIcons = React.useMemo(() => {
+        const icons = exchangeNames.map((providerKey, index) => (jsxRuntime.jsx("div", { className: 'choose-wallet-funding-method__options__option__trailing__preview-icons__wallet-icon', style: { '--z-index': MAX_PREVIEW_ICONS - index }, children: jsxRuntime.jsx(iconic.SocialIcon, { name: providerKey, variant: iconThemeVariant }) }, providerKey)));
+        return slicePreviewIcons(icons);
+    }, [exchangeNames, iconThemeVariant]);
     const previewOnrampIcons = React.useMemo(() => {
         if (!onrampOptions.length)
             return [];
         return slicePreviewIcons(onrampOptions.map(({ iconUrl, id }) => (jsxRuntime.jsx("div", { className: 'choose-wallet-funding-method__options__option__trailing__preview-icons__onramp-icon', children: jsxRuntime.jsx("img", { src: iconUrl, alt: `${id}-icon` }) }, id))));
     }, [onrampOptions]);
     return React.useMemo(() => {
+        var _a;
         const methods = [
             {
                 icon: jsxRuntime.jsx(qrCode.ReactComponent, {}),
@@ -207,6 +233,17 @@ const useFundingMethods = () => {
                 showChevron: true,
             });
         }
+        if (exchangeNames.length > 0 &&
+            ((_a = projectSettings$1 === null || projectSettings$1 === void 0 ? void 0 : projectSettings$1.sdk.featureFlags) === null || _a === void 0 ? void 0 : _a.enableExchanges)) {
+            methods.push({
+                icon: jsxRuntime.jsx(globe.ReactComponent, {}),
+                key: 'exchange',
+                label: t('dyn_wallet_funding.funding_method_selection.exchange_option'),
+                onClick: startExchangeFunding,
+                previewIcons: exchangeIcons,
+                showChevron: true,
+            });
+        }
         if (externalWalletFundingEnabled) {
             methods.push({
                 icon: jsxRuntime.jsx(walletOutlineV2.ReactComponent, {}),
@@ -224,12 +261,16 @@ const useFundingMethods = () => {
         primaryWallet,
         onrampOptions.length,
         filteredLinkedWallets.length,
+        exchangeNames.length,
+        (_a = projectSettings$1 === null || projectSettings$1 === void 0 ? void 0 : projectSettings$1.sdk.featureFlags) === null || _a === void 0 ? void 0 : _a.enableExchanges,
         externalWalletFundingEnabled,
         paymentMethods,
         selectOnrampProvider,
         handleBuyCryptoClick,
         previewOnrampIcons,
         startLinkedWalletFunding,
+        startExchangeFunding,
+        exchangeIcons,
         startExternalWalletFunding,
         previewWalletIcons,
     ]);

package/src/lib/widgets/DynamicWidget/views/ChooseWalletFundingMethod/useFundingMethods/useFundingMethods.js

@@ -2,6 +2,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { useMemo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
+import { SocialIcon } from '@dynamic-labs/iconic';
 import { WalletIcon } from '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
@@ -10,7 +11,6 @@ import { ReactComponent as SvgGlobe } from '../../../../../shared/assets/globe.j
 import { ReactComponent as SvgLinkCircle } from '../../../../../shared/assets/link-circle.js';
 import { ReactComponent as SvgQrCode } from '../../../../../shared/assets/qr-code.js';
 import { ReactComponent as SvgWalletOutlineV2 } from '../../../../../shared/assets/wallet-outline-v2.js';
-import '@dynamic-labs/iconic';
 import '../../../../../context/ViewContext/ViewContext.js';
 import '../../../../../../../_virtual/_tslib.js';
 import '@dynamic-labs/sdk-api-core';
@@ -30,10 +30,10 @@ import '../../../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
 import 'react-international-phone';
 import '../../../../../store/state/nonce/nonce.js';
-import '@dynamic-labs-sdk/client/core';
-import '../../../../../store/state/projectSettings/projectSettings.js';
-import '../../../../../client/client.js';
 import '@dynamic-labs-sdk/client';
+import '../../../../../client/client.js';
+import '@dynamic-labs-sdk/client/core';
+import { useProjectSettings } from '../../../../../store/state/projectSettings/projectSettings.js';
 import '../../../../../config/ApiEndpoint.js';
 import '../../../../../locale/locale.js';
 import '../../../../../store/state/dynamicContextProps/dynamicContextProps.js';
@@ -46,7 +46,7 @@ import '../../../../../context/VerificationContext/VerificationContext.js';
 import 'react-dom';
 import '../../../../../utils/functions/compareChains/compareChains.js';
 import '../../../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.js';
-import '../../../../../context/ThemeContext/ThemeContext.js';
+import { useIconThemeVariant } from '../../../../../utils/hooks/useIconThemeVariant/useIconThemeVariant.js';
 import '../../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
 import 'bs58';
 import '@dynamic-labs/types';
@@ -70,6 +70,7 @@ import '../../../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardT
 import '../../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../../components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
+import '../../../../../context/ThemeContext/ThemeContext.js';
 import { Icon } from '../../../../../components/Icon/Icon.js';
 import { useWidgetContext } from '../../../context/DynamicWidgetContext.js';
 import '../../../../../components/IconButton/IconButton.js';
@@ -86,6 +87,8 @@ import { useOnrampContext } from '../../../../../context/OnrampContext/OnrampCon
 import { FilterChain } from '../../../../../utils/functions/walletFilters/index.js';
 import { useInternalFundWithWallet } from '../../../../../utils/hooks/useFundWithWallet/useFundWithWallet.js';
 import { useWalletList } from '../../../../../utils/hooks/useWalletList/useWalletList.js';
+import { isProviderExchange } from '../../../helpers/convertExchangeKeyAndProviderEnum.js';
+import { useStartExchangeFunding } from './useStartExchangeFunding/useStartExchangeFunding.js';
 import { useStartExternalWalletFunding } from './useStartExternalWalletFunding/useStartExternalWalletFunding.js';
 import { useStartLinkedWalletFunding } from './useStartLinkedWalletFunding/useStartLinkedWalletFunding.js';
 import 'qrcode';
@@ -97,7 +100,6 @@ import '../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWa
 import '@hcaptcha/react-hcaptcha';
 import '../../../../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
 import '../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
-import '../../../helpers/convertExchangeKeyAndProviderEnum.js';
 import '../../../../../store/state/connectorsInitializing/connectorsInitializing.js';
 import '../../../../../store/state/tokenBalances.js';
 import '../../../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
@@ -113,11 +115,29 @@ const slicePreviewIcons = (icons) => {
 };
 const MAX_PREVIEW_ICONS = 3;
 const useFundingMethods = () => {
+    var _a;
     const { t } = useTranslation();
     const { setDynamicWidgetView } = useWidgetContext();
     const { externalWalletFundingEnabled } = useInternalFundWithWallet();
     const { enabledOnrampProviders, selectOnrampProvider } = useOnrampContext();
+    const iconThemeVariant = useIconThemeVariant();
     const { primaryWallet } = useInternalDynamicContext();
+    const projectSettings = useProjectSettings();
+    const exchangeNames = useMemo(() => {
+        if (!(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers))
+            return [];
+        const names = projectSettings.providers.flatMap(({ provider, enabledAt }) => {
+            if (!enabledAt)
+                return [];
+            if (isProviderExchange(provider)) {
+                return [provider];
+            }
+            else {
+                return [];
+            }
+        });
+        return [...new Set(names)];
+    }, [projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers]);
     const viewWalletsFilter = useMemo(() => (primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.chain)
         ? FilterChain(primaryWallet.chain)
         : undefined, [primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.chain]);
@@ -126,6 +146,7 @@ const useFundingMethods = () => {
     });
     const walletGroups = useWalletGroups();
     const { startExternalWalletFunding } = useStartExternalWalletFunding();
+    const { startExchangeFunding } = useStartExchangeFunding();
     const { startLinkedWalletFunding, filteredLinkedWallets } = useStartLinkedWalletFunding();
     const onrampOptions = useMemo(() => enabledOnrampProviders.filter(({ isPaymentMethod }) => !isPaymentMethod), [enabledOnrampProviders]);
     const paymentMethods = useMemo(() => enabledOnrampProviders.filter(({ isPaymentMethod }) => isPaymentMethod), [enabledOnrampProviders]);
@@ -154,12 +175,17 @@ const useFundingMethods = () => {
             return (jsx("div", { className: 'choose-wallet-funding-method__options__option__trailing__preview-icons__wallet-icon', style: { '--z-index': MAX_PREVIEW_ICONS - index }, children: jsx(WalletIcon, { icon: (_a = walletConnector === null || walletConnector === void 0 ? void 0 : walletConnector.metadata.icon) !== null && _a !== void 0 ? _a : (_c = (_b = walletGroups[key]) === null || _b === void 0 ? void 0 : _b.brand) === null || _c === void 0 ? void 0 : _c.icon, walletKey: key, isGroup: false }) }, key));
         }));
     }, [externalWalletFundingEnabled, walletsList, walletGroups]);
+    const exchangeIcons = useMemo(() => {
+        const icons = exchangeNames.map((providerKey, index) => (jsx("div", { className: 'choose-wallet-funding-method__options__option__trailing__preview-icons__wallet-icon', style: { '--z-index': MAX_PREVIEW_ICONS - index }, children: jsx(SocialIcon, { name: providerKey, variant: iconThemeVariant }) }, providerKey)));
+        return slicePreviewIcons(icons);
+    }, [exchangeNames, iconThemeVariant]);
     const previewOnrampIcons = useMemo(() => {
         if (!onrampOptions.length)
             return [];
         return slicePreviewIcons(onrampOptions.map(({ iconUrl, id }) => (jsx("div", { className: 'choose-wallet-funding-method__options__option__trailing__preview-icons__onramp-icon', children: jsx("img", { src: iconUrl, alt: `${id}-icon` }) }, id))));
     }, [onrampOptions]);
     return useMemo(() => {
+        var _a;
         const methods = [
             {
                 icon: jsx(SvgQrCode, {}),
@@ -203,6 +229,17 @@ const useFundingMethods = () => {
                 showChevron: true,
             });
         }
+        if (exchangeNames.length > 0 &&
+            ((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.featureFlags) === null || _a === void 0 ? void 0 : _a.enableExchanges)) {
+            methods.push({
+                icon: jsx(SvgGlobe, {}),
+                key: 'exchange',
+                label: t('dyn_wallet_funding.funding_method_selection.exchange_option'),
+                onClick: startExchangeFunding,
+                previewIcons: exchangeIcons,
+                showChevron: true,
+            });
+        }
         if (externalWalletFundingEnabled) {
             methods.push({
                 icon: jsx(SvgWalletOutlineV2, {}),
@@ -220,12 +257,16 @@ const useFundingMethods = () => {
         primaryWallet,
         onrampOptions.length,
         filteredLinkedWallets.length,
+        exchangeNames.length,
+        (_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.featureFlags) === null || _a === void 0 ? void 0 : _a.enableExchanges,
         externalWalletFundingEnabled,
         paymentMethods,
         selectOnrampProvider,
         handleBuyCryptoClick,
         previewOnrampIcons,
         startLinkedWalletFunding,
+        startExchangeFunding,
+        exchangeIcons,
         startExternalWalletFunding,
         previewWalletIcons,
     ]);

package/src/lib/widgets/DynamicWidget/views/ChooseWalletFundingMethod/useFundingMethods/useStartExchangeFunding/useStartExchangeFunding.cjs

@@ -0,0 +1,152 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('../../../../../../../../_virtual/_tslib.cjs');
+var React = require('react');
+require('@dynamic-labs-sdk/client');
+require('../../../../../../client/client.cjs');
+require('@dynamic-labs-sdk/client/core');
+require('@dynamic-labs/utils');
+require('../../../../../../store/state/projectSettings/projectSettings.cjs');
+require('../../../../../../utils/constants/values.cjs');
+require('@dynamic-labs/sdk-api-core');
+require('../../../../../../events/dynamicEvents.cjs');
+var useOnboardingCompleteUser = require('../../../../../../client/extension/user/useOnboardingCompleteUser/useOnboardingCompleteUser.cjs');
+var OnrampContext = require('../../../../../../context/OnrampContext/OnrampContext.cjs');
+var logger = require('../../../../../../shared/logger.cjs');
+var authMode = require('../../../../../../store/state/authMode/authMode.cjs');
+require('../../../../../../context/DynamicContext/DynamicContext.cjs');
+require('../../../../../../store/state/loadingAndLifecycle/loadingAndLifecycle.cjs');
+require('@dynamic-labs/iconic');
+require('@dynamic-labs/wallet-connector-core');
+require('react/jsx-runtime');
+require('../../../../../../context/ViewContext/ViewContext.cjs');
+require('@dynamic-labs/wallet-book');
+require('../../../../../../utils/constants/colors.cjs');
+require('../../../../../../shared/consts/index.cjs');
+require('../../../../../../context/CaptchaContext/CaptchaContext.cjs');
+require('../../../../../../context/ErrorContext/ErrorContext.cjs');
+require('@dynamic-labs/multi-wallet');
+require('react-international-phone');
+require('../../../../../../store/state/nonce/nonce.cjs');
+require('../../../../../../config/ApiEndpoint.cjs');
+require('../../../../../../locale/locale.cjs');
+require('../../../../../../store/state/dynamicContextProps/dynamicContextProps.cjs');
+require('../../../../../../store/state/primaryWalletId/primaryWalletId.cjs');
+require('../../../../../../store/state/connectedWalletsInfo/connectedWalletsInfo.cjs');
+require('../../../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
+require('../../../../../../context/AccountExistsContext/AccountExistsContext.cjs');
+require('../../../../../../context/UserWalletsContext/UserWalletsContext.cjs');
+require('../../../../../../context/VerificationContext/VerificationContext.cjs');
+require('react-dom');
+require('../../../../../../utils/functions/compareChains/compareChains.cjs');
+require('../../../../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.cjs');
+require('../../../../../../context/ThemeContext/ThemeContext.cjs');
+require('../../../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
+require('bs58');
+var useSocialAccounts = require('../../../../../../utils/hooks/useSocialAccounts/useSocialAccounts.cjs');
+require('yup');
+require('../../../../../../context/MockContext/MockContext.cjs');
+require('../../../../../../views/CollectUserDataView/useFields.cjs');
+require('../../../../../../context/FieldsStateContext/FieldsStateContext.cjs');
+require('../../../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
+require('@dynamic-labs/rpc-providers');
+require('../../../../../../store/state/walletOptions/walletOptions.cjs');
+require('react-i18next');
+require('../../../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
+require('../../../../../../components/Alert/Alert.cjs');
+require('../../../../../../context/WalletContext/WalletContext.cjs');
+require('../../../../../../components/ShadowDOM/ShadowDOM.cjs');
+require('../../../../../../components/IconButton/IconButton.cjs');
+require('../../../../../../components/InlineWidget/InlineWidget.cjs');
+require('../../../../../../components/Input/Input.cjs');
+require('../../../../../../components/IsBrowser/IsBrowser.cjs');
+require('../../../../../../components/MenuList/Dropdown/Dropdown.cjs');
+require('../../../../../../components/OverlayCard/OverlayCard.cjs');
+require('../../../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
+require('../../../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
+require('../../../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
+require('../../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
+require('../../../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../../../components/Popper/PopperContext/PopperContext.cjs');
+require('react-focus-lock');
+require('qrcode');
+require('formik');
+require('../../../../../../utils/hooks/useSubdomainCheck/useSubdomainCheck.cjs');
+require('../../../../../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../../../../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
+require('../../../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
+require('../../../../../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
+require('../../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+require('@hcaptcha/react-hcaptcha');
+require('../../../../../../context/LoadingContext/LoadingContext.cjs');
+require('../../../../context/DynamicWidgetContext.cjs');
+require('../../../../../../context/FooterAnimationContext/index.cjs');
+require('@dynamic-labs/types');
+require('../../../../../../utils/hooks/useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.cjs');
+require('../../../../../../context/ErrorContext/hooks/useErrorText/useErrorText.cjs');
+require('../../../../../../context/PasskeyContext/PasskeyContext.cjs');
+var convertExchangeKeyAndProviderEnum = require('../../../../helpers/convertExchangeKeyAndProviderEnum.cjs');
+require('../../../../../../store/state/sendBalances.cjs');
+require('../../../../../../store/state/connectorsInitializing/connectorsInitializing.cjs');
+require('../../../../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.cjs');
+require('../../../../components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
+require('../../../../../../views/TransactionConfirmationView/TransactionConfirmationView.cjs');
+require('../../../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
+var convertProviderExchangeProviderOnRamp = require('../../../../helpers/convertProviderExchangeProviderOnRamp.cjs');
+require('../../../ReceiveWalletFunds/ReceiveWalletFunds.cjs');
+require('../../../../../../../index.cjs');
+require('../../../../../../store/state/tokenBalances.cjs');
+require('../../../../../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
+var useConnectExchangeForFunding = require('../../../../../../utils/hooks/useConnectExchangeForFunding/useConnectExchangeForFunding.cjs');
+var usePromptAndFundWithExchange = require('../../../../../../utils/hooks/usePromptAndFundWithExchange/usePromptAndFundWithExchange.cjs');
+
+const useStartExchangeFunding = () => {
+    const connectExchangeForFunding = useConnectExchangeForFunding.useConnectExchangeForFunding();
+    const user = useOnboardingCompleteUser.useOnboardingCompleteUser();
+    const { linkSocialAccount } = useSocialAccounts.useSocialAccounts();
+    const promptAmountAndFundWithExchange = usePromptAndFundWithExchange.usePromptAmountAndFundWithExchange();
+    const { openOnramp } = OnrampContext.useOnrampContext();
+    const startExchangeFunding = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        var _a, _b;
+        try {
+            const exchange = yield connectExchangeForFunding({
+                initiatedByWidget: true,
+            });
+            const provider = convertExchangeKeyAndProviderEnum.convertExchangeKeytoProviderEnum(exchange);
+            const connected = (_b = (_a = user === null || user === void 0 ? void 0 : user.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.some(({ oauthProvider }) => oauthProvider === provider)) !== null && _b !== void 0 ? _b : false;
+            if (authMode.getAuthMode() === 'connect-only') {
+                yield openOnramp({
+                    onrampProvider: convertProviderExchangeProviderOnRamp.convertProviderExchangetoProviderOnRampEnum(provider),
+                });
+            }
+            else {
+                if (!connected) {
+                    yield linkSocialAccount(provider, {
+                        showWidgetAfterConnection: true,
+                        triggerFundFromExchangeOnSuccess: exchange,
+                    });
+                }
+                else {
+                    promptAmountAndFundWithExchange({ exchange });
+                }
+            }
+        }
+        catch (_c) {
+            logger.logger.debug('Error while attempting to connect exchange for funding.');
+        }
+    }), [
+        connectExchangeForFunding,
+        linkSocialAccount,
+        openOnramp,
+        promptAmountAndFundWithExchange,
+        user === null || user === void 0 ? void 0 : user.verifiedCredentials,
+    ]);
+    return {
+        startExchangeFunding,
+    };
+};
+
+exports.useStartExchangeFunding = useStartExchangeFunding;