WalletProvider

Use WalletProvider to set up the necessary context for your React app. Use it at the root of your app, so that you can use any of the dApp Kit wallet components underneath it.

import { WalletProvider } from '@mysten/dapp-kit';
 
function App() {
	return (
		<WalletProvider>
			<YourApp />
		</WalletProvider>
	);
}

The WalletProvider manages all wallet state for you, and makes the current wallet state available to other dApp Kit hooks and components.

Props

All props are optional.

• preferredWallets - A list of wallets that are sorted to the top of the wallet list.
• walletFilter - A filter function that accepts a wallet and returns a boolean. This filters the list of wallets presented to users when selecting a wallet to connect from, ensuring that only wallets that meet the dApp requirements can connect.
• enableUnsafeBurner - Enables the development-only unsafe burner wallet, useful for testing.
• autoConnect - Enables automatically reconnecting to the most recently used wallet account upon mounting.
• zkSend - Enables and configures the zkSend wallet. Read more about how to use the zkSend integration.
• storage - Configures how the most recently connected-to wallet account is stored. Set to null to disable persisting state entirely. Defaults to using localStorage if it is available.
• storageKey - The key to use to store the most recently connected wallet account.
• theme - The theme to use for styling UI components. Defaults to using the light theme.