diff --git a/packages/dapp-kit-react/src/Components/ConnectWalletButtonWithModal/Components/ConnectButtonWithModal.tsx b/packages/dapp-kit-react/src/Components/ConnectWalletButtonWithModal/Components/ConnectButtonWithModal.tsx
index 78a7ae43..98504feb 100644
--- a/packages/dapp-kit-react/src/Components/ConnectWalletButtonWithModal/Components/ConnectButtonWithModal.tsx
+++ b/packages/dapp-kit-react/src/Components/ConnectWalletButtonWithModal/Components/ConnectButtonWithModal.tsx
@@ -1,13 +1,15 @@
-import { useCallback, useContext } from 'react';
+import { useCallback, useContext, useMemo } from 'react';
import type { WalletSource } from '@vechainfoundation/dapp-kit';
import type { SourceInfo } from '@vechainfoundation/dapp-kit-ui';
import { ThemeContext } from '../../../provider/ThemeProvider';
import { useWallet } from '../../../ConnexProvider';
-import { ConnectModalWithButtonWrapped } from './Wrapped/ConnectModalWithButtonWrapped';
+import { createButtonWithModal } from './Wrapped/ConnectModalWithButtonWrapped';
export const ConnectButtonWithModal = () => {
const { theme } = useContext(ThemeContext);
+ const ModalWithButton = useMemo(() => createButtonWithModal(), []);
+
const { setSource, connect, setAccount } = useWallet();
const connectHandler = useCallback(
@@ -32,12 +34,5 @@ export const ConnectButtonWithModal = () => {
[connectHandler],
);
- return (
- <>
-
- >
- );
+ return ;
};
diff --git a/packages/dapp-kit-react/src/Components/ConnectWalletButtonWithModal/Components/Wrapped/ConnectModalWithButtonWrapped.tsx b/packages/dapp-kit-react/src/Components/ConnectWalletButtonWithModal/Components/Wrapped/ConnectModalWithButtonWrapped.tsx
index ca9cad6a..249702bf 100644
--- a/packages/dapp-kit-react/src/Components/ConnectWalletButtonWithModal/Components/Wrapped/ConnectModalWithButtonWrapped.tsx
+++ b/packages/dapp-kit-react/src/Components/ConnectWalletButtonWithModal/Components/Wrapped/ConnectModalWithButtonWrapped.tsx
@@ -2,8 +2,9 @@ import React from 'react';
import { createComponent } from '@lit/react';
import { ConnectButtonWithModal } from '@vechainfoundation/dapp-kit-ui';
-export const ConnectModalWithButtonWrapped = createComponent({
- tagName: 'vwk-connect-button-with-modal',
- elementClass: ConnectButtonWithModal,
- react: React,
-});
+export const createButtonWithModal = () =>
+ createComponent({
+ tagName: 'vwk-connect-button-with-modal',
+ elementClass: ConnectButtonWithModal,
+ react: React,
+ });