@dynamic-labs/sdk-react-core 2.2.0-alpha.5 → 2.2.1

package/src/lib/utils/functions/createOwnerWallet/createOwnerWallet.cjs

@@ -34,6 +34,7 @@ const createOwnerWallet = (wallet, verifiedCredentials) => {
         connected: false,
         connector: eoaConnector,
         id: ownerAccount.id,
+        key: ownerAccount.walletName || eoaConnector.key,
     };
 };
 

package/src/lib/utils/functions/createOwnerWallet/createOwnerWallet.js

@@ -30,6 +30,7 @@ const createOwnerWallet = (wallet, verifiedCredentials) => {
         connected: false,
         connector: eoaConnector,
         id: ownerAccount.id,
+        key: ownerAccount.walletName || eoaConnector.key,
     };
 };
 

package/src/lib/utils/functions/isPhoneNumberProviderEnabled/index.d.ts

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

package/src/lib/utils/functions/walletListBuilder/utils/applyMultiWalletFilters/applyMultiWalletFilters.cjs

@@ -0,0 +1,24 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var filterConnectedWallets = require('../filterConnectedWallets/filterConnectedWallets.cjs');
+var staticLinkedWalletFilter = require('../staticLinkedWalletFilter/staticLinkedWalletFilter.cjs');
+var filterWalletConnectWallets = require('../filterWalletConnectWallets/filterWalletConnectWallets.cjs');
+
+const applyMultiWalletFilters = ({ authMode, userWallets, walletOptions, }) => {
+    const walletList = filterWalletConnectWallets.filterWalletConnectWallets({
+        userWallets,
+        walletOptions,
+    });
+    if (authMode === 'connect-only') {
+        return filterConnectedWallets.filterConnectedWallets({
+            userWallets,
+            walletOptions: walletList,
+        });
+    }
+    return staticLinkedWalletFilter.staticWalletFilter(userWallets, walletList);
+};
+
+exports.applyMultiWalletFilters = applyMultiWalletFilters;

package/src/lib/utils/functions/walletListBuilder/utils/applyMultiWalletFilters/applyMultiWalletFilters.d.ts

@@ -0,0 +1,6 @@
+import { AuthModeType, Wallet, WalletOption } from '../../../../../shared';
+export declare const applyMultiWalletFilters: ({ authMode, userWallets, walletOptions, }: {
+    authMode: AuthModeType;
+    userWallets: Wallet[];
+    walletOptions: WalletOption[];
+}) => WalletOption[];

package/src/lib/utils/functions/walletListBuilder/utils/applyMultiWalletFilters/applyMultiWalletFilters.js

@@ -0,0 +1,20 @@
+'use client'
+import { filterConnectedWallets } from '../filterConnectedWallets/filterConnectedWallets.js';
+import { staticWalletFilter } from '../staticLinkedWalletFilter/staticLinkedWalletFilter.js';
+import { filterWalletConnectWallets } from '../filterWalletConnectWallets/filterWalletConnectWallets.js';
+
+const applyMultiWalletFilters = ({ authMode, userWallets, walletOptions, }) => {
+    const walletList = filterWalletConnectWallets({
+        userWallets,
+        walletOptions,
+    });
+    if (authMode === 'connect-only') {
+        return filterConnectedWallets({
+            userWallets,
+            walletOptions: walletList,
+        });
+    }
+    return staticWalletFilter(userWallets, walletList);
+};
+
+export { applyMultiWalletFilters };

package/src/lib/utils/functions/walletListBuilder/utils/applyMultiWalletFilters/index.d.ts

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

package/src/lib/utils/functions/walletListBuilder/utils/filterConnectedWallets/filterConnectedWallets.cjs

@@ -8,8 +8,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
  * This is useful for connect-only multi-wallet, where we want users to only connect new wallets,
  * not additional accounts from the same wallet
  */
