@dynamic-labs/sdk-react-core 4.4.1 → 4.4.2-preview.1

package/src/lib/widgets/DynamicWidget/views/ReceiveExternalWalletFunds/TokenSelectScreen/TokenSelectScreen.js

@@ -1,5 +1,5 @@
 'use client'
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { ReactComponent as SvgSearch } from '../../../../../assets/search.js';
@@ -15,11 +15,11 @@ import '../../../../../shared/logger.js';
 import '@dynamic-labs/iconic';
 import '@dynamic-labs/wallet-connector-core';
 import { ReactComponent as SvgClose } from '../../../../../shared/assets/close.js';
+import { ReactComponent as SvgWalletIllustration } from '../../../../../shared/assets/wallet-illustration.js';
 import '../../../../../context/ViewContext/ViewContext.js';
 import '@dynamic-labs/wallet-book';
 import '../../../../../utils/constants/colors.js';
 import '../../../../../utils/constants/values.js';
-import '../../../../../store/state/loadingAndLifecycle.js';
 import '../../../../../shared/consts/index.js';
 import '../../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../../context/ErrorContext/ErrorContext.js';
@@ -51,7 +51,9 @@ import '../../../../../views/CollectUserDataView/useFields.js';
 import '../../../../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
+import '../../../../../store/state/loadingAndLifecycle.js';
 import '../../../../../store/state/walletOptions/walletOptions.js';
+import '@dynamic-labs/ethereum-aa';
 import { Typography } from '../../../../../components/Typography/Typography.js';
 import '../../../../../context/FooterAnimationContext/index.js';
 import '../../../../../components/ShadowDOM/ShadowDOM.js';
@@ -91,6 +93,7 @@ import '../../../../../components/InlineWidget/InlineWidget.js';
 import '../../../../../components/IsBrowser/IsBrowser.js';
 import '../../../../../components/Popper/Popper/Popper.js';
 import '../../../../../components/Popper/PopperContext/PopperContext.js';
+import { LinearGradientFrame } from '../../../../../components/LinearGradientFrame/LinearGradientFrame.js';
 import { TokenOption } from './TokenOption/TokenOption.js';
 
 const TokenSelectScreen = ({ onClose, onSelectToken, currentToken, tokens, className, style, }) => {
@@ -103,8 +106,11 @@ const TokenSelectScreen = ({ onClose, onSelectToken, currentToken, tokens, class
             return true;
         return false;
     });
+    const noAssets = tokens.length === 0;
     const closeButton = (jsx(IconButton, { type: 'button', id: 'close-button', "data-testid": 'close-button', onClick: onClose, children: jsx(SvgClose, {}) }));
-    return (jsxs("div", { className: classNames('token-select', className), style: style, "data-testid": 'token-select', children: [jsx(ModalHeader, { trailing: closeButton, children: jsx(Typography, { variant: 'title', children: t('dyn_wallet_funding.from_external_wallet.token_select.title') }) }), jsxs("label", { htmlFor: 'token-select-search', className: 'token-select__search', children: [jsx(Icon, { color: 'text-tertiary', size: 'small', children: jsx(SvgSearch, {}) }), jsx("input", { id: 'token-select-search', placeholder: t('dyn_wallet_funding.from_external_wallet.token_select.search_placeholder'), className: 'token-select__search__input', value: search, onChange: (e) => setSearch(e.target.value) })] }), jsx("div", { className: 'token-select__tokens', children: filteredTokens.map((token) => (jsx(TokenOption, { token: token, isSelected: token.symbol === currentToken, onSelect: () => onSelectToken(token.symbol) }, token.symbol))) })] }));
+    return (jsxs("div", { className: classNames('token-select', className), style: style, "data-testid": 'token-select', children: [jsx(ModalHeader, { trailing: closeButton, children: jsx(Typography, { variant: 'title', children: t(noAssets
+                        ? 'dyn_wallet_funding.from_external_wallet.token_select.no_assets_title'
+                        : 'dyn_wallet_funding.from_external_wallet.token_select.title') }) }), noAssets && (jsxs("div", { className: 'token-select__no-assets', children: [jsx(LinearGradientFrame, { Icon: jsx(SvgWalletIllustration, {}) }), jsx(Typography, { variant: 'title', color: 'secondary', weight: 'medium', children: t('dyn_wallet_funding.from_external_wallet.token_select.no_assets_description') })] })), !noAssets && (jsxs(Fragment, { children: [jsxs("label", { htmlFor: 'token-select-search', className: 'token-select__search', children: [jsx(Icon, { color: 'text-tertiary', size: 'small', children: jsx(SvgSearch, {}) }), jsx("input", { id: 'token-select-search', placeholder: t('dyn_wallet_funding.from_external_wallet.token_select.search_placeholder'), className: 'token-select__search__input', value: search, onChange: (e) => setSearch(e.target.value) })] }), jsx("div", { className: 'token-select__tokens', children: filteredTokens.map((token) => (jsx(TokenOption, { token: token, isSelected: token.symbol === currentToken, onSelect: () => onSelectToken(token.symbol) }, token.symbol))) })] }))] }));
 };
 
 export { TokenSelectScreen };

