npm install @tomo-inc/wallet-connect-sdk
Adding the Context Provider
import {
TomoContextProvider,
useTomoModalControl,
useTomoWalletConnect
} from '@tomo-inc/wallet-connect-sdk'
export default function Demo() {
return (
<TomoContextProvider
// optional
style={{
rounded: 'medium',
theme: 'light',
primaryColor: '#FF7C2A'
}}
>
<ChildComponent />
</TomoContextProvider>
)
}
type ChildProps = {
style: TomoProviderSetting['style']
setStyle: (v: TomoProviderSetting['style']) => void
}
export function ChildComponent(props: ChildProps) {
const tomoModal = useTomoModalControl()
const tomoWalletConnect = useTomoWalletConnect()
return (
<div style={{ textAlign: 'right' }}>
<button
onClick={async () => {
await tomoModal.open('connect')
}}
>
Connect Wallet
</button>
<button
onClick={async () => {
await tomoWalletConnect.disconnect()
}}
>
Disconnect Wallet
</button>
</div>
)
}
Using the above code in your dApp, you can easily open Tomo BTC connect modal and interact with the supported Bitcon & Cosmos wallets.