> For the complete documentation index, see [llms.txt](https://v1.etherspot.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://v1.etherspot.io/buidler-react-component/blocks/swaps.md).

# Swaps

## Introduction

The Swaps block allows a user to facilitate asset swaps as part of the BUIDLER component.&#x20;

Users can use assets in their Key Wallet or Smart Wallet to swap assets.&#x20;

![](/files/p2ajJuKJI6b9MaTAgoEI)

Once a user selects their swap pair and amount, they can then choose a swap offer from the list presented.

![](/files/hzPlTw16pmVYqtOmcedj)

Once the user has chosen their offer, they are ready to make the swap.

### Implementation

Copy and paste the code below to get started.

```jsx
import {
  Etherspot,
  TRANSACTION_BLOCK_TYPE,
} from "@etherspot/react-transaction-buidler";

// ...

return (
  <Etherspot
    defaultTransactionBlocks={[{ type: TRANSACTION_BLOCK_TYPE.ASSET_SWAP }]}
  />
);
```
