@dynamic-labs/sdk-react-core 0.18.0-RC.10 → 0.18.0-RC.11

package/src/lib/utils/hooks/useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.cjs

@@ -2,6 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _tslib = require('../../../../../_virtual/_tslib.cjs');
 var React = require('react');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useInternalDynamicContext.cjs');
 var ViewContext = require('../../../context/ViewContext/ViewContext.cjs');
@@ -24,10 +25,10 @@ require('@dynamic-labs/sdk-api');
 const useCreateUserProfileByJWTCallback = () => {
     const { setUser, handleLogOut } = useInternalDynamicContext.useInternalDynamicContext();
     const { goToInitialView } = ViewContext.useViewContext();
-    const createUserProfileByJWT = React.useCallback((jwt) => {
+    const createUserProfileByJWT = React.useCallback((jwt) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
         const decodedJWT = decodeJwt.decodeJwt(jwt);
         if (!decodedJWT) {
-            handleLogOut();
+            yield handleLogOut();
             goToInitialView();
             return;
         }
@@ -35,7 +36,7 @@ const useCreateUserProfileByJWTCallback = () => {
         const userProfile = createUserProfile.createUserProfile(decodedJWT);
         setUser(userProfile);
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    }), []);
     return { createUserProfileByJWT };
 };
 

package/src/lib/utils/hooks/useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.d.ts

@@ -1,3 +1,3 @@
 export declare const useCreateUserProfileByJWTCallback: () => {
-    createUserProfileByJWT: (jwt: string) => void;
+    createUserProfileByJWT: (jwt: string) => Promise<void>;
 };

package/src/lib/utils/hooks/useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.js

@@ -1,3 +1,4 @@
+import { __awaiter } from '../../../../../_virtual/_tslib.js';
 import { useCallback } from 'react';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useInternalDynamicContext.js';
 import { useViewContext } from '../../../context/ViewContext/ViewContext.js';
@@ -20,10 +21,10 @@ import '@dynamic-labs/sdk-api';
 const useCreateUserProfileByJWTCallback = () => {
     const { setUser, handleLogOut } = useInternalDynamicContext();
     const { goToInitialView } = useViewContext();
-    const createUserProfileByJWT = useCallback((jwt) => {
+    const createUserProfileByJWT = useCallback((jwt) => __awaiter(void 0, void 0, void 0, function* () {
         const decodedJWT = decodeJwt(jwt);
         if (!decodedJWT) {
-            handleLogOut();
+            yield handleLogOut();
             goToInitialView();
             return;
         }
@@ -31,7 +32,7 @@ const useCreateUserProfileByJWTCallback = () => {
         const userProfile = createUserProfile(decodedJWT);
         setUser(userProfile);
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    }), []);
     return { createUserProfileByJWT };
 };
 

package/src/lib/utils/hooks/useDynamicScopes/index.d.ts

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

package/src/lib/utils/hooks/useDynamicScopes/useDynamicScopes.cjs

@@ -0,0 +1,40 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var useInternalDynamicContext = require('../../../context/DynamicContext/useInternalDynamicContext.cjs');
+
+// This hook can be used to get all of the user's scopes (nft/token gates)
+// and check if the user has a specific scopes with some logic AND/OR (nft/token gate)
+const useDynamicScopes = () => {
+    const { decodedAuthToken } = useInternalDynamicContext.useInternalDynamicContext();
+    const userScopes = React.useMemo(() => {
+        const { scope } = decodedAuthToken || {};
+        if (!scope)
+            return [];
+        // We need to split the scopes string into an array of scopes
+        // because the scopes string is a space separated string of scopes
+        // e.g. '"scope": "customerservice marketing tech"'
+        return scope.split(' ');
+    }, [decodedAuthToken]);
+    // If customer will set scopes to an empty string it will return false
+    const userHasScopes = (scopes, logicOperator = 'OR') => {
+        if (!scopes.length)
+            return false;
+        if (typeof scopes === 'string')
+            scopes = scopes.split(' ');
+        if (logicOperator === 'AND') {
+            // If the logic operator is AND, the user must have all of the scopes
+            // If the logic operator is OR, the user must have at least one of the scopes
+            return scopes.every((scope) => Boolean(userScopes.includes(scope)));
+        }
+        return scopes.some((scope) => Boolean(userScopes.includes(scope)));
+    };
+    return {
+        userHasScopes,
+        userScopes,
+    };
+};
+
+exports.useDynamicScopes = useDynamicScopes;

package/src/lib/utils/hooks/useDynamicScopes/useDynamicScopes.d.ts

@@ -0,0 +1,6 @@
+type LogicGateOperators = 'AND' | 'OR';
+export declare const useDynamicScopes: () => {
+    userHasScopes: (scopes: string[] | string, logicOperator?: LogicGateOperators) => boolean;
+    userScopes: string[];
+};
+export {};

package/src/lib/utils/hooks/useDynamicScopes/useDynamicScopes.js

@@ -0,0 +1,36 @@
+import { useMemo } from 'react';
+import { useInternalDynamicContext } from '../../../context/DynamicContext/useInternalDynamicContext.js';
+
+// This hook can be used to get all of the user's scopes (nft/token gates)
+// and check if the user has a specific scopes with some logic AND/OR (nft/token gate)
+const useDynamicScopes = () => {
+    const { decodedAuthToken } = useInternalDynamicContext();
+    const userScopes = useMemo(() => {
+        const { scope } = decodedAuthToken || {};
+        if (!scope)
+            return [];
+        // We need to split the scopes string into an array of scopes
+        // because the scopes string is a space separated string of scopes
+        // e.g. '"scope": "customerservice marketing tech"'
+        return scope.split(' ');
+    }, [decodedAuthToken]);
+    // If customer will set scopes to an empty string it will return false
+    const userHasScopes = (scopes, logicOperator = 'OR') => {
+        if (!scopes.length)
+            return false;
+        if (typeof scopes === 'string')
+            scopes = scopes.split(' ');
+        if (logicOperator === 'AND') {
+            // If the logic operator is AND, the user must have all of the scopes
+            // If the logic operator is OR, the user must have at least one of the scopes
+            return scopes.every((scope) => Boolean(userScopes.includes(scope)));
+        }
+        return scopes.some((scope) => Boolean(userScopes.includes(scope)));
+    };
+    return {
+        userHasScopes,
+        userScopes,
+    };
+};
+
+export { useDynamicScopes };

package/src/lib/utils/hooks/useUpdateUserProfileByJWTCallback/useUpdateUserProfileByJWTCallback.cjs

@@ -2,6 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _tslib = require('../../../../../_virtual/_tslib.cjs');
 var React = require('react');
 var useInternalDynamicContext = require('../../../context/DynamicContext/useInternalDynamicContext.cjs');
 var useCreateUserProfileByJWTCallback = require('../useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.cjs');
@@ -16,11 +17,11 @@ var useCreateUserProfileByJWTCallback = require('../useCreateUserProfileByJWTCal
 const useUpdateUserProfileByJWTCallback = () => {
     const { createUserProfileByJWT } = useCreateUserProfileByJWTCallback.useCreateUserProfileByJWTCallback();
     const { setCallback } = useInternalDynamicContext.useInternalDynamicContext();
-    const updateUserProfileByJWT = React.useCallback((jwt) => {
-        createUserProfileByJWT(jwt);
+    const updateUserProfileByJWT = React.useCallback((jwt) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        yield createUserProfileByJWT(jwt);
         setCallback('userProfileUpdate');
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    }), []);
     return { updateUserProfileByJWT };
 };
 

package/src/lib/utils/hooks/useUpdateUserProfileByJWTCallback/useUpdateUserProfileByJWTCallback.d.ts

@@ -6,5 +6,5 @@
  * @returns An object with the 'updateUserProfileByJWT' function.
  */
 export declare const useUpdateUserProfileByJWTCallback: () => {
-    updateUserProfileByJWT: (jwt: string) => void;
+    updateUserProfileByJWT: (jwt: string) => Promise<void>;
 };

package/src/lib/utils/hooks/useUpdateUserProfileByJWTCallback/useUpdateUserProfileByJWTCallback.js

@@ -1,3 +1,4 @@
+import { __awaiter } from '../../../../../_virtual/_tslib.js';
 import { useCallback } from 'react';
 import { useInternalDynamicContext } from '../../../context/DynamicContext/useInternalDynamicContext.js';
 import { useCreateUserProfileByJWTCallback } from '../useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.js';
@@ -12,11 +13,11 @@ import { useCreateUserProfileByJWTCallback } from '../useCreateUserProfileByJWTC
 const useUpdateUserProfileByJWTCallback = () => {
     const { createUserProfileByJWT } = useCreateUserProfileByJWTCallback();
     const { setCallback } = useInternalDynamicContext();
-    const updateUserProfileByJWT = useCallback((jwt) => {
-        createUserProfileByJWT(jwt);
+    const updateUserProfileByJWT = useCallback((jwt) => __awaiter(void 0, void 0, void 0, function* () {
+        yield createUserProfileByJWT(jwt);
         setCallback('userProfileUpdate');
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
+    }), []);
     return { updateUserProfileByJWT };
 };
 

package/src/lib/utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs

@@ -41,7 +41,7 @@ const useUserUpdateRequestInternal = ({ validationSchemaStripUnknown, }) => {
         const _isEmailVerificationRequired = isEmailVerificationRequired.isEmailVerificationRequired(updateUserProfileResponse);
         if (!_isEmailVerificationRequired) {
             // If email verification is not needed then we can update the user profile immediately.
-            updateUserProfileByJWT(updateUserProfileResponse.jwt);
+            yield updateUserProfileByJWT(updateUserProfileResponse.jwt);
             return {
                 isEmailVerificationRequired: _isEmailVerificationRequired,
                 updateUserProfileResponse,

package/src/lib/utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js

@@ -37,7 +37,7 @@ const useUserUpdateRequestInternal = ({ validationSchemaStripUnknown, }) => {
         const _isEmailVerificationRequired = isEmailVerificationRequired(updateUserProfileResponse);
         if (!_isEmailVerificationRequired) {
             // If email verification is not needed then we can update the user profile immediately.
-            updateUserProfileByJWT(updateUserProfileResponse.jwt);
+            yield updateUserProfileByJWT(updateUserProfileResponse.jwt);
             return {
                 isEmailVerificationRequired: _isEmailVerificationRequired,
                 updateUserProfileResponse,

package/src/lib/utils/hooks/useVerifyWallet/useVerifyWallet.cjs

@@ -103,9 +103,15 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
         }
         walletConnector.endSession();
         if (e instanceof utils.ChainalysisError) {
+            setDeniedAddress(address);
             setView('chainalysis-blocked-wallet');
             return;
         }
+        if (e instanceof utils.GateBlockedError) {
+            setDeniedAddress(address);
+            setView('gate-blocked-wallet');
+            return;
+        }
         if (e instanceof utils.NoAccessError) {
             setDeniedAddress(address);
             // we need to set this value if it's magic in order to set proper icon

package/src/lib/utils/hooks/useVerifyWallet/useVerifyWallet.js

@@ -1,6 +1,6 @@
 import { __awaiter } from '../../../../../_virtual/_tslib.js';
 import { isSocialWalletConnector } from '@dynamic-labs/wallet-connector-core';
-import { DynamicError, WalletUsedError, ChainalysisError, NoAccessError } from '@dynamic-labs/utils';
+import { DynamicError, WalletUsedError, ChainalysisError, GateBlockedError, NoAccessError } from '@dynamic-labs/utils';
 import { verifyWallet, linkWallet } from '../../../data/api.js';
 import { storeAuthToken } from '../../functions/storeAuthToken/index.js';
 import '@dynamic-labs/multi-wallet';
@@ -99,9 +99,15 @@ const useVerifyWallet = ({ consumeNonce, displayTermsOfService, environmentId, p
         }
         walletConnector.endSession();
         if (e instanceof ChainalysisError) {
+            setDeniedAddress(address);
             setView('chainalysis-blocked-wallet');
             return;
         }
+        if (e instanceof GateBlockedError) {
+            setDeniedAddress(address);
+            setView('gate-blocked-wallet');
+            return;
+        }
         if (e instanceof NoAccessError) {
             setDeniedAddress(address);
             // we need to set this value if it's magic in order to set proper icon

package/src/lib/utils/hooks/useWalletUiUtils/useWalletUiUtils.cjs

@@ -42,6 +42,7 @@ require('../../../components/Popper/Popper/Popper.cjs');
 require('../../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('../../../components/InlineWidget/InlineWidget.cjs');
 
 const useWalletUiUtils = ({ appLogoUrl, appName, getAppOrigin, }) => {
     const confirmationStateRef = React.useRef('enabled');

package/src/lib/utils/hooks/useWalletUiUtils/useWalletUiUtils.js

@@ -38,6 +38,7 @@ import '../../../components/Popper/Popper/Popper.js';
 import '../../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import '../../../components/InlineWidget/InlineWidget.js';
 
 const useWalletUiUtils = ({ appLogoUrl, appName, getAppOrigin, }) => {
     const confirmationStateRef = useRef('enabled');

package/src/lib/views/BridgeSummaryView/BridgeSummaryView.cjs

@@ -3,8 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
 var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
 var useInternalDynamicContext = require('../../context/DynamicContext/useInternalDynamicContext.cjs');
+var ConnectedWalletsListLayout = require('../../layouts/ConnectedWalletsListLayout/ConnectedWalletsListLayout.cjs');
 require('@dynamic-labs/sdk-api');
 require('../../shared/logger.cjs');
 var getChainIcon = require('../../shared/utils/functions/chain/getChainIcon.cjs');
@@ -13,25 +15,28 @@ require('@dynamic-labs/utils');
 require('../../utils/constants/colors.cjs');
 require('../../shared/utils/classes/storage/localStorage.cjs');
 require('ethers');
-require('react');
 require('@dynamic-labs/iconic');
 require('../../context/ViewContext/ViewContext.cjs');
 require('../../shared/consts/index.cjs');
-var ConnectedWalletsListLayout = require('../../layouts/ConnectedWalletsListLayout/ConnectedWalletsListLayout.cjs');
 var DynamicBridgeWalletCard = require('../../widgets/DynamicBridgeWidget/components/DynamicBridgeWalletCard/DynamicBridgeWalletCard.cjs');
 var DynamicBridgeWalletCardBody = require('../../widgets/DynamicBridgeWidget/components/DynamicBridgeWalletCardBody/DynamicBridgeWalletCardBody.cjs');
-var Balance = require('../../widgets/DynamicWidget/components/Balance/Balance.cjs');
 var SecondaryWallets = require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+var Balance = require('../../widgets/DynamicWidget/components/Balance/Balance.cjs');
 
 const BridgeSummaryView = () => {
-    const { primaryWallet, setShowAuthFlow } = useInternalDynamicContext.useInternalDynamicContext();
+    const { primaryWallet, setShowAuthFlow, appName, walletsByChain = [], } = useInternalDynamicContext.useInternalDynamicContext();
     if (!primaryWallet) {
         throw new Error('primaryWallet should be defined');
     }
     const PrimaryWalletChainIcon = getChainIcon.getChainIcon(primaryWallet.chain);
     const primaryWalletChainInfo = walletConnectorCore.getChainInfo(primaryWallet.chain);
     const onClickClose = () => setShowAuthFlow(false);
-    return (jsxRuntime.jsxs(ConnectedWalletsListLayout.ConnectedWalletsListLayout, Object.assign({ onClickClose: onClickClose, onClickAction: onClickClose, title: "Well done, you're connected" }, { children: [jsxRuntime.jsx(DynamicBridgeWalletCard.DynamicBridgeWalletCard, Object.assign({ networkIcon: jsxRuntime.jsx(PrimaryWalletChainIcon, {}), networkName: primaryWalletChainInfo === null || primaryWalletChainInfo === void 0 ? void 0 : primaryWalletChainInfo.displayName }, { children: jsxRuntime.jsx(DynamicBridgeWalletCardBody.DynamicBridgeWalletCardBody, { walletName: primaryWallet.connector.name, walletAddress: primaryWallet.address, walletBalance: 
+    const body = React.useMemo(() => {
+        const blockchainNames = walletsByChain.map(({ chain }) => { var _a; return (_a = walletConnectorCore.getChainInfo(chain)) === null || _a === void 0 ? void 0 : _a.blockchainName; });
+        const [firstBlockchainName, secondBlockchainName] = blockchainNames;
+        return `Congratulations on connecting both your ${firstBlockchainName} and ${secondBlockchainName} wallets`;
+    }, [walletsByChain]);
+    return (jsxRuntime.jsxs(ConnectedWalletsListLayout.ConnectedWalletsListLayout, Object.assign({ onClickClose: onClickClose, onClickAction: onClickClose, title: `Welcome to ${appName}`, body: body }, { children: [jsxRuntime.jsx(DynamicBridgeWalletCard.DynamicBridgeWalletCard, Object.assign({ networkIcon: jsxRuntime.jsx(PrimaryWalletChainIcon, {}), networkName: primaryWalletChainInfo === null || primaryWalletChainInfo === void 0 ? void 0 : primaryWalletChainInfo.displayName }, { children: jsxRuntime.jsx(DynamicBridgeWalletCardBody.DynamicBridgeWalletCardBody, { walletName: primaryWallet.connector.name, walletAddress: primaryWallet.address, walletBalance: 
                     // eslint-disable-next-line react/jsx-wrap-multilines
                     jsxRuntime.jsx(Balance.Balance, { address: primaryWallet.address, connector: primaryWallet.connector, network: primaryWallet.chain }) }) })), jsxRuntime.jsx(SecondaryWallets.MemoSecondaryWallets, { hideUnlinkAction: true })] })));
 };

package/src/lib/views/BridgeSummaryView/BridgeSummaryView.js

@@ -1,6 +1,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { useMemo } from 'react';
 import { getChainInfo } from '@dynamic-labs/wallet-connector-core';
 import { useInternalDynamicContext } from '../../context/DynamicContext/useInternalDynamicContext.js';
+import { ConnectedWalletsListLayout } from '../../layouts/ConnectedWalletsListLayout/ConnectedWalletsListLayout.js';
 import '@dynamic-labs/sdk-api';
 import '../../shared/logger.js';
 import { getChainIcon } from '../../shared/utils/functions/chain/getChainIcon.js';
@@ -9,25 +11,28 @@ import '@dynamic-labs/utils';
 import '../../utils/constants/colors.js';
 import '../../shared/utils/classes/storage/localStorage.js';
 import 'ethers';
-import 'react';
 import '@dynamic-labs/iconic';
 import '../../context/ViewContext/ViewContext.js';
 import '../../shared/consts/index.js';
-import { ConnectedWalletsListLayout } from '../../layouts/ConnectedWalletsListLayout/ConnectedWalletsListLayout.js';
 import { DynamicBridgeWalletCard } from '../../widgets/DynamicBridgeWidget/components/DynamicBridgeWalletCard/DynamicBridgeWalletCard.js';
 import { DynamicBridgeWalletCardBody } from '../../widgets/DynamicBridgeWidget/components/DynamicBridgeWalletCardBody/DynamicBridgeWalletCardBody.js';
-import { Balance } from '../../widgets/DynamicWidget/components/Balance/Balance.js';
 import { MemoSecondaryWallets } from '../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import { Balance } from '../../widgets/DynamicWidget/components/Balance/Balance.js';
 
 const BridgeSummaryView = () => {
-    const { primaryWallet, setShowAuthFlow } = useInternalDynamicContext();
+    const { primaryWallet, setShowAuthFlow, appName, walletsByChain = [], } = useInternalDynamicContext();
     if (!primaryWallet) {
         throw new Error('primaryWallet should be defined');
     }
     const PrimaryWalletChainIcon = getChainIcon(primaryWallet.chain);
     const primaryWalletChainInfo = getChainInfo(primaryWallet.chain);
     const onClickClose = () => setShowAuthFlow(false);
-    return (jsxs(ConnectedWalletsListLayout, Object.assign({ onClickClose: onClickClose, onClickAction: onClickClose, title: "Well done, you're connected" }, { children: [jsx(DynamicBridgeWalletCard, Object.assign({ networkIcon: jsx(PrimaryWalletChainIcon, {}), networkName: primaryWalletChainInfo === null || primaryWalletChainInfo === void 0 ? void 0 : primaryWalletChainInfo.displayName }, { children: jsx(DynamicBridgeWalletCardBody, { walletName: primaryWallet.connector.name, walletAddress: primaryWallet.address, walletBalance: 
+    const body = useMemo(() => {
+        const blockchainNames = walletsByChain.map(({ chain }) => { var _a; return (_a = getChainInfo(chain)) === null || _a === void 0 ? void 0 : _a.blockchainName; });
+        const [firstBlockchainName, secondBlockchainName] = blockchainNames;
+        return `Congratulations on connecting both your ${firstBlockchainName} and ${secondBlockchainName} wallets`;
+    }, [walletsByChain]);
+    return (jsxs(ConnectedWalletsListLayout, Object.assign({ onClickClose: onClickClose, onClickAction: onClickClose, title: `Welcome to ${appName}`, body: body }, { children: [jsx(DynamicBridgeWalletCard, Object.assign({ networkIcon: jsx(PrimaryWalletChainIcon, {}), networkName: primaryWalletChainInfo === null || primaryWalletChainInfo === void 0 ? void 0 : primaryWalletChainInfo.displayName }, { children: jsx(DynamicBridgeWalletCardBody, { walletName: primaryWallet.connector.name, walletAddress: primaryWallet.address, walletBalance: 
                     // eslint-disable-next-line react/jsx-wrap-multilines
                     jsx(Balance, { address: primaryWallet.address, connector: primaryWallet.connector, network: primaryWallet.chain }) }) })), jsx(MemoSecondaryWallets, { hideUnlinkAction: true })] })));
 };

package/src/lib/views/BridgeWelcomeView/BridgeWelcomeView.cjs

@@ -26,7 +26,7 @@ const BridgeWelcomeView = () => {
     const body = React.useMemo(() => {
         const blockchainNames = walletsByChain.map(({ chain }) => { var _a; return (_a = walletConnectorCore.getChainInfo(chain)) === null || _a === void 0 ? void 0 : _a.blockchainName; });
         const [firstBlockchainName, secondBlockchainName] = blockchainNames;
-        return `You’ll need to connect both an ${firstBlockchainName} and a ${secondBlockchainName} wallet to get started`;
+        return `You’ll need to connect both your ${firstBlockchainName} and ${secondBlockchainName} wallets to get started`;
     }, [walletsByChain]);
     const chains = React.useMemo(() => walletsByChain
         .map(({ chain }, index) => {
@@ -42,7 +42,7 @@ const BridgeWelcomeView = () => {
         return undefined;
     })
         .filter(isChainInfoDefined), [walletsByChain]);
-    return (jsxRuntime.jsx(BridgeWelcomeLayout.BridgeWelcomeLayout, { onClickClose: () => setShowAuthFlow(false), title: `Welcome ${appName}`, body: body, chains: chains, actionButtonText: 'Get started', onClickAction: () => setView('wallet-list') }));
+    return (jsxRuntime.jsx(BridgeWelcomeLayout.BridgeWelcomeLayout, { onClickClose: () => setShowAuthFlow(false), title: `Connect to ${appName}`, body: body, chains: chains, actionButtonText: 'Get started', onClickAction: () => setView('wallet-list') }));
 };
 
 exports.BridgeWelcomeView = BridgeWelcomeView;

package/src/lib/views/BridgeWelcomeView/BridgeWelcomeView.js

@@ -22,7 +22,7 @@ const BridgeWelcomeView = () => {
     const body = useMemo(() => {
         const blockchainNames = walletsByChain.map(({ chain }) => { var _a; return (_a = getChainInfo(chain)) === null || _a === void 0 ? void 0 : _a.blockchainName; });
         const [firstBlockchainName, secondBlockchainName] = blockchainNames;
-        return `You’ll need to connect both an ${firstBlockchainName} and a ${secondBlockchainName} wallet to get started`;
+        return `You’ll need to connect both your ${firstBlockchainName} and ${secondBlockchainName} wallets to get started`;
     }, [walletsByChain]);
     const chains = useMemo(() => walletsByChain
         .map(({ chain }, index) => {
@@ -38,7 +38,7 @@ const BridgeWelcomeView = () => {
         return undefined;
     })
         .filter(isChainInfoDefined), [walletsByChain]);
-    return (jsx(BridgeWelcomeLayout, { onClickClose: () => setShowAuthFlow(false), title: `Welcome ${appName}`, body: body, chains: chains, actionButtonText: 'Get started', onClickAction: () => setView('wallet-list') }));
+    return (jsx(BridgeWelcomeLayout, { onClickClose: () => setShowAuthFlow(false), title: `Connect to ${appName}`, body: body, chains: chains, actionButtonText: 'Get started', onClickAction: () => setView('wallet-list') }));
 };
 
 export { BridgeWelcomeView };

package/src/lib/views/CaptchaVerifyUser/CaptchaVerifyUser.cjs

@@ -42,6 +42,7 @@ require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('../../components/InlineWidget/InlineWidget.cjs');
 var Captcha = require('../../components/Captcha/Captcha.cjs');
 
 const CaptchaVerifyUser = () => {

package/src/lib/views/CaptchaVerifyUser/CaptchaVerifyUser.js

@@ -38,6 +38,7 @@ import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import '../../components/InlineWidget/InlineWidget.js';
 import { Captcha } from '../../components/Captcha/Captcha.js';
 
 const CaptchaVerifyUser = () => {

package/src/lib/views/CollectUserDataView/CollectUserDataView.cjs

@@ -43,6 +43,7 @@ require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('../../components/InlineWidget/InlineWidget.cjs');
 var NetworkPicker = require('../../components/NetworkPicker/NetworkPicker.cjs');
 var UserAddress = require('../../components/UserAddress/UserAddress.cjs');
 var useFetchNameService = require('../../widgets/DynamicWidget/hooks/useFetchNameService/useFetchNameService.cjs');
@@ -61,7 +62,7 @@ const CollectUserDataView = () => {
     const _isSupportedNetwork = !network || isSupportedNetwork.isSupportedNetwork({ network, walletConnector });
     return (jsxRuntime.jsxs("div", Object.assign({ className: 'collect-user-data', "data-testid": 'collect-user-data-view' }, { children: [onboardingImageUrl && (jsxRuntime.jsx("img", { className: 'collect-user-data__main-img', src: onboardingImageUrl, alt: 'onboarding' })), !_isSupportedNetwork && (jsxRuntime.jsx(ErrorContainer.ErrorContainer, Object.assign({ withIcon: false, className: 'collect-user-data__error--not-supported' }, { children: "This network is not available, please update." }))), jsxRuntime.jsxs("div", Object.assign({ className: 'collect-user-data__form' }, { children: [jsxRuntime.jsxs(OnboardingUserDataForm.OnboardingUserDataForm, Object.assign({ disableSubmit: !_isSupportedNetwork, userProfile: userProfile }, { children: [jsxRuntime.jsx("div", Object.assign({ className: 'collect-user-data__img-container' }, { children: (nameService === null || nameService === void 0 ? void 0 : nameService.avatar) ? (jsxRuntime.jsx("img", { src: nameService.avatar, alt: '', className: 'collect-user-data__img collect-user-data__img--rounded' })) : (jsxRuntime.jsx(AuthProviderIcon.AuthProviderIcon, { jwt: onboardingOnlyJwt })) })), jsxRuntime.jsx(UserAddress.UserAddress, { userProfile: userProfile }), jsxRuntime.jsx("div", Object.assign({ className: 'collect-user-data__network-container' }, { children: jsxRuntime.jsx(NetworkPicker.NetworkPicker, { evmNetworks: evmNetworks, connector: walletConnector, showNetworkName: true, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, buttonClassName: 'collect-user-data__network-picker-button', mainClassName: 'collect-user-data__network-picker' }) })), !_isSupportedNetwork ? (jsxRuntime.jsxs("div", Object.assign({ className: 'collect-user-data__welcome-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'title', color: 'primary', className: 'collect-user-data__welcome-title' }, { children: "Update Network" })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "Your wallet is not connected to a supported network. Please update before continuing." }))] }))) : (jsxRuntime.jsxs("div", Object.assign({ className: 'collect-user-data__welcome-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'title', color: 'primary', className: 'collect-user-data__welcome-title' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
                                             `Welcome to ${appName}` })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeMessage) ||
-                                            'We need a bit of information to get started' }))] })))] })), jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'collect-user-data__log-out', onClick: () => handleLogOut() }, { children: "Log out" }))] }))] })));
+                                            'We need a bit of information to get started' }))] })))] })), jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'collect-user-data__log-out', onClick: handleLogOut }, { children: "Log out" }))] }))] })));
 };
 
 exports.CollectUserDataView = CollectUserDataView;

package/src/lib/views/CollectUserDataView/CollectUserDataView.js

@@ -39,6 +39,7 @@ import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import '../../components/InlineWidget/InlineWidget.js';
 import { NetworkPicker } from '../../components/NetworkPicker/NetworkPicker.js';
 import { UserAddress } from '../../components/UserAddress/UserAddress.js';
 import { useFetchNameService } from '../../widgets/DynamicWidget/hooks/useFetchNameService/useFetchNameService.js';
@@ -57,7 +58,7 @@ const CollectUserDataView = () => {
     const _isSupportedNetwork = !network || isSupportedNetwork({ network, walletConnector });
     return (jsxs("div", Object.assign({ className: 'collect-user-data', "data-testid": 'collect-user-data-view' }, { children: [onboardingImageUrl && (jsx("img", { className: 'collect-user-data__main-img', src: onboardingImageUrl, alt: 'onboarding' })), !_isSupportedNetwork && (jsx(ErrorContainer, Object.assign({ withIcon: false, className: 'collect-user-data__error--not-supported' }, { children: "This network is not available, please update." }))), jsxs("div", Object.assign({ className: 'collect-user-data__form' }, { children: [jsxs(OnboardingUserDataForm, Object.assign({ disableSubmit: !_isSupportedNetwork, userProfile: userProfile }, { children: [jsx("div", Object.assign({ className: 'collect-user-data__img-container' }, { children: (nameService === null || nameService === void 0 ? void 0 : nameService.avatar) ? (jsx("img", { src: nameService.avatar, alt: '', className: 'collect-user-data__img collect-user-data__img--rounded' })) : (jsx(AuthProviderIcon, { jwt: onboardingOnlyJwt })) })), jsx(UserAddress, { userProfile: userProfile }), jsx("div", Object.assign({ className: 'collect-user-data__network-container' }, { children: jsx(NetworkPicker, { evmNetworks: evmNetworks, connector: walletConnector, showNetworkName: true, isNetworkPickerOpen: isNetworkPickerOpen, setIsNetworkPickerOpen: setIsNetworkPickerOpen, buttonClassName: 'collect-user-data__network-picker-button', mainClassName: 'collect-user-data__network-picker' }) })), !_isSupportedNetwork ? (jsxs("div", Object.assign({ className: 'collect-user-data__welcome-container' }, { children: [jsx(Typography, Object.assign({ variant: 'title', color: 'primary', className: 'collect-user-data__welcome-title' }, { children: "Update Network" })), jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "Your wallet is not connected to a supported network. Please update before continuing." }))] }))) : (jsxs("div", Object.assign({ className: 'collect-user-data__welcome-container' }, { children: [jsx(Typography, Object.assign({ variant: 'title', color: 'primary', className: 'collect-user-data__welcome-title' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
                                             `Welcome to ${appName}` })), jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeMessage) ||
-                                            'We need a bit of information to get started' }))] })))] })), jsx(TextButton, Object.assign({ className: 'collect-user-data__log-out', onClick: () => handleLogOut() }, { children: "Log out" }))] }))] })));
+                                            'We need a bit of information to get started' }))] })))] })), jsx(TextButton, Object.assign({ className: 'collect-user-data__log-out', onClick: handleLogOut }, { children: "Log out" }))] }))] })));
 };
 
 export { CollectUserDataView };

