@dynamic-labs/sdk-react-core 0.18.100-viem.0 → 0.19.0-alpha.1

package/src/lib/layout/DynamicAuthLayout/HelpContent/WalletMoreInfoContent/WalletMoreInfoContent.js

@@ -13,7 +13,7 @@ import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../../../utils/constants/colors.js';
 import '../../../../shared/utils/classes/storage/localStorage.js';
-import 'viem';
+import 'ethers';
 import '../../../../shared/consts/index.js';
 import '../../../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/multi-wallet';
@@ -45,53 +45,53 @@ import 'yup';
 import '../../../../components/InlineWidget/InlineWidget.js';
 import '../../../../components/MenuList/Dropdown/Dropdown.js';
 
-const WalletMoreInfoContent = ({ variant, walletName, }) => {
-    const defaultSignContent = {
-        info: [
-            {
-                content: 'Signing proves you have access to your wallet. It’s a bit like verifying your email by clicking an email confirmation link in your inbox during signup. This does not approve a transaction.',
-                icon: SvgFooterKeyIcon,
-                title: 'Confirms you own your wallet',
-            },
-            {
-                icon: SvgFooterGasIcon,
-                title: 'There are no associated gas costs',
-            },
-        ],
-    };
-    const signInfoMessage = walletName === PhantomLedgerWalletName
-        ? {
-            info: [
-                {
-                    content: 'By connecting a wallet to a website, you are allowing the site to read the contents of your wallet. This does not approve a transaction.',
-                    icon: SvgFooterEyeIcon,
-                    title: 'Allows read access',
-                },
-                {
-                    content: (jsxs("div", { className: 'footer-more-info-content__item--phantom-ledger', children: [jsx(Typography, { as: 'p', variant: 'body_small', weight: 'regular', children: "Ledger does not support message signing functionality, commonly used to log in to sites. Instead, we sign a transaction as a proxy to prove ownership of the wallet." }), jsxs(Typography, { as: 'p', variant: 'body_small', weight: 'regular', children: [jsx("strong", { children: "Important" }), ": we do not", ' ', jsx("strong", { children: "broadcast" }), " this transaction, meaning Ledger based login will still be gasless."] }), jsx(Typography, { as: 'p', variant: 'body_small', weight: 'regular', children: "Phantom in turn shows that a fee may apply as part of the \u201Ctransaction\u201D." }), jsx(Typography, { as: 'p', variant: 'body_small', weight: 'regular', children: "As always, please be cautious of the extensions and websites you use to prevent unwanted transactions from being broadcasted to the network." })] })),
-                    icon: SvgFooterGasIcon,
-                    title: 'Why do I see a fee when using ledger',
-                },
-            ],
-        }
-        : defaultSignContent;
-    const copys = {
-        connect: {
-            info: [
-                {
-                    content: 'By connecting a wallet to a website, you are allowing the site to read the contents of your wallet. This does not approve a transaction.',
-                    icon: SvgFooterEyeIcon,
-                    title: 'Allows read access',
-                },
-                {
-                    icon: SvgFooterGasIcon,
-                    title: 'There are no associated gas costs',
-                },
-            ],
-        },
-        sign: signInfoMessage,
-    };
-    return (jsxs("div", { className: 'footer-more-info-content__wrapper', children: [copys[variant].info.map((item, index) => (jsx("div", { className: 'footer-more-info-content__item', children: jsx(EnterTileAnimation, { delay: `${0.3 + index * 0.2}s`, children: jsx(InfoItem, { Icon: item.icon, title: item.title, content: item.content }) }) }, index))), jsx(EnterTileAnimation, { delay: `${0.3 + copys[variant].info.length * 0.2}s`, children: jsx(PoweredByDynamic, { align: 'center' }) })] }));
+const WalletMoreInfoContent = ({ variant, walletName, }) => {
+    const defaultSignContent = {
+        info: [
+            {
+                content: 'Signing proves you have access to your wallet. It’s a bit like verifying your email by clicking an email confirmation link in your inbox during signup. This does not approve a transaction.',
+                icon: SvgFooterKeyIcon,
+                title: 'Confirms you own your wallet',
+            },
+            {
+                icon: SvgFooterGasIcon,
+                title: 'There are no associated gas costs',
+            },
+        ],
+    };
+    const signInfoMessage = walletName === PhantomLedgerWalletName
+        ? {
+            info: [
+                {
+                    content: 'By connecting a wallet to a website, you are allowing the site to read the contents of your wallet. This does not approve a transaction.',
+                    icon: SvgFooterEyeIcon,
+                    title: 'Allows read access',
+                },
+                {
+                    content: (jsxs("div", Object.assign({ className: 'footer-more-info-content__item--phantom-ledger' }, { children: [jsx(Typography, Object.assign({ as: 'p', variant: 'body_small', weight: 'regular' }, { children: "Ledger does not support message signing functionality, commonly used to log in to sites. Instead, we sign a transaction as a proxy to prove ownership of the wallet." })), jsxs(Typography, Object.assign({ as: 'p', variant: 'body_small', weight: 'regular' }, { children: [jsx("strong", { children: "Important" }), ": we do not", ' ', jsx("strong", { children: "broadcast" }), " this transaction, meaning Ledger based login will still be gasless."] })), jsx(Typography, Object.assign({ as: 'p', variant: 'body_small', weight: 'regular' }, { children: "Phantom in turn shows that a fee may apply as part of the \u201Ctransaction\u201D." })), jsx(Typography, Object.assign({ as: 'p', variant: 'body_small', weight: 'regular' }, { children: "As always, please be cautious of the extensions and websites you use to prevent unwanted transactions from being broadcasted to the network." }))] }))),
+                    icon: SvgFooterGasIcon,
+                    title: 'Why do I see a fee when using ledger',
+                },
+            ],
+        }
+        : defaultSignContent;
+    const copys = {
+        connect: {
+            info: [
+                {
+                    content: 'By connecting a wallet to a website, you are allowing the site to read the contents of your wallet. This does not approve a transaction.',
+                    icon: SvgFooterEyeIcon,
+                    title: 'Allows read access',
+                },
+                {
+                    icon: SvgFooterGasIcon,
+                    title: 'There are no associated gas costs',
+                },
+            ],
+        },
+        sign: signInfoMessage,
+    };
+    return (jsxs("div", Object.assign({ className: 'footer-more-info-content__wrapper' }, { children: [copys[variant].info.map((item, index) => (jsx("div", Object.assign({ className: 'footer-more-info-content__item' }, { children: jsx(EnterTileAnimation, Object.assign({ delay: `${0.3 + index * 0.2}s` }, { children: jsx(InfoItem, { Icon: item.icon, title: item.title, content: item.content }) })) }), index))), jsx(EnterTileAnimation, Object.assign({ delay: `${0.3 + copys[variant].info.length * 0.2}s` }, { children: jsx(PoweredByDynamic, { align: 'center' }) }))] })));
 };
 
 export { WalletMoreInfoContent };

package/src/lib/layout/DynamicAuthLayout/HelpContent/WalletMoreInfoContent/index.d.ts

@@ -1 +1 @@
-export { WalletMoreInfoContent } from './WalletMoreInfoContent';
+export { WalletMoreInfoContent } from './WalletMoreInfoContent';

package/src/lib/layout/DynamicAuthLayout/HelpContent/index.d.ts

@@ -1,4 +1,4 @@
-export { EmptyHelpContent } from './EmptyHelpContent';
-export { WalletMoreInfoContent } from './WalletMoreInfoContent';
-export { WalletListHelpContent } from './WalletListHelpContent';
-export { HelpContent } from './HelpContent';
+export { EmptyHelpContent } from './EmptyHelpContent';
+export { WalletMoreInfoContent } from './WalletMoreInfoContent';
+export { WalletListHelpContent } from './WalletListHelpContent';
+export { HelpContent } from './HelpContent';

package/src/lib/layout/DynamicAuthLayout/ToSFooter/ToSFooter.cjs

@@ -13,7 +13,7 @@ require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../../utils/constants/colors.cjs');
 require('../../../shared/utils/classes/storage/localStorage.cjs');
-require('viem');
+require('ethers');
 require('../../../shared/consts/index.cjs');
 require('../../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
@@ -44,9 +44,9 @@ require('../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../components/MenuList/Dropdown/Dropdown.cjs');
 var useAuthLayoutChecks = require('../../../utils/hooks/useAuthLayoutChecks/useAuthLayoutChecks.cjs');
 
-const ToSFooter = () => {
-    const { showToSFooter } = useAuthLayoutChecks.useAuthLayoutChecks();
-    return (jsxRuntime.jsx("div", { className: 'tos-and-pp__footer', children: showToSFooter && jsxRuntime.jsx(TosAndPp.TosAndPp, {}) }));
+const ToSFooter = () => {
+    const { showToSFooter } = useAuthLayoutChecks.useAuthLayoutChecks();
+    return (jsxRuntime.jsx("div", Object.assign({ className: 'tos-and-pp__footer' }, { children: showToSFooter && jsxRuntime.jsx(TosAndPp.TosAndPp, {}) })));
 };
 
 exports.ToSFooter = ToSFooter;

package/src/lib/layout/DynamicAuthLayout/ToSFooter/ToSFooter.d.ts

@@ -1,2 +1,2 @@
-/// <reference types="react" />
-export declare const ToSFooter: () => JSX.Element;
+/// <reference types="react" />
+export declare const ToSFooter: () => JSX.Element;

package/src/lib/layout/DynamicAuthLayout/ToSFooter/ToSFooter.js

@@ -9,7 +9,7 @@ import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../../utils/constants/colors.js';
 import '../../../shared/utils/classes/storage/localStorage.js';
-import 'viem';
+import 'ethers';
 import '../../../shared/consts/index.js';
 import '../../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/multi-wallet';
@@ -40,9 +40,9 @@ import '../../../components/InlineWidget/InlineWidget.js';
 import '../../../components/MenuList/Dropdown/Dropdown.js';
 import { useAuthLayoutChecks } from '../../../utils/hooks/useAuthLayoutChecks/useAuthLayoutChecks.js';
 
-const ToSFooter = () => {
-    const { showToSFooter } = useAuthLayoutChecks();
-    return (jsx("div", { className: 'tos-and-pp__footer', children: showToSFooter && jsx(TosAndPp, {}) }));
+const ToSFooter = () => {
+    const { showToSFooter } = useAuthLayoutChecks();
+    return (jsx("div", Object.assign({ className: 'tos-and-pp__footer' }, { children: showToSFooter && jsx(TosAndPp, {}) })));
 };
 
 export { ToSFooter };

package/src/lib/layout/DynamicAuthLayout/ToSFooter/index.d.ts

@@ -1 +1 @@
-export { ToSFooter } from './ToSFooter';
+export { ToSFooter } from './ToSFooter';

package/src/lib/layout/DynamicAuthLayout/WalletProgressStepper/WalletProgressStepper.cjs

@@ -12,7 +12,7 @@ require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../../utils/constants/colors.cjs');
 require('../../../shared/utils/classes/storage/localStorage.cjs');
-require('viem');
+require('ethers');
 require('@dynamic-labs/iconic');
 require('../../../context/ViewContext/ViewContext.cjs');
 require('../../../shared/consts/index.cjs');
@@ -46,16 +46,16 @@ require('../../../components/InlineWidget/InlineWidget.cjs');
 require('../../../components/MenuList/Dropdown/Dropdown.cjs');
 var getChainStepState = require('../utils/getChainStepState/getChainStepState.cjs');
 
-const WalletProgressStepper = () => {
-    const { walletsToConnectByChain = [], walletsByChain = [] } = useInternalDynamicContext.useInternalDynamicContext();
-    const allChains = walletsByChain.map(({ chain }) => chain);
-    const chainsLeftToConnect = [...walletsToConnectByChain].map(({ chain }) => chain);
-    return (jsxRuntime.jsx("div", { className: 'wallet-progress-stepper', "data-testid": 'wallet-progress-stepper', children: jsxRuntime.jsx(Stepper.Stepper, { children: allChains.map((chain, index) => {
-                var _a;
-                const chainInfo = walletConnectorCore.getChainInfo(chain);
-                const PrimaryWalletChainIcon = getChainIcon.getChainIcon(chain);
-                return (jsxRuntime.jsx(Step.Step, { state: getChainStepState.getChainStepState(chain, chainsLeftToConnect), icon: jsxRuntime.jsx(PrimaryWalletChainIcon, {}), children: (_a = chainInfo === null || chainInfo === void 0 ? void 0 : chainInfo.blockchainName) !== null && _a !== void 0 ? _a : chainInfo === null || chainInfo === void 0 ? void 0 : chainInfo.displayName }, chain));
-            }) }) }));
+const WalletProgressStepper = () => {
+    const { walletsToConnectByChain = [], walletsByChain = [] } = useInternalDynamicContext.useInternalDynamicContext();
+    const allChains = walletsByChain.map(({ chain }) => chain);
+    const chainsLeftToConnect = [...walletsToConnectByChain].map(({ chain }) => chain);
+    return (jsxRuntime.jsx("div", Object.assign({ className: 'wallet-progress-stepper', "data-testid": 'wallet-progress-stepper' }, { children: jsxRuntime.jsx(Stepper.Stepper, { children: allChains.map((chain, index) => {
+                var _a;
+                const chainInfo = walletConnectorCore.getChainInfo(chain);
+                const PrimaryWalletChainIcon = getChainIcon.getChainIcon(chain);
+                return (jsxRuntime.jsx(Step.Step, Object.assign({ state: getChainStepState.getChainStepState(chain, chainsLeftToConnect), icon: jsxRuntime.jsx(PrimaryWalletChainIcon, {}) }, { children: (_a = chainInfo === null || chainInfo === void 0 ? void 0 : chainInfo.blockchainName) !== null && _a !== void 0 ? _a : chainInfo === null || chainInfo === void 0 ? void 0 : chainInfo.displayName }), chain));
+            }) }) })));
 };
 
 exports.WalletProgressStepper = WalletProgressStepper;

package/src/lib/layout/DynamicAuthLayout/WalletProgressStepper/WalletProgressStepper.d.ts

@@ -1,2 +1,2 @@
-/// <reference types="react" />
-export declare const WalletProgressStepper: () => JSX.Element;
+/// <reference types="react" />
+export declare const WalletProgressStepper: () => JSX.Element;

package/src/lib/layout/DynamicAuthLayout/WalletProgressStepper/WalletProgressStepper.js

@@ -8,7 +8,7 @@ import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../../utils/constants/colors.js';
 import '../../../shared/utils/classes/storage/localStorage.js';
-import 'viem';
+import 'ethers';
 import '@dynamic-labs/iconic';
 import '../../../context/ViewContext/ViewContext.js';
 import '../../../shared/consts/index.js';
@@ -42,16 +42,16 @@ import '../../../components/InlineWidget/InlineWidget.js';
 import '../../../components/MenuList/Dropdown/Dropdown.js';
 import { getChainStepState } from '../utils/getChainStepState/getChainStepState.js';
 
-const WalletProgressStepper = () => {
-    const { walletsToConnectByChain = [], walletsByChain = [] } = useInternalDynamicContext();
-    const allChains = walletsByChain.map(({ chain }) => chain);
-    const chainsLeftToConnect = [...walletsToConnectByChain].map(({ chain }) => chain);
-    return (jsx("div", { className: 'wallet-progress-stepper', "data-testid": 'wallet-progress-stepper', children: jsx(Stepper, { children: allChains.map((chain, index) => {
-                var _a;
-                const chainInfo = getChainInfo(chain);
-                const PrimaryWalletChainIcon = getChainIcon(chain);
-                return (jsx(Step, { state: getChainStepState(chain, chainsLeftToConnect), icon: jsx(PrimaryWalletChainIcon, {}), children: (_a = chainInfo === null || chainInfo === void 0 ? void 0 : chainInfo.blockchainName) !== null && _a !== void 0 ? _a : chainInfo === null || chainInfo === void 0 ? void 0 : chainInfo.displayName }, chain));
-            }) }) }));
+const WalletProgressStepper = () => {
+    const { walletsToConnectByChain = [], walletsByChain = [] } = useInternalDynamicContext();
+    const allChains = walletsByChain.map(({ chain }) => chain);
+    const chainsLeftToConnect = [...walletsToConnectByChain].map(({ chain }) => chain);
+    return (jsx("div", Object.assign({ className: 'wallet-progress-stepper', "data-testid": 'wallet-progress-stepper' }, { children: jsx(Stepper, { children: allChains.map((chain, index) => {
+                var _a;
+                const chainInfo = getChainInfo(chain);
+                const PrimaryWalletChainIcon = getChainIcon(chain);
+                return (jsx(Step, Object.assign({ state: getChainStepState(chain, chainsLeftToConnect), icon: jsx(PrimaryWalletChainIcon, {}) }, { children: (_a = chainInfo === null || chainInfo === void 0 ? void 0 : chainInfo.blockchainName) !== null && _a !== void 0 ? _a : chainInfo === null || chainInfo === void 0 ? void 0 : chainInfo.displayName }), chain));
+            }) }) })));
 };
 
 export { WalletProgressStepper };

package/src/lib/layout/DynamicAuthLayout/WalletProgressStepper/index.d.ts

@@ -1 +1 @@
-export { WalletProgressStepper } from './WalletProgressStepper';
+export { WalletProgressStepper } from './WalletProgressStepper';

package/src/lib/layout/DynamicAuthLayout/index.d.ts

@@ -1 +1 @@
-export { DynamicAuthLayout } from './DynamicAuthLayout';
+export { DynamicAuthLayout } from './DynamicAuthLayout';

package/src/lib/layout/DynamicAuthLayout/utils/getChainStepState/getChainStepState.cjs

@@ -2,17 +2,17 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-// Derive step state from remaining wallets
-const getChainStepState = (chain, chainsLeftToConnect) => {
-    const isCurrentStep = chain === chainsLeftToConnect[0];
-    const isStepComplete = !chainsLeftToConnect.includes(chain);
-    if (isCurrentStep) {
-        return 'current';
-    }
-    if (isStepComplete) {
-        return 'done';
-    }
-    return 'upcoming';
+// Derive step state from remaining wallets
+const getChainStepState = (chain, chainsLeftToConnect) => {
+    const isCurrentStep = chain === chainsLeftToConnect[0];
+    const isStepComplete = !chainsLeftToConnect.includes(chain);
+    if (isCurrentStep) {
+        return 'current';
+    }
+    if (isStepComplete) {
+        return 'done';
+    }
+    return 'upcoming';
 };
 
 exports.getChainStepState = getChainStepState;

package/src/lib/layout/DynamicAuthLayout/utils/getChainStepState/getChainStepState.d.ts

@@ -1,3 +1,3 @@
-import { Chain } from '@dynamic-labs/wallet-connector-core';
-import { StepProps } from '../../../../components/Step/Step';
-export declare const getChainStepState: (chain: Chain, chainsLeftToConnect: Chain[]) => StepProps['state'];
+import { Chain } from '@dynamic-labs/wallet-connector-core';
+import { StepProps } from '../../../../components/Step/Step';
+export declare const getChainStepState: (chain: Chain, chainsLeftToConnect: Chain[]) => StepProps['state'];

package/src/lib/layout/DynamicAuthLayout/utils/getChainStepState/getChainStepState.js

@@ -1,14 +1,14 @@
-// Derive step state from remaining wallets
-const getChainStepState = (chain, chainsLeftToConnect) => {
-    const isCurrentStep = chain === chainsLeftToConnect[0];
-    const isStepComplete = !chainsLeftToConnect.includes(chain);
-    if (isCurrentStep) {
-        return 'current';
-    }
-    if (isStepComplete) {
-        return 'done';
-    }
-    return 'upcoming';
+// Derive step state from remaining wallets
+const getChainStepState = (chain, chainsLeftToConnect) => {
+    const isCurrentStep = chain === chainsLeftToConnect[0];
+    const isStepComplete = !chainsLeftToConnect.includes(chain);
+    if (isCurrentStep) {
+        return 'current';
+    }
+    if (isStepComplete) {
+        return 'done';
+    }
+    return 'upcoming';
 };
 
 export { getChainStepState };

package/src/lib/layout/DynamicAuthLayout/utils/getChainStepState/index.d.ts

@@ -1 +1 @@
-export { getChainStepState } from './getChainStepState';
+export { getChainStepState } from './getChainStepState';

package/src/lib/layout/DynamicAuthLayout/utils/index.d.ts

@@ -1 +1 @@
-export * from './getChainStepState';
+export * from './getChainStepState';

package/src/lib/layouts/BridgeNextWalletToConnectLayout/BridgeNextWalletToConnectLayout.cjs

@@ -15,7 +15,7 @@ require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../utils/constants/colors.cjs');
 require('../../shared/utils/classes/storage/localStorage.cjs');
-require('viem');
+require('ethers');
 require('../../shared/consts/index.cjs');
 require('../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
@@ -46,9 +46,9 @@ require('yup');
 require('../../components/InlineWidget/InlineWidget.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
 
-const BridgeNextWalletToConnectLayout = ({ chainName, chainIcon, onClickAction, onClickClose }) => {
-    const closeButton = onClickClose && (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: onClickClose, "data-testid": 'close-button', children: jsxRuntime.jsx(close.ReactComponent, {}) }));
-    return (jsxRuntime.jsxs("div", { className: 'bridge-next-wallet-to-connect-layout', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { trailing: closeButton, alignContent: 'bottom', children: chainIcon && (jsxRuntime.jsx("div", { className: 'bridge-next-wallet-to-connect-layout__chain-icon', children: chainIcon })) }), jsxRuntime.jsxs("div", { className: 'bridge-next-wallet-to-connect-layout__body', children: [jsxRuntime.jsxs(Typography.Typography, { color: 'primary', variant: 'title', children: ["Nice! Now let\u2019s connect your ", chainName, " wallet"] }), jsxRuntime.jsx(Button.Button, { expanded: true, buttonRounded: 'default', buttonPadding: 'large', onClick: onClickAction, children: `Connect ${chainName} wallet` })] })] }));
+const BridgeNextWalletToConnectLayout = ({ chainName, chainIcon, onClickAction, onClickClose }) => {
+    const closeButton = onClickClose && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ type: 'button', onClick: onClickClose, "data-testid": 'close-button' }, { children: jsxRuntime.jsx(close.ReactComponent, {}) })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: 'bridge-next-wallet-to-connect-layout' }, { children: [jsxRuntime.jsx(ModalHeader.ModalHeader, Object.assign({ trailing: closeButton, alignContent: 'bottom' }, { children: chainIcon && (jsxRuntime.jsx("div", Object.assign({ className: 'bridge-next-wallet-to-connect-layout__chain-icon' }, { children: chainIcon }))) })), jsxRuntime.jsxs("div", Object.assign({ className: 'bridge-next-wallet-to-connect-layout__body' }, { children: [jsxRuntime.jsxs(Typography.Typography, Object.assign({ color: 'primary', variant: 'title' }, { children: ["Nice! Now let\u2019s connect your ", chainName, " wallet"] })), jsxRuntime.jsx(Button.Button, Object.assign({ expanded: true, buttonRounded: 'default', buttonPadding: 'large', onClick: onClickAction }, { children: `Connect ${chainName} wallet` }))] }))] })));
 };
 
 exports.BridgeNextWalletToConnectLayout = BridgeNextWalletToConnectLayout;

package/src/lib/layouts/BridgeNextWalletToConnectLayout/BridgeNextWalletToConnectLayout.d.ts

@@ -1,9 +1,9 @@
-import { FC, MouseEventHandler, ReactNode } from 'react';
-type BridgeNextWalletToConnectLayoutProps = {
-    chainName: string;
-    chainIcon?: ReactNode;
-    onClickAction?: MouseEventHandler<HTMLButtonElement>;
-    onClickClose?: MouseEventHandler<HTMLButtonElement>;
-};
-export declare const BridgeNextWalletToConnectLayout: FC<BridgeNextWalletToConnectLayoutProps>;
-export {};
+import { FC, MouseEventHandler, ReactNode } from 'react';
+type BridgeNextWalletToConnectLayoutProps = {
+    chainName: string;
+    chainIcon?: ReactNode;
+    onClickAction?: MouseEventHandler<HTMLButtonElement>;
+    onClickClose?: MouseEventHandler<HTMLButtonElement>;
+};
+export declare const BridgeNextWalletToConnectLayout: FC<BridgeNextWalletToConnectLayoutProps>;
+export {};

package/src/lib/layouts/BridgeNextWalletToConnectLayout/BridgeNextWalletToConnectLayout.js

@@ -11,7 +11,7 @@ import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../utils/constants/colors.js';
 import '../../shared/utils/classes/storage/localStorage.js';
-import 'viem';
+import 'ethers';
 import '../../shared/consts/index.js';
 import '../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/multi-wallet';
@@ -42,9 +42,9 @@ import 'yup';
 import '../../components/InlineWidget/InlineWidget.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
 
-const BridgeNextWalletToConnectLayout = ({ chainName, chainIcon, onClickAction, onClickClose }) => {
-    const closeButton = onClickClose && (jsx(IconButton, { type: 'button', onClick: onClickClose, "data-testid": 'close-button', children: jsx(SvgClose, {}) }));
-    return (jsxs("div", { className: 'bridge-next-wallet-to-connect-layout', children: [jsx(ModalHeader, { trailing: closeButton, alignContent: 'bottom', children: chainIcon && (jsx("div", { className: 'bridge-next-wallet-to-connect-layout__chain-icon', children: chainIcon })) }), jsxs("div", { className: 'bridge-next-wallet-to-connect-layout__body', children: [jsxs(Typography, { color: 'primary', variant: 'title', children: ["Nice! Now let\u2019s connect your ", chainName, " wallet"] }), jsx(Button, { expanded: true, buttonRounded: 'default', buttonPadding: 'large', onClick: onClickAction, children: `Connect ${chainName} wallet` })] })] }));
+const BridgeNextWalletToConnectLayout = ({ chainName, chainIcon, onClickAction, onClickClose }) => {
+    const closeButton = onClickClose && (jsx(IconButton, Object.assign({ type: 'button', onClick: onClickClose, "data-testid": 'close-button' }, { children: jsx(SvgClose, {}) })));
+    return (jsxs("div", Object.assign({ className: 'bridge-next-wallet-to-connect-layout' }, { children: [jsx(ModalHeader, Object.assign({ trailing: closeButton, alignContent: 'bottom' }, { children: chainIcon && (jsx("div", Object.assign({ className: 'bridge-next-wallet-to-connect-layout__chain-icon' }, { children: chainIcon }))) })), jsxs("div", Object.assign({ className: 'bridge-next-wallet-to-connect-layout__body' }, { children: [jsxs(Typography, Object.assign({ color: 'primary', variant: 'title' }, { children: ["Nice! Now let\u2019s connect your ", chainName, " wallet"] })), jsx(Button, Object.assign({ expanded: true, buttonRounded: 'default', buttonPadding: 'large', onClick: onClickAction }, { children: `Connect ${chainName} wallet` }))] }))] })));
 };
 
 export { BridgeNextWalletToConnectLayout };

package/src/lib/layouts/BridgeNextWalletToConnectLayout/index.d.ts

@@ -1 +1 @@
-export { BridgeNextWalletToConnectLayout } from './BridgeNextWalletToConnectLayout';
+export { BridgeNextWalletToConnectLayout } from './BridgeNextWalletToConnectLayout';

package/src/lib/layouts/BridgeWelcomeLayout/BridgeWelcomeLayout.cjs

@@ -15,7 +15,7 @@ require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../utils/constants/colors.cjs');
 require('../../shared/utils/classes/storage/localStorage.cjs');
-require('viem');
+require('ethers');
 require('../../shared/consts/index.cjs');
 require('../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
@@ -48,9 +48,9 @@ var Stepper = require('../../components/Stepper/Stepper.cjs');
 require('../../components/InlineWidget/InlineWidget.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
 
-const BridgeWelcomeLayout = ({ body, chains = [], onClickAction, onClickClose, title, actionButtonText, }) => {
-    const closeButton = onClickClose && (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: onClickClose, "data-testid": 'close-button', children: jsxRuntime.jsx(close.ReactComponent, {}) }));
-    return (jsxRuntime.jsxs("div", { className: 'bridge-welcome-layout', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { trailing: closeButton, alignContent: 'bottom', children: jsxRuntime.jsx("div", { className: 'bridge-welcome-layout__chain-icon-group', children: [...chains].reverse().map((chain, index) => (jsxRuntime.jsx("div", { className: 'bridge-welcome-layout__chain-icon', style: { zIndex: index }, children: chain.icon }, chain.id))) }) }), jsxRuntime.jsxs("div", { className: 'bridge-welcome-layout__body', children: [jsxRuntime.jsxs("div", { className: 'bridge-welcome-layout__message-container', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', children: title }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', children: body })] }), jsxRuntime.jsx("div", { children: jsxRuntime.jsx(Stepper.Stepper, { children: chains.map((chain) => (jsxRuntime.jsx(Step.Step, { children: chain.name }, chain.id))) }) }), jsxRuntime.jsx(Button.Button, { buttonVariant: 'primary', buttonRounded: 'default', buttonPadding: 'large', onClick: onClickAction, children: actionButtonText })] })] }));
+const BridgeWelcomeLayout = ({ body, chains = [], onClickAction, onClickClose, title, actionButtonText, }) => {
+    const closeButton = onClickClose && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ type: 'button', onClick: onClickClose, "data-testid": 'close-button' }, { children: jsxRuntime.jsx(close.ReactComponent, {}) })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: 'bridge-welcome-layout' }, { children: [jsxRuntime.jsx(ModalHeader.ModalHeader, Object.assign({ trailing: closeButton, alignContent: 'bottom' }, { children: jsxRuntime.jsx("div", Object.assign({ className: 'bridge-welcome-layout__chain-icon-group' }, { children: [...chains].reverse().map((chain, index) => (jsxRuntime.jsx("div", Object.assign({ className: 'bridge-welcome-layout__chain-icon', style: { zIndex: index } }, { children: chain.icon }), chain.id))) })) })), jsxRuntime.jsxs("div", Object.assign({ className: 'bridge-welcome-layout__body' }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: 'bridge-welcome-layout__message-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'title', color: 'primary' }, { children: title })), jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary' }, { children: body }))] })), jsxRuntime.jsx("div", { children: jsxRuntime.jsx(Stepper.Stepper, { children: chains.map((chain) => (jsxRuntime.jsx(Step.Step, { children: chain.name }, chain.id))) }) }), jsxRuntime.jsx(Button.Button, Object.assign({ buttonVariant: 'primary', buttonRounded: 'default', buttonPadding: 'large', onClick: onClickAction }, { children: actionButtonText }))] }))] })));
 };
 
 exports.BridgeWelcomeLayout = BridgeWelcomeLayout;

