@dynamic-labs/sdk-react-core 0.17.0-RC.8 → 0.17.0

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

@@ -4,15 +4,18 @@ import { useState } from 'react';
 import { SocialIcon } from '@dynamic-labs/iconic';
 import { Typography } from '../../../Typography/Typography.js';
 import '@dynamic-labs/sdk-api';
-import '../../../../shared/logger.js';
-import '@dynamic-labs/multi-wallet';
+import { logger } from '../../../../shared/logger.js';
+import '../../../../config/LSSuffix.js';
+import '@dynamic-labs/wallet-connector-core';
 import '../../../../context/ViewContext/ViewContext.js';
 import { ReactComponent as SvgAdd } from '../../../../shared/assets/add.js';
 import { ReactComponent as SvgUnlink } from '../../../../shared/assets/unlink.js';
+import '@dynamic-labs/utils';
 import '../../../../utils/constants/colors.js';
+import 'ethers';
 import '../../../../shared/consts/index.js';
 import { useInternalDynamicContext } from '../../../../context/DynamicContext/useInternalDynamicContext.js';
-import '@dynamic-labs/utils';
+import '@dynamic-labs/multi-wallet';
 import '../../../ShadowDOM/ShadowDOM.js';
 import '../../../../context/ThemeContext/ThemeContext.js';
 import { Icon } from '../../../Icon/Icon.js';
@@ -24,13 +27,19 @@ import '../../../Transition/OpacityTransition/OpacityTransition.js';
 import { unlinkOAuth, verifyOAuth } from '../../../../data/api.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../context/ErrorContext/ErrorContext.js';
-import 'ethers';
+import '../../../../context/AccessDeniedContext/AccessDeniedContext.js';
+import '../../../IconButton/IconButton.js';
+import '@dynamic-labs/wallet-book';
+import { Button } from '../../../Button/Button.js';
+import '../../../Alert/Alert.js';
 import '../../../../context/MockContext/MockContext.js';
 import '../../../../context/CaptchaContext/CaptchaContext.js';
-import '@dynamic-labs/wallet-connector-core';
 import '../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
-import { Button } from '../../../Button/Button.js';
-import '../../../IconButton/IconButton.js';
+import { useIconThemeVariant } from '../../../../utils/hooks/useIconThemeVariant/useIconThemeVariant.js';
+import '../../../Popper/Popper/Popper.js';
+import '../../../Popper/PopperContext/PopperContext.js';
+import 'formik';
+import 'yup';
 import { capitalize } from '../../../../widgets/DynamicWidget/helpers/helpers.js';
 import { useUpdateUserProfileByJWTCallback } from '../../../../utils/hooks/useUpdateUserProfileByJWTCallback/useUpdateUserProfileByJWTCallback.js';
 import { ConnectedAccountAvatar } from './components/ConnectedAccountAvatar/ConnectedAccountAvatar.js';
