@dynamic-labs/sdk-react-core 1.1.0-alpha.4 → 1.1.0-alpha.6

package/src/lib/widgets/DynamicWidget/views/ManagePasskeysWidgetView/ManagePasskeysWidgetView.js

@@ -12,6 +12,7 @@ import '../../../../context/ViewContext/ViewContext.js';
 import '@dynamic-labs/sdk-api';
 import '../../../../shared/logger.js';
 import '@dynamic-labs/iconic';
+import { ReactComponent as SvgAdd } from '../../../../shared/assets/add.js';
 import { ReactComponent as SvgChevronLeft } from '../../../../shared/assets/chevron-left.js';
 import '@dynamic-labs/wallet-book';
 import '../../../../utils/constants/colors.js';
@@ -46,8 +47,9 @@ import { Typography } from '../../../../components/Typography/Typography.js';
 import { Skeleton } from '../../../../components/Skeleton/Skeleton.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../components/DynamicWidgetHeader/DynamicWidgetHeader.js';
-import 'qrcode';
+import 'react-focus-lock';
 import '../../../../context/LoadingContext/LoadingContext.js';
+import 'qrcode';
 import 'i18next';
 import { useWidgetContext } from '../../context/DynamicWidgetContext.js';
 import '../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
@@ -61,13 +63,11 @@ import '@dynamic-labs/viem-utils';
 import { PasskeyCard } from './PasskeyCard/PasskeyCard.js';
 import '../../../../components/InlineWidget/InlineWidget.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
-import { NeedHelpSection } from '../../../../components/NeedHelpSection/NeedHelpSection.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
-import 'react-focus-lock';
 
 const ManagePasskeysWidgetView = () => {
-    const { goToInitialDynamicWidgetView } = useWidgetContext();
+    const { setDynamicWidgetView } = useWidgetContext();
     const { environmentId, projectSettings } = useInternalDynamicContext();
     const { initPasskeyRecoveryProcess } = usePasskeyRecovery();
     const { t } = useTranslation();
@@ -86,8 +86,8 @@ const ManagePasskeysWidgetView = () => {
         enabled: Boolean(environmentId) && Boolean(userJwt),
     });
     const isRecoveryEnabled = Boolean(projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk.passkeyEmbeddedWalletRecoveryEnabled);
