@dynamic-labs/sdk-react-core 1.3.1 → 1.4.1

package/src/lib/views/Passkey/PasskeyRecovery/InitRecovery/PasskeyInitRecovery.cjs

@@ -51,6 +51,7 @@ require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../components/OverlayCard/OverlayCard.context.cjs');
 require('../../../../context/FooterAnimationContext/index.cjs');
 var Typography = require('../../../../components/Typography/Typography.cjs');
+require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
@@ -58,7 +59,6 @@ var IconWithSpinner = require('../../../../components/IconWithSpinner/IconWithSp
 require('../../../../context/LoadingContext/LoadingContext.cjs');
 var Icon = require('../../../../components/Icon/Icon.cjs');
 require('i18next');
-require('qrcode');
 require('../../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 var ErrorContainer = require('../../../../components/ErrorContainer/ErrorContainer.cjs');
 require('../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
@@ -79,9 +79,9 @@ require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 var NeedHelpSection = require('../../../../components/NeedHelpSection/NeedHelpSection.cjs');
 require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
+require('qrcode');
 require('../../../WalletList/WalletList.cjs');
 require('@hcaptcha/react-hcaptcha');
-require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 
 const PasskeyInitRecovery = ({ authenticatorType, }) => {

package/src/lib/views/Passkey/PasskeyRecovery/InitRecovery/PasskeyInitRecovery.js

@@ -47,6 +47,7 @@ import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../components/OverlayCard/OverlayCard.context.js';
 import '../../../../context/FooterAnimationContext/index.js';
 import { Typography } from '../../../../components/Typography/Typography.js';
+import '../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
@@ -54,7 +55,6 @@ import { IconWithSpinner } from '../../../../components/IconWithSpinner/IconWith
 import '../../../../context/LoadingContext/LoadingContext.js';
 import { Icon } from '../../../../components/Icon/Icon.js';
 import 'i18next';
-import 'qrcode';
 import '../../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import { ErrorContainer } from '../../../../components/ErrorContainer/ErrorContainer.js';
 import '../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
@@ -75,9 +75,9 @@ 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 'qrcode';
 import '../../../WalletList/WalletList.js';
 import '@hcaptcha/react-hcaptcha';
-import '../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 
 const PasskeyInitRecovery = ({ authenticatorType, }) => {

package/src/lib/views/Passkey/RenamePasskeyView/RenamePasskeyView.cjs

@@ -49,12 +49,12 @@ require('../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../components/OverlayCard/OverlayCard.context.cjs');
 require('../../../context/FooterAnimationContext/index.cjs');
 var Typography = require('../../../components/Typography/Typography.cjs');
+require('../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
 require('../../../context/LoadingContext/LoadingContext.cjs');
 require('i18next');
-require('qrcode');
 require('../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 var Button = require('../../../components/Button/Button.cjs');
@@ -73,9 +73,9 @@ require('../../../components/IsBrowser/IsBrowser.cjs');
 require('../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../components/Popper/Popper/Popper.cjs');
 require('../../../components/Popper/PopperContext/PopperContext.cjs');
+require('qrcode');
 require('../../WalletList/WalletList.cjs');
 require('@hcaptcha/react-hcaptcha');
-require('../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 
 const RenamePasskeyView = () => {

package/src/lib/views/Passkey/RenamePasskeyView/RenamePasskeyView.js

@@ -45,12 +45,12 @@ import '../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../components/OverlayCard/OverlayCard.context.js';
 import '../../../context/FooterAnimationContext/index.js';
 import { Typography } from '../../../components/Typography/Typography.js';
+import '../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
 import '../../../context/LoadingContext/LoadingContext.js';
 import 'i18next';
-import 'qrcode';
 import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import { Button } from '../../../components/Button/Button.js';
@@ -69,9 +69,9 @@ import '../../../components/IsBrowser/IsBrowser.js';
 import '../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../components/Popper/Popper/Popper.js';
 import '../../../components/Popper/PopperContext/PopperContext.js';
+import 'qrcode';
 import '../../WalletList/WalletList.js';
 import '@hcaptcha/react-hcaptcha';
-import '../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 
 const RenamePasskeyView = () => {

package/src/lib/views/Passkey/utils/createEmbeddedWalletWithPasskey/createEmbeddedWalletWithPasskey.cjs

@@ -34,6 +34,9 @@ const createEmbeddedWalletWithPasskey = ({ user, walletConnector, environmentId,
         throw new utils.DynamicError('User is not defined');
     }
     walletConnector.setEmail(user.email);
+    if ('setPhone' in walletConnector) {
+        walletConnector.setPhone(user.phoneNumber);
+    }
     const { attestation, challenge } = yield walletConnector.getWebAuthnAttestation();
     const signersResponse = yield api.createTurnkeyEmbeddedWallet({
         attestation: attestation,

package/src/lib/views/Passkey/utils/createEmbeddedWalletWithPasskey/createEmbeddedWalletWithPasskey.js

@@ -30,6 +30,9 @@ const createEmbeddedWalletWithPasskey = ({ user, walletConnector, environmentId,
         throw new DynamicError('User is not defined');
     }
     walletConnector.setEmail(user.email);
+    if ('setPhone' in walletConnector) {
+        walletConnector.setPhone(user.phoneNumber);
+    }
     const { attestation, challenge } = yield walletConnector.getWebAuthnAttestation();
     const signersResponse = yield createTurnkeyEmbeddedWallet({
         attestation: attestation,

package/src/lib/views/PendingConnectView/PendingConnectView.cjs

@@ -46,13 +46,13 @@ require('../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../components/OverlayCard/OverlayCard.context.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
 var Typography = require('../../components/Typography/Typography.cjs');
+require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
 require('../../context/LoadingContext/LoadingContext.cjs');
 require('i18next');
-require('qrcode');
 require('../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('formik');
@@ -69,9 +69,9 @@ require('../../components/IsBrowser/IsBrowser.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
+require('qrcode');
 require('../WalletList/WalletList.cjs');
 require('@hcaptcha/react-hcaptcha');
-require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 
 const PendingConnectView = () => {

package/src/lib/views/PendingConnectView/PendingConnectView.js

@@ -42,13 +42,13 @@ import '../../components/ShadowDOM/ShadowDOM.js';
 import '../../components/OverlayCard/OverlayCard.context.js';
 import '../../context/FooterAnimationContext/index.js';
 import { Typography } from '../../components/Typography/Typography.js';
+import '../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
 import { iconRatio, IconWithSpinner } from '../../components/IconWithSpinner/IconWithSpinner.js';
 import '../../context/LoadingContext/LoadingContext.js';
 import 'i18next';
-import 'qrcode';
 import '../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import 'formik';
@@ -65,9 +65,9 @@ import '../../components/IsBrowser/IsBrowser.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
+import 'qrcode';
 import '../WalletList/WalletList.js';
 import '@hcaptcha/react-hcaptcha';
-import '../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 
 const PendingConnectView = () => {

package/src/lib/views/PendingSignatureView/PendingSignatureView.cjs

@@ -50,13 +50,13 @@ require('../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../components/OverlayCard/OverlayCard.context.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
 var Typography = require('../../components/Typography/Typography.cjs');
+require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
 require('../../context/LoadingContext/LoadingContext.cjs');
 require('i18next');
-require('qrcode');
 require('../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('formik');
@@ -74,9 +74,9 @@ require('../../components/IsBrowser/IsBrowser.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
+require('qrcode');
 require('../WalletList/WalletList.cjs');
 require('@hcaptcha/react-hcaptcha');
-require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 
 const PendingSignatureView = () => {

package/src/lib/views/PendingSignatureView/PendingSignatureView.js

@@ -46,13 +46,13 @@ import '../../components/ShadowDOM/ShadowDOM.js';
 import '../../components/OverlayCard/OverlayCard.context.js';
 import '../../context/FooterAnimationContext/index.js';
 import { Typography } from '../../components/Typography/Typography.js';
+import '../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
 import { IconWithSpinner, iconRatio } from '../../components/IconWithSpinner/IconWithSpinner.js';
 import '../../context/LoadingContext/LoadingContext.js';
 import 'i18next';
-import 'qrcode';
 import '../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import 'formik';
@@ -70,9 +70,9 @@ import '../../components/IsBrowser/IsBrowser.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
+import 'qrcode';
 import '../WalletList/WalletList.js';
 import '@hcaptcha/react-hcaptcha';
-import '../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 
 const PendingSignatureView = () => {

package/src/lib/views/QrCodeView/QrCodeView.cjs

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
 var walletBook = require('@dynamic-labs/wallet-book');
 var ThemeContext = require('../../context/ThemeContext/ThemeContext.cjs');
+require('react');
 require('../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/sdk-api');
 require('../../shared/logger.cjs');
@@ -31,7 +31,6 @@ require('../../config/ApiEndpoint.cjs');
 require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 require('react-dom');
 require('@dynamic-labs/types');
-var useTimeout = require('../../utils/hooks/useTimeout/useTimeout.cjs');
 require('yup');
 require('react-i18next');
 require('../../context/MockContext/MockContext.cjs');
@@ -40,8 +39,6 @@ require('../../context/UserFieldEditorContext/UserFieldEditorContext.cjs');
 require('@dynamic-labs/rpc-providers');
 require('../../context/UserWalletsContext/UserWalletsContext.cjs');
 require('../../components/Alert/Alert.cjs');
-var AnimatePresence = require('../../components/AnimatePresence/AnimatePresence.cjs');
-var Typography = require('../../components/Typography/Typography.cjs');
 require('../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/InlineWidget/InlineWidget.cjs');
@@ -50,25 +47,24 @@ require('../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../components/Transition/ZoomTransition/ZoomTransition.cjs');
 require('../../components/Transition/SlideInUpTransition/SlideInUpTransition.cjs');
 require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
-var VerticalDrawerTransition = require('../../components/Transition/VerticalDrawerTransition/VerticalDrawerTransition.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('react-focus-lock');
+require('qrcode');
 require('formik');
 require('i18next');
 require('../../components/OverlayCard/OverlayCard.context.cjs');
 require('../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../WalletList/WalletList.cjs');
-var QrCodeContainer = require('./QrCodeContainer/QrCodeContainer.cjs');
 require('@hcaptcha/react-hcaptcha');
 require('../../context/LoadingContext/LoadingContext.cjs');
 require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
+var QrCodeWrapper = require('../../components/QrCodeWrapper/QrCodeWrapper.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
-require('qrcode');
 require('../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('@dynamic-labs/viem-utils');
@@ -80,21 +76,18 @@ var useInternalDynamicContext = require('../../context/DynamicContext/useDynamic
 const QrCodeView = () => {
     var _a;
     const { theme: { theme }, } = ThemeContext.useThemeContext();
-    const [showQrCodeMessage, setShowQrCodeMessage] = React.useState(false);
-    const [showQrCodeImage, setShowQrCodeImage] = React.useState(false);
     const { name } = theme;
     const { qrcodeUri, desktopUri, selectedWalletConnector: walletConnector, } = useInternalDynamicContext.useInternalDynamicContext();
     const { walletBook: walletBook$1 } = walletBook.useWalletBookContext();
-    useTimeout.useTimeout(() => setShowQrCodeMessage(true), 5000);
     if (!walletConnector) {
         return null;
     }
     const icon = (jsxRuntime.jsx(walletBook.WalletIcon, { walletKey: walletConnector.key, style: { height: pixelToRem.pixelToRem(32), width: pixelToRem.pixelToRem(32) } }));
-    return (jsxRuntime.jsxs("div", { "data-testid": 'qr-code-view', children: [jsxRuntime.jsx(AnimatePresence.AnimatePresence, { animationComponent: jsxRuntime.jsx(VerticalDrawerTransition.VerticalDrawerTransition, { style: { width: '100%' } }), children: showQrCodeMessage && !showQrCodeImage && (jsxRuntime.jsxs("div", { className: 'qr-code-view__scan-issue-message', children: [jsxRuntime.jsx(Typography.Typography, { color: 'primary', variant: 'body_small', children: "If you're having issues scanning, click\u00A0" }), jsxRuntime.jsx("button", { "data-testid": 'qr-code-view__scan-issue-button', className: 'qr-code-view__scan-issue-button', onClick: () => setShowQrCodeImage(true), children: "here" })] })) }), jsxRuntime.jsx(QrCodeContainer.QrCodeContainer, { showQrCodeMessage: showQrCodeMessage, desktopUri: desktopUri, accentColor: 
-                /* istanbul ignore next */
-                name === 'dark'
-                    ? theme.colors.textPrimary
-                    : (_a = walletBook.getWalletPrimaryColor(walletBook$1, walletConnector.key)) !== null && _a !== void 0 ? _a : '', walletKey: walletConnector.key, walletName: walletConnector.name, qrcodeValue: qrcodeUri, Icon: icon, showCopyToClipboardButton: walletConnector.isWalletConnect, showQrCodeImage: showQrCodeImage })] }));
+    return (jsxRuntime.jsx(QrCodeWrapper.QrCodeWrapper, { uri: qrcodeUri, desktopUri: desktopUri, accentColor: 
+        /* istanbul ignore next */
+        name === 'dark'
+            ? theme.colors.textPrimary
+            : (_a = walletBook.getWalletPrimaryColor(walletBook$1, walletConnector.key)) !== null && _a !== void 0 ? _a : '', icon: icon, showCopyToClipboardButton: walletConnector.isWalletConnect, walletConnector: walletConnector }));
 };
 
 exports.QrCodeView = QrCodeView;

package/src/lib/views/QrCodeView/QrCodeView.js

@@ -1,7 +1,7 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useState } from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { useWalletBookContext, WalletIcon, getWalletPrimaryColor } from '@dynamic-labs/wallet-book';
 import { useThemeContext } from '../../context/ThemeContext/ThemeContext.js';
+import 'react';
 import '../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/sdk-api';
 import '../../shared/logger.js';
@@ -27,7 +27,6 @@ import '../../config/ApiEndpoint.js';
 import '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import 'react-dom';
 import '@dynamic-labs/types';
-import { useTimeout } from '../../utils/hooks/useTimeout/useTimeout.js';
 import 'yup';
 import 'react-i18next';
 import '../../context/MockContext/MockContext.js';
@@ -36,8 +35,6 @@ import '../../context/UserFieldEditorContext/UserFieldEditorContext.js';
 import '@dynamic-labs/rpc-providers';
 import '../../context/UserWalletsContext/UserWalletsContext.js';
 import '../../components/Alert/Alert.js';
-import { AnimatePresence } from '../../components/AnimatePresence/AnimatePresence.js';
-import { Typography } from '../../components/Typography/Typography.js';
 import '../../components/ShadowDOM/ShadowDOM.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/InlineWidget/InlineWidget.js';
@@ -46,25 +43,24 @@ import '../../components/MenuList/Dropdown/Dropdown.js';
 import '../../components/Transition/ZoomTransition/ZoomTransition.js';
 import '../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
 import '../../components/Transition/OpacityTransition/OpacityTransition.js';
-import { VerticalDrawerTransition } from '../../components/Transition/VerticalDrawerTransition/VerticalDrawerTransition.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'react-focus-lock';
+import 'qrcode';
 import 'formik';
 import 'i18next';
 import '../../components/OverlayCard/OverlayCard.context.js';
 import '../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../WalletList/WalletList.js';
-import { QrCodeContainer } from './QrCodeContainer/QrCodeContainer.js';
 import '@hcaptcha/react-hcaptcha';
 import '../../context/LoadingContext/LoadingContext.js';
 import '../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 import '../../context/FooterAnimationContext/index.js';
+import { QrCodeWrapper } from '../../components/QrCodeWrapper/QrCodeWrapper.js';
 import '../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
-import 'qrcode';
 import '../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import '@dynamic-labs/viem-utils';
@@ -76,21 +72,18 @@ import { useInternalDynamicContext } from '../../context/DynamicContext/useDynam
 const QrCodeView = () => {
     var _a;
     const { theme: { theme }, } = useThemeContext();
-    const [showQrCodeMessage, setShowQrCodeMessage] = useState(false);
-    const [showQrCodeImage, setShowQrCodeImage] = useState(false);
     const { name } = theme;
     const { qrcodeUri, desktopUri, selectedWalletConnector: walletConnector, } = useInternalDynamicContext();
     const { walletBook } = useWalletBookContext();
-    useTimeout(() => setShowQrCodeMessage(true), 5000);
     if (!walletConnector) {
         return null;
     }
     const icon = (jsx(WalletIcon, { walletKey: walletConnector.key, style: { height: pixelToRem(32), width: pixelToRem(32) } }));
-    return (jsxs("div", { "data-testid": 'qr-code-view', children: [jsx(AnimatePresence, { animationComponent: jsx(VerticalDrawerTransition, { style: { width: '100%' } }), children: showQrCodeMessage && !showQrCodeImage && (jsxs("div", { className: 'qr-code-view__scan-issue-message', children: [jsx(Typography, { color: 'primary', variant: 'body_small', children: "If you're having issues scanning, click\u00A0" }), jsx("button", { "data-testid": 'qr-code-view__scan-issue-button', className: 'qr-code-view__scan-issue-button', onClick: () => setShowQrCodeImage(true), children: "here" })] })) }), jsx(QrCodeContainer, { showQrCodeMessage: showQrCodeMessage, desktopUri: desktopUri, accentColor: 
-                /* istanbul ignore next */
-                name === 'dark'
-                    ? theme.colors.textPrimary
-                    : (_a = getWalletPrimaryColor(walletBook, walletConnector.key)) !== null && _a !== void 0 ? _a : '', walletKey: walletConnector.key, walletName: walletConnector.name, qrcodeValue: qrcodeUri, Icon: icon, showCopyToClipboardButton: walletConnector.isWalletConnect, showQrCodeImage: showQrCodeImage })] }));
+    return (jsx(QrCodeWrapper, { uri: qrcodeUri, desktopUri: desktopUri, accentColor: 
+        /* istanbul ignore next */
+        name === 'dark'
+            ? theme.colors.textPrimary
+            : (_a = getWalletPrimaryColor(walletBook, walletConnector.key)) !== null && _a !== void 0 ? _a : '', icon: icon, showCopyToClipboardButton: walletConnector.isWalletConnect, walletConnector: walletConnector }));
 };
 
 export { QrCodeView };

package/src/lib/views/SelectHardwareWalletView/SelectHardwareWalletView.cjs

@@ -44,6 +44,7 @@ require('../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../components/OverlayCard/OverlayCard.context.cjs');
 require('../../context/FooterAnimationContext/index.cjs');
 var Typography = require('../../components/Typography/Typography.cjs');
+require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../context/WalletGroupContext/WalletGroupContext.cjs');
 require('../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.cjs');
 require('react-focus-lock');
@@ -51,7 +52,6 @@ var Divider = require('../../components/Divider/Divider.cjs');
 require('../../context/LoadingContext/LoadingContext.cjs');
 var Icon = require('../../components/Icon/Icon.cjs');
 require('i18next');
-require('qrcode');
 require('../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('formik');
@@ -68,9 +68,9 @@ require('../../components/IsBrowser/IsBrowser.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
+require('qrcode');
 require('../WalletList/WalletList.cjs');
 require('@hcaptcha/react-hcaptcha');
-require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 var HardwareWalletToggle = require('../../components/HardwareWalletToggle/HardwareWalletToggle.cjs');
 var WalletGroupItem = require('../WalletGroupView/components/WalletGroupItem/WalletGroupItem.cjs');
 require('../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');

package/src/lib/views/SelectHardwareWalletView/SelectHardwareWalletView.js

@@ -40,6 +40,7 @@ import '../../components/ShadowDOM/ShadowDOM.js';
 import '../../components/OverlayCard/OverlayCard.context.js';
 import '../../context/FooterAnimationContext/index.js';
 import { Typography } from '../../components/Typography/Typography.js';
+import '../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../context/WalletGroupContext/WalletGroupContext.js';
 import '../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
 import 'react-focus-lock';
@@ -47,7 +48,6 @@ import { Divider } from '../../components/Divider/Divider.js';
 import '../../context/LoadingContext/LoadingContext.js';
 import { Icon } from '../../components/Icon/Icon.js';
 import 'i18next';
-import 'qrcode';
 import '../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import 'formik';
@@ -64,9 +64,9 @@ import '../../components/IsBrowser/IsBrowser.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
+import 'qrcode';
 import '../WalletList/WalletList.js';
 import '@hcaptcha/react-hcaptcha';
-import '../../context/SocialRedirectContext/SocialRedirectContext.js';
 import { HardwareWalletToggle } from '../../components/HardwareWalletToggle/HardwareWalletToggle.js';
 import { WalletGroupItem } from '../WalletGroupView/components/WalletGroupItem/WalletGroupItem.js';
 import '../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';

package/src/lib/views/SelectWalletInWalletGroupView/SelectWalletInWalletGroupView.cjs

@@ -52,13 +52,13 @@ require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('react-focus-lock');
+require('qrcode');
 require('formik');
 require('i18next');
 require('../../components/OverlayCard/OverlayCard.context.cjs');
 require('../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
 require('../../context/PasskeyContext/PasskeyContext.cjs');
 require('../WalletList/WalletList.cjs');
-require('qrcode');
 require('@hcaptcha/react-hcaptcha');
 require('../../context/LoadingContext/LoadingContext.cjs');
 require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');

package/src/lib/views/SelectWalletInWalletGroupView/SelectWalletInWalletGroupView.js

@@ -48,13 +48,13 @@ import '../../components/Transition/OpacityTransition/OpacityTransition.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'react-focus-lock';
+import 'qrcode';
 import 'formik';
 import 'i18next';
 import '../../components/OverlayCard/OverlayCard.context.js';
 import '../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
 import '../../context/PasskeyContext/PasskeyContext.js';
 import '../WalletList/WalletList.js';
-import 'qrcode';
 import '@hcaptcha/react-hcaptcha';
 import '../../context/LoadingContext/LoadingContext.js';
 import '../../context/SocialRedirectContext/SocialRedirectContext.js';

package/src/lib/views/SelectWalletInWalletGroupView/components/WalletGroupItem/WalletGroupItem.cjs

@@ -47,6 +47,7 @@ require('../../../../components/ShadowDOM/ShadowDOM.cjs');
 require('../../../../components/OverlayCard/OverlayCard.context.cjs');
 require('../../../../context/FooterAnimationContext/index.cjs');
 var Typography = require('../../../../components/Typography/Typography.cjs');
+require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 var Badge = require('../../../../components/Badge/Badge.cjs');
 require('../../../../context/WalletGroupContext/WalletGroupContext.cjs');
 var ListTileAnimatedTrailing = require('../../../../components/ListTileAnimatedTrailing/ListTileAnimatedTrailing.cjs');
@@ -55,7 +56,6 @@ require('react-focus-lock');
 require('../../../../context/LoadingContext/LoadingContext.cjs');
 var Icon = require('../../../../components/Icon/Icon.cjs');
 require('i18next');
-require('qrcode');
 require('../../../../widgets/DynamicWidget/context/DynamicWidgetContext.cjs');
 require('../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 require('formik');
@@ -73,9 +73,9 @@ require('../../../../components/IsBrowser/IsBrowser.cjs');
 require('../../../../components/MenuList/Dropdown/Dropdown.cjs');
 require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
+require('qrcode');
 require('../../../WalletList/WalletList.cjs');
 require('@hcaptcha/react-hcaptcha');
-require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 require('../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.cjs');
 
 const WalletGroupItem = ({ groupKey, wallet, onClick, }) => {

package/src/lib/views/SelectWalletInWalletGroupView/components/WalletGroupItem/WalletGroupItem.js

@@ -43,6 +43,7 @@ import '../../../../components/ShadowDOM/ShadowDOM.js';
 import '../../../../components/OverlayCard/OverlayCard.context.js';
 import '../../../../context/FooterAnimationContext/index.js';
 import { Typography } from '../../../../components/Typography/Typography.js';
+import '../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import { Badge } from '../../../../components/Badge/Badge.js';
 import '../../../../context/WalletGroupContext/WalletGroupContext.js';
 import { ListTileAnimatedTrailing } from '../../../../components/ListTileAnimatedTrailing/ListTileAnimatedTrailing.js';
@@ -51,7 +52,6 @@ import 'react-focus-lock';
 import '../../../../context/LoadingContext/LoadingContext.js';
 import { Icon } from '../../../../components/Icon/Icon.js';
 import 'i18next';
-import 'qrcode';
 import '../../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
 import '../../../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import 'formik';
@@ -69,9 +69,9 @@ import '../../../../components/IsBrowser/IsBrowser.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 import '../../../../components/Popper/Popper/Popper.js';
 import '../../../../components/Popper/PopperContext/PopperContext.js';
+import 'qrcode';
 import '../../../WalletList/WalletList.js';
 import '@hcaptcha/react-hcaptcha';
-import '../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import '../../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
 
 const WalletGroupItem = ({ groupKey, wallet, onClick, }) => {

package/src/lib/views/SendBalanceView/SendBalanceView.cjs

@@ -55,6 +55,7 @@ require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 require('../../components/Popper/Popper/Popper.cjs');
 require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('react-focus-lock');
+require('qrcode');
 var SendBalancePageLayout = require('../../components/SendBalancePageLayout/SendBalancePageLayout.cjs');
 require('../../components/OverlayCard/OverlayCard.context.cjs');
 require('../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
@@ -63,7 +64,6 @@ require('../WalletList/WalletList.cjs');
 var useFetchChain = require('../../widgets/DynamicWidget/hooks/useFetchChain/useFetchChain.cjs');
 var useFetchCurrency = require('../../widgets/DynamicWidget/hooks/useFetchCurrency/useFetchCurrency.cjs');
 require('formik');
-require('qrcode');
 require('@hcaptcha/react-hcaptcha');
 require('../../context/LoadingContext/LoadingContext.cjs');
 require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');

package/src/lib/views/SendBalanceView/SendBalanceView.js

@@ -51,6 +51,7 @@ import '../../components/Transition/OpacityTransition/OpacityTransition.js';
 import '../../components/Popper/Popper/Popper.js';
 import '../../components/Popper/PopperContext/PopperContext.js';
 import 'react-focus-lock';
+import 'qrcode';
 import { SendBalancePageLayout } from '../../components/SendBalancePageLayout/SendBalancePageLayout.js';
 import '../../components/OverlayCard/OverlayCard.context.js';
 import '../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
@@ -59,7 +60,6 @@ import '../WalletList/WalletList.js';
 import { useFetchChain } from '../../widgets/DynamicWidget/hooks/useFetchChain/useFetchChain.js';
 import { useFetchCurrency } from '../../widgets/DynamicWidget/hooks/useFetchCurrency/useFetchCurrency.js';
 import 'formik';
-import 'qrcode';
 import '@hcaptcha/react-hcaptcha';
 import '../../context/LoadingContext/LoadingContext.js';
 import '../../context/SocialRedirectContext/SocialRedirectContext.js';

package/src/lib/views/SendBalanceView/components/TransactionStage/TransactionStage.cjs

@@ -51,13 +51,13 @@ require('../../../../components/Transition/OpacityTransition/OpacityTransition.c
 require('../../../../components/Popper/Popper/Popper.cjs');
 require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 require('react-focus-lock');
+require('qrcode');
 require('formik');
 require('i18next');
 require('../../../../components/OverlayCard/OverlayCard.context.cjs');
 require('../../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.cjs');
 require('../../../../context/PasskeyContext/PasskeyContext.cjs');
 require('../../../WalletList/WalletList.cjs');
-require('qrcode');
 require('@hcaptcha/react-hcaptcha');
 require('../../../../context/LoadingContext/LoadingContext.cjs');
 require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');