package/src/lib/layouts/BridgeWelcomeLayout/BridgeWelcomeLayout.d.ts

@@ -1,19 +1,19 @@
-import { FC, MouseEventHandler, ReactNode } from 'react';
-export type BridgeWelcomeLayoutChainInfo = {
-    id: number;
-    name: string;
-    icon: ReactNode;
-};
-export type BridgeWelcomeLayoutProps = {
-    title: ReactNode;
-    body: ReactNode;
-    actionButtonText: ReactNode;
-    chains?: {
-        id: number;
-        name: string;
-        icon: ReactNode;
-    }[];
-    onClickClose?: MouseEventHandler<HTMLButtonElement>;
-    onClickAction?: MouseEventHandler<HTMLButtonElement>;
-};
-export declare const BridgeWelcomeLayout: FC<BridgeWelcomeLayoutProps>;
+import { FC, MouseEventHandler, ReactNode } from 'react';
+export type BridgeWelcomeLayoutChainInfo = {
+    id: number;
+    name: string;
+    icon: ReactNode;
+};
+export type BridgeWelcomeLayoutProps = {
+    title: ReactNode;
+    body: ReactNode;
+    actionButtonText: ReactNode;
+    chains?: {
+        id: number;
+        name: string;
+        icon: ReactNode;
+    }[];
+    onClickClose?: MouseEventHandler<HTMLButtonElement>;
+    onClickAction?: MouseEventHandler<HTMLButtonElement>;
+};
+export declare const BridgeWelcomeLayout: FC<BridgeWelcomeLayoutProps>;