-    const backButton = (jsx(IconButton, { type: 'button', onClick: goToInitialDynamicWidgetView, "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) }));
-    return (jsxs("div", { className: 'manage-passkeys-widget-view', children: [jsx(ModalHeader, { leading: backButton, children: jsx("div", { className: 'send-balance-page-layout__header-content', children: jsx(Typography, { variant: 'title', color: 'primary', copykey: 'dyn_manage_passkeys.title', children: t('dyn_manage_passkeys.title') }) }) }), jsx(PasskeyCreatedSuccessBanner, {}), jsxs("div", { className: 'manage-passkeys-widget-view__body', children: [jsx("div", { className: 'manage-passkeys-widget-view__body__cards', children: isLoading ? (jsx(Skeleton, { count: 1, className: 'manage-passkeys-widget-view__body__cards__skeleton' })) : (userPasskeys.map((passkey) => (jsx(PasskeyCard, { passkey: passkey }, passkey.id)))) }), isRecoveryEnabled && (jsx(Button, { buttonPadding: 'large', buttonClassName: 'manage-passkeys-widget-view__body__recovery-button', onClick: initPasskeyRecoveryProcess, showInternalLoading: false, copykey: 'dyn_manage_passkeys.recovery_button', children: t('dyn_manage_passkeys.recovery_button') })), jsx(NeedHelpSection, {})] })] }));
+    const backButton = (jsx(IconButton, { type: 'button', onClick: () => setDynamicWidgetView('wallet-settings'), "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) }));
+    return (jsxs("div", { className: 'manage-passkeys-widget-view', children: [jsx(ModalHeader, { leading: backButton, children: jsx("div", { className: 'send-balance-page-layout__header-content', children: jsx(Typography, { variant: 'title', color: 'primary', copykey: 'dyn_manage_passkeys.title', children: t('dyn_manage_passkeys.title') }) }) }), jsx(PasskeyCreatedSuccessBanner, {}), jsxs("div", { className: 'manage-passkeys-widget-view__body', children: [jsx("div", { className: 'manage-passkeys-widget-view__body__cards', children: isLoading ? (jsx(Skeleton, { count: 1, className: 'manage-passkeys-widget-view__body__cards__skeleton' })) : (userPasskeys.map((passkey) => (jsx(PasskeyCard, { passkey: passkey }, passkey.id)))) }), isRecoveryEnabled && (jsx(Button, { buttonPadding: 'large', buttonClassName: 'manage-passkeys-widget-view__body__recovery-button', onClick: initPasskeyRecoveryProcess, showInternalLoading: false, startSlot: jsx(SvgAdd, {}), copykey: 'dyn_manage_passkeys.recovery_button', children: t('dyn_manage_passkeys.recovery_button') }))] })] }));
 };
 
 export { ManagePasskeysWidgetView };

package/src/lib/widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs

@@ -45,8 +45,9 @@ require('../../../../../context/QrCodeContext/QrCodeContext.cjs');
 var Typography = require('../../../../../components/Typography/Typography.cjs');
 require('../../../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../../components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
-require('qrcode');
+require('react-focus-lock');
 require('../../../../../context/LoadingContext/LoadingContext.cjs');
+require('qrcode');
 var getPasskeyProviderFromUserAgent = require('../../../helpers/getPasskeyProviderFromUserAgent.cjs');
 var getTimeSince = require('../../../helpers/getTimeSince.cjs');
 require('../../../context/DynamicWidgetContext.cjs');
@@ -60,7 +61,6 @@ require('../../../../../components/MenuList/Dropdown/Dropdown.cjs');
 var shortenEmail = require('../../../../../shared/utils/functions/shortenEmail/shortenEmail.cjs');
 require('../../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../../components/Popper/PopperContext/PopperContext.cjs');
-require('react-focus-lock');
 
 const mapPasskeyProviderToIcon = {
     android: jsxRuntime.jsx(iconic.AndroidIcon, {}),

package/src/lib/widgets/DynamicWidget/views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js

@@ -41,8 +41,9 @@ import '../../../../../context/QrCodeContext/QrCodeContext.js';
 import { Typography } from '../../../../../components/Typography/Typography.js';
 import '../../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../../components/DynamicWidgetHeader/DynamicWidgetHeader.js';
-import 'qrcode';
+import 'react-focus-lock';
 import '../../../../../context/LoadingContext/LoadingContext.js';
+import 'qrcode';
 import { getPasskeyProviderFromUserAgent } from '../../../helpers/getPasskeyProviderFromUserAgent.js';
 import { getTimeSince } from '../../../helpers/getTimeSince.js';
 import '../../../context/DynamicWidgetContext.js';
@@ -56,7 +57,6 @@ import '../../../../../components/MenuList/Dropdown/Dropdown.js';
 import { shortenEmail } from '../../../../../shared/utils/functions/shortenEmail/shortenEmail.js';
 import '../../../../../components/Popper/Popper/Popper.js';
 import '../../../../../components/Popper/PopperContext/PopperContext.js';
-import 'react-focus-lock';
 
 const mapPasskeyProviderToIcon = {
     android: jsx(AndroidIcon, {}),

package/src/lib/widgets/DynamicWidget/views/ProfileView/ProfileView.cjs

@@ -48,8 +48,9 @@ require('../../../../context/FooterAnimationContext/index.cjs');
 require('../../../../context/QrCodeContext/QrCodeContext.cjs');
 require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
-require('qrcode');
+require('react-focus-lock');
 require('../../../../context/LoadingContext/LoadingContext.cjs');
+require('qrcode');
 require('i18next');
 var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
 require('formik');
@@ -63,7 +64,6 @@ var LogoutButton = require('../../../../components/LogoutButton/LogoutButton.cjs
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
-require('react-focus-lock');
 
 const ProfileView = () => {
     const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();

package/src/lib/widgets/DynamicWidget/views/ProfileView/ProfileView.js

@@ -44,8 +44,9 @@ import '../../../../context/FooterAnimationContext/index.js';
 import '../../../../context/QrCodeContext/QrCodeContext.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../components/DynamicWidgetHeader/DynamicWidgetHeader.js';
-import 'qrcode';
+import 'react-focus-lock';
 import '../../../../context/LoadingContext/LoadingContext.js';
+import 'qrcode';
 import 'i18next';
 import { useWidgetContext } from '../../context/DynamicWidgetContext.js';
 import 'formik';
@@ -59,7 +60,6 @@ import { LogoutButton } from '../../../../components/LogoutButton/LogoutButton.j
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
-import 'react-focus-lock';
 
 const ProfileView = () => {
     const { setDynamicWidgetView } = useWidgetContext();

package/src/lib/widgets/DynamicWidget/views/WalletSettingsView/WalletSettingsView.cjs

@@ -0,0 +1,93 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var reactI18next = require('react-i18next');
+require('react');
+require('../../../../events/dynamicEvents.cjs');
+require('@dynamic-labs/utils');
+var useInternalDynamicContext = require('../../../../context/DynamicContext/useInternalDynamicContext.cjs');
+require('@dynamic-labs/wallet-connector-core');
+require('../../../../context/CaptchaContext/CaptchaContext.cjs');
+require('../../../../context/ErrorContext/ErrorContext.cjs');
+require('../../../../context/ViewContext/ViewContext.cjs');
+var decodeJwt = require('../../../../shared/utils/functions/decodeJwt/decodeJwt.cjs');
+require('@dynamic-labs/iconic');
+var checkCircle = require('../../../../shared/assets/check-circle.cjs');
+var chevronLeft = require('../../../../shared/assets/chevron-left.cjs');
+var lock = require('../../../../shared/assets/lock.cjs');
+var altEmbeddedWallet = require('../../../../shared/assets/alt-embedded-wallet.cjs');
+var faceId = require('../../../../shared/assets/face-id.cjs');
+require('../../../../shared/logger.cjs');
+require('@dynamic-labs/wallet-book');
+require('../../../../utils/constants/colors.cjs');
+require('../../../../shared/utils/classes/storage/localStorage.cjs');
+require('viem');
+require('../../../../shared/consts/index.cjs');
+require('@dynamic-labs/multi-wallet');
+require('@dynamic-labs/sdk-api');
+require('../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
+require('../../../../context/AccountExistsContext/AccountExistsContext.cjs');
+require('../../../../config/ApiEndpoint.cjs');
+require('../../../../context/EmailVerificationContext/EmailVerificationContext.cjs');
+require('react-dom');
+require('../../../../context/ThemeContext/ThemeContext.cjs');
+require('@dynamic-labs/types');
+require('yup');
+require('../../../../context/MockContext/MockContext.cjs');
+require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.cjs');
+require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
+require('@dynamic-labs/rpc-providers');
+require('../../../../context/UserWalletsContext/UserWalletsContext.cjs');
+require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
+require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
+require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
+require('../../../../components/ShadowDOM/ShadowDOM.cjs');
+require('../../../../components/OverlayCard/OverlayCard.context.cjs');
+require('../../../../context/FooterAnimationContext/index.cjs');
+require('../../../../context/QrCodeContext/QrCodeContext.cjs');
+var useIsTurnkeyWallet = require('../../../../utils/hooks/useIsTurnkeyWallet/useIsTurnkeyWallet.cjs');
+var Typography = require('../../../../components/Typography/Typography.cjs');
+require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../../components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
+require('react-focus-lock');
+require('../../../../context/LoadingContext/LoadingContext.cjs');
+require('qrcode');
+require('i18next');
+var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
+require('../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
+require('formik');
+var Button = require('../../../../components/Button/Button.cjs');
+var ModalHeader = require('../../../../components/ModalHeader/ModalHeader.cjs');
+var IconButton = require('../../../../components/IconButton/IconButton.cjs');
+require('../../../../components/Alert/Alert.cjs');
+require('@dynamic-labs/viem-utils');
+require('../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
+var useEmbeddedReveal = require('../../../../utils/hooks/useEmbeddedReveal/useEmbeddedReveal.cjs');
+require('../../../../components/InlineWidget/InlineWidget.cjs');
+require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
+require('../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../components/Popper/PopperContext/PopperContext.cjs');
+
+const WalletSettingsView = () => {
+    var _a, _b;
+    const { goToInitialDynamicWidgetView, setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
+    const { authToken } = useInternalDynamicContext.useInternalDynamicContext();
+    const { initExportProcess } = useEmbeddedReveal.useEmbeddedReveal();
+    const { isTurnkeyWallet, isTurnkeyWalletWithoutAuthenticator } = useIsTurnkeyWallet.useIsTurnkeyWallet();
+    const { t } = reactI18next.useTranslation();
+    const decodedJwt = decodeJwt.decodeJwt(authToken);
+    const walletProperties = (_b = (_a = decodedJwt === null || decodedJwt === void 0 ? void 0 : decodedJwt.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find(({ walletName }) => walletName === null || walletName === void 0 ? void 0 : walletName.startsWith('turnkey'))) === null || _b === void 0 ? void 0 : _b.walletProperties;
+    const isTurnkeyHDWallet = walletProperties === null || walletProperties === void 0 ? void 0 : walletProperties.turnkeyHDWalletId;
+    const backButton = (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: goToInitialDynamicWidgetView, "data-testid": 'back-button', children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) }));
+    return (jsxRuntime.jsxs("div", { className: 'wallet-settings-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx("div", { className: 'wallet-settings-view__header', children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', children: t('dyn_wallet_settings.title') }) }) }), jsxRuntime.jsxs("div", { className: 'wallet-settings-view__body', children: [jsxRuntime.jsxs("div", { className: 'wallet-settings-view__body__section', children: [jsxRuntime.jsx("div", { className: 'wallet-settings-view__body__section__title', children: t('dyn_wallet_settings.signing_section.title') }), jsxRuntime.jsx(Button.Button, { dataTestId: 'manage-passkeys-button', onClick: () => setDynamicWidgetView('manage-passkeys'), buttonClassName: 'wallet-settings-view__body__section__button', startSlot: 
+                                // eslint-disable-next-line react/jsx-wrap-multilines
+                                jsxRuntime.jsxs("div", { className: 'wallet-settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(faceId.ReactComponent, { className: 'wallet-settings-view__body__section__button__icon' }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', children: t('dyn_wallet_settings.signing_section.passkey_button') })] }), endSlot: isTurnkeyWallet && !isTurnkeyWalletWithoutAuthenticator ? (jsxRuntime.jsx(checkCircle.ReactComponent, { className: 'wallet-settings-view__body__section__button__icon-secondary--success' })) : undefined, showInternalLoading: false })] }), jsxRuntime.jsxs("div", { className: 'wallet-settings-view__body__section', children: [jsxRuntime.jsx("div", { className: 'wallet-settings-view__body__section__title', children: t('dyn_wallet_settings.export_section.title') }), jsxRuntime.jsx(Button.Button, { dataTestId: 'embedded-reveal-button', onClick: initExportProcess, buttonClassName: 'wallet-settings-view__body__section__button', disabled: !isTurnkeyWallet || isTurnkeyWalletWithoutAuthenticator, startSlot: 
+                                // eslint-disable-next-line react/jsx-wrap-multilines
+                                jsxRuntime.jsxs("div", { className: 'wallet-settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(altEmbeddedWallet.ReactComponent, { className: 'wallet-settings-view__body__section__button__icon' }), jsxRuntime.jsx(Typography.Typography, { weight: 'medium', children: isTurnkeyHDWallet
+                                                ? t('dyn_wallet_settings.export_section.srp_button')
+                                                : t('dyn_wallet_settings.export_section.private_key_button') })] }), endSlot: isTurnkeyWallet && !isTurnkeyWalletWithoutAuthenticator ? (jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'wallet-settings-view__body__section__button__icon-secondary--rotate' })) : (jsxRuntime.jsx(lock.ReactComponent, { className: 'wallet-settings-view__body__section__button__icon-secondary' })), showInternalLoading: false })] })] })] }));
+};
+
+exports.WalletSettingsView = WalletSettingsView;

