Setup

This library is compatible with NodeJS, browsers and React-Native applications (NodeJS modules require polyfills for React-Native).
Create a Session​​
1. Initiate your WalletConnect client with the relay server, using your Project ID.
import SignClient from "@walletconnect/sign-client";
​
const signClient = await SignClient.init({
  projectId: "<YOUR_PROJECT_ID>", // Get ProjectID from WalletConnect
  metadata: {
    name: "My DApp",
    description: "My DApp",
    url: "#",
    icons: ["https://raw.githubusercontent.com/tetrixtech/assets/main/icons/PitakaLogo.png"],
  },
});
2. Add listeners for desired SignClient events.
signClient.on("session_event", ({ event }) => {
  // Handle session events, such as "chainChanged", "accountsChanged", etc.
});
​
signClient.on("session_update", ({ topic, params }) => {
  const { namespaces } = params;
  const _session = signClient.session.get(topic);
  // Overwrite the `namespaces` of the existing session with the incoming one.
  const updatedSession = { ..._session, namespaces };
  // Integrate the updated session state into your dapp state.
  onSessionUpdate(updatedSession);
});
​
signClient.on("session_delete", () => {
  // Session was deleted -> reset the dapp state, clean up from user session, etc.
});
3. Connect the application and specify session permissions.
import QRCodeModal from "@walletconnect/qrcode-modal";
​
// ...
​
try {
  const { uri, approval } = await signClient.connect({
    // Optionally: pass a known prior pairing (e.g. from `signClient.core.pairing.getPairings()`) to skip the `uri` step.
    pairingTopic: pairing?.topic,
    // Provide the namespaces and chains (e.g. `eip155` for EVM-based chains) we want to use in this session.
    requiredNamespaces: {
      eip155: {
        methods: [
          "eth_sendTransaction",
          "eth_signTransaction",
          "eth_sign",
          "personal_sign",
          "eth_signTypedData",
        ],
        chains: ["eip155:1"],
        events: ["chainChanged", "accountsChanged"],
      },
    },
  });
​
  // Open QRCode modal if a URI was returned (i.e. we're not connecting an existing pairing).
  if (uri) {
    // Include Desktop Wallets
    QRCodeModal.open(uri, () => {
    // Alternatively you can use this to only use the QRModal
    // QRCodeModal.open(uri, _, { desktopLinks: []});
      console.log("EVENT", "QR Code Modal closed");
    });
  }
​
  // Await session approval from the wallet.
  const session = await approval();
  // Handle the returned session (e.g. update UI to "connected" state).
  await onSessionConnected(session);
} catch (e) {
  console.error(e);
} finally {
  // Close the QRCode modal in case it was open.
  QRCodeModal.close();
}
Typescript
Usage
Last modified 8mo ago
Setup

Create a Session​​

Create a Session
