@dynamic-labs/sdk-react-core 2.1.0-alpha.15 → 2.1.0-alpha.16

package/src/lib/views/MfaDisplayBackupCodesView/index.d.ts

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

package/src/lib/views/MfaVerificationView/MfaVerificationView.cjs

@@ -15,7 +15,7 @@ require('@dynamic-labs/sdk-api-core');
 require('../../shared/logger.cjs');
 require('@dynamic-labs/iconic');
 require('@dynamic-labs/wallet-connector-core');
-require('../../context/ViewContext/ViewContext.cjs');
+var ViewContext = require('../../context/ViewContext/ViewContext.cjs');
 var passwordHero = require('../../shared/assets/password-hero.cjs');
 require('@dynamic-labs/wallet-book');
 require('../../utils/constants/colors.cjs');
@@ -79,6 +79,7 @@ require('../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/
 
 const MfaVerificationView = ({ type }) => {
     const { t } = reactI18next.useTranslation();
+    const { setView } = ViewContext.useViewContext();
     const { authDevice } = useMfa.useMfa();
     const [code, setCode] = React.useState('');
     const [error, setError] = React.useState();
@@ -90,8 +91,7 @@ const MfaVerificationView = ({ type }) => {
         },
         onResolve: () => _tslib.__awaiter(void 0, void 0, void 0, function* () {
             yield utils.sleep(1500);
-            // TODO: add this back when the view is added
-            //setView('mfa-display-backup-codes');
+            setView('mfa-display-backup-codes');
         }),
     });
     const onCodeChange = (code) => {

package/src/lib/views/MfaVerificationView/MfaVerificationView.js

@@ -11,7 +11,7 @@ import '@dynamic-labs/sdk-api-core';
 import '../../shared/logger.js';
 import '@dynamic-labs/iconic';
 import '@dynamic-labs/wallet-connector-core';
-import '../../context/ViewContext/ViewContext.js';
+import { useViewContext } from '../../context/ViewContext/ViewContext.js';
 import { ReactComponent as SvgPasswordHero } from '../../shared/assets/password-hero.js';
 import '@dynamic-labs/wallet-book';
 import '../../utils/constants/colors.js';
@@ -75,6 +75,7 @@ import '../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/P
 
 const MfaVerificationView = ({ type }) => {
     const { t } = useTranslation();
+    const { setView } = useViewContext();
     const { authDevice } = useMfa();
     const [code, setCode] = useState('');
     const [error, setError] = useState();
@@ -86,8 +87,7 @@ const MfaVerificationView = ({ type }) => {
         },
         onResolve: () => __awaiter(void 0, void 0, void 0, function* () {
             yield sleep(1500);
-            // TODO: add this back when the view is added
-            //setView('mfa-display-backup-codes');
+            setView('mfa-display-backup-codes');
         }),
     });
     const onCodeChange = (code) => {

package/src/lib/views/WalletList/WalletListGridTabs/WalletListGridTabs.cjs

@@ -79,7 +79,7 @@ require('../../LoginView/sections/PhoneNumberSignInSection/PhoneNumberSignInSect
 const WalletListGridTabs = ({ items, onSelect, value, }) => (jsxRuntime.jsx("div", { className: 'wallet-list-grid-tabs', children: items.map((item, index) => {
         const selected = value === index;
         const { icon, text } = item.label;
-        const key = `${text}-${icon}`;
+        const key = `${text}-${icon}-${items.indexOf(item)}`;
         const TabIcon = typeof icon === 'string' ? jsxRuntime.jsx("img", { src: icon, alt: text }) : icon;
         return (jsxRuntime.jsxs("button", { type: 'button', className: classNames.classNames('wallet-list-grid-tabs__button', {
                 'wallet-list-grid-tabs__button--selected': selected,

package/src/lib/views/WalletList/WalletListGridTabs/WalletListGridTabs.js

@@ -75,7 +75,7 @@ import '../../LoginView/sections/PhoneNumberSignInSection/PhoneNumberSignInSecti
 const WalletListGridTabs = ({ items, onSelect, value, }) => (jsx("div", { className: 'wallet-list-grid-tabs', children: items.map((item, index) => {
         const selected = value === index;
         const { icon, text } = item.label;
-        const key = `${text}-${icon}`;
+        const key = `${text}-${icon}-${items.indexOf(item)}`;
         const TabIcon = typeof icon === 'string' ? jsx("img", { src: icon, alt: text }) : icon;
         return (jsxs("button", { type: 'button', className: classNames('wallet-list-grid-tabs__button', {
                 'wallet-list-grid-tabs__button--selected': selected,

package/src/lib/views/WalletList/hooks/useTabState.cjs

@@ -19,6 +19,7 @@ require('../../../utils/constants/colors.cjs');
 require('../../../utils/constants/values.cjs');
 require('../../../shared/utils/classes/storage/localStorage.cjs');
 require('../../../shared/consts/index.cjs');
+var useInternalDynamicContext = require('../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.cjs');
 require('../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../context/ErrorContext/ErrorContext.cjs');
 require('@dynamic-labs/multi-wallet');
@@ -73,11 +74,13 @@ require('../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 require('../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
 var useViewSettings = require('../../../utils/hooks/useViewSettings/useViewSettings.cjs');
+var getInitialTabIndex = require('../utils/getInitialTabIndex/getInitialTabIndex.cjs');
 
 const useTabState = () => {
     var _a, _b;
+    const { defaultTabIndex } = useInternalDynamicContext.useInternalDynamicContext();
     const walletListViewSettings = useViewSettings.useViewSettings('wallet-list');
-    const [selectedTabIndex, setSelectedTabIndex] = React.useState(() => { var _a; return ((_a = walletListViewSettings === null || walletListViewSettings === void 0 ? void 0 : walletListViewSettings.tabs) === null || _a === void 0 ? void 0 : _a.items.length) ? 0 : null; });
+    const [selectedTabIndex, setSelectedTabIndex] = React.useState(() => getInitialTabIndex.getInitialTabIndex(walletListViewSettings, defaultTabIndex));
     const selectedTabSettings = selectedTabIndex === null
         ? undefined
         : (_a = walletListViewSettings === null || walletListViewSettings === void 0 ? void 0 : walletListViewSettings.tabs) === null || _a === void 0 ? void 0 : _a.items[selectedTabIndex];

package/src/lib/views/WalletList/hooks/useTabState.js

@@ -15,6 +15,7 @@ import '../../../utils/constants/colors.js';
 import '../../../utils/constants/values.js';
 import '../../../shared/utils/classes/storage/localStorage.js';
 import '../../../shared/consts/index.js';
+import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext.js';
 import '../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../context/ErrorContext/ErrorContext.js';
 import '@dynamic-labs/multi-wallet';
@@ -69,11 +70,13 @@ import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import '../../../widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
 import { useViewSettings } from '../../../utils/hooks/useViewSettings/useViewSettings.js';
+import { getInitialTabIndex } from '../utils/getInitialTabIndex/getInitialTabIndex.js';
 
 const useTabState = () => {
     var _a, _b;
+    const { defaultTabIndex } = useInternalDynamicContext();
     const walletListViewSettings = useViewSettings('wallet-list');
-    const [selectedTabIndex, setSelectedTabIndex] = useState(() => { var _a; return ((_a = walletListViewSettings === null || walletListViewSettings === void 0 ? void 0 : walletListViewSettings.tabs) === null || _a === void 0 ? void 0 : _a.items.length) ? 0 : null; });
+    const [selectedTabIndex, setSelectedTabIndex] = useState(() => getInitialTabIndex(walletListViewSettings, defaultTabIndex));
     const selectedTabSettings = selectedTabIndex === null
         ? undefined
         : (_a = walletListViewSettings === null || walletListViewSettings === void 0 ? void 0 : walletListViewSettings.tabs) === null || _a === void 0 ? void 0 : _a.items[selectedTabIndex];

package/src/lib/views/WalletList/utils/getInitialTabIndex/getInitialTabIndex.cjs

@@ -0,0 +1,22 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const getInitialTabIndex = (walletListViewSettings, defaultTabIndex) => {
+    var _a, _b, _c, _d;
+    if (!walletListViewSettings) {
+        return null;
+    }
+    if (!((_b = (_a = walletListViewSettings.tabs) === null || _a === void 0 ? void 0 : _a.items) === null || _b === void 0 ? void 0 : _b.length)) {
+        return null;
+    }
+    if (defaultTabIndex < 0) {
+        return 0;
+    }
+    const lastIndex = ((_d = (_c = walletListViewSettings.tabs) === null || _c === void 0 ? void 0 : _c.items.length) !== null && _d !== void 0 ? _d : 1) - 1;
+    const initialTabIndex = Math.min(lastIndex, defaultTabIndex);
+    return initialTabIndex;
+};
+
+exports.getInitialTabIndex = getInitialTabIndex;

package/src/lib/views/WalletList/utils/getInitialTabIndex/getInitialTabIndex.d.ts

@@ -0,0 +1,2 @@
+import { WalletListViewSettings } from '../../../../context/DynamicContext/types';
+export declare const getInitialTabIndex: (walletListViewSettings: WalletListViewSettings | undefined, defaultTabIndex: number) => number | null;

package/src/lib/views/WalletList/utils/getInitialTabIndex/getInitialTabIndex.js

@@ -0,0 +1,18 @@
+'use client'
+const getInitialTabIndex = (walletListViewSettings, defaultTabIndex) => {
+    var _a, _b, _c, _d;
+    if (!walletListViewSettings) {
+        return null;
+    }
+    if (!((_b = (_a = walletListViewSettings.tabs) === null || _a === void 0 ? void 0 : _a.items) === null || _b === void 0 ? void 0 : _b.length)) {
+        return null;
+    }
+    if (defaultTabIndex < 0) {
+        return 0;
+    }
+    const lastIndex = ((_d = (_c = walletListViewSettings.tabs) === null || _c === void 0 ? void 0 : _c.items.length) !== null && _d !== void 0 ? _d : 1) - 1;
+    const initialTabIndex = Math.min(lastIndex, defaultTabIndex);
+    return initialTabIndex;
+};
+
+export { getInitialTabIndex };

package/src/lib/views/WalletList/utils/getInitialTabIndex/index.d.ts

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

package/src/lib/views/viewToComponentMap.cjs

@@ -115,6 +115,7 @@ var WalletLockedView = require('./WalletLockedView/WalletLockedView.cjs');
 var WalletRedirectView = require('./WalletRedirectView/WalletRedirectView.cjs');
 var WalletSignSpinnerView = require('./WalletSignSpinnerView/WalletSignSpinnerView.cjs');
 var WalletUsedView = require('./WalletUsedView/WalletUsedView.cjs');
+var MfaDisplayBackupCodesView = require('./MfaDisplayBackupCodesView/MfaDisplayBackupCodesView.cjs');
 var MfaVerificationView = require('./MfaVerificationView/MfaVerificationView.cjs');
 var PasskeyNewDomainDetectedView = require('./Passkey/PasskeyNewDomainDetectedView/PasskeyNewDomainDetectedView.cjs');
 
@@ -143,6 +144,7 @@ const viewToComponentMap = {
     'merge-user-accounts-conflicts': MergeUserAccountsConflictsView.MergeUserAccountsConflictsView,
     'merge-user-accounts-with-same-email': MergeUserAccountsWithSameEmailView.MergeUserAccountsWithSameEmailView,
     'mfa-choose-device': MfaChooseDeviceView.MfaChooseDeviceView,
+    'mfa-display-backup-codes': MfaDisplayBackupCodesView.MfaDisplayBackupCodesView,
     'mfa-secure-device': MfaSecureDeviceView.MfaSecureDeviceView,
     'mfa-verification': MfaVerificationView.MfaVerificationView,
     'multi-wallet-wallet-list': WalletList.WalletList,

package/src/lib/views/viewToComponentMap.d.ts

@@ -27,6 +27,7 @@ export declare const viewToComponentMap: {
     'merge-user-accounts-conflicts': import("react").FC<import("./MergeUserAccountsConflictsView/MergeUserAccountsConflictsView").MergeUserAccountsConflictsViewProps>;
     'merge-user-accounts-with-same-email': import("react").FC<import("./MergeUserAccountsWithSameEmailView/MergeUserAccountsWithSameEmailView").MergeUserAccountsWithSameEmailViewProps>;
     'mfa-choose-device': () => JSX.Element;
+    'mfa-display-backup-codes': () => JSX.Element;
     'mfa-secure-device': ({ type }: import("./MfaSecureDeviceView").MfaSecureDeviceViewProps) => JSX.Element;
     'mfa-verification': ({ type }: import("./MfaVerificationView").MfaVerificationViewProps) => JSX.Element;
     'multi-wallet-wallet-list': ({ isWalletConnectList, }: import("./WalletList").WalletListProps) => JSX.Element;

package/src/lib/views/viewToComponentMap.js

@@ -111,6 +111,7 @@ import { WalletLockedView } from './WalletLockedView/WalletLockedView.js';
 import { WalletRedirectView } from './WalletRedirectView/WalletRedirectView.js';
 import { WalletSignSpinnerView } from './WalletSignSpinnerView/WalletSignSpinnerView.js';
 import { WalletUsedView } from './WalletUsedView/WalletUsedView.js';
+import { MfaDisplayBackupCodesView } from './MfaDisplayBackupCodesView/MfaDisplayBackupCodesView.js';
 import { MfaVerificationView } from './MfaVerificationView/MfaVerificationView.js';
 import { PasskeyNewDomainDetectedView } from './Passkey/PasskeyNewDomainDetectedView/PasskeyNewDomainDetectedView.js';
 
@@ -139,6 +140,7 @@ const viewToComponentMap = {
     'merge-user-accounts-conflicts': MergeUserAccountsConflictsView,
     'merge-user-accounts-with-same-email': MergeUserAccountsWithSameEmailView,
     'mfa-choose-device': MfaChooseDeviceView,
+    'mfa-display-backup-codes': MfaDisplayBackupCodesView,
     'mfa-secure-device': MfaSecureDeviceView,
     'mfa-verification': MfaVerificationView,
     'multi-wallet-wallet-list': WalletList,

package/src/lib/shared/utils/functions/validateType/index.d.ts

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

package/src/lib/shared/utils/functions/validateType/validateType.cjs

@@ -1,30 +0,0 @@
-'use client'
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const validateType = (
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-newValue, validationDataValue) => {
-    // arrays are also objects, but we need to handle arrays
-    // in a different way than objects
-    if (Array.isArray(newValue) && Array.isArray(validationDataValue)) {
-        if (newValue.length === 0) {
-            return true;
-        }
-        // eslint-disable-next-line prefer-destructuring
-        const itemValidationData = validationDataValue[0];
-        // validate all items in newData array matches item validation data
-        return Object.entries(newValue).every(([arrIndex, newValueItem]) => validateType(newValueItem, itemValidationData));
-    }
-    else if (typeof newValue === 'object' &&
-        typeof validationDataValue === 'object' &&
-        validationDataValue) {
-        return Object.entries(validationDataValue).every(([key, value]) => validateType(newValue[key], value));
-    }
-    // the data types are not arrays or objects, just do a direct comparison
-    // this will apply to primitive data types (string, number, boolean)
-    return typeof newValue === typeof validationDataValue;
-};
-
-exports.validateType = validateType;

package/src/lib/shared/utils/functions/validateType/validateType.d.ts

@@ -1 +0,0 @@
-export declare const validateType: <T>(newValue: any, validationDataValue: T) => newValue is T;

package/src/lib/shared/utils/functions/validateType/validateType.js

@@ -1,26 +0,0 @@
-'use client'
-const validateType = (
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-newValue, validationDataValue) => {
-    // arrays are also objects, but we need to handle arrays
-    // in a different way than objects
-    if (Array.isArray(newValue) && Array.isArray(validationDataValue)) {
-        if (newValue.length === 0) {
-            return true;
-        }
-        // eslint-disable-next-line prefer-destructuring
-        const itemValidationData = validationDataValue[0];
-        // validate all items in newData array matches item validation data
-        return Object.entries(newValue).every(([arrIndex, newValueItem]) => validateType(newValueItem, itemValidationData));
-    }
-    else if (typeof newValue === 'object' &&
-        typeof validationDataValue === 'object' &&
-        validationDataValue) {
-        return Object.entries(validationDataValue).every(([key, value]) => validateType(newValue[key], value));
-    }
-    // the data types are not arrays or objects, just do a direct comparison
-    // this will apply to primitive data types (string, number, boolean)
-    return typeof newValue === typeof validationDataValue;
-};
-
-export { validateType };