@@ -70,19 +79,29 @@ const UserProfileSocialAccount = ({ provider, authorizationUrl, verifiedCredenti
     };
     const disconnectAccount = () => __awaiter(void 0, void 0, void 0, function* () {
         var _c;
-        const jwt = yield unlinkOAuth({
-            environmentId,
-            verifiedCrentialId: (_c = verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.id) !== null && _c !== void 0 ? _c : '',
-        }, String(authToken || onboardingOnlyJwt));
-        if (!jwt) {
-            return;
+        try {
+            setLoading(true);
+            const jwt = yield unlinkOAuth({
+                environmentId,
+                verifiedCrentialId: (_c = verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.id) !== null && _c !== void 0 ? _c : '',
+            }, String(authToken || onboardingOnlyJwt));
+            if (!jwt) {
+                return;
+            }
+            updateUserProfileByJWT(jwt);
+        }
+        catch (err) {
+            logger.error(err);
+        }
+        finally {
+            setLoading(false);
         }
-        updateUserProfileByJWT(jwt);
     });
+    const iconThemeVariant = useIconThemeVariant();
     if (!verifiedCredential && !authorizationUrl) {
         return null;
     }
-    return (jsxs("div", Object.assign({ className: 'user-profile-social-account', "data-testid": `social-account-${provider}` }, { children: [jsx("div", Object.assign({ className: 'user-profile-social-account__icon' }, { children: verifiedCredential ? (jsx(ConnectedAccountAvatar, { provider: provider, avatarUrl: (_a = verifiedCredential.oauthAccountPhotos) === null || _a === void 0 ? void 0 : _a[0] })) : (jsx(SocialIcon, { name: provider })) })), jsx("div", Object.assign({ className: 'user-profile-social-account__label' }, { children: jsx(Typography, Object.assign({ weight: 'medium', variant: 'body_normal', color: 'primary' }, { children: (_b = verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.publicIdentifier) !== null && _b !== void 0 ? _b : capitalize(provider) })) })), verifiedCredential ? (jsx(Button, { buttonClassName: 'user-profile-social-account__button', buttonVariant: 'secondary', buttonRounded: 'small', buttonPadding: 'none', onClick: disconnectAccount, loading: loading, dataTestId: 'social-account-disconnect-button', typographyProps: {
+    return (jsxs("div", Object.assign({ className: 'user-profile-social-account', "data-testid": `social-account-${provider}` }, { children: [jsx("div", Object.assign({ className: 'user-profile-social-account__icon' }, { children: verifiedCredential ? (jsx(ConnectedAccountAvatar, { provider: provider, avatarUrl: (_a = verifiedCredential.oauthAccountPhotos) === null || _a === void 0 ? void 0 : _a[0], iconThemeVariant: iconThemeVariant })) : (jsx(SocialIcon, { name: provider, variant: iconThemeVariant })) })), jsx("div", Object.assign({ className: 'user-profile-social-account__label' }, { children: jsx(Typography, Object.assign({ weight: 'medium', variant: 'body_normal', color: 'primary' }, { children: (_b = verifiedCredential === null || verifiedCredential === void 0 ? void 0 : verifiedCredential.publicIdentifier) !== null && _b !== void 0 ? _b : capitalize(provider) })) })), verifiedCredential ? (jsx(Button, { buttonClassName: 'user-profile-social-account__button', buttonVariant: 'secondary', buttonRounded: 'small', buttonPadding: 'none', onClick: disconnectAccount, loading: loading, dataTestId: 'social-account-disconnect-button', typographyProps: {
                     color: 'secondary',
                     variant: 'button_tertiary',
                 }, startSlot: 
@@ -93,7 +112,7 @@ const UserProfileSocialAccount = ({ provider, authorizationUrl, verifiedCredenti
                     weight: 'medium',
                 }, startSlot: 
                 // eslint-disable-next-line react/jsx-wrap-multilines
-                jsx(Icon, Object.assign({ color: 'text-tertiary', size: 'xsmall' }, { children: jsx(SvgAdd, {}) })) }, { children: "Connect" })))] })));
+                jsx(Icon, Object.assign({ color: 'text-tertiary', size: 'small' }, { children: jsx(SvgAdd, {}) })) }, { children: "Connect" })))] })));
 };
 
 export { UserProfileSocialAccount };

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

@@ -6,6 +6,6 @@ var jsxRuntime = require('react/jsx-runtime');
 var iconic = require('@dynamic-labs/iconic');
 var Image = require('../../../../../Image/Image.cjs');
 
-const ConnectedAccountAvatar = ({ provider, avatarUrl, }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", Object.assign({ className: 'user-profile-social-account__connected-avatar' }, { children: jsxRuntime.jsx(Image.Image, { src: avatarUrl, alt: 'User avatar', dataTestId: 'user-avatar', fallback: jsxRuntime.jsx(iconic.UserProfileIcon, {}) }) })), jsxRuntime.jsx("div", Object.assign({ className: 'user-profile-social-account__connected-provider-icon' }, { children: jsxRuntime.jsx(iconic.SocialIcon, { name: provider }) }))] }));
+const ConnectedAccountAvatar = ({ provider, avatarUrl, iconThemeVariant, }) => (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", Object.assign({ className: 'user-profile-social-account__connected-avatar' }, { children: jsxRuntime.jsx(Image.Image, { src: avatarUrl, alt: 'User avatar', dataTestId: 'user-avatar', fallback: jsxRuntime.jsx(iconic.UserProfileIcon, {}) }) })), jsxRuntime.jsx("div", Object.assign({ className: 'user-profile-social-account__connected-provider-icon' }, { children: jsxRuntime.jsx(iconic.SocialIcon, { name: provider, variant: iconThemeVariant }) }))] }));
 
 exports.ConnectedAccountAvatar = ConnectedAccountAvatar;

package/src/lib/components/UserProfile/parts/UserProfileSocialAccount/components/ConnectedAccountAvatar/ConnectedAccountAvatar.d.ts

@@ -1,7 +1,9 @@
 import { FC } from 'react';
 import { ProviderEnum } from '@dynamic-labs/sdk-api';
+import { IconThemeVariant } from '../../../../../../utils/hooks';
 export type ConnectedAccountAvatarProps = {
     avatarUrl?: string;
     provider: ProviderEnum;
+    iconThemeVariant?: IconThemeVariant;
 };
 export declare const ConnectedAccountAvatar: FC<ConnectedAccountAvatarProps>;

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

@@ -2,6 +2,6 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { UserProfileIcon, SocialIcon } from '@dynamic-labs/iconic';
 import { Image } from '../../../../../Image/Image.js';
 
-const ConnectedAccountAvatar = ({ provider, avatarUrl, }) => (jsxs(Fragment, { children: [jsx("div", Object.assign({ className: 'user-profile-social-account__connected-avatar' }, { children: jsx(Image, { src: avatarUrl, alt: 'User avatar', dataTestId: 'user-avatar', fallback: jsx(UserProfileIcon, {}) }) })), jsx("div", Object.assign({ className: 'user-profile-social-account__connected-provider-icon' }, { children: jsx(SocialIcon, { name: provider }) }))] }));
+const ConnectedAccountAvatar = ({ provider, avatarUrl, iconThemeVariant, }) => (jsxs(Fragment, { children: [jsx("div", Object.assign({ className: 'user-profile-social-account__connected-avatar' }, { children: jsx(Image, { src: avatarUrl, alt: 'User avatar', dataTestId: 'user-avatar', fallback: jsx(UserProfileIcon, {}) }) })), jsx("div", Object.assign({ className: 'user-profile-social-account__connected-provider-icon' }, { children: jsx(SocialIcon, { name: provider, variant: iconThemeVariant }) }))] }));
 
 export { ConnectedAccountAvatar };

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

@@ -34,3 +34,12 @@ export * from './ModalHeaderBanner';
 export * from './OTPVerificationView';
 export * from './IconListTile';
 export * from './Transition';
+export * from './Popper';
+export * from './TransactionConfirmationPageLayout';
+export * from './SendBalancePageLayout';
+export * from './Chip';
+export * from './FormFieldLabel';
+export * from './Step';
+export * from './Stepper';
+export * from './Modal';
+export * from './ModalCard';

package/src/lib/config/LSSuffix.cjs

@@ -0,0 +1,24 @@
+'use strict';
+
+/* eslint-disable no-underscore-dangle */
+class LSSuffix {
+}
+LSSuffix.getSuffix = () => {
+    if (!LSSuffix.__defined__) {
+        return '';
+    }
+    return LSSuffix.__suffix__;
+};
+LSSuffix.setSuffix = (localStorageSuffix) => {
+    const suffixInput = (localStorageSuffix && `_${localStorageSuffix}`) || '';
+    if (!LSSuffix.__defined__) {
+        LSSuffix.__suffix__ = suffixInput;
+        LSSuffix.__defined__ = true;
+    }
+    else if (LSSuffix.__suffix__ !== suffixInput) {
+        throw new Error(`LSSuffix suffix is already set to ${LSSuffix.__suffix__}, cannot change it to ${suffixInput}`);
+    }
+    Object.freeze(LSSuffix);
+};
+
+module.exports = LSSuffix;

package/src/lib/config/LSSuffix.d.ts

@@ -0,0 +1,7 @@
+declare class LSSuffix {
+    private static __suffix__;
+    private static __defined__;
+    static getSuffix: () => string | undefined;
+    static setSuffix: (localStorageSuffix?: string) => void;
+}
+export default LSSuffix;

package/src/lib/config/LSSuffix.js

@@ -0,0 +1,22 @@
+/* eslint-disable no-underscore-dangle */
+class LSSuffix {
+}
+LSSuffix.getSuffix = () => {
+    if (!LSSuffix.__defined__) {
+        return '';
+    }
+    return LSSuffix.__suffix__;
+};
+LSSuffix.setSuffix = (localStorageSuffix) => {
+    const suffixInput = (localStorageSuffix && `_${localStorageSuffix}`) || '';
+    if (!LSSuffix.__defined__) {
+        LSSuffix.__suffix__ = suffixInput;
+        LSSuffix.__defined__ = true;
+    }
+    else if (LSSuffix.__suffix__ !== suffixInput) {
+        throw new Error(`LSSuffix suffix is already set to ${LSSuffix.__suffix__}, cannot change it to ${suffixInput}`);
+    }
+    Object.freeze(LSSuffix);
+};
+
+export { LSSuffix as default };

package/src/lib/context/AccessDeniedContext/AccessDeniedContext.cjs

@@ -0,0 +1,30 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+
+const AccessDeniedContext = React.createContext(undefined);
+const AccessDeniedContextProvider = ({ children, }) => {
+    const [deniedAddress, setDeniedAddress] = React.useState('');
+    const [deniedOauthProvider, setDeniedOauthProvider] = React.useState(undefined);
+    const value = React.useMemo(() => ({
+        deniedAddress,
+        deniedOauthProvider,
+        setDeniedAddress,
+        setDeniedOauthProvider,
+    }), [deniedAddress, deniedOauthProvider]);
+    return (jsxRuntime.jsx(AccessDeniedContext.Provider, Object.assign({ value: value }, { children: children })));
+};
+const useAccessDeniedContext = () => {
+    const context = React.useContext(AccessDeniedContext);
+    if (context === undefined) {
+        throw new Error('usage of useAccessDeniedContext not wrapped in `AccessDeniedContextProvider`.');
+    }
+    return context;
+};
+
+exports.AccessDeniedContext = AccessDeniedContext;
+exports.AccessDeniedContextProvider = AccessDeniedContextProvider;
+exports.useAccessDeniedContext = useAccessDeniedContext;

package/src/lib/context/AccessDeniedContext/AccessDeniedContext.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from 'react';
+import { ProviderEnum } from '@dynamic-labs/sdk-api';
+export type AccessDeniedContextType = {
+    deniedAddress: string;
+    setDeniedAddress(address: string): void;
+    setDeniedOauthProvider(deniedOauthProvider: ProviderEnum | undefined): void;
+    deniedOauthProvider: ProviderEnum | undefined;
+};
+export declare const AccessDeniedContext: import("react").Context<AccessDeniedContextType | undefined>;
+export declare const AccessDeniedContextProvider: ({ children, }: {
+    children: ReactNode;
+}) => JSX.Element;
+export declare const useAccessDeniedContext: () => AccessDeniedContextType;

package/src/lib/context/AccessDeniedContext/AccessDeniedContext.js

@@ -0,0 +1,24 @@
+import { jsx } from 'react/jsx-runtime';
+import { createContext, useState, useMemo, useContext } from 'react';
+
+const AccessDeniedContext = createContext(undefined);
+const AccessDeniedContextProvider = ({ children, }) => {
+    const [deniedAddress, setDeniedAddress] = useState('');
+    const [deniedOauthProvider, setDeniedOauthProvider] = useState(undefined);
+    const value = useMemo(() => ({
+        deniedAddress,
+        deniedOauthProvider,
+        setDeniedAddress,
+        setDeniedOauthProvider,
+    }), [deniedAddress, deniedOauthProvider]);
+    return (jsx(AccessDeniedContext.Provider, Object.assign({ value: value }, { children: children })));
+};
+const useAccessDeniedContext = () => {
+    const context = useContext(AccessDeniedContext);
+    if (context === undefined) {
+        throw new Error('usage of useAccessDeniedContext not wrapped in `AccessDeniedContextProvider`.');
+    }
+    return context;
+};
+
+export { AccessDeniedContext, AccessDeniedContextProvider, useAccessDeniedContext };

package/src/lib/context/AccessDeniedContext/index.d.ts

@@ -0,0 +1 @@
+export * from './AccessDeniedContext';

package/src/lib/context/DynamicContext/DynamicContext.cjs

@@ -7,36 +7,42 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
 var iconic = require('@dynamic-labs/iconic');
-var localStorage$1 = require('../../utils/constants/localStorage.cjs');
+var localStorage = require('../../utils/constants/localStorage.cjs');
 require('../../utils/constants/colors.cjs');
 var values = require('../../utils/constants/values.cjs');
 var decodeJwt = require('../../shared/utils/functions/decodeJwt/decodeJwt.cjs');
-var logger = require('../../shared/logger.cjs');
-require('@dynamic-labs/multi-wallet');
+var getFromLS = require('../../shared/utils/functions/storage/getFromLS.cjs');
+var LSSuffix = require('../../config/LSSuffix.cjs');
+var removeFromLS = require('../../shared/utils/functions/storage/removeFromLS.cjs');
 var ViewContext = require('../ViewContext/ViewContext.cjs');
+var logger = require('../../shared/logger.cjs');
+require('@dynamic-labs/utils');
+require('ethers');
 var useLocalStorage = require('../../shared/utils/hooks/useLocalStorage/useLocalStorage.cjs');
+var useGlobalLoading = require('../../shared/utils/hooks/useGlobalLoading/useGlobalLoading.cjs');
 require('../../shared/consts/index.cjs');
 var useFetchProjectSettings = require('../../utils/hooks/useFetchProjectSettings/useFetchProjectSettings.cjs');
 var useFetchNonce = require('../../utils/hooks/useFetchNonce/useFetchNonce.cjs');
 var useWallets = require('../../utils/hooks/useWallets/useWallets.cjs');
 var useWalletConnectors = require('../../utils/hooks/useWalletConnectors/useWalletConnectors.cjs');
-require('@dynamic-labs/utils');
 var api = require('../../data/api.cjs');
+require('@dynamic-labs/multi-wallet');
 var getAuthToken = require('../../utils/functions/getAuthToken/getAuthToken.cjs');
 require('@dynamic-labs/sdk-api');
 var ErrorContext = require('../ErrorContext/ErrorContext.cjs');
+var AccessDeniedContext = require('../AccessDeniedContext/AccessDeniedContext.cjs');
 require('react-dom');
 var useWalletUiUtils = require('../../utils/hooks/useWalletUiUtils/useWalletUiUtils.cjs');
 require('../MockContext/MockContext.cjs');
 var CaptchaContext = require('../CaptchaContext/CaptchaContext.cjs');
 require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
-var ApiEndpoint = require('../../config/ApiEndpoint.cjs');
 var ThemeContext = require('../ThemeContext/ThemeContext.cjs');
+var ApiEndpoint = require('../../config/ApiEndpoint.cjs');
 var useFetchNetworkConfigurations = require('../../utils/hooks/useFetchNetworkConfigurations/useFetchNetworkConfigurations.cjs');
 var useMultiWalletWidgetState = require('../../utils/hooks/multiWallet/useMultiWalletWidgetState/useMultiWalletWidgetState.cjs');
+var useSyncPrimaryWallet = require('../../utils/hooks/multiWallet/useSyncPrimaryWallet/useSyncPrimaryWallet.cjs');
 var useWalletEventListeners = require('../../utils/hooks/useWalletEventListeners/useWalletEventListeners.cjs');
 var LoadingContext = require('../LoadingContext/LoadingContext.cjs');
-var useSyncPrimaryWallet = require('../../utils/hooks/multiWallet/useSyncPrimaryWallet/useSyncPrimaryWallet.cjs');
 var useFetchWalletsForChainsMap = require('../../utils/hooks/useFetchWalletsForChainsMap/useFetchWalletsForChainsMap.cjs');
 var useHandleUnlinkWallet = require('../../utils/hooks/useHandleUnlinkWallet/useHandleUnlinkWallet.cjs');
 var app = require('../../app.cjs');
@@ -55,16 +61,22 @@ require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs
 require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 require('../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../components/IconButton/IconButton.cjs');
-var useGlobalLoading = require('../../shared/utils/hooks/useGlobalLoading/useGlobalLoading.cjs');
-var FundingContext = require('../FundingContext/FundingContext.cjs');
+require('../../components/Alert/Alert.cjs');
 require('@dynamic-labs/wallet-book');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
+require('formik');
+require('yup');
+var FundingContext = require('../FundingContext/FundingContext.cjs');
+require('../../widgets/DynamicWidget/components/DynamicWidgetCard/DynamicWidgetCard.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('qrcode');
 require('../../views/CollectUserDataView/fieldsConfig.cjs');
 require('../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
-require('formik');
-require('yup');
 var FundingWidget = require('../../widgets/FundingWidget/FundingWidget.cjs');
+var DynamicBridgeWidgetContext = require('../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.cjs');
+require('../../widgets/DynamicBridgeWidget/components/DynamicBridgeWidgetViews/DynamicBridgeWidgetViews.cjs');
+var SendBalanceContext = require('../SendBalanceContext/SendBalanceContext.cjs');
 var helpers = require('./helpers.cjs');
 var validators = require('./validators.cjs');
 var useCustomerCallbacks = require('./useCustomerCallbacks/useCustomerCallbacks.cjs');
@@ -72,27 +84,34 @@ var useCustomerAuthFlowCallbacks = require('./useCustomerCallbacks/useCustomerAu
 var useEmailLoginState = require('./hooks/useEmailLoginState/useEmailLoginState.cjs');
 var useDisplayOrderState = require('./hooks/useDisplayOrderState/useDisplayOrderState.cjs');
 var useNameService = require('./hooks/useNameService/useNameService.cjs');
+var useSetShowAuthFlowWithInit = require('./hooks/useSetShowAuthFlowWithInit/useSetShowAuthFlowWithInit.cjs');
 
 const EMPTY_INITIAL_USER = undefined;
 const DynamicContext = React.createContext(undefined);
-const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, accessDeniedMessageSecondary, apiBaseUrl, appLogoUrl = 'https://demo.dynamic.xyz/assets/dynamic-logo.svg', appName = 'Dynamic Example', cssOverrides, defaultNumberOfWalletsToShow = values.DEFAULT_NUMBER_OF_WALLETS_TO_SHOW, initialAuthenticationMode = 'connect-and-sign', debugError = false, displayTermsOfService = true, newToWeb3WalletChainMap, enableVisitTrackingOnConnectOnly = true, environmentId, eventsCallbacks, evmNetworks, walletsFilter, logLevel = 'WARN', multiWallet = false, notInTheListImageUrl, onboardingImageUrl, policiesConsentInnerComponent, privacyPolicyUrl, signWithEmailWalletName, socialMediaLinkText, socialMediaIconUrl, socialMediaUrl, termsOfServiceUrl, toolkitEnabled, siweStatement, shadowDOMEnabled = true, }, children, theme, }) => {
-    var _a, _b, _c;
+const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, accessDeniedMessageSecondary, accessDeniedButton, apiBaseUrl, appLogoUrl = 'https://demo.dynamic.xyz/assets/dynamic-logo.svg', appName = 'Dynamic Example', cssOverrides, defaultNumberOfWalletsToShow = values.DEFAULT_NUMBER_OF_WALLETS_TO_SHOW, flowNetwork, initialAuthenticationMode = 'connect-and-sign', debugError = false, displayTermsOfService = true, newToWeb3WalletChainMap, enableVisitTrackingOnConnectOnly = true, environmentId, localStorageSuffix, eventsCallbacks, evmNetworks, walletsFilter, logLevel = 'WARN', multiWallet: deprecatedMultiWallet, notInTheListImageUrl, onboardingImageUrl, policiesConsentInnerComponent, privacyPolicyUrl, signWithEmailWalletName, socialMediaLinkText, socialMediaIconUrl, socialMediaUrl, termsOfServiceUrl, toolkitEnabled, siweStatement, shadowDOMEnabled = true, walletConnectors: walletConnectorsProp, }, children, theme, }) => {
+    var _a, _b, _c, _d, _e;
     logger.logger.setLogLevel(logLevel);
     walletConnectorCore.logger.setLogLevel(logLevel);
     ApiEndpoint.setBaseUrl((_a = process.env.DYNAMIC_API_BASE_URL) !== null && _a !== void 0 ? _a : apiBaseUrl);
+    LSSuffix.setSuffix(localStorageSuffix);
     const isAuthenticated = Boolean(getAuthToken.getAuthToken());
     const [onboardingOnlyJwt, setOnboardingOnlyJwt] = React.useState(undefined);
     const [showAuthFlow, setShowAuthFlow] = React.useState(false);
     // Allows clients to control widget flow without need to click on AccountControl
     const [showDynamicUserProfile, setShowDynamicUserProfile] = React.useState(false);
+    // Alows clients to control the Bridget Widget flow without need to click on Bridge Widget
+    const [showBridgeWidget, setShowBridgeWidget] = React.useState(false);
     const [isSingleWalletAccount, setIsSingleWalletAccount] = React.useState(false);
-    const [user, setUser, removeUser] = useLocalStorage.useLocalStorage(localStorage$1.AUTH_USER, EMPTY_INITIAL_USER, validators.validateAuthUser, [localStorage$1.AUTH_TOKEN]);
+    const [user, setUser, removeUser] = useLocalStorage.useLocalStorage(localStorage.AUTH_USER, EMPTY_INITIAL_USER, validators.validateAuthUser, [localStorage.AUTH_TOKEN]);
     const { consumeNonce } = useFetchNonce.useFetchNonce(environmentId);
     const [qrcodeUri, setQrcodeUri] = React.useState('');
     const [desktopUri, setDesktopUri] = React.useState('');
     const [multiWalletWidgetState, setMultiWalletWidgetState, { awaiting_account_switch: [accountSwitchState], awaiting_signature: [awaitingSignatureState], },] = useMultiWalletWidgetState.useMultiWalletWidgetState();
     const [isVerifying, setIsVerifying] = React.useState(false);
     const { projectSettings, isLoading: isProjectSettingsLoading } = useFetchProjectSettings.useFetchProjectSettings({ authToken: getAuthToken.getAuthToken(), environmentId });
+    const multiWallet = (_c = deprecatedMultiWallet !== null && deprecatedMultiWallet !== void 0 ? deprecatedMultiWallet : (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.multiWallet) !== null && _c !== void 0 ? _c : false;
+    // ensures that when user comes back to site and primary wallet is out of sync, we don't show widget popup
+    const [showWidgetStatePopup, setShowWidgetStatePopup] = React.useState(!multiWallet);
     const { configurations: serverNetworkConfigurations, handleRemoveLsNetworks, } = useFetchNetworkConfigurations.useFetchNetworkConfigurations({
         authToken: getAuthToken.getAuthToken(),
         environmentId,
@@ -111,18 +130,22 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
     const { wallets } = useWallets.useWallets({
         appLogoUrl,
         appName,
+        flowNetwork,
         networkConfigurations: serverNetworkConfigurations,
         projectSettings,
+        walletConnectorsProp,
         walletUiUtils,
     });
-    const [authMode, setAuthMode] = useLocalStorage.useLocalStorage(localStorage$1.AUTH_MODE, initialAuthenticationMode);
+    const [authMode, setAuthMode] = useLocalStorage.useLocalStorage(localStorage.AUTH_MODE, initialAuthenticationMode);
     const { connectWallet, removeConnectedInfo, connectedInfo, connectedWallet, setConnectedWallet, connectWalletByAddressAndChain, } = useConnectWallet.useConnectWallet(wallets, authMode, environmentId, enableVisitTrackingOnConnectOnly);
     const [selectedWalletConnector, setSelectedWalletConnector] = React.useState(null);
+    //selected wallet to perform an action (become primary, unlink, etc)
+    const [selectedWalletWithAction, setSelectedWalletWithAction] = React.useState(null);
     const removeAuthTokenAndUser = React.useCallback(() => {
-        localStorage.removeItem(localStorage$1.AUTH_TOKEN);
+        removeFromLS.removeFromLS(localStorage.AUTH_TOKEN);
         removeUser();
     }, [removeUser]);
-    const { clearWalletStates, computeConnectedStateForWallets, walletConnectors, primaryWallet, primaryWalletId, showQrcodeModal, secondaryWallets, setPrimaryWallet, setPrimaryWalletId, setShowQrcodeModal, } = useWalletConnectors.useWalletConnectors({
+    const { clearPrimaryWalletId, computeConnectedStateForWallets, didConnectedStateLoad, walletConnectors, primaryWallet, primaryWalletId, showQrcodeModal, secondaryWallets, setPrimaryWallet, setPrimaryWalletId, setShowQrcodeModal, } = useWalletConnectors.useWalletConnectors({
         authToken: getAuthToken.getAuthToken() || onboardingOnlyJwt,
         multiWalletWidgetState,
         setDesktopUri,
@@ -138,16 +161,15 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         projectSettings,
         user,
     });
+    const setShowAuthFlowWithInit = useSetShowAuthFlowWithInit.useSetShowAuthFlowWithInit({
+        setShowAuthFlow,
+        wallets,
+    });
     const { getNameService, removeConnectedNameService } = useNameService.useNameService({
-        authToken: (_b = getAuthToken.getAuthToken()) !== null && _b !== void 0 ? _b : onboardingOnlyJwt,
+        authToken: (_d = getAuthToken.getAuthToken()) !== null && _d !== void 0 ? _d : onboardingOnlyJwt,
         currentWallet: primaryWallet !== null && primaryWallet !== void 0 ? primaryWallet : connectedWallet,
     });
     const walletForUserFacingContext = authMode === 'connect-and-sign' || user ? primaryWallet : connectedWallet;
-    useSyncPrimaryWallet.useSyncPrimaryWallet({
-        multiWalletWidgetState,
-        primaryWallet,
-        setMultiWalletWidgetState,
-    });
     const { clearAllWalletConnectSessions, clearOphanedWalletConnectSessions } = useClearWalletConnectSessions.useClearWalletConnectSessions({
         connectors: walletConnectors,
     });
@@ -155,7 +177,7 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         clearOphanedWalletConnectSessions,
     ]);
     const handleLogOut = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        var _d, _e;
+        var _f, _g;
         clearAllWalletConnectSessions();
         const jwt = getAuthToken.getAuthToken();
         if (jwt && user) {
@@ -165,7 +187,7 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         for (const connector of walletConnectors) {
             yield connector.endSession();
         }
-        (_d = connectedWallet === null || connectedWallet === void 0 ? void 0 : connectedWallet.connector) === null || _d === void 0 ? void 0 : _d.endSession();
+        (_f = connectedWallet === null || connectedWallet === void 0 ? void 0 : connectedWallet.connector) === null || _f === void 0 ? void 0 : _f.endSession();
         setShowAuthFlow(false);
         setMultiWalletWidgetState('idle');
         removeAuthTokenAndUser();
@@ -173,9 +195,9 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         handleRemoveLsNetworks();
         setOnboardingOnlyJwt(undefined);
         removeConnectedInfo();
-        clearWalletStates();
+        clearPrimaryWalletId();
         removeConnectedNameService();
-        (_e = eventsCallbacks === null || eventsCallbacks === void 0 ? void 0 : eventsCallbacks.onLogout) === null || _e === void 0 ? void 0 : _e.call(eventsCallbacks, user);
+        (_g = eventsCallbacks === null || eventsCallbacks === void 0 ? void 0 : eventsCallbacks.onLogout) === null || _g === void 0 ? void 0 : _g.call(eventsCallbacks, user);
     }), [
         clearAllWalletConnectSessions,
         user,
@@ -186,11 +208,23 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         handleRemoveLsNetworks,
         removeConnectedInfo,
         removeConnectedNameService,
-        clearWalletStates,
+        clearPrimaryWalletId,
         eventsCallbacks,
         environmentId,
         walletConnectors,
     ]);
+    useSyncPrimaryWallet.useSyncPrimaryWallet({
+        canSync: didConnectedStateLoad,
+        computeConnectedStateForWallets,
+        handleLogOut,
+        multiWalletWidgetState,
+        primaryWallet,
+        secondaryWallets,
+        setMultiWalletWidgetState,
+        setPrimaryWallet,
+        setShowWidgetStatePopup,
+        showWidgetStatePopup,
+    });
     const handleUnlinkWallet = useHandleUnlinkWallet.useHandleUnlinkWallet({
         environmentId,
         primaryWalletId,
@@ -207,9 +241,11 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         primaryWallet: walletForUserFacingContext,
         secondaryWallets,
         selectedWalletConnector,
+        selectedWalletWithAction,
         setMultiWalletWidgetState,
         setPrimaryWalletId,
         setSelectedWalletConnector,
+        setSelectedWalletWithAction,
         user,
     });
     const { walletsForChainsMap } = useFetchWalletsForChainsMap.useFetchWalletsForChainsMap(newToWeb3WalletChainMap);
@@ -245,8 +281,8 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
             setConnectedWallet(null);
             removeConnectedInfo();
         }
-        if (!localStorage.getItem(localStorage$1.AUTH_USER)) {
-            localStorage.removeItem(localStorage$1.AUTH_TOKEN);
+        if (!getFromLS.getFromLS(localStorage.AUTH_USER)) {
+            removeFromLS.removeFromLS(localStorage.AUTH_TOKEN);
         }
         if (selectedWalletConnector &&
             (!primaryWallet ||
@@ -266,6 +302,7 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
     const value = React.useMemo(() => {
         var _a, _b;
         return ({
+            accessDeniedButton,
             accessDeniedMessagePrimary,
             accessDeniedMessageSecondary,
             accountSwitchState,
@@ -319,6 +356,7 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
             sdkHasLoaded,
             secondaryWallets,
             selectedWalletConnector,
+            selectedWalletWithAction,
             setAuthMode,
             setAuthorizationViewDisplayOrder,
             setCallback,
@@ -334,14 +372,19 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
             setQrcodeUri,
             setSdkHasLoaded,
             setSelectedWalletConnector,
-            setShowAuthFlow,
+            setSelectedWalletWithAction,
+            setShowAuthFlow: setShowAuthFlowWithInit,
+            setShowBridgeWidget,
             setShowDynamicUserProfile,
             setShowQrcodeModal,
+            setShowWidgetStatePopup,
             setUser,
             shadowDOMEnabled,
             showAuthFlow,
+            showBridgeWidget,
             showDynamicUserProfile,
             showQrcodeModal,
+            showWidgetStatePopup,
             signWithEmailWalletName,
             siweStatement,
             socialMediaIconUrl: ((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general) === null || _a === void 0 ? void 0 : _a.supportUrls) || socialMediaIconUrl,
@@ -359,6 +402,7 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
     }, [
         accessDeniedMessagePrimary,
         accessDeniedMessageSecondary,
+        accessDeniedButton,
         accountSwitchState,
         appLogoUrl,
         appName,
@@ -407,6 +451,7 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         rpcProviders,
         sdkHasLoaded,
         selectedWalletConnector,
+        selectedWalletWithAction,
         setAuthMode,
         setAuthorizationViewDisplayOrder,
         setCallback,
@@ -416,12 +461,14 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         setPrimaryWallet,
         setPrimaryWalletId,
         setSdkHasLoaded,
+        setShowAuthFlowWithInit,
         setShowQrcodeModal,
         setUser,
         shadowDOMEnabled,
         showAuthFlow,
         showDynamicUserProfile,
         showQrcodeModal,
+        showWidgetStatePopup,
         signWithEmailWalletName,
         siweStatement,
         socialMediaIconUrl,
@@ -455,14 +502,15 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
     // DYN-1140 - Opens Widget when multiWalletWidgetState changes
     React.useEffect(() => {
         // If statement to secure SingleWallet widget
-        if (!multiWallet)
+        if (!multiWallet && multiWalletWidgetState !== 'awaiting_account_switch') {
             return;
+        }
         // We need to make sure that the user is logged in so that we do not try to display the widget before authorization
         if (user && multiWalletWidgetState !== 'idle' && !showDynamicUserProfile) {
             setShowDynamicUserProfile(true);
         }
     }, [multiWallet, multiWalletWidgetState, showDynamicUserProfile, user]);
-    return (jsxRuntime.jsx(DynamicContext.Provider, Object.assign({ value: value }, { children: jsxRuntime.jsx(ThemeContext.ThemeContextProvider, Object.assign({ customerTheme: parseTheme.parseTheme(theme, ((_c = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.design) === null || _c === void 0 ? void 0 : _c.modal) || undefined), designSettings: projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.design }, { children: jsxRuntime.jsx(LoadingContext.LoadingContextProvider, { children: jsxRuntime.jsx(ViewContext.ViewContextProvider, Object.assign({ loginWithEmail: loginWithEmail }, { children: jsxRuntime.jsx(QrCodeContext.QrCodeContextProvider, { children: jsxRuntime.jsx(EmailVerificationContext.EmailVerificationContextProvider, { children: jsxRuntime.jsx(ErrorContext.ErrorContextProvider, { children: jsxRuntime.jsx(DynamicWidgetContext.DynamicWidgetContextProvider, { children: jsxRuntime.jsx(CaptchaContext.CaptchaContextProvider, { children: jsxRuntime.jsxs(FundingContext.FundingContextProvider, { children: [jsxRuntime.jsx(app.DynamicAuthFlow, {}), jsxRuntime.jsx(Toolkit.Toolkit, {}), jsxRuntime.jsx(FundingWidget.FundingWidget, {}), confirmationModal, children] }) }) }) }) }) }) })) }) })) })));
+    return (jsxRuntime.jsx(DynamicContext.Provider, Object.assign({ value: value }, { children: jsxRuntime.jsx(ThemeContext.ThemeContextProvider, Object.assign({ customerTheme: parseTheme.parseTheme(theme, ((_e = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.design) === null || _e === void 0 ? void 0 : _e.modal) || undefined), designSettings: projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.design }, { children: jsxRuntime.jsx(LoadingContext.LoadingContextProvider, { children: jsxRuntime.jsx(ViewContext.ViewContextProvider, Object.assign({ initialView: loginWithEmail ? 'login-with-email-or-wallet' : 'wallet-list' }, { children: jsxRuntime.jsx(QrCodeContext.QrCodeContextProvider, { children: jsxRuntime.jsx(EmailVerificationContext.EmailVerificationContextProvider, { children: jsxRuntime.jsx(ErrorContext.ErrorContextProvider, { children: jsxRuntime.jsx(DynamicWidgetContext.DynamicWidgetContextProvider, { children: jsxRuntime.jsx(DynamicBridgeWidgetContext.DynamicBridgeWidgetContextProvider, { children: jsxRuntime.jsx(CaptchaContext.CaptchaContextProvider, { children: jsxRuntime.jsx(FundingContext.FundingContextProvider, { children: jsxRuntime.jsx(AccessDeniedContext.AccessDeniedContextProvider, { children: jsxRuntime.jsxs(SendBalanceContext.SendBalanceContextProvider, { children: [jsxRuntime.jsx(app.DynamicAuthFlow, {}), jsxRuntime.jsx(Toolkit.Toolkit, {}), jsxRuntime.jsx(FundingWidget.FundingWidget, {}), confirmationModal, children] }) }) }) }) }) }) }) }) }) })) }) })) })));
 };
 
 exports.DynamicContext = DynamicContext;