package/src/lib/widgets/DynamicWidget/views/ReceiveExternalWalletFunds/types.d.ts

@@ -44,7 +44,7 @@ export type ReceiveExternalWalletFundsProps = {
          * The amount to display.
          *
          * The amount is in fiat by default, but if token.rule is set to `exact-with-amount`,
-         * the amount is then in token instead.
+         * the amount then refers to the token instead.
          */
         value: number;
         /**
@@ -75,7 +75,9 @@ export type ReceiveExternalWalletFundsProps = {
     /**
      * Quick suggestions for the amount input.
      *
-     * If an array is passed directly, uses USD as the token.
+     * If an array is passed directly, uses $ (USD) as the token.
+     *
+     * If a token is provided, but doesn't correspond to the selected token, quick suggestions will NOT be shown.
      */
     quickSuggestions?: number[] | {
         token: string;

package/src/lib/widgets/DynamicWidget/views/ReceiveExternalWalletFunds/utils/useTokensForFunding/useTokensForFunding.cjs

@@ -15,7 +15,6 @@ require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../../../../../utils/constants/colors.cjs');
 require('../../../../../../utils/constants/values.cjs');
-require('../../../../../../store/state/loadingAndLifecycle.cjs');
 require('../../../../../../shared/consts/index.cjs');
 require('../../../../../../events/dynamicEvents.cjs');
 require('../../../../../../../../_virtual/_tslib.cjs');
@@ -49,7 +48,9 @@ require('../../../../../../views/CollectUserDataView/useFields.cjs');
 require('../../../../../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
+require('../../../../../../store/state/loadingAndLifecycle.cjs');
 require('../../../../../../store/state/walletOptions/walletOptions.cjs');
+require('@dynamic-labs/ethereum-aa');
 require('react-i18next');
 require('../../../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../../../../components/Alert/Alert.cjs');
@@ -102,12 +103,18 @@ const useTokensForFunding = ({ wallet, }) => {
         includeFiat: true,
         includeNativeBalance: true,
     });
-    const { currency } = useFetchCurrency.useFetchCurrency(wallet.connector, network);
-    const { balance } = useFetchBalance.useFetchBalance({
+    const { currency, isLoading: currencyLoading } = useFetchCurrency.useFetchCurrency(wallet.connector, network);
+    const { balance, isLoading: balanceLoading } = useFetchBalance.useFetchBalance({
         chain: currency === null || currency === void 0 ? void 0 : currency.symbol,
         network,
         wallet,
     });
+    if (tokenBalancesLoading || currencyLoading || balanceLoading) {
+        return {
+            isLoading: true,
+            tokens: [],
+        };
+    }
     const evmNetworks = (_a = wallet.connector.evmNetworks) !== null && _a !== void 0 ? _a : [];
     const solNetworks = (_b = wallet.connector.solNetworks) !== null && _b !== void 0 ? _b : [];
     let parsedTokens = [];
@@ -130,7 +137,10 @@ const useTokensForFunding = ({ wallet, }) => {
         const nativeToken = parsedTokens.find((token) => token.symbol === currency.symbol);
         if (nativeToken) {
             nativeToken.token = 'native';
-            return parsedTokens;
+            return {
+                isLoading: false,
+                tokens: parsedTokens,
+            };
         }
         const logoURI = (_d = (_c = [...evmNetworks, ...solNetworks]) === null || _c === void 0 ? void 0 : _c.find(({ chainId }) => chainId === network)) === null || _d === void 0 ? void 0 : _d.iconUrls[0];
         const fetchedToken = {
@@ -140,9 +150,15 @@ const useTokensForFunding = ({ wallet, }) => {
             symbol: currency.symbol,
             token: 'native',
         };
-        return [...parsedTokens, fetchedToken];
+        return {
+            isLoading: false,
+            tokens: [...parsedTokens, fetchedToken],
+        };
     }
-    return parsedTokens;
+    return {
+        isLoading: false,
+        tokens: parsedTokens,
+    };
 };
 
 exports.useTokensForFunding = useTokensForFunding;

package/src/lib/widgets/DynamicWidget/views/ReceiveExternalWalletFunds/utils/useTokensForFunding/useTokensForFunding.d.ts

@@ -3,5 +3,8 @@ import { FundingTokenData } from '../../types';
 type UseTokensForFundingProps = {
     wallet: Wallet;
 };
-export declare const useTokensForFunding: ({ wallet, }: UseTokensForFundingProps) => FundingTokenData[];
+export declare const useTokensForFunding: ({ wallet, }: UseTokensForFundingProps) => {
+    isLoading: boolean;
+    tokens: FundingTokenData[];
+};
 export {};

package/src/lib/widgets/DynamicWidget/views/ReceiveExternalWalletFunds/utils/useTokensForFunding/useTokensForFunding.js

@@ -11,7 +11,6 @@ import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../../../../../utils/constants/colors.js';
 import '../../../../../../utils/constants/values.js';
-import '../../../../../../store/state/loadingAndLifecycle.js';
 import '../../../../../../shared/consts/index.js';
 import '../../../../../../events/dynamicEvents.js';
 import '../../../../../../../../_virtual/_tslib.js';
@@ -45,7 +44,9 @@ import '../../../../../../views/CollectUserDataView/useFields.js';
 import '../../../../../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
+import '../../../../../../store/state/loadingAndLifecycle.js';
 import '../../../../../../store/state/walletOptions/walletOptions.js';
+import '@dynamic-labs/ethereum-aa';
 import 'react-i18next';
 import '../../../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../../../../components/Alert/Alert.js';
@@ -98,12 +99,18 @@ const useTokensForFunding = ({ wallet, }) => {
         includeFiat: true,
         includeNativeBalance: true,
     });
-    const { currency } = useFetchCurrency(wallet.connector, network);
-    const { balance } = useFetchBalance({
+    const { currency, isLoading: currencyLoading } = useFetchCurrency(wallet.connector, network);
+    const { balance, isLoading: balanceLoading } = useFetchBalance({
         chain: currency === null || currency === void 0 ? void 0 : currency.symbol,
         network,
         wallet,
     });
+    if (tokenBalancesLoading || currencyLoading || balanceLoading) {
+        return {
+            isLoading: true,
+            tokens: [],
+        };
+    }
     const evmNetworks = (_a = wallet.connector.evmNetworks) !== null && _a !== void 0 ? _a : [];
     const solNetworks = (_b = wallet.connector.solNetworks) !== null && _b !== void 0 ? _b : [];
     let parsedTokens = [];
@@ -126,7 +133,10 @@ const useTokensForFunding = ({ wallet, }) => {
         const nativeToken = parsedTokens.find((token) => token.symbol === currency.symbol);
         if (nativeToken) {
             nativeToken.token = 'native';
-            return parsedTokens;
+            return {
+                isLoading: false,
+                tokens: parsedTokens,
+            };
         }
         const logoURI = (_d = (_c = [...evmNetworks, ...solNetworks]) === null || _c === void 0 ? void 0 : _c.find(({ chainId }) => chainId === network)) === null || _d === void 0 ? void 0 : _d.iconUrls[0];
         const fetchedToken = {
@@ -136,9 +146,15 @@ const useTokensForFunding = ({ wallet, }) => {
             symbol: currency.symbol,
             token: 'native',
         };
-        return [...parsedTokens, fetchedToken];
+        return {
+            isLoading: false,
+            tokens: [...parsedTokens, fetchedToken],
+        };
     }
-    return parsedTokens;
+    return {
+        isLoading: false,
+        tokens: parsedTokens,
+    };
 };
 
 export { useTokensForFunding };

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

@@ -35,7 +35,6 @@ require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../../../utils/constants/colors.cjs');
 require('../../../../utils/constants/values.cjs');
-require('../../../../store/state/loadingAndLifecycle.cjs');
 require('../../../../shared/consts/index.cjs');
 require('../../../../events/dynamicEvents.cjs');
 require('../../../../context/CaptchaContext/CaptchaContext.cjs');
@@ -72,7 +71,9 @@ require('../../../../views/CollectUserDataView/useFields.cjs');
 require('../../../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
+require('../../../../store/state/loadingAndLifecycle.cjs');
 require('../../../../store/state/walletOptions/walletOptions.cjs');
+require('@dynamic-labs/ethereum-aa');
 var classNames = require('../../../../utils/functions/classNames/classNames.cjs');
 require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../../components/Alert/Alert.cjs');

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

@@ -31,7 +31,6 @@ import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../../../utils/constants/colors.js';
 import '../../../../utils/constants/values.js';
-import '../../../../store/state/loadingAndLifecycle.js';
 import '../../../../shared/consts/index.js';
 import '../../../../events/dynamicEvents.js';
 import '../../../../context/CaptchaContext/CaptchaContext.js';
@@ -68,7 +67,9 @@ import '../../../../views/CollectUserDataView/useFields.js';
 import '../../../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
+import '../../../../store/state/loadingAndLifecycle.js';
 import '../../../../store/state/walletOptions/walletOptions.js';
+import '@dynamic-labs/ethereum-aa';
 import { classNames } from '../../../../utils/functions/classNames/classNames.js';
 import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../../components/Alert/Alert.js';

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

@@ -19,7 +19,6 @@ require('../../../../context/ViewContext/ViewContext.cjs');
 require('@dynamic-labs/wallet-book');
 require('../../../../utils/constants/colors.cjs');
 require('../../../../utils/constants/values.cjs');
-require('../../../../store/state/loadingAndLifecycle.cjs');
 require('../../../../shared/consts/index.cjs');
 var useInternalDynamicContext = require('../../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.cjs');
 require('../../../../context/CaptchaContext/CaptchaContext.cjs');
@@ -53,7 +52,9 @@ require('../../../../views/CollectUserDataView/useFields.cjs');
 require('../../../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
+require('../../../../store/state/loadingAndLifecycle.cjs');
 require('../../../../store/state/walletOptions/walletOptions.cjs');
+require('@dynamic-labs/ethereum-aa');
 require('react-i18next');
 var Typography = require('../../../../components/Typography/Typography.cjs');
 require('../../../../context/FooterAnimationContext/index.cjs');

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

@@ -15,7 +15,6 @@ import '../../../../context/ViewContext/ViewContext.js';
 import '@dynamic-labs/wallet-book';
 import '../../../../utils/constants/colors.js';
 import '../../../../utils/constants/values.js';
-import '../../../../store/state/loadingAndLifecycle.js';
 import '../../../../shared/consts/index.js';
 import { useInternalDynamicContext } from '../../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.js';
 import '../../../../context/CaptchaContext/CaptchaContext.js';
@@ -49,7 +48,9 @@ import '../../../../views/CollectUserDataView/useFields.js';
 import '../../../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
+import '../../../../store/state/loadingAndLifecycle.js';
 import '../../../../store/state/walletOptions/walletOptions.js';
+import '@dynamic-labs/ethereum-aa';
 import 'react-i18next';
 import { Typography } from '../../../../components/Typography/Typography.js';
 import '../../../../context/FooterAnimationContext/index.js';

package/src/lib/widgets/OnrampWidget/OnrampWidget.cjs

@@ -0,0 +1,105 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+require('@dynamic-labs/utils');
+require('../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
+require('../../components/Alert/Alert.cjs');
+require('../../events/dynamicEvents.cjs');
+require('../../../../_virtual/_tslib.cjs');
+require('../../context/DynamicContext/DynamicContext.cjs');
+require('@dynamic-labs/sdk-api-core');
+require('../../shared/logger.cjs');
+require('@dynamic-labs/iconic');
+require('@dynamic-labs/wallet-connector-core');
+require('../../context/ViewContext/ViewContext.cjs');
+require('@dynamic-labs/wallet-book');
+require('../../utils/constants/colors.cjs');
+require('../../utils/constants/values.cjs');
+var index = require('../../shared/utils/hooks/useOnClickOutside/index.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('../../store/state/projectSettings/projectSettings.cjs');
+require('../../config/ApiEndpoint.cjs');
+require('../../store/state/user/user.cjs');
+require('../../locale/locale.cjs');
+require('../../store/state/dynamicContextProps/dynamicContextProps.cjs');
+require('../../store/state/primaryWalletId/primaryWalletId.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('../../context/ThemeContext/ThemeContext.cjs');
+require('../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
+require('@dynamic-labs/types');
+require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
+require('../../context/LoadingContext/LoadingContext.cjs');
+require('../../context/WalletContext/WalletContext.cjs');
+require('../../utils/hooks/useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.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/loadingAndLifecycle.cjs');
+require('../../store/state/walletOptions/walletOptions.cjs');
+require('@dynamic-labs/ethereum-aa');
+require('react-i18next');
+require('../../context/FooterAnimationContext/index.cjs');
+var ShadowDOM = require('../../components/ShadowDOM/ShadowDOM.cjs');
+require('../../components/Transition/ZoomTransition/ZoomTransition.cjs');
+require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
+var OpacityTransition = require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
+require('../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.cjs');
+require('../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
+require('react-focus-lock');
+require('../DynamicWidget/context/DynamicWidgetContext.cjs');
+require('../../components/IconButton/IconButton.cjs');
+require('../../components/MenuList/Dropdown/Dropdown.cjs');
+require('formik');
+require('../../utils/hooks/useSubdomainCheck/useSubdomainCheck.cjs');
+require('../../store/state/sendBalances.cjs');
+require('../../components/Input/Input.cjs');
+require('../../components/OverlayCard/OverlayCard.cjs');
+require('../../views/TransactionConfirmationView/TransactionConfirmationView.cjs');
+require('../../context/PasskeyContext/PasskeyContext.cjs');
+require('../DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
+var OnrampContext = require('../../context/OnrampContext/OnrampContext.cjs');
+require('qrcode');
+require('../DynamicWidget/views/ReceiveExternalWalletFunds/ReceiveExternalWalletFunds.cjs');
+require('../../../index.cjs');
+require('../../context/IpConfigurationContext/IpConfigurationContext.cjs');
+require('../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
+require('../../context/ConnectWithOtpContext/constants.cjs');
+require('../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+require('@hcaptcha/react-hcaptcha');
+require('../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
+require('../../store/state/tokenBalances.cjs');
+require('../../shared/utils/functions/getInitialUrl/getInitialUrl.cjs');
+require('../../components/InlineWidget/InlineWidget.cjs');
+require('../../components/IsBrowser/IsBrowser.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
+
+const OnrampWidget = () => {
+    const { showOnramp, selectedOnramp, onrampEnabled, setShowOnramp } = OnrampContext.useOnrampContext();
+    const [onrampRef, setOnrampRef] = React.useState(null);
+    index.useOnClickOutside(onrampRef, () => setShowOnramp(false));
+    if (!onrampEnabled || !(selectedOnramp === null || selectedOnramp === void 0 ? void 0 : selectedOnramp.url)) {
+        return null;
+    }
+    return (jsxRuntime.jsx(ShadowDOM.ShadowDOM, { children: jsxRuntime.jsxs(OpacityTransition.OpacityTransition, { isShown: showOnramp, children: [jsxRuntime.jsx("div", { className: 'onramp-widget__backdrop', "aria-hidden": 'true', "data-testid": 'onramp-widget-backdrop' }), jsxRuntime.jsx("div", { className: 'onramp-widget__modal', children: jsxRuntime.jsx("iframe", { id: 'onramp-iframe', src: selectedOnramp.url, allow: 'camera *;geolocation *', title: 'Crypto Onramp', ref: setOnrampRef, "data-testid": 'onramp-widget-modal' }) })] }) }));
+};
+
+exports.OnrampWidget = OnrampWidget;

package/src/lib/widgets/OnrampWidget/OnrampWidget.d.ts

@@ -0,0 +1,2 @@
+import { FC } from 'react';
+export declare const OnrampWidget: FC;

package/src/lib/widgets/OnrampWidget/OnrampWidget.js

@@ -0,0 +1,101 @@
+'use client'
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState } from 'react';
+import '@dynamic-labs/utils';
+import '../../components/Accordion/components/AccordionItem/AccordionItem.js';
+import '../../components/Alert/Alert.js';
+import '../../events/dynamicEvents.js';
+import '../../../../_virtual/_tslib.js';
+import '../../context/DynamicContext/DynamicContext.js';
+import '@dynamic-labs/sdk-api-core';
+import '../../shared/logger.js';
+import '@dynamic-labs/iconic';
+import '@dynamic-labs/wallet-connector-core';
+import '../../context/ViewContext/ViewContext.js';
+import '@dynamic-labs/wallet-book';
+import '../../utils/constants/colors.js';
+import '../../utils/constants/values.js';
+import { useOnClickOutside } from '../../shared/utils/hooks/useOnClickOutside/index.js';
+import '../../shared/consts/index.js';
+import '../../context/CaptchaContext/CaptchaContext.js';
+import '../../context/ErrorContext/ErrorContext.js';
+import '@dynamic-labs/multi-wallet';
+import 'react-international-phone';
+import '../../store/state/nonce/nonce.js';
+import '../../store/state/projectSettings/projectSettings.js';
+import '../../config/ApiEndpoint.js';
+import '../../store/state/user/user.js';
+import '../../locale/locale.js';
+import '../../store/state/dynamicContextProps/dynamicContextProps.js';
+import '../../store/state/primaryWalletId/primaryWalletId.js';
+import '../../context/AccessDeniedContext/AccessDeniedContext.js';
+import '../../context/AccountExistsContext/AccountExistsContext.js';
+import '../../context/UserWalletsContext/UserWalletsContext.js';
+import '../../context/VerificationContext/VerificationContext.js';
+import 'react-dom';
+import '../../utils/functions/compareChains/compareChains.js';
+import '../../context/ThemeContext/ThemeContext.js';
+import '../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
+import '@dynamic-labs/types';
+import '../../context/SocialRedirectContext/SocialRedirectContext.js';
+import '../../context/LoadingContext/LoadingContext.js';
+import '../../context/WalletContext/WalletContext.js';
+import '../../utils/hooks/useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.js';
+import 'yup';
+import '../../context/MockContext/MockContext.js';
+import '../../views/CollectUserDataView/useFields.js';
+import '../../context/FieldsStateContext/FieldsStateContext.js';
+import '../../context/UserFieldEditorContext/UserFieldEditorContext.js';
+import '@dynamic-labs/rpc-providers';
+import '../../store/state/loadingAndLifecycle.js';
+import '../../store/state/walletOptions/walletOptions.js';
+import '@dynamic-labs/ethereum-aa';
+import 'react-i18next';
+import '../../context/FooterAnimationContext/index.js';
+import { ShadowDOM } from '../../components/ShadowDOM/ShadowDOM.js';
+import '../../components/Transition/ZoomTransition/ZoomTransition.js';
+import '../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
+import { OpacityTransition } from '../../components/Transition/OpacityTransition/OpacityTransition.js';
+import '../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.js';
+import '../../context/WalletGroupContext/WalletGroupContext.js';
+import '../DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
+import 'react-focus-lock';
+import '../DynamicWidget/context/DynamicWidgetContext.js';
+import '../../components/IconButton/IconButton.js';
+import '../../components/MenuList/Dropdown/Dropdown.js';
+import 'formik';
+import '../../utils/hooks/useSubdomainCheck/useSubdomainCheck.js';
+import '../../store/state/sendBalances.js';
+import '../../components/Input/Input.js';
+import '../../components/OverlayCard/OverlayCard.js';
+import '../../views/TransactionConfirmationView/TransactionConfirmationView.js';
+import '../../context/PasskeyContext/PasskeyContext.js';
+import '../DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
+import { useOnrampContext } from '../../context/OnrampContext/OnrampContext.js';
+import 'qrcode';
+import '../DynamicWidget/views/ReceiveExternalWalletFunds/ReceiveExternalWalletFunds.js';
+import '../../../index.js';
+import '../../context/IpConfigurationContext/IpConfigurationContext.js';
+import '../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
+import '../../context/ConnectWithOtpContext/constants.js';
+import '../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '@hcaptcha/react-hcaptcha';
+import '../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
+import '../../store/state/tokenBalances.js';
+import '../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
+import '../../components/InlineWidget/InlineWidget.js';
+import '../../components/IsBrowser/IsBrowser.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
+
+const OnrampWidget = () => {
+    const { showOnramp, selectedOnramp, onrampEnabled, setShowOnramp } = useOnrampContext();
+    const [onrampRef, setOnrampRef] = useState(null);
+    useOnClickOutside(onrampRef, () => setShowOnramp(false));
+    if (!onrampEnabled || !(selectedOnramp === null || selectedOnramp === void 0 ? void 0 : selectedOnramp.url)) {
+        return null;
+    }
+    return (jsx(ShadowDOM, { children: jsxs(OpacityTransition, { isShown: showOnramp, children: [jsx("div", { className: 'onramp-widget__backdrop', "aria-hidden": 'true', "data-testid": 'onramp-widget-backdrop' }), jsx("div", { className: 'onramp-widget__modal', children: jsx("iframe", { id: 'onramp-iframe', src: selectedOnramp.url, allow: 'camera *;geolocation *', title: 'Crypto Onramp', ref: setOnrampRef, "data-testid": 'onramp-widget-modal' }) })] }) }));
+};
+
+export { OnrampWidget };

package/src/lib/widgets/OnrampWidget/index.d.ts

@@ -0,0 +1 @@
+export { OnrampWidget } from './OnrampWidget';

package/src/lib/widgets/index.d.ts

@@ -1,5 +1,5 @@
 export * from './DynamicBridgeWidget';
 export * from './DynamicEmbeddedWidget';
 export * from './DynamicWidget';
-export * from './FundingWidget';
+export * from './OnrampWidget';
 export * from './DynamicMultiWalletPromptsWidget';

package/src/lib/shared/utils/hooks/useEffectOnce/index.d.ts

@@ -1 +0,0 @@
-export { useEffectOnce } from './useEffectOnce';

package/src/lib/shared/utils/hooks/useGlobalLoading/index.d.ts

@@ -1 +0,0 @@
-export { useGlobalLoading } from './useGlobalLoading';

package/src/lib/widgets/FundingWidget/FundingWidget.cjs

@@ -1,11 +0,0 @@
-'use client'
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var jsxRuntime = require('react/jsx-runtime');
-var FundWalletView = require('./views/FundWalletView/FundWalletView.cjs');
-
-const FundingWidget = () => jsxRuntime.jsx(FundWalletView.FundWalletView, {});
-
-exports.FundingWidget = FundingWidget;

package/src/lib/widgets/FundingWidget/FundingWidget.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const FundingWidget: () => JSX.Element;

package/src/lib/widgets/FundingWidget/FundingWidget.js

@@ -1,7 +0,0 @@
-'use client'
-import { jsx } from 'react/jsx-runtime';
-import { FundWalletView } from './views/FundWalletView/FundWalletView.js';
-
-const FundingWidget = () => jsx(FundWalletView, {});
-
-export { FundingWidget };

package/src/lib/widgets/FundingWidget/index.d.ts

@@ -1 +0,0 @@
-export { FundingWidget } from './FundingWidget';