-const filterConnectedWallets = ({ walletOptions, connectedWallets, }) => {
-    const connectedWalletKeys = new Set(connectedWallets.map((connectedWallet) => connectedWallet.connector.key));
+const filterConnectedWallets = ({ walletOptions, userWallets, }) => {
+    const connectedWalletKeys = new Set(userWallets.map((connectedWallet) => connectedWallet.connector.key));
     /**
      * Phantom and Phantom Ledger are the same wallet, so we have to filter both of them
      * if one is present, because the next connection will not work, it will just connect the

package/src/lib/utils/functions/walletListBuilder/utils/filterConnectedWallets/filterConnectedWallets.d.ts

@@ -4,7 +4,7 @@ import { Wallet, WalletOption } from '../../../../../shared';
  * This is useful for connect-only multi-wallet, where we want users to only connect new wallets,
  * not additional accounts from the same wallet
  */
-export declare const filterConnectedWallets: ({ walletOptions, connectedWallets, }: {
+export declare const filterConnectedWallets: ({ walletOptions, userWallets, }: {
     walletOptions: WalletOption[];
-    connectedWallets: Wallet[];
+    userWallets: Wallet[];
 }) => WalletOption[];

package/src/lib/utils/functions/walletListBuilder/utils/filterConnectedWallets/filterConnectedWallets.js

@@ -4,8 +4,8 @@
  * This is useful for connect-only multi-wallet, where we want users to only connect new wallets,
  * not additional accounts from the same wallet
  */
-const filterConnectedWallets = ({ walletOptions, connectedWallets, }) => {
-    const connectedWalletKeys = new Set(connectedWallets.map((connectedWallet) => connectedWallet.connector.key));
+const filterConnectedWallets = ({ walletOptions, userWallets, }) => {
+    const connectedWalletKeys = new Set(userWallets.map((connectedWallet) => connectedWallet.connector.key));
     /**
      * Phantom and Phantom Ledger are the same wallet, so we have to filter both of them
      * if one is present, because the next connection will not work, it will just connect the

package/src/lib/utils/functions/walletListBuilder/utils/filterWalletConnectWallets/filterWalletConnectWallets.cjs

@@ -0,0 +1,20 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+/**
+ * Used to filter out WalletConnect wallets if user has already a WalletConnect wallet connected/linked
+ * This is useful for multi-wallet on mobile, since WalletConnect doesn't work very well with multiwallet
+ */
+const filterWalletConnectWallets = ({ walletOptions, userWallets, }) => {
+    const hasWCWallet = userWallets.some((wallet) => wallet.connector.isWalletConnect);
+    // user doesn't have any WalletConnect wallet connected/linked, so we don't need to filter anything
+    if (!hasWCWallet) {
+        return walletOptions;
+    }
+    // filter out WalletConnect wallets
+    return walletOptions.filter((walletOption) => !walletOption.walletConnector.isWalletConnect);
+};
+
+exports.filterWalletConnectWallets = filterWalletConnectWallets;

package/src/lib/utils/functions/walletListBuilder/utils/filterWalletConnectWallets/filterWalletConnectWallets.d.ts

@@ -0,0 +1,9 @@
+import { Wallet, WalletOption } from '../../../../../shared';
+/**
+ * Used to filter out WalletConnect wallets if user has already a WalletConnect wallet connected/linked
+ * This is useful for multi-wallet on mobile, since WalletConnect doesn't work very well with multiwallet
+ */
+export declare const filterWalletConnectWallets: ({ walletOptions, userWallets, }: {
+    walletOptions: WalletOption[];
+    userWallets: Wallet[];
+}) => WalletOption[];

package/src/lib/utils/functions/walletListBuilder/utils/filterWalletConnectWallets/filterWalletConnectWallets.js

@@ -0,0 +1,16 @@
+'use client'
+/**
+ * Used to filter out WalletConnect wallets if user has already a WalletConnect wallet connected/linked
+ * This is useful for multi-wallet on mobile, since WalletConnect doesn't work very well with multiwallet
+ */
+const filterWalletConnectWallets = ({ walletOptions, userWallets, }) => {
+    const hasWCWallet = userWallets.some((wallet) => wallet.connector.isWalletConnect);
+    // user doesn't have any WalletConnect wallet connected/linked, so we don't need to filter anything
+    if (!hasWCWallet) {
+        return walletOptions;
+    }
+    // filter out WalletConnect wallets
+    return walletOptions.filter((walletOption) => !walletOption.walletConnector.isWalletConnect);
+};
+
+export { filterWalletConnectWallets };

package/src/lib/utils/functions/walletListBuilder/utils/filterWalletConnectWallets/index.d.ts

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

package/src/lib/utils/functions/walletListBuilder/utils/staticLinkedWalletFilter/index.d.ts

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

package/src/lib/utils/functions/walletListBuilder/utils/staticLinkedWalletFilter/staticLinkedWalletFilter.cjs

@@ -0,0 +1,30 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+/**
+ * These wallets do not fire events when switching accounts, so we should filter
+ * them out of the wallet list if they are already linked to the user profile.
+ */
+const staticListToFilter = [
+    'xverse',
+    'magiceden',
+    'magicedenbtc',
+    'magicedensol',
+];
+/**
+ * This function is a helper to filter out wallets that should not appear in the wallet list
+ * if they are already linked to the user profile.
+ */
+const staticWalletFilter = (linkedWallets, walletOptions) => walletOptions.filter((walletOption) => {
+    if (!staticListToFilter.includes(walletOption.key)) {
+        return true;
+    }
+    if (linkedWallets.some((wallet) => wallet.connector.key === walletOption.key)) {
+        return false;
+    }
+    return true;
+});
+
+exports.staticWalletFilter = staticWalletFilter;

package/src/lib/utils/functions/walletListBuilder/utils/staticLinkedWalletFilter/staticLinkedWalletFilter.d.ts

@@ -0,0 +1,6 @@
+import { Wallet, WalletOption } from '../../../../../shared';
+/**
+ * This function is a helper to filter out wallets that should not appear in the wallet list
+ * if they are already linked to the user profile.
+ */
+export declare const staticWalletFilter: (linkedWallets: Wallet[], walletOptions: WalletOption[]) => WalletOption[];

package/src/lib/utils/functions/walletListBuilder/utils/staticLinkedWalletFilter/staticLinkedWalletFilter.js

@@ -0,0 +1,26 @@
+'use client'
+/**
+ * These wallets do not fire events when switching accounts, so we should filter
+ * them out of the wallet list if they are already linked to the user profile.
+ */
+const staticListToFilter = [
+    'xverse',
+    'magiceden',
+    'magicedenbtc',
+    'magicedensol',
+];
+/**
+ * This function is a helper to filter out wallets that should not appear in the wallet list
+ * if they are already linked to the user profile.
+ */
+const staticWalletFilter = (linkedWallets, walletOptions) => walletOptions.filter((walletOption) => {
+    if (!staticListToFilter.includes(walletOption.key)) {
+        return true;
+    }
+    if (linkedWallets.some((wallet) => wallet.connector.key === walletOption.key)) {
+        return false;
+    }
+    return true;
+});
+
+export { staticWalletFilter };

package/src/lib/utils/functions/walletListBuilder/walletListBuilder.cjs

@@ -6,7 +6,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
 var getCalculatedOffset = require('./utils/getCalculatedOffset/getCalculatedOffset.cjs');
 var groupWalletOptions = require('./utils/groupWalletOptions/groupWalletOptions.cjs');
-var filterConnectedWallets = require('./utils/filterConnectedWallets/filterConnectedWallets.cjs');
+var applyMultiWalletFilters = require('./utils/applyMultiWalletFilters/applyMultiWalletFilters.cjs');
 
 const PRIORITY_WALLET_LIST = [
     'metamask',
@@ -56,15 +56,16 @@ const sortedInputList = (inputList, recommendedWalletKeys) => {
         ...unsortedOtherWallets,
     ];
 };
-const walletListBuilder = ({ authMode, connectedWallets, multiWallet, numberOfWalletsToShow, inputList, isWalletConnectList, lastUsedWalletKey, signWithEmailWalletName, searchFilter, walletsFilter, loginWithEmail, groupWallets, walletBook, showMoreWalletsWithFilter, recommendedWallets, }) => {
+const walletListBuilder = ({ authMode, userWallets, multiWallet, numberOfWalletsToShow, inputList, isWalletConnectList, lastUsedWalletKey, signWithEmailWalletName, searchFilter, walletsFilter, loginWithEmail, groupWallets, walletBook, showMoreWalletsWithFilter, recommendedWallets, }) => {
     let walletList = inputList;
     if (isWalletConnectList) {
         walletList = inputList.filter((wallet) => wallet.walletConnector.isWalletConnect &&
             wallet.key !== 'walletconnect');
     }
-    if (authMode === 'connect-only' && multiWallet) {
-        walletList = filterConnectedWallets.filterConnectedWallets({
-            connectedWallets,
+    if (multiWallet) {
+        walletList = applyMultiWalletFilters.applyMultiWalletFilters({
+            authMode,
+            userWallets,
             walletOptions: walletList,
         });
     }
@@ -81,7 +82,8 @@ const walletListBuilder = ({ authMode, connectedWallets, multiWallet, numberOfWa
         if (walletConnectorCore.isEmbeddedConnector(wallet.walletConnector)) {
             return;
         }
-        else if (wallet.key === 'unknown') {
+        else if (wallet.key === 'unknown' ||
+            !wallet.walletConnector.isAvailable) {
             return;
         }
         else if (isRecommendedWallet) {

package/src/lib/utils/functions/walletListBuilder/walletListBuilder.d.ts

@@ -2,7 +2,7 @@ import { WalletBookSchema } from '@dynamic-labs/wallet-book';
 import { AuthModeType, RecommendedWallet, Wallet, WalletOption } from '../../../shared/types';
 type BuilderParams = {
     authMode: AuthModeType;
-    connectedWallets: Wallet[];
+    userWallets: Wallet[];
     multiWallet: boolean;
     inputList: WalletOption[];
     isWalletConnectList: boolean;
@@ -23,7 +23,7 @@ type BuilderResult = {
 };
 export declare const PRIORITY_WALLET_LIST: string[];
 export declare const SIGN_IN_WITH_EMAIL_WALLET_NAME = "Sign In With Email";
-export declare const walletListBuilder: ({ authMode, connectedWallets, multiWallet, numberOfWalletsToShow, inputList, isWalletConnectList, lastUsedWalletKey, signWithEmailWalletName, searchFilter, walletsFilter, loginWithEmail, groupWallets, walletBook, showMoreWalletsWithFilter, recommendedWallets, }: BuilderParams) => BuilderResult;
+export declare const walletListBuilder: ({ authMode, userWallets, multiWallet, numberOfWalletsToShow, inputList, isWalletConnectList, lastUsedWalletKey, signWithEmailWalletName, searchFilter, walletsFilter, loginWithEmail, groupWallets, walletBook, showMoreWalletsWithFilter, recommendedWallets, }: BuilderParams) => BuilderResult;
 /**
  * This calculation adds an offset to numberOfWalletsToShow so we will show the
  * intended wallets + installed and last used.

package/src/lib/utils/functions/walletListBuilder/walletListBuilder.js

@@ -2,7 +2,7 @@
 import { isEmbeddedConnector } from '@dynamic-labs/wallet-connector-core';
 import { getCalculatedOffset } from './utils/getCalculatedOffset/getCalculatedOffset.js';
 import { groupWalletOptions } from './utils/groupWalletOptions/groupWalletOptions.js';
-import { filterConnectedWallets } from './utils/filterConnectedWallets/filterConnectedWallets.js';
+import { applyMultiWalletFilters } from './utils/applyMultiWalletFilters/applyMultiWalletFilters.js';
 
 const PRIORITY_WALLET_LIST = [
     'metamask',
@@ -52,15 +52,16 @@ const sortedInputList = (inputList, recommendedWalletKeys) => {
         ...unsortedOtherWallets,
     ];
 };
-const walletListBuilder = ({ authMode, connectedWallets, multiWallet, numberOfWalletsToShow, inputList, isWalletConnectList, lastUsedWalletKey, signWithEmailWalletName, searchFilter, walletsFilter, loginWithEmail, groupWallets, walletBook, showMoreWalletsWithFilter, recommendedWallets, }) => {
+const walletListBuilder = ({ authMode, userWallets, multiWallet, numberOfWalletsToShow, inputList, isWalletConnectList, lastUsedWalletKey, signWithEmailWalletName, searchFilter, walletsFilter, loginWithEmail, groupWallets, walletBook, showMoreWalletsWithFilter, recommendedWallets, }) => {
     let walletList = inputList;
     if (isWalletConnectList) {
         walletList = inputList.filter((wallet) => wallet.walletConnector.isWalletConnect &&
             wallet.key !== 'walletconnect');
     }
-    if (authMode === 'connect-only' && multiWallet) {
-        walletList = filterConnectedWallets({
-            connectedWallets,
+    if (multiWallet) {
+        walletList = applyMultiWalletFilters({
+            authMode,
+            userWallets,
             walletOptions: walletList,
         });
     }
@@ -77,7 +78,8 @@ const walletListBuilder = ({ authMode, connectedWallets, multiWallet, numberOfWa
         if (isEmbeddedConnector(wallet.walletConnector)) {
             return;
         }
-        else if (wallet.key === 'unknown') {
+        else if (wallet.key === 'unknown' ||
+            !wallet.walletConnector.isAvailable) {
             return;
         }
         else if (isRecommendedWallet) {

package/src/lib/utils/hooks/authenticationHooks/useConnectAndSign/useConnectAndSign.cjs

@@ -51,7 +51,6 @@ require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs')
 require('@dynamic-labs/rpc-providers');
 require('../../../../context/UserWalletsContext/UserWalletsContext.cjs');
 require('react-i18next');
-require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../../components/Alert/Alert.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../components/IconButton/IconButton.cjs');

package/src/lib/utils/hooks/authenticationHooks/useConnectAndSign/useConnectAndSign.js

@@ -47,7 +47,6 @@ import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../context/UserWalletsContext/UserWalletsContext.js';
 import 'react-i18next';
-import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../../components/Alert/Alert.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../components/IconButton/IconButton.js';

package/src/lib/utils/hooks/authenticationHooks/useConnectAndSignSplitSteps/useConnectAndSignSplitSteps.cjs

@@ -51,7 +51,6 @@ require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs')
 require('@dynamic-labs/rpc-providers');
 require('../../../../context/UserWalletsContext/UserWalletsContext.cjs');
 require('react-i18next');
-require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../../components/Alert/Alert.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../components/IconButton/IconButton.cjs');

package/src/lib/utils/hooks/authenticationHooks/useConnectAndSignSplitSteps/useConnectAndSignSplitSteps.js

@@ -47,7 +47,6 @@ import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../context/UserWalletsContext/UserWalletsContext.js';
 import 'react-i18next';
-import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../../components/Alert/Alert.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../components/IconButton/IconButton.js';

package/src/lib/utils/hooks/authenticationHooks/useOtpVerificationRequest/useOtpVerificationRequest.cjs

@@ -50,7 +50,6 @@ require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs')
 require('@dynamic-labs/store');
 require('@dynamic-labs/rpc-providers');
 require('react-i18next');
-require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../../components/Alert/Alert.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../components/IconButton/IconButton.cjs');

package/src/lib/utils/hooks/authenticationHooks/useOtpVerificationRequest/useOtpVerificationRequest.js

@@ -46,7 +46,6 @@ import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/store';
 import '@dynamic-labs/rpc-providers';
 import 'react-i18next';
-import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../../components/Alert/Alert.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../components/IconButton/IconButton.js';

package/src/lib/utils/hooks/authenticationHooks/useSignConnectOnlyUser/useSignConnectOnlyUser.cjs

@@ -45,7 +45,6 @@ require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs')
 require('@dynamic-labs/rpc-providers');
 require('../../../../context/UserWalletsContext/UserWalletsContext.cjs');
 require('react-i18next');
-require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../../components/Alert/Alert.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../components/IconButton/IconButton.cjs');

package/src/lib/utils/hooks/authenticationHooks/useSignConnectOnlyUser/useSignConnectOnlyUser.js

@@ -41,7 +41,6 @@ import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import '../../../../context/UserWalletsContext/UserWalletsContext.js';
 import 'react-i18next';
-import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../../components/Alert/Alert.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../components/IconButton/IconButton.js';

package/src/lib/utils/hooks/events/useDynamicEvents/useDynamicEvents.cjs

@@ -18,5 +18,25 @@ const useInternalDynamicEvents = (event, listener) => {
         };
     }, [event]);
 };
+// ATTENTION
+// Everything below should be made public soon, but we need to plan this out first
+// Main issues:
+// 1. How should we map customer callback names to our dynamic event names?
+//  -> Gui's suggestion: breaking change to rename customer callbacks so they fit these events names
+// 2. We would have to remove these callbacks from the useCustomerCallbacks hook
+/** Which events are accessible by our clients */
+const externalEvents = [
+    'emailVerificationResult',
+    'embeddedWalletCreated',
+    'logout',
+    'walletAdded',
+];
+/** Allows subscribing to dynamic events directly inside components with a hook */
+const useDynamicEvents = (event, listener) => {
+    if (!externalEvents.includes(event))
+        throw new Error(`Unrecognized event "${event}" used with useDynamicEvents`);
+    useInternalDynamicEvents(event, listener);
+};
 
+exports.useDynamicEvents = useDynamicEvents;
 exports.useInternalDynamicEvents = useInternalDynamicEvents;

package/src/lib/utils/hooks/events/useDynamicEvents/useDynamicEvents.d.ts

@@ -4,5 +4,5 @@ type DynamicEventListener<E extends keyof DynamicEvents> = (...args: EventArgs<D
 /** Allows us to subscribe to all dynamicEvents with a hook, even the internal ones */
 export declare const useInternalDynamicEvents: <E extends keyof import("../../../../events/auth").AuthEvents | keyof import("../../../../events/ui").UIEvents | keyof import("../../../../events/otp").OTPEvents | keyof import("../../../../events/wallets").WalletEvents | keyof import("../../../../events/passkey").PasskeyEvents | "farcasterConnectCancelled" | keyof import("../../../../events/embeddedWallet").EmbeddedWalletEvents>(event: E, listener: DynamicEventListener<E>) => void;
 /** Allows subscribing to dynamic events directly inside components with a hook */
-export declare const useDynamicEvents: <E extends "logout" | "emailVerificationResult" | "embeddedWalletCreated">(event: E, listener: DynamicEventListener<E>) => void;
+export declare const useDynamicEvents: <E extends "logout" | "emailVerificationResult" | "walletAdded" | "embeddedWalletCreated">(event: E, listener: DynamicEventListener<E>) => void;
 export {};

package/src/lib/utils/hooks/events/useDynamicEvents/useDynamicEvents.js

@@ -14,5 +14,24 @@ const useInternalDynamicEvents = (event, listener) => {
         };
     }, [event]);
 };
+// ATTENTION
+// Everything below should be made public soon, but we need to plan this out first
+// Main issues:
+// 1. How should we map customer callback names to our dynamic event names?
+//  -> Gui's suggestion: breaking change to rename customer callbacks so they fit these events names
+// 2. We would have to remove these callbacks from the useCustomerCallbacks hook
+/** Which events are accessible by our clients */
+const externalEvents = [
+    'emailVerificationResult',
+    'embeddedWalletCreated',
+    'logout',
+    'walletAdded',
+];
+/** Allows subscribing to dynamic events directly inside components with a hook */
+const useDynamicEvents = (event, listener) => {
+    if (!externalEvents.includes(event))
+        throw new Error(`Unrecognized event "${event}" used with useDynamicEvents`);
+    useInternalDynamicEvents(event, listener);
+};
 
-export { useInternalDynamicEvents };
+export { useDynamicEvents, useInternalDynamicEvents };

package/src/lib/utils/hooks/multiWallet/useSyncPrimaryWallet/useSyncPrimaryWallet.cjs

@@ -46,7 +46,6 @@ require('../../../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('react-i18next');
-require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../../components/Alert/Alert.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../components/IconButton/IconButton.cjs');

package/src/lib/utils/hooks/multiWallet/useSyncPrimaryWallet/useSyncPrimaryWallet.js

@@ -42,7 +42,6 @@ import '../../../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import 'react-i18next';
-import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../../components/Alert/Alert.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../components/IconButton/IconButton.js';

package/src/lib/utils/hooks/multiWallet/useVerifyOnAwaitingSignature/useVerifyOnAwaitingSignature.cjs

@@ -47,7 +47,6 @@ require('../../../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('react-i18next');
-require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../../components/Alert/Alert.cjs');
 require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../components/IconButton/IconButton.cjs');

package/src/lib/utils/hooks/multiWallet/useVerifyOnAwaitingSignature/useVerifyOnAwaitingSignature.js

@@ -43,7 +43,6 @@ import '../../../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import 'react-i18next';
-import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../../components/Alert/Alert.js';
 import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../components/IconButton/IconButton.js';

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

@@ -45,7 +45,6 @@ require('../../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('react-i18next');
-require('../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../components/Alert/Alert.cjs');
 require('../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../components/IconButton/IconButton.cjs');

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

@@ -41,7 +41,6 @@ import '../../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import 'react-i18next';
-import '../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../components/Alert/Alert.js';
 import '../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../components/IconButton/IconButton.js';

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

@@ -46,7 +46,6 @@ require('../../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('react-i18next');
-require('../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../components/Alert/Alert.cjs');
 require('../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../components/IconButton/IconButton.cjs');

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

@@ -42,7 +42,6 @@ import '../../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import 'react-i18next';
-import '../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../components/Alert/Alert.js';
 import '../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../components/IconButton/IconButton.js';

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

@@ -103,6 +103,7 @@ const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingO
                 connected: true,
                 connector: walletConnector,
                 id: storedConnectedWalletInfo.id,
+                key: walletConnector.key,
                 network: walletNetwork,
             };
             return walletObject;

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

@@ -99,6 +99,7 @@ const useConnectWallet = ({ authMode, clearPrimaryWalletId, enableVisitTrackingO
                 connected: true,
                 connector: walletConnector,
                 id: storedConnectedWalletInfo.id,
+                key: walletConnector.key,
                 network: walletNetwork,
             };
             return walletObject;

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

@@ -48,7 +48,6 @@ require('../../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('react-i18next');
-require('../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../components/Alert/Alert.cjs');
 require('../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../components/IconButton/IconButton.cjs');

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

@@ -44,7 +44,6 @@ import '../../../context/FieldsStateContext/FieldsStateContext.js';
 import '../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import 'react-i18next';
-import '../../../components/Accordion/components/AccordionItem/AccordionItem.js';
 import '../../../components/Alert/Alert.js';
 import '../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../components/IconButton/IconButton.js';

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

@@ -51,7 +51,6 @@ require('../../../context/FieldsStateContext/FieldsStateContext.cjs');
 require('../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('react-i18next');
-require('../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
 require('../../../components/Alert/Alert.cjs');
 require('../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../components/IconButton/IconButton.cjs');
@@ -120,6 +119,7 @@ const useCreateDynamicEmbeddedWalletMutation = () => {
                 connected: true,
                 connector: walletConnector,
                 id: embeddedWalletVerifiedCredential.id,
+                key: embeddedWalletVerifiedCredential.walletName || walletConnector.key,
             };
             const smartWallet$1 = smartWallet.findSmartWallet(embeddedWalletVerifiedCredential, updatedUser.verifiedCredentials);
             if (!smartWallet$1) {