package/src/lib/widgets/DynamicWidget/views/WalletSettingsView/WalletSettingsView.d.ts

@@ -0,0 +1,2 @@
+import { FC } from 'react';
+export declare const WalletSettingsView: FC;

package/src/lib/widgets/DynamicWidget/views/WalletSettingsView/WalletSettingsView.js

@@ -0,0 +1,89 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useTranslation } from 'react-i18next';
+import 'react';
+import '../../../../events/dynamicEvents.js';
+import '@dynamic-labs/utils';
+import { useInternalDynamicContext } from '../../../../context/DynamicContext/useInternalDynamicContext.js';
+import '@dynamic-labs/wallet-connector-core';
+import '../../../../context/CaptchaContext/CaptchaContext.js';
+import '../../../../context/ErrorContext/ErrorContext.js';
+import '../../../../context/ViewContext/ViewContext.js';
+import { decodeJwt } from '../../../../shared/utils/functions/decodeJwt/decodeJwt.js';
+import '@dynamic-labs/iconic';
+import { ReactComponent as SvgCheckCircle } from '../../../../shared/assets/check-circle.js';
+import { ReactComponent as SvgChevronLeft } from '../../../../shared/assets/chevron-left.js';
+import { ReactComponent as SvgLock } from '../../../../shared/assets/lock.js';
+import { ReactComponent as SvgAltEmbeddedWallet } from '../../../../shared/assets/alt-embedded-wallet.js';
+import { ReactComponent as SvgFaceId } from '../../../../shared/assets/face-id.js';
+import '../../../../shared/logger.js';
+import '@dynamic-labs/wallet-book';
+import '../../../../utils/constants/colors.js';
+import '../../../../shared/utils/classes/storage/localStorage.js';
+import 'viem';
+import '../../../../shared/consts/index.js';
+import '@dynamic-labs/multi-wallet';
+import '@dynamic-labs/sdk-api';
+import '../../../../context/AccessDeniedContext/AccessDeniedContext.js';
+import '../../../../context/AccountExistsContext/AccountExistsContext.js';
+import '../../../../config/ApiEndpoint.js';
+import '../../../../context/EmailVerificationContext/EmailVerificationContext.js';
+import 'react-dom';
+import '../../../../context/ThemeContext/ThemeContext.js';
+import '@dynamic-labs/types';
+import 'yup';
+import '../../../../context/MockContext/MockContext.js';
+import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/useUpdateUser.js';
+import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
+import '@dynamic-labs/rpc-providers';
+import '../../../../context/UserWalletsContext/UserWalletsContext.js';
+import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
+import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
+import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
+import '../../../../components/ShadowDOM/ShadowDOM.js';
+import '../../../../components/OverlayCard/OverlayCard.context.js';
+import '../../../../context/FooterAnimationContext/index.js';
+import '../../../../context/QrCodeContext/QrCodeContext.js';
+import { useIsTurnkeyWallet } from '../../../../utils/hooks/useIsTurnkeyWallet/useIsTurnkeyWallet.js';
+import { Typography } from '../../../../components/Typography/Typography.js';
+import '../../../../context/WalletGroupContext/WalletGroupContext.js';
+import '../../components/DynamicWidgetHeader/DynamicWidgetHeader.js';
+import 'react-focus-lock';
+import '../../../../context/LoadingContext/LoadingContext.js';
+import 'qrcode';
+import 'i18next';
+import { useWidgetContext } from '../../context/DynamicWidgetContext.js';
+import '../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
+import 'formik';
+import { Button } from '../../../../components/Button/Button.js';
+import { ModalHeader } from '../../../../components/ModalHeader/ModalHeader.js';
+import { IconButton } from '../../../../components/IconButton/IconButton.js';
+import '../../../../components/Alert/Alert.js';
+import '@dynamic-labs/viem-utils';
+import '../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
+import { useEmbeddedReveal } from '../../../../utils/hooks/useEmbeddedReveal/useEmbeddedReveal.js';
+import '../../../../components/InlineWidget/InlineWidget.js';
+import '../../../../components/MenuList/Dropdown/Dropdown.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
+
+const WalletSettingsView = () => {
+    var _a, _b;
+    const { goToInitialDynamicWidgetView, setDynamicWidgetView } = useWidgetContext();
+    const { authToken } = useInternalDynamicContext();
+    const { initExportProcess } = useEmbeddedReveal();
+    const { isTurnkeyWallet, isTurnkeyWalletWithoutAuthenticator } = useIsTurnkeyWallet();
+    const { t } = useTranslation();
+    const decodedJwt = decodeJwt(authToken);
+    const walletProperties = (_b = (_a = decodedJwt === null || decodedJwt === void 0 ? void 0 : decodedJwt.verifiedCredentials) === null || _a === void 0 ? void 0 : _a.find(({ walletName }) => walletName === null || walletName === void 0 ? void 0 : walletName.startsWith('turnkey'))) === null || _b === void 0 ? void 0 : _b.walletProperties;
+    const isTurnkeyHDWallet = walletProperties === null || walletProperties === void 0 ? void 0 : walletProperties.turnkeyHDWalletId;
+    const backButton = (jsx(IconButton, { type: 'button', onClick: goToInitialDynamicWidgetView, "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) }));
+    return (jsxs("div", { className: 'wallet-settings-view', children: [jsx(ModalHeader, { leading: backButton, children: jsx("div", { className: 'wallet-settings-view__header', children: jsx(Typography, { variant: 'title', color: 'primary', children: t('dyn_wallet_settings.title') }) }) }), jsxs("div", { className: 'wallet-settings-view__body', children: [jsxs("div", { className: 'wallet-settings-view__body__section', children: [jsx("div", { className: 'wallet-settings-view__body__section__title', children: t('dyn_wallet_settings.signing_section.title') }), jsx(Button, { dataTestId: 'manage-passkeys-button', onClick: () => setDynamicWidgetView('manage-passkeys'), buttonClassName: 'wallet-settings-view__body__section__button', startSlot: 
+                                // eslint-disable-next-line react/jsx-wrap-multilines
+                                jsxs("div", { className: 'wallet-settings-view__body__section__button__start-slot', children: [jsx(SvgFaceId, { className: 'wallet-settings-view__body__section__button__icon' }), jsx(Typography, { weight: 'medium', children: t('dyn_wallet_settings.signing_section.passkey_button') })] }), endSlot: isTurnkeyWallet && !isTurnkeyWalletWithoutAuthenticator ? (jsx(SvgCheckCircle, { className: 'wallet-settings-view__body__section__button__icon-secondary--success' })) : undefined, showInternalLoading: false })] }), jsxs("div", { className: 'wallet-settings-view__body__section', children: [jsx("div", { className: 'wallet-settings-view__body__section__title', children: t('dyn_wallet_settings.export_section.title') }), jsx(Button, { dataTestId: 'embedded-reveal-button', onClick: initExportProcess, buttonClassName: 'wallet-settings-view__body__section__button', disabled: !isTurnkeyWallet || isTurnkeyWalletWithoutAuthenticator, startSlot: 
+                                // eslint-disable-next-line react/jsx-wrap-multilines
+                                jsxs("div", { className: 'wallet-settings-view__body__section__button__start-slot', children: [jsx(SvgAltEmbeddedWallet, { className: 'wallet-settings-view__body__section__button__icon' }), jsx(Typography, { weight: 'medium', children: isTurnkeyHDWallet
+                                                ? t('dyn_wallet_settings.export_section.srp_button')
+                                                : t('dyn_wallet_settings.export_section.private_key_button') })] }), endSlot: isTurnkeyWallet && !isTurnkeyWalletWithoutAuthenticator ? (jsx(SvgChevronLeft, { className: 'wallet-settings-view__body__section__button__icon-secondary--rotate' })) : (jsx(SvgLock, { className: 'wallet-settings-view__body__section__button__icon-secondary' })), showInternalLoading: false })] })] })] }));
+};
+
+export { WalletSettingsView };

package/src/lib/widgets/DynamicWidget/views/WalletSettingsView/index.d.ts

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

package/src/lib/widgets/DynamicWidget/views/WalletsView/WalletsView.cjs

@@ -47,8 +47,9 @@ var Typography = require('../../../../components/Typography/Typography.cjs');
 var DynamicWidgetFooter = require('../../components/DynamicWidgetFooter/DynamicWidgetFooter.cjs');
 require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
-require('qrcode');
+require('react-focus-lock');
 require('../../../../context/LoadingContext/LoadingContext.cjs');
+require('qrcode');
 require('i18next');
 require('../../context/DynamicWidgetContext.cjs');
 var DynamicWidgetWallets = require('../../components/DynamicWidgetWallets/DynamicWidgetWallets.cjs');
@@ -65,7 +66,6 @@ var LogoutButton = require('../../../../components/LogoutButton/LogoutButton.cjs
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
-require('react-focus-lock');
 
 const WalletsView = () => {
     const { setShowAuthFlow, setSelectedWalletConnectorKey, user, authMode, multiWallet, } = useInternalDynamicContext.useInternalDynamicContext();

package/src/lib/widgets/DynamicWidget/views/WalletsView/WalletsView.js

@@ -43,8 +43,9 @@ import { Typography } from '../../../../components/Typography/Typography.js';
 import { DynamicWidgetFooter } from '../../components/DynamicWidgetFooter/DynamicWidgetFooter.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../components/DynamicWidgetHeader/DynamicWidgetHeader.js';
-import 'qrcode';
+import 'react-focus-lock';
 import '../../../../context/LoadingContext/LoadingContext.js';
+import 'qrcode';
 import 'i18next';
 import '../../context/DynamicWidgetContext.js';
 import { DynamicWidgetWallets } from '../../components/DynamicWidgetWallets/DynamicWidgetWallets.js';
@@ -61,7 +62,6 @@ import { LogoutButton } from '../../../../components/LogoutButton/LogoutButton.j
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
-import 'react-focus-lock';
 
 const WalletsView = () => {
     const { setShowAuthFlow, setSelectedWalletConnectorKey, user, authMode, multiWallet, } = useInternalDynamicContext();

package/src/lib/widgets/DynamicWidget/views/index.d.ts

@@ -3,3 +3,4 @@ export { ProfileView } from './ProfileView/ProfileView';
 export { EditProfileView } from './EditProfileView/EditProfileView';
 export { SendBalanceWidgetView } from './SendBalanceWidgetView';
 export { ManagePasskeysWidgetView } from './ManagePasskeysWidgetView';
+export { WalletSettingsView } from './WalletSettingsView';

package/src/lib/widgets/FundingWidget/views/FundWalletView/FundWalletView.cjs

@@ -44,8 +44,9 @@ require('../../../../context/FooterAnimationContext/index.cjs');
 require('../../../../context/QrCodeContext/QrCodeContext.cjs');
 require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../../DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
-require('qrcode');
+require('react-focus-lock');
 require('../../../../context/LoadingContext/LoadingContext.cjs');
+require('qrcode');
 require('i18next');
 require('../../../DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
@@ -58,7 +59,6 @@ require('../../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
-require('react-focus-lock');
 var FundingContext = require('../../../../context/FundingContext/FundingContext.cjs');
 
 const Modal = ({ onrampUrl }) => {

package/src/lib/widgets/FundingWidget/views/FundWalletView/FundWalletView.js

@@ -40,8 +40,9 @@ import '../../../../context/FooterAnimationContext/index.js';
 import '../../../../context/QrCodeContext/QrCodeContext.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../../DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
-import 'qrcode';
+import 'react-focus-lock';
 import '../../../../context/LoadingContext/LoadingContext.js';
+import 'qrcode';
 import 'i18next';
 import '../../../DynamicWidget/context/DynamicWidgetContext.js';
 import '../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
@@ -54,7 +55,6 @@ import '../../../../components/InlineWidget/InlineWidget.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
-import 'react-focus-lock';
 import { useFundingContext } from '../../../../context/FundingContext/FundingContext.js';
 
 const Modal = ({ onrampUrl }) => {

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

@@ -2,3 +2,4 @@ export * from './DynamicBridgeWidget';
 export * from './DynamicEmbeddedWidget';
 export * from './DynamicWidget';
 export * from './FundingWidget';
+export * from './DynamicMultiWalletPromptsWidget';

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

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

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

@@ -1,150 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _tslib = require('../../../../../_virtual/_tslib.cjs');
-var React = require('react');
-var walletConnectorCore = require('@dynamic-labs/wallet-connector-core');
-var sdkApi = require('@dynamic-labs/sdk-api');
-var useInternalDynamicContext = require('../../../context/DynamicContext/useInternalDynamicContext.cjs');
-var useWalletItemActions = require('../useWalletItemActions/useWalletItemActions.cjs');
-var dynamicEvents = require('../../../events/dynamicEvents.cjs');
-require('../../../shared/logger.cjs');
-require('@dynamic-labs/iconic');
-require('react/jsx-runtime');
-require('../../../context/ViewContext/ViewContext.cjs');
-require('@dynamic-labs/wallet-book');
-require('../../constants/colors.cjs');
-require('../../../shared/utils/classes/storage/localStorage.cjs');
-require('viem');
-require('@dynamic-labs/utils');
-require('../../../shared/consts/index.cjs');
-require('@dynamic-labs/multi-wallet');
-var isProviderEnabled = require('../../functions/isProviderEnabled/isProviderEnabled.cjs');
-var isEmailValid = require('../../functions/isEmailValid/isEmailValid.cjs');
-var api = require('../../../data/api.cjs');
-var useCreateUserProfileByJWTCallback = require('../useCreateUserProfileByJWTCallback/useCreateUserProfileByJWTCallback.cjs');
-
-const mapEmailProviderToProviderEnum = {
-    dynamic: sdkApi.ProviderEnum.Dynamic,
-    emailOnly: sdkApi.ProviderEnum.EmailOnly,
-    magicLink: sdkApi.ProviderEnum.MagicLink,
-};
-const allSupportedProviders = Object.values(mapEmailProviderToProviderEnum);
-/**
- * Hook to connect and verify an email using a one-time password (OTP) with specified email providers.
- *
- * @param props - The properties for the hook. Includes an optional 'provider' to specify the email provider.
- * @returns An object containing two functions:
- *    - connectWithEmail: A function to initiate the OTP process with the provided email.
- *    - verifyOneTimePassword: A function to verify the provided OTP.
- *
- * @example
- * const { connectWithEmail, verifyOneTimePassword } = useConnectWithEmailOtp({ provider: ProviderEnum.MagicLink });
- *
- * // To initiate the OTP process
- * connectWithEmail('user@example.com').then(() => {
- *   // OTP sent to the email
- * });
- *
- * // To verify the OTP
- * verifyOneTimePassword('123456').then(() => {
- *   // OTP verification successful
- * }).catch((error) => {
- *   // Error handling
- * });
- */
-const useConnectWithEmailOtp = ({ provider, } = {}) => {
-    const { walletConnectorOptions, environmentId, projectSettings, setCallback, } = useInternalDynamicContext.useInternalDynamicContext();
-    const { createUserProfileByJWT } = useCreateUserProfileByJWTCallback.useCreateUserProfileByJWTCallback();
-    const { handleInstalledExtensionClick } = useWalletItemActions.useWalletItemActions();
-    const lastVerificationHandlerRef = React.useRef(null);
-    const providers = (projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.providers) || [];
-    const emailOtpWalletConnector = walletConnectorOptions
-        .map(({ walletConnector }) => walletConnector)
-        .find(walletConnectorCore.isEmailOTPWalletConnector);
-    const mapProviderToEnabled = {
-        dynamic: isProviderEnabled.isProviderEnabled(providers, sdkApi.ProviderEnum.Dynamic),
-        emailOnly: isProviderEnabled.isProviderEnabled(providers, sdkApi.ProviderEnum.EmailOnly),
-        magicLink: isProviderEnabled.isProviderEnabled(providers, sdkApi.ProviderEnum.MagicLink),
-    };
-    const emailHandler = (email) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        const { verificationUUID } = yield api.createEmailVerification({
-            email,
-            environmentId,
-        });
-        return (oneTimePassword) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-            const { jwt } = yield api.signInWithEmailVerification({
-                environmentId,
-                verificationToken: oneTimePassword,
-                verificationUUID,
-            });
-            yield createUserProfileByJWT(jwt);
-            return {
-                email,
-                verified: Boolean(jwt),
-            };
-        });
-    });
-    const magicHandler = (email) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        if (!emailOtpWalletConnector) {
-            throw new Error('OTP wallet connector was not found');
-        }
-        emailOtpWalletConnector.setEmail(email);
-        handleInstalledExtensionClick(emailOtpWalletConnector);
-        return (oneTimePassword) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-            return ({
-                email,
-                verified: yield emailOtpWalletConnector.verifyOneTimePassword(oneTimePassword),
-            });
-        });
-    });
-    const mapProviderToHandler = {
-        [sdkApi.ProviderEnum.Dynamic]: emailHandler,
-        [sdkApi.ProviderEnum.EmailOnly]: emailHandler,
-        [sdkApi.ProviderEnum.MagicLink]: magicHandler,
-    };
-    const getEffectiveEmailProvider = (email) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        if (provider) {
-            return provider;
-        }
-        const { emailProvider } = yield api.getEmailProvider({
-            email,
-            environmentId,
-        });
-        if (!allSupportedProviders.includes(emailProvider)) {
-            throw new Error('Email provider is not supported');
-        }
-        return emailProvider;
-    });
-    const connectWithEmail = (email) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        if (!isEmailValid.isEmailValid(email)) {
-            throw new Error('Email is not valid');
-        }
-        const effectiveEmailProvider = yield getEffectiveEmailProvider(email);
-        if (!mapProviderToEnabled[effectiveEmailProvider]) {
-            throw new Error('Email provider is not enabled');
-        }
-        const verificationHandler = yield mapProviderToHandler[effectiveEmailProvider](email);
-        lastVerificationHandlerRef.current = verificationHandler;
-    });
-    const verifyOneTimePassword = (oneTimePassword) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
-        if (!lastVerificationHandlerRef.current) {
-            throw new Error('Verification have not started, use connectWithEmail before verifying');
-        }
-        const { email, verified } = yield lastVerificationHandlerRef.current(oneTimePassword);
-        dynamicEvents.dynamicEvents.emit('emailVerificationResult', verified, email);
-        if (verified) {
-            setCallback('authSuccess');
-        }
-        else {
-            throw new Error('Email verification failed');
-        }
-    });
-    return {
-        connectWithEmail,
-        verifyOneTimePassword,
-    };
-};
-
-exports.useConnectWithEmailOtp = useConnectWithEmailOtp;

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