package/src/lib/views/CollectUserDataView/OnboardingUserDataForm/OnboardingUserDataForm.cjs

@@ -41,6 +41,7 @@ var useUserUpdateRequest = require('../../../utils/hooks/useUserUpdateRequest/us
 require('../../../components/Popper/Popper/Popper.cjs');
 require('../../../components/Popper/PopperContext/PopperContext.cjs');
 require('yup');
+require('../../../components/InlineWidget/InlineWidget.cjs');
 var index = require('../UserDataFields/index.cjs');
 var useUserDataForm = require('../../../utils/hooks/useUserDataForm/useUserDataForm.cjs');
 

package/src/lib/views/CollectUserDataView/OnboardingUserDataForm/OnboardingUserDataForm.js

@@ -37,6 +37,7 @@ import { useUserUpdateRequestInternal } from '../../../utils/hooks/useUserUpdate
 import '../../../components/Popper/Popper/Popper.js';
 import '../../../components/Popper/PopperContext/PopperContext.js';
 import 'yup';
+import '../../../components/InlineWidget/InlineWidget.js';
 import { UserDataFields } from '../UserDataFields/index.js';
 import { useUserDataForm } from '../../../utils/hooks/useUserDataForm/useUserDataForm.js';
 

package/src/lib/views/CollectUserDataView/UserDataFields/index.cjs

@@ -43,6 +43,7 @@ require('../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 require('../../../components/Popper/Popper/Popper.cjs');
 require('../../../components/Popper/PopperContext/PopperContext.cjs');
 require('yup');
+require('../../../components/InlineWidget/InlineWidget.cjs');
 var fieldsConfig = require('../fieldsConfig.cjs');
 var getDisplayErrorMessage = require('./utils/getDisplayErrorMessage/getDisplayErrorMessage.cjs');
 

package/src/lib/views/CollectUserDataView/UserDataFields/index.js

@@ -39,6 +39,7 @@ import '../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../../components/Popper/Popper/Popper.js';
 import '../../../components/Popper/PopperContext/PopperContext.js';
 import 'yup';
+import '../../../components/InlineWidget/InlineWidget.js';
 import { fieldsConfig } from '../fieldsConfig.js';
 import { getDisplayErrorMessage } from './utils/getDisplayErrorMessage/getDisplayErrorMessage.js';
 

package/src/lib/views/CollectUserDataViewLoginWithEmail/CollectUserDataViewLoginWithEmail.cjs

@@ -41,6 +41,7 @@ require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('../../components/InlineWidget/InlineWidget.cjs');
 var OnboardingUserDataForm = require('../CollectUserDataView/OnboardingUserDataForm/OnboardingUserDataForm.cjs');
 
 const CollectUserDataViewLoginWithEmail = () => {
@@ -51,7 +52,7 @@ const CollectUserDataViewLoginWithEmail = () => {
     const userProfile = createUserProfile.createUserProfile(decodedOnboardingOnlyToken);
     return (jsxRuntime.jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email', "data-testid": 'collect-user-data-login-with-email' }, { children: [onboardingImageUrl && (jsxRuntime.jsx("img", { className: 'collect-user-data-login-with-email__main-img', src: onboardingImageUrl, alt: 'onboarding' })), jsxRuntime.jsx("div", Object.assign({ className: 'collect-user-data-login-with-email__icon-container' }, { children: jsxRuntime.jsx(iconic.UserProfileIcon, {}) })), jsxRuntime.jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email__form' }, { children: [jsxRuntime.jsx(OnboardingUserDataForm.OnboardingUserDataForm, Object.assign({ userProfile: userProfile }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email__welcome-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'title', color: 'primary', className: 'collect-user-data-login-with-email__welcome-title' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
                                         `Welcome to ${appName}` })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeMessage) ||
-                                        'We need a bit of information to get started' }))] })) })), jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'collect-user-data-login-with-email__log-out', onClick: () => handleLogOut() }, { children: "Log out" }))] }))] })));
+                                        'We need a bit of information to get started' }))] })) })), jsxRuntime.jsx(TextButton.TextButton, Object.assign({ className: 'collect-user-data-login-with-email__log-out', onClick: handleLogOut }, { children: "Log out" }))] }))] })));
 };
 
 exports.CollectUserDataViewLoginWithEmail = CollectUserDataViewLoginWithEmail;

