Reservoir SDK (Typescript)

Reservoir SDK

The Reservoir SDK is the underlying package that ReservoirKit UI uses behind the scenes to execute core functionality (listing, bidding, buying and selling). The Reservoir SDK can be used if you are using another JavaScript framework, executing orders via a Nodejs server or building a custom experience.

If you're using ReservoirKit UI then you're already using the SDK, and you have access to the useReservoirClient hook to retrieve the SDK in a react context and use it. If you aren't using the UI package then you'll need to follow these steps to get the SDK up and running.

Installing Reservoir SDK:

Environment Requirements:

• node 18+
• typescript ^5.0.4 (if using typescript)

yarn add @reservoir0x/reservoir-sdk

The Reservoir SDK also requires viem to be installed, make sure that's added to your package.json if it isn't already.

yarn add viem

ethers support

If your application uses ethers and you're not ready to upgrade to viem yet we offer an ethers adapter package to help bridge the gap. Learn more about adapters here.

Configuring the Reservoir SDK

To configure the SDK we first need to create a global instance of it:

import { createClient, reservoirChains } from "@reservoir0x/reservoir-sdk"

createClient({
  chains: [{
    ...reservoirChains.mainnet,
    active: true,
  }],
  source: "YOUR.SOURCE"
});

We start by importing the createClient function and then call that function to create a global client, passing in the required parameters.

Chain Configuration

Once the client has been created there are 5 core actions available to you:

buyToken
listToken
placeBid
acceptOffer
cancelOrder

Notes

• The SDK can only have a single chain at a time. You can put a new instance of the createClient before a core action if you need to switch chains.
• In the example actions provided throughout this documentation, the wallet client being used is for an injected browser wallet.

Events

The Reservoir SDK also comes with an event system to detect results from the actions above. This can be useful to display a toast message to your users, refresh some data within your application, or track the data. You can find the supported events here. Here's an example of how you would listen to events:

import { getClient } from "@reservoir0x/reservoir-sdk";

getClient()?.addEventListener((event, chainId) => {
  switch (event.name) {
    case 'purchase_error': {
      //Handle the error
      console.log(event.data);
      break;
    }
    case 'purchase_complete': {
      //Handle the success
      console.log(event.data);
      break;
    }
})

👍

Nice!

Now that the Reservoir SDK is up and running lets add sweeping to our javascript application.