@dynamic-labs/sdk-react-core 3.0.0-alpha.41 → 3.0.0-alpha.42

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

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

package/src/lib/views/NoQrNotInstalledView/WalletHelpLink.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { Icon } from '../../shared';
+interface WalletHelpLinkProps {
+    Icon: Icon;
+    link: string;
+    name: string;
+}
+export declare const WalletHelpLink: ({ name, link, Icon }: WalletHelpLinkProps) => JSX.Element;
+export {};

package/src/lib/widgets/DynamicWidget/components/BottomNavBar/BottomNavBar.cjs

@@ -5,12 +5,96 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
 var classNames = require('../../../../utils/functions/classNames/classNames.cjs');
+require('../../../../components/Accordion/components/AccordionItem/AccordionItem.cjs');
+require('../../../../components/Alert/Alert.cjs');
+require('react');
+require('../../../../events/dynamicEvents.cjs');
+require('../../../../../../_virtual/_tslib.cjs');
+require('@dynamic-labs/utils');
+require('../../../../context/DynamicContext/DynamicContext.cjs');
+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');
+require('@dynamic-labs/wallet-book');
+require('../../../../utils/constants/colors.cjs');
+require('../../../../utils/constants/values.cjs');
+require('../../../../shared/utils/classes/storage/localStorage.cjs');
+require('../../../../shared/utils/classes/storage/sessionStorage.cjs');
+require('../../../../shared/consts/index.cjs');
+require('../../../../context/CaptchaContext/CaptchaContext.cjs');
+require('../../../../context/ErrorContext/ErrorContext.cjs');
+require('@dynamic-labs/multi-wallet');
+require('react-international-phone');
+require('../../../../config/ApiEndpoint.cjs');
+require('@dynamic-labs/store');
+require('../../../../locale/locale.cjs');
+require('../../../../context/AccessDeniedContext/AccessDeniedContext.cjs');
+require('../../../../context/AccountExistsContext/AccountExistsContext.cjs');
+require('../../../../context/UserWalletsContext/UserWalletsContext.cjs');
+require('../../../../context/VerificationContext/VerificationContext.cjs');
+require('react-dom');
+require('../../../../context/WalletContext/WalletContext.cjs');
+require('../../../../utils/hooks/useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.cjs');
+require('../../../../context/ThemeContext/ThemeContext.cjs');
+require('../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.cjs');
+require('@dynamic-labs/types');
+require('../../../../context/LoadingContext/LoadingContext.cjs');
+require('yup');
+require('../../../../context/MockContext/MockContext.cjs');
+require('../../../../views/CollectUserDataView/useFields.cjs');
+require('../../../../context/FieldsStateContext/FieldsStateContext.cjs');
+require('../../../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
+require('@dynamic-labs/rpc-providers');
+require('react-i18next');
+var Typography = require('../../../../components/Typography/Typography.cjs');
+require('../../../../context/FooterAnimationContext/index.cjs');
+require('../../../../components/ShadowDOM/ShadowDOM.cjs');
+require('../../../../components/Transition/ZoomTransition/ZoomTransition.cjs');
+require('../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
+require('../../../../components/Transition/OpacityTransition/OpacityTransition.cjs');
+require('../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.cjs');
+require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
+require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
+require('../DynamicWidgetHeader/DynamicWidgetHeader.cjs');
+require('react-focus-lock');
+require('../../context/DynamicWidgetContext.cjs');
+require('../../../../components/IconButton/IconButton.cjs');
+require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
+require('formik');
+require('../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
+require('../../../../components/Input/Input.cjs');
+require('@dynamic-labs/viem-utils');
+require('../../../../context/PasskeyContext/PasskeyContext.cjs');
+require('../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
+require('../../../../../polyfills.cjs');
+require('../../../../context/ErrorBoundary/ErrorBoundaryBase.cjs');
+require('../../../../context/ErrorBoundary/ErrorBoundaryContext.cjs');
+require('../../../DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.cjs');
+require('../DynamicWidgetCard/DynamicWidgetCard.cjs');
+require('../../../../components/IsBrowser/IsBrowser.cjs');
+require('../../../../context/WidgetRegistry/WidgetRegistryContextProvider.cjs');
+require('../../../../context/FundingContext/FundingContext.cjs');
+require('../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../components/Popper/PopperContext/PopperContext.cjs');
+require('../../../../views/WalletList/WalletList.cjs');
+require('../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
+require('@hcaptcha/react-hcaptcha');
+require('../../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
+require('../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
+require('../../../../context/SendBalanceContext/SendBalanceContext.cjs');
+require('../../../../context/ConnectWithOtpContext/ConnectWithOtpContext.cjs');
+require('../../../../context/ConnectWithOtpContext/constants.cjs');
+require('../../../../context/ReinitializeContext/ReinitializeContextProvider.cjs');
+require('../../../../components/InlineWidget/InlineWidget.cjs');
+require('qrcode');
 
 const BottomNavBar = ({ value, onChange, options }) => {
     const isActive = (_value) => _value === value;
     return (jsxRuntime.jsx("div", { className: 'footer-options-switcher__container', "data-testid": 'OptionsSwitcher', children: options.map((option) => (jsxRuntime.jsxs("div", { className: classNames.classNames('footer-options-switcher__tab', {
                 'footer-options-switcher__tab--active': isActive(option.value),
-            }), onClick: () => onChange(option.value), children: [isActive(option.value) ? option.selectedIcon : option.icon, jsxRuntime.jsx("span", { className: 'footer-options-switcher__label', children: option.label })] }, option.value))) }));
+            }), onClick: () => onChange(option.value), children: [option.icon, jsxRuntime.jsx(Typography.Typography, { variant: 'body_small', className: 'footer-options-switcher__label', children: option.label })] }, option.value))) }));
 };
 
 exports.BottomNavBar = BottomNavBar;

