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

package/CHANGELOG.md

@@ -1,4 +1,46 @@
 
+## [0.18.0-RC.8](https://github.com/dynamic-labs/DynamicAuth/compare/v0.18.0-RC.7...v0.18.0-RC.8) (2023-06-29)
+
+
+### Features
+
+* add support for custom walletconnect v1 bridge ([#2487](https://github.com/dynamic-labs/DynamicAuth/issues/2487)) ([5b0ca2e](https://github.com/dynamic-labs/DynamicAuth/commit/5b0ca2e4e8aa241ed13e4f38346c31da8479a6c4))
+* **DYN-2623:** improve error message on sign cancellation for wallets ([#2493](https://github.com/dynamic-labs/DynamicAuth/issues/2493)) ([081c515](https://github.com/dynamic-labs/DynamicAuth/commit/081c515c9d28d6fa4c0eaac388ee421a7b23144b))
+
+
+### Bug Fixes
+
+* clearing the activeAccount value ([#2469](https://github.com/dynamic-labs/DynamicAuth/issues/2469)) ([ff75bde](https://github.com/dynamic-labs/DynamicAuth/commit/ff75bde938a4178541568b79754f773607b9d87f))
+* don't initialize provider if it's already initialized ([#2490](https://github.com/dynamic-labs/DynamicAuth/issues/2490)) ([878d38f](https://github.com/dynamic-labs/DynamicAuth/commit/878d38f5c8d7d7448c65e58b25cefd9f3518217e))
+* more wcv2 improvements ([#2475](https://github.com/dynamic-labs/DynamicAuth/issues/2475)) ([13baa84](https://github.com/dynamic-labs/DynamicAuth/commit/13baa84218d6259d02df7d8c387b40dc3cb11ce5)), closes [#2469](https://github.com/dynamic-labs/DynamicAuth/issues/2469) [#2470](https://github.com/dynamic-labs/DynamicAuth/issues/2470) [#2471](https://github.com/dynamic-labs/DynamicAuth/issues/2471) [#2477](https://github.com/dynamic-labs/DynamicAuth/issues/2477) [#2479](https://github.com/dynamic-labs/DynamicAuth/issues/2479) [#2471](https://github.com/dynamic-labs/DynamicAuth/issues/2471) [#2476](https://github.com/dynamic-labs/DynamicAuth/issues/2476)
+* multiple improvements for WC2 ([#2458](https://github.com/dynamic-labs/DynamicAuth/issues/2458)) ([0813af2](https://github.com/dynamic-labs/DynamicAuth/commit/0813af2aafa8019868117084efe8ae147ac24581))
+* revert changes since latest wcv2 improvements ([#2473](https://github.com/dynamic-labs/DynamicAuth/issues/2473)) ([3375371](https://github.com/dynamic-labs/DynamicAuth/commit/337537101a13d67b860748b62f172eba01d0b461)), closes [#2471](https://github.com/dynamic-labs/DynamicAuth/issues/2471) [#2470](https://github.com/dynamic-labs/DynamicAuth/issues/2470) [#2469](https://github.com/dynamic-labs/DynamicAuth/issues/2469)
+* sync issue within connect-only mode  ([#2496](https://github.com/dynamic-labs/DynamicAuth/issues/2496)) ([44af274](https://github.com/dynamic-labs/DynamicAuth/commit/44af274618c30fe65ec95739cd16a8ddde08e34e))
+* typo in terms of service ([#2401](https://github.com/dynamic-labs/DynamicAuth/issues/2401)) ([5b195e5](https://github.com/dynamic-labs/DynamicAuth/commit/5b195e54479d9a88bd017fc45f2f2455d1caedc4))
+* **wc_v1_bridget:** disable WC v2 when WC v1 bridge is set ([#2505](https://github.com/dynamic-labs/DynamicAuth/issues/2505)) ([b3f0a68](https://github.com/dynamic-labs/DynamicAuth/commit/b3f0a6895095bb37c635984fc970b52446e04f56))
+* wc2 android improvements ([#2488](https://github.com/dynamic-labs/DynamicAuth/issues/2488)) ([f60ef9c](https://github.com/dynamic-labs/DynamicAuth/commit/f60ef9c1dd672f78199eee40edbe2707c043e1b5))
+* **wcv2:** make sure to clear active account when ending session ([#2471](https://github.com/dynamic-labs/DynamicAuth/issues/2471)) ([b766df3](https://github.com/dynamic-labs/DynamicAuth/commit/b766df39a7e4dabc54fda9131b7bd9b53895cf2f))
+* **wcv2:** use native or universal link when signing message ([#2502](https://github.com/dynamic-labs/DynamicAuth/issues/2502)) ([6e3e3fb](https://github.com/dynamic-labs/DynamicAuth/commit/6e3e3fbb58fb9e3eb314e6631ac2123237f41e8c))
+
+## [0.18.0-RC.7](https://github.com/dynamic-labs/DynamicAuth/compare/v0.18.0-RC.6...v0.18.0-RC.7) (2023-06-23)
+
+
+### Features
+
+* add bridge connect button ([#2399](https://github.com/dynamic-labs/DynamicAuth/issues/2399)) ([6987eea](https://github.com/dynamic-labs/DynamicAuth/commit/6987eeae8f49a5d077de6c4343b83ecbb1fc8b89))
+* add useTimeout, useInterval and useIsomorphicLayoutEffect hooks ([#2418](https://github.com/dynamic-labs/DynamicAuth/issues/2418)) ([3ed8595](https://github.com/dynamic-labs/DynamicAuth/commit/3ed859526a6ec982b61a4335a9a63512d0e631e3))
+* **DYN-2411:** WalletLockedView when user has valid jwt and all of their wallets are disconnected ([#2273](https://github.com/dynamic-labs/DynamicAuth/issues/2273)) ([2e6d0d6](https://github.com/dynamic-labs/DynamicAuth/commit/2e6d0d6ed734eb628bd05b6ad64560c496ad915f))
+* **DYN-2598:** add powered by, update copy and paddings in the select wallet chain layout ([#2391](https://github.com/dynamic-labs/DynamicAuth/issues/2391)) ([f2a7924](https://github.com/dynamic-labs/DynamicAuth/commit/f2a79241dcf1ea5720242c2cc65a6fcd077ea0e9))
+* **solana:** add logic to get network based on genesis hash ([#2402](https://github.com/dynamic-labs/DynamicAuth/issues/2402)) ([b76c626](https://github.com/dynamic-labs/DynamicAuth/commit/b76c62660bae334aef84678db5d8349a3d575630))
+
+
+### Bug Fixes
+
+* better handling of the CB wallet provider ([#2376](https://github.com/dynamic-labs/DynamicAuth/issues/2376)) ([720e510](https://github.com/dynamic-labs/DynamicAuth/commit/720e510d0793c530d06db5eaa1d5a7be608703bb))
+* clear AUTH_USER when there is no AUTH_TOKEN on LS ([#2423](https://github.com/dynamic-labs/DynamicAuth/issues/2423)) ([bf1e1c0](https://github.com/dynamic-labs/DynamicAuth/commit/bf1e1c0f8a7a7a852c67ef363613deecacdad92e))
+* set auth mode to connect-and-sign when verifiying wallet ([#2369](https://github.com/dynamic-labs/DynamicAuth/issues/2369)) ([666aa69](https://github.com/dynamic-labs/DynamicAuth/commit/666aa6954d19551a354af933a69ab8eeee7a98b5))
+* use getAuthTokenValue in initExpirationTime ([#2422](https://github.com/dynamic-labs/DynamicAuth/issues/2422)) ([fa8ff78](https://github.com/dynamic-labs/DynamicAuth/commit/fa8ff78d64421ca4447794fe9af53c175adf94c3))
+
 ## [0.18.0-RC.6](https://github.com/dynamic-labs/DynamicAuth/compare/v0.18.0-RC.5...v0.18.0-RC.6) (2023-06-20)
 
 

package/package.cjs

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var version = "0.18.0-RC.6";
+var version = "0.18.0-RC.8";
 var dependencies = {
 	"react-focus-lock": "2.9.2",
 	"@dynamic-labs/iconic": "0.1.23",

package/package.js

@@ -1,4 +1,4 @@
-var version = "0.18.0-RC.6";
+var version = "0.18.0-RC.8";
 var dependencies = {
 	"react-focus-lock": "2.9.2",
 	"@dynamic-labs/iconic": "0.1.23",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynamic-labs/sdk-react-core",
-  "version": "0.18.0-RC.6",
+  "version": "0.18.0-RC.8",
   "repository": {
     "type": "git",
     "url": "https://github.com/dynamic-labs/DynamicAuth.git",
@@ -16,13 +16,13 @@
     "formik": "2.2.9",
     "qrcode": "1.5.1",
     "ethers": "5.7.2",
-    "@dynamic-labs/logger": "0.18.0-RC.6",
-    "@dynamic-labs/multi-wallet": "0.18.0-RC.6",
-    "@dynamic-labs/rpc-providers": "0.18.0-RC.6",
-    "@dynamic-labs/types": "0.18.0-RC.6",
-    "@dynamic-labs/utils": "0.18.0-RC.6",
-    "@dynamic-labs/wallet-book": "0.18.0-RC.6",
-    "@dynamic-labs/wallet-connector-core": "0.18.0-RC.6"
+    "@dynamic-labs/logger": "0.18.0-RC.8",
+    "@dynamic-labs/multi-wallet": "0.18.0-RC.8",
+    "@dynamic-labs/rpc-providers": "0.18.0-RC.8",
+    "@dynamic-labs/types": "0.18.0-RC.8",
+    "@dynamic-labs/utils": "0.18.0-RC.8",
+    "@dynamic-labs/wallet-book": "0.18.0-RC.8",
+    "@dynamic-labs/wallet-connector-core": "0.18.0-RC.8"
   },
   "devDependencies": {
     "semver": "7.3.8"

package/src/index.cjs

@@ -13,6 +13,7 @@ var DynamicNav = require('./lib/widgets/DynamicWidget/components/DynamicNav/Dyna
 var DynamicUserProfile = require('./lib/widgets/DynamicWidget/components/DynamicUserProfile/DynamicUserProfile.cjs');
 var FundingWidget = require('./lib/widgets/FundingWidget/FundingWidget.cjs');
 var DynamicBridgeWidget = require('./lib/widgets/DynamicBridgeWidget/DynamicBridgeWidget.cjs');
+var DynamicBridgeConnectButton = require('./lib/widgets/DynamicBridgeWidget/components/DynamicBridgeConnectButton/DynamicBridgeConnectButton.cjs');
 require('react/jsx-runtime');
 require('react');
 var classNames = require('./lib/utils/functions/classNames/classNames.cjs');
@@ -36,6 +37,7 @@ var useLocalStorage = require('./lib/shared/utils/hooks/useLocalStorage/useLocal
 var index$1 = require('./lib/shared/utils/hooks/useOnClickOutside/index.cjs');
 var usePreventPageScroll = require('./lib/shared/utils/hooks/usePreventPageScroll/usePreventPageScroll.cjs');
 var useGlobalLoading = require('./lib/shared/utils/hooks/useGlobalLoading/useGlobalLoading.cjs');
+var useMediaQuery = require('./lib/shared/utils/hooks/useMediaQuery/useMediaQuery.cjs');
 var localStorage = require('./lib/shared/utils/classes/storage/localStorage.cjs');
 var PhantomLedgerIcon = require('./lib/shared/assets/wallets/PhantomLedgerIcon/PhantomLedgerIcon.cjs');
 var stroke = require('./lib/shared/assets/stroke.cjs');
@@ -72,6 +74,7 @@ var tooltipArrow = require('./lib/shared/assets/tooltip-arrow.cjs');
 var switchHorizontal = require('./lib/shared/assets/switch-horizontal.cjs');
 var dotsHorizontal = require('./lib/shared/assets/dots-horizontal.cjs');
 var send = require('./lib/shared/assets/send.cjs');
+var questionMark = require('./lib/shared/assets/question-mark.cjs');
 var index$2 = require('./lib/shared/consts/index.cjs');
 var logger = require('./lib/shared/logger.cjs');
 require('./lib/utils/constants/colors.cjs');
@@ -137,6 +140,7 @@ exports.DynamicNav = DynamicNav.ShadowedDynamicNav;
 exports.DynamicUserProfile = DynamicUserProfile.ShadowedDynamicUserProfile;
 exports.FundingWidget = FundingWidget.FundingWidget;
 exports.DynamicBridgeWidget = DynamicBridgeWidget.DynamicBridgeWidget;
+exports.DynamicBridgeConnectButton = DynamicBridgeConnectButton.DynamicBridgeConnectButton;
 exports.classNames = classNames.classNames;
 exports.decodeJwt = decodeJwt.decodeJwt;
 exports.validateType = validateType.validateType;
@@ -158,6 +162,7 @@ exports.useLocalStorage = useLocalStorage.useLocalStorage;
 exports.useOnClickOutside = index$1.useOnClickOutside;
 exports.usePreventPageScroll = usePreventPageScroll.usePreventPageScroll;
 exports.useGlobalLoading = useGlobalLoading.useGlobalLoading;
+exports.useMediaQuery = useMediaQuery.useMediaQuery;
 exports.LocalStorage = localStorage.LocalStorage;
 exports.PhantomLedgerIcon = PhantomLedgerIcon.PhantomLedgerIcon;
 exports.ArrowIcon = stroke.ReactComponent;
@@ -194,6 +199,7 @@ exports.TooltipArrow = tooltipArrow.ReactComponent;
 exports.SwitchHorizontalIcon = switchHorizontal.ReactComponent;
 exports.DotsHorizontalIcon = dotsHorizontal.ReactComponent;
 exports.SendIcon = send.ReactComponent;
+exports.QuestionMarkIcon = questionMark.ReactComponent;
 exports.authModalZIndex = index$2.authModalZIndex;
 exports.countryCodes = index$2.countryCodes;
 exports.defaultWalletsForChains = index$2.defaultWalletsForChains;

package/src/index.js

@@ -9,6 +9,7 @@ export { ShadowedDynamicNav as DynamicNav } from './lib/widgets/DynamicWidget/co
 export { ShadowedDynamicUserProfile as DynamicUserProfile } from './lib/widgets/DynamicWidget/components/DynamicUserProfile/DynamicUserProfile.js';
 export { FundingWidget } from './lib/widgets/FundingWidget/FundingWidget.js';
 export { DynamicBridgeWidget } from './lib/widgets/DynamicBridgeWidget/DynamicBridgeWidget.js';
+export { DynamicBridgeConnectButton } from './lib/widgets/DynamicBridgeWidget/components/DynamicBridgeConnectButton/DynamicBridgeConnectButton.js';
 import 'react/jsx-runtime';
 import 'react';
 export { classNames } from './lib/utils/functions/classNames/classNames.js';
@@ -32,6 +33,7 @@ export { useLocalStorage } from './lib/shared/utils/hooks/useLocalStorage/useLoc
 export { useOnClickOutside } from './lib/shared/utils/hooks/useOnClickOutside/index.js';
 export { usePreventPageScroll } from './lib/shared/utils/hooks/usePreventPageScroll/usePreventPageScroll.js';
 export { useGlobalLoading } from './lib/shared/utils/hooks/useGlobalLoading/useGlobalLoading.js';
+export { useMediaQuery } from './lib/shared/utils/hooks/useMediaQuery/useMediaQuery.js';
 export { LocalStorage } from './lib/shared/utils/classes/storage/localStorage.js';
 export { PhantomLedgerIcon } from './lib/shared/assets/wallets/PhantomLedgerIcon/PhantomLedgerIcon.js';
 export { ReactComponent as ArrowIcon } from './lib/shared/assets/stroke.js';
@@ -68,6 +70,7 @@ export { ReactComponent as TooltipArrow } from './lib/shared/assets/tooltip-arro
 export { ReactComponent as SwitchHorizontalIcon } from './lib/shared/assets/switch-horizontal.js';
 export { ReactComponent as DotsHorizontalIcon } from './lib/shared/assets/dots-horizontal.js';
 export { ReactComponent as SendIcon } from './lib/shared/assets/send.js';
+export { ReactComponent as QuestionMarkIcon } from './lib/shared/assets/question-mark.js';
 export { authModalZIndex, countryCodes, defaultWalletsForChains, tShirtSizes, teamNames, toolkitZIndex, tooltipZIndex, widgetModalZIndex } from './lib/shared/consts/index.js';
 export { logger } from './lib/shared/logger.js';
 import './lib/utils/constants/colors.js';

package/src/lib/Main.cjs

@@ -51,7 +51,7 @@ var viewToComponentMap = require('./views/viewToComponentMap.cjs');
 require('./main.global.cjs');
 
 const Main = () => {
-    const { selectedWalletConnector, appName, connectedWallets, isProjectSettingsLoading, projectSettings, privacyPolicyUrl, setShowAuthFlow, showAuthFlow, termsOfServiceUrl, newToWeb3WalletChainMap, wallets, clearStatesOnBackClick, user, } = useInternalDynamicContext.useInternalDynamicContext();
+    const { selectedWalletConnector, connectedWallets, isProjectSettingsLoading, projectSettings, setShowAuthFlow, showAuthFlow, wallets, clearStatesOnBackClick, user, } = useInternalDynamicContext.useInternalDynamicContext();
     const { view, goToInitialView } = ViewContext.useViewContext();
     const { setDeniedAddress, setDeniedOauthProvider } = AccessDeniedContext.useAccessDeniedContext();
     usePreventPageScroll.usePreventPageScroll(showAuthFlow);
@@ -106,7 +106,7 @@ const Main = () => {
     const showDynamicAuth = showAuthFlow && !isProjectSettingsLoading;
     return (jsxRuntime.jsx(SocialRedirectContext.SocialRedirectContextProvider, { children: jsxRuntime.jsx(index.FooterAnimationContextProvider, { children: jsxRuntime.jsx(Portal.Portal, Object.assign({ zIndex: index$1.authModalZIndex, isShown: showDynamicAuth, handleClose: handleClose, withBackdrop: true, transitionEvents: {
                     onUnmount: handleOnPortalUnmount,
-                } }, { children: jsxRuntime.jsx(DynamicAuthLayout.DynamicAuthLayout, Object.assign({ transitionProps: { isShown: showDynamicAuth }, appName: appName, onClose: handleClose, walletName: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name, projectSettings: projectSettings, newToWeb3WalletChainMap: newToWeb3WalletChainMap, walletConnector: selectedWalletConnector, privacyPolicyUrl: privacyPolicyUrl, termsOfServiceUrl: termsOfServiceUrl }, { children: viewToComponentMap.viewToComponentMap[view] })) })) }) }));
+                } }, { children: jsxRuntime.jsx(DynamicAuthLayout.DynamicAuthLayout, Object.assign({ transitionProps: { isShown: showDynamicAuth }, onClose: handleClose, projectSettings: projectSettings, walletConnector: selectedWalletConnector }, { children: viewToComponentMap.viewToComponentMap[view] })) })) }) }));
 };
 
 exports.Main = Main;

package/src/lib/Main.js

@@ -47,7 +47,7 @@ import { viewToComponentMap } from './views/viewToComponentMap.js';
 import './main.global.js';
 
 const Main = () => {
-    const { selectedWalletConnector, appName, connectedWallets, isProjectSettingsLoading, projectSettings, privacyPolicyUrl, setShowAuthFlow, showAuthFlow, termsOfServiceUrl, newToWeb3WalletChainMap, wallets, clearStatesOnBackClick, user, } = useInternalDynamicContext();
+    const { selectedWalletConnector, connectedWallets, isProjectSettingsLoading, projectSettings, setShowAuthFlow, showAuthFlow, wallets, clearStatesOnBackClick, user, } = useInternalDynamicContext();
     const { view, goToInitialView } = useViewContext();
     const { setDeniedAddress, setDeniedOauthProvider } = useAccessDeniedContext();
     usePreventPageScroll(showAuthFlow);
@@ -102,7 +102,7 @@ const Main = () => {
     const showDynamicAuth = showAuthFlow && !isProjectSettingsLoading;
     return (jsx(SocialRedirectContextProvider, { children: jsx(FooterAnimationContextProvider, { children: jsx(Portal, Object.assign({ zIndex: authModalZIndex, isShown: showDynamicAuth, handleClose: handleClose, withBackdrop: true, transitionEvents: {
                     onUnmount: handleOnPortalUnmount,
-                } }, { children: jsx(DynamicAuthLayout, Object.assign({ transitionProps: { isShown: showDynamicAuth }, appName: appName, onClose: handleClose, walletName: selectedWalletConnector === null || selectedWalletConnector === void 0 ? void 0 : selectedWalletConnector.name, projectSettings: projectSettings, newToWeb3WalletChainMap: newToWeb3WalletChainMap, walletConnector: selectedWalletConnector, privacyPolicyUrl: privacyPolicyUrl, termsOfServiceUrl: termsOfServiceUrl }, { children: viewToComponentMap[view] })) })) }) }));
+                } }, { children: jsx(DynamicAuthLayout, Object.assign({ transitionProps: { isShown: showDynamicAuth }, onClose: handleClose, projectSettings: projectSettings, walletConnector: selectedWalletConnector }, { children: viewToComponentMap[view] })) })) }) }));
 };
 
 export { Main, Main as default };

package/src/lib/components/Accordion/components/AccordionItem/AccordionItem.cjs

@@ -42,7 +42,7 @@ require('../../../../context/MockContext/MockContext.cjs');
 require('../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 
-const AccordionItem = ({ children, className = '', isOpen, dataTestId, }) => {
+const AccordionItem = ({ children, className = '', isOpen, dataTestId, dimOnHide = false, }) => {
     const childRef = React.useRef(null);
     const lastValidChildHeight = React.useRef();
     const [childEntry] = useResizeObserver.useResizeObserver(childRef);
@@ -59,9 +59,11 @@ const AccordionItem = ({ children, className = '', isOpen, dataTestId, }) => {
             lastValidChildHeight.current = childHeight;
         }
     }, [childEntry]);
-    return (jsxRuntime.jsx("div", Object.assign({ "data-testid": dataTestId, style: { maxHeight }, className: classNames.classNames(className, 'accordion-item', {
+    return (jsxRuntime.jsxs("div", Object.assign({ "data-testid": dataTestId, style: { maxHeight }, className: classNames.classNames(className, 'accordion-item', {
             'accordion-item--full-height': Boolean(maxHeight),
-        }) }, { children: jsxRuntime.jsx("div", Object.assign({ ref: childRef }, { children: children })) })));
+        }) }, { children: [dimOnHide && (jsxRuntime.jsx("div", { "data-testid": 'accordion-item-curtain', className: classNames.classNames('accordion-item__curtain', {
+                    'accordion-item__curtain--dimmed': !isOpen,
+                }) })), jsxRuntime.jsx("div", Object.assign({ ref: childRef }, { children: children }))] })));
 };
 
 exports.AccordionItem = AccordionItem;

package/src/lib/components/Accordion/components/AccordionItem/AccordionItem.js

@@ -1,4 +1,4 @@
-import { jsx } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { useRef, useMemo, useEffect } from 'react';
 import { classNames } from '../../../../utils/functions/classNames/classNames.js';
 import '@dynamic-labs/utils';
@@ -38,7 +38,7 @@ import '../../../../context/MockContext/MockContext.js';
 import '../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 
-const AccordionItem = ({ children, className = '', isOpen, dataTestId, }) => {
+const AccordionItem = ({ children, className = '', isOpen, dataTestId, dimOnHide = false, }) => {
     const childRef = useRef(null);
     const lastValidChildHeight = useRef();
     const [childEntry] = useResizeObserver(childRef);
@@ -55,9 +55,11 @@ const AccordionItem = ({ children, className = '', isOpen, dataTestId, }) => {
             lastValidChildHeight.current = childHeight;
         }
     }, [childEntry]);
-    return (jsx("div", Object.assign({ "data-testid": dataTestId, style: { maxHeight }, className: classNames(className, 'accordion-item', {
+    return (jsxs("div", Object.assign({ "data-testid": dataTestId, style: { maxHeight }, className: classNames(className, 'accordion-item', {
             'accordion-item--full-height': Boolean(maxHeight),
-        }) }, { children: jsx("div", Object.assign({ ref: childRef }, { children: children })) })));
+        }) }, { children: [dimOnHide && (jsx("div", { "data-testid": 'accordion-item-curtain', className: classNames('accordion-item__curtain', {
+                    'accordion-item__curtain--dimmed': !isOpen,
+                }) })), jsx("div", Object.assign({ ref: childRef }, { children: children }))] })));
 };
 
 export { AccordionItem };

package/src/lib/components/Accordion/components/AccordionItem/AccordionItem.types.d.ts

@@ -3,5 +3,6 @@ export type AccordionItemProps = {
     className?: string;
     dataTestId?: string;
     isOpen: boolean;
+    dimOnHide?: boolean;
 };
 export type AccordionItemComponent = FC<PropsWithChildren<AccordionItemProps>>;

package/src/lib/components/DynamicConnectButton/DynamicConnectButton.cjs

@@ -7,10 +7,8 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var useInternalDynamicContext = require('../../context/DynamicContext/useInternalDynamicContext.cjs');
 var ViewContext = require('../../context/ViewContext/ViewContext.cjs');
-var classNames = require('../../utils/functions/classNames/classNames.cjs');
-var Button = require('../Button/Button.cjs');
+var ConnectButton = require('./components/ConnectButton.cjs');
 
-const ConnectButton = ({ buttonClassName, buttonContainerClassName, onClick, isActive, isLoading, children, }) => (jsxRuntime.jsx("div", Object.assign({ className: buttonContainerClassName }, { children: jsxRuntime.jsx(Button.Button, Object.assign({ dataTestId: 'ConnectButton', onClick: onClick, buttonClassName: classNames.classNames('dynamic-connect-button', buttonClassName), loading: isLoading && isActive, disabled: isLoading && isActive, buttonVariant: 'primary', buttonPadding: 'large', buttonRounded: 'default' }, { children: children })) })));
 const DynamicConnectButton = ({ buttonContainerClassName = '', buttonClassName = '', children, }) => {
     const { isProjectSettingsLoading, setShowAuthFlow, setSelectedWalletConnector, loginWithEmail, } = useInternalDynamicContext.useInternalDynamicContext();
     const { setView } = ViewContext.useViewContext();
@@ -34,8 +32,7 @@ const DynamicConnectButton = ({ buttonContainerClassName = '', buttonClassName =
         setShowAuthFlow,
         setView,
     ]);
-    return (jsxRuntime.jsx(ConnectButton, Object.assign({ isLoading: isProjectSettingsLoading, isActive: didUserClick, onClick: handleOnClick, buttonContainerClassName: buttonContainerClassName, buttonClassName: buttonClassName }, { children: children })));
+    return (jsxRuntime.jsx(ConnectButton.ConnectButton, Object.assign({ isLoading: isProjectSettingsLoading, isActive: didUserClick, onClick: handleOnClick, buttonContainerClassName: buttonContainerClassName, buttonClassName: buttonClassName }, { children: children })));
 };
 
-exports.ConnectButton = ConnectButton;
 exports.DynamicConnectButton = DynamicConnectButton;

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

@@ -1,12 +1,4 @@
-import { FC, PropsWithChildren, ReactNode } from 'react';
-export type ConnectButtonProps = {
-    buttonClassName?: string;
-    buttonContainerClassName?: string;
-    isLoading?: boolean;
-    isActive?: boolean;
-    onClick?: () => void;
-};
-export declare const ConnectButton: FC<PropsWithChildren<ConnectButtonProps>>;
+import { ReactNode } from 'react';
 type Props = {
     buttonClassName?: string;
     buttonContainerClassName?: string;

package/src/lib/components/DynamicConnectButton/DynamicConnectButton.js

@@ -3,10 +3,8 @@ import { jsx } from 'react/jsx-runtime';
 import { useState, useCallback } from 'react';
 import { useInternalDynamicContext } from '../../context/DynamicContext/useInternalDynamicContext.js';
 import { useViewContext } from '../../context/ViewContext/ViewContext.js';
-import { classNames } from '../../utils/functions/classNames/classNames.js';
-import { Button } from '../Button/Button.js';
+import { ConnectButton } from './components/ConnectButton.js';
 
-const ConnectButton = ({ buttonClassName, buttonContainerClassName, onClick, isActive, isLoading, children, }) => (jsx("div", Object.assign({ className: buttonContainerClassName }, { children: jsx(Button, Object.assign({ dataTestId: 'ConnectButton', onClick: onClick, buttonClassName: classNames('dynamic-connect-button', buttonClassName), loading: isLoading && isActive, disabled: isLoading && isActive, buttonVariant: 'primary', buttonPadding: 'large', buttonRounded: 'default' }, { children: children })) })));
 const DynamicConnectButton = ({ buttonContainerClassName = '', buttonClassName = '', children, }) => {
     const { isProjectSettingsLoading, setShowAuthFlow, setSelectedWalletConnector, loginWithEmail, } = useInternalDynamicContext();
     const { setView } = useViewContext();
@@ -33,4 +31,4 @@ const DynamicConnectButton = ({ buttonContainerClassName = '', buttonClassName =
     return (jsx(ConnectButton, Object.assign({ isLoading: isProjectSettingsLoading, isActive: didUserClick, onClick: handleOnClick, buttonContainerClassName: buttonContainerClassName, buttonClassName: buttonClassName }, { children: children })));
 };
 
-export { ConnectButton, DynamicConnectButton };
+export { DynamicConnectButton };

package/src/lib/components/DynamicConnectButton/components/ConnectButton.cjs

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var Button = require('../../Button/Button.cjs');
+var classNames = require('../../../utils/functions/classNames/classNames.cjs');
+
+const ConnectButton = ({ buttonClassName, buttonContainerClassName, onClick, isActive, isLoading, children, }) => (jsxRuntime.jsx("div", Object.assign({ className: buttonContainerClassName }, { children: jsxRuntime.jsx(Button.Button, Object.assign({ dataTestId: 'ConnectButton', onClick: onClick, buttonClassName: classNames.classNames('connect-button', buttonClassName), loading: isLoading && isActive, disabled: isLoading && isActive, buttonVariant: 'primary', buttonPadding: 'large', buttonRounded: 'default' }, { children: children })) })));
+
+exports.ConnectButton = ConnectButton;

package/src/lib/components/DynamicConnectButton/components/ConnectButton.d.ts

@@ -0,0 +1,9 @@
+import { FC, PropsWithChildren } from 'react';
+export type ConnectButtonProps = {
+    buttonClassName?: string;
+    buttonContainerClassName?: string;
+    isLoading?: boolean;
+    isActive?: boolean;
+    onClick?: () => void;
+};
+export declare const ConnectButton: FC<PropsWithChildren<ConnectButtonProps>>;

package/src/lib/components/DynamicConnectButton/components/ConnectButton.js

@@ -0,0 +1,7 @@
+import { jsx } from 'react/jsx-runtime';
+import { Button } from '../../Button/Button.js';
+import { classNames } from '../../../utils/functions/classNames/classNames.js';
+
+const ConnectButton = ({ buttonClassName, buttonContainerClassName, onClick, isActive, isLoading, children, }) => (jsx("div", Object.assign({ className: buttonContainerClassName }, { children: jsx(Button, Object.assign({ dataTestId: 'ConnectButton', onClick: onClick, buttonClassName: classNames('connect-button', buttonClassName), loading: isLoading && isActive, disabled: isLoading && isActive, buttonVariant: 'primary', buttonPadding: 'large', buttonRounded: 'default' }, { children: children })) })));
+
+export { ConnectButton };

package/src/lib/components/ModalHeader/ModalHeader.types.d.ts

@@ -2,7 +2,7 @@ import { ReactElement, ReactNode } from 'react';
 export type ModalHeaderProps = {
     alignContent?: 'bottom';
     children?: ReactNode;
-    leading?: ReactNode;
+    leading?: ReactElement | ReactElement[];
     positionAbsolute?: boolean;
     trailing?: ReactNode;
 };

package/src/lib/components/NetworkPicker/NetworkPicker.cjs

@@ -21,6 +21,29 @@ var useInternalDynamicContext = require('../../context/DynamicContext/useInterna
 var classNames = require('../../utils/functions/classNames/classNames.cjs');
 require('@dynamic-labs/multi-wallet');
 var isNetworkUnsupported = require('../../utils/functions/isNetworkUnsupported/isNetworkUnsupported.cjs');
+require('../../config/ApiEndpoint.cjs');
+require('@dynamic-labs/rpc-providers');
+require('../../context/ErrorContext/ErrorContext.cjs');
+require('../../context/AccessDeniedContext/AccessDeniedContext.cjs');
+require('react-dom');
+require('../ShadowDOM/ShadowDOM.cjs');
+require('../../context/ThemeContext/ThemeContext.cjs');
+require('react-focus-lock');
+require('../Transition/ZoomTransition/ZoomTransition.cjs');
+require('../Transition/SlideInUpTransition/SlideInUpTransition.cjs');
+require('../Transition/OpacityTransition/OpacityTransition.cjs');
+require('../IconButton/IconButton.cjs');
+require('../Alert/Alert.cjs');
+require('../Popper/Popper/Popper.cjs');
+require('../Popper/PopperContext/PopperContext.cjs');
+require('formik');
+require('yup');
+require('../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+require('../../context/MockContext/MockContext.cjs');
+require('../../context/CaptchaContext/CaptchaContext.cjs');
+var usePromise = require('../../utils/hooks/usePromise/usePromise.cjs');
+require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 var NetworkControl = require('./components/NetworkControl/NetworkControl.cjs');
 var ActionList = require('./components/ActionList/ActionList.cjs');
 var NetworkAction = require('./components/NetworkAction/NetworkAction.cjs');
@@ -29,6 +52,7 @@ const NetworkPicker = ({ activeClassName = '', buttonClassName = '', checkboxCla
     const pickerRef = React.useRef(null);
     const [newNetworkId, setNewNetworkId] = React.useState(undefined);
     const { loadingNetwork, network, setNetwork } = useInternalDynamicContext.useInternalDynamicContext();
+    const { data: supportedWalletNetworks } = usePromise.usePromise(() => connector === null || connector === void 0 ? void 0 : connector.getSupportedNetworks(), [network]);
     const shouldAllowOpenDropdown = isNetworkUnsupported.isNetworkUnsupported(network, evmNetworks) || (evmNetworks === null || evmNetworks === void 0 ? void 0 : evmNetworks.length) > 1;
     index.useOnClickOutside(pickerRef, () => {
         if (isNetworkPickerOpen) {
@@ -54,7 +78,8 @@ const NetworkPicker = ({ activeClassName = '', buttonClassName = '', checkboxCla
             setIsNetworkPickerOpen(false);
         }
     });
-    return (jsxRuntime.jsxs("div", Object.assign({ className: classNames.classNames('non-widget-network-picker', mainClassName), ref: pickerRef }, { children: [jsxRuntime.jsx(NetworkControl.NetworkControl, { evmNetworks: evmNetworks, activeClassName: activeClassName, network: network, loading: loadingNetwork, isOpen: isNetworkPickerOpen, setIsOpen: setIsNetworkPickerOpen, walletConnector: connector, showNetworkName: showNetworkName, buttonClassName: buttonClassName }), shouldAllowOpenDropdown && (jsxRuntime.jsx(ActionList.ActionList, Object.assign({ className: listClassName, title: 'Select network', isOpen: isNetworkPickerOpen, setIsOpen: setIsNetworkPickerOpen }, { children: jsxRuntime.jsx("div", Object.assign({ className: 'network-picker__dropdown' }, { children: evmNetworks.map(({ name, networkId, vanityName, iconUrls }) => (jsxRuntime.jsx(NetworkAction.NetworkAction, { iconUrl: iconUrls === null || iconUrls === void 0 ? void 0 : iconUrls[0], networkId: networkId, networkName: vanityName || name, network: network, onClick: handleNetworkChange, checkboxClassName: checkboxClassName, newNetworkId: newNetworkId }, networkId))) })) })))] })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: classNames.classNames('non-widget-network-picker', mainClassName), ref: pickerRef }, { children: [jsxRuntime.jsx(NetworkControl.NetworkControl, { evmNetworks: evmNetworks, activeClassName: activeClassName, network: network, loading: loadingNetwork, isOpen: isNetworkPickerOpen, setIsOpen: setIsNetworkPickerOpen, walletConnector: connector, showNetworkName: showNetworkName, buttonClassName: buttonClassName }), shouldAllowOpenDropdown && (jsxRuntime.jsx(ActionList.ActionList, Object.assign({ className: listClassName, title: 'Select network', isOpen: isNetworkPickerOpen, setIsOpen: setIsNetworkPickerOpen }, { children: jsxRuntime.jsx("div", Object.assign({ className: 'network-picker__dropdown' }, { children: evmNetworks.map(({ name, networkId, vanityName, iconUrls }) => (jsxRuntime.jsx(NetworkAction.NetworkAction, { iconUrl: iconUrls === null || iconUrls === void 0 ? void 0 : iconUrls[0], networkId: networkId, networkName: vanityName || name, network: network, onClick: handleNetworkChange, checkboxClassName: checkboxClassName, newNetworkId: newNetworkId, notSupported: supportedWalletNetworks &&
+                            !supportedWalletNetworks.includes(`${networkId}`) }, networkId))) })) })))] })));
 };
 
 exports.NetworkPicker = NetworkPicker;

package/src/lib/components/NetworkPicker/NetworkPicker.js

@@ -17,6 +17,29 @@ import { useInternalDynamicContext } from '../../context/DynamicContext/useInter
 import { classNames } from '../../utils/functions/classNames/classNames.js';
 import '@dynamic-labs/multi-wallet';
 import { isNetworkUnsupported } from '../../utils/functions/isNetworkUnsupported/isNetworkUnsupported.js';
+import '../../config/ApiEndpoint.js';
+import '@dynamic-labs/rpc-providers';
+import '../../context/ErrorContext/ErrorContext.js';
+import '../../context/AccessDeniedContext/AccessDeniedContext.js';
+import 'react-dom';
+import '../ShadowDOM/ShadowDOM.js';
+import '../../context/ThemeContext/ThemeContext.js';
+import 'react-focus-lock';
+import '../Transition/ZoomTransition/ZoomTransition.js';
+import '../Transition/SlideInUpTransition/SlideInUpTransition.js';
+import '../Transition/OpacityTransition/OpacityTransition.js';
+import '../IconButton/IconButton.js';
+import '../Alert/Alert.js';
+import '../Popper/Popper/Popper.js';
+import '../Popper/PopperContext/PopperContext.js';
+import 'formik';
+import 'yup';
+import '../../context/WalletGroupContext/WalletGroupContext.js';
+import '../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '../../context/MockContext/MockContext.js';
+import '../../context/CaptchaContext/CaptchaContext.js';
+import { usePromise } from '../../utils/hooks/usePromise/usePromise.js';
+import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import { NetworkControl } from './components/NetworkControl/NetworkControl.js';
 import { ActionList } from './components/ActionList/ActionList.js';
 import { NetworkAction } from './components/NetworkAction/NetworkAction.js';
@@ -25,6 +48,7 @@ const NetworkPicker = ({ activeClassName = '', buttonClassName = '', checkboxCla
     const pickerRef = useRef(null);
     const [newNetworkId, setNewNetworkId] = useState(undefined);
     const { loadingNetwork, network, setNetwork } = useInternalDynamicContext();
+    const { data: supportedWalletNetworks } = usePromise(() => connector === null || connector === void 0 ? void 0 : connector.getSupportedNetworks(), [network]);
     const shouldAllowOpenDropdown = isNetworkUnsupported(network, evmNetworks) || (evmNetworks === null || evmNetworks === void 0 ? void 0 : evmNetworks.length) > 1;
     useOnClickOutside(pickerRef, () => {
         if (isNetworkPickerOpen) {
@@ -50,7 +74,8 @@ const NetworkPicker = ({ activeClassName = '', buttonClassName = '', checkboxCla
             setIsNetworkPickerOpen(false);
         }
     });
-    return (jsxs("div", Object.assign({ className: classNames('non-widget-network-picker', mainClassName), ref: pickerRef }, { children: [jsx(NetworkControl, { evmNetworks: evmNetworks, activeClassName: activeClassName, network: network, loading: loadingNetwork, isOpen: isNetworkPickerOpen, setIsOpen: setIsNetworkPickerOpen, walletConnector: connector, showNetworkName: showNetworkName, buttonClassName: buttonClassName }), shouldAllowOpenDropdown && (jsx(ActionList, Object.assign({ className: listClassName, title: 'Select network', isOpen: isNetworkPickerOpen, setIsOpen: setIsNetworkPickerOpen }, { children: jsx("div", Object.assign({ className: 'network-picker__dropdown' }, { children: evmNetworks.map(({ name, networkId, vanityName, iconUrls }) => (jsx(NetworkAction, { iconUrl: iconUrls === null || iconUrls === void 0 ? void 0 : iconUrls[0], networkId: networkId, networkName: vanityName || name, network: network, onClick: handleNetworkChange, checkboxClassName: checkboxClassName, newNetworkId: newNetworkId }, networkId))) })) })))] })));
+    return (jsxs("div", Object.assign({ className: classNames('non-widget-network-picker', mainClassName), ref: pickerRef }, { children: [jsx(NetworkControl, { evmNetworks: evmNetworks, activeClassName: activeClassName, network: network, loading: loadingNetwork, isOpen: isNetworkPickerOpen, setIsOpen: setIsNetworkPickerOpen, walletConnector: connector, showNetworkName: showNetworkName, buttonClassName: buttonClassName }), shouldAllowOpenDropdown && (jsx(ActionList, Object.assign({ className: listClassName, title: 'Select network', isOpen: isNetworkPickerOpen, setIsOpen: setIsNetworkPickerOpen }, { children: jsx("div", Object.assign({ className: 'network-picker__dropdown' }, { children: evmNetworks.map(({ name, networkId, vanityName, iconUrls }) => (jsx(NetworkAction, { iconUrl: iconUrls === null || iconUrls === void 0 ? void 0 : iconUrls[0], networkId: networkId, networkName: vanityName || name, network: network, onClick: handleNetworkChange, checkboxClassName: checkboxClassName, newNetworkId: newNetworkId, notSupported: supportedWalletNetworks &&
+                            !supportedWalletNetworks.includes(`${networkId}`) }, networkId))) })) })))] })));
 };
 
 export { NetworkPicker };

package/src/lib/components/NetworkPicker/components/Network/Network.cjs

@@ -45,7 +45,9 @@ require('../../../Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
 
-const Network = ({ iconUrl, isActive, networkName, className, checkboxClassName = '', isChanging, }) => (jsxRuntime.jsxs("div", Object.assign({ className: classNames.classNames('network', className) }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: 'network__title-container' }, { children: [iconUrl ? (jsxRuntime.jsx("img", { src: iconUrl, className: 'network__title-icon', alt: `${networkName} icon` })) : (jsxRuntime.jsx(error.ReactComponent, {})), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'button_primary', className: 'network__title-copy', as: 'span', weight: 'medium' }, { children: networkName }))] })), jsxRuntime.jsxs("div", Object.assign({ className: classNames.classNames('network__status-container', {
+const Network = ({ iconUrl, isActive, networkName, className, checkboxClassName = '', isChanging, notSupported = false, }) => (jsxRuntime.jsxs("div", Object.assign({ className: classNames.classNames('network', className, {
+        'network--not-supported': notSupported,
+    }) }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: 'network__container' }, { children: [iconUrl ? (jsxRuntime.jsx("img", { src: iconUrl, className: 'network__title-icon', alt: `${networkName} icon` })) : (jsxRuntime.jsx(error.ReactComponent, {})), jsxRuntime.jsxs("div", Object.assign({ className: 'network__title-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'button_primary', className: 'network__title-copy', as: 'span', weight: 'medium', color: notSupported ? 'secondary' : 'primary' }, { children: networkName })), notSupported && (jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_mini', className: 'network__title-copy', as: 'span', weight: 'medium', color: notSupported ? 'secondary' : 'primary', "data-testid": 'network-not-supported' }, { children: "Enable network in your wallet" })))] }))] })), jsxRuntime.jsxs("div", Object.assign({ className: classNames.classNames('network__status-container', {
                 'network__status-container--active': isActive,
             }, checkboxClassName), "data-testid": 'single-network-checkbox' }, { children: [isActive && jsxRuntime.jsx(check.ReactComponent, { className: 'network__status-icon' }), isChanging && (jsxRuntime.jsx(Spinner.Spinner, { className: 'network__status-spinner-icon', size: 12 }))] }))] })));
 

package/src/lib/components/NetworkPicker/components/Network/Network.d.ts

@@ -6,6 +6,7 @@ type Props = {
     isActive: boolean;
     isChanging: boolean;
     networkName: string;
+    notSupported?: boolean;
 };
-export declare const Network: ({ iconUrl, isActive, networkName, className, checkboxClassName, isChanging, }: Props) => JSX.Element;
+export declare const Network: ({ iconUrl, isActive, networkName, className, checkboxClassName, isChanging, notSupported, }: Props) => JSX.Element;
 export {};

package/src/lib/components/NetworkPicker/components/Network/Network.js

@@ -41,7 +41,9 @@ import '../../../Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
 
-const Network = ({ iconUrl, isActive, networkName, className, checkboxClassName = '', isChanging, }) => (jsxs("div", Object.assign({ className: classNames('network', className) }, { children: [jsxs("div", Object.assign({ className: 'network__title-container' }, { children: [iconUrl ? (jsx("img", { src: iconUrl, className: 'network__title-icon', alt: `${networkName} icon` })) : (jsx(SvgError, {})), jsx(Typography, Object.assign({ variant: 'button_primary', className: 'network__title-copy', as: 'span', weight: 'medium' }, { children: networkName }))] })), jsxs("div", Object.assign({ className: classNames('network__status-container', {
+const Network = ({ iconUrl, isActive, networkName, className, checkboxClassName = '', isChanging, notSupported = false, }) => (jsxs("div", Object.assign({ className: classNames('network', className, {
+        'network--not-supported': notSupported,
+    }) }, { children: [jsxs("div", Object.assign({ className: 'network__container' }, { children: [iconUrl ? (jsx("img", { src: iconUrl, className: 'network__title-icon', alt: `${networkName} icon` })) : (jsx(SvgError, {})), jsxs("div", Object.assign({ className: 'network__title-container' }, { children: [jsx(Typography, Object.assign({ variant: 'button_primary', className: 'network__title-copy', as: 'span', weight: 'medium', color: notSupported ? 'secondary' : 'primary' }, { children: networkName })), notSupported && (jsx(Typography, Object.assign({ variant: 'body_mini', className: 'network__title-copy', as: 'span', weight: 'medium', color: notSupported ? 'secondary' : 'primary', "data-testid": 'network-not-supported' }, { children: "Enable network in your wallet" })))] }))] })), jsxs("div", Object.assign({ className: classNames('network__status-container', {
                 'network__status-container--active': isActive,
             }, checkboxClassName), "data-testid": 'single-network-checkbox' }, { children: [isActive && jsx(SvgCheck, { className: 'network__status-icon' }), isChanging && (jsx(Spinner, { className: 'network__status-spinner-icon', size: 12 }))] }))] })));
 

package/src/lib/components/NetworkPicker/components/NetworkAction/NetworkAction.cjs

@@ -3,8 +3,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
+var classNames = require('../../../../utils/functions/classNames/classNames.cjs');
 var Network = require('../Network/Network.cjs');
 
-const NetworkAction = ({ iconUrl, networkId, network, onClick, networkName, checkboxClassName = '', newNetworkId, }) => (jsxRuntime.jsx("div", Object.assign({ className: 'network-action', onClick: () => onClick(networkId), "data-testid": 'network-action' }, { children: jsxRuntime.jsx(Network.Network, { iconUrl: iconUrl, isActive: networkId === network, networkName: networkName, checkboxClassName: checkboxClassName, isChanging: newNetworkId === networkId }) })));
+const NetworkAction = ({ iconUrl, networkId, network, onClick, networkName, checkboxClassName = '', newNetworkId, notSupported, }) => (jsxRuntime.jsx("div", Object.assign({ className: classNames.classNames('network-action', {
+        'network--not-supported': notSupported,
+    }), onClick: () => {
+        !notSupported && onClick(networkId);
+    }, "data-testid": 'network-action' }, { children: jsxRuntime.jsx(Network.Network, { iconUrl: iconUrl, isActive: networkId === network, networkName: networkName, checkboxClassName: checkboxClassName, isChanging: newNetworkId === networkId, notSupported: notSupported }) })));
 
 exports.NetworkAction = NetworkAction;

package/src/lib/components/NetworkPicker/components/NetworkAction/NetworkAction.d.ts

@@ -7,6 +7,7 @@ type Props = {
     networkName: string;
     newNetworkId: number | string | undefined;
     onClick: (networkId: number | string) => Promise<void>;
+    notSupported?: boolean;
 };
-export declare const NetworkAction: ({ iconUrl, networkId, network, onClick, networkName, checkboxClassName, newNetworkId, }: Props) => JSX.Element;
+export declare const NetworkAction: ({ iconUrl, networkId, network, onClick, networkName, checkboxClassName, newNetworkId, notSupported, }: Props) => JSX.Element;
 export {};

package/src/lib/components/NetworkPicker/components/NetworkAction/NetworkAction.js

@@ -1,6 +1,11 @@
 import { jsx } from 'react/jsx-runtime';
+import { classNames } from '../../../../utils/functions/classNames/classNames.js';
 import { Network } from '../Network/Network.js';
 
-const NetworkAction = ({ iconUrl, networkId, network, onClick, networkName, checkboxClassName = '', newNetworkId, }) => (jsx("div", Object.assign({ className: 'network-action', onClick: () => onClick(networkId), "data-testid": 'network-action' }, { children: jsx(Network, { iconUrl: iconUrl, isActive: networkId === network, networkName: networkName, checkboxClassName: checkboxClassName, isChanging: newNetworkId === networkId }) })));
+const NetworkAction = ({ iconUrl, networkId, network, onClick, networkName, checkboxClassName = '', newNetworkId, notSupported, }) => (jsx("div", Object.assign({ className: classNames('network-action', {
+        'network--not-supported': notSupported,
+    }), onClick: () => {
+        !notSupported && onClick(networkId);
+    }, "data-testid": 'network-action' }, { children: jsx(Network, { iconUrl: iconUrl, isActive: networkId === network, networkName: networkName, checkboxClassName: checkboxClassName, isChanging: newNetworkId === networkId, notSupported: notSupported }) })));
 
 export { NetworkAction };

package/src/lib/components/OTPVerificationView/OTPVerificationView.cjs

@@ -44,7 +44,6 @@ require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/Secondar
 require('../../context/MockContext/MockContext.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
-var TosAndPp = require('../TosAndPp/TosAndPp.cjs');
 var PinField = require('../PinField/PinField.cjs');
 var ModalHeaderBanner = require('../ModalHeaderBanner/ModalHeaderBanner.cjs');
 var shortenEmail = require('../../shared/utils/functions/shortenEmail/shortenEmail.cjs');
@@ -53,9 +52,9 @@ require('../Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
 
-const OTPVerificationView = ({ onClickBack, onClickEditEmail, isLoading, email, onPinComplete, isValid, error, termsOfServiceUrl, privacyPolicyUrl, onPinChange, displayPoweredByDynamic = false, }) => {
+const OTPVerificationView = ({ onClickBack, onClickEditEmail, isLoading, email, onPinComplete, isValid, error, onPinChange, displayPoweredByDynamic = false, }) => {
     const backButton = (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ type: 'button', onClick: onClickBack, "data-testid": 'back-button' }, { children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) })));
-    return (jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view' }, { children: [jsxRuntime.jsx(ModalHeaderBanner.ModalHeaderBanner, { type: 'error', message: error === null || error === void 0 ? void 0 : error.message }), jsxRuntime.jsx(ModalHeader.ModalHeader, Object.assign({ alignContent: 'bottom', leading: onClickBack && backButton }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__status-header' }, { children: [isValid && (jsxRuntime.jsx(IconWithStatus.IconWithStatus, { Icon: iconic.SignInWithEmailIcon, iconSize: 50, InnerIcon: check.ReactComponent })), !isValid && (jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: iconic.SignInWithEmailIcon, iconSize: 80, isSpinning: isLoading }))] })) })), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', color: 'primary', className: 'otp-verification-view__title' }, { children: isValid ? 'Verification code confirmed' : 'Confirm verification code' })), jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__body' }, { children: [isValid && (jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "Hang tight while we get things ready for you" }))), !isValid && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__email-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail.shortenEmail(email) })), onClickEditEmail && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ onClick: onClickEditEmail, "data-testid": 'otp-verification-view__edit-button' }, { children: jsxRuntime.jsx(Icon.Icon, Object.assign({ color: 'text-tertiary' }, { children: jsxRuntime.jsx(pencilAltIcon.ReactComponent, {}) })) })))] }))] }))] })), jsxRuntime.jsx(PinField.PinField, { initialValue: Array(6).join('.').split('.'), isLoading: isLoading, handleComplete: onPinComplete, isValidated: isValid, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: onPinChange }), jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__footer' }, { children: [termsOfServiceUrl && privacyPolicyUrl && (jsxRuntime.jsx(TosAndPp.TosAndPp, { mode: 'logging in', privacyPolicyUrl: privacyPolicyUrl, termsOfServiceUrl: termsOfServiceUrl })), displayPoweredByDynamic && jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {})] }))] })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view' }, { children: [jsxRuntime.jsx(ModalHeaderBanner.ModalHeaderBanner, { type: 'error', message: error === null || error === void 0 ? void 0 : error.message }), jsxRuntime.jsx(ModalHeader.ModalHeader, Object.assign({ alignContent: 'bottom', leading: onClickBack && backButton }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__status-header' }, { children: [isValid && (jsxRuntime.jsx(IconWithStatus.IconWithStatus, { Icon: iconic.SignInWithEmailIcon, iconSize: 50, InnerIcon: check.ReactComponent })), !isValid && (jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: iconic.SignInWithEmailIcon, iconSize: 80, isSpinning: isLoading }))] })) })), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', color: 'primary', className: 'otp-verification-view__title' }, { children: isValid ? 'Verification code confirmed' : 'Confirm verification code' })), jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__body' }, { children: [isValid && (jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "Hang tight while we get things ready for you" }))), !isValid && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__email-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail.shortenEmail(email) })), onClickEditEmail && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ onClick: onClickEditEmail, "data-testid": 'otp-verification-view__edit-button' }, { children: jsxRuntime.jsx(Icon.Icon, Object.assign({ color: 'text-tertiary' }, { children: jsxRuntime.jsx(pencilAltIcon.ReactComponent, {}) })) })))] }))] }))] })), jsxRuntime.jsx(PinField.PinField, { initialValue: Array(6).join('.').split('.'), isLoading: isLoading, handleComplete: onPinComplete, isValidated: isValid, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: onPinChange }), jsxRuntime.jsx("div", Object.assign({ className: 'otp-verification-view__footer' }, { children: displayPoweredByDynamic && jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {}) }))] })));
 };
 
 exports.OTPVerificationView = OTPVerificationView;