package/src/lib/views/CollectUserDataViewLoginWithEmail/CollectUserDataViewLoginWithEmail.js

@@ -37,6 +37,7 @@ import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import '../../components/InlineWidget/InlineWidget.js';
 import { OnboardingUserDataForm } from '../CollectUserDataView/OnboardingUserDataForm/OnboardingUserDataForm.js';
 
 const CollectUserDataViewLoginWithEmail = () => {
@@ -47,7 +48,7 @@ const CollectUserDataViewLoginWithEmail = () => {
     const userProfile = createUserProfile(decodedOnboardingOnlyToken);
     return (jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email', "data-testid": 'collect-user-data-login-with-email' }, { children: [onboardingImageUrl && (jsx("img", { className: 'collect-user-data-login-with-email__main-img', src: onboardingImageUrl, alt: 'onboarding' })), jsx("div", Object.assign({ className: 'collect-user-data-login-with-email__icon-container' }, { children: jsx(UserProfileIcon, {}) })), jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email__form' }, { children: [jsx(OnboardingUserDataForm, Object.assign({ userProfile: userProfile }, { children: jsxs("div", Object.assign({ className: 'collect-user-data-login-with-email__welcome-container' }, { children: [jsx(Typography, Object.assign({ variant: 'title', color: 'primary', className: 'collect-user-data-login-with-email__welcome-title' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeHeader) ||
                                         `Welcome to ${appName}` })), jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general.collectUserDataWelcomeMessage) ||
-                                        'We need a bit of information to get started' }))] })) })), jsx(TextButton, Object.assign({ className: 'collect-user-data-login-with-email__log-out', onClick: () => handleLogOut() }, { children: "Log out" }))] }))] })));
+                                        'We need a bit of information to get started' }))] })) })), jsx(TextButton, Object.assign({ className: 'collect-user-data-login-with-email__log-out', onClick: handleLogOut }, { children: "Log out" }))] }))] })));
 };
 
 export { CollectUserDataViewLoginWithEmail };

package/src/lib/views/EmailConfirmationWaitingView/EmailConfirmationWaitingView.cjs

@@ -44,6 +44,7 @@ require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('../../components/InlineWidget/InlineWidget.cjs');
 
 const EmailConfirmationWaitingView = () => {
     const { setView } = ViewContext.useViewContext();

package/src/lib/views/EmailConfirmationWaitingView/EmailConfirmationWaitingView.js

@@ -40,6 +40,7 @@ import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import '../../components/InlineWidget/InlineWidget.js';
 
 const EmailConfirmationWaitingView = () => {
     const { setView } = useViewContext();

package/src/lib/views/EmailUpdate/EmailUpdate.cjs

@@ -43,6 +43,7 @@ require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('formik');
 require('yup');
+require('../../components/InlineWidget/InlineWidget.cjs');
 var EmailVerificationContext = require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 var LoadingContext = require('../../context/LoadingContext/LoadingContext.cjs');
 

package/src/lib/views/EmailUpdate/EmailUpdate.js

@@ -39,6 +39,7 @@ import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'formik';
 import 'yup';
+import '../../components/InlineWidget/InlineWidget.js';
 import { useEmailVerificationContext } from '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import { useLoadingContext } from '../../context/LoadingContext/LoadingContext.js';