package/src/lib/widgets/DynamicWidget/components/BottomNavBar/BottomNavBar.d.ts

@@ -3,7 +3,6 @@ import { DynamicWidgetViews } from '../../context/DynamicWidgetContext.types';
 export type OptionsSwitcherOption = {
     value: string;
     label: string;
-    selectedIcon: ReactNode;
     icon: ReactNode;
 };
 export declare const BottomNavBar: FC<{

package/src/lib/widgets/DynamicWidget/components/BottomNavBar/BottomNavBar.js

@@ -1,12 +1,96 @@
 'use client'
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { classNames } from '../../../../utils/functions/classNames/classNames.js';
+import '../../../../components/Accordion/components/AccordionItem/AccordionItem.js';
+import '../../../../components/Alert/Alert.js';
+import 'react';
+import '../../../../events/dynamicEvents.js';
+import '../../../../../../_virtual/_tslib.js';
+import '@dynamic-labs/utils';
+import '../../../../context/DynamicContext/DynamicContext.js';
+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 '@dynamic-labs/wallet-book';
+import '../../../../utils/constants/colors.js';
+import '../../../../utils/constants/values.js';
+import '../../../../shared/utils/classes/storage/localStorage.js';
+import '../../../../shared/utils/classes/storage/sessionStorage.js';
+import '../../../../shared/consts/index.js';
+import '../../../../context/CaptchaContext/CaptchaContext.js';
+import '../../../../context/ErrorContext/ErrorContext.js';
+import '@dynamic-labs/multi-wallet';
+import 'react-international-phone';
+import '../../../../config/ApiEndpoint.js';
+import '@dynamic-labs/store';
+import '../../../../locale/locale.js';
+import '../../../../context/AccessDeniedContext/AccessDeniedContext.js';
+import '../../../../context/AccountExistsContext/AccountExistsContext.js';
+import '../../../../context/UserWalletsContext/UserWalletsContext.js';
+import '../../../../context/VerificationContext/VerificationContext.js';
+import 'react-dom';
+import '../../../../context/WalletContext/WalletContext.js';
+import '../../../../utils/hooks/useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.js';
+import '../../../../context/ThemeContext/ThemeContext.js';
+import '../../../../utils/hooks/useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
+import '@dynamic-labs/types';
+import '../../../../context/LoadingContext/LoadingContext.js';
+import 'yup';
+import '../../../../context/MockContext/MockContext.js';
+import '../../../../views/CollectUserDataView/useFields.js';
+import '../../../../context/FieldsStateContext/FieldsStateContext.js';
+import '../../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
+import '@dynamic-labs/rpc-providers';
+import 'react-i18next';
+import { Typography } from '../../../../components/Typography/Typography.js';
+import '../../../../context/FooterAnimationContext/index.js';
+import '../../../../components/ShadowDOM/ShadowDOM.js';
+import '../../../../components/Transition/ZoomTransition/ZoomTransition.js';
+import '../../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
+import '../../../../components/Transition/OpacityTransition/OpacityTransition.js';
+import '../../../../components/OverlayCard/OverlayCardTarget/OverlayCardTarget.js';
+import '../../../../context/SocialRedirectContext/SocialRedirectContext.js';
+import '../../../../context/WalletGroupContext/WalletGroupContext.js';
+import '../DynamicWidgetHeader/DynamicWidgetHeader.js';
+import 'react-focus-lock';
+import '../../context/DynamicWidgetContext.js';
+import '../../../../components/IconButton/IconButton.js';
+import '../../../../components/MenuList/Dropdown/Dropdown.js';
+import 'formik';
+import '../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
+import '../../../../components/Input/Input.js';
+import '@dynamic-labs/viem-utils';
+import '../../../../context/PasskeyContext/PasskeyContext.js';
+import '../../views/ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
+import '../../../../../polyfills.js';
+import '../../../../context/ErrorBoundary/ErrorBoundaryBase.js';
+import '../../../../context/ErrorBoundary/ErrorBoundaryContext.js';
+import '../../../DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.js';
+import '../DynamicWidgetCard/DynamicWidgetCard.js';
+import '../../../../components/IsBrowser/IsBrowser.js';
+import '../../../../context/WidgetRegistry/WidgetRegistryContextProvider.js';
+import '../../../../context/FundingContext/FundingContext.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
+import '../../../../views/WalletList/WalletList.js';
+import '../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '@hcaptcha/react-hcaptcha';
+import '../../../../context/IpConfigurationContext/IpConfigurationContext.js';
+import '../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
+import '../../../../context/SendBalanceContext/SendBalanceContext.js';
+import '../../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
+import '../../../../context/ConnectWithOtpContext/constants.js';
+import '../../../../context/ReinitializeContext/ReinitializeContextProvider.js';
+import '../../../../components/InlineWidget/InlineWidget.js';
+import 'qrcode';
 
 const BottomNavBar = ({ value, onChange, options }) => {
     const isActive = (_value) => _value === value;
     return (jsx("div", { className: 'footer-options-switcher__container', "data-testid": 'OptionsSwitcher', children: options.map((option) => (jsxs("div", { className: classNames('footer-options-switcher__tab', {
                 'footer-options-switcher__tab--active': isActive(option.value),
-            }), onClick: () => onChange(option.value), children: [isActive(option.value) ? option.selectedIcon : option.icon, jsx("span", { className: 'footer-options-switcher__label', children: option.label })] }, option.value))) }));
+            }), onClick: () => onChange(option.value), children: [option.icon, jsx(Typography, { variant: 'body_small', className: 'footer-options-switcher__label', children: option.label })] }, option.value))) }));
 };
 
 export { BottomNavBar };

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetWallets/DynamicWidgetWallets.cjs

