In order for pps to communicate with the user's wallet, we need a way to connect to their wallet.

Add this CardanoWallet to allow the user to select a wallet to connect to your app. After the wallet is connected, see Browser Wallet for a list of CIP-30 APIs.

The signature for the CardanoWallet component is as follows:

Customization

For dark mode style, add isDark.

For a custom label, add the label prop.

The customization is limited. For more customization, you can easily build your own wallet connection component. If you are using React, the React hooks will be useful. You may also take reference from this component.

Persist user session

If you would like to save the user last connected wallet and automatically connect to it on the next visit, you can use the persist prop.

onConnected

If you want to run a function after the wallet is connected, you can add the onConnected prop.

The above code will log "Hello, World!" to the console when the wallet is connected.

Mesh Web3 Services

Mesh Web3 Services streamline user onboarding and on-chain feature integration, accelerating your app's time to market.

To integrate Mesh Web3 Services, use the web3Services prop. The networkId is the network ID of the wallet you are connecting to. You may use any providers for fetcher and submitter.

Decentralized WebRTC Wallet Communication (CIP 45)

CIP-45 is a communication method between pps and wallets based on WebTorrent trackers and WebRTC. Using WebTorrent trackers for the peer discovery to remove the need of this central component.

Burner wallet

Burner wallets are wallets that are created on the fly on the user's device. They are temporary wallets useful for testing purposes. The private keys are generated and stored on the user's device.

MetaMask Snaps

MetaMask Snaps are a new way to extend MetaMask with custom functionality and integrations. You can check the implementation to integrate NuFi from the GitHub repository.

Use the injectFn prop to add custom functionality.

If you love Mesh, here's a beautifully designed badge for you to embed in your application.