package/src/lib/layouts/BridgeWelcomeLayout/BridgeWelcomeLayout.js

@@ -11,7 +11,7 @@ import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../utils/constants/colors.js';
 import '../../shared/utils/classes/storage/localStorage.js';
-import 'viem';
+import 'ethers';
 import '../../shared/consts/index.js';
 import '../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/multi-wallet';
@@ -44,9 +44,9 @@ import { Stepper } from '../../components/Stepper/Stepper.js';
 import '../../components/InlineWidget/InlineWidget.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
 
-const BridgeWelcomeLayout = ({ body, chains = [], onClickAction, onClickClose, title, actionButtonText, }) => {
-    const closeButton = onClickClose && (jsx(IconButton, { type: 'button', onClick: onClickClose, "data-testid": 'close-button', children: jsx(SvgClose, {}) }));
-    return (jsxs("div", { className: 'bridge-welcome-layout', children: [jsx(ModalHeader, { trailing: closeButton, alignContent: 'bottom', children: jsx("div", { className: 'bridge-welcome-layout__chain-icon-group', children: [...chains].reverse().map((chain, index) => (jsx("div", { className: 'bridge-welcome-layout__chain-icon', style: { zIndex: index }, children: chain.icon }, chain.id))) }) }), jsxs("div", { className: 'bridge-welcome-layout__body', children: [jsxs("div", { className: 'bridge-welcome-layout__message-container', children: [jsx(Typography, { variant: 'title', color: 'primary', children: title }), jsx(Typography, { variant: 'body_normal', color: 'secondary', children: body })] }), jsx("div", { children: jsx(Stepper, { children: chains.map((chain) => (jsx(Step, { children: chain.name }, chain.id))) }) }), jsx(Button, { buttonVariant: 'primary', buttonRounded: 'default', buttonPadding: 'large', onClick: onClickAction, children: actionButtonText })] })] }));
+const BridgeWelcomeLayout = ({ body, chains = [], onClickAction, onClickClose, title, actionButtonText, }) => {
+    const closeButton = onClickClose && (jsx(IconButton, Object.assign({ type: 'button', onClick: onClickClose, "data-testid": 'close-button' }, { children: jsx(SvgClose, {}) })));
+    return (jsxs("div", Object.assign({ className: 'bridge-welcome-layout' }, { children: [jsx(ModalHeader, Object.assign({ trailing: closeButton, alignContent: 'bottom' }, { children: jsx("div", Object.assign({ className: 'bridge-welcome-layout__chain-icon-group' }, { children: [...chains].reverse().map((chain, index) => (jsx("div", Object.assign({ className: 'bridge-welcome-layout__chain-icon', style: { zIndex: index } }, { children: chain.icon }), chain.id))) })) })), jsxs("div", Object.assign({ className: 'bridge-welcome-layout__body' }, { children: [jsxs("div", Object.assign({ className: 'bridge-welcome-layout__message-container' }, { children: [jsx(Typography, Object.assign({ variant: 'title', color: 'primary' }, { children: title })), jsx(Typography, Object.assign({ variant: 'body_normal', color: 'secondary' }, { children: body }))] })), jsx("div", { children: jsx(Stepper, { children: chains.map((chain) => (jsx(Step, { children: chain.name }, chain.id))) }) }), jsx(Button, Object.assign({ buttonVariant: 'primary', buttonRounded: 'default', buttonPadding: 'large', onClick: onClickAction }, { children: actionButtonText }))] }))] })));
 };
 
 export { BridgeWelcomeLayout };

package/src/lib/layouts/BridgeWelcomeLayout/index.d.ts

@@ -1,2 +1,2 @@
-export { BridgeWelcomeLayout } from './BridgeWelcomeLayout';
-export type { BridgeWelcomeLayoutProps, BridgeWelcomeLayoutChainInfo, } from './BridgeWelcomeLayout';
+export { BridgeWelcomeLayout } from './BridgeWelcomeLayout';
+export type { BridgeWelcomeLayoutProps, BridgeWelcomeLayoutChainInfo, } from './BridgeWelcomeLayout';

package/src/lib/layouts/ConnectedWalletsListLayout/ConnectedWalletsListLayout.cjs

@@ -16,7 +16,7 @@ require('@dynamic-labs/wallet-book');
 require('@dynamic-labs/utils');
 require('../../utils/constants/colors.cjs');
 require('../../shared/utils/classes/storage/localStorage.cjs');
-require('viem');
+require('ethers');
 require('../../shared/consts/index.cjs');
 require('../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
@@ -47,10 +47,10 @@ require('yup');
 require('../../components/InlineWidget/InlineWidget.cjs');
 require('../../components/MenuList/Dropdown/Dropdown.cjs');
 
-const ConnectedWalletsListLayout = ({ title, body, onClickBack, onClickClose, onClickAction, actionButtonText = 'Continue', children, }) => {
-    const closeButton = onClickClose && (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: onClickClose, "data-testid": 'close-button', children: jsxRuntime.jsx(close.ReactComponent, {}) }));
-    const backButton = onClickBack && (jsxRuntime.jsx(IconButton.IconButton, { type: 'button', onClick: onClickBack, "data-testid": 'back-button', children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) }));
-    return (jsxRuntime.jsxs("div", { className: 'connected-wallets-list-layout', children: [jsxRuntime.jsx(ModalHeader.ModalHeader, { leading: backButton, trailing: closeButton, children: jsxRuntime.jsx(Typography.Typography, { variant: 'title', color: 'primary', children: title }) }), jsxRuntime.jsxs("div", { className: 'connected-wallets-list-layout__body', children: [jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', color: 'secondary', className: 'connected-wallets-list-layout__body__text', children: body }), children, jsxRuntime.jsx(Button.Button, { buttonPadding: 'large', buttonRounded: 'default', buttonVariant: 'primary', onClick: onClickAction, children: actionButtonText })] })] }));
+const ConnectedWalletsListLayout = ({ title, body, onClickBack, onClickClose, onClickAction, actionButtonText = 'Continue', children, }) => {
+    const closeButton = onClickClose && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ type: 'button', onClick: onClickClose, "data-testid": 'close-button' }, { children: jsxRuntime.jsx(close.ReactComponent, {}) })));
+    const backButton = onClickBack && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ type: 'button', onClick: onClickBack, "data-testid": 'back-button' }, { children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: 'connected-wallets-list-layout' }, { children: [jsxRuntime.jsx(ModalHeader.ModalHeader, Object.assign({ leading: backButton, trailing: closeButton }, { children: jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'title', color: 'primary' }, { children: title })) })), jsxRuntime.jsxs("div", Object.assign({ className: 'connected-wallets-list-layout__body' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', color: 'secondary', className: 'connected-wallets-list-layout__body__text' }, { children: body })), children, jsxRuntime.jsx(Button.Button, Object.assign({ buttonPadding: 'large', buttonRounded: 'default', buttonVariant: 'primary', onClick: onClickAction }, { children: actionButtonText }))] }))] })));
 };
 
 exports.ConnectedWalletsListLayout = ConnectedWalletsListLayout;

package/src/lib/layouts/ConnectedWalletsListLayout/ConnectedWalletsListLayout.d.ts

@@ -1,10 +1,10 @@
-import { FC, MouseEventHandler, PropsWithChildren, ReactNode } from 'react';
-export type ConnectedWalletsListLayoutProps = {
-    title: ReactNode;
-    body?: ReactNode;
-    onClickClose?: MouseEventHandler<HTMLButtonElement>;
-    onClickBack?: MouseEventHandler<HTMLButtonElement>;
-    onClickAction?: MouseEventHandler<HTMLButtonElement>;
-    actionButtonText?: ReactNode;
-};
-export declare const ConnectedWalletsListLayout: FC<PropsWithChildren<ConnectedWalletsListLayoutProps>>;
+import { FC, MouseEventHandler, PropsWithChildren, ReactNode } from 'react';
+export type ConnectedWalletsListLayoutProps = {
+    title: ReactNode;
+    body?: ReactNode;
+    onClickClose?: MouseEventHandler<HTMLButtonElement>;
+    onClickBack?: MouseEventHandler<HTMLButtonElement>;
+    onClickAction?: MouseEventHandler<HTMLButtonElement>;
+    actionButtonText?: ReactNode;
+};
+export declare const ConnectedWalletsListLayout: FC<PropsWithChildren<ConnectedWalletsListLayoutProps>>;

package/src/lib/layouts/ConnectedWalletsListLayout/ConnectedWalletsListLayout.js

@@ -12,7 +12,7 @@ import '@dynamic-labs/wallet-book';
 import '@dynamic-labs/utils';
 import '../../utils/constants/colors.js';
 import '../../shared/utils/classes/storage/localStorage.js';
-import 'viem';
+import 'ethers';
 import '../../shared/consts/index.js';
 import '../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/multi-wallet';
@@ -43,10 +43,10 @@ import 'yup';
 import '../../components/InlineWidget/InlineWidget.js';
 import '../../components/MenuList/Dropdown/Dropdown.js';
 
-const ConnectedWalletsListLayout = ({ title, body, onClickBack, onClickClose, onClickAction, actionButtonText = 'Continue', children, }) => {
-    const closeButton = onClickClose && (jsx(IconButton, { type: 'button', onClick: onClickClose, "data-testid": 'close-button', children: jsx(SvgClose, {}) }));
-    const backButton = onClickBack && (jsx(IconButton, { type: 'button', onClick: onClickBack, "data-testid": 'back-button', children: jsx(SvgChevronLeft, {}) }));
-    return (jsxs("div", { className: 'connected-wallets-list-layout', children: [jsx(ModalHeader, { leading: backButton, trailing: closeButton, children: jsx(Typography, { variant: 'title', color: 'primary', children: title }) }), jsxs("div", { className: 'connected-wallets-list-layout__body', children: [jsx(Typography, { variant: 'body_normal', color: 'secondary', className: 'connected-wallets-list-layout__body__text', children: body }), children, jsx(Button, { buttonPadding: 'large', buttonRounded: 'default', buttonVariant: 'primary', onClick: onClickAction, children: actionButtonText })] })] }));
+const ConnectedWalletsListLayout = ({ title, body, onClickBack, onClickClose, onClickAction, actionButtonText = 'Continue', children, }) => {
+    const closeButton = onClickClose && (jsx(IconButton, Object.assign({ type: 'button', onClick: onClickClose, "data-testid": 'close-button' }, { children: jsx(SvgClose, {}) })));
+    const backButton = onClickBack && (jsx(IconButton, Object.assign({ type: 'button', onClick: onClickBack, "data-testid": 'back-button' }, { children: jsx(SvgChevronLeft, {}) })));
+    return (jsxs("div", Object.assign({ className: 'connected-wallets-list-layout' }, { children: [jsx(ModalHeader, Object.assign({ leading: backButton, trailing: closeButton }, { children: jsx(Typography, Object.assign({ variant: 'title', color: 'primary' }, { children: title })) })), jsxs("div", Object.assign({ className: 'connected-wallets-list-layout__body' }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', color: 'secondary', className: 'connected-wallets-list-layout__body__text' }, { children: body })), children, jsx(Button, Object.assign({ buttonPadding: 'large', buttonRounded: 'default', buttonVariant: 'primary', onClick: onClickAction }, { children: actionButtonText }))] }))] })));
 };
 
 export { ConnectedWalletsListLayout };