@@ -1,32 +0,0 @@
-type EmailProviders = 'magicLink' | 'dynamic' | 'emailOnly';
-type UseConnectWithEmailOtpProps = {
-    provider?: EmailProviders;
-};
-/**
- * Hook to connect and verify an email using a one-time password (OTP) with specified email providers.
- *
- * @param props - The properties for the hook. Includes an optional 'provider' to specify the email provider.
- * @returns An object containing two functions:
- *    - connectWithEmail: A function to initiate the OTP process with the provided email.
- *    - verifyOneTimePassword: A function to verify the provided OTP.
- *
- * @example
- * const { connectWithEmail, verifyOneTimePassword } = useConnectWithEmailOtp({ provider: ProviderEnum.MagicLink });
- *
- * // To initiate the OTP process
- * connectWithEmail('user@example.com').then(() => {
- *   // OTP sent to the email
- * });
- *
- * // To verify the OTP
- * verifyOneTimePassword('123456').then(() => {
- *   // OTP verification successful
- * }).catch((error) => {
- *   // Error handling
- * });
- */
-export declare const useConnectWithEmailOtp: ({ provider, }?: UseConnectWithEmailOtpProps) => {
-    connectWithEmail: (email: string) => Promise<void>;
-    verifyOneTimePassword: (oneTimePassword: string) => Promise<void>;
-};
-export {};