@@ -107,7 +107,7 @@ const DynamicWidgetWallets = () => {
         setShowLinkNewWalletModal(true);
         setSelectedWalletConnectorKey(null);
     };
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: 'dynamic-widget-wallets-header', children: [jsxRuntime.jsx(Typography.Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', className: 'dynamic-widget-wallets-header__title', copykey: 'dyn_widget.other_wallets', children: t('dyn_widget.other_wallets') }), jsxRuntime.jsxs(TypographyButton.TypographyButton, { buttonClassName: 'dynamic-widget-wallets-header__add_wallet', buttonVariant: 'tertiary', buttonPadding: 'none', onClick: addNewWallet, typographyProps: {
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: 'dynamic-widget-wallets-header', children: [jsxRuntime.jsx(Typography.Typography, { weight: 'regular', variant: 'body_normal', color: 'secondary', className: 'dynamic-widget-wallets-header__title', copykey: 'dyn_widget.other_wallets', children: t('dyn_widget.other_wallets') }), jsxRuntime.jsxs(TypographyButton.TypographyButton, { buttonClassName: 'dynamic-widget-wallets-header__add_wallet', buttonVariant: 'tertiary', buttonPadding: 'none', onClick: addNewWallet, typographyProps: {
                             color: 'secondary',
                             variant: 'button_tertiary',
                         }, startSlot: jsxRuntime.jsx(add.ReactComponent, {}), children: [authMode === 'connect-only' ? 'Connect' : 'Link', " a new wallet"] })] }), jsxRuntime.jsx("div", { ref: availableWalletsContainerRef, className: 'dynamic-widget-wallets', "data-testid": 'dynamicWidgetWallets', children: jsxRuntime.jsx("div", { className: classNames.classNames('dynamic-widget-wallets__body', {

package/src/lib/widgets/DynamicWidget/components/DynamicWidgetWallets/DynamicWidgetWallets.js

@@ -103,7 +103,7 @@ const DynamicWidgetWallets = () => {
         setShowLinkNewWalletModal(true);
         setSelectedWalletConnectorKey(null);
     };
-    return (jsxs(Fragment, { children: [jsxs("div", { className: 'dynamic-widget-wallets-header', children: [jsx(Typography, { weight: 'medium', variant: 'body_small', color: 'secondary', className: 'dynamic-widget-wallets-header__title', copykey: 'dyn_widget.other_wallets', children: t('dyn_widget.other_wallets') }), jsxs(TypographyButton, { buttonClassName: 'dynamic-widget-wallets-header__add_wallet', buttonVariant: 'tertiary', buttonPadding: 'none', onClick: addNewWallet, typographyProps: {
+    return (jsxs(Fragment, { children: [jsxs("div", { className: 'dynamic-widget-wallets-header', children: [jsx(Typography, { weight: 'regular', variant: 'body_normal', color: 'secondary', className: 'dynamic-widget-wallets-header__title', copykey: 'dyn_widget.other_wallets', children: t('dyn_widget.other_wallets') }), jsxs(TypographyButton, { buttonClassName: 'dynamic-widget-wallets-header__add_wallet', buttonVariant: 'tertiary', buttonPadding: 'none', onClick: addNewWallet, typographyProps: {
                             color: 'secondary',
                             variant: 'button_tertiary',
                         }, startSlot: jsx(SvgAdd, {}), children: [authMode === 'connect-only' ? 'Connect' : 'Link', " a new wallet"] })] }), jsx("div", { ref: availableWalletsContainerRef, className: 'dynamic-widget-wallets', "data-testid": 'dynamicWidgetWallets', children: jsx("div", { className: classNames('dynamic-widget-wallets__body', {

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

@@ -73,7 +73,9 @@ require('../../../../components/Input/Input.cjs');
 require('@dynamic-labs/viem-utils');
 require('../../../../context/PasskeyContext/PasskeyContext.cjs');
 require('../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.cjs');
+var MfaDeviceTileSkeleton = require('../../../../components/MfaDeviceTileSkeleton/MfaDeviceTileSkeleton.cjs');
 var UserDeviceTile = require('./components/UserDeviceTile.cjs');
+var sort = require('./components/utils/sort.cjs');
 require('../../../../../polyfills.cjs');
 require('../../../../context/ErrorBoundary/ErrorBoundaryBase.cjs');
 require('../../../../context/ErrorBoundary/ErrorBoundaryContext.cjs');
@@ -98,17 +100,19 @@ var useDynamicModals = require('../../../../utils/hooks/useDynamicModals/useDyna
 require('../../../../components/InlineWidget/InlineWidget.cjs');
 require('qrcode');
 
-const sortDevicesByDefault = (a, b) => a._default === b._default ? 0 : a._default ? -1 : 1;
 const ManageMfaWidgetView = () => {
     const [userDevices, setUserDevices] = React.useState([]);
+    const [loading, setLoading] = React.useState(false);
     const { setDynamicWidgetView } = DynamicWidgetContext.useWidgetContext();
     const { setShowMfaQRCode } = useDynamicModals.useDynamicModals();
     const { getUserDevices, deleteUserDevice } = useMfa.useMfa();
     const { t } = reactI18next.useTranslation();
     const getDevices = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        setLoading(true);
         const devices = yield getUserDevices();
         // set the user devices with the default device first
-        setUserDevices(devices.sort(sortDevicesByDefault));
+        setUserDevices(sort.sortAndNameDevices(devices));
+        setLoading(false);
     }), [getUserDevices]);
     // re-fetch devices when a new device is added
     useDynamicEvents.useDynamicEvents('mfaCompletionSuccess', () => getDevices());
@@ -122,8 +126,7 @@ const ManageMfaWidgetView = () => {
         getDevices();
     });
     const backButton = (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) }));
-    return (jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx("div", { className: 'send-balance-page-layout__header-content', children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', copykey: 'dyn_manage_mfa.title', children: t('dyn_manage_mfa.title') }) }) }), jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__scroll-container', children: [userDevices.length === 0 && (jsxRuntime.jsx(Typography.Typography, { className: 'manage-mfa-widget-view__no-devices', variant: 'body_normal', color: 'secondary', copykey: 'dyn_manage_mfa.no_devices', children: t('dyn_manage_mfa.no_devices') })), userDevices.map((device, index) => (jsxRuntime.jsx(UserDeviceTile.UserDeviceTile, { userDevice: device, index: index, deleteDevice: deleteDevice }, device.id)))] }), jsxRuntime.jsx("div", { className: 'manage-mfa-widget-view__add-mfa-button-container', children: jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonClassName: 'manage-mfa-widget-view__add-mfa-button-container__button', onClick: () => setShowMfaQRCode(true), copykey: 'dyn_manage_mfa.add_mfa_button', startSlot: jsxRuntime.jsx(add.ReactComponent, {}), children: t('dyn_manage_mfa.add_mfa_button') }) })] }));
+    return (jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, children: jsxRuntime.jsx("div", { className: 'send-balance-page-layout__header-content', children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', copykey: 'dyn_manage_mfa.title', children: t('dyn_manage_mfa.title') }) }) }), jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__scroll-container', children: [loading && jsxRuntime.jsx(MfaDeviceTileSkeleton.MfaDeviceTileSkeleton, {}), !loading && userDevices.length === 0 && (jsxRuntime.jsx(Typography.Typography, { className: 'manage-mfa-widget-view__no-devices', variant: 'body_normal', color: 'secondary', copykey: 'dyn_manage_mfa.no_devices', children: t('dyn_manage_mfa.no_devices') })), userDevices.map((device, index) => (jsxRuntime.jsx(UserDeviceTile.UserDeviceTile, { userDevice: device, index: index, deleteDevice: deleteDevice }, device.id)))] }), jsxRuntime.jsx("div", { className: 'manage-mfa-widget-view__add-mfa-button-container', children: jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonClassName: 'manage-mfa-widget-view__add-mfa-button-container__button', onClick: () => setShowMfaQRCode(true), copykey: 'dyn_manage_mfa.add_mfa_button', startSlot: jsxRuntime.jsx(add.ReactComponent, {}), children: t('dyn_manage_mfa.add_mfa_button') }) })] }));
 };
 
 exports.ManageMfaWidgetView = ManageMfaWidgetView;
-exports.sortDevicesByDefault = sortDevicesByDefault;

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

@@ -1,4 +1,2 @@
 import { FC } from 'react';
-import { MFADevice } from '@dynamic-labs/sdk-api-core';
-export declare const sortDevicesByDefault: (a: MFADevice, b: MFADevice) => 0 | 1 | -1;
 export declare const ManageMfaWidgetView: FC;

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

@@ -69,7 +69,9 @@ import '../../../../components/Input/Input.js';
 import '@dynamic-labs/viem-utils';
 import '../../../../context/PasskeyContext/PasskeyContext.js';
 import '../ManagePasskeysWidgetView/PasskeyCard/PasskeyCard.js';
+import { MfaDeviceTileSkeleton } from '../../../../components/MfaDeviceTileSkeleton/MfaDeviceTileSkeleton.js';
 import { UserDeviceTile } from './components/UserDeviceTile.js';
+import { sortAndNameDevices } from './components/utils/sort.js';
 import '../../../../../polyfills.js';
 import '../../../../context/ErrorBoundary/ErrorBoundaryBase.js';
 import '../../../../context/ErrorBoundary/ErrorBoundaryContext.js';
@@ -94,17 +96,19 @@ import { useDynamicModals } from '../../../../utils/hooks/useDynamicModals/useDy
 import '../../../../components/InlineWidget/InlineWidget.js';
 import 'qrcode';
 
-const sortDevicesByDefault = (a, b) => a._default === b._default ? 0 : a._default ? -1 : 1;
 const ManageMfaWidgetView = () => {
     const [userDevices, setUserDevices] = useState([]);
+    const [loading, setLoading] = useState(false);
     const { setDynamicWidgetView } = useWidgetContext();
     const { setShowMfaQRCode } = useDynamicModals();
     const { getUserDevices, deleteUserDevice } = useMfa();
     const { t } = useTranslation();
     const getDevices = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
+        setLoading(true);
         const devices = yield getUserDevices();
         // set the user devices with the default device first
-        setUserDevices(devices.sort(sortDevicesByDefault));
+        setUserDevices(sortAndNameDevices(devices));
+        setLoading(false);
     }), [getUserDevices]);
     // re-fetch devices when a new device is added
     useDynamicEvents('mfaCompletionSuccess', () => getDevices());
@@ -118,7 +122,7 @@ const ManageMfaWidgetView = () => {
         getDevices();
     });
     const backButton = (jsx(IconButton, { type: 'button', onClick: () => setDynamicWidgetView('settings'), "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) }));
-    return (jsxs("div", { className: 'manage-mfa-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_mfa.title', children: t('dyn_manage_mfa.title') }) }) }), jsxs("div", { className: 'manage-mfa-widget-view__scroll-container', children: [userDevices.length === 0 && (jsx(Typography, { className: 'manage-mfa-widget-view__no-devices', variant: 'body_normal', color: 'secondary', copykey: 'dyn_manage_mfa.no_devices', children: t('dyn_manage_mfa.no_devices') })), userDevices.map((device, index) => (jsx(UserDeviceTile, { userDevice: device, index: index, deleteDevice: deleteDevice }, device.id)))] }), jsx("div", { className: 'manage-mfa-widget-view__add-mfa-button-container', children: jsx(TypographyButton, { buttonClassName: 'manage-mfa-widget-view__add-mfa-button-container__button', onClick: () => setShowMfaQRCode(true), copykey: 'dyn_manage_mfa.add_mfa_button', startSlot: jsx(SvgAdd, {}), children: t('dyn_manage_mfa.add_mfa_button') }) })] }));
+    return (jsxs("div", { className: 'manage-mfa-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_mfa.title', children: t('dyn_manage_mfa.title') }) }) }), jsxs("div", { className: 'manage-mfa-widget-view__scroll-container', children: [loading && jsx(MfaDeviceTileSkeleton, {}), !loading && userDevices.length === 0 && (jsx(Typography, { className: 'manage-mfa-widget-view__no-devices', variant: 'body_normal', color: 'secondary', copykey: 'dyn_manage_mfa.no_devices', children: t('dyn_manage_mfa.no_devices') })), userDevices.map((device, index) => (jsx(UserDeviceTile, { userDevice: device, index: index, deleteDevice: deleteDevice }, device.id)))] }), jsx("div", { className: 'manage-mfa-widget-view__add-mfa-button-container', children: jsx(TypographyButton, { buttonClassName: 'manage-mfa-widget-view__add-mfa-button-container__button', onClick: () => setShowMfaQRCode(true), copykey: 'dyn_manage_mfa.add_mfa_button', startSlot: jsx(SvgAdd, {}), children: t('dyn_manage_mfa.add_mfa_button') }) })] }));
 };
 
-export { ManageMfaWidgetView, sortDevicesByDefault };
+export { ManageMfaWidgetView };

package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/UserDeviceTile.cjs

@@ -83,6 +83,7 @@ require('../../../../../components/Popper/PopperContext/PopperContext.cjs');
 require('../../../../../views/WalletList/WalletList.cjs');
 require('../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('@hcaptcha/react-hcaptcha');
+var Badge = require('../../../../../components/Badge/Badge.cjs');
 require('../../../../../context/IpConfigurationContext/IpConfigurationContext.cjs');
 require('../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
 require('../../../../../context/SendBalanceContext/SendBalanceContext.cjs');
@@ -92,7 +93,7 @@ require('../../../../../context/ReinitializeContext/ReinitializeContextProvider.
 require('../../../../../components/InlineWidget/InlineWidget.cjs');
 require('qrcode');
 
-const UserDeviceTile = ({ userDevice, index, deleteDevice, }) => {
+const UserDeviceTile = ({ userDevice, deleteDevice, }) => {
     const optionsMenu = [
         {
             Icon: null,
@@ -100,8 +101,8 @@ const UserDeviceTile = ({ userDevice, index, deleteDevice, }) => {
             text: 'Delete',
         },
     ];
-    const timeSinceCreated = userDevice.createdAt && getTimeSince.getTimeSince(new Date(userDevice.createdAt));
-    return (jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__list-tile', children: [jsxRuntime.jsx(authenticator.ReactComponent, { className: 'manage-mfa-widget-view__list-tile__icon' }), jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__list-tile__details', children: [jsxRuntime.jsxs(Typography.Typography, { variant: 'body_normal', color: 'primary', children: ["Authenticator App ", index + 1] }), timeSinceCreated && (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: ["Created ", timeSinceCreated.value, " ", timeSinceCreated.unit, " ago"] }))] }), jsxRuntime.jsx("div", { style: {
+    const timeSinceCreated = userDevice.verifiedAt && getTimeSince.getTimeSince(new Date(userDevice.verifiedAt));
+    return (jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__list-tile', children: [jsxRuntime.jsx(authenticator.ReactComponent, { className: 'manage-mfa-widget-view__list-tile__icon' }), jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__list-tile__details', children: [jsxRuntime.jsxs("div", { className: 'manage-mfa-widget-view__list-tile__details__title', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'primary', children: userDevice.alias || 'Authenticator App' }), userDevice._default && jsxRuntime.jsx(Badge.Badge, { text: 'Default' })] }), timeSinceCreated && (jsxRuntime.jsxs(Typography.Typography, { variant: 'body_small', color: 'secondary', children: ["Created ", timeSinceCreated.value, " ", timeSinceCreated.unit, " ago"] }))] }), jsxRuntime.jsx("div", { style: {
                     cursor: 'pointer',
                     display: 'flex',
                 }, children: jsxRuntime.jsx(DotsMenu.DotsMenu, { direction: 'left', "data-testid": 'dots-menu', options: optionsMenu, buttonClassName: 'manage-mfa-widget-view__list-tile__dots-menu', buttonClassNameWithOpenMenu: 'manage-mfa-widget-view__list-tile__dots-menu' }) })] }, userDevice.id));

package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/UserDeviceTile.d.ts

@@ -5,4 +5,4 @@ export type UserDeviceTileProps = {
     index: number;
     deleteDevice: (id: string) => void;
 };
-export declare const UserDeviceTile: ({ userDevice, index, deleteDevice, }: UserDeviceTileProps) => JSX.Element;
+export declare const UserDeviceTile: ({ userDevice, deleteDevice, }: UserDeviceTileProps) => JSX.Element;

package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/UserDeviceTile.js

@@ -79,6 +79,7 @@ import '../../../../../components/Popper/PopperContext/PopperContext.js';
 import '../../../../../views/WalletList/WalletList.js';
 import '../../../../DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '@hcaptcha/react-hcaptcha';
+import { Badge } from '../../../../../components/Badge/Badge.js';
 import '../../../../../context/IpConfigurationContext/IpConfigurationContext.js';
 import '../../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
 import '../../../../../context/SendBalanceContext/SendBalanceContext.js';
@@ -88,7 +89,7 @@ import '../../../../../context/ReinitializeContext/ReinitializeContextProvider.j
 import '../../../../../components/InlineWidget/InlineWidget.js';
 import 'qrcode';
 
-const UserDeviceTile = ({ userDevice, index, deleteDevice, }) => {
+const UserDeviceTile = ({ userDevice, deleteDevice, }) => {
     const optionsMenu = [
         {
             Icon: null,
@@ -96,8 +97,8 @@ const UserDeviceTile = ({ userDevice, index, deleteDevice, }) => {
             text: 'Delete',
         },
     ];
-    const timeSinceCreated = userDevice.createdAt && getTimeSince(new Date(userDevice.createdAt));
-    return (jsxs("div", { className: 'manage-mfa-widget-view__list-tile', children: [jsx(SvgAuthenticator, { className: 'manage-mfa-widget-view__list-tile__icon' }), jsxs("div", { className: 'manage-mfa-widget-view__list-tile__details', children: [jsxs(Typography, { variant: 'body_normal', color: 'primary', children: ["Authenticator App ", index + 1] }), timeSinceCreated && (jsxs(Typography, { variant: 'body_small', color: 'secondary', children: ["Created ", timeSinceCreated.value, " ", timeSinceCreated.unit, " ago"] }))] }), jsx("div", { style: {
+    const timeSinceCreated = userDevice.verifiedAt && getTimeSince(new Date(userDevice.verifiedAt));
+    return (jsxs("div", { className: 'manage-mfa-widget-view__list-tile', children: [jsx(SvgAuthenticator, { className: 'manage-mfa-widget-view__list-tile__icon' }), jsxs("div", { className: 'manage-mfa-widget-view__list-tile__details', children: [jsxs("div", { className: 'manage-mfa-widget-view__list-tile__details__title', children: [jsx(Typography, { variant: 'body_normal', color: 'primary', children: userDevice.alias || 'Authenticator App' }), userDevice._default && jsx(Badge, { text: 'Default' })] }), timeSinceCreated && (jsxs(Typography, { variant: 'body_small', color: 'secondary', children: ["Created ", timeSinceCreated.value, " ", timeSinceCreated.unit, " ago"] }))] }), jsx("div", { style: {
                     cursor: 'pointer',
                     display: 'flex',
                 }, children: jsx(DotsMenu, { direction: 'left', "data-testid": 'dots-menu', options: optionsMenu, buttonClassName: 'manage-mfa-widget-view__list-tile__dots-menu', buttonClassNameWithOpenMenu: 'manage-mfa-widget-view__list-tile__dots-menu' }) })] }, userDevice.id));

package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/utils/sort.cjs

@@ -0,0 +1,23 @@
+'use client'
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const sortDevicesByDefault = (a, b) => a._default === b._default ? 0 : a._default ? -1 : 1;
+const sortDevicesByVerifiedDateDesc = (a, b) => {
+    // doing null check for createdAt to avoid runtime error even though it should never be null/undefined
+    const dateA = a.verifiedAt ? new Date(a.verifiedAt).getTime() : 0;
+    const dateB = b.verifiedAt ? new Date(b.verifiedAt).getTime() : 0;
+    return dateA - dateB;
+};
+const sortAndNameDevices = (devices) => devices
+    .sort(sortDevicesByVerifiedDateDesc)
+    .map((device, index) => {
+    device.alias = device.alias || `Authenticator App ${index + 1}`;
+    return device;
+})
+    .sort(sortDevicesByDefault);
+
+exports.sortAndNameDevices = sortAndNameDevices;
+exports.sortDevicesByDefault = sortDevicesByDefault;
+exports.sortDevicesByVerifiedDateDesc = sortDevicesByVerifiedDateDesc;

package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/utils/sort.d.ts

@@ -0,0 +1,4 @@
+import { MFADevice } from '@dynamic-labs/sdk-api-core';
+export declare const sortDevicesByDefault: (a: MFADevice, b: MFADevice) => 0 | 1 | -1;
+export declare const sortDevicesByVerifiedDateDesc: (a: MFADevice, b: MFADevice) => number;
+export declare const sortAndNameDevices: (devices: MFADevice[]) => MFADevice[];

package/src/lib/widgets/DynamicWidget/views/ManageMfaWidgetView/components/utils/sort.js

@@ -0,0 +1,17 @@
+'use client'
+const sortDevicesByDefault = (a, b) => a._default === b._default ? 0 : a._default ? -1 : 1;
+const sortDevicesByVerifiedDateDesc = (a, b) => {
+    // doing null check for createdAt to avoid runtime error even though it should never be null/undefined
+    const dateA = a.verifiedAt ? new Date(a.verifiedAt).getTime() : 0;
+    const dateB = b.verifiedAt ? new Date(b.verifiedAt).getTime() : 0;
+    return dateA - dateB;
+};
+const sortAndNameDevices = (devices) => devices
+    .sort(sortDevicesByVerifiedDateDesc)
+    .map((device, index) => {
+    device.alias = device.alias || `Authenticator App ${index + 1}`;
+    return device;
+})
+    .sort(sortDevicesByDefault);
+
+export { sortAndNameDevices, sortDevicesByDefault, sortDevicesByVerifiedDateDesc };

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

@@ -84,7 +84,6 @@ var TypographyButton = require('../../../../components/TypographyButton/Typograp
 require('formik');
 require('../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.cjs');
 var spinner = require('../../../../components/Spinner/spinner.cjs');
-var ModalHeader = require('../../../../components/ModalHeader/ModalHeader.cjs');
 require('../../../../components/Input/Input.cjs');
 require('@dynamic-labs/viem-utils');
 require('../../../../context/PasskeyContext/PasskeyContext.cjs');
@@ -178,7 +177,7 @@ const SettingsView = () => {
     const isMfaEnabled = Boolean((_r = (_q = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security) === null || _q === void 0 ? void 0 : _q.mfa) === null || _r === void 0 ? void 0 : _r.enabled);
     const shouldShowPasskeyMFA = isPasskeyEnabled && isTurnkeyWallet && !isSessionKeyCompatibleWallet;
     const shouldShowSecuritySection = isMfaEnabled || isCoinbaseWallet || shouldShowPasskeyMFA;
-    return (jsxRuntime.jsxs("div", { className: 'settings-view', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { children: jsxRuntime.jsx("div", { className: 'settings-view__header', children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', copykey: 'dyn_settings.title', children: t('dyn_settings.title') }) }) }), jsxRuntime.jsxs("div", { className: 'settings-view__body', children: [jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [jsxRuntime.jsx("div", { className: 'settings-view__body__section__title', children: t('dyn_settings.global_section.title') }), jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'currency-button', buttonClassName: classNames.classNames('settings-view__body__section__button', 'settings-view__body__section__button__badge'), startSlot: 
+    return (jsxRuntime.jsxs("div", { className: 'settings-view', children: [jsxRuntime.jsxs("div", { className: 'settings-view__body', children: [jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [jsxRuntime.jsx("div", { className: 'settings-view__body__section__title', children: t('dyn_settings.global_section.title') }), jsxRuntime.jsx(TypographyButton.TypographyButton, { dataTestId: 'currency-button', buttonClassName: classNames.classNames('settings-view__body__section__button', 'settings-view__body__section__button__badge'), startSlot: 
                                 // eslint-disable-next-line react/jsx-wrap-multilines
                                 jsxRuntime.jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsxRuntime.jsx(currency.ReactComponent, { className: 'settings-view__body__section__button__icon' }), jsxRuntime.jsx(Typography.Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.global_section.currency.badge', children: t('dyn_settings.global_section.currency.title') }), jsxRuntime.jsx(Badge.Badge, { text: t('dyn_settings.global_section.currency.badge'), copykey: 'dyn_settings.global_section.currency.badge', variant: 'secondary' })] }), endSlot: jsxRuntime.jsx(chevronLeft.ReactComponent, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: true, showInternalLoading: false })] }), shouldShowSecuritySection && (jsxRuntime.jsxs("div", { className: 'settings-view__body__section', children: [jsxRuntime.jsx("div", { className: classNames.classNames('settings-view__body__section__title', {
                                     'settings-view__body__section__title__info-icon': !isTurnkeyWalletWithAuthenticator,

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

@@ -80,7 +80,6 @@ import { TypographyButton } from '../../../../components/TypographyButton/Typogr
 import 'formik';
 import '../../../../views/TransactionConfirmationView/helpers/transactionErrorMessage.js';
 import { Spinner } from '../../../../components/Spinner/spinner.js';
-import { ModalHeader } from '../../../../components/ModalHeader/ModalHeader.js';
 import '../../../../components/Input/Input.js';
 import '@dynamic-labs/viem-utils';
 import '../../../../context/PasskeyContext/PasskeyContext.js';
@@ -174,7 +173,7 @@ const SettingsView = () => {
     const isMfaEnabled = Boolean((_r = (_q = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.security) === null || _q === void 0 ? void 0 : _q.mfa) === null || _r === void 0 ? void 0 : _r.enabled);
     const shouldShowPasskeyMFA = isPasskeyEnabled && isTurnkeyWallet && !isSessionKeyCompatibleWallet;
     const shouldShowSecuritySection = isMfaEnabled || isCoinbaseWallet || shouldShowPasskeyMFA;
-    return (jsxs("div", { className: 'settings-view', children: [jsx(ModalHeader, { children: jsx("div", { className: 'settings-view__header', children: jsx(Typography, { variant: 'title', color: 'primary', copykey: 'dyn_settings.title', children: t('dyn_settings.title') }) }) }), jsxs("div", { className: 'settings-view__body', children: [jsxs("div", { className: 'settings-view__body__section', children: [jsx("div", { className: 'settings-view__body__section__title', children: t('dyn_settings.global_section.title') }), jsx(TypographyButton, { dataTestId: 'currency-button', buttonClassName: classNames('settings-view__body__section__button', 'settings-view__body__section__button__badge'), startSlot: 
+    return (jsxs("div", { className: 'settings-view', children: [jsxs("div", { className: 'settings-view__body', children: [jsxs("div", { className: 'settings-view__body__section', children: [jsx("div", { className: 'settings-view__body__section__title', children: t('dyn_settings.global_section.title') }), jsx(TypographyButton, { dataTestId: 'currency-button', buttonClassName: classNames('settings-view__body__section__button', 'settings-view__body__section__button__badge'), startSlot: 
                                 // eslint-disable-next-line react/jsx-wrap-multilines
                                 jsxs("div", { className: 'settings-view__body__section__button__start-slot', children: [jsx(SvgCurrency, { className: 'settings-view__body__section__button__icon' }), jsx(Typography, { color: 'primary', weight: 'medium', copykey: 'dyn_settings.global_section.currency.badge', children: t('dyn_settings.global_section.currency.title') }), jsx(Badge, { text: t('dyn_settings.global_section.currency.badge'), copykey: 'dyn_settings.global_section.currency.badge', variant: 'secondary' })] }), endSlot: jsx(SvgChevronLeft, { className: 'settings-view__body__section__button__icon-secondary--rotate' }), disabled: true, showInternalLoading: false })] }), shouldShowSecuritySection && (jsxs("div", { className: 'settings-view__body__section', children: [jsx("div", { className: classNames('settings-view__body__section__title', {
                                     'settings-view__body__section__title__info-icon': !isTurnkeyWalletWithAuthenticator,

package/src/lib/shared/assets/profile.cjs

@@ -1,65 +0,0 @@
-'use client'
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n["default"] = e;
-  return Object.freeze(n);
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
-
-var _g, _defs;
-var _excluded = ["title", "titleId"];
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-var SvgProfile = function SvgProfile(_ref) {
-  var title = _ref.title,
-    titleId = _ref.titleId,
-    props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
-    width: 29,
-    height: 28,
-    viewBox: "0 0 29 28",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    "aria-labelledby": titleId
-  }, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
-    id: titleId
-  }, title) : null, _g || (_g = /*#__PURE__*/React__namespace.createElement("g", {
-    clipPath: "url(#profile_svg__a)"
-  }, /*#__PURE__*/React__namespace.createElement("path", {
-    fillRule: "evenodd",
-    clipRule: "evenodd",
-    d: "M24.095 22.523A12.785 12.785 0 0 0 27.333 14c0-7.088-5.745-12.833-12.833-12.833S1.667 6.912 1.667 14c0 3.271 1.224 6.257 3.24 8.524 2.414-2.901 7.001-3.94 9.793-3.94 2.793 0 6.984.832 9.395 3.939ZM9.688 10.792a4.812 4.812 0 1 1 9.624 0 4.812 4.812 0 0 1-9.625 0Z",
-    fill: "#383C48"
-  }))), _defs || (_defs = /*#__PURE__*/React__namespace.createElement("defs", null, /*#__PURE__*/React__namespace.createElement("clipPath", {
-    id: "profile_svg__a"
-  }, /*#__PURE__*/React__namespace.createElement("rect", {
-    x: 1.667,
-    y: 1.167,
-    width: 25.667,
-    height: 25.667,
-    rx: 12.833,
-    fill: "#fff"
-  })))));
-};
-
-exports.ReactComponent = SvgProfile;