Connecting a wallet

If your application does not use the CSPR.click top bar, you need to provide your own controls for wallet connection and session management. A typical application has buttons or menu items to connect a wallet, show the connected account, switch to another account, and disconnect.

This page explains which wallets are available to users and how to trigger the most common wallet session actions from your UI.

Available wallets

The wallets shown to the user are defined by the providers array in your SDK initialization options. CSPR.click uses this list when it opens the wallet selector, so only the wallets enabled by your application can be selected.

const clickSDKOptions: CsprClickInitOptions = {
  appName: 'CSPR.click demo',
  appId: 'csprclick-template',
  contentMode: CONTENT_MODE.IFRAME,
  providers: [
    WALLET_KEYS.CASPER_WALLET,
    WALLET_KEYS.LEDGER,
    WALLET_KEYS.METAMASK_SNAP,
  ],
};

Read more about the CsprClickInitOptions type and the available wallet provider values in the reference.

Sign in

When the user clicks your Sign in or Connect wallet button, call signIn() to open the CSPR.click wallet selector.

clickRef.signIn()

This method returns immediately. Listen for the csprclick:signed_in event to update your application after the user connects an account.

Switch account

Call switchAccount() when the user wants to change to another account. Depending on the selected wallet, this may let the user choose another account in the same wallet or connect through a different provider.

clickRef.switchAccount()

This method returns immediately. Listen for the csprclick:switched_account event to update your session state with the new account.

Disconnect

Call signOut() to close the current CSPR.click session in your application.

clickRef.signOut()

This does not request the connected wallet to disconnect from your site. The next time the user signs in, the wallet may be able to reconnect without asking for permission again.

If you want to remove the wallet connection completely, call disconnect() instead:

clickRef.disconnect()

Listen for csprclick:signed_out and csprclick:disconnected to